/* Created by John Henry Muller : johnhenrymuller.com */

/*********** TABLE OF CONTENTS START ***********\

1. Interface Styles
2. Shared Content Styles
3. Unique Content Styles

\*********** TABLE OF CONTENTS END *************/

/* ////////// 1. Interface Start ////////// */

/* Set to Zero */
* {
	margin: 0px;
	padding: 0px;
	border: 0px;
	}
/* No Dotted Lines */
a {
	outline: none;
	}
:focus {
	-moz-outline-style: none;
	}
/* Background */
body {
	background-color:#F0F0ED;
	}
/* Global Text */
body, p {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:10px;
	color:#333333;
	}
/* Global Links */
a, a:link,a:active, a:visited {
		color: #666666;
		text-decoration: underline;
		}
		a:hover, a:visited:hover {
	color: #49B3CD;
	text-decoration: underline;
			}

/* Header */
#header {
	height: 87px;
	background-image: url(../../images/interface/header_bg.jpg);
	background-repeat: no-repeat;
	}

/* Logo */
#header h1 {
	width: 300px;
	height: 64px;
	display: block;
	float: left;
	}
	#header h1 a {
	text-indent: -9999px;
	overflow: hidden;
	width: 300px;
	height: 64px;
	display: block;
	}

/* Backgrounds */
#wrap1 {
	background-image: url(../../images/interface/wrap_bgvert.jpg);
	background-position: center top;
	background-repeat: repeat-y;
	background-color: #77776D;
	}
#wrap2 {
	background-image: url(../../images/interface/wrap_bghorz.jpg);
	background-position: center top;
	background-repeat: repeat-x;
	}
#wrap3 {
	background-image: url(../../images/interface/wrap_bgmain.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	}
#container {
	margin-right: auto;
	margin-left: auto;
	padding-top: 48px;
	width: 760px;
	}
/* Layout */
#contentwrap {
	clear: both;
	}
#content {
	clear: both;
	}
#footer {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	line-height: 110%;
	color: #999999;
	padding-bottom: 20px;
	background-image: url(../../images/interface/footer_bg.jpg);
	height: 20px;
	background-repeat: repeat-x;
	background-color: #F0F0ED;
	clear: both;
	}
	#footer a, #footer a:link, #footer a:active, #footer a:visited {
			color: #999999;
			text-decoration: none;
			}
			#footer a:hover, #footer a:visited:hover {
				color: #00FFFF;
				text-decoration: underline;
				}
	#footer #copyright {
		width: 720px;
		margin-right: auto;
		margin-left: auto;
		background-image: url(../../images/interface/copyright_bg.jpg);
		background-repeat: no-repeat;
		background-position: center top;
		padding-top: 18px;
		padding-right: 40px;
		padding-left: 40px;
		}

/* NAVIGATION */
#navigation {
	clear: both;
	height: 21px;
	}
	#navigation li {
		list-style-type: none;
		display: block;
		float: left;
		}
	#navigation a {
		background-position: left top;
		display: block;
		height: 21px;
		text-indent: -9999px;
		}
		#navigation a:hover {
			background-position: left -21px;
			}
/* Graphic Nav */
	#navhome a { background-image:url(../../images/interface/navigation/home.jpg); width: 85px;}
	#navproducts a { background-image:url(../../images/interface/navigation/products.jpg); width: 98px;}
	#navformulaorigin a { background-image:url(../../images/interface/navigation/formulaorigin.jpg); width: 134px;}
	#navskincaretips a { background-image:url(../../images/interface/navigation/skincaretips.jpg); width: 127px;}
	#navpress a { background-image:url(../../images/interface/navigation/press.jpg); width: 78px;}
	#navcontactus a { background-image:url(../../images/interface/navigation/contactus.jpg); width: 112px;}
	#navwheretofind a { background-image:url(../../images/interface/navigation/wheretofind.jpg); width: 126px;}

