﻿/* universal styling */
/* new comment */
html,body{
	background:#5c6574 url(../images/common/bkg-body.jpg) repeat-x 0 0;
	margin:0;
	padding:0;
}



div#bct {
	text-align:left;
	color: #fff;
	font-weight: bold;
	color:#C1CAD9;
	float:left;
	font-weight:bold;
	/* height:35px; */
	width: 100%;
	/* background: url(../images/common/breadCrumb_bg_705.gif) top left no-repeat; */
	margin: 0px 0px 0px 0px;
	background: #4E5663;
}

div#bct ul {
	margin: 0px 0px 0 10px;
	padding:0px;
	display: block;

}

div#bct ul li {
	background:transparent url(../images/common/bc_arrowbullet.gif) no-repeat scroll left 1px;
	color:#C1CAD9;
	display:inline;
	margin:0px;
	padding:0pt 0pt 0pt 11px;
}

div#bct ul li.toplevel {
	background:transparent none repeat scroll 0%;
	padding-left:0pt;
}

div#bct ul li a {
	text-decoration: underline;
	color:#fff;
	margin:0px;
	padding:0px;
}

/************** homepage  ************************/

#home #cont {margin: 0 auto; width: 990px;}

/* need to make this a class for the banner that 'breaks out' of the frame */
#home #cont #hd {margin: 0 auto;}

#home #cont #bd {display: block; position: relative; clear: both; padding: 0; width: 990px; background-color: transparent;}

#home .leftcol {float: left; width: 640px;}

#home div#rightcontent {width: 315px; margin-left: 10px;}

#home .container {display: block; clear: both; margin-top: 0px; overflow: auto; margin: 0 auto; width: 970px;}

#home .homewidepromos {margin-top: 10px;}
#home .homewidepromos img {float: left; margin-left: 13px;}
#home .homewidepromos img.first {margin-left: 0;}

/**************** end home specific ************************/

div.insidecontainer  {
	display: block;
	overflow: visible;
	background-color: #FFFFFF;
}
/*div.insidecontainer div.content img {margin: 5px;}*/
div.content {
	padding: 5px;
	background-color: #fff;
	overflow: visible;
}

h3 {
	background-color:#4e5663;
	color:#FFFFFF;
	/* height:30px; */ /* <-- AZ NOTE: preventing h3 text from wrapping - do not use! */
	line-height:1.2em;
	padding-left:10px;
	text-align:left;
	font-size: 1.8em;
	font-weight:bold;
	display: block;
	margin: 0;
}



a {
	color:#fff;
}
/* bad for accessibility, good for sighted users :)   */
a:focus {
	outline: none;
}


