@charset "UTF-8";
@import url(base.css);

/* ----------------------------------------------------------------------------------
     TAG ONLY STYLES
---------------------------------------------------------------------------------- */
body {
	background-color: #023051;
	color: #fff;
	font: 1em/1.1em "Lucida Grande", Calibri, Tahoma, sans-serif;
}

a:link { color: #fff; }
a:visited { color: #fff; }
a:hover { color: #0055a5; }
a:active { color: #de4e61; }

hr {
   margin: 0.5em -9px;
   border: 1px dotted #999;
   border-width: 1px 0 0 0;
   color: #fff;
   background-color: #fff;
   padding: 0;
}

cite {
	display: block;
	margin: 1em 0 0 4em;
	font-size: .9em;
	font-style: italic;
}

/* ----------------------------------------------------------------------------------
     TABLE STYLES
---------------------------------------------------------------------------------- */
#mainContent table {
	line-height: 1.5em;
	margin-left: 20px;
	border-collapse: collapse;
}

caption {
	color: #000;
	font-size: 1em;
	font-weight: normal;
	padding: 4px 0 0 0;
	text-align: left;
}
thead th {
	font-weight: bold;
	text-align: center;
	vertical-align: top;
	border-bottom: 1px solid black;
	padding: 0px 4px;
	background: #4b96ca;
}
tbody th {
	font-weight: bold;
	text-align: left;
	vertical-align: top;
	padding: 2px 0px;
}
tbody td {
	padding: 1px 0px;
}
tbody.center td {
	text-align: center;
}
tbody tr.sum td {
	font-weight: bold;
	padding: 4px 0px;
	border-top: 2px solid black;
	color: #000;
	background: #fff;
}
tbody tr.odd {
	background: #4b96ca;
}

#topGlow {
	position: absolute;
	top: 0;
	z-index: 2;
	background:transparent url(../images/glow/gradient_overlay.png) repeat-y top center;
	height: 70px; /* header */
	width: 100%;
}

/* ----------------------------------------------------------------------------------
     HEADER STYLES
---------------------------------------------------------------------------------- */
#header {
	padding: 0 20px;
	margin: 0;
	position: relative;
	height: 70px;
	background:transparent url(../images/glow/header_background.gif) repeat-x bottom left;
}

#header h1 {
	background-image: url(../images/glow/header_activent_logo.gif) ;
	background-position: top left;
	background-repeat: no-repeat;
	text-indent: -99999px;
	position: absolute;
	bottom: 12px;
	height: 40px;
	width: 180px;
}

#header h2 {
	font-weight: bold;
	font-style: italic;
	font-size: .8em;
	line-height: .75em;
	color: #e3eff6 ;
	position: absolute;
	bottom: 12px;
	left: 210px;
}

#phoneOrderInfo {
	font-size: .8em;
	position: absolute;
	right: 20px;
	bottom: 12px;
}

#phoneOrderInfo #phoneNumber {
	font-size: 1.5em;
	font-weight: bold;
}

ul#distChannels {
	position: absolute ;
	top: 0;
	right: 20px;
	list-style-type: none;
	padding: 0;
	margin: 0;
	font-size: .7em;
	line-height: 1em;
	z-index: 3; /* componsate for topGlow */
}

ul#distChannels li {
	float: right;
	text-align: center;
}

ul#distChannels a {
	display: block;
	padding: 3px 8px 5px 8px;
	margin-left: 2px;
	background-color: #4b96ca;
	line-height: 1.1em;
}

ul#distChannels a:visited {
	color: #fff;
}

ul#distChannels a:hover {
	color: #023051;
	background-color: #fff;
}

ul#distChannels .directSales a {
	background-image:url(../images/glow/directSales_button.gif);
	background-position: center right;
	background-color: transparent;
	padding-right: 13px;	
}

ul#distChannels .directSales a:hover {
	background-image:url(../images/glow/directSales_button-over.gif);
}

/* ----------------------------------------------------------------------------------
     NAV STYLES
---------------------------------------------------------------------------------- */
/* For outer div, without this, nav stops at floated area only or 100% extends nav off to right */
#nav {
	background: #4b96ca url(../images/glow/gradient_overlay.png) repeat-y top center;
	font-size: .9em;
	float: left; /* contain floated list items */
	width: 100%;
}

#body_hom #nav_hom a,
#body_abo #nav_abo a,
#body_man #nav_man a,
#body_faq #nav_faq a,
#body_tes #nav_tes a,
#body_com #nav_com a,
#body_con #nav_con a,
#body_buy #nav_buy a,
#body_vid #nav_vid a {
	font-weight: bold;
	color: #023051;
}

#nav ul {
	list-style-type: none;
	padding: 0;
	padding-left: 19px;
	margin: 0 ;
	width: 960px;
}

#nav li {
	margin: 0;
	padding: 0;
	float: left;
	z-index: 3; /* componsate for topGlow */
}

#nav a {
	display: block; /* from float: left for drop-dwon */
	padding: 0 11px;
	text-align: center;
	text-decoration: none;
	line-height: 1.9;
	z-index: 3; /* componsate for topGlow */
}

#nav a:hover {
	color: #023051;
}

/* based on same notions as suckerfish (son of) */
#nav li ul {
	position: absolute;
	width: 10em;
	left: -999em;
	padding-top: 1px;
}

#nav li ul li {
	background-image: url(../images/glow/subnav_background.png);
	background-repeat: repeat-x;
	background-position: top left;
	width: 12em;
}

