@import url('reset.css');
@import url('typography.css');
body { background-color:#f8f8f8;
      margin:auto;
      width:100%; }
	  
div#status-bar { background: url(../img/status-bar-bg.png) repeat-x;
        border-bottom: 2px groove#808080;
		position:absolute;
		left: 0;
		top: 0;
        height: 40px;
        width: 100%; }	  
		
div#status-bar-content { margin: auto;
		                 width: 700px;
						 padding-top: 10px;  }		
		
div#welcome{ float:left;
             width: 500px; }
		   
div#clock{ float: right; }		   
	   
div#header { background:url(../img/top.jpg) no-repeat center;
             border-bottom: 2px ridge #808080;
             height: 250px;
             width: 100%; }

div#nambe { margin:auto; 
	       padding-top: 25px;
		   text-align: right;
	       width: 800px; }			 

div#logo { margin:auto; 
		   padding-right: 150px;
		   padding-top: 15px;
		   text-align: center; 
	       width: 700px; }
		  
div#content { margin: auto;
              margin-top: 35px;
              padding-bottom: 55px;
              position: relative;
              width: 800px; }

div#content-top-shadow {background: url('../img/content-top-shadow.png') repeat-x;
                        height: 20px;
                        width: 100%; }

div#content-bottom-shadow { background: url('../img/content-bottom-shadow.png') repeat-x;
                            clear: both;
                            height: 20px;
                            width: 100%; }
							
div#page-top{ background-color: #ffffff;
			  border-bottom: 1px solid #bababa;
			  border-top: 1px solid #bababa;
			  border-left: 1px solid #bababa;
		      border-right: 1px solid #bababa;
              clear: both;
              overflow: hidden;
              padding: 15px;
			  margin-top: 50px;
              height: 400px;
			  text-align: center; }         			   
				
div#page-top h3 { margin-bottom: 20px; }

div#year { margin: auto;
		  margin-top: 100px;
          width: 550px;}
		   
span#newyear { background: url('../img/newyear.png') no-repeat 0px 0px;
               float: left;
			   height: 90px;
               padding-left: 550px; }
						
span#starter { background: url('../img/starter.png') no-repeat 0px 0px;
               float: left;
			   height: 96px;
               padding-left: 128px;}
			   
span#alternator { background: url('../img/alternator.png') no-repeat 0px 0px;
               float: right ;
			   height: 96px;
               padding-left: 128px;}			   
 
div#footer-image { background: url('../img/footer-image.jpg') no-repeat center;
                   border-top: 2px groove #808080;
                   border-bottom:2px ridge #808080;
                   height:50px;
                   width:100%; }
		  
p#footer-text { background: url('../img/content-top-shadow.png') repeat-x;
                height: 37px;
                padding-top: 13px;
                width: 100%;}
                   
ul#tabs { margin-top: 30px;
          position: absolute;
          right: 0px;
          top: -65px; }
          
ul#tabsbot { margin-top: 30px;
             position: absolute;
             right: 0px;
             top: 400px; }
          

ul#tabs li { background: url('../img/tabs-sprite.png') no-repeat;
             float: left;
             height: 35px;
             margin-right: 1px;
             width: 100px; }
             
ul#tabsbot li { background: url('../img/tabsbot-sprite.png') no-repeat;
             float: left;
             height: 35px;
             margin-right: 1px;
             width: 100px; }
             

ul#tabs li a, ul#tabsbot li a { display: block;
               height: 100%;
               text-indent: -9000px;
               width: 100%; }

ul#tabs li#home, ul#tabsbot li#home { background-position: 0px 0px; }

ul#tabs li#home:hover, ul#tabsbot li#home:hover { background-position: 0px -40px;}

ul#tabs li#home:active, ul#tabsbot li#home:active { background-position: 0px -78px;}
 

ul#tabs li#contact, ul#tabsbot li#contact { background-position: -100px 0px;}

ul#tabs li#contact:hover, ul#tabsbot li#contact:hover { background-position: -100px -40px;}

ul#tabs li#contact:active, ul#tabsbot li#contact:active { background-position: -100px -78px;}
 
 
ul#tabs li#about, ul#tabsbot li#about { background-position: -200px 0px;}

ul#tabs li#about:hover, ul#tabsbot li#about:hover { background-position: -200px -40px;}

ul#tabs li#about:active, ul#tabsbot li#about:active { background-position: -200px -78px;}
 

ul#tabs li#inform, ul#tabsbot li#inform { background-position: -300px 0px;}

ul#tabs li#inform:hover, ul#tabsbot li#inform:hover { background-position: -300px -40px;}

ul#tabs li#inform:active, ul#tabsbot li#inform:active { background-position: -300px -78px;}
 

ul#tabs li#previous, ul#tabsbot li#previous { background-position: -400px 0px; }
                       
ul#tabs li#previous:hover, ul#tabsbot li#previous:hover { background-position: -400px -40px; }

ul#tabs li#previous:active, ul#tabs li#previous:active { background-position: -400px -78px; }