/* @override http://www.westerntruckparts.com/_css/styles.css */

/* Site: Western Truck Parts */

/* =RESET MARGINS & PADDING
---------------------------------------------------------------------
*/

html, body, div, span,
p, blockquote, pre, code,
ul, ol, li,
h1, h2, h3, h4, h5, h6,
form, fieldset, legend, label, input, textarea,
table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
}

:focus {
  outline: none;
}

img {
  border: 0;
  margin: 0;
  padding: 0;
}

hr{
   display: none;
}

/* =RESET TYPOGRAPHY
---------------------------------------------------------------------
*/

body {
  font-family: Arial, Helvetica, sans-serif; /* web safe fonts */
  font-size: 62.5%;  /* Rest font to a 10px baseline */
  font-weight: normal;
  line-height: 140%;   
  background: #211d1a url(/_img/bg_body.jpg) no-repeat center top;
  color: #837c73;
}

h1, h2, h3, h4, h5, h6{
   font-family: Times;
}
h1 {
  font-size: 2.5em;
  font-weight: normal;
}

h2 {
  font-size: 2.0em;
  font-weight: bold;
  line-height: 1.4;
  color: #bb4004;
}

h3 {
  font-size: 1.7em;
  line-height: 1.4;
  font-weight: bold;
}

h4 {
  font-size: 1.4em;
  font-weight: bold;
}

h5 {
  font-size: 1.2em;
  font-weight: bold;
}

h6 {
  font-size: 0.8em;
  font-weight: bold;
}

/* =DEFAULT LINKS
---------------------------------------------------------------------
*/

a:link,
a:visited {
  margin: 0;
  padding: 0;
  text-decoration: none;
  overflow: hidden;
  color: #e4701e;
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}

a.read-more{
   font-weight: bold;
}

/* =Helper Classes
---------------------------------------------------------------------
*/

#skip{
   position: absolute;
   list-style: none;
   display: block;
   height: 0;
   overflow: hidden;
}

/* the clearfix rules make it possible to clear floated elements without additional structural markup. See http://www.positioniseverything.net/easyclearing.html */

.clearfix:after {
   content: "."; 
   display: block; 
   height: 0; 
   clear: both; 
   visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

/* =Header
---------------------------------------------------------------------
*/

#header{
   height: 238px;
   background: url(/_img/bg_header.jpg) no-repeat left top;
   position: relative;
}

#header h1{
   width: 230px;
   float: left;
}

#header h1 a{
   display: block;
   width: 230px;
   height: 198px;
   background: url(/_img/bg_h1.jpg);
   text-indent: -9999px;
}

#header #subscribe{
   float: right;
   width: 250px;
   height: 100px;
   background: url(/_img/bg_subscribe.gif);
   margin: 30px 10px 0 0;
}

#subscribe #newsletter fieldset{
   margin: 70px 0 0 10px;
   width: 250px;}

#subscribe #newsletter input#newsletter_text{
   display: inline;
   float: left;
   width: 188px;
   height: 14px;
   padding: 3px;
   border: none;
   background: transparent url(/_img/bg_subscribe_email-box.gif) no-repeat left top;
   color: #797979;
   font-size: 1.1em;
   margin-right: 3px;
}

/* =Navigation
---------------------------------------------------------------------
*/

#nav{
   position: absolute;
   bottom: 0;
   left: 0;
   list-style: none;
   width: 975px;
   background: url(/_img/bg_nav2.gif);
   height: 40px;
}

#nav li{
   float: left;
}

#nav li a{
   display: block;
   color: black; /* Change this to the right color */
   text-decoration: none;
   padding: 0 8px;
   height: 40px;
   text-indent: -9999px;
}
#nav li a:hover{
   background: url(/_img/bg_nav2.gif) no-repeat;
}

#nav li#nav_home a{width: 39px; margin: 0 10px 0 29px;}
#nav li#nav_home a:hover,
#nav li#nav_home.current a{background: url(/_img/bg_nav2.gif) no-repeat -29px -40px;}

#nav li#nav_about-us a{width: 70px; margin: 0 8px 0 8px;}
#nav li#nav_about-us a:hover,
#nav li#nav_about-us.current a{background: url(/_img/bg_nav2.gif) no-repeat -102px -40px;}