/* "ON" Navigation State */
	#home #navhome a { background-position: bottom;}
	#products #navhproducts a { background-position: bottom;}
	#formulaorigin #navformulaorigin a { background-position: bottom;}
	#skincaretips #navskincaretips a { background-position: bottom;}
	#press #navpress a { background-position: bottom;}
	#contactus #navcontactus a { background-position: bottom;}
	#wheretofind #navwheretofind a { background-position: bottom;}
		/* Product Nav */
		.prnav1 #pnavantiaging a { background-position: bottom;}
		.prnav2 #pnavoilbalancing a { background-position: bottom;}
		.prnav3 #pnavbodycontouring a { background-position: bottom;}
	
/* PRODUCTS NAV */
	#productsnav {
		position: absolute;
		width: 100%;
		top: 135px;
		z-index: 10;
		left: 0px;
		height: 21px;
		visibility: hidden;
		}
	#productsnav div {
		width: 590px;
		margin-right: auto;
		margin-left: auto;
		}
		#productsnav li {
			list-style-type: none;
			display: block;
			float: left;
			}
		#productsnav a {
			background-position: left top;
			display: block;
			height: 21px;
			text-indent: -9999px;
			}
			#productsnav a:hover {
				background-position: left -21px;
				}
	
	.productsnav #productsnav {
		visibility: hidden;
		}
	.productsnav #navproducts a {
		background-position: bottom;
		}
	.productsnav #navproducts a:hover {
		background-position: left -21px;
		}
	#productsnavoff {
		position: absolute;
		visibility: hidden;
		z-index: 9;
		width: 100%;
		top: 179px;
		}

	/* Graphic Nav */
	
	#pnavantiaging a { background-image:url(../../images/interface/navigation/products/antiaging.gif); width: 99px;}
	#pnavoilbalancing a { background-image:url(../../images/interface/navigation/products/oilbalancing.gif); width: 109px;}
	#pnavbodycontouring a { background-image:url(../../images/interface/navigation/products/bodycontouring.gif); width: 125px;}
	#pnavallproducts a { background-image:url(../../images/interface/navigation/products/allproducts.gif); width: 104px;}


/* Header Number Detail */
	.hm h2 {background-image:url(../../images/interface/title_bg/01.gif)}
	.pr h2 {background-image:url(../../images/interface/title_bg/02.gif)}
	.fr h2 {background-image:url(../../images/interface/title_bg/03.gif)}
	.sk h2 {background-image:url(../../images/interface/title_bg/04.gif)}
	.ps h2 {background-image:url(../../images/interface/title_bg/05.gif)}
	.ct h2 {background-image:url(../../images/interface/title_bg/06.gif)}
	.wh h2 {background-image:url(../../images/interface/title_bg/07.gif)}

/* Micro Title */
#microtitle {
	background-repeat: no-repeat;
	height: 64px;
	width: 69px;
	float: right;
	}
	.hm #microtitle {background-image:url(../../images/interface/microtitle/hm.jpg)}
	.pr #microtitle {background-image:url(../../images/interface/microtitle/pr.jpg)}
	.fr #microtitle {background-image:url(../../images/interface/microtitle/fr.jpg)}
	.sk #microtitle {background-image:url(../../images/interface/microtitle/sk.jpg)}
	.ps #microtitle {background-image:url(../../images/interface/microtitle/ps.jpg)}
	.ct #microtitle {background-image:url(../../images/interface/microtitle/ct.jpg)}
	.wh #microtitle {background-image:url(../../images/interface/microtitle/wh.jpg)}


/* \\\\\\\\\\\ 1. Interface End \\\\\\\\\\\ */







/* ////////// 2. Shared Conent Styles Start ////////// */

/* Global Links */

/* Lists */
#content ul {
	margin-left: 40px;
	margin-bottom: 20px;
	}
#content li {
	margin-bottom: 5px;
	}

h1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: normal;
	}

/* Title */
h2 {
	font-size: 16px;
	font-weight: normal;
	display: block;
	color: #666666;
	line-height: normal;
	margin-bottom: 10px;
	background-repeat: no-repeat;
	background-position: right bottom;
	}
	h2 a:link, h2 a:active, h2 a:visited {
		color: #666666;
		text-decoration: underline;
		}
		h2 a:hover, h2 a:visited:hover {
			color: #666666;
			text-decoration: underline;
			}

