﻿

/* general styles */

html{
	margin:0px;
	padding:0px;
}

body {
color: #4D4D4D;
font-family:'Trebuchet MS',Arial,helvetica,sans-serif;
font-size: 11px;
line-height: 1.8 em;
background: #a4b2c7;
margin:0px;
padding:0px;
}

a {
color:#0033CC;
text-decoration:none;
}

a:hover {
color: #820024;
}

a:visited {
color: #719bab;
}

a:visited:hover {
color: #820024;
}

h1{
font-family:Tahoma,Arial,helvetica,sans-serif;
font-size: 1.6em;
color: #820024;
margin: 15px 0 15px 0;
padding-left: 0px; 

}

h3 {
font-family:'Trebuchet MS',Arial,helvetica,sans-serif;
font-size:1.2em;
font-weight:bold;
color: #003d7d;
margin: 15px 0px 5px 0px;
padding:0px;
}

h2 {
font-family:'Trebuchet MS',Arial,helvetica,sans-serif;
font-size: 1.3em;
font-weight:normal;
color: #000;
margin: 10px 0px;
}

h2.serum{
font-family:'Trebuchet MS',Arial,helvetica,sans-serif;
font-size: 1.3em;
font-weight:bold;
margin-bottom:0px !important;
text-transform:uppercase;
color:#996633;
}


h3.prods {
font-family:Arial,helvetica,sans-serif;
font-size: 1.3em;
font-weight:bold !important;
color: #005595;
margin-top: 15px;
font-style: normal !important;
text-transform:uppercase;
background:transparent url(images/bordergrtop.gif) no-repeat bottom left;
padding-left:25px;
height:20px;
padding-top:5px;
padding-bottom:2px;
clear:both;
}
h1.serum {
	font-family:Arial,helvetica,sans-serif;
	font-size: 1.4em;
	font-weight: normal !important;
	color: #e2c296;
	font-style: normal !important;
	text-transform: uppercase;
	background: #6f1000 url(images/symbolepisilk.jpg) no-repeat center left;
	padding-left: 35px;
	height: 22px;
	padding-top:7px;

}

h3.indiv {
font-family:Arial,helvetica,sans-serif;
font-size: 1.4em;
font-weight:bold !important;
color: #a3c380;
margin: 5px 0px 5px 15px;
font-style: normal !important;
text-transform:uppercase;
padding-left:60px;
height:40px;
background:#ffffff url(images/ripple.gif) no-repeat center left;
}

h4{
font-family:'Trebuchet MS',Arial,helvetica,sans-serif;
font-size: 1.1em;
color:#996600;
font-weight:bold;
text-transform:uppercase;
margin:0px;

}
h4.serum{
font-family:Arial,helvetica,sans-serif;
font-size: 1.3em;
color: #005595;
font-weight:bold;
padding-top:0px;
position:relative;
top:10px;
margin-top:0px;
}

h4.studytitle{
background:#bc987c;
color:#617694;
font-weight: 800;
padding:2px 10px 3px 25px;
display: inline-block;
margin-top:25px;
line-height:1.3em;
clear:both;
font-size:1.2em;
background:transparent url(images/borderstudy.gif) no-repeat bottom left;

}
h5{
font-family:Arial,helvetica,sans-serif;
font-size: 1.1em;
color: #A46853;
margin: 15px;
}
h6{
font-family:Arial,helvetica,sans-serif;
font-size: 1.1em;
color: #f67c0a !important;
margin:0px;
text-align:center;
}
p {
margin: 0px 15px 15px 0px;
padding:0px;
}
/* form styles */
table.application{
text-align:center;
font:bold 1em;
background:transparent;
width:500px;
margin-left:45px;
margin-top:15px;
padding:5px;
}
tr.required {
color:#000;
font-weight:bold;
background:#94b2c7;
}
tr.required td {
text-align:right;}
tr.normal {
text-align:right;
font-weight:bold;
}

