body {
  font-family: arial, helvetica, sans-serif;
  font-size: 1em;
  color: #636370;
  margin: 0;
  padding: 0;
 background-image: url(images/background.jpg);
 z-index20;
}


#readmore {font-family: arial, helvetica, sans-serif; font-size: 1em; color: #1141a0; font-style: normal; text-decoration:none; z-index: 20;
}
#readmore a {font-family: arial, helvetica, sans-serif; font-size: 1em; color: #ffffff; font-style: normal; text-decoration:none; z-index:20;
}
#a.readmore:hover, #a.readmore:active {font-family: arial, helvetica, sans-serif; font-size: 1em; color: #cccccc; font-style: normal; text-decoration:none; z-index:20;
}

#copyright {
  font-family: arial, helvetica, sans-serif;
  font-size: .75em;
  color: #636370;
  text-align:right;
}

#menu {
  margin-top: -17px;
  margin-left: 300px;
  position: relative;
  top: 0px;
  left: -79px;
  background: white;
  font-family: arial;
  font-size: 14px;
  text-decoration:none;
  color: #002487;	
  
}

#menu a:link { text-decoration:none; color: #1141a0;}
#menu a:visited { text-decoration:none; color: #1141a0;}
#menu a:hover { text-decoration:none; color: #d4bf94;}

#submenu {
  margin-top: 0px;
  margin-left: 100px;
  position: relative;
  top: 0px;
  left: -79px;
  background: white;
  font-family: arial;
  font-size: 12px;
  text-decoration:none;
  color: #002487;	
  
}

#submenu a:link { text-decoration:none; color: #1141a0;}
#submenu a:visited { text-decoration:none; color: #1141a0;}
#submenu a:hover { text-decoration:none; color: #d4bf94;}

#secondsubmenu {
  font-size: 12px;
  text-decoration:none;
  color: #002487;	 
}

#secondsubmenu a:link { text-decoration:none; color: #1141a0;}
#secondsubmenu a:visited { text-decoration:none; color: #1141a0;}
#secondsubmenu a:hover { text-decoration:none; color: #d4bf94;}



#bluebox_headers {
font-family: arial, helvetica, sans-serif;
  font-size: 12px;
}


#custom-doc {/* Set the width of the page and center contents. */
  position: static;
  width: 950px;
  margin: 0 auto;
  background: white;
}

/* 
These are the 3 basic content containers.
We set their position and float them to
normalize behavior of relatively 
positioned and floated elements within.
*/
#header {
  width: 950px;
  height: 95px;
  position: static;
  float: left;
  clear: both;
  z-index: 1;
  background: #fff;
}

#body {
  width: 950px;
  height: 625px;
  position: static;
  float: left;
  clear: both;
  z-index: 20;
  background: white;
}

#footer {
  width: 950px;
  position: static;
  float: left;
  clear: both;
  z-index: -8;
  background: white;
}

#footer-index {
position: relative;
width: 300px;
font-size: 9px;
top: 1px;
left:200px;
z-index: 300;
font-family: arial;

}



/*
These are the major layout grids found 
within the #body div section.
*/
#sidebar-left {
  background: #D4Bf94;
   background-image: url(images/tanbg.png);
  width: 215px;
  height: 625px;
  position: static;
  float: left;
  clear: left;
  overflow: hidden;
}



#main-content { /* Holds all of the content except the left sidebar. */
  width: 720px;
  margin: 0 0 10px 8px;
  float: left;
    z-index: 20;
  overflow: hidden;
}


/* #header */
img.logo {
  margin-top: 5px;
  margin-left: 5px;
}

/* #main-content */
#flash-topper { /* Contains flash movie at top of page. */
z-index: -600;
}
div.lower-blocks {
  font-size: 12px;
  line-height: 1.3em;

  width: 720px;
  margin: 10px 5px 10px 1px;
  float: left;
  overflow: hidden;
}


