/* This rule resets a core set of elements so that they will appear consistent across browsers. Without this rule, content styled with an h1 tag, for example, would appear in different places in Firefox and Internet Explorer because each browser has a different top margin default value. By resetting these values to 0, the elements will initially be rendered in an identical fashion and their properties can be easily defined by the designer in any subsequent rule. */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6 {
  margin: 0;
  padding: 0;
  border: 0;
}
/* The body is the outermost layout component and contains the visible page content. Setting properties for the body element will help to create consistent styling of the page content and more manageable CSS. Besides using the body element to set global properties, it is common to use the body element to set the background color of the page and create a centered container for the page content to display. */
body {
  background-color: #C6A429; background-image:url(../wcsstore/B2BDirectStorefrontAssetStore/images/layout/body_bg.gif); background-repeat:repeat;
  color: #393e3a;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 0.9em;
  line-height: 1.2em;
  margin: 0 0 0 0; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */
  padding: 0 0 0 0; /* Sets the padding properties for an element using shorthand notation (top, right, bottom, left) */
  text-align: center; /* Centers the page content container in IE 5 browsers. */
}

/**  Global Image Styles  **/
img {
  padding: 0.25em;
  border: 0;
}
.truck {
  text-align:left;
}
#print-image {display:none;}

.espot {
  width: 12.5em;
  background-color: #D4CBAA;
}
.bold {font-weight: bold;}

.PageHeader {
  color: #977f09;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1.6em;
  font-weight: bold;
}

.TableHeader {
  color: #977f09;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1.2em;
  font-weight: bold;
}
/*Styles for Location Page Table Headers and Links*/
.LocationHeader {
  color: #977f09;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1.2em;
  font-weight: bold;
  text-align:center;
}

.CityHeader {
  color: #135721;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1em;
  font-weight: bold;
 }
.CityHeader a:link, a:active, a:hover, a:visited {
	color: #135721;
	}
/*END Styles for Location Page Table Headers and Links*/
	

/* Commonly used to style page titles. */
h1 {
  color: #977f09;
  font-size: 1.6em;
  font-weight: bold;
}
h2 {
  color: #977f09;
  font-weight: bold;
  font-size: 1.4em;
}
h3{
  color: #977f09;
  font-size: 1.2em;
  font-weight: bold;
}
h4 {
  color: #977f09;
  font-size: 1.0em;
  font-weight: bold;
}
h5 {
  color: #977f09;
  font-size: 0.8em;
  font-weight: bold;
}
h6 {
  color: #977f09;
  font-size: 0.6em;
  font-weight: bold;
}
/*Sets the style for lists*/

ul {list-style:none;}


/* Sets the style for unvisited links. */
a,  a:link {
  color: #977f09;
  font-weight: bold;
  text-decoration: none;
}
/* Sets the style for visited links. */
a:visited {
  color: #775e08;
  font-weight: bold;
  text-decoration: none;
}
/* Sets the style for links on mouseover. */
a:hover {
  color: #977f09;
  text-decoration: underline;
}
/* Sets the style for a link that has focus. */
a:focus {
  color: #999;
  text-decoration:none;
}
/* Sets the style for a link that is being activated/clicked. */
a:active {
  color: #999;
  text-decoration: underline;
}
/* Error Styles */
.error {text-align:center; padding:10px}
.error_message{color: #FF0000;}

/*Paragraph Styling*/
p { padding: .31em .19em .63em .19em; margin: 0px; }
p a {text-decoration: none; font-weight:bold }
p a:hover {text-decoration: underline; }

.align_right { text-align: right; padding: 0px; margin: 0px; }
.align_center { text-align: center; }
.align_left {
  text-align:left;
}
.larger_text { font-size: 1em; }
.small_text { font-size: 0.85em; }
.error_message { color: #d14768; }
.no_pad { padding: 0px !important; }


/* This is a container for the page content. It is common to use the container to constrain the width of the page content and allow for browser chrome to avoid the need for horizontal scrolling. For fixed layouts you may specify a container width and use auto for the left and right margin to center the container on the page. IE 5 browser require the use of text-align: center defined by the body element to center the container. For liquid layouts you may simply set the left and right margins to center the container on the page. */
#outerWrapper {
  background-color: #fff;
  margin: 0 auto 0 auto; /* Sets the margin properties for an element using shorthand notation (top, right, bottom, left) */
  text-align: left; /* Redefines the text alignment defined by the body element. */
  width: 1000px;
}
#outerWrapper #header {
  background-color: #fff; /* Sets the bottom border properties for an element using shorthand notation */
  font-size: 0.93em;
  line-height: 1.2em;
  padding: .63em .63em .63em .13em;
  border-top: solid .06em #c6a429;
}

