/* 
 ----------------------------------------------------------------------------
  Please check for cross-browser compatibility prior to making changes
  MINIMUM BROWSER CHECK :: IE5.x/IE6/Firefox/Safari

  CSS Document - layout.css
 ---------------------------------------------------------------------------- 
*/


/* undo some default styling of common (X)HTML browsers
 * ------------------------------------------------------------------------- */

/* No list-markers by default - must redefine bullets w/ bg graphics */
ul,ol { list-style:none; }

/* Avoid browser default inconsistent heading font-sizes and pre/code */
h1,h2,h3,h4,h5,h6,pre,code,td { font-size:1em; }

/* Remove inconsistent (among browsers) default padding or margin */
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input,label,div,dd,dt,dl,table,tr,td { margin:0; padding:0; }

/* prevent blue linked image borders */
a img,:link img,:visited img,fieldset { border:none; }


/* global elements
 * ------------------------------------------------------------------------- */


/* ----- type selectors ----- */ 
body { 
	background:#fff url("../images/bkgd-spacer.gif") top repeat-x;
	text-align:center; 
	font:12px/20px Verdana, Arial, Helvetica, sans-serif; 
	color:#545557;
	}

blockquote { 
	margin-left:10px; 
	margin-right:10px; 
	}

h1	{ font-size:1.2em; color:#000; }
h2	{ font-size:1.1em; color:#000; }
h3	{ font-size:1.0em; color:#000; }

h1 span,h2 span,h3 span	{ display:none; }

a:link,a:visited	{ color:#545557; text-decoration:underline; outline:none; }
a:hover,a:active	{ color:#545557; text-decoration:none; outline:none; }

/* ----- classes ----- */

div.clear	{ 
	clear:both;
	height:.01em; 
	overflow:hidden; 
	}

p.back-to-top {
	text-align:right;
	display:block;
	padding-right:15px;
	background:url("../images/bullet-back-to-top.jpg") right no-repeat;
	}
	
img.img-left { 
	float:left; 
	margin:2px 10px 10px 0; 
	}

img.img-left-u { 
	float:left; 
	margin:5px 10px 5px 0; 
	}
	
img.img-right { 
	float:right; 
	margin:5px 0 10px 5px; 
	}

	

/* framework
 * ------------------------------------------------------------------------- */

#wrap {
	background:url("../images/bg-wrap.jpg") repeat-y;
	width:924px;
	margin:0 auto;
	text-align:left;
	}

#wrap1 {
	background:#fff;
	width:600px;
	margin:0 auto;
	text-align:left;
	}
	

/* ----- EXPAND YOUR LINE PAGE ----- */

/* ----- column-left ----- */

#column-left {
	width:360px;
	float:left;
	}
	
	#column-left p { margin:0 35px 10px 23px; }
	
	#column-left h1 { font-family: "Tahoma", Verdana, Arial, Helvetica, sans-serif; text-transform:uppercase; color:#25408f; padding:22px 0 10px 23px; font-size:1.2em;}
	
	#lefter { background:url("../images/lefter.jpg") repeat-y; margin: 47px 0 0 33px; height:699px;}
	
	/* single column list */
	#column-left ul { padding-left:5px; }
		#column-left ul li { 
			background:transparent url("../images/bullet.jpg") 0px 6px no-repeat;
			padding-left:10px; /* pushes text to the right to display bg img */
			}

	/* multi column list */
	#column-left ul { padding-left:5px; } 
		#column-left ul li { 
			background:transparent url("../images/bullet.jpg") 0px 6px no-repeat;
			padding-left:10px;  /* pushes text to the right to display bg img */
			float:left;
			width:150px;
			line-height:20px; 
			}
	
	/* definition list */
	#column-left dl { padding-left:5px; }
		#column-left dl dt {
			font-weight:bold;
			color:#99CC00;
			}
		#column-left dl dd {
			background:transparent url("../images/bullet.jpg") 0px 6px no-repeat;
			padding-left:10px;  /* pushes text to the right to display bg img */
			margin-left:5px;
			}
			
/* ----- column-right ----- */

