@media screen {
/* reset */
* {margin: 0; padding: 0;}
html, body {height: 100%;}

/* ============== */
/* = Typography = */
/* ============== */

body {color: #153B64; font-size: 75%; line-height: 1.5; background: #FFF; font-family: Helvetica Neue, Arial, Tahoma, Sans-Serif;}
html > body {font-size: 12px;}
p {font-size: 1em; line-height: 1.5em; margin-top: 1.5em; margin-bottom: 1.5em;}
h2 + p {margin-top: 0;}
h2 {font-size: 3.333333em; margin-top: 0; margin-bottom: 0;}
h3 {font-size: 1.333333em; line-height: 1.125em; margin-top: 0.5625em; margin-bottom: 0.5625em;}
  #scroll-container h3 {font-size: 3em; margin: 0;}
h4 {font-size: 1.333333em; line-height: 1.125em; margin-top: 0.5625em; margin-bottom: 0.5625em;}
  h4.highlight {text-align: center; border: 1px solid #153B64; border-left: none; border-right: none; background: #f6f6f6; line-height: 2.5em; font-size: 2em;}
    h4.highlight a:hover {color: #1A4D7F;}

li {font-size: 1em; line-height: 1.5em; margin-top: 0; margin-bottom: 0;}
  li p {font-size: 1em; line-height: 1.5em;}
ul, ol {font-size: 1em; line-height: 1.5em; margin-top: 1.5em; margin-bottom: 1.5em; margin-left: 20px; padding-left: 20px;}

blockquote {padding: 1em;}
  blockquote p, li p {margin-bottom: 0;}
a:link, a:visited, a:hover, a:active {color: #153B64; outline: none;}
dl dl {margin-left: 20px;}
dl li, dd p {font-size: 1em;}

/* ========== */
/* = Layout = */
/* ========== */
body {}
div#wrapper {min-width: 950px; position: relative; height: auto !important; min-height: 100%; height: 100%;}
div#content {padding-bottom: 60px; /* pads the bottom for our sticky footer */}

/* ========== */
/* = Header = */
/* ========== */
div#header {height: 47px; background: #0468FF url('../images/vertical-sprite.png') repeat-x left top; border-bottom: 1px solid #1141EA; border-top: none; margin-bottom: 1em;}
  div#header ul {height: 100%; list-style: none; margin: 0; padding: 0;}
    div#header ul li {height: 100%; float: right; padding: 0; font-size: 1em; color: #EEE;}
      div#header ul li a {height: 100%; line-height: 47px; color: #EEE; padding: 11px 7px;}
      div#header ul li input.link {height: 47px; color: #EEE; padding: 10px 7px;}
      div#header ul li a:hover, ul.tools li input.link:hover {color: #FFF;}
    
      div#header ul li#home {float: left; padding: 0 25px; width: 94px;}
        div#header ul li#home h1.logo a {padding: 0; background: transparent url(../images/main-sprite.png) no-repeat -194px -17px; display: block; width: 94px; height: 47px; text-indent: -9999em;}
  
/* ============= */
/* = Home page = */
/* ============= */
div#main-logo {padding-bottom: 2em; background: #fff; margin-top: -10px;}
  div#main-logo h1.logo {font-size: 4em; margin-bottom: 0; line-height: 1.5em; text-indent: -9999em; text-align: center;}
    div#main-logo h1.logo span {text-decoration: none; color: #333; display: block; width: 456px; height: 244px; background: transparent url(../images/sprixi-logo2.jpg) no-repeat left top; margin: 0 auto;}
p.tagline {cursor: default; text-align: center; font-style: oblique; font-weight: bold; font-size: 2em; letter-spacing: -0.05em; line-height: 1.2em; margin: -0.5em 0 0; color: #094B7A;}
  p.tagline span.highlight {color: #0874B5;}

p.promotion {font-size: 1em; text-align: center; margin: 0; margin-top: 2em; color: #D03C38;}
  p.promotion a {color: #D03C38;}
    p.promotion a:hover {color: #EF4541;}
 
/* ============== */
/* = Navigation = */
/* ============== */
ul#menu {text-align: center; background: #4FA7DD; min-width: 960px; border: 1px solid #153B64; border-left: 0; border-right: 0;}
  ul#menu li {display: inline;}
    ul#menu li a {display: inline-block; line-height: 2em; padding: 0 1em; font-weight: bold; color: #fff; text-decoration: none;}

/* =============== */
/* = Other Pages = */
/* =============== */
div.words {width: 800px; margin: 0 auto; overflow: hidden;}

/* ========== */
/* = Footer = */
/* ========== */
div#footer {background: #103C66 url('../images/vertical-sprite.png') repeat-x 0 -72px; padding: 5px 0; position: absolute; bottom: 0; left: 0; width: 100%; color: #fff; border-top: 1px solid #121141;}
  div#footer ul {overflow: hidden; margin: 0; text-align: center; padding: 0;}
    div#footer ul li {display: inline; font-size: 1em; margin: 0.5em;}
      div#footer ul li a {color: #EEE; padding: 2px 6px;}
        div#footer ul li a:hover {color: #FFF;}
      div#footer ul li a.feedback {background-color: #048F00;}
        div#footer ul li a.feedback:hover {background-color: #099500;}
  div#footer p {color: #EEE; text-align: center; font-size: 0.8em; margin: 0; cursor: default;}
    div#footer p a {color: #EEE; text-decoration: none;}
      div#footer p a:hover {color: #FFF;}
  
/* ===================== */
/* = Float Containment = */
/* ===================== */
/* Things go in here, twice */
div#header, div#header ul, div.panel dl, #meta-bottom, ul.requirements-links, ul.site-meta-information, div.actions, div.actions ol ul.actions, dl#stats {display: inline-block; overflow: hidden;}
div#header, div#header ul, div.panel dl, #meta-bottom, ul.requirements-links, ul.site-meta-information, div.actions, div.actions ol ul.actions, dl#stats {display: block;}

} /* end @media screen */