html{color:#666;background:#FFF;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,select,option,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}
li{list-style:none;}
caption,th{text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}
sup{vertical-align:text-top;}sub{vertical-align:text-bottom;}
input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}
input,textarea,select{*font-size:100%;}
legend{color:#000;}
super{vertical-align:super;}
del,ins{text-decoration:none;}

body {font: normal 10px/12px Arial, Helvetica, sans-serif; color: #666;}
.content {padding: 140px 0 30px 0;}
.page, .popup, .modal {position: relative; font-size: 1.1em; line-height: 1.1em;}
.page {width: 998px; margin: 0 auto; padding-bottom: 4em; background: #ffffff url(/assets/images/bg_top.jpg) no-repeat;}
.popup {margin-top: 15px; padding: 100px 30px 30px; background: #ffffff url(/assets/images/bg_pop.jpg) no-repeat;}
.popup h1 {margin: 0;}
.popup p {padding: 1em 0;}

a {text-decoration: none; color: #0090d4;}
a:hover {text-decoration: underline;}
a:focus { outline: none; }
h1 {font: bold 2.4em/30px "Arial Rounded MT Bold", Arial, Helvetica, sans-serif; color: #09a2dc; margin: 0 0 30px 64px; text-indent: -9000px;}
h2 {font-size: 1.6em; font-weight: bold; line-height: 1.2em; padding-bottom: 1em;}
h3 {font-size: 1.4em; font-weight: bold; line-height: 1.2em;}
p {line-height: 1.4em;}
strong {font-weight: bold;}

div.error, label.error, .error span.required, span.error {color: #d70000 !important;}
#errorContainer, span.required {color: #000;}
.right {float: right;}
.left {float: left;}
.disclaimer {font-size: .9em;}
.phone, .letter {padding-left: 5em; margin-top: 1em;}
.phone {background: url(/assets/images/icon_phone.gif) no-repeat;}
.letter {background: url(/assets/images/icon_letter.gif) no-repeat;}

.page .right {padding-right: 60px; width: 590px;}
.page .left {padding-left: 66px; width: 246px;}

.page .right_confirm {padding: 20px 85px 65px 38px; width: 227px; height: 257px; float: right; background: url(/assets/images/paper_small.jpg) no-repeat;}
.page .left_confirm {padding-left: 60px; width: 590px; float: left;}
.right_confirm h2 { padding-bottom: 0px; }
.right_confirm p {margin: 1em 0;}

.paper {background: url(/assets/images/paper_bg_mid.gif) left repeat-y;}
.paper .top {background: url(/assets/images/paper_bg_top.gif) left top no-repeat; padding: 20px 40px 0;}
.paper .bottom {background: url(/assets/images/paper_bg_bottom.jpg) left bottom no-repeat; padding: 0 40px 70px;}
.paper .middle {padding: 0 40px;}
.paper p {padding: .8em 0 1em;}

fieldset div {float: left; padding: 0 15px 8px 0;}
fieldset div.required {float: none; clear: left;}
div.ff label {display: block; line-height: 1.5em;}
input {vertical-align: middle;}
input.text {width: 126px; line-height: 1.5em;}
input[maxlength="100"] {width: 18em;}
input[maxlength="50"], input[maxlength="65"] {width: 11.5em;}
input[maxlength="10"] {width: 5em;}
textarea {height: 6.5em; width: 43em; line-height: 1.1em; font-family: Arial, Helvetica, sans-serif;}
legend {color: #666; font-weight: bold; font-size: 1.2em; padding: 1.2em 0 .5em;}
.bottom div {float: none;}
.inputList {display: block;}
table.inputList {width: 100%; border-collapse: collapse; display: table;}
.inputList td {vertical-align: top;}
.inputList label {line-height: 2em; padding: 0 0 0 5px;}
.submit {margin: 1em 0; vertical-align: bottom;}

/******************************************* Global Header *******************************************/
ul.nav li {float: left;}
ul.header 
{
    left:678px;
    position:absolute;
    top:29px;
    width:300px;
}
ul.header li a 
{
    display: block; 
    height: 32px; 
    background: url(/assets/images/top_nav_new.png) no-repeat;
}
ul.header li a:hover,
ul.header li a.active
{
    height: 36px;
}
ul.header li a span {display: none;}
ul.header li.navH a 
{
    background-position: -328px -29px;
    width:70px;
}
ul.header li.navH a:hover, 
ul.header li.navH a.active 
{
    background-position: -328px -60px;
}
ul.header li.navCA a 
{
    width: 120px; 
    background-position: -405px -29px;
}
ul.header li.navCA a:hover, 
ul.header li.navCA a.active 
{
    background-position: -405px -60px;
}

ul.header li.navFC a 
{
    width: 110px; 
    background-position: -530px -29px;
}
ul.header li.navFC a:hover, 
ul.header li.navFC a.active 
{
    background-position: -530px -60px;
}
ul.header li.navAP a 
{
    width: 100px; 
    background-position: -640px -29px;
}

ul.header li.navAP a:hover, 
ul.header li.navAP a.active
{
    background-position: -640px -60px;
}
ul.header li.navR a 
{
    width: 95px; 
    background-position: -745px -29px;
}
ul.header li.navR a:hover, 
ul.header li.navR a.active 
{
    background-position: -745px -60px;
}
ul.header li.navGC a 
{
    width: 125px; 
    background-position: -848px -29px;
}
ul.header li.navGC a:hover, 
ul.header li.navGC a.active 
{
    background-position: -848px -60px;
}


.footer {clear: both;}
.footer ul li {padding: 0 11px; color: #cbcbcb;}
.footer ul li a {color: #cbcbcb;}
.footer ul li a:hover, .footer ul li a.active {color: #424242;}
.footer .legal {clear: left; color: #cbcbcb; padding: 10px 11px;}

.footer .legal ul { margin-top: 5px; }
.footer .legal ul li { padding: 0;}

.logo, .logo a {display: block; width: 120px; height: 120px; background: url(/assets/images/bg_top.jpg) -58px -20px no-repeat;}
.logo {text-indent: -3000px; top: 20px; left: 58px; position: absolute; z-index:100;}

.main {
	margin: 0 auto;
	width: 1000px;
}
.main h4, .main h5 {display: none;}
.main #CA ul li { width: 500px; float: left;}
.main #CA ul li#Melissa a,
.main #CA ul li#Joan a {
	display: block;
	width: 500px;
	height: 400px;
	text-indent: -3000px;
}
.main #CA ul li#Melissa, .main #CA ul li#Melissa a {
	background: url(../images/CA_Melissa.jpg) no-repeat;
}
.main #CA ul li#Joan, .main #CA ul li#Joan a {
	background: url(../images/CA_Joan.jpg) no-repeat;
}
.main #CA ul li#Melissa a:hover,
.main #CA ul li#Joan a:hover {
	background-position: 0 -400px;
}
.main #CA p {
	text-align: center;
	font: bold 1.5em Arial, Helvetica, sans-serif;
	position: absolute;
	top: 435px;
	left: 0px;
	width: 1000px;
}

.buckets {height: 88px; padding-top: 40px; clear: both;}
.buckets div {float: left; position: relative;}
.buckets div.mid {padding: 0 22px;}
.buckets div a:hover img {background: url(/assets/images/bucket_glow.png) top center no-repeat;}

.modal {background: #fff url(/assets/images/logo_modal.jpg) no-repeat; overflow: auto;}
.modal .intro {padding: 0 43px 10px 63px;}
.modal .intro p {font-size: 1.2em;}
.modal h1 {margin: 0;}
.modal .left {width: 577px; padding: 0;}
.modal .right {width: 340px; padding: 0;}

.modal .left .showcase {margin-bottom: 20px;}

.modal .left .video_buckets .bucket {background: url(/assets/images/modal_bucket_blue_thin.gif) no-repeat; padding: 10px; width: 260px; height: 59px; color: #fff;}
.modal .left .video_buckets .bucket h2 {padding-bottom: 0;}
.modal .left .video_buckets .bucket a {float: left; margin-right: 10px;}
.modal .left .video_buckets #melissa {float: left;}
.modal .left .video_buckets #joan {float: right;}

.modal .right .video_buckets .bucket {background: url(/assets/images/modal_bucket_blue_wide.gif) no-repeat;}

ul.rules li {margin-left: 1em; list-style-type: disc;}
ul.rules li li {list-style-type: circle;}
ul.rules li li li {list-style-type: square;}

h1.contact {background: #fff url(/assets/images/hdr_contact_us.gif) 0 0 no-repeat; margin-top: 20px;}
h1.contact_thanks {background: #fff url(/assets/images/hdr_thanks_feedback.gif) 0 0 no-repeat; margin-top: 20px;}

/******************************************* Product Detail Navigation *******************************************/
ul#productLanding {
	clear: both;
	width: 1000px;
	height:361px;
	background:url(/assets/images/product_landing.jpg) 0 0 no-repeat;
	position:relative;
	z-index:10;
}
ul#productLanding li {
 	float: left;
	height: 361px;
	text-indent: -3000px;
	position: relative;
	z-index:20;
}
ul#productLanding li.hover {
	z-index:30;
}
ul#productLanding li a {
	display: block;
	height: 361px;
}
ul#productLanding li#powders {
	width: 120px;
}
ul#productLanding li#smallmighty {
	width: 230px;
}
ul#productLanding li#ultra2x {
	width: 328px;
}
ul#productLanding li#freeclear {
	width: 254px;
}
ul#productLanding li#highefficiency {
	width: 177px;
}
ul#productLanding li#oxi-active {
	width: 184px;
}


ul#productNavStrip2 li ul li,
ul#productLanding li ul li {
    background: #fff url(/assets/images/bg_tooltip_bullet.gif) 0 12px no-repeat;
	padding: 6px 0 0 8px;
	text-indent: 0;
	float: none;
	display: block;
	margin:0;	
	height:auto;
}
ul#productNavStrip2 li li a,
ul#productLanding li li a {
	height: auto;
	line-height:1.2em;
}
ul#productNavStrip2 li h3 a,
ul#productLanding li h3 a {
	height:auto;
}