#column-right {
	width:564px;
	float:left;
	background:url("../images/right-blue-btm.jpg") bottom right no-repeat;
	}

	#column-right p { margin:0 30px 10px 15px; }
	
	#column-right h2 { font-family: "Tahoma", Verdana, Arial, Helvetica, sans-serif; text-transform:uppercase; color:#25408f; padding:5px 30px 8px 15px; font-size:1.2em;}
	
	#column-right h2.first { padding-top:70px; }
	 
	/* single column list */
	#column-right ul { margin:0 30px 10px 15px; }
	
	#column-right ul { padding-left:15px; }
		#column-right ul li { 
			background:transparent url("../images/blue-bullet.gif") 0px 6px no-repeat;
			padding-left:10px;  /* pushes text to the right to display bg img */
			}
	
	/* definition list */
	#column-right dl { padding-left:5px; }
		#column-right dl dt {
			font-weight:bold;
			color:#99CC00;
			}
		#column-right dl dd {
			background:transparent url("../images/bullet.jpg") 0px 6px no-repeat;
			padding-left:10px;  /* pushes text to the right to display bg img */
			margin-left:5px;
			}



/* ----- HOME PAGE ----- */

#tradeshow {width:864px; height: 37px; background:url(../images/orange-tradeshow.gif) no-repeat; margin:0 0 15px 30px;}
	#tradeshow p { padding:9px 0 0 28px; text-transform:uppercase; }

#main-bt { background:url(../images/orange-people.jpg) top left no-repeat; height:188px; margin-left:30px; }
	
	#main-bt h2 { color:#f36b21; text-transform:uppercase; font-size:1.2em; margin:0 0 5px 344px; padding-top:34px; }
	#main-bt p { margin:0 40px 0 344px;}


#naturally { background:url(../images/natural-bkgd.gif) no-repeat; height:148px; margin:30px 0 20px 30px;}

	#naturally h2 { color:#f36b21; text-transform:uppercase; font-size:1.2em; margin:0 32px 5px 32px; padding-top:42px; }
	#naturally p { margin:0 180px 0 32px;}
	
#homeTransition{
background:url(../images/homeSpacers_02.jpg) no-repeat;
height:40px;
width:924px;
margin:0px;
padding:0px;
}


	
/* ----- BUILD YOUR BRAND PAGE ----- */

#build-your-brand h1, #build-your-brand h2 { color:#4aab42; text-transform:uppercase;}

#build-gutter {width: 860px; padding:47px 0 0 40px;}

#build-top { background:url(../images/build-top-img.jpg) top left no-repeat;  }

#build-top h1 { margin:0 0 12px 235px; padding-top:10px; }
#build-top p { margin:0 55px 8px 235px; }

#build-left { width:583px; float:left; background:url(../images/build-left.jpg) bottom left no-repeat; height:346px; position:relative; }

#build-left h2 { margin:20px 60px 12px 270px; font-size: 1.2em;}
#build-left p { margin:0 32px 8px 270px; }
#build-left h3 { position:absolute; display:block; top:278px; left:180px; width:225px; font-style: italic; font-family: Georgia, "Times New Roman", Times, serif; font-size: 1.5em; color:#fff; font-weight:normal;}


#build-right { width:277px; float:left; background:url(../images/build-right-spacer.gif) repeat-y; margin-top:20px;}

#build-right p { margin:0 25px 8px 25px; }
#build-right-tp { background:url(../images/build-right-tp.gif) top no-repeat; height:21px; }
#build-right-bt { background:url(../images/build-right-bt.gif) top no-repeat; height:23px; }





/* ----- LICAPS PAGE ----- */

#licaps-liquid-capsules h1, #licaps-liquid-capsules h2 { color:#c60505; font-size:1.2em; text-transform:uppercase; margin-bottom:8px;}

#licaps-liquid-capsules p { margin: 0 0 8px 0;}

#licaps-gutter {width: 864px; padding:58px 0 0 30px;}

#licaps-top { background:url(../images/licaps-tp-img.gif) bottom right no-repeat; }

	#licaps-top h1 { margin:0 233px 8px 10px; }
	#licaps-top p { margin:0 233px 8px 10px; }