.clear {
	clear:both;
}
.hr {border-top: 1px solid #ccc; margin: 10px 0 }



#cont {width: 970px; overflow: hidden;  padding: 0; margin: 0 auto;}

#cont #hd, #cont #bd, #cont #ft {width: auto;}

/************ header *********************/
#cont #hd {width: 970px; overflow: hidden}


#profileformlet {display: block; float: right; margin-top: 10px; text-align: right; height: 20px;}
#profileformlet a {font-weight: bold;}
#profileformlet label,
#profileformlet input
 {margin-right: 5px}

#profileformlet #loginbutton {margin-top: 2px;}

 #searchformlet input {margin-bottom: 3px}


 div#topnav  {background-color: #B3B2B4; overflow: visible; height: 27px }
 #topnav li {float: left;}

/**************** end header **********************/



div #bd {background-color:#CCC9C9; margin: 0;padding:4px 14px 4px 14px;  }
div#bd div#bdcontainer { clear: both; display: block; overflow: hidden;}

/* this has gone back and forth; used to be 230 but the parts product page needs it to be 227. For consistency, this will be maintained across the site */

div#leftsidebar {float: left; width: 227px;}
/* can be used for either side */
div.sidebar {
	background-color: #FFFFFF;
	/* float: left; */
	clear: none;
}

div.sidebar img {
	margin-bottom: 0px;
	/* padding: 5 px; */
}

div.sidebar ul {padding: 0px 0px 0px 0px; margin: 0px; }
div.sidebar ul li {

	margin: 10px 0px 0px 0px;
	padding: 0px 10px 0px 30px;
	/* line-height: 2.3em; */
	/*	font-weight: bold; */
	background-image: url(../images/common/icn_arrow.gif);
	background-position: 20px 3px;
	background-repeat: no-repeat;
	text-align: left;

	/* Height: 2.3em;*/
}

div.sidebar ul li.no-link {
	background: none;
	color:#B2B2B2;
}




div.sidebar ul li a {
	color:#5C6574
}

div.sidebar ul li.selected {
	background: #ffffcc url(../images/parts_shelf/orangeArrow_icon.gif);
	background-position:22px 6px;
	background-repeat:no-repeat;
	color:#5C6574;
}

div.sidebar ul li ul li ul li.selected {
	background:#FFFFCC url(../images/parts_shelf/orangeArrow_icon.gif) no-repeat scroll 42px 11px;
}

div.sidebar ul li.selected a {
	color:#F68428
}

div.sidebar ul li ul li ul {padding: 0px; margin: 0px;  }

div.sidebar ul li ul li {
	background-image:url(../images/common/icn_arrow.gif);
	background-position: 9px 9px;
	background-repeat:no-repeat;
	font-size:0.9em;
	margin-left:-22px;
	padding-top:2px;
	vertical-align:top;
}

div.sidebar ul li.selected-part {
	background-image:url(../images/parts_shelf/yellowhighlight.gif);
	background-position:5px 7px;
	background-repeat:no-repeat;
	display:block;
	height:22px;
	padding-left:12px;
	font-weight:bold;
	padding-left:10px;
}

div.sidebar li.selected-category {
		height:32px;
		margin: 0px 0px 0px 2px;
		padding: 17px 0px 0px 10px;
		background-image:url(../images/parts_shelf/currentPageHighlight.gif);
		background-position:3px 5px;
		background-repeat:no-repeat;
		color:#F68428;
		font-weight:bold;
		line-height: 160%;
}

/* rounded corners */
.top-left{
	background:url('../images/common/darkBlueCorners_afh.gif');
	font-size: 2px;
	height:9px;
	margin:10px 9px 0 0
}

.top-right{
	background: url('../images/common/darkBlueCorners_afh.gif') 100% 0;
	font-size:2px;
	height:9px;
	margin-top:-9px;
	margin-left:9px
}

.bottom-left{
	background: url('../images/common/darkBlueCorners_afh.gif') 0 -8px;
	clear:left;
	font-size:2px;
	height:8px;
	margin-right: 10px;
}

.bottom-right{
	background: url('../images/common/darkBlueCorners_afh.gif') no-repeat 100% -8px;
	font-size:2px;
	height:8px;
	margin-top:-8px;
	margin-left:6px;
	margin-bottom:10px;
	border: 0px solid red;
	margin-bottom: 10px;
}






/* rounded corners for breadcrumb trail */
.bct-top-left {
	background: url('../images/common/darkBlueCorners_afh.gif');
	font-size: 2px;
	height: 9px;
	margin: 0px 9px 0px 0px;
}

.bct-top-right{
	background: url('../images/common/darkBlueCorners_afh.gif') 100% 0;
	font-size: 2px;
	height: 9px;
	margin-top: -9px;
	margin-left: 9px
}

.bct-bottom-left{
	background: url('../images/common/darkBlueCorners_afh.gif') 0 -8px;
	clear: left;
	font-size: 2px;
	height: 8px;
	margin-right: 9px;


}

.bct-bottom-right{
	background: url('../images/common/darkBlueCorners_afh.gif') no-repeat 100% -8px;
	font-size: 2px;
	height: 8px;
	margin: -8px 0px 0px 9px;
	border: 0px solid red;
	padding: 0px 0px 10px 0px;
}







.wc {background-image: url('../images/common/whiteCorners.gif')}
.cl {background-image: url('../images/common/cl.gif')}
.cr {background-image: url('../images/common/cr.gif')}
.lbc {background-image: url('../images/common/lightBlueCorners.gif')}
.gc {background-image: url('../images/common/grayCorners.gif')}
.oc {background-image: url('../images/common/orangeCorners.gif')}
.nts {margin-top: 0;} /*no top space*/
.wcbkg {background-image: url("../images/common/whiteCorners_bkg.gif");}
.wl {background-image: url('../images/common/wl.gif')}
.wr {background-image: url('../images/common/wr.gif')}

.grc {background-image: url("../images/search_results/bgCorners.gif");}
.dbc {background-image: url("../images/search_results/bgCorners_blue.gif");}
.dgrc {background-image: url("../images/common/darkGrayCorners.gif");}
.round-dcdcdc {background-image: url("../images/common/round-dcdcdc_bg.gif");}
.round-cfcfcf {background-image: url("../images/common/rounded_corners_cfcfcf.gif");}



/*
div.pagination-div {
	text-align: center;
	display: block;
	height: 22px;
	margin: 10px 10px 0px 10px;
	line-height: 250%;
}

div.pagination a.next-pag-link {
	background: url(../images/common/orangeArrow_icon.gif) 95% 50% no-repeat;
	color:#F68428;
	padding-left: 15px;
	padding-right: 10px;
	font-size: 1.6em;
	margin-top:-17px;
	float: right;
	position:relative;
}
*/

div.pagination a.prev-pag-link {
	background: url("../images/common/orangeArrow_icon_left.gif") center left no-repeat;
	color:#F68428;
	padding: 0px 0px 0px 8px;
	font-size: 1.6em;
	float:left;
	margin-top:5px;
	position:relative;
}


div#rightcontent {
	float: right;
	width: 707px;
	/* overflow: hidden; */
}