#nav li#nav_blog a{width: 37px; margin: 0 8px 0 8px;}
#nav li#nav_blog a:hover,
#nav li#nav_blog.current a{background: url(/_img/bg_nav2.gif) no-repeat -204px -40px;}

#nav li#nav_products a{width: 74px; margin: 0 8px 0 8px;}
#nav li#nav_products a:hover,
#nav li#nav_products.current a{background: url(/_img/bg_nav2.gif) no-repeat -273px -40px;}

#nav li#nav_trucks a{ width: 55px; margin: 0 7px 0 8px;}
#nav li#nav_trucks a:hover,
#nav li#nav_trucks.current a{background: url(/_img/bg_nav2.gif) no-repeat -378px -40px;}

#nav li#nav_used-parts a{width: 87px; margin: 0 9px 0 8px;}
#nav li#nav_used-parts a:hover,
#nav li#nav_used-parts.current a{background: url(/_img/bg_nav2.gif) no-repeat -465px -40px;}

#nav li#nav_line-card a{width: 75px; margin: 0 8px 0 8px;}
#nav li#nav_line-card a:hover,
#nav li#nav_line-card.current a{background: url(/_img/bg_nav2.gif) no-repeat -585px -40px;}

#nav li#nav_photo-gallery a{width: 117px; margin: 0 9px 0 9px;}
#nav li#nav_photo-gallery a:hover,
#nav li#nav_photo-gallery.current a{background: url(/_img/bg_nav2.gif) no-repeat -693px -40px;}

#nav li#nav_contact-us a{width: 84px; margin: 0 0 0 8px;}
#nav li#nav_contact-us a:hover,
#nav li#nav_contact-us.current a{background: url(/_img/bg_nav2.gif) no-repeat -842px -40px;}

#nav li ul{
   position: absolute;
   left: -999em;
   z-index: 999;
   width: 150px; /* Needs to be same as other 150px value */
   list-style: none;
   line-height: 1;
}

#nav li li{
   font-size: 1.2em;
}

#nav li ul ul{
   margin: -25px 0 0 150px; /* the -25px and 150px need to be adjusted until the sub-sub-menu sits in the right place */
}

#nav li:hover ul ul,
#nav li.sfhover ul ul{
   left: -999em;
}

#nav li:hover ul,
#nav li li:hover ul,
#nav li.sfhover ul,
#nav li li.sfhover ul{
   left: auto;
}

#nav li li li{
   font-size: 1em;
}

#nav li li a{
   width: 150px; /* Needs to be same as other 150px value, less any padding or margin */
   background: #F00; /* Change to more appropriate value */
}

/* =Container
---------------------------------------------------------------------
*/
#container{
   width: 975px;
   margin: 0 auto;
}



/* =Container-Inner
---------------------------------------------------------------------
*/
/* =Content-Wrap
---------------------------------------------------------------------
*/
#content-wrap{
   float: left;
   padding: 10px;
   width: 955px; /* container - #content-wrap padding */
   background: #e5e2db url(/_img/bg_content-wrap.gif) no-repeat left top;
}

/* =Front Page Styling
---------------------------------------------------------------------
*/
#home-page-content{
   float: left;
   width: 694px;
}
body#home #featured-product{
   width: 690px;
   border: 2px solid #837c73;
   margin-bottom: 11px;
   position: relative;
   float: left;
   height: 348px;
   overflow: hidden;
}
body#home #featured-product img{
   margin: 0;
}
body#home #featured-product p.product-description{
   background: url(/_img/front_feature_overlay.png) no-repeat left top;
   position: absolute;
   bottom:0;
   left: 0;
   height: 40px;
   padding: 4px;
   width: 683px;
   font-size: 1.2em;
   color: #393939;
}

body#home #main{
   padding: 0 4px 10px;
   width: 684px;
   float: left;
}

body#home #main h2{
   background: #f6f6f6;
   margin: 0 -4px 10px;
   padding: 0 0 2px 4px;
   border-bottom: 1px solid #a69471;
}

body#home .news h3 a{
   color: #393939;
   font-family: Arial;
   border-bottom: 1px dotted #a69471;
   display: inline;
   font-size: .8em;
}

body#home .news p{
   margin:4px 0;
}

body#home .news{
   border-bottom: 1px dotted #a69471;
   margin-bottom: 10px;
}
body#home .news.last{
   border-bottom: none;
   margin-bottom: 10px;
}
body#home .news p.thumbnail{
display:inline;
float:left;
height:110px;
margin:0 2px 2px 0;
overflow:hidden;
text-align:center;
width:160px;
}

