/* RESET */
* {
  margin: 0;
  padding: 0;
  border: 0;
  outline: none;
  font-size: 1em;
  font-weight: normal;
  text-align: left;
  line-height: 1;
  font-family: "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif; }

/* LAYOUT */
body {
  background: #340A20 url('/images/layout/body-bg.jpg') top left repeat-x;
  font-size: 80%; }

#main-wrap {
  width: 900px;
  margin: 50px auto 0 auto;
  position: relative; }

#freerange-logo,
#main-nav {
  height: 18px; }

#freerange-logo {
  width: 321px;
  margin-bottom: 6px;
  margin-left: -23px;
  float: left;
  position: relative; }
  #freerange-logo a {
    text-decoration: none;
    width: 100%;
    height: 100%;
    display: block; }
    #freerange-logo a span {
      background: url('/images/logo.gif') top left no-repeat;
      position: absolute;
      width: 100%;
      height: 100%;
      z-index: 2;
      top: 0;
      left: 0;
      cursor: pointer; }

#footer {
  font-size: 0.85em;
  padding-top: 0.8em;
  width: 100%;
  height: 3em;
  display: block;
  clear: both; }
  #footer h1 {
    position: absolute;
    left: -1000em; }
  #footer p {
    margin-right: 1.5em;
    float: left; }
  #footer * {
    color: #79164d; }

/* NAVIGATION */
#main-nav {
  float: right;
  position: relative;
  right: 0;
  top: 2px; }
  #main-nav li {
    list-style-type: none;
    margin-left: 7px;
    height: 100%;
    float: left;
    font-size: 1.5em; }
    #main-nav li a {
      color: #79164D;
      text-decoration: none;
      text-transform: uppercase;
      padding-top: 10px;
      font-family: "le-havre-1","le-havre-2", "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif; }
      #main-nav li a.hover, #main-nav li a.current {
        color: #ee8230; }

/* TEXT STYLES */
#pages h1,
#pages h2,
#pages h3 {
  font-weight: normal;
  text-transform: uppercase;
  color: #280519;
  font-family: "alpha-echo-1","alpha-echo-2","Helvetica Neue", Helvetica, Arial, Verdana, sans-serif; }
#pages h1 {
  font-size: 3em;
  line-height: 0.9;
  letter-spacing: -0.05em;
  margin-top: 45px;
  margin-bottom: 0.2em; }
#pages h2 {
  font-size: 1.8em;
  margin-bottom: 0.4em;
  font-family: "le-havre-1","le-havre-2", "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif; }
#pages h3 {
  font-size: 1.4em;
  margin: 0.4em 0 0.2em;
  font-family: "le-havre-1","le-havre-2", "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif; }
#pages p {
  line-height: 1.3;
  margin-bottom: 1.1em; }
#pages form,
#pages img {
  margin-bottom: 1.4em; }
#pages ul {
  padding-left: 1.5em;
  margin-bottom: 1em; }
#pages li {
  margin-bottom: 0.4em; }
#pages a {
  color: #820042; }
  #pages a:hover {
    color: #79164d; }
  #pages a:visited {
    color: #333333; }

/* PAGES */
#pages {
  background: #FF6600;
  width: 100%;
  min-height: 500px;
  float: left;
  position: relative;
  border: 1px solid #ee8230; }

#pages-panel {
  width: 100%;
  height: 100%;
  position: absolute; }

.page {
  background: url('/images/layout/demo-bg.jpg') no-repeat;
  padding: 0 132px 0 392px;
  width: 376px;
  min-height: 500px;
  float: left;
  display: block;
  overflow: visible;
  position: relative; }

.pending {
  background-image: url(/images/layout/pending-bg.jpg) !important;
  background-color: #FF6600; }

/* HOME PAGE */
#home-page {
  background-image: url('/images/layout/home-bg.jpg'); }
  #home-page h1 {
    font-size: 4em;
    text-align: right;
    margin-top: 95px;
    width: 330px;
    position: absolute;
    left: 20px;
    top: 0; }
  #home-page #intro {
    margin-top: 95px; }
  #home-page p {
    font-size: 1.2em; }
  #home-page #portfolio-link,
  #home-page form {
    border-top: 1px solid #CA6500;
    padding: 0.6em 0 0 0;
    width: 100%;
    float: left; }
  #home-page #portfolio-link a {
    font-size: 1.2em;
    text-decoration: none;
    color: #280218 !important;
    padding: 0.5em 0 0.5em 0;
    display: block; }
    #home-page #portfolio-link a:hover {
      color: #79164d !important; }
  #home-page form h2 {
    font-size: 1.4em;
    margin: 0.3em 0;
    text-transform: none; }
  #home-page label,
  #home-page input,
  #home-page button {
    margin-bottom: 0.6em;
    float: left; }
  #home-page label {
    font-weight: normal;
    padding: 1px 0;
    margin: 0.5em 0;
    width: 4em;
    clear: left; }
  #home-page input {
    border: 1px solid #CA6500;
    background: left top repeat-x url(/images/layout/input-bg.gif);
    padding: 0.5em 0.5em;
    width: 16.5em;
    clear: right; }
  #home-page button {
    background: left top no-repeat url(/images/home/subscribe.gif);
    width: 111px;
    height: 33px;
    margin-left: 4em;
    clear: both;
    cursor: pointer;
    letter-spacing: -1000em;
    text-indent: -1000em; }

/* ABOUT */
#about-page {
  background-image: url('/images/layout/services-bg.jpg'); }
  #about-page h1 {
    font-size: 4em;
    text-align: right;
    margin-top: 90px;
    width: 330px;
    position: absolute;
    left: 20px;
    top: 0; }
  #about-page h3#intro {
    margin-top: 95px; }

