/* 
  Modular Scale
  ----------------------
  http://modularscale.com/scale/?px1=18&px2=&ra1=1.618&ra2=0
  
  18px @ 1:1.618
  ----------------------*/
* {margin: 0; padding: 0;}
html {font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%;}
body {height: 100%;font-size: 1.125em; line-height: 1.4em; font-weight: normal; font-family: "Georgia", "Times New Roman", serif; color: #181818; background-color: #e7e8e9; background-image: url('./images/background.20111223.gif');}
div.container {margin: 0 auto; padding: 8em 1.777777778em 1em; width:90%; max-width: 56.88888889em; height: 100%;}
h1 {font-size: 6.8589em; font-weight: 900; line-height: 1em; font-family: "proxima-nova-extra-condensed-1", "proxima-nova-extra-condensed-2", "Helvetica Neue", "Helvetica", "Arial", sans-serif; margin: 0; text-transform: uppercase; text-align: center; color: #333; border-bottom: 1px dotted #d3d3d3;}
h2 {font-size: 2.618em; font-weight: 900; line-height: 1.4em; margin: 0.125em 0 0.382em 0.5em; font-family: "proxima-nova-extra-condensed-1", "proxima-nova-extra-condensed-2", "Helvetica Neue", "Helvetica", "Arial", sans-serif; text-transform: uppercase; text-align: center; color: #EA8A00;}
footer p {font-size: 1em; color: #EA8A00; padding-top: 1em; clear: both; text-align: center;}
h3 {font-size: 1em; font-weight: 700;}
p {margin: 0 0 1em 0;}
ul {margin: 1em 0;}
.ie6 ul, .ie7 ul {padding-left: 1em;}
a {color: rgb(104,104,204); text-decoration: none;}
a:hover {color: rgb(155,155,155);}
#iam_list {float: left; width: 45%;}
#youcan_list {float: right; width: 45%}
#logo_image {position: absolute; width: 8.888888889em; height: 8.888888889em; top: 0; left: 50%;}
#logo_image img {position: relative; left: -50%;}
@media screen and (max-width: 48.88888889em) {
  /* Modular Scale
    ----------------------
    http://modularscale.com/scale/?px1=16&px2=&ra1=1.618&ra2=0
    
    16px @ 1:1.618
    ----------------------*/
  body {font-size: 1em;}
  div.container {padding: 8em 1em 1em 1em;}
  h1 {font-size: 4.2358em; margin-left: 0;}
  h2 {font-size: 1.618em; margin-left: 0;}
  #iam_list, #youcan_list {float: none; width: 100%;}
  #logo_image {position: absolute; left: 50%;}
  #logo_image img {position: relative; width: 90%; left: -45%; top: 0.25%}
}
@media screen and (max-width: 26.66666667em) {
    /* Using a different base for small screen display */
    /* Modular Scale 
    ----------------------
    http://modularscale.com/scale/?px1=16&px2=14&ra1=1.618&ra2=0
     
    16px @ 1:1.618	 14px @ 1:1.618	 
    ----------------------*/
    body {margin: auto 1.25em; width: auto; font-size: 1em}
    div.container {width: auto; padding: 6.25em 1em 1em 1em;}
    h1 {font-size:2.291em; font-weight: 800; margin-left: 0;}
    h2 {font-size: 0.875em; font-weight: 800; margin: 0.125em 0 1em 0;}
    footer p{font-size: 0.875em;}
    #logo_image {position: absolute; left: 50%;}
    #logo_image img {position: relative; width: 70%; left: -35%; top: 0.25% }
    
}