body#home .news p.thumbnail a{
border:2px solid #a69471;
display:block;
height:100px;
margin-bottom:-2px;
padding:0;
width:138px;
}

body#home .news p.thumbnail a:hover {
border-color:#276e8b;
}

body#home .news p.thumbnail a img{
border:medium none;
margin:0;
padding:0;
}

/* =main
---------------------------------------------------------------------
*/

#main{
   width: 660px;
   padding: 15px;
   float: left;
   border: 1px solid #a69471; /*brown*/
}

#main p,
#main li{
   margin-bottom: 1em;
   font-size: 1.2em;
   line-height: 1.5;
}

#main ul,
#main ol{
   margin: 0 0 1em 3em;
}

#main ul#byline{
   display: inline; /* IE6 double margin float bug hack */
   float: left;
   margin-bottom: 10px;
   list-style: none;
}

#main ul#byline li{
   font-size: 1.1em;
}

#main li{
   margin: 0;
}

#main li li{
   font-size: 1em;
}

#main blockquote{
   margin-left: 3em;
}

#main hr{
   display: block;
   margin-bottom: 1em;
}

#main img{
   float: left;
   margin: 0 10px 5px 0;
   border: 2px solid #a69471;
}

#main #text{
   clear: both;
}

#main #text.article {
   clear: right;
}

/* =Blog Posts
---------------------------------------------------------------------
*/
#main .post h3 {
   border-bottom: 1px dotted #a69471;
   margin-bottom: 6px;
}

#main .post h3 a {
   color: #bb4004;
   font-size: 1.3em;
}

#main p.meta{
   padding: 4px;
   background: #d3d0c9;
   color: #837c73;
   text-transform: uppercase;
}

#main #comments .comment{
   border: 1px dotted #a69471;
   margin-bottom: 20px;
   padding: 5px;

}

#main #comments h3{
   font-size: 1.8em;
   color: #bb4004;
}

#main #comments p.comments {
   font-weight: bold;
}

#main #comments .comment h5{
   font-size: 1.4em;
   line-height: 1.4;
   font-family: Arial;
}
#main #comments .comment.alt{
    background: #d3d0c9;
}

#main #comments form label{
   font-size: 1.6em;
   font-family: Times;
   color: #bb4004;
   font-weight: bold;
}

#main #comments textarea#comment{
   width: 100%;
   margin: 10px 0;
}

#main #comments input#comment-submit{
   display: block;
   float: left;
   width: 92px;
   height: 20px;
   background: url(/_img/bg_submit_comment.gif);
   text-indent: -9999px;
   border: none;
}
/* =Contact Form
---------------------------------------------------------------------
*/
#contact-us-form legend{
   display: none;
}

#contact-us-form .textarea textarea{
   width: 100%;
   height: 100px;
}

#contact-us-form .captcha p,
#contact-us-form .captcha p.data input{
   float: left;
   clear: both;
}

#contact-us-form .captcha p.data{
   margin-bottom: 4px;
}

#contact-us-form p#formsubmit{
   clear: both;
}

/* =Sidebar
---------------------------------------------------------------------
*/

#sidebar{
   width: 250px;
   float: right;
   border: 1px solid #a69471; /*brown*/
}

#sidebar div{
   float: left;
   width: 100%;
}
#sidebar h3{
   padding: 5px;
   color: #bb4004;
   background: #f6f6f6;
   text-transform: uppercase;
   font-size: 1.4em;
   border-top: 1px solid #a69471;
   border-bottom: 1px solid #a69471;
}
#sidebar .about-us p{
   font-size: 1.2em;
   line-height: 1.4;
   padding: 5px;
}

#sidebar ul{
   margin: .5em 0 .5em .5em;
   list-style-type: none;
}

#sidebar li{
   color: #393939;
   font-size: 1.2em;
   line-height: 1.5;
   font-weight: bold;
   background: url(/_img/bg_sidebar_li.gif) no-repeat left 3px;
   padding-left: 15px;
}

#sidebar .quick-search{
   width: 250px;
}
#sidebar .quick-search h3{
   border-top: none;
}
#sidebar #search{
   width: 230px;
   padding: 8px 10px;
}