/******************************************* Product Detail Pages *******************************************/
#productInfo {
	float: left;
	width: 250px;
	margin-bottom: 28px;
}
#productInfo h1 {
	margin: 20px 0 0 0;
	padding: 0;
	letter-spacing: -0.05em;
	font-size: 2.6em;
	font-weight: normal;
}
#productInfo h1#powders {
	background: url(/assets/images/hdr_powders.gif) no-repeat top left;
	height: 20px;
}
#productInfo h1#smallmighty {
	background: url(/assets/images/hdr_smallmighty.gif) no-repeat top left;
	height: 25px;
}
#productInfo h1#ultra2x {
	background: url(/assets/images/hdr_2xultra.gif) no-repeat top left;
	height: 20px;
}
#productInfo h1#freeclear {
	background: url(/assets/images/hdr_freeclear.gif) no-repeat top left;
	height: 20px;
}
#productInfo h1#highefficiency {
	background: url(/assets/images/hdr_highefficiency.gif) no-repeat top left;
	height: 25px;
}
#productInfo h1#oxi-active {
	background: url(/assets/images/hdr_oxi-active.png) no-repeat top left;
	height: 25px;
}

#productInfo h1 sup {
	vertical-align: top;
	font-weight: normal;
	font-size: 0.6em;
}
#productInfo strong.subtitle {
	display: block;
	font: normal 1.3em/1em "Arial Rounded MT Bold", Arial, Helvetica, sans-serif;
	color: #09a2dc;
	letter-spacing: -0.02em;
	margin-top: 6px;
}
#productInfo p {
	margin: 20px 28px 14px 0;
	color: #777;
	font-size: 1.2em;
}
#productInfo #flavors strong, #productInfo #sizes strong {
	color: #666;
	font-size: 1.1em;
}
#productInfo #flavors ul {
	width: 260px;
	margin-top: 2px;
}
#productInfo #flavors ul li {
	float: left;
	width: 130px;
}
#productInfo #flavors ul li#freeclear3x,
#productInfo #flavors ul li#freeclear2x,
#productInfo #flavors ul li#freeclearhe {
	margin-right: 100px;
}
#productInfo #flavors ul li a {
	display: block;
	height: 20px;
	text-indent: -3000px;
}
#productInfo #flavors ul li#surfsparkling,
#productInfo #flavors ul li#surfaloha,
#productInfo #flavors ul li#surffloral,
#productInfo #flavors ul li#surfspring
 {
	text-indent: -4000px;
	height: 20px;
}
#productInfo #flavors ul li#dancingtropics a,
#productInfo #flavors ul li#wildflowers a {
	height: 32px;	
}
#productInfo #flavors ul li.active a { background-position: left -20px !important; }
#productInfo #flavors ul li#dancingtropics.active a { background-position: left -32px !important; }
#productInfo #flavors ul li#wildflowers.active a { background-position: left -32px !important; }