/*Dividing Header into 3 columns for content - Subpages*/
#outerWrapper #header #rightColumnh{
  background-color: #fff; /* Sets the left border properties for an element using shorthand notation */
  float:right;
  text-align: right;
  width: 44%;
  font-family: Tahoma;
  margin-right: 0.5em;
  }

/*Upper Right Navigation*/
ul#top-nav {
  list-style-type:none;
  margin:0;
}

#top-nav li {
  display:block;
  float:right;
  padding:0.5em 0.7em .3em 0.3em;
  font-weight: bold;
}

#top-nav li a {display:block; float:left; text-decoration:none; font-size:.8em;  color:#393e3a;}
#top-nav li a:hover {color:#977f09;}
#top-nav .img {border:none}
#top-nav .mylist {background-image: url(../wcsstore/B2BDirectStorefrontAssetStore/images/layout/myList.gif);
  background-repeat:no-repeat;
}

#outerWrapper #header #leftColumnh{
  background-color: #fff;
  float:left;
  padding: 0.3em;
  /* background-image: url(../images/layout/tagline.gif);
  background-repeat: no-repeat;  */
  width: 30%;
  /*height: 100px;*/
  padding: 0.3em;
  margin-left: 0.5em;
  /*margin-top: 2em;*/
  }

#outerWrapper #header #centerColumnh{
  background-color: #fff;
  /*margin: 2.5% 45% 0 10%;*/
  padding: 0.625em; /* Sets the padding properties for an element using shorthand notation (top, right, bottom, left) */
  text-align: center;
  font-size: 0.85em;
  font-family: Tahoma;
  font-weight: normal;
}

#outerWrapper #header .clearFloat {
  clear:both;
  display:block;
}
/***END: Dividing Header into 3 columns for content*/

/*Upper Right Navigation and Column Layout for Home Page*/
#outerWrapper #header #rightColumnHome{
  background-color: #fff; /* Sets the left border properties for an element using shorthand notation */
  float:right;
  padding: 0.3em; /* Sets the padding properties for an element using shorthand notation (top, right, bottom, left) */
  width:16%;
  font-size: 1em;
  text-align: right;
  font-weight: bold;
}

ul#top-navHome {
  list-style-type:none;
  padding: 0;
  margin:0;
  font-size: 1em;
  font-weight: bold;
}

#top-navHome li {display:block; float:right; padding:8px;}
#top-navHome li a {display:block; float:left; text-decoration:none; font-size:1em; font-weight:bold; color:#393e3a;}
#top-navHome li a:hover {color:#977f09;}
#top-navHome .img {border:none}

#outerWrapper #header #leftColumnHome{
  background-color: #fff; /* Sets the right border properties for an element using shorthand notation */
  float:left;
  padding: 10px 10px 10px 10px;
  /* background-image: url(../images/layout/logo.gif);
  background-repeat: no-repeat;
  width: 275px;
  height: 78px; */
  }

#outerWrapper #header #centerColumnHome{
  background-color: #fff;
  margin: 0 4% 0 31%;
  padding: 0.31em;
  background-image: url(../wcsstore/B2BDirectStorefrontAssetStore/images/layout/index-mid.gif);
  background-repeat: no-repeat;
  width: 50%;
  height: 4.81em;
  }

/* DEALERS LOGOS NAVIGATION*/
         #brands-nav {
  padding:0;
  margin:0 0 .625em 0;
  height:1.5em;
  width: 100%;
  text-align: center;
}
    #brands-nav img{margin:0 .43em 0 .5em;}

/****END: Upper Right Navigation and Column Layout for Home Page*/

/*------------Layout Elements for Secondary Product and Category Pages-----------------*/


/*Main Navigation Menu between tab navigation and content*/