#search fieldset{
   float: left;
   width: 230px;
   height: 20px;
   padding: 0;
   margin: 0;
   overflow: hidden;
}

#search input{
   display: block;
   float: left;
   width: 180px;
   height: 14px;
   padding: 3px;
   border: none;
   background: transparent url(/_img/bg_sidebar_search-box.gif) no-repeat left top;
   color: #797979;
   font-size: 1.1em;
   margin-right: 3px;
}
#search a#search_go{
   display: block;
   float: left;
   width: 41px;
   height: 20px;
   background: url(/_img/bg_sidebar_search-go.gif);
   text-indent: -9999px;
}

#sidebar div.events h4{
   font-family: Arial;
   font-size: 1em;
   display: inline;
   float: left;
}

#sidebar div.events p.date{
   display: inline;
   float: right;
   font-weight: bold;
   color: #393939;
   margin-right: 5px;
}

#sidebar div.events li{
   font-weight: normal;
}

#sidebar div.events li p.description{
   line-height: 1.4;
   color: #837c73;
   clear: both;
}

/* = Events  
---------------------------------------------------------------------
*/

#main #calendar-outer{
   position: relative;
}

#main table.calendar{
   margin-bottom: 25px;
   border: 1px solid #e3dfda;
   border-right: 0;
   border-bottom: 0;
   border-collapse: collapse;
}

#main table.calendar caption{
   padding-bottom: 10px;
   font-size: 1.8em;
   font-weight: normal;
   color: #bb4004;
}

#main table.calendar caption span{
   position: absolute;
   top: 0;
   width: 16px;
   color: #8A4700;
}

#main table.calendar caption span.calendar-prev{
   left: 250px;
}

#main table.calendar caption span.calendar-next{
   right: 250px;
}

#main table.calendar th{
   padding: 6px 0;
   background: #EDEBE8;
   color: #545454;
   font-size: 1.3em;
   font-weight: normal;
   text-align: center;
}

#main table.calendar td{
   width: 100px;
   height: 68px;
   padding: 2px;
   border: 1px solid #e3dfda;
   border-left: 0;
   border-top: 0;
   background: #FFF;
   color: #626262;
   font-size: 1em;
   vertical-align: top;
}

#main table.calendar td.empty{
   background: #f6f5f3;
}

#main table.calendar td a{
   text-decoration: none;
}

#main table.calendar td ul{
   margin: .5em 0 0 .5em;
   font-size: 100%;
   list-style: none;
   padding: 0;
}

#main table.calendar td li{
   padding-left: 8px;
   margin-left: 0;
   margin-bottom: .75em;
   font-size: 1.1em;
   line-height: 1.2;
   background: none;
}

#main table.calendar td li a{
   text-decoration: underline;
}

#main table.calendar td li a:hover{
   text-decoration: none;
}

#main table.calendar .calendar-next img,
#main table.calendar .calendar-prev img {
   margin: -3px 0 0;
   border: none;
}

/* = Galleries  
---------------------------------------------------------------------
*/

/* Fix the .gallery-list to be like .gallery-thumbnail */

#galleries .gallery-list {
   float: left;
   width: 470px;
   margin-bottom: 15px;
}

#galleries .gallery-list h4{
   margin-bottom: 5px;
}

#galleries .gallery-thumbnail p{
display:inline;
float:left;
height:136px;
margin:0 2px 2px 0;
overflow:hidden;
text-align:center;
width:160px;
}

#galleries .gallery-thumbnail p a{
border:3px solid #e48d2f;
display:block;
height:128px;
margin-bottom:-2px;
padding:0;
width:138px;
}

#galleries .gallery-thumbnail p a:hover {
border-color:#276e8b;
}

#galleries .gallery-thumbnail p a img{
border:medium none;
margin:0;
padding:0;
}

#galleries #photo h4#phototitle{
   margin-bottom: 8px;
}

/* =Products & Trucks for Sale
---------------------------------------------------------------------
*/


/* =Footer
---------------------------------------------------------------------
*/

#footer{
   clear: both;
   background: url(/_img/bg_footer.jpg) no-repeat left top;
   height: 28px;
   padding: 60px 10px 10px;
   margin:-55px 0 20px;
}

#footer p{
   float: left;
   font-family: Times;
   font-size: 1.8em;
   color: #a69471;
}

#footer p.powered{
   float: right;
}