/* CSS Document */
html {background: #507623 url(../images/body-background.gif) repeat-x top;}
body {background: #417325 url(../images/body-background.gif) repeat-x top;padding:0px;margin:0px;font: 11px/14px Verdana, Arial, Helvetica, sans-serif;color: #79766E;}
#container {width:100%;background: url(../images/flower-background.jpg) no-repeat center top;
min-height:578px;
height:auto;
}
/* for understanding browsers */
/* for Internet Explorer */
/*\*/
* html #container {
height:578px;
}
/**/
#header { text-align: right; margin-left: auto; margin-right:auto; width:790px; background: url(../images/headerBg.gif) no-repeat;}
#topBar {height:71px;font: 12px/15px Arial, Helvetica, sans-serif;color: #d8fb8b;padding-right:12px;}
td { vertical-align: top;}
#phoneHead {
margin-right:15px;
margin-top:10px;
background: none;
font-size: 12px;
line-height:12px;
color: #628F2A;
clear:right;
}
ul#attribute {display: inline;list-style: none;padding:0px;margin:0px;color: #d8fb8b;}
ul#attribute li {display: inline;}
ul#attribute li a {display: block;text-decoration: none;float: right;padding: 0 25px 0 5px;color: #628f2a;margin-top:21px}
ul#attribute a:hover {color: #628f2a;}
ul#attribute li a.sitemap {background:url(../images/button-sitemap.gif) no-repeat 52px 50%;}
ul#attribute li a:hover.sitemap {background:url(../images/button-sitemap.gif) no-repeat 52px 50%;}
ul#attribute li a.print {background:url(../images/button-print.gif) no-repeat 32px 50%;}
ul#attribute li a:hover.print {background:url(../images/button-print.gif) no-repeat 32px 50%;}
#attribute form {margin:0px; padding:0px;}
#searchBar {float:right; margin:19px 0 0 10px; vertical-align:middle;}
.searchStyle {color: #628f2a;/*background-color: #f0f0eb;*/border: 1px solid #628f2A;}
#navBar {
height:29px;
text-align:center;
background: url(../images/navPost.gif) repeat-x bottom;
}
#navBar a .home {background:url(../images/button-home.png) no-repeat left 0px;}
#navBar a .company {background:url(../images/button-company.png) no-repeat left 0px;}
#navBar a .products {background:url(../images/button-products.png) no-repeat left 0px;}
#navBar a .buy {background:url(../images/button-buyNutrilife.png) no-repeat left 0px;}
#navBar a .support {background:url(../images/button-customerSupport.png) no-repeat left 0px;}
#navBar a .news {background:url(../images/button-newsEvents.png) no-repeat left 0px;}
#navBar a .contact {background:url(../images/button-contactUs.png) no-repeat left 0px;}
#navBar a:hover .home, #navBar a:hover .company, #navBar a:hover .products, #navBar a:hover .buy, #navBar a:hover .support, #navBar a:hover .news, #navBar a:hover .contact {background-position:left -29px;}
#navBar a:active .home, #navBar a:active .company, #navBar a:active .products, #navBar a:active .buy, #navBar a:active .support, #navBar a:active .news, #navBar a:active .contact {background-position:left -58px;}
#home #navBar a .home, #company #navBar a .company, #products #navBar a .products, #buy #navBar a .buy, #support #navBar a .support, #news #navBar a .news, #contact #navBar a .contact {background-position:left -58px;}
a:active, a:hover, a:focus{outline: none; -moz-outline:none;}
#contentContainer {width:790px;background: url(../images/content-backgroundRepeat.gif) repeat-y ; margin-left: auto; margin-right:auto;}
#content {background: url(../images/content-background.gif) no-repeat; padding:0 9px 0 9px; margin:0px; margin-bottom:10px;
min-height:410px;
height:auto;}
/* for understanding browsers */
/* for Internet Explorer */
/*\*/
* html #content {
height:410px;
}
/* ###################### sideBox Styles ###################### */
#subNav {
margin:0; /*padding-left:10px;*/
height:29px;
background: url(../images/subNavBG.gif);
line-height: 29px;
text-align: left;
padding-left: 10px;
}
#subNav a:hover {}
#subNav dl { margin:0px; font-size: 11px; padding-top:7px;}
#subNav dt {
margin:0px;
padding:0px;
float:left;
font: normal 11px/11px Verdana, Arial, Helvetica, sans-serif;
}
#subNav dt a, #subNav dt a:visited {
color:#346805;
text-decoration:none;
display:block;
padding:0px 7px 0px 7px;
border-right: 1px solid #498712;
line-height: 16px;
}
#subNav dt a:hover {
color: #1D3803;
}
/* ###################### sideBox Styles End ###################### */
#collage {margin-left:auto;margin-right:auto;width:772px;position:relative; clear:left;}
#footer {height:65px;width:790px;margin-left:auto;margin-right:auto;background: url(../images/footer-background.png) no-repeat; font: 12px Arial, Helvetica, sans-serif; clear:both;}
.footerRow1 {color:#FFFFFF;padding:0px; margin:0px; line-height:27px; margin-left:35px;}
.footerRow1 a, .footerRow1 a:hover {color:#FFFFFF; text-decoration:none;}
.footerRow2 {line-height:30px; color:#9e9d93; position:relative;}
.footerRow2 a {color:#838276; text-decoration:none; margin: 0 7px 0 7px;}
.footerRow2 a:hover {text-decoration:underline;}
#breadcrumbs {position:absolute;bottom:0px;left:0px;z-index: 99;margin:0px;padding:0px;height:24px;width:100%;font-size: 11px;}
#headerBar {background: #E8E7D6;}
#crumbs {padding:0;margin:0;list-style-type:none;}
#crumbs li {float:left;white-space:nowrap;background-color:#FFFFFF; line-height:24px; padding-bottom:0px;}
#crumbs a {/*display:block; float:left;padding:0 3px 0 3px;*/color:#6d6c65;text-decoration:none;}
#crumbs a:hover {text-decoration:underline;}
#crumbs img {display:block; float:left;}
#contentLeftCol { width:506px; margin:10px 0 10px 20px;}
#contentRightCol { width:194px; /*float:right;*/}
#contentRightColHeader { width:194px;background: url(../images/header-productDetails.gif) no-repeat; height: 26px;}
#sideNav {padding-bottom:2px; padding-top:1px;margin:0px;background: #f4f3e1 url(../images/sideNav-bottom.gif) no-repeat left bottom;}
#sideNav ul {display: block; list-style: none;padding:0px; margin:0 0 0 10px;}
#sideNav ul li {display:inline; abackground: url(../images/sideNavDivider.gif) no-repeat bottom; padding:0px; margin:0px;}
#sideNav ul li a {display:block;text-decoration: none;padding: 6px 0px 6px 30px;color: #0473c0;font: bold 12px Arial, Helvetica, sans-serif; border-bottom:1px solid #FFFFFF;}
#sideNav ul a:hover {color: #407AA6;}
#sideNav ul li a.description {background: url(../images/icon-description.gif) no-repeat 0px 50%;}
#sideNav ul li a:hover.description {background: url(../images/icon-description.gif) no-repeat 0px 50%;}
#sideNav ul li a.instructions {background: url(../images/icon-usageInstructions.gif) no-repeat 0px 50%;}
#sideNav ul li a:hover.instructions {background: url(../images/icon-usageInstructions.gif) no-repeat 0px 50%;}
#sideNav ul li a.safety {background: url(../images/icon-safety.gif) no-repeat 0px 50%;}
#sideNav ul li a:hover.safety {background: url(../images/icon-safety.gif) no-repeat 0px 50%;}
#sideNav ul li a.labels {background: url(../images/icon-labels.gif) no-repeat 0px 50%;}
#sideNav ul li a:hover.labels {background: url(../images/icon-labels.gif) no-repeat 0px 50%;}
#sideNav ul li a.buy {background: url(../images/icon-whereToBuy.gif) no-repeat 0px 50%;}
#sideNav ul li a:hover.buy {background: url(../images/icon-whereToBuy.gif) no-repeat 0px 50%;}
#sideNav ul li a.tips {background: url(../images/icon-tips.gif) no-repeat 0px 50%;}
#sideNav ul li a:hover.tips {background: url(../images/icon-tips.gif) no-repeat 0px 50%;}
.productThumb {
float:left;
}
.productThumb img{
}
.para01 {color:#5c8426;font-size: 14px;line-height: 16px;font-weight: bolder;margin:0px;padding-bottom:7px 0px 7px 0; margin-right:50px;}
/*h3 {color:#5c8426;font-size: 14px;line-height: 16px;font-weight: bolder; display:inline; margin:10px;margin-right:75px;padding-bottom:10px;}*/
.twenty { font-size:17px;}
a {color: #328EDA; text-decoration:none;}
a:hover {text-decoration:underline;}
h1 {
font-size: 22px;
line-height: 28px;
color: #5C8426;
margin: 0px;
padding: 0px;
}
h2 {
font-size: 13px;
line-height: 13px;
color: #5C8426;
padding:5px;
margin:4px 0;
background: #E8E7D6 url(../images/h2Bg.gif) repeat-y right;
}
h3 {font-size: 13px;line-height: 16px;color: #5C8426; padding:0px; margin:0px;}
p {margin:0px; padding:5px 0px; background:none;}
.info tr {border-bottom: 1px solid #E8E7D6;/*border-right: 1px solid #FAF9EB;*/}
.info td{background:#E8E7D6;padding:3px; padding-right:12px;/*border-bottom: 1px solid #E8E7D6;*/border-right: 1px solid #FFFFFF;}
.info th {text-align: justify;padding:3px;background:#E8E7D6;}
.info thead th {
color: #FFFFFF;
background: #81B41B;
}
.info tfoot th {
text-align: center;
font-weight: normal;
}
.info .alt td, .info .alt th {
background:#FFFFFF;
}
#center table {margin:10px 0;}
.info2 tr {}
.info2 td {padding:3px;padding-right:12px;border-right: 1px solid #E8E7D6;border-bottom: 1px solid #E8E7D6;}
.info2 th {text-align: justify;padding:3px; border-right: 1px solid #E8E7D6;border-bottom: 1px solid #E8E7D6;}
.info2 thead th {background: #E8E7D6;}
.info2 tfoot th {background: #FAF9EB;text-align: center;font-weight: normal;}
.features {
background: #74B31D repeat -2px top;
margin:0px;
color: #FAF9EB;
}
.innerFeatures {background: url(../images/feature-topBg.gif) no-repeat left top;
padding: 50px 4px 0 8px;
color: #E8E7D6;
line-height: 12px;
min-height:145px;
height:auto;}
/* for understanding browsers */
/* for Internet Explorer */
/*\*/
* html .innerFeatures {
height:145px;
}
.featurePic {float:left;}
.innerFeatures p { padding-left:70px; background:none; color:#FFFFFF;}
.innerFeatures h1 {color:#cffe95; font-size:13px; line-height: 14px; margin:0; padding:0 0 0 70px; background:none;}
.innerFeatures a {
margin-top:10px;
padding:2px;padding-top:1px;
background: #92cc39;
color: #cffe95;
border-top: 1px solid #cffe95;
border-right: 1px solid #4d8c14;
border-bottom: 1px solid #4d8c14;
border-left: 1px solid #cffe95;
font-weight: bold;
text-decoration: none;
}
.innerFeatures a:hover {
text-decoration: none;
}
ul, ol {/*padding:0px;*/ margin-top:0px; margin-bottom:0px;}
li { padding:0px; padding-bottom:8px; }
.clear { clear:both;}
.clearLeft { clear:left;}
#contentLeftCol ul {padding-top:5px; margin-top:0px;padding-bottom:5px; margin-bottom:0px;}
#contentLeftCol ol {padding-top:5px; margin-top:0px;padding-bottom:5px; margin-bottom:0px;}
#left { float:left; width:150px;}
#right { float:right; width:194px;}
#center { padding:0 200px 0 155px;}
#centerLeft { padding:0 200px 0 0; }
a:focus {-moz-outline: none;}
.pImages { width:400px; vertical-align:bottom;}
.pImages span { float:left; margin:5px 0; width:100px; text-align:center;}
.pImages span img{ display:block; margin-left:auto; margin-right:auto;}
.noPadding, .noPadding td { padding-right:0px; padding-left:0px;}
/*.hidden { display:none;}*/
.fLeft { float:left;}
h4 {
margin:0px;
padding:0px;
padding-bottom:3px;
padding-top:5px;
font-size: 12px;
line-height: 14px;
}
/* ###################### Forms Styles ###################### */
form { /* set width in form, not fieldset (still takes up more room w/ fieldset width */
margin: 0;
padding: 0;
/*min-width: 400px;
max-width: 500px;
width: 450px; */
}
form fieldset {
/ * clear: both; note that this clear causes inputs to break to left in ie5.x mac, commented out */
border-color: #000;
border-width: 1px;
border-style: solid;
padding: 10px; /* padding in fieldset support spotty in IE */
margin: 0;
}
form fieldset legend {
font-size: 14px; font-weight:bold /* bump up legend font size, not too large or it'll overwrite border on left */
/* be careful with padding, it'll shift the nice offset on top of border */
}
form label {
display: block; /* block float the labels to left column, set a width */
float: left;
width: 150px;
padding: 0;
margin: 5px 0 0; /* set top margin same as form input - textarea etc. elements */
text-align: right;
}
/*form fieldset label:first-letter { use first-letter pseudo-class to underline accesskey, note that */
/* text-decoration:underline; Firefox 1.07 WIN and Explorer 5.2 Mac don't support first-letter */
/* pseudo-class on legend elements, but do support it on label elements */
/* we instead underline first letter on each label element and accesskey */
/* each input. doing only legends would lessens cognitive load */
/* opera breaks after first letter underlined legends but not labels
}*/
form input, form textarea, form select {
/* display: inline; inline display must not be set or will hide submit buttons in IE 5x mac */
width:auto; /* set width of form elements to auto-size, otherwise watch for wrap on resize */
margin:5px 0 0 10px; /* set margin on left of form elements rather than right of
label aligns textarea better in IE */
}
form input#reset {
margin-left:0px; /* set margin-left back to zero on reset button (set above) */
}
textarea { overflow: auto; }
form small {
display: block;
margin: 0 0 5px 160px; /* instructions/comments left margin set to align w/ right column inputs */
padding: 1px 3px;
font-size: 88%;
}
form .required{font-weight:bold;} /* uses class instead of div, more efficient */
form br {
clear:left; /* setting clear on inputs didn't work consistently, so brs added for degrade */