#content-topper { /* Contains the content block for 2ndary pages..identical to the flash but. it has to be a separate div so please leave  Kingbury Rocks the house! Notice I'm using the same width set in the dummy flash mock up..It has to be the smae or the integrity of the inside pages would fall apart*/
width: 718px;
height: 300px;
position:relative;
margin: 0 auto;
z-index: -600;

}


#2ndpage_headers {
  font-size: 11px;
  padding: 12px 10px;
  overflow: hidden;
  color: #fff;

}

#content {
  padding: 12px 10px;
  width: 400px;
  height: 0 auto;
    float: left;
  overflow: hidden;
  font-size:12px;
    z-index: 20;
}


#page_headers {
position:relative;
top: 5px;
 font-size: 25px;
 color:#002487;
 background:#8fd8fb;

 }



#image {
position: absolute;
left: 430px;
top: 90px;
width: 245px;
height: 252px;
border: 2px solid #d4be94;

}



div.lower-blocks .block {
  width: 235px;
  margin-right: 7px;
        z-index: 500;
}
div.lower-blocks .block-content {
  padding: 12px 5px 5px 7px;    z-index: 500;
}
/* Read more... link */
div.lower-blocks .block-content .readmore {
  margin-top: 5px;    z-index: 990;
}

div.lower-blocks .last {
  margin-right: -7px;/* Ronnie, This is weird, but it works. Please keep */
  height: 300px;
  width: 237px;
 background-image: url(images/background2.jpg);
    z-index: 0;
}

img#exploded-bearing { 
position:absolute;
  margin: -20px 0px 0px -10px;
  position: absolute;
  z-index:900;
}

#bearing_product {
  position: absolute;
z-index:900;

}

/* Blocks */
div.block {

}
div.block h2 {
  color: white;
  font-size: 15px;
  text-align: center;
  line-height: 25px;
  background: #53BFFF;
  font-weight: bold;
  padding: 0;
  margin: 0;
     z-index:204;
}

div.block-one-third {
position:relative;
  float: left;
   height:300px;
   width: 237px;
      z-index:205;
   background-image: url(images/background2.jpg);

   
}
div.block p {
  margin: 0;
  padding: 0;
  margin-bottom: 15px;
   z-index:205;
}

#sidebar-menu {
 height: 285px;
 background: #002487;
 
}
#sidebar-menu ul {
  font-size: 14px;
  margin: 0;
  margin-left: 20px;
  padding: 0;
  padding-top: 10px;
  font-weight: 400;
}
#sidebar-menu li {
  list-style: none;
  padding: 2px;
  letter-spacing: .75px;
}
#sidebar-menu li.spacer {
  line-height: 5px;

}

#sidebar-menu a:link {color: #ffffff; text-decoration:  none;
}   
#sidebar-menu a:visited {color: #ffffff; text-decoration:  none;
}   
#sidebar-menu a:hover {color: #d4bf94}  
#sidebar-menu a:active {color: #ffffff}   



#small-sidebar {
  color: white;
  font-size: 12px;
  font-weight: light;
   letter-spacing: .75px;
  }

#messinger {
  font-size: 11px;
  padding: 12px 10px;
  overflow: hidden;
  color: #fff;
}

#messinger a:link {color: white; text-decoration:  none;} 
#messinger a:visited {color: white; text-decoration:  none;} 
#messinger a:hover {color: #002487; text-decoration:  none;}  

#messinger h2 {
  font-size: 18px;
  color: white;
  padding: 0;
  margin: 0;
  margin-bottom: 4px;
}

#messinger h2 a:link {color: white; text-decoration:  none;}    
#messinger h2 a:visited {color: white; text-decoration:  none;} 
#messinger h2 a:hover {color: #002487; text-decoration:  none;}   



#messinger p {
  line-height: 1.2em;
  padding: 0;
  margin: 0;
    z-index: 20;
}
#messinger #messinger-bearing {
  margin-left: -15px;
}
div.dashed {
  border: none;
  border-bottom: 1px dashed #ccc;
  margin: 16px 0;
}
div.dashed hr {
  display:none;
}
div.wrapper { /* For wrapping things on the fly. */
  float: left;
  clear: both;
  position: static;
}