div#rightcontent div.twocol-maincontent {float: left;  width: 457px;  }
div#rightcontent div.onecol-maincontent  {
	float: left;
	text-align: left;
	color: #333333;
	width: 705px;
}

div.content {
	padding: 5px 10px 5px 10px;
	color: #666;
	overflow: visible;
	height: auto;
}
div.content p {
	margin-top: 10px;
	margin-right: auto;
	margin-bottom: 10px;
	margin-left: auto;
}
div#rightcontent div.content a {text-decoration: underline;}
div#rightcontent div.content a.orange-none {text-decoration: none;}
div#rightcontent div.content div.innercontent {width: 415px;}

div#rightcontent  div.sidebar {
	width: 238px;
	float: right;
	background-color: transparent;
	margin-top: 0px;
	overflow: hidden
}
div#rightcontent div.promo {
	/* padding-bottom: 10px; */
	display: block;
	margin-top: 0px;
	background-color: #FFFFFF;
	color: #666;
	float: none;
}
div#rightcontent div.promo strong {color: #000}
div#rightcontent  div.promo p { margin: 10px 10px 0 10px;}
div#rightcontent div.promo ul {
	margin: 0 auto 0 0px;
}
div#rightcontent .adm {margin-bottom:0px; position: relative; padding: 0px; margin-top:10px; } /*standalone ads */
div#rightcontent .ad {margin-bottom:10px; position: relative; padding: 0px;  } /*standalone ads */
div#rightcontent .ad1 {margin-top:0px; margin-bottom: 10px; position: relative; padding: 0px;  }
div#rightcontent .ad2 {margin-bottom:10px; position: relative; padding: 0px;  }

div#rightcontent.wide {float: left; overflow: hidden;  width: 948px;  }
div#rightcontent.wide div.twocol-maincontent {float: left; width: 703px }
div#rightcontent.wide div#bct {width: 948px;background-image: url(../images/common/breadCrumb_bg_wide.gif); }

ol.wizard {display: block; height: 60px; clear: both; overflow: visible; margin-left: 0}
ol.wizard li {float: left;  }