/* Header */
h3 {
	font-size: 11px;
	font-weight: normal;
	color: #49B3CD;
	}
	h3 a:link, h3 a:active, h3 a:visited {
		color: #49B3CD;
		text-decoration: none;
		}
		h3 a:hover, h3 a:visited:hover {
			color: #49B3CD;
			text-decoration: underline;
			}

/* Sub-Header */
h4 {
	font-size: 10px;
	font-weight: bold;
	color: #666666;
	}
	h4 a:link, h4 a:active, h4 a:visited {
		color: #817C61;
		text-decoration: underline;
		}
		h4 a:hover, h4 a:visited:hover {
			color: #9F402C;
			text-decoration: underline;
			}
h5 {
	font-size: 10px;
	font-weight: bold;
	color: #666666;
	}

/* Paragraph Text */
p {
	line-height: 130%;
	color: #666666;
	padding-bottom: 15px;
	}

/* Horizontal Rule */
hr {
	display: block;
	margin-bottom: 10px;
	height: 17px;
	width: 436px;
	background-image: url(../../images/content/products/products_hr.jpg);
	background-repeat: no-repeat;
	border: 0px none #FFFFFF;
	}
/* Form Styles */

input, select, textarea {
	clear: none;
	background-color: #F7FCFD;
	padding: 2px;
	border: 1px solid #B1DEED;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #333333;
	width: 200px;
	float: left;
	display: block;
	line-height: 30px;
	}
	input:focus, textarea:focus, select:focus {
		background-color:#FFFFFF;	
		}
	#form div {
		clear: both;
		height: 35px;
		}
	#form label {
		width: 60px;
		display: block;
		float: left;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 12px;
		color: #666666;
		margin-right: 10px;
		text-align: right;		
		}
/* Submit Button */
	#form-submit input {
		border: 0px none #FFFFFF;
		width: 84px;
		margin-left: 130px;
		height: 30px;
		}


/* Content Classes */
.floatleft { float: left; }
.floatright { float: right; }
.gap { padding-bottom: 20px; }
.nogap { padding-bottom: 0px; }
.textsmall { font-size: 9px; }
.textwhite { color: #FFFFFF; }
.brclear { clear: both; height: 1px;}

/* Button */
a.button {
	background-image: url(/images/interface/corner.gif);
	background-repeat: no-repeat;
	background-position: right bottom;
	background-color: #DFF1F3;
	width: 120px;
	padding-left: 4px;
	display: block;
	padding-top: 2px;
	padding-bottom: 3px;
	text-decoration: none;
	color: #38A8C8;
	}
a.button:hover {
	background-color:#D3E4E6;
	text-decoration: none;
	}


/* \\\\\\\\\\\ 2. Shared Content Styles End \\\\\\\\\\\ */







/* ////////// 3. Unique Content Styles Start ////////// */

/* Home */
	#home #content {
		padding-top: 230px;
		padding-right: 20px;
		padding-left: 304px;
		}
	#home #contentwrap {
		background-image: url(/images/content/home/home_contentbg.jpg);
		background-repeat: no-repeat;
		background-position: left top;
		height: 463px;
		}
	#home #footer #copyright {
		background-image: url(../../images/content/home/home_crbg.jpg);
		}
	#home h1 {
		color: #FFFFFF;
		}
	#home h2 {
		font-size: 15px;
		color: #FFFFFF;
		}
	#home p {
		color: #FFFFFF;
		}
	#home hr {
		background-image: url(/images/interface/hr_438.jpg);
		width: 438px;
		}

