/* Goodtimes Bicycles */

* { margin:0; padding:0; }
html { height: 100%; }
body { 
  background:#fff;
  color: #666; 
  font-family: Helvetica, Arial, Sans-Serif; 
  font-size: 11px;
  padding: 26px 0;
  }
img { border:0; }
p { line-height: 14px; margin-bottom: 10px; }

#container { 
  margin: 00 auto;
  width: 1000px;
  }

#header {
  border-bottom: 1px solid #ccc; 
  height: 40px; 
  }
  
#nav {
  margin-bottom:20px;
  padding: 10px 0; 
  }
  
  #nav a { display: block; float: left; }
    
  a#about {
    background: url("../images/about.gif") top left;
    height: 18px;
    width: 66px;
  }
  
  a#about:hover, a#about.selected { background-position: top right;}
  
  a#bikes {
    background: url("../images/bikes.gif") top left;
    height: 18px;
    width: 61px;
  }
  
  a#bikes:hover, a#bikes.selected { background-position: top right;}
  
  a#frames {
    background: url("../images/frames.gif") top left;
    height: 18px;
    width: 79px;
  }
  
  a#frames:hover, a#frames.selected { background-position: top right;}
  
  a#bits {
    background: url("../images/bits.gif") top left;
    height: 18px;
    width: 50px;
  }
  
  a#bits:hover, a#bits.selected { background-position: top right;}
  
  a#goods {
    background: url("../images/goods.gif") top left;
    height: 18px;
    width: 101px;
  }

  a#goods:hover, a#goods.selected { background-position: top right;}
  
  a#links {
    background: url("../images/links.gif") top left;
    height: 18px;
    width: 60px;
  }
  
  a#links:hover, a#links.selected { background-position: top right; }

  a#contact {
    background: url("../images/contact.gif") top left;
    height: 18px;
    width: 86px;
  }
  
  a#contact:hover, a#contact.selected { background-position: top right; }
  
#sub-nav a { display: block; }
  
  a#johnbuilds {
    background: url("../images/johnbuilds.gif") top left;
    height: 25px;
    width: 200px;
    }
    
  a#johnbuilds:hover, a#johnbuilds.selected { background-position: top right; }

  a#shots {
    background: url("../images/shots.gif") top left;
    height: 25px;
    width: 200px;
  }
  
  a#shots:hover, a#shots.selected { background-position: top right; }
  
  a#cross {
    background: url("../images/cross.gif") top left;
    height: 25px;
    width: 160px;
  }
  
  a#cross:hover, a#cross.selected { background-position: top 161px;}

  a#road {
    background: url("../images/road.gif") top left;
    height: 25px;
    width: 160px;
  }

  a#road:hover, a#road.selected { background-position: top 161px; }

  a#city {
    background: url("../images/city.gif") top left;
    height: 25px;
    width: 160px;
  }

  a#city:hover, a#city.selected { background-position: top 161px; }

#footer {
  color: #999; 
  font-size: 10px;
  margin: 12px; 
  }

/* typography */
h1 {
  color: #999; 
  font-size: 2.5em; 
  font-weight: normal;
  margin-bottom: 15px;
  }

h2 {
  color: #999; 
  font-size: 1.5em;
  font-weight: normal; 
  }
  
a, a:active, a:visited {
  color: #999;
  text-decoration: none;
  }

a:hover {
  color: #333;
  }

/* classes */
.floatleft { float: left; }
.floatright { float: right; }
.aligncenter { text-align: center; }
.alignleft { text-align: left; }
.alignright { text-align: right; }
.clearboth { clear: both; }
.no-margin { margin: 0px;}