ul.floatlists {list-style: none; display: block; overflow: hidden; background-color: #fff; }
ul.floatlists li{
	list-style: none;
	font-weight: bold;
	width: 80px;
	float: left;
}
ul.floatlists li li{
	width: auto;
	font-weight: normal;
	font-size: 100%;
	text-decoration: none;
	float: none;
}

/* IE Fix */
form#partsLeftnav div {display: inline;}

form#maintenanceform {overflow: hidden}
form#maintenanceform  input { float: left;}

input.img {border: none}

form#maintenanceform  label {float: left; padding-left: 5px; font-weight: bold; width: 55px; }
form#maintenanceform  ul {display: block; float: left; margin-left: 60px}
fieldset {line-height: 2em; border: none; margin-bottom: 10px}



div#ft .ft_width {width: px; border:0px solid #cccccc;}
div#ft { padding-left: 15px;}
div#ft div { width: px;  float: left; padding-left: 35px; margin-top: 10px}
div#ft p,div#ft img {float:right; display: block; clear: right; margin-bottom: 15px; padding-right: 20px;}
div#ft h2 {color: #fff; font-weight: bold; height: auto;}

div#ft li {font-weight: bold; color: #fff; margin-bottom: 4px; }
div#ft li li {font-weight: normal; list-style: none; margin-bottom: 0px; font-size: auto;}

h4 {color:#5C6574; font-size: 110%; margin: 15px 0 10px; background-color: #fff;}
h4 span { font-size: 85%; font-weight: normal}
h4 span a { font-size: 85%; font-weight: normal; color:#5C6574}

p {margin: 0;}

/* section specific elements */
/* used on the parts pages */
.part-header {
	background-color:#DFDFDF;
	background-image:url(../images/parts_product/header_bg.gif);
	background-repeat: no-repeat;
	font-size:0.9em;
	font-weight:bold;
	/* height: 52px; */
	line-height:2em;
	margin: 0px 0 0 0;
	text-align:left;
	position: relative;
}

.part-title {
	background: url(../images/parts_shelf/listArrow_icon.gif) left 13px no-repeat;
	padding-left: 10px;
	margin-left:11px;
	display: block;
	color:#5C6574;
	/* float:left; */
	width: auto;
	font-size:1.4em;
	margin-top: 8px;
	font-weight:bold;
}

div.part-header div.part-number-cont {
	padding: 10px 7px 0px 0px;
	text-align: right;
}

div#parts_list .part-number {
	/* margin-top: 8px;
	margin-right: 3px; */
	font-size: 9px;
	color: #000;
	line-height: 1.5em;
	/* width: 100%; */
	border: 0px solid red;
	/* top: 36px; */
	/* left: 300px; */
	/* position: absolute; */
}

div#parts_list .part-number em {
	/* display: block; */
	font-size: 11px;
	/* color: #b2b2b2; */
	color: #5C6574;
	clear:both;
	font-style: normal;
}

div#parts_list div.content {width: 457px;margin: 0; padding: 10px 0 0 0; background-color: #fff;}

.application-pricing-info div {width: 170px; }

.content {}
.content .contentleft {
	float: left;
	width: 157px;
	height: 200px;
	position:relative;
	overflow: hidden;
} /* add 10px to images width for extra padding */

.content .contentright {
	float: right;
	overflow: visible;
	width:282px;
	position:relative;
	padding: 0px 10px 0px 0px;
}

div.part-pricing-info {
	float:left;
	width:135px;

}
#parts_shelf .part-info-header {
	font-weight: bold;
	color: #5C6574;
	margin-right:10px;
	text-align: left;
	/* width:70px; */
	float:left;

}
div.part-pricing-info .part_shelf_totals {
	width: 50px;
	float: left;
	/* text-align: left; */
}


div.part-pricing-info span {text-align: left}

/* right sidebar */
#your-ride {position: relative}


#your-ride-details {
left:10px;
position:absolute;
top:35px;
color: #fff;
}

.guide-vehicle {
font-size:1.1em;
font-weight:bold;
margin-bottom:5px;

color:#F68428;
}




/* core price stuff */
a.dotted-underline {
	text-decoration:none;
	color: #5C6574;
	/* border-bottom: 1px dotted #5C6574; */ /* AZ NOTE: Dotted underline removed - now we will need to change class name.  This should have never been named 'dotted-underline' */
}

a.corePrice {
	position:relative;
	z-index:24;
}
a.dotted-underline:hover {
	z-index:25;
}
a.dotted-underline span {
	display:none;
}