#productInfo #flavors ul li#surfsparkling.active a,
#productInfo #flavors ul li#surfaloha.active a,
#productInfo #flavors ul li#surffloral.active a,
#productInfo #flavors ul li#surfspring.active a,
#productInfo #flavors ul li#surfsparkling a:hover,
#productInfo #flavors ul li#surfaloha a:hover,
#productInfo #flavors ul li#surffloral a:hover,
#productInfo #flavors ul li#surfspring a:hover
 {
	background-position: left top;
	cursor: pointer;
}


#productInfo #flavors ul li#dancingtropics a:hover,
#productInfo #flavors ul li#wildflowers a:hover {
	background-position: left -32px;
}





#productInfo #sizes ul {
	margin-top: 6px;
}
#productInfo #sizes ul li {
	text-indent: -3000px;
	float: left;
	margin-right: 10px;
	background: #fff url(/assets/images/product_sizes.gif) no-repeat;
	height: 32px;
}

#productInfo #sizes ul li#size_32oz { background-position: 0 0; width: 15px; }
#productInfo #sizes ul li#size_50oz { background-position: -25px 0; width: 19px; }
#productInfo #sizes ul li#size_96oz { background-position: -54px 0; width: 23px; }
#productInfo #sizes ul li#size_100oz { background-position: -84px 0; width: 22px; }
#productInfo #sizes ul li#size_150oz { background-position: -116px 0; width: 28px; }
#productInfo #sizes ul li#size_172oz { background-position: -156px 0; width: 24px; }