/* SERVICES */
#services-page {
  background-image: url('/images/layout/services-bg.jpg'); }
  #services-page h1 {
    font-size: 4em;
    text-align: right;
    margin-top: 90px;
    width: 330px;
    position: absolute;
    left: 20px;
    top: 0; }
  #services-page h3#intro {
    margin-top: 95px; }

#services-list {
  padding: 0 !important; }
  #services-list li {
    list-style-type: none;
    font-size: 2em; }

/* PORTFOLIO */
#portfolio-page {
  background-image: url('/images/layout/folio-bg.jpg'); }
  #portfolio-page #page-title {
    /* Hide this H1 entirely. We want it in the page for semantics, but don’t need */
    /* it in the actual layout. */
    position: absolute;
    left: -1000em; }
  #portfolio-page p.credit {
    font-size: 80%;
    margin-top: -10px; }

#portfolio-nav {
  padding: 0;
  width: 330px;
  position: absolute;
  top: 70px;
  left: 0px; }
  #portfolio-nav li {
    list-style-type: none;
    margin-bottom: 0; }
  #portfolio-nav a, #portfolio-nav a:visited {
    display: block;
    width: 100%;
    color: #280519;
    font-size: 3.5em;
    font-weight: bold;
    text-decoration: none;
    text-transform: uppercase;
    text-align: right;
    white-space: nowrap;
    letter-spacing: -0.05em;
    line-height: 0.9;
    font-family: "alpha-echo-1","alpha-echo-2","Helvetica Neue", Helvetica, Arial, Verdana, sans-serif; }
  #portfolio-nav a.current,
  #portfolio-nav a.hover:hover {
    color: #79164d !important; }

#portfolio-entries {
  width: 376px;
  height: 100%;
  overflow: visible;
  position: absolute;
  top: 0px;
  right: 132px; }
  #portfolio-entries #portfolio-slider {
    width: 100%;
    height: auto;
    overflow: visible;
    position: absolute; }

#portfolio-page h2 {
  margin-top: 45px; }
#portfolio-page .entry {
  width: 100%;
  float: left;
  clear: both; }
#portfolio-page .link-out a {
  background: #260516;
  color: #F80 !important;
  font-size: 1.2em;
  font-weight: bold;
  text-decoration: none;
  padding: 0.15em 0.5em 0.25em 0.5em; }
  #portfolio-page .link-out a:hover {
    background: #79164d; }

#more-examples {
  padding: 0 !important;
  width: 100%;
  float: left; }
  #more-examples li {
    list-style-type: none;
    margin: 0 0 11px 11px;
    width: 118px;
    height: 80px;
    float: left; }
  #more-examples .start {
    margin-left: 0; }
  #more-examples a {
    width: 100%;
    height: 100%;
    display: block; }

/* CAREERS PAGE */
#careers-page {
  background-image: url('/images/layout/careers-bg.jpg'); }
  #careers-page h1 {
    font-size: 4em;
    text-align: right;
    margin-top: 90px;
    width: 330px;
    position: absolute;
    left: 20px;
    top: 0; }
  #careers-page p#intro {
    margin-top: 95px; }
  #careers-page ul {
    list-style-type: none;
    padding-left: 0 !important; }

/* CONTACT PAGE */
#contact-page {
  background-image: url('/images/layout/contact-bg.jpg'); }
  #contact-page h1 {
    position: absolute;
    left: -1000em; }
  #contact-page h2,
  #contact-page #blurb {
    width: 330px;
    position: absolute;
    left: 20px;
    margin-top: 45px;
    text-align: right; }
  #contact-page h2 {
    font-size: 2.5em;
    top: 0;
    letter-spacing: 0;
    font-family: "alpha-echo-1","alpha-echo-2","Helvetica Neue", Helvetica, Arial, Verdana, sans-serif; }
  #contact-page #blurb {
    top: 9em; }
  #contact-page p,
  #contact-page ul,
  #contact-page dl {
    font-size: 1.4em; }
  #contact-page ul,
  #contact-page dl {
    border-top: 1px solid #CA6500;
    padding-top: 0.8em !important;
    width: 100%;
    float: left; }
  #contact-page ul {
    padding: 0;
    margin: 45px 0 2em 0; }
  #contact-page li {
    list-style-type: none; }
  #contact-page li a,
  #contact-page li a:visited {
    background: left center no-repeat;
    color: #280519;
    text-decoration: none;
    font-weight: normal;
    padding: 0.5em 0 0.5em 65px;
    display: block; }
  #contact-page #google-maps {
    background-image: url(/images/contact/google-maps.gif); }
  #contact-page #download-vcf {
    background-image: url(/images/contact/vcf-card.gif); }
  #contact-page dt,
  #contact-page dd {
    margin-bottom: 1em;
    float: left; }
  #contact-page dt {
    color: #603102;
    width: 70px;
    clear: left; }
  #contact-page dd {
    width: 300px;
    clear: right; }

/* JAVASCRIPT SPECIFIC OVERRIDES */
.javascript-enabled #pages {
  height: 500px;
  overflow: hidden; }
.javascript-enabled #portfolio-page {
  height: 100%; }

/* LOADING DISPLAY */
#loading-overlay,
#loading-display {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0; }

#loading-overlay {
  background: #1A0411;
  z-index: 100; }

#loading-display {
  background: center center no-repeat url(/images/layout/loading-animation.gif);
  z-index: 101; }

/* IE FIXES */
.ie-fixer {
  width: 0;
  height: 0;
  overflow: hidden;
  width: 100%;
  clear: both; }

.internet-explorer #contact-page dd {
  float: none; }