#outerWrapper #navigation{
	background-color: #fff;
	line-height:0.8em;
	margin: 0px;
	border: 1px solid #333333;
	list-style-type: none;
}

#outerWrapper #navigation .clearFloat {
  clear:both;
  display:block;
}

/*************Main Content Area********************/

#contentWrapper {
  width:100%;
}

/******Right Column Properties*******/
#outerWrapper #contentWrapper #rightColumn1 {
  background-color: #fff; /* Sets the left border properties for an element using shorthand notation */
  width: 20%;
  float: left;
}
/*********Right Column Properties for CART pages**********/
#outerWrapper #contentWrapper #rightColumnC {
  background-color: #fff; /* Sets the left border properties for an element using shorthand notation */
  width: 20%;
  float: left;
}

/******Left Column Properties*******/

#outerWrapper #contentWrapper #leftColumn1 {
  background-color: #fff; /* Sets the right border properties for an element using shorthand notation */
  padding: 0.125em; /* Sets the padding properties for an element using shorthand notation (top, right, bottom, left) */
  width: 15%;
  border: solid 1px #c6a429;
  font-size: .85em;
  float: left;
  clear: both;
}
ul#leftColumn1 {
  list-style: none;
  padding: 0;
  margin:0;
  font-size: .9em;
}

#leftColumn1 li {padding:0.125em; margin-left: -2.5em;}
#leftColumn1 li a {text-decoration:none; font-size:.9em; font-weight:normal; color:#393e3a;}
#leftColumn1 li a:hover {color:#977f09;}
#leftColumn1 .img {border:none}

.leftColumn1on {background-color: #dce3ed;}


/* Contains the main page content. When using a mutliple column layout the margins will be set to account for the floated columns' width, margins, and padding. */
#outerWrapper #contentWrapper #content {
  width:64%;
  float: left;
}
/* Contains the CART page content. When using a mutliple column layout the margins will be set to account for the floated columns' width, margins, and padding. */
#outerWrapper #contentWrapper #contentCart {
  width:79%;
  float: left;
}
/* Content Area for Generic Pages with No Left or right Columns. */
#outerWrapper #contentWrapper #GenContent {
  width:100%;
  float: left;
  margin: 5px 10px 5px 10px;
}

/*------------Layout Elements for Index Page with Right Column-----------------*/

#outerWrapper #contentWrapper #IndexRightColumn {
  background-color: #fff; /* Sets the left border properties for an element using shorthand notation */
  float: right;
  padding: 0.32em; /* Sets the padding properties for an element using shorthand notation (top, right, bottom, left) */
  width: 20%;
}
#outerWrapper #contentWrapper #IndexContentColumn {
  float: left;
  padding: 0.32em; /* Sets the padding properties for an element using shorthand notation (top, right, bottom, left) */
  width: 75%;
  border-left: 1px solid #c6a429;

}


/* Using floated elements and a clear float class is a common method to accomplish multiple column tableless layouts. If floated elements are used without being cleared the elements following will wrap around the floated element. This class should be applied to an element after the last floated element and before the close of the container with floated elements. */
#outerWrapper #contentWrapper .clearFloat {
  clear: both;
  display: block;
}
  /*================== BREADCRUMBS :: START ==================*/
