/* CSS Document */
/*TYPOGRAPHY
----------------------------------------------------*/
body {
	margin: 0px;
	padding: 0px;
	color: #666;
	font-family: verdana, tahoma, sans-serif;
	font-size:62.5%;
	background-color: #dededd;
}
#printHeader{
	display: none;
	}
/*This makes sure that the font size stays the same in nested elements*/
TH, TD, LI LI, LI P, TD P, BLOCKQUOTE P {
	font-size:1em
	}
/*This sets the font size at 11px [but still allows font scaling]*/
#wrapper{
	font-size: 1.1em;
	line-height: 1.4em;
	}
p	{
	padding:0px;
	margin:0 0 10px 0;
	}
h1, h2, h3, h4, h5, h6{
	font-weight: normal;
	margin: 0 0 10px 0;
	padding: 0px;
	color: #ec6a0f;
	}
h1 {
	font-size: 24px;
	line-height: 28px;
}
h2 {
	font-size: 24px;
	line-height: 28px;
}

h3 {
	font-size: 1.2em;
	font-weight: bold;
	color: #666;
}
h4 {
	font-size: 1.1em;
	font-weight: bold;
	color: #807f7f;
}
h5 {
	font-size: 11px;
	font-weight: bold;
}
h6{
	font-size: .9em;
	line-height: 1.3em;
	font-weight: normal;
	}
A, A:active, A:visited   {
	COLOR: #ec6a0f;
	text-decoration: none;
	font-weight: bold;
	
}
A:hover {
	COLOR: #F59401;
	text-decoration: underline;
}

#hpWelcome A, #hpWelcome A:active,  #hpWelcome A:visited 
{
    COLOR: #E50004;
	text-decoration: none;
	font-weight: bold; 
}

#hpWelcome A:hover {
	COLOR: #F59401;
	text-decoration: underline;
}

#footer A, #footer A:active, #footer  A:visited   {
	COLOR: #999;
	text-decoration: none;
	font-weight: normal;
	padding: 0 20px;
}
#footer A:hover {
	COLOR: #666;
	text-decoration: underline;
}
input, select{
	font-size:10px;
	color: #666;
	}
strong {
	font-weight: bold;
	}
ol{
	padding:0 0 0 10px;
	margin: 0 0 10px 20px;
	}
ul{
	padding:0px;
	margin: 0 0 10px 15px;
	}
li{
	margin: 0 0 3px 0;
	padding: 0px;
	}
ul li{
	list-style: none;
	background-image: url(../images/arrow.gif);
	background-repeat: no-repeat;
	background-position: 1px 5px;
	padding: 0 0 0 12px;
	}
a img {
	border: none;
	}
	
	
	
/*STRUCTURE
----------------------------------------------------*/
html, body {
	height: 100%;
	}
#holder{
	background-image: url(../images/bg_wave.gif);
	background-repeat: repeat-x;
	background-position: center top;
	background-color: #fff;
}
#wrapper { 
 margin: 0 auto;
 width: 922px;
 padding-bottom: 0px;
}

#header {
	position: relative;
	height:176px;
	z-index: 100;
}
#logo{
	position: absolute;
	top: -1px;
	left: -60px;
	}
#leftCol, #midCol, #singleCol{
	float: left;
	}
#leftCol{
	width: 156px;
	}
#midCol{
	width: 425px;
	margin-left:30px;
	padding: 0px;
	z-index:1;
	overflow:hidden; /*Here to fix a bug in IE6*/
	}	
#rightCol{
	float: right;
	width: 269px;
	}
#singleCol{
	width: 724px;
	margin-left:30px;
	z-index:1;
	}
#footer {
	text-align: center;
	background-image: url(../images/bg_footer.gif);
	background-repeat: repeat-x;
	background-position: center top;
	padding: 100px 0 20px 0;
	background-color: #DEDEDD;
	text-transform: lowercase;
}
.clear { clear: both; background: none; }