#licaps-md { background:url(../images/licaps-md.jpg) no-repeat; height:285px; margin:20px 0;}

	#licaps-md h2 { margin:0 48px 8px 283px; padding-top:15px;}
	#licaps-md p { margin:0 40px 8px 283px;}
	#licaps-bt { background:url(../images/licaps-md-bt.gif) no-repeat; height:34px;}



/* ----- INDUSTRY SUPPORT PAGE ----- */

#industry-gutter {width: 860px; padding:47px 0 0 40px;}

	#industry-main {background:url(../images/industry-girl.jpg) bottom left no-repeat; } 
	
	#industry-main h1 { margin:0 0 15px 253px; color:#03a0db; text-transform:uppercase; font-size:1.2em;}
	
	#industry-main p { margin: 0 0 8px 253px;}
	
#industry-quote { background:url(../images/industry-quote.gif) bottom right no-repeat; height:118px; margin:0 0 15px 0;}

	#industry-quote p { color:#fff; padding:20px 130px 0 12px;}
	
	#industry-quote a:link, #industry-quote a:visited	{ color:#fff; }
	#industry-quote a:hover, #industry-quotea:active	{ color:#fff; }




/* ----- CONTACT PAGE ----- */

#contact-gutter {width: 830px; padding:47px 0 0 40px;}

#c-left { width:465px; float:left; }
	
	#c-left h1 { margin:0 0 15px 0; color:#4b2781; text-transform:uppercase; font-size:1.2em;}
	
	#c-left p { margin:0 0 8px 0;}

#c-right { width:365px; float:left; }




/* ----- UNIVERSITY PAGE ----- */

#university-gutter { width: 854px; padding:58px 0 0 40px; }

#university h1, #university h2 { color:#033065; font-size:1.2em; text-transform:uppercase; }

#u-top { background:url(../images/u-tp.gif) top right no-repeat; }

	#u-top h1 { margin:0 230px 8px 0px; }
	#u-top h2 { margin:0 230px 8px 0px; padding-top:10px; }
	#u-top p { margin:0 230px 8px 0px; }

	#u-class-left { width:425px; float:left; }
	
		#u-class-left h3 { font-size:1.2em; color:#545557; margin:0 30px 5px 0; padding-top:13px; }
	
		#u-class-left p { margin:0 30px 8px 0;}
	
	#u-class-right { width:425px; float:left; }
	
		#u-class-right h3 { font-size:1.2em; color:#545557; margin:0 0 5px 20px; padding-top:13px; }
		
		#u-class-right p { margin:0 0 8px 20px;}

		#university-gutter .foot-note p{padding:50px 0;}
		
		
		
/* ----- bottom-wrap ----- */
 
#bottom-wrap {
	background:url("../images/footer.gif") no-repeat;
	/* border-bottom: 1px solid #918f90; */
	height:23px;
	clear:both;
	width:100%; /* fix for Safar */
	
	}

	
/* header framework
 * ------------------------------------------------------------------------- */

#header-graphic { height:413px; } /* sets height for all non-flash headers */

	body#index #header-graphic { background:url("../images/banner-orange.jpg"); }
	body#expand-line #header-graphic { background:url("../images/banner-blue.jpg"); }
	body#build-your-brand #header-graphic { background:url("../images/banner-green.jpg"); }
	body#licaps-liquid-capsules #header-graphic { background:url("../images/banner-red.jpg"); }
	body#industry-support #header-graphic { background:url("../images/banner-cyan.jpg"); }
	body#contact-us #header-graphic { background:url("../images/banner-purple.jpg"); }
	body#university #header-graphic { background:url("../images/banner-university.jpg"); }

#header-graphic span{ display: none; }

/* page-bg framework
 * ------------------------------------------------------------------------- */

#page-bg { width:924px; } 

	body#index #page-bg { background:url("../images/pg-bkgd-orange.jpg") no-repeat; }
	body#expand-line #page-bg { background:url("../images/pg-bkgd-blue.jpg") no-repeat; }
	body#build-your-brand #page-bg { background:url("../images/pg-bkgd-green.jpg") no-repeat; }
	body#licaps-liquid-capsules #page-bg { background:url("../images/pg-bkgd-red.jpg") no-repeat; }
	body#industry-support #page-bg { background:url("../images/pg-bkgd-cyan.jpg") no-repeat; }
	body#contact-us #page-bg { background:url("../images/pg-bkgd-purple.jpg") no-repeat; }
	body#university #page-bg { background:url("../images/pg-bkgd-university.jpg") no-repeat; }
	

