@import url("print.css") print;
/* Common stuff */
body {
  background: #56afe7 url("../img/page_gradient.jpg") repeat-x;
  color: #ffffff;
  font-family: Verdana, Bitstream Vera Sans, sans-serif;
  font-size-adjust: 0.55;
  font-size: 11px;
}
body, #header h1, #header h2, #nav h3, #manualcontent h3.header, #manualcontent h4.header, #nav p, form {
  margin: 0;
  padding: 0;
}
label, img { 
  display: block;
}
#manualcontent label, #manualcontent img {
  display: inline;
}
#manualcontent td { /* IE doesn't inherit into tables. Le Sigh. */
  color: #333333;
  background-color: inherit;
  font-family: Verdana, Bitstream Vera Sans, sans-serif;
  font-size: 11px;
}
:link img, :visited img {
  border: 0;
}
:link, :visited {
  text-decoration: none;
}

/* Set up the main structure */
#header {
  width: 761px;
  margin: 30px auto 0 auto;
  color: #333333;
  background-color: #ffffff;
  background-image: url("../img/page_header_bg.gif");
  background-repeat: no-repeat;
}
#main {
  width: 761px;
  margin: 0 auto 0 auto;
  color: #333333;
  background-color: #ffffff;
  background-image: url("../img/page_main_bg.gif");
  background-repeat: no-repeat;
  background-position: bottom;
}
#nav {
  width: 188px; /* 188 + 10 = 201 - 3; those 3 missing pixels are to work around IE's 3pixel jog next to floats. There would never be any content in that space anyway, so this is more efficient and less prone to error than the various common CSS hacks (which often mess up other things along the road) */
  margin-left: 10px;
}
#content {
  float: right;
  padding-top: 8px;
  padding-right: 29px;
  width: 528px;
}
#manualcontent {
  float: right;
  width: 499px;
  color: #333333;
  background-color: inherit;
}
#main .stretcher {
  clear: both;
  height: 10px;
  font-size: 10px;
  content: " ";
}
#footer {
  width: 761px;
  margin: 21px auto 0 auto;
  padding-bottom: 30px;
  font-size: 10px;
  text-align: center;
}

/* Fill in the main structure */
#header  .container {
  float: right;
  width: 551px;
  padding-top: 10px;
}
#header #title {
  height: 54px;
  width: 540px;
  color: #ffffff;
  background: #0c2577 url("../img/page_header_title_rightcorner.gif") no-repeat top right;
}
#header #title h2 {
  float: left;
  height: 54px;
  padding-left: 23px;
  background-image: url("../img/page_header_title_leftcorner.gif");
  background-repeat: no-repeat;
  background-position: top left;
}
#header #title .nav {
  margin-left: 420px;
  padding-top: 29px;
  font-size: 9px;
}
#header #title .nav :link, #header #title .nav :visited, #header #title .nav img {
  display: inline;
  color: white;
  background-color: inherit;
}
#header #title .nav img {
  margin: 0 3px 0 0;
}
#header #crumbs {
  float: right;
  width: 528px;
  font-family: Arial, Bitstram Vera Sans, sans-serif;
  font-size-adjust: 0.53;
  font-size: 11px;
  padding-top: 8px;
  padding-bottom: 8px;
  background-image: url("../img/page_header_crumbs_bg.gif");
  background-repeat: no-repeat;
  background-position: left bottom;
}
#header #crumbs .label {
  font-weight: bold;
}
#header #crumbs :link, #header #crumbs :visited {
  color: #333333;
  background-color: inherit;
}
#header #crumbs :link:hover, #header #crumbs :visited:hover {
  color: #01a4b5;
  background-color: inherit;
}
#header #crumbs .current {
  color: #003366;
  background-color: inherit;
  font-weight: bold;
}
#header #functions {
  float: right;
  padding: 5px 15px 0 393px;
  text-align: right;
}
#header #logo {
  width: 184px; /* 184 + 14 = 201 - 3; those 3 missing pixels are to work around IE's 3pixel jog next to floats. There would never be any content in that space anyway, so this is more efficient and less prone to error than the various common CSS hacks (which often mess up other things along the road) */
  margin-left: 14px;
  padding-top: 11px;
  padding-bottom: 13px;
  font-size: 1em;
}
/* Mac IE messes up because #functions flows outside the #header while #logo doesn't. \*//*/
* html #header #logo {
  padding-bottom: 32px;
}
/* */
#manualcontent :link, #manualcontent :visited, #header #functions :link, #header #functions :visited {
  color: #01a4b5;
  background-color: inherit;
}
#manualcontent :link:hover, #manualcontent :visited:hover, #header #functions :link:hover, #header #functions :visited:hover {
  color: #067ac5;
  background-color: inherit;
  text-decoration: underline;
}
#manualcontent ul {
  list-style-type: disc;
}
#nav :link, #nav :visited {
  display: block;
  width: 181px;
  height: 31px;
  margin-top: 5px;
  /* Image rollovers don't work in Mac IE, so don't bother with the backgrounds. \*/
  overflow: hidden;
  background-repeat: no-repeat;
  /* */
}
#nav :link:hover, #nav :visited:hover {
  background-position: 0 -31px;
}
/* Image rollovers don't work in Mac IE, so don't hide the static buttons. \*/
#nav :link img, #nav :visited img {
  visibility: hidden;
}
#nav .b1:link, #nav .b1:visited {
  margin-top: 0;
  background-image: url("../img/page_nav_home.gif");
}
#nav .b2:link, #nav .b2:visited {
  background-image: url("../img/page_nav_aboutus.gif");
}