td.data{
text-align:left !important;
font-size:1em;
font-weight:bold;
width:60%;
}
tr.subheader{
width:60%;
padding:5px 0px 5px 0px;
height:25px;
background:#820024;
color:#ffffff;
font-weight:bold;
font-size:1em;
font-family:tahoma, arial, verdana, helvetica,sans-serif;
text-align:center;}

select#referral {
text-align:left;
font-size:1em;
font-weight:bold;
}
img.left {
float:left;
padding:5px 7px 0px 15px;
}
img.right {
float:right;
padding:5px 0px 0px 7px;
}
/* content boxes */

input.button {
font-weight:bold;
color:#ffffff;
background:#719bab;
border:1px solid #5182a0;
margin:0px 5px;
}

/* layout styles */

#container {
width: 910px;
height:auto;
margin: 0px auto !important;
background:transparent url(images/back1.jpg) repeat-y;
position:relative;
padding: 0px;
}

#banner {
height: 140px;
background:transparent url(images/hbr07banner.png)  no-repeat top left;
width:825px;
margin:0px auto;
padding:0px;
position:relative;
top:0px;
left:0px;
}

#banner h1 {
background: none;
visibility:hidden;
margin:0px;
}

#content {
	width: 615px;
	min-height: 100%;
	float: right;
	font-size: 1.2em;
	line-height: 1.4em;
	margin: 10px 0px 10px 0px;
	background:transparent;
	padding: 20px 65px 15px 0px;
	overflow: auto;
	position: relative;
	z-index:1;
}


* html #content {
margin-left: -10px;
}

#content2 {
width: 635px;
min-height:100%;
float:right; 
font-size:1.1em;
line-height:1.4em;
margin: 0px 0px 10px 0px;
background:#ffffff;
padding: 0px 0px 15px 0px;
position:relative;
right:30px;
visibility: inherit;}


* html #content2 {
margin-left: -10px;
}
* html #sidebar {
margin-left: 26px;
}
#sidebar {
float:left;
width: 150px;
margin:0px 0px 0px 50px;
height:auto;
color: #666666;
font-family:'Trebuchet MS',Tahoma,helvetica,sans-serif;
font-size:1em;
padding-left:0px;
padding-right:5px;
background:#fff;
}

#sidebar ul {
text-align:left;
list-style:none;
margin:5px 0px;
padding:0px;

}

#sidebar li {
margin:2px 0px 0px 0px;
font-weight:bold;

}

#sidebar a, #sidebar a:visited {
color:#ffffff;
text-decoration:none;
font-weight:bold;
font-size:1em;
width:145px;
display:block;
background:transparent url(images/button1.png);
padding:8px 0px 8px 10px;
border-bottom:1px #dfc77f solid;
font-weight:bold !important;
}

#sidebar a:hover{
background:transparent url(images/button2.png);
color:#ffffff;
}

#sidebar h4{
font-family: Tahoma, sans-serif;
font-size: 1.2em;
color: #a67d3d;
text-decoration:underline;
font-weight:bold;
}
#sidebar p {
margin: 0px 5px 10px 15px;
}
#sidebar h3{
font-family: Tahoma, sans-serif;
font-size: 1.4em;
text-transform:uppercase;
text-align:center;
color: #698b69;
margin-top: 5px;
padding:15px 0px 4px 0px;
background:transparent;
font-weight: 800;
font-style:normal;
}
img.left {
float:left;
padding:5px 7px 0px 25px;
}
img.right {
float:right;
padding:5px 0px 0px 7px;
}

#productmenu a  {
background:#e6e6fa !important;
color:#154458 !important;
}
#productmenu a:visited {
background:#e6e6fa !important;
color:#154458 !important;
}
#productmenu a:hover{
border-left:#154458 5px solid;
background:#5182a0 !important;
color:#e6e6fa !important;
}
#cartbuttons a  {
background:#a3c380 !important;
color:#ffffff !important;
}
#cartbuttons a:visited {
background:#c0c0c0 !important;
color:#154458 !important;
}
#cartbuttons a:hover{
border-left:#f67c0a 5px solid;
background:#cd853f !important;
color:#ffffff !important;
}
#events {
background:#ffffff;
margin:0px 0px 0px 0px;
padding:0px 0px 0px 0px;
text-align:center;}






