/***************************************************************************************************
                                                 main.css
                                       Main Stylesheet for Truck Stops
                              Author: Anthony McGrath <anthony@anthonymcgrath.com>
***************************************************************************************************/

/***************************************************************************************************
                                                                                      General Styles
***************************************************************************************************/
@font-face {
	font-family: 'ArialNarrow';
	src: url('arialn-webfont.eot');
	src: local('Arial Narrow'), local('ArialNarrow'), url('arialn-webfont.woff') format('woff'), url('arialn-webfont.ttf') format('truetype'), url('arialn-webfont.svg#webfontUOgxajhQ') format('svg');
	font-weight: normal;
	font-style: normal;
}
body {background-color: #D9E3E7;font-family: Arial, sans-serif;font-size: 12px; color: #818285;}
#bounding_box {display: block;width: 950px;height: 799px;margin: 0 auto;background-color: white;}
#banner {width: 100%;height: 178px;display: block;background: url('../images/Banner.jpg') top left no-repeat;}
.left_edge, .right_edge {display: block;height: 545px;width: 10px;background-image: url('../images/side_repeats.jpg');background-repeat: repeat-y;}
.left_edge {background-position: top left;float: left;}
.right_edge {background-position: top right;float: right;}
a {color: #818285;}
a img {border: none;text-decoration: none;}
h1, h2, h3, h4, p {margin: 0;padding: 0;}
h1 {font-size: 25px;}
h2 {font-size: 14px;}
h3 { font-size: 13px; color: #231f20;}
.clear {clear: both;}
/***************************************************************************************************
                                                                                   Navigation Styles
***************************************************************************************************/

#nav_bar .left_edge, #nav_bar .right_edge {height: 34px;float: left;}
#navigation {list-style-type: none;padding: 0;margin: 0;font-size: 11px;text-align: center;line-height: 32px;text-transform: uppercase; white-space: nowrap;}
#navigation li {float: left;font-family: "Arial Narrow", "ArialNarrow"}
#navigation li + li {border-left: solid 4px #211E1F;}
#navigation li#right_nav_border {border-right: solid 4px #211E1F;}
#navigation li#logo {position: relative;z-index: 3;display: block;width: 318px;height: 53px;background: url('../images/truck-stops-logo.jpg') top left no-repeat;border: 0px;text-indent: -999999px;}
#navigation li a {display: block;width: 98px; height: 34px;background: url('../images/nav-bar-background.jpg') top left no-repeat;color: white;text-decoration: none;}
#navigation li a:hover, #navigation li.selected a {background-position: bottom left;}
#navigation li.selected a {color: #FECB10;}

/***************************************************************************************************
                                                                                         Body Styles
***************************************************************************************************/

#content {clear: both;position: relative; top: -19px;background: url('../images/Main-Repeat.jpg') top left repeat-x;height: 545px;z-index: 2;}

/***************************************************************************************************
                                                                                     Homepage Styles
***************************************************************************************************/
#right_bar { float: right; display: block; width: 200px; height: 545px;border-left: solid 4px #211E1F;background: url('../images/right-inverted-repeat.jpg') top left repeat-x; font-family: "Arial Narrow Bold", arial;}
#right_bar a.trd { position:relative; left:-41px; width:241px; height:109px; display:block; text-indent:-999999px;  background:top left no-repeat url(../images/trd1.jpg); }
#right_bar div {display: block; width: 178px;/*margin: 11px;*/margin:8px 11px; text-align: center;}
#right_bar div + div {border-top: solid 1px #CFD1D4;font-size: 11px;}
#right_bar div + div a { color: #86888b;}
#right_bar_specials a {font-size: 19px; color: #231f20;font-weight: bold;text-decoration: none;}
#right_bar_specials a div {padding: 8px 0 0 30px; margin:0 11px; height: 58px;width: 153px; background: url('../images/special-tag.png') top left no-repeat;}
#right_bar_check a {display: block;/*padding-top: 169px;*/ padding-top:162px; background: url('../images/free_check.png') center 11px no-repeat;}
#right_bar_catalogue a {display: block;/*padding-top: 149px;*/ padding-top:142px; background: url('../images/catalogue.jpg') center 11px no-repeat;}

#truck_subnav {list-style-type: none; margin: 0; padding: 0;float: left;}
#truck_subnav li a {display: block; width: 241px; height: 109px; background-position: top right; text-indent: -999999px; background-repeat: no-repeat;}
#truck_subnav #all_makes a {height: 110px; background-image: url('../images/All-Makes.jpg');}
#hino a {background-image: url('../images/Hino.jpg');}
#mack a {background-image: url('../images/Mack.jpg');}
#renault a {background-image: url('../images/Renault.jpg');}
#truck_subnav #volvo a {height: 108px;background-image: url('../images/Volvo1.jpg');}
#hino a:hover, #mack a:hover, #renault a:hover, #volvo a:hover {background-position: bottom right;}
#home_inner { position:relative; float: left;text-align: center;width: 450px;padding-top: 37px; height: 505px;}
#home_inner h1, #home_inner h2 {color: #231f20;}
#home_inner h1 {padding-bottom: 10px;}
#home_inner a.career-button { position:absolute; bottom:50px; right:50px; }

#home_inner a.career-button { width:134px; height:31px; padding-top:6px; display:block; color:#FFFFFF; text-decoration:none; font-size:10px; line-height:120%; text-transform:uppercase; text-align:center; font-family:"Arial Narrow", "ArialNarrow"; background:top left no-repeat url(../images/career-bgnd.jpg); }
#home_inner a.career-button:hover { background:none; background-color:#ff2b32; }

/***************************************************************************************************
                                                                                     Branches Styles
***************************************************************************************************/
#branches_inner {width: 526px; height: 492px; position: relative; margin: 0 auto; padding-top: 30px;}
#branchtitle {display: block; width: 100%; border-bottom: solid 1px #d3d4d6;padding-bottom: 8px;}
.branch_data {position: absolute; bottom: 0; right: 0;background-color: white;width: 300px; height: 438px;padding: 14px;border: solid 1px #d3d4d6;}
#branches_inner ul {list-style-type: none; padding: 14px 0 0 0; margin: 0;}
#branches_inner ul#branch_list {width: 120px;}
#branches_inner ul li {padding: 0 0 2px 0;}
#branches_inner ul li + li {padding: 2px 0;}
#branches_inner ul li a {color: #818285;text-decoration: none;}
#branches_inner ul li a.selected {font-weight: bold; color: #231f20;}
#branches_inner .branch_data ul li .label {display: inline-block;width: 120px;}
#branches_inner .branch_data img {position: absolute; bottom: 14px;left: 14px;width: 290px;}
#emailAddresses {display: inline-block; vertical-align: top;}
/***************************************************************************************************
                                                                                       Dealer Styles
***************************************************************************************************/
#dealer_inner {width: 900px; height: 492px; position: relative; margin: 0 auto; padding-top: 30px;}
#branchtitle {display: block; width: 100%; border-bottom: solid 1px #d3d4d6;padding-bottom: 8px;}
.branch_data {position: absolute; bottom: 0; right: 0;background-color: white;width: 300px; height: 438px;padding: 14px;border: solid 1px #d3d4d6;}
#dealer_inner ul {list-style-type: none; padding: 14px 0 0 0; margin: 0;}
#dealer_inner ul.dealer_list {width: 130px;float: left;}
#dealer_inner ul.dealer_list + ul.dealer_list {padding-left: 15px;}
#dealer_inner ul li {padding: 0 0 2px 0;}
#dealer_inner ul li + li {padding: 2px 0;}
#dealer_inner ul li a {color: #818285;text-decoration: none;}
#dealer_inner ul li a.selected {font-weight: bold; color: #231f20;}
#dealer_inner .branch_data ul li {position: relative; z-index: 2;}
#dealer_inner .branch_data ul li .label {display: inline-block;width: 120px;}
#dealer_inner .branch_data img {position: absolute; bottom: 14px;left: 14px;width: 290px;z-index: 1;}
#emailAddresses {display: inline-block; vertical-align: top;}
/***************************************************************************************************
                                                                            Parts and Service Styles
***************************************************************************************************/
#parts_inner {display: block; width: 895px; margin: 0 auto; padding-top: 30px;}
.flyer + .flyer {padding-top: 20px;}
.flyer a {text-decoration: none; color: #818285;}
.download {padding-left: 20px; background: url('../images/parts_arrow.png') center left no-repeat;}
.underline {text-decoration: underline;}
.flyer_description {padding-left: 104px;display: block;}
.parts_column {display: block; float: left;}
#parts_left {width: 168px; padding-right: 14px;}
#parts_center {width: 310px;height: 515px; padding: 0 18px; border-color: #a7a9ac; border-style: solid; border-width:0 1px;}
#parts_center p, #parts_right p {padding-bottom: 1em;}
.bold {font-weight: bold;}
#parts_center ul {margin-left: 0; padding-left: 14px;}
.float_left {float: left;}
#parts_center .float_left {padding-right: 18px;}
#side_float { float: left;padding-top: 23px;}
.thin_block {width: 90px;}
.small_link a {font-size: 9px; color: #87898c;}
#parts_center p#image_p {margin-top: -1.5em;padding-bottom: 0;}
#parts_right {width: 345px;}
#parts_right div {padding-left: 18px;}
#parts_right_top {border-bottom: solid 1px #CFD1D4;padding-bottom: 7px; }
#parts_right_bottom {padding-top: 3px;}
#parts_right_bottom a.trd-button { width:200px; height:27px; display:block; color:#FFFFFF; text-decoration:none; font-size:11px; line-height:26px; text-transform:uppercase; text-align:center; font-family:"Arial Narrow", "ArialNarrow"; background:top left no-repeat url(../images/trd-button-bgnd); }
#parts_right_bottom a.trd-button:hover { background-position:0 -27px; }

/***************************************************************************************************
                                                                                    Corporate Styles
***************************************************************************************************/
#content.corporate {position: relative;}
#corporate_inner {display: block; width: 892px; margin: 0 auto; padding-top:40px;font-size: 12px;}
#corporate_inner p {padding-bottom: 0.5em;}
#corporate_inner a {color: #818285;}
#corporate_left, #corporate_right, #corporate_inner_left, #corporate_inner_right { float: left; display: block;}
#corporate_left {width: 261px; padding-right: 21px;border-right: solid 1px #a7a9ac;}
#corporate_mission_box {border: solid 1px #a7a9ac; background-color: white;padding: 6px 12px;font-size: 11px;margin-top: 1em;}
#corporate_mission_box h3 {font-size: 12px;}
#corporate_right {width: 590px; padding-left: 19px;}
#corporate_inner_left {width: 390px; padding-right: 8px; border-right: solid 1px #a7a9ac;margin-top: 1em;}
#corporate_inner_left ul {margin: -0.5em 0 0 0; padding: 0 0 0 14px;}
#corporate_inner_right { width: 162px; padding: 1em 0 0 15px;}
#corporate_inner_right p {padding: 0.2em 0 0 0;}
#employment_overlay {display: block; width: 931px; height: 100%; background: url('../images/overlay.png') top left repeat;position: absolute; top: 0; left: 10px;}
#overlay_box {display: block; width: 517px; height: 500px; padding: 10px 30px;background: url('../images/overlay_box.png') center center no-repeat;margin: 20px auto; font-size: 13px;}
#situations_vacant_box {padding: 10px; border: solid 1px #a7a9ac;}
#situations_vacant_box ul {padding: 0 0 0 14px; margin: 0;} 
/***************************************************************************************************
                                                                                   Contact Us Styles
***************************************************************************************************/
#contact_inner {width: 470px; margin: 0 auto; padding: 30px 0 0 0;position: relative;}
#contact_inner p {padding-bottom: 1em;}
#contact_form .fieldset {padding: 0 0 10px 0;}
#contact_form label {display: inline-block; width: 95px;vertical-align: top;}
#contact_form input, #contact_form select, #contact_form textarea {display: inline-block; vertical-align: top;font-size: 11px; color: #000000;border: solid 1px grey;height: 20px;line-height: 15px;}
#contact_form input.wide, #contact_form textarea {width: 365px;}
#contact_form #phone_prefix {width: 36px; margin-right: 7px;}
#contact_form #phone_number {width: 153px;}
#contact_form #your_country { width: 158px;}
#contact_form textarea {height: 95px; margin-bottom: 5px;}
#contact_form #submit {border: 0;border-left: solid 4px #211E1F;line-height: 14px;border-right: solid 4px #211E1F; width: 94px; height: 34px;background: url('../images/nav-bar-background.jpg') top left no-repeat;color: white;text-decoration: none; font-size: 14px;cursor: pointer;}
#contact_form .error {position: absolute;white-space: nowrap; left: 480px;color: red;padding-top: 5px;}
/***************************************************************************************************
                                                                                     Specials Styles
***************************************************************************************************/
#specials_inner {width: 600px; margin: 0 auto;padding-top: 40px;}
#specials_inner table tr td {text-align: center;}
#specials_inner table a {text-decoration: none;}
/***************************************************************************************************
                                                                                   Free Check Styles
***************************************************************************************************/

#free_check_inner {width: 780px; margin: 0 auto;padding: 30px 0 0 0;font-size: 11px;}
#free_check_inner h3,#free_check_inner p, #free_check_inner ul {padding: 0 0 0.5em 0;}
#check_logo_block, #check_left_column, #check_right_column { float: left;display: block;}
#check_logo_block {width: 120px; }
#check_left_column {width: 306px; padding: 0 19px 0 0; margin: 23px 0 0 0;border-right: solid 1px #a7a9ac;	}
#check_left_column ul {margin: 0; padding: 0 0 0 14px;}
#check_right_column {width: 285px;padding: 23px 0 0 22px;}
#check_right_column #bordered_box {padding: 12px 13px;border: solid 1px #a7a9ac;margin-bottom: 1em;}

/***************************************************************************************************
                                                                                    Catalogue Styles
***************************************************************************************************/
#catalogue_inner {width: 900px; margin: 0 auto; padding-top: 20px;}
#catalogue_inner img {float: left; padding:0 10px 5px 0;}
#catalogue_inner img + h3 {line-height: 35px;font-size: 12px;}
#catalogue_container {margin-top: 5px;width: 100%; border-top: solid 1px #d3d4d6;}
#catalogue_container a {color: #818285;text-decoration: none;}
#catalogue_container h3 a {color: #211E1F; font-size: 12px;}
#catalogue_container ul {list-style-type: none;margin: 0; padding: 0;}
#catalogue_container ul li {padding: 2px 0;font-size: 10px;}
.catalogue_column {display: block;width: 117px; float: left;padding: 5px 5px 0 5px;height: 470px;} 
.catalogue_column + .catalogue_column {border-left: solid 1px #d3d4d6;}
.catalogue_column ul + h3 {padding-top: 17px;}
/***************************************************************************************************
                                                                                       Footer Styles
***************************************************************************************************/
#footer {padding: 0; margin: 0; width: 100%;position: relative; top: -19px;}
#bottom_left, #bottom_right {width: 30px; height: 42px; float: left;background-image: url('../images/Bottom-Corners.jpg');background-repeat: no-repeat;}
#bottom_left {background-position: top left;}
#bottom_right {background-position: top right;}
#footer_bar {width: 890px; height: 42px; background: url('../images/bottom-repeat.jpg') top left repeat-x;float: left;text-align: center; font-size: 9px; color: #acacad; line-height: 33px;}
#footer_bar a {color: #acacad; text-decoration: none;}