#nav .b3:link, #nav .b3:visited {
  background-image: url("../img/page_nav_community.gif");
}
  
#nav .b4:link, #nav .b4:visited {
  background-image: url("../img/page_nav_whatishair.gif");
}
#nav .b5:link, #nav .b5:visited {
  background-image: url("../img/page_nav_whatsnew.gif");
}
#nav .b6:link, #nav .b6:visited {
  background-image: url("../img/page_nav_latestoffers.gif");
}
#nav .b7:link, #nav .b7:visited {
  background-image: url("../img/page_nav_productguide.gif");
}
#nav .b8:link, #nav .b8:visited {
  background-image: url("../img/page_nav_stylinghints.gif");
}
#nav .b9:link, #nav .b9:visited {
  background-image: url("../img/page_nav_funstuff.gif");
}
#nav .b10:link, #nav .b10:visited {
  background-image: url("../img/page_nav_links.gif");
}
/* */
#nav .wrapper {
  display: none;
}
#nav ul, #nav li {
  margin: 0;
  padding: 0;
  list-style: none;
}
#nav li :link, #nav li :visited {
  padding-left: 9px;
  height: 13px;
  color: #ffffff;
  background-color: inherit;
  font-size: 11px;
}
#nav li :link:hover, #nav li :visited:hover, #nav li :link:active, #nav li :visited:active {
  color: #0c2577;
  background-color: inherit;
}
#nav .level0 {
  width: 181px;
  padding: 5px 0 20px 0;
  color: #ffffff;
  background: #01a4b5 url("../img/page_nav_expanded_bg.gif") no-repeat left bottom;
}
#nav .level0 ul {
  margin-left: 9px;
}
#nav .level1:link, #nav .level1:visited {
  font-weight: bold;
}
#nav #subscribe {
  margin-top: 10px;
}
#nav #subscribe p {
  width: 160px;
  margin-top: 8px;
  margin-left: 9px;
  color: #0c2577;
  background-color: inherit;
  font-size: 11px;
}
#nav #subscribe #emtext {
  width: 160px;
  margin-top: 6px;
  margin-left: 9px;
  border-width: 1px;
  border-color: #0c2577;
  border-style: solid;
  color: #0c2577;
  background-color: white;
}
#nav #subscribe #subutton {
  margin-top: 10px;
  margin-left: 67px;
}
#footer :link, #footer :visited {
  color: #ffffff;
  background-color: inherit;
}

/* IE 5.x hack to have width actually act as width rather than as min-width. Don't bother decent browsers with this. */
* html #nav .level0 {
  overflow: hidden;
}
/* IE 5.x hack to have margin and padding applied to lists. Don't bother decent browsers with this. */
* html #nav .level0 ul {
  float: left;
  margin-left: 4px;
}
/* IE 5.x hack to reposition the content of the list to where it belongs. Don't bother decent browsers with this. 
   This rule wouldn't have been necessary with float: left set on li rather than ul in the next hack, but then expanding 
     made the entire list go on walkabout, which is even less desirable. */
* html #nav .level1 {
  position: relative;
  left: -14px;
  /* Don't bother IE6, as it does all this mostly right. */
  pos\ition: static;
  lef\t: 0;
}
/* IE 5.x centering hack. Don't bother decent browsers with this. */
* html body {
  text-align: center;
}
* html #header, * html #main {
  text-align: left;
}