#outerWrapper  #breadcrumbs {
  width: 99%;
  font-size:0.85em;
  padding: 0 5px 0 5px;
  margin: 0px;
  float: left;
}
    div.breadcrumbs a { padding: 0px 2px 0px 2px; margin: 0px; text-decoration: none; font-size: .85em;}
    div.breadcrumbs a:hover { text-decoration: none; }
    div.breadcrumbs ul { padding: 0px; margin: 0px; }
    div.breadcrumbs li { padding: 0px 4px 0px 3px; margin: 0px; list-style-type: none; float: left; color: #d4cbaa;  }
    div.breadcrumbs li a { padding: 0px 4px 0px 3px; margin: 0px; color: #393e3a; text-decoration: none; font-size: .85em;}
    div.breadcrumbs li a:hover { text-decoration: underline; }
  /*================== BREADCRUMBS :: END ==================*/
  
  /*================== BREADCRUMBS FOR CART :: START ==================*/  
  #outerWrapper #breadcrumbsCart {
  width: 99%;
  font-size:.9em;
  padding: 0 5px 0 5px;
  margin: 0px;
  float: left;
}
    div.breadcrumbsCart a { padding: 0px 2px 0px 2px; margin: 0px; text-decoration: none; font-size:.9em;}
    div.breadcrumbsCart a:hover { text-decoration: none; }
    div.breadcrumbsCart ul { padding: 0px; margin: 0px; }
    div.breadcrumbsCart li { padding: 0px 4px 0px 3px; margin: 0px; list-style-type: none; float: left; color: #d4cbaa;font-size:.9em;  }
    div.breadcrumbsCart li a { padding: 0px 4px 0px 3px; margin: 0px; color: #393e3a; text-decoration: none; }
    div.breadcrumbsCart li a:hover { text-decoration: underline; }

  /*================== BREADCRUMBS FOR CART :: END ==================*/  
/*** Table properties for Header Table***/
#headerTable {
  background-color: #fff;
  text-align: left;
  font-size: 0.85em;
  font-family: Tahoma;
  font-weight: normal;
}
/***Table properties for Upper Right Navigation area. Nested inside headerTable ***/
#navTable {
  text-align: left;
  font-size: 0.85em;
  font-weight: bold;
  }

#navTable a {text-decoration:none; color:#393e3a;}
#navTable a:hover {color:#977f09;}
#navTable .img {border:none}
#navTable .mylist {background: url(../wcsstore/B2BDirectStorefrontAssetStore/images/layout/myList.gif) no-repeat top right;
}



/***Table properties for Truck area. Nested inside headerTable. Set's borders on outside only. This feature is only recognized by MSIE above 6.0***/
#truckTable {
table border:1px;
  rules:none;
  frame:box;
  border-color:#C6A429;
  text-align: left;
  }
/***Table properties for You May Also area on Cart Pages. Set's borders on outside only. This feature is only recognized by MSIE above 6.0***/
#yma {
table border:1px;
  rules:none;
  frame:box;
  border-color:#C6A429;
  text-align: left;
  }

/***Table properties for CART pages***/
#cartTable {
  width: 100%;
  color: #393e3a;
  font-size: .9em;

 }
#TableHeaderCart {
  background-color: #fff;
  color: #393e3a;
  font-weight: bold;
  font-size: 1.4em;
 }
 /*#TableHeader sets the background color of the header cell to #393e3a and sets text color to #CCCCCC (light gray) and Bold Text*/
#cartTable .contentHeader {
  background-color: #ECECEC;
  color: #393e3a;
  font-size: 0.9em;
 }
 /*#TableHeader sets the background color of the header cell to #393e3a and sets text color to #CCCCCC (light gray) and Bold Text*/
/***Table Attributes for Products***/
#mainTable {
  /*/*/line-height: 0.875em; /* */
  width: 97%;
 }
 /*This sets a 1px black border (which Netscape 4 ignores) and line-height to a nice, spacious 1.5em units. The nested double comments around the declaration hides the style from Netscape 4, which does not do very well with line-height. An em unit is a proportional measure that maintains a relationship based on the size of the font.*/

#mainTable td {
  font-size: 0.95em;
 }
 /*#mainTable td sets the padding for each table cell inside the table. Although Netscape 4 does not honor this property on a table tag, we do not need to hide it because it will not cause problems... it will simply be ignored. You may be wondering why we've bothered to set this rule since we have assigned 20px padding directly on the <table> tag. There are two reasons. First, Netscape 4 does honor padding set directly on the tag and, second, it gives us the opportunity to change padding (if the need arises) for modern browsers via CSS*/

 #mainTableContent {
  border-left: 2px dotted #393e3a;
  font-size: .875em;  /*/*/font-size: 100%; /* */
 }
 /*#mainTableContent defines the main table cell. The left border is set to 2px dotted #333 (dark gray). Netscape 4, of course, completely ignores this... but it causes no problems and does not need to be hidden. Font-size is set to 14px for Netscape 4 and to 100% for modern browsers. As you recall, we set the font-size on the body element to 14px, so modern browsers interpret this rule as being 100% of 14px. We hide the % size from Netscape 4 because it just does not handle this unit very well.*/


 #TableHeader {
  background-color: #fff;
  color: #393e3a;
 }
 /*#TableHeader sets the background color of the header cell to #393e3a and sets text color to #CCCCCC (light gray)*/
 /***End Product Table***/