/*
 * NOTE: On the product shelf and detal pages, The core poupup div
 * gets cut off in Internet Explorer. So, we have
 * positioned and sized it so this does not occur.  The Z-index
 * does not seem to alleviate this issue.  Be careful
 * when adjusting the position or size of this and be sure to
 * test in IE6 and IE7.
 *
 * If the position/size of the core popup div needs to be adjusted
 * on a page OTHER than the product shelf and detail pages, then use the
 * overrides.css file and target ONLY that page using descendant
 * selectors.  Do not edit it here.
 *
 */
a.dotted-underline:hover span {
	background-color: #5C6574;
	border:1px solid #271100;
	color: #C1CAD9;
	display:block;
	left:-155px;	/* <-- see note above */
	padding:7px;
	position:absolute;
	text-decoration:none;
	top: 0px; 		/* <-- see note above */
	width:280px; 	/* <-- see note above */
	z-index:2500;
	text-align: left;
}

a.dotted-underline span em {
	color: #ffffff;
	display: inline;
	font-size: 1.2em;
	font-weight: bold;
	font-style: normal;

}

div.pagination-div ul li.pagination-current {
	display: block;
	float: left;
	/* height: 20px;
	width: 20px; */
	margin: 0px 3px 3px 0px;
	padding: 3px 5px 3px 5px;
	background-color:#C1CAD9;
	border:1px solid #FFFFFF;
	color:#FFFFFF;
}


div.pagination-div ul li.pagination-noncurrent {
	display: block;
	float: left;
	/* height: 20px;
	width: 20px; */
	margin: 0px 3px 3px 0px;
	padding: 3px 5px 3px 5px;
	background-color:#5C6574;
	border:1px solid #FFFFFF;
	color:#FFFFFF;
}

.orange-background {
	background-color:#F68428;
}

.orange {
	color:#F68428;
}

.darker-orange {
	color:#C35105;
}

/*  form error messaging */
img.error-icon{
	padding-right:4px;
	position: relative;
	top:4px;
}

.focusedInput {
	background-color: #FFFFCC;
}

.error-input {
	background-color: #FFCCCB;
	border: 1px solid #F90000;
}


div#rightcontent div.onecol-maincontentwh {
	float: left;
	text-align: left;
	color: #FFFFFF;
	width: 705px;
}
.bottom-rightwhite {
	background: url('../images/common/whiteCorners_afh.gif') 100% -8px;
	font-size:2px;
	height:8px;
	margin-top:-8px;
	margin-left:9px
}
.bottom-leftwhite {
	background: url('../images/common/whiteCorners_afh.gif') 0 -8px;
	clear:left;
	font-size:2px;
	height:8px;
	margin-right: 9px
}
.bottom-rightgray {

	background: url('../images/common/rounded_corners_med_gray.gif') 100% -8px;
	font-size:2px;
	height:8px;
	margin-top:-8px;
	margin-left:9px
}
.bottom-leftgray {

	background: url('../images/common/rounded_corners_med_gray.gif') 0 -8px;
	clear:left;
	font-size:2px;
	height:8px;
	margin-right: 9px
}
div.narrowcontent {
	width: 531px;
}
div.contentprint div.contentprint div {
	padding: 5px 10px 5px 10px;
	color: #000000;
	overflow: visible;
	height: auto;
	background-color: #FFFFFF;
}








div.pagination-div {
	height: auto;
	width: auto;
	overflow: auto;
	margin: 0px;
	padding: 15px 10px 20px 10px;
	/* line-height: 1.3em; */
	font-size: 11px;
	Border: 0px solid red;

}

div.pagination-div ul {
	/* margin: 0px 0px 0px 35px; */
	padding: 0px 0px 0px 0px;
}

div.pagination-div ul li {
	margin: 0px;
	padding: 0px;
}

div.pagination-div ul li a {
	margin: 0px;
	padding: 0px;
}

div.pagination-div ul li a:link,
div.pagination-div ul li a:hover,
div.pagination-div ul li a:visited {
	color: #FFFFFF;
}

div.pagination-div .next-pag-link {
}

div.pagination-div a.next-pag-link {
	/*
	display: block;
	padding: 0px 5px 0px 0px;
	background: url("../images/common/orangeArrow_icon_right.gif") center right no-repeat;
	font-size: 1.4em;
	color: #F68428;
	*/
	/*
	background-color: #5C6574;
	background-image: url("../images/common/orangeArrow_icon_right.gif");
	background-position: 93% 50%;
	background-repeat: no-repeat;
	border: 1px solid #FFFFFF;
	color: #F68428;
	display: block;
	font-weight: bold;

	margin: 0px;
	padding: 3px 6px 3px 6px;
	text-align: left;
	width: 50px;
	*/
}