/* heading framework
 * ------------------------------------------------------------------------- */

#heading { height:46px; }
#heading p { font-size: 2em; font-weight:bold; padding:7px 0 0 80px; line-height:normal; }

	body#index #heading { background:url("../images/heading-orange.jpg");}
		body#index #heading p { color:#fcdac7; }
	body#expand-line #heading { background:url("../images/heading-blue.jpg"); }
		body#expand-line #heading p { color:#ced5e6; }
	body#build-your-brand #heading { background:url("../images/heading-green.jpg"); }
		body#build-your-brand #heading p { color:#d5eed3; }
	body#licaps-liquid-capsules #heading { background:url("../images/heading-red.jpg"); }
		body#licaps-liquid-capsules #heading p { color:#f4cdcd; }
	body#industry-support #heading { background:url("../images/heading-cyan.jpg"); }
		body#industry-support #heading p { color:#cdecf8; }
	body#contact-us #heading { background:url("../images/heading-purple.jpg"); }
		body#contact-us #heading p { color:#dbd4e6; }
	body#university #heading { background:url("../images/heading-university.jpg"); }
		body#university #heading p { color:#fef3d4; }
	


/* footer
 * ------------------------------------------------------------------------- */
 
#footer {
	width:924px;
	margin:0 auto;
	text-align:left;
	font-size:11px;
	font-family: "Tahoma", Verdana, Arial, Helvetica, sans-serif;
	}

#footer a:link, #footer a:visited { color:#545557; }

#footer a:hover, #footer a:active { color:#545557; }

#footer ul {margin:10px 0 20px 23px;}

#footer li { /* if your li's float, you can adjust border height w/ line-height */
	padding:0 3px 0 7px;
	display: inline;
	border-left: 1px solid #545557;
	}

	#footer li.first { border: none; }


/* Horozontal Sprite Nav
 * ------------------------------------------------------------------------- */

#nav { 
	background:url("../images/nav.gif") no-repeat; 
	width:924px; 
	height:40px; 
	margin:0;
	padding:0; 
	}

#nav span { display: none; }

#nav li, #nav a { height:40px; display:block; } /* change height here also */

#nav li { float:left; list-style:none; _display:inline; }

#nav-01 { width: 114px; margin-left: 20px;}
#nav-02 { width: 127px;}
#nav-03 { width: 146px;}
#nav-04 { width: 156px;}
#nav-05 { width: 124px;}
#nav-06 { width: 129px;}
#nav-07 { width: 92px;}


/*-------------- (-79px) X position of button / (-30px) height of image from above ------------- */
#nav-01 a:hover { background:url("../images/nav.gif")  -20px -40px no-repeat; }
#nav-02 a:hover { background:url("../images/nav.gif") -134px -40px no-repeat; }
#nav-03 a:hover { background:url("../images/nav.gif") -261px -40px no-repeat; }
#nav-04 a:hover { background:url("../images/nav.gif") -407px -40px no-repeat; }
#nav-05 a:hover { background:url("../images/nav.gif") -563px -40px no-repeat; }
#nav-06 a:hover { background:url("../images/nav.gif") -687px -40px no-repeat; }
#nav-07 a:hover { background:url("../images/nav.gif") -816px -40px no-repeat; }


/*-------------- OPTIONAL - Keeps the hover state on each page based on body #id ------------- */
body#index #nav-01 { background:url("../images/nav.gif")  -20px -40px no-repeat; }
body#build-your-brand #nav-02 { background:url("../images/nav.gif") -134px -40px no-repeat; }
body#SPECIFY #nav-03 { background:url("../images/nav.gif") -261px -40px no-repeat; }
body#licaps-liquid-capsules #nav-04 { background:url("../images/nav.gif") -407px -40px no-repeat; }
body#expand-line #nav-05 { background:url("../images/nav.gif") -563px -40px no-repeat; }
body#industry-support #nav-06 { background:url("../images/nav.gif") -687px -40px no-repeat; }
body#contact-us #nav-07 { background:url("../images/nav.gif") -816px -40px no-repeat; }