/*Item Table holds content for product and subcategory pages*/
.itemTable {
  padding: 0;
  font-size: 1em;
  background-color:#ececec;
  text-align: center;
 }
.itemTable tr td{
  padding: 0;
  margin: 0;
  background-color:#ececec; }
/* flexible button for input, checkout, etc.- need hand and pointer descriptions for different browsers*/


a.ovalbutton{
background: transparent url(../wcsstore/B2BDirectStorefrontAssetStore/images/layout/goldButton_left.gif) no-repeat top left;
display: block;
float: left;
font: normal 13px Tahoma; /* Change 13px as desired */
font-weight: bold;
line-height: 16px; /* This value + 4px + 4px (top and bottom padding of SPAN) must equal height of button background (default is 24px) */
height: 24px; /* Height of button background height */
padding-left: 11px; /* Width of left menu image */
text-decoration: none;
}

a:link.ovalbutton, a:visited.ovalbutton, a:active.ovalbutton{
color: #393e3a; /*button text color*/
}

a.ovalbutton span{
background: transparent url(../wcsstore/B2BDirectStorefrontAssetStore/images/layout/goldButton_right.gif) no-repeat top right;
display: block;
padding: 4px 25px 4px 0; /*Set 11px below to match value of 'padding-left' value above*/
}

a.ovalbutton:hover{ /* Hover state CSS */
background-position: bottom left;
}

a.ovalbutton:hover span{ /* Hover state CSS */
background-position: bottom right;
color: #393e3a;
}

.buttonwrapper{ /* Container you can use to surround a CSS button to clear float */
overflow: hidden; /*See: http://www.quirksmode.org/css/clearing.html */
width: 100%;
}

/* end flexible buttons */

input.search {
  font-family:Tahoma;
  background-color:#fff;
  /* font-size: 0.95em; */
  border: groove thin #977f09;
  padding-left: 5px;
  padding-top: 0px;
}
img.searchImage {
width: 17px;
height: 16px;
border: none; cursor:pointer;}

/*input.checkout_btn { width: 100px; height: 16px; background:url(../images/assets/btn100x16_2.gif) top center no-repeat; border: none; color: #fff; font-size: 1em; cursor:pointer; padding: 0px 5px 3px 5px !important; }*/

input.qty_btn {
  width: 25px;
  /*height: 13px;*/
  background:url(../wcsstore/B2BDirectStorefrontAssetStore/images/assets/btnQty.gif) center no-repeat;
  /*cursor:pointer;*/
  font:Tahoma;
  background-color:#ececec;
  color:#393e3a;
  font-size: 0.95em;
  text-align: center;
  vertical-align: baseline;
  line-height: 1.2em;
  border: 1px solid #C6A429;
}

/****COMMENT BLOCK STYLE DIV********/

.commentbox{
  background-color: #ececec;
  width: auto;
  padding: 0px;
  text-align:left;
  font-size: 0.9em;
  text-transform: uppercase;
  line-height: 1.5em;
}

.commentfooter{
background: url(../wcsstore/B2BDirectStorefrontAssetStore/images/assets/arrow-white.gif) no-repeat bottom left; /*20px 0 equals horizontal and vertical position of arrow. Adjust as desired (ie: 20px -5px). Habegger is not using*/
padding-left: 5em;
padding-top: .125em;
margin-top: 2em;
font-size: .8em;
text-indent: 30px;
color: #393e3a;
}


/*================== FOOTER ==================*/
#outerWrapper #footer {
  background-color: #fff;
  border-top: solid 1px #c6a429; /* Sets the top border properties for an element using shorthand notation */
  padding: 10px 10px 10px 10px; /* Sets the padding properties for an element using shorthand notation (top, right, bottom, left) */
  font-size: 0.8em;
  clear:both;
}
/*==================CART PAGES FOOTER ==================*/
#outerWrapper #cfooter {
  background-color: #fff;
  padding: 10px 10px 10px 10px; /* Sets the padding properties for an element using shorthand notation (top, right, bottom, left) */
  font-size: 0.8em;
  clear:both;
}

/*Site Colors
Text Black - #393e3a
Gold - #C6A429
Dark Gold - #977f09
Brown - #775E08
Green - #135721
Light Grey - #999