#nav li ul a {
	text-align: left;
}

#nav li:hover ul, #nav li.subnav ul {
	left: auto;
	z-index: 10;
}


/* ----------------------------------------------------------------------------------
     Content STYLES
---------------------------------------------------------------------------------- */
#content {
	background: #056db6  url(../images/glow/content_background.jpg) repeat-x bottom left;
	font-size: .8em;
	clear: both;
}

#content ul {
	padding-top: 1em;
	padding-bottom: 1em;
	margin-top: 0;
	margin-bottom: 0;
}

#content li {
	padding-top: .3em;
}

#content p {
	margin-top: .8em;
}

#content p.clear {
	margin-top: 0;
}

#content h3, #content h4 {
	margin-top: 1em;
	margin-bottom: .8em;
}

#content a, #content a:visited {
	text-decoration: none;
	background: url(../images/glow/link_underline_visited.gif) repeat-x left bottom;
	padding-bottom: 3px;
	color: yellow; /* #f6f060; */
}

#content a:visited {
	background-image: url(../images/glow/link_underline.gif);
	color: #fff;
}

#content a:hover {
	color: #00253f;
	background-image: url(../images/glow/link_underline_visited.gif);
}

#content a:active {
	color: #00253f;
	border-bottom: 1px solid #de4e61;
}

#content img.context {
	float: left ;
	padding: 0 9px 9px 0;
}

#content img.contextRight {
	float: right ;
	padding: 0 0 9px 9px;
}

#content a.noBorder {
	border: none;
	background-image: url(../images/utility/transparent_10x10.gif); /* Due to IE 6 bug could not set to none. */
}

#content .wrapper {
	margin: 0 auto;
	padding: 35px 25px;
	width: 955px;
}

#mainContent {
	position: relative;
	float: left;
	width: 555px;
}

#mainContent h3 {
	font-weight: normal;
}

#mainContent .top {
	height: 41px;
	background: transparent url(../images/glow/mainContent_top.png) no-repeat bottom left;
}

#mainContent .middle {
	margin: 0;
	padding: 0 30px 0 35px;
	background: transparent url(../images/glow/mainContent_background.png) repeat-y top left;
	min-height: 365px;
}

#mainContent .bottom {
	height: 42px;
	background: transparent url(../images/glow/mainContent_bottom.png) no-repeat top left;
}

.feature, .testimonial {
	position: relative ;
	float: right;
	width: 400px;
	padding: 0;
}

.feature h2, .testimonial h2 {
	font-weight: normal;
	font-style: normal;
	font-size: 1.3em;
	line-height: 1.3em;
	text-align: center;
}

.feature .top, .testimonial .top {
	height: 41px;
	background: transparent url(../images/glow/feature_top.png) no-repeat bottom left;
}

.feature .middle, .testimonial .middle {
	margin: 0;
	padding: 0 30px 0 35px;
	background: transparent url(../images/glow/feature_background.png) repeat-y top left;
}

.feature .middle {
	min-height: 120px;
}

.feature .middle .backdrop {
	position: relative;
	z-index: 2;
}

#content .testimonial p.first { /* long winded to overcome inheritance */
	margin: 0;
}

.feature .bottom {
	height: 42px;
	background: transparent url(../images/glow/feature_bottom.png) no-repeat top left;
}

.testimonial .bottom {
	height: 65px;
	background: transparent url(../images/glow/testimonial_bottom.png) no-repeat top left;
}

.feature .bottom .backdrop {
	position: absolute ;
	margin-left: 16px;
	margin-bottom: 18px;
	bottom: 0;
	left: 0;
	z-index: 1;
}

#stageContent .top {
	height: 41px;
	background: transparent url(../images/glow/stageContent_top.png) no-repeat bottom left;
}

#stageContent .middle {
	float: left;
	width: 955px;
	margin: 0;
	padding: 0 30px 0 35px;
	background: transparent url(../images/glow/stageContent_background.png) repeat-y top left;
}

#stageContent .bottom {
	clear:both;
	height: 42px;
	background: transparent url(../images/glow/stageContent_bottom.png) no-repeat top left;
}


/* ----------------------------------------------------------------------------------
     VIDEO CONTENT SECTION STYLES
---------------------------------------------------------------------------------- */
#videoContent {
	background: #006DB9 url(../images/glow/video_background.gif) repeat-x bottom left;
	clear: both;
}
#video {
	position: relative;
	margin: 0 auto;
	width: 1024px;
}


/* ----------------------------------------------------------------------------------
     FOOTER STYLES
---------------------------------------------------------------------------------- */
#footer {
	clear:both;
	position: relative;
	background-image: url(../images/glow/footer_background.gif);
	background-position: top left ;
	background-repeat: repeat-x ;
	padding: 12px 35px;
	height: 78px;
	font-size: .7em ;
}

#footer a {
	text-decoration: underline;
}

#footer #siteseal {
	position: absolute;
	top: 10px;
}

#footer #copyright {
	position: absolute;
	top: 30px;
	/* center */
	left: 50%;
	width: 400px;
	margin-left: -200px;
	text-align: center;
}

#footer #parentCompany {
	position: absolute ;
	right: 35px;
	top: 30px;
}

#footer #parentCompany img {
	vertical-align: text-top;
}

/* This is a controller "class". Use to identify elements that are related to direct
online sales so they can be removed dynmically when accessed by distributors */
.directSales {
	/* Set to display: none when viewing from distributor access point */
}