/*NAVIGATION
----------------------------------------------------*/
#navbar{
	position: absolute;
	right: -9px;
	top:0px;
	width: 622px;
	z-index: 100;
}
#nav, #nav ul {
	padding: 0;
	margin: 0;
	list-style: none;
	line-height: 1.4em;
	z-index: 100;
}

#nav a {
	font-weight: bold;
	color: #e4e4e4;
	text-decoration: none;
	display: block;
}
#nav a:hover {
	color: #fff;
	text-decoration: none;
}
#nav li li a {
	display: block;
	font-weight: normal;
	color: #e4e4e4;
	padding: 0.2em 10px;
	width: 10.2em;
}

#nav li li a:hover {
	padding: 0.2em 5px;
	border: 5px solid #f4a503;
	border-width: 0 5px;
	color: #fff;
	text-decoration: none;
}

#nav li li:hover {
	background-color: #e95d13;
}

#nav li {
	float: left;
	/*width: 10em;*/
	padding:0;
	margin: 0;
	height: 25px;
	position: relative;
	background-image: none;
	z-index: 100;
}
#nav li ul {
	position: absolute;
	width: 12em;
	left: -999em;
	background-color: #0b4295;
	z-index: 100;
}
#nav li li{
	border-bottom: 1px solid #eb6c5c;
	margin: 0;
	padding: 0;
	background-color: #e2331d;
	height: auto;
	z-index: 100;
}
#nav li:hover ul, #nav li.sfhover ul {
	left: auto;
	top: 34px;
	z-index: 100;
	direction: ltr; /*This is here because IE is shithouse*/
}
/*SUBNAV
----------------------------------------------------*/
#subNav{
	padding:0px;
	margin: 0 0 20px 0px;
	}
#subNav li{
	list-style: none;
	background-image: url(../images/arrowYellow.gif);
	background-repeat: no-repeat;
	background-position: 1px 9px;
	margin:0;
	padding: 5px 0 5px 12px;
	border-top: 1px solid #fbe1b4;
	}
#subNav li ul{
	margin: 3px 0 0 10px;
	}
#subNav li ul li{
	background-image: none;
	margin: 0 0 3px 0;
	padding: 2px 0 1px 0px;
	border-top: none;
	font-size: .9em;
}
#subNav A, #subNav A:active, #subNav A:visited   {
	COLOR: #E50004;
	text-decoration: none;
	
}

#subNav A:hover {
	COLOR: #E50004;
	text-decoration: underline;
}
#subNav li ul li a{
	font-weight: normal;
	}
#subNav li ul li .current  {
	color: #e50004;
	font-weight: bold;
	}
/*HOMEPAGE
----------------------------------------------------*/
#hpContent{}
#hpLeftCol, #hpMidCol, #hpRightCol{
	float: left;
	}
#hpLeftCol{
	width: 143px;
	}
#hpMidCol{
	width: 566px;
	padding: 0 0 0 23px;
	position: relative;
	z-index:1;
	}
#hpRightCol{
	width: 143px;
	float: right;
	}
.fam{
	position: absolute;
	top: -141px;
	right: -6px;
	z-index: 1;
	width: 332px;
	height: 250px;
	}
.hpPromo{
	margin-bottom: 20px;
	}
#hpWelcome{
	z-index:1;
	margin-bottom: 15px;
	}
#hpCarousel{
	background-image:url(../images/carousel_bg.jpg);
	background-repeat: repeat-x;
	position: relative;
	height: 160px;
	width: 567px;
	font-size: 1.2em;
	color: #80807f;
	}
	
.hpCarouselPanel{
	background-image:url(../images/carousel_bg.jpg);
	background-repeat: repeat-x;
	height: 160px;
	width: 567px;
	overflow: hidden;
	}
.cImg{
	position: absolute;
	top:10px;
	left:10px;
	}
.cText{
	position: absolute;
	width: 321px;
	top: 20px;
	left: 180px;
	}
.cControls{
	position: absolute;
	top: 7px;
	right: 7px;
	width: 45px;
	height: 17px;
	text-align: right;
	}
#yFact{
	background-image: url(../images/YF_bottom.jpg);
	background-repeat: no-repeat;
	background-position: left bottom;
	color: #f4a503;
}
#yFact p{
	padding: 0 12px 15px 12px;
	}