/* Son of Suckerfish: Horizontal Sprite Nav
 * ------------------------------------------------------------------------- */

#nav li ul {
	position:absolute;
	left:-9999px;
	padding-right:1px;			/* Fixes one px spacing for border-right in FF */
	background-color:#fff;	/* Background color of drop down nav - add more styles (i.e. background image) if you want */
	}

#nav li ul li { 
	height:20px; 				/* Height of each drop down nav item */
	border:1px solid #545557;
	border-top:none;
	}	

#nav li ul li a {
	width:100%;
	height:20px;				/* Height of each drop down nav item, should match above */
	line-height:20px;			/* Height of each drop down nav item again, should match above */
	}

#nav li ul li a span {
	display:block;
	padding-left:5px;
	}

/* Drop down link styles */
#nav a:link, #nav a:visited, #nav a:hover, #nav a:active {
	font-size:1.0em;
	color:#545557;
	text-decoration:none;
	}

#nav li:hover ul, #nav li.sfHover ul	{ left: auto; background-position: 0 0;}

/* Hover styles for drop down items */
#nav-06 ul a:hover, #nav-04 ul a:hover { 
	background-image:none;
	background-color:#efefef;
	color:#545557;
	text-decoration:none;
	}

/* width of drop down nav - choose width that allows items to display on one line */
#nav-06 ul, #nav-06 li { width:150px; }		



/* ----- feature-switcher ----- */

#f-switcher { padding:47px 0 0 30px;}

#switch-left { width:354px; float:left;}

#switch-right { width:510px; float:left; background:url(../images/feature-rt-bkgd.jpg) no-repeat; height:270px;}

#switch-right p { margin:0 5px 8px 10px}

.content-feature { z-index:2; position:absolute; width:500px; height:270px; left:-9999px; }

.top {padding-top:25px;}


#feater2 { background:url(../images/o-img-liquid.jpg) bottom right no-repeat; height:263px; }

	#feater2 .custom { margin:0 140px 8px 10px; padding-top:25px; }
	#feater2 .custom1 { margin:0 140px 0px 10px; }

#feater3 {background:url(../images/o-img-custom.jpg) bottom right no-repeat; }

	#feater3 .custom { margin:0 200px 0 10px;}

#feater4 {background:url(../images/o-img-clean.jpg) bottom right no-repeat; height:263px; }

	#feater4 .custom { margin:0 220px 0 10px; padding-top:25px; }

#feater5 { background:url(../images/o-img-instock.jpg) bottom right no-repeat; height:263px; }

	#feater5 .custom { margin:0 240px 0 10px; padding-top:25px; }


/* Vertical switcher
 * ------------------------------------------------------------------------- */

#nav-switcher {
	background:url("../images/feature-left.jpg") top left no-repeat;					
	width:354px;		/* Width of buttons, not entite image (or half of entire image) */
	height:270px;		/* Height of entire image */
	margin:0;
	padding:0;
	}

#nav-switcher li span { display: none; }

#nav-switcher li {
	float:left;
	list-style:none;
	cursor:pointer;
	}

#nav-switcher li, #nav-switcher a { 
	height:50px;			/* Each button must have the same height, define it here */
	display:block;
	}

/* margin-top to set where the nav should begin */
#nav-switcher-01 { margin-top:11px; width:354px; }

/* margin-top if there is a spacing between each nav button */
#nav-switcher-02, #nav-switcher-03, #nav-switcher-04, #nav-switcher-05, #nav-switcher-06 { margin-top:0; width:354px; }

#nav-switcher-01 a:hover { background:url("../images/feature-left.jpg") -354px  -11px no-repeat; }
#nav-switcher-02 a:hover { background:url("../images/feature-left.jpg") -354px  -61px no-repeat; }
#nav-switcher-03 a:hover { background:url("../images/feature-left.jpg") -354px  -111px no-repeat; }
#nav-switcher-04 a:hover { background:url("../images/feature-left.jpg") -354px  -161px no-repeat; }
#nav-switcher-05 a:hover { background:url("../images/feature-left.jpg") -354px -211px no-repeat; }