/* jkb - new css is below */

/* IE displays borders around radio buttons on this form, so we disable the borders, then... */
form#estimateShippingOverlayForm input {
	Border: 0px;
}

/* re-enable them for just the zip field */
form#estimateShippingOverlayForm input#zipCode1 {
	Border: 1px solid black;
}

/* this is for pages that do not need a left nav section */
div#fullcontent {
	/*
	float: right;
	width: 705px;
	overflow: hidden;
	*/
}

/*
div#bct-override-fullwidth div#bct {
	float: none;
}
*/

div#bdcontainer-fullwidth {
	width: 942px;
}

div#bdcontainer-fullwidth div#bct {
	float: none;
	width: 100%;
	/* background: transparent url(../images/common/breadCrumb_bg_942.gif) no-repeat scroll left top; */
}

div#bdcontainer-fullwidth div#leftsidebar {
	display: none;
}

div#bdcontainer-fullwidth div#rightcontent {
	float: none;
	width: auto;
}

div#bdcontainer-fullwidth div#rightcontent div.onecol-maincontent {
	width: 100%;
}
div.spacer-line {
background-color:#CCC9C9;
font-size:0;
height:1px;
width:100%;
}


/* used on shelf and product detail pages */
div.pricing-info {
	Border: 0px solid green;
	width: 100px;
	float: right;

}


/* fixes alignment and display issues with embedded atg forms */
div#product-action-bar form {
	display: inline;
}

/* fixes broken left navigation in IE6 due to embedded atg forms in the li elements */
/* dsp tag is outputting a <div><input .../> </div> - this extra space inside the div is causing */
/* wrapping issues with the li elements in the left navigation in IE6 */
div#leftsidebar li div {
	display: none;
}

/* spacing div */
div.clear-full {
	width: 100%;
	clear: both;
	height: 1em;
}

/* visited links in the left navigation */
div#leftsidebar a:visited {
	/* color: #5C6574; */
}

/* global "#bd td" selector was being used for padding - it had to be removed.  This restores the padding to the side nav */
div#leftsidebar td {
	padding: 0px 0px 0px 7px;
}


/* links on search error page */
#site-search-error .rbcontent a {
	color: #F68428;

<!--styles for gray Questions? box-->
}
.roundcontgray {
	width: 240px;
	background-color: #4E5663;
	color: #fff;
}
.roundtopgray {

	background-image: url(../images/az_images/tr.jpg);
	background-repeat: no-repeat;
	background-position: right top;
}
.roundbottomgray {

	background-image: url(../images/az_images/br.jpg);
	background-repeat: no-repeat;
	background-position: right top;
}
.roundcontentgray {
	width: 228px;
	color: #FFFFFF;
	padding-left: 10px;
	padding-right: 0px;
	background-color: #4E5663;
	margin-top: -5px;
}
.roundcontentgray a {
	color: #FFFFFF;
	text-decoration:underline;
}
#tdcentergray {
	padding: 0px;
	text-align: left;
}
.roundtop_drkgr {

	background-image: url(../images/common/tr_drkgr.jpg);
	background-repeat: no-repeat;
	background-position: right top;
}
.roundbottom_drkgr {

	background-image: url(../images/common/br_drkgr.jpg);
	background-repeat: no-repeat;
	background-position: right top;
}
#tdcentergray p {
	padding: 0px;
	text-align: left;
	margin-top: 0px;
	margin-bottom: 0px;
}
img.corner {
   width: 8px;
   height: 8px;
   border: none;
   display: block !important;
}


div.sidebar div.ad div.promo span {
	color: black;
	font-weight: bold;
	padding-left: 10px;

}

div.sidebar div.ad1 div.promo span {
	color: black;
	font-weight: bold;
	padding-left: 10px;

}
.boldred {
	color: red;
	font-weight: bold;
}

.noshow {
	display: none;
}