/* Products */
	#products #content {
		padding-top: 50px;
		padding-left: 85px;
		padding-right: 239px;
		padding-bottom: 0px;
		}
	#products #contentwrap {
		background-image: url(../../images/content/products/products_contentbg.jpg);
		height:466px;
		}
	#products #footer #copyright {
		background-image: url(../../images/content/products/products_crbg.jpg);
		}

		/* Product Level 2 */
			.pr2 #footer #copyright {
				background-image: url(../../images/content/products/products2_crbg.jpg);
				}
			
			.pr2 #contentwrap {
				background-repeat: no-repeat;
				background-position: bottom;
				padding-bottom: 170px;
				}
			
			.pr2 #content {
				background-repeat: no-repeat;
				padding-top: 40px;
				padding-right: 239px;
				padding-left: 85px;
				background-position: right top;
				}
			.pr2 #content2 {
				width: 640px;
				margin-right: auto;
				margin-left: auto;
				clear: both;
				}
			.pr2 h2 {
				color:#269FC9;
				}
			.pr2 hr {
				background-image: url(/images/interface/hr_438.jpg);
				}
			.regimen {
				color: #777777;
				}
		
			#antiaging #contentwrap { background-image: url(../../images/content/products/productcategory_bg.jpg);}
			#oilbalancing #contentwrap { background-image: url(../../images/content/products/productcategory_bg.jpg);}
			#bodycontouring #contentwrap { background-image: url(../../images/content/products/productcategory_bg.jpg);}
			
			
			#antiaging #content { background-image: url(../../images/content/products/content_bg/1.gif);}
			#oilbalancing #content { background-image: url(../../images/content/products/content_bg/2.gif);}
			#bodycontouring #content { background-image: url(../../images/content/products/content_bg/3.gif);}
		
		
		/* Product Level 3 */
			.pr3 hr {
				background-image: url(../../images/interface/hr_dotted.gif);
				background-repeat: repeat;
				height: 2px;
				width: 100%;
				margin-top: 3px;
				margin-bottom: 3px;
				clear: both;
				}
			.pr3 #content {
				padding-top: 40px;
				padding-right: 32px;
				padding-bottom: 10px;
				padding-left: 292px;
				}
			.pr3 h2 {
				background-image: none;
				margin-bottom: 20px;
				height: 50px;
				}
			.pr3 #contentwrap {
				background-image: url(../../images/content/products/products3_contentbg.jpg);
				background-position: bottom;
				background-repeat: no-repeat;
				}
			.pr3 #content {
				background-repeat: no-repeat;
				}
				/* Specific Product Details Page Content Backgrounds */
				#aa1 #content { background-image: url(/images/content/products/content_bg/1/1.jpg); }
				#aa2 #content { background-image: url(../../images/content/products/content_bg/1/2.jpg); }
				#aa3 #content { background-image: url(../../images/content/products/content_bg/1/3.jpg); }
				#aa4 #content { background-image: url(../../images/content/products/content_bg/1/4.jpg); }
				#aa5 #content { background-image: url(../../images/content/products/content_bg/1/5.jpg); }
				#aa6 #content { background-image: url(../../images/content/products/content_bg/1/6.jpg); }
				#aa7 #content { background-image: url(../../images/content/products/content_bg/1/7.jpg); }
				
				#ob1 #content { background-image: url(../../images/content/products/content_bg/2/1.jpg); }
				#ob2 #content { background-image: url(../../images/content/products/content_bg/2/2.jpg); }
				#ob3 #content { background-image: url(../../images/content/products/content_bg/2/3.jpg); }
				#ob4 #content { background-image: url(../../images/content/products/content_bg/2/4.jpg); }
				#ob5 #content { background-image: url(../../images/content/products/content_bg/2/5.jpg); }
				#ob6 #content { background-image: url(../../images/content/products/content_bg/2/6.jpg); }
				#ob7 #content { background-image: url(../../images/content/products/content_bg/2/7.jpg); }
				
				#bc1 #content { background-image: url(../../images/content/products/content_bg/3/1.jpg); }
				#bc2 #content { background-image: url(../../images/content/products/content_bg/3/2.jpg); }
				#bc3 #content { background-image: url(../../images/content/products/content_bg/3/3.jpg); }
				#bc4 #content { background-image: url(../../images/content/products/content_bg/3/4.jpg); }
				#bc5 #content { background-image: url(../../images/content/products/content_bg/3/5.jpg); }
				#bc6 #content { background-image: url(../../images/content/products/content_bg/3/6.jpg); }
				#bc7 #content { background-image: url(../../images/content/products/content_bg/3/7.jpg); }
			
			.pr3 #footer #copyright {
				background-image: url(../../images/content/products/products3_crbg.jpg);
				}
			
			#suggestedprice {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #333333;
	padding: 0px;
	line-height: 20px;
	height: 25px;
	display: block;
	float: left;
				}
				#suggestedprice strong {
					font-size: 10px;
					color: #999999;
					font-family: Arial, Helvetica, sans-serif;
					font-weight: normal;
					line-height: 20px;
					}
			#productdescription {
				padding: 2px;
				}
			#productglance {
				font-family: Arial, Helvetica, sans-serif;
				font-size: 11px;
				color: #777777;
				margin-left: 25px;
				}
				#productglance h2 {
					display: none;
					}
				#productglance div {
				float: left;
				margin-bottom: 10px;
					}
				#regimen {
					width: 105px;
					}
				#benefits {
					width: 198px;
					}
				#keyingredient {
					width: 105px;
					}