#productInfo #sizes ul li#load_20 { background-position: 0 -34px; width: 18px; }
#productInfo #sizes ul li#load_40 { background-position: -25px -34px; width: 22px; }
#productInfo #sizes ul li#load_80 { background-position: -54px -34px; width: 27px; }
#productInfo #sizes ul li#load_120 { background-position: -88px -34px; width: 24px; }
#productInfo #sizes ul li#load_145 { background-position: -119px -34px; width: 23px; }
#productInfo #sizes ul li#load_160 { background-position: -149px -34px; width: 24px; }
#productInfo #sizes ul li#load_180 { background-position: -180px -34px; width: 23px; }

#productInfo #sizes {
	clear: both;
	padding-top: 14px;
}

#productDisplay {
	float: right;
	width: 701px;
	height: 357px;
	margin-bottom: 28px;
	position:relative;
}

#productDisplay p {
	margin: 0 auto;
	/*padding-top: 330px;*/
	width: 100%;
	text-align: center;
	font-size: 1.1em;
	position:absolute;
	bottom:0;
	left: 0;
	z-index: 50;
}

#productDisplay p span {
	width: 19px;
	height: 18px;
	position:relative;
	display:inline-block; /* ie needs this */
}
#productDisplay p span.quote_left {
	background: url(/assets/images/quote_left.gif) no-repeat;
}
#productDisplay p span.quote_right {
	background: url(/assets/images/quote_right.gif) no-repeat bottom right;
	margin-bottom:-4px;
}
#productDisplay p span span {
	display: none;
}

/******************************************* Product Detail Navigation *******************************************/
ul#productNavStrip2 {
	clear: both;
	width: 999px;
	position:relative;
	z-index:100;
	height: 85px;
	background: url(/assets/images/product_strip.jpg) no-repeat 0 0; /* adding superfluous/duplicate background here should resolve rollover flashing in ie6 */
}
ul#productNavStrip2 li {
	float: left;
	background: url(/assets/images/product_strip.jpg) no-repeat 0 0;
	height: 85px;
	text-indent: -3000px;
	position: relative;
	z-index:20;
}
ul#productNavStrip2 li.hover {
	z-index:30;
}
ul#productNavStrip2 li a {
	display: block;
	height: 85px;
}

ul#productNavStrip2 li#ultra2x 
{
	background-position: 0px 0px;
	width: 249px;
}
ul#productNavStrip2 li#ultra2x.active {
	background-position: 0px -85px;
	width: 249px;
}
ul#productNavStrip2 li#oxi-active {
	background-position: -249px 0;
	width: 249px;
}
ul#productNavStrip2 li#oxi-active.active {
	background-position: -249px -85px;
	width: 249px;
}
ul#productNavStrip2 li#freeclear {
	background-position: -501px 0px;
	width: 249px;
}
ul#productNavStrip2 li#freeclear.active {
	background-position: -497px -85px;
	width: 249px;
}
ul#productNavStrip2 li#smallmighty {
	background-position: -746px 0;
	width: 249px;
}
ul#productNavStrip2 li#smallmighty.active {
	background-position: -746px -85px;
	width: 249px;
}

