/*******************************************
   CSS FILE FOR PROGEAR - LAYOUT STYLES
   COPYRIGHT 2008  gerard@phosphor.co.nz
   *******************************************/
/*
   <body>
       <div id="mainContainer">
           <div id="header">
           ...
           </div>
           <div id="content">
           ...
           </div>
           <div id="footer">
           ...
           </div>
       </div>
   </body>
*/
body {
  background-color: black;
}
#mainContainer {
  width: 902px;
  padding: 0 29px;
  margin: 0px auto;
  background: #4c4d4f;
}
/**********
   HEADER
   
   <div id="header">
       <img class="logo" />
       <ul id="mainNavigation" />
       <form id="search" />
   </div>

   *********/
#header {
  height: 71px;
  background: white;
  overflow: hidden;
  padding: 9px;
  margin: 0 -29px;
}
/* totalWidth 231px */
#header a.logo {
  float: left;
  height: 71px;
  width: 211px;
}
#header a.logo img {
  display: block;
}
/* totalWidth 340px */
#utils {
  float: left;
  height: 65px;
  width: 380px;
  padding: 0 0 0 45px;
}
/*********
   Content
   **********/
#content {
  height: 1%;
  background: #4c4d4f url(/userfiles/images/content-gradient-bg.gif) bottom left repeat-x;
  border-top: solid 1px #333;
  padding: 13px 0 0;
}
#content:after {
  content: ".";
  display: block;
  height: 0;
  overflow: hidden;
  visibility: hidden;
  clear: both;
}
#primaryContent {
  height: 1%;
  float: left;
  width: 703px;
  margin-left: 9px;
}
#primaryContent:after {
  content: ".";
  display: block;
  height: 0;
  overflow: hidden;
  visibility: hidden;
  clear: both;
}
#shopHeader {
  height: 45px;
  padding-top: 15px;
}
/********
   Footer
   *********/
#footer {
  clear: both;
  background: #4c4d4f url(/userfiles/images/footer-gradient-bg.png) 0px 2px repeat-x;
  padding: 10px 21px;
}