/* Formula Origin */
		#formulaorigin hr {
			background-image: url(/images/interface/hr_438.jpg);
			width: 438px;
			}
		#formulaorigin #contentwrap {
			background-image: url(/images/content/formulaorigin/formula_contentbg.jpg);
			background-repeat: no-repeat;
			background-position: left bottom;
			}
		#formulaorigin #content {
			padding-top: 20px;
			padding-right: 127px;
			padding-left: 195px;
			}
		#formulaorigin #footer #copyright {
			background-image: url(../../images/content/formulaorigin/formula_crbg.jpg);
			}
		#formulaorigin h3 {
			background-image: url(/images/interface/subtitle_bg.gif);
			background-repeat: no-repeat;
			background-position: left top;
			display: block;
			height: 17px;
			width: 438px;
			vertical-align: middle;
			padding-top: 2px;
			padding-left: 5px;
			margin-bottom: 20px;
			}
		
		/* Key Ingredients*/
		#bownseaweeds {
			background-image: url(/images/content/formulaorigin/icons/brown.gif);
			background-repeat: no-repeat;
			background-position: 0px 20px;
			}
		#redseaweeds {
			background-image: url(/images/content/formulaorigin/icons/red.gif);
			background-repeat: no-repeat;
			background-position: 0px 20px;
			}
		#blueseaweeds {
			background-image: url(/images/content/formulaorigin/icons/blue.gif);
			background-repeat: no-repeat;
			background-position: 0px 20px;
			}
		#bownseaweeds h4 {
			color: #928860;
			}
		#redseaweeds h4 {
			color: #E7302C;
			}
		#blueseaweeds h4 {
			color: #4CA4D8;
			}
		#keyingredientlist h5 {
			margin-left: 50px;
			}
		#keyingredientlist p {
			padding-bottom: 5px;
			padding-left: 50px;
			}
		#keyingredientlist h4 {
			font-size: 12px;
			margin-bottom: 3px;
			}
		#formulaorigin #keyingredientlist hr {
			background-image: url(/images/interface/hr_dotted_dark.gif);
			height: 2px;
			background-repeat: repeat;
			margin-top: 10px;
			margin-bottom: 10px;
			}

/* Skincare Tips */
		#skincaretips #contentwrap {
			background-image: url(/images/content/skincaretips/skincaretips_contentbg.jpg);
			background-repeat: no-repeat;
			background-position: left top;
			height: 463px;
			}
		#skincaretips #content {
			padding-right: 25px;
			padding-left: 317px;
			padding-top: 50px;
			}
		#skincaretips #footer #copyright {
			background-image: url(../../images/content/skincaretips/skincaretips_crbg.jpg);
			}
		#skincaretips.sk h2 {
			background-image: url(/images/interface/title_bg/04_blue.gif);
			}
		#skincaretips hr {
			background-image: url(/images/content/skincaretips/skincaretips_hr.jpg);
			width: 418px;
			}
		#skincaretips #content ul {
			margin-left: 20px;
			margin-top: 0px;
			margin-right: 0px;
			margin-bottom: 0px;
			}
		#skincaretips #content li {
			font-family: Arial, Helvetica, sans-serif;
			font-size: 12px;
			font-style: italic;
			}
		.sk2 #contentwrap {
			background-image: url(/images/content/skincaretips/skincaretips2_contentbg.jpg);
			background-repeat: no-repeat;
			background-position: left bottom;
			}
		.sk2 #content {
			padding-right: 25px;
			padding-left: 317px;
			padding-top: 50px;
			padding-bottom: 100px;
			}
		.sk2 #footer #copyright {
			background-image: url(../../images/content/skincaretips/skincaretips2_crbg.jpg);
			}
		.sk2 hr {
			background-image: url(/images/interface/hr_418.jpg);
			width: 418px;
			}
		.sk2 #content ul {
			margin-left: 20px;
			margin-top: 0px;
			margin-right: 0px;
			margin-bottom: 0px;
			}
		.sk2 #content li {
			font-family: Arial, Helvetica, sans-serif;
			font-size: 12px;
			font-style: italic;
			}
		.sk2 #content ul ul a {
			color: #49B3CD;
			font-size: 10px;
			font-style: normal;
			font-family: Verdana, Arial, Helvetica, sans-serif;
			}
		.sk2 #content ul ul a:hover, .sk2 #content ul ul a:visited:hover {
			text-decoration:none;
			}
		.sk2 #content ul ul {
			margin-top: 5px;
			margin-bottom: 15px;
			}
		.sk2 h3 {
			font-size: 12px;
			color: #666666;
			margin-bottom: 10px;
			}