/******************************************* Tooltips *******************************************/
.tooltip {
	width: 177px;
	visibility: hidden;
	position: absolute;
	bottom: 20px;
	right:50%;
	font-size: 1.1em;
	z-index: 100;
}
ul#productLanding .tooltip {
	bottom: 40px;
}
.tooltip strong {
	background: url(/assets/images/bg_tooltip_top.png) left top no-repeat;
	padding: 14px 20px 0 20px;
	display: block;
	text-indent: 0;
}
.tooltip ul {
	background: url(/assets/images/bg_tooltip_mid.png) left top repeat-y;
	padding: 0px 20px 8px 20px;
}
.tooltip ul li {
    background: #fff url(/assets/images/bg_tooltip_bullet.gif) 0 2px no-repeat;
	margin-left: 14px;
	padding-left: 7px;
	width: auto;
}
.tooltip a {
	font-weight: bold;
}
.tooltip h3 {
	background: url(/assets/images/bg_tooltip_header.png) 0px 0px;
	width: 100%;
	height: 31px;
	color: white;
	font-size: 1.075em; /* 13px */
	line-height: 31px;
	text-indent: 12px;
}
ul#productNavStrip2 li .tooltip h3 a {
    height:auto;
}
.tooltip h3 a, .tooltip h3 a:hover {
	color: white;
	text-decoration: none;
}

/* smallmighty tooltip needs to fall to the right instead of to the left because smallmighty is too close to the left and otherwise the tooltip would fall off the left side of the screen. */
#productLanding #powders .tooltip,
#productNavStrip2 #ultra2x .tooltip{
    right:auto;
    left:50%;
}
#productLanding #powders .tooltip h3,
#productNavStrip2 #ultra2x .tooltip h3{
    background:url(/assets/images/bg_tooltip_header_left.png);
    text-indent:18px;
}
#productLanding #powders .tooltip strong,
#productLanding #powders .tooltip ul,
#productNavStrip2 #ultra2x .tooltip strong,
#productNavStrip2 #ultra2x .tooltip ul {
    margin-left:6px;
}

h1.register 
{
    background: #fff url(/assets/images/hdr_register.gif) 0 0 no-repeat;
    margin-top: 20px;
}
h1.thanks {background: #fff url(/assets/images/hdr_coupon_thanks.gif) 0 0 no-repeat; margin-top: 20px;}

#PD #fc_recommended
{
    text-indent: 0px !important;
}

#PD { position: relative; }

#PD .htmlPopup
{
    left:300px;
    top: 10px;
}

/******************************************* HTML POPUPS *******************************************/
.htmlPopup
{
    width: 391px;
    
    z-index: 1000;
   
}

.htmlPopup .hd
{
    background-image: url(/assets/images/html_popup_top.png);
    background-repeat:no-repeat;
    font-size: 20px;
    color: #FFF;
    font-weight: bold;
    padding-left: 17px;
    padding-top: 16px;
    height: 32px;
    position:relative;
    line-height: 20px;
}

.htmlPopup .hd a
{
    display: block;
    width: 30px;           
    height: 30px;
    
    position: absolute;
    right: 15px;
    top: 10px;
}

.htmlPopup .bd
{
    background-image: url(/assets/images/html_popup_mid.png);
    background-repeat:repeat-y;
    color: #666666;
    font-size: 14px;
    margin-left: 1px;
    padding: 15px 25px;
    line-height: 1.4em;
    
    
}

.htmlPopup .bd .scrollable_content
{
    overflow:auto;
    margin-left: -1em;
    padding-left: 1em;
    padding-right: .5em;
    max-height: 250px;
    *height: 250px;
}

.htmlPopup .bd ul
{
    margin-left: -1em;
    margin-top: 5px;
}

.htmlPopup .bd ul li 
{
    margin-left: 1em; 
    list-style-type: disc;
}

.htmlPopup .bd h3
{
    font-size: 1.2em;
}

.htmlPopup .ft
{
    background-image: url(/assets/images/html_popup_bot.png);
    background-repeat:no-repeat;
    height: 8px;
    margin-left: 1px;
}

/* Large Popup */
.htmlPopupLarge
{
    width: 452px;
}
.htmlPopupLarge .hd
{
    background-image: url(/assets/images/html_popup_large_top.png);
    height: 30px;
}
.htmlPopupLarge .bd
{
    background-image: url(/assets/images/html_popup_large_mid.png);
}
.htmlPopupLarge .ft
{
    background-image: url(/assets/images/html_popup_large_bot.png);
    height: 12px;
}
/******************************************* Free Clear Home *******************************************/


#FC
{
    margin-top: 25px;
    position:relative;
}

#FC .htmlPopup
{
    right: 50px;
    top: 120px;
}

#tagline
{
    margin: 0 auto;
    padding-right: 30px;
    position: relative;
    display:block;
}

#free_clear_bg
{
    margin-top: -20px;
}

/***************************************** Oxi-Active Home *********************************************/
.marquis 
{
	text-indent: 0px;
}