/*SEARCH
----------------------------------------------------*/
#search{
	position: absolute;
	right: 7px;
	top: 50px;
	}
#search #field{
	margin: 0;
	height: 14px;
	padding: 3px 2px 3px 7px;
	background: none;
	border: none;
	background-color: none;
	background-image: url(../images/bg_search.gif);
	background-repeat: no-repeat;
	background-position: left center;
	color: #666;
	width: 95px;
	}
#search #butt{
	margin:0;
	padding: 0;
	}
	
	
/*PACK SIZE TABS
----------------------------------------------------*/
#tabsB {
	float:left;
	width:100%;
	font-size:93%;
	line-height:normal;
	background-color: #FFFFFF;
	background-image: url("../images/ttl_packsizes.gif");
	background-repeat: no-repeat;
	background-position: 1px 16px;
	padding: 0 0 0 80px;
      }
#tabsB ul {
	  margin:0;
	  padding:10px 10px 0px 0px;
	  list-style:none;
      }
#tabsB li {
      display:inline;
      margin:0;
      padding:0;
      }
#tabsB a {
      float:left;
      background:url("../images/tableftB.gif") no-repeat left top;
      margin:0;
      padding:0 0 0 4px;
      text-decoration:none;
      }
#tabsB a span {
      float:left;
      display:block;
      background:url("../images/tabrightB.gif") no-repeat right top;
      padding:5px 15px 4px 6px;
      color:#666;
      }
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabsB a span {float:none;}
/* End IE5-Mac hack */
#tabsB a:hover span {
      color:#fff;
      }
#tabsB a:hover {
      background-position:0% -42px;
      }
#tabsB a:hover span {
      background-position:100% -42px;
      }
	  
	  
/*MISC
----------------------------------------------------*/
.zebraStripe{
	background-color: #E5E5E5;
	}
#RHC{
	background-image: url(../images/RHC_mid.gif);
	background-repeat: repeat-y;
	position: relative;
	padding-bottom:1px;
}
#RHC .new{
	position: absolute;
	top: -10px;
	right: -10px;
	}
#RHC .productShot{
	
	}
.RHCtxt{
	padding: 10px 20px 0 20px;
	}
.dotPoints{
	padding:0px;
	margin: 0 0 10px 0px;
	}
.dotPoints li{
	margin: 0 0 3px 0;
	list-style: none;
	background-image: url(../images/bigBullet.gif);
	background-repeat: no-repeat;
	background-position: 1px 5px;
	padding: 0 0 0 25px;
	}
.nData{
	font-size: .9em;
	}
.nData td.quantity {
	text-align: center;
	}	
.tableHeader{
	background-color:#f39c05;
	color: #fff;
	font-weight: bold;
	line-height: 1.3em;
}
.newTxt{
	background-color:#f7e686;
	color: #FF6600;
	text-transform: uppercase;
	font-size: .9em;
	}
.featProd{
	background-image: url(../images/featProd.jpg);
	background-repeat: no-repeat;
	padding: 11px;
	height:199px;
}
.featProd .txt{	
	padding: 7px 10px 0 10px;
	width:310px;
	color: #807f7f;
}
.FPpic{
	float:right;
	margin-left:8px;
	}
#productMatrix{
}
#productMatrix .brand{
	float: left;
	height: 100px;
	width: 100px;
	padding: 10px;
	position: relative;
	}
.newSml{
	position: absolute;
	top:-10px;
	left:-10px;
	}
.newSml2{
	position: absolute;
	/*left: 220px;
	bottom: 180px;*/
	}
.packshot{
	margin: 10px auto;
	}
.error{
	color: #ff0000;
	}
label, .fakeLabel{
	font-weight: bold;
	color: #A7A7A7;
	}
img.bigBullet{
 margin-top: 5px;
 }	
 
 #poll{
	font-size: .9em;
	line-height: 1.1em;
	padding-left:5px;
	}

#poll h2 {
	margin-bottom: 3px;
	}