/* Press */
		#press hr {
			background-image: url(/images/content/press/press_hr.jpg);
			width: 418px;
			}
		#press #contentwrap {
			background-image: url(/images/content/press/press_contentbg.jpg);
			background-position: left top;
			background-repeat: no-repeat;
			}
		#press #content {
			padding-top: 50px;
			padding-right: 25px;
			padding-left: 317px;
			padding-bottom: 50px;
			}
		#press h3 {
			color: #666666;
			margin-bottom: 15px;
			}
		#press h4 {
			font-size: 9px;
			font-weight: normal;
			color: #999999;
			}
		#press h5 {
			color: #49B3CD;
			font-weight: normal;
			font-size: 11px;
			}

/* Contact */
		#contactus #contentwrap {
			background-image: url(/images/content/contactus/contact_contentbg.jpg);
			background-repeat: no-repeat;
			background-position: left top;
			height: 463px;
			}
		#contactus #content {
			padding-right: 25px;
			padding-left: 317px;
			padding-top: 250px;
			}
		#contactus #footer #copyright {
			background-image: url(../../images/content/contact/contact_crbg.jpg);
			}
		#contactus hr {
			width: 418px;
			background-image: url(/images/content/contactus/contact_hr.jpg);
			}

/* Where to Find */
	#wheretofind #contentwrap {
		background-image: url(/images/content/wheretofind/where_contentbg.jpg);
		background-repeat: no-repeat;
		background-position: left top;
		}
	#wheretofind #content {
		padding-right: 25px;
		padding-left: 317px;
		padding-top: 250px;
		padding-bottom: 50px;
		}
	#wheretofind #footer #copyright {
		background-image: url(../../images/content/wheretofind/where_crbg.jpg);
		}
	#wheretofind hr {
		width: 418px;
		background-image: url(/images/content/wheretofind/where_hr.jpg);
		}
	#wheretofind #searchresults hr {
		background-image: url(/images/interface/hr_dotted.gif);
		background-repeat: repeat;
		height: 2px;
		margin-top: 20px;
		margin-bottom: 10px;
		}
	#searchresults p {
		color: #4EBEE7;
		font-style: italic;
		font-size: 9px;
		}
	.store {
		font-size: 9px;
		color: #999999;
		width: 200px;
		float: left;
		margin-bottom: 20px;
		line-height: 120%;
		}
		.store strong {
			font-size: 11px;
			color: #666666;
			}

/* \\\\\\\\\\\ 3. Unique Content Styles End \\\\\\\\\\\ */#suggestedprice .size {
	font-size: 11px;
}
a.buynow {
	background-image: url(/images/content/products/buynow.gif);
	background-repeat: no-repeat;
	background-position: 5px top;
	height: 20px;
	display: block;
	float: left;
	padding-left: 40px;
	padding-top: 5px;
	font-size: 11px;
	color: #63C0DF;
	margin-bottom: 2px;
	}
a.buynow:hover, a.buynow:visited:hover {
	background-position: 5px bottom;	
	}