#whitepaper { height:803px; background:url(../images/pg-bkgd-whitepaper.jpg) no-repeat;}
#whitepaper { font:12px Verdana, Arial, Helvetica, sans-serif; color:#000; }
#whitepaper .masthead { padding-top:25px; padding-bottom:25px; padding-right:25px; }
#whitepaper .header { padding-top:25px; padding-bottom:25px; padding-right:12px; padding-left:12px; }
#whitepaper .masthead h1, .header h1 { margin-bottom:15px; font-size:30px; text-align:center; }
#whitepaper .masthead p { font-size:16px; text-align:center; }
.header.thankyou p { font-size:12px; text-align:left; margin-bottom:15px; }
.header .message { background:url("../images/message-bkgd.png") repeat-y 0px 0px; padding:20px 50px 20px 50px; }
#whitepaper .padding { padding-left:50px; padding-right:25px; padding-bottom:40px; }
#whitepaper .padding2 { padding-left:30px; padding-right:25px; padding-bottom:40px; }

.formbox { background:url("../images/form-top.png") no-repeat 0px 0px; float:left; width:330px; padding-top:15px; }
.formbox .content { background:#545557; width:330px; }

.formbox .step { padding-top:0px; padding-bottom:25px; padding-left:12px; color:#fff; border-bottom:1px solid #929395; }
.formbox .step .stepimgholder { display:block; float:left; }
.formbox .step p { font-size:11px; margin-bottom:15px; }
.formbox .step h3 { font-size:11px; margin-bottom:15px; color:#bec0c2; text-transform:uppercase; }
.formbox .step p.required { float:left; width:auto; margin-top:25px; padding-left:70px; }
.formbox .step strong { color:#f00; }
.formbox .step label { display:block; float:left; width:110px; margin-bottom:10px; text-align:right; font-size:12px; }
.formbox .step input.text { display:block; float:left; width:150px; margin-bottom:10px; margin-left:10px; }
.formbox .step input.radio {  }
.formbox .step input.checkbox { }
.formbox .step .choice { float:left; width:auto; padding-left:15px; }
.formbox .step .extended { float:left; width:250px; padding-left:10px; }
.formbox .step .check { float:left; width:15px; }
.formbox .padtop { padding-top:20px; }

#whitepaper input.submit { background:url("../images/form-btm.png") no-repeat 0px 0px; display:block; float:left; width:330px; height:62px; border:none; outline:none; cursor:pointer; }
#whitepaper .visitcap { background:url("../images/back-btn.png") no-repeat 0px bottom; position:relative; float:left; width:255px; height:62px; }
#whitepaper .visitcap a { position:absolute; width:255px; height:46px; top:16px; }
.formdetails { float:left; width:515px; padding-top:15px; }

#whitepaper .formdetails p { margin-bottom:12px; padding-left:25px; line-height:20px; color:#545557; font-size:12px; }
#whitepaper  .textholder { float:left; width:415px; margin-bottom:50px; font-size:14px; }
#whitepaper  .textholder .padding { padding:0px 10px 0px 15px; }
#whitepaper  .imgholder { float:left; width:100px; }
#whitepaper  .imgholder img { float:right; width:auto; }
#whitepaper  .textholder h2 { font-size:18px; margin-bottom:12px; }
#whitepaper  .textholder p { margin-bottom:12px; padding-left:0px; line-height:normal; color:#000; font-size:14px; }
#whitepaper  .textholder strong { 
  background:url("../images/icon-pdf.png") no-repeat right 0px; 
  display:block; 
  float:left; 
  width:auto; 
  height:16px; 
  line-height:16px; 
  padding-right:25px; 
  font-size:10px; 
}

#whitepaper .download  { padding-top:25px; padding-bottom:25px; border-bottom:1px solid #929395; }
#whitepaper .download.last  { border-bottom:none; }
#whitepaper .download .button { float:left; width:175px; }
#whitepaper .download .button img { display:block; margin-top:10px; }
#whitepaper .download .text { float:left; width:670px; }
#whitepaper .download .text .textholder { width:570px; margin-bottom:0px; }
#whitepaper a.back { 
  background:url("../images/back-btn-download.png") no-repeat 0px 0px; 
  display:block; 
  float:right; 
  width:252px; 
  height:46px; 
}