/* product links menu2 */
#price {
padding-bottom:5px;
font-weight:bold;
font-size:1.1em;
padding-top:10px;
margin-bottom:15px;
font-family:'Trebuchet MS',Arial,Verdana, sans-serif;
text-align:center;
}

*html #prods-section{
margin-top:0px;}
#prods-section {
color:#154458;
font-weight:bold;
font-size:1em;
background:transparent url(images/bordergr.gif) no-repeat bottom right;
text-align:right;
margin:0px 0px 15px 5px;
width:550px;
padding-top:10px;
padding-right:20px;
padding-left:0px;
padding-bottom:2px;
position:relative;
right:0px;
}

#prods-section ul {
margin:5px 0px 5px 0px;
}

#prods-section li {
list-style-type: none;
display: inline;
margin: 0px 5px 0 4px;
}

#prods-section a:link, #prods-section a:visited {
text-decoration: none;
background:transparent url(images/arrow2.gif) no-repeat center left;
color:#719bab;
padding-left:12px;
}

#prods-section a:hover, #prods-section a:visited:hover{
text-decoration: none;
background:transparent url(images/arrow.gif) no-repeat center left;
color:#a46853;
padding-left: 12px;
}
/* serums product section bottom */
*html #serumbot{
margin-top:0px;}
#serumbot {
color:#e2c296;
font-weight:bold;
font-size:1em;
background:#6f1000 url(images/symbolepisilk2.jpg) no-repeat bottom right;
text-align:right;
margin:0px 0px 15px 5px;
width:550px;
padding-right:30px;
position:relative;
right:0px;
height:30px;
}

#serumbot ul {
margin:5px 0px 5px 0px;
}

#serumbot li {
list-style-type: none;
display: inline;
margin: 0px 5px 0px 4px;
}

#serumbot a:link, #serumbot a:visited {
text-decoration: none;
background:transparent url(images/serumarrow1.jpg) no-repeat bottom left;
color:#e2c296;
padding-left:16px;
position:relative;
top:1px;
height:16px;
padding-top:15px;
padding-bottom:2px;
}

#serumbot a:hover, #serumbot a:visited:hover{
text-decoration: none;
background:transparent url(images/serumarrow2.jpg) no-repeat bottom left;
color:#a46853;
padding-left: 16px;
}

/* footer */
#info-site {
clear: both;
width:700px;
height:auto;
text-align: center;
background:transparent;
margin: 0px auto;
padding: 10px 0 0px 170px;
position:relative;
}

#info-general {
padding: 3px;
margin: 10px 16px 0px 10px!important;
color: #154458;
}

#info-general a,#info-general a:visited {
color: #5182a0;
}

#info-general a:hover,#info-general a:visited:hover {
color: #b2c4d2;
}	
#info-company {
padding: 3px;
margin: 2px 16px 0px 10px!important;
color: #154458;
}

#info-company a,#info-company a:visited {
color: #5182a0;
}

#info-company a:hover,#info-company a:visited:hover {
color: #b2c4d2;
}

#info-standards{
font-size: 10px;
padding: 0;
margin: 5px !important;
}



#feature ul{
list-style:none;
}
#feature li{
list-style:disc;
line-height:1.6em;
font-size:1.1em;
font-weight:bold;
display: inline-block;
padding-left:5px;
color: #820024;
}
#feature li a{
color:#6e86a8;
}
#feature li a:hover{
color:#bca47c;
}


*html #prods-sectiontop{
margin-top:0px;}
#prods-sectiontop {
color:#154458;
font-weight:bold;
font-size:1em;
background:transparent url(images/bordergrtopr.gif) no-repeat top right;
text-align:right;
margin:0px 0px 15px 5px;
width:550px;
padding-top:2px;
padding-right:20px;
padding-left:0px;
padding-bottom:5px;
position:relative;
left:40px;
}

#prods-sectiontop ul {
margin:5px 0px 5px 0px;
}

#prods-sectiontop li {
list-style-type: none;
display: inline;
margin: 0px 5px 0 4px;
}

#prods-sectiontop a:link, #prods-sectiontop a:visited {
text-decoration: none;
background:transparent url(images/arrow2.gif) no-repeat center left;
color:#719bab;
padding-left:12px;
}

#prods-sectiontop a:hover, #prods-sectiontop a:visited:hover{
text-decoration: none;
background:transparent url(images/arrow.gif) no-repeat center left;
color:#a46853;
padding-left: 12px;
}

/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/final_drop2.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the assocaited (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
/* style the outer div to give it width */
#nav
{
	margin:0px !important;
	padding:0px;
}
.menu {
width:825px !important; 
font-size:0.85em;
z-index:3;
position:relative;
margin-left:42px;
}
/* remove all the bullets, borders and padding from the default list styling */
.menu ul {
padding:0 !important;
margin:0 !important;
list-style-type:none;

}
.menu ul ul {
width:165px;
}
/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu li {
float:left;
width:165px;
padding:0px !important;
position:relative;
font-weight:bold;
}
/* style the links for the top level */
.menu a, .menu a:visited {
display:block;
font-size:12px;
text-decoration:none; 
color:#fff; 
width:154px; 
height:30px; 
border-top:1px solid #003d7d; 
border-right:1px solid #003d7d;
background:#005595 url(images/navbk.jpg); 
padding-left: 15px;
padding-left:10px !important; 
line-height:29px;
}
/* a hack so that IE5.5 faulty box model is corrected */
* html .menu a, * html .menu a:visited {
width:165px;
w\idth:154px;
}

/* style the second level background */
.menu ul ul a.drop, .menu ul ul a.drop:visited {
background:#93b2c7;
color:#fff !important;
}
/* style the second level hover */
.menu ul ul a.drop:hover{
background:#820024;
color:white;
}
.menu ul ul :hover > a.drop {
background:#820024);
}
/* style the third level background */
.menu ul ul ul a, .menu ul ul ul a:visited {
background:#820024;
color:#fff;
border-top:1px solid #fff; 
}
/* style the third level hover */
.menu ul ul ul a:hover {
background:#003d7d;
color:#fff;
}
.menu ul ul ul :hover > a {
background:#003d7d;
color:#fff;
}

/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul {
visibility:hidden;
position:absolute;
height:0;
top:31px;
left:0; 
width:165px;

}
/* another hack for IE5.5 */
* html .menu ul ul {
top:30px;
t\op:31px;
}

/* position the third level flyout menu */
.menu ul ul ul{
left:165px; 
top:0;
width:165px;
}
/* position the third level flyout menu for a left flyout */
.menu ul ul ul.left {
left:-165px;
}

/* style the table so that it takes no part in the layout - required for IE to work */
.menu table {position:absolute; top:0; left:0;}

/* style the second level links */
.menu ul ul a, .menu ul ul a:visited {
background:#a4b2c7; 
color:#003d7d; 
height:auto; 
line-height:1em; 
padding:8px 0px; 
width:154px
/* yet another hack for IE5.5 */
}
* html .menu ul ul a{
width:165px;
w\idth:154px;
}


/* style the top level hover */
.menu a:hover, .menu ul ul a:hover{
color:#820024; 
background:transparent url(images/navbk2.jpg);
}
.menu :hover > a {
color:#820024;
background:transparent url(images/navbk2.jpg);
}
.menu ul ul :hover > a {
color:#fff;
background:#820024;
}

/* make the second level visible when hover on first level list OR link */
.menu ul li:hover ul,
.menu ul a:hover ul{
visibility:visible; 
}
/* keep the third level hidden when you hover on first level list OR link */
.menu ul :hover ul ul{
visibility:hidden;
}
/* keep the fourth level hidden when you hover on second level list OR link */
.menu ul :hover ul :hover ul ul{
visibility:hidden;
}
/* make the third level visible when you hover over second level list OR link */
.menu ul :hover ul :hover ul{ 
visibility:visible;
}
/* make the fourth level visible when you hover over third level list OR link */
.menu ul :hover ul :hover ul :hover ul { 
visibility:visible;
}

