/* CSS Reset ================================================================================= */

* { margin:0; padding:0; }

body {  font:11px Verdana, Tahoma, Arial, Helvetica, sans-serif; text-align:left; line-height: 1.4em; color:#000; }

a { color:#003366;text-decoration: underline; outline:none; }
a:hover { text-decoration: underline; }
a img { border:0;}

/* Heading */
h1, h2, h3, h4, h5, h6, .head { margin-bottom:.4em; line-height:1.3em; }
h1 { font-size:2em; line-height:1.17; }
h2 { font-size:1.5em; }
h3 { font-size:1.35em; }
h4 { font-size:1.05em; }
h5 { font-size:1.05em; }
h6 { font-size:.95em; }

/* Forms */
form          { display:inline; }
fieldset      { border:0; }
legend        { display:none; }

/* Table */
table         { border:0; border-collapse:collapse; border-spacing:0; empty-cells:show; font-size:100%; }
caption,th,td { vertical-align:top; text-align:left; font-weight:normal; }

/* Content */
address       { font-style:normal; }
cite          { font-style:normal; }
q,
blockquote    { quotes:none; }
q:before, 
q:after       { content:''; }
small,big     { font-size:1em; }
sup           { font-size:0.6em;}

/* Lists */
ul,ol         { list-style:none; clear:left; padding:0; }
/* ================================================================================= */

#wrapper {width:768px; margin:0 auto; padding-top:7px;}

#header, #header-fr {height:109px;}
#header h1 {margin:0;}
#header h1 a,
#header .logo a {float:left; width:190px; }
#header img {float:left; width:auto;}

/* Content Area */
#main-col {clear:both; overflow:hidden;}
#left-col {width:149px; float:left; padding-left:40px; margin-right:2px;}
#main-content {width:577px; float:left;}
.language, .language-home {height:27px; background-color:#e6efef; padding-left:400px;}
.language-home {background:url(../images/home_bande_top.gif) no-repeat left top #e6efef;}
.language a,
.language-home a {display:block; width:80px; text-transform:uppercase; text-align:center; padding:6px 3px; color:#515151; font-size:9px; background-color:#fff; letter-spacing:0.13em; text-decoration:none;}
.language a:hover, .language-home a:hover {background-color:#00a0dd; color:#fff; text-decoration:none;}

/* Footer */
#footer {width:577px; margin-left:190px; text-align:right; margin-top:20px; border-bottom:27px solid #e6efef; margin-bottom:20px; padding-right:10px;}
#footer .print a {display:block; width:104px; height:21px; background:url(../en/images/btn_imprimer.gif) no-repeat left top; float:right;}
#footer .print a span, #footer .print-fr a span {display:none;}
#footer p {font-size:9px; clear:right;}
#footer p .sup {font-size:7px; position:relative; top:-5px;}

/* Footer French */
#footer .print-fr a {display:block; width:132px; height:21px; background:url(../fr/images/btn_imprimer.gif) no-repeat left top; float:right;}

/* Left Menu ================================================================================= */
.left-menu, .left-menu-fr {margin-bottom:14px;}
.left-menu ul li {margin-bottom:2px;}
.left-menu ul li, .left-menu ul li a {display:block; width:149px; height:57px; text-indent:-999em;}
.left-menu ul li.nav-protectors a {background:url(../en/images/btn_protecteurs.gif) no-repeat left top;}
.left-menu ul li.nav-protectors a:hover {background:url(../en/images/btn_protecteurs.gif) no-repeat left -57px;}
.left-menu ul li.nav-enriched a {background:url(../en/images/btn_hydratants.gif) no-repeat left top;}
.left-menu ul li.nav-enriched a:hover {background:url(../en/images/btn_hydratants.gif) no-repeat left -57px;}
.left-menu ul li.nav-exfoliants a {background:url(../en/images/btn_exfoliants.gif) no-repeat left top;}
.left-menu ul li.nav-exfoliants a:hover {background:url(../en/images/btn_exfoliants.gif) no-repeat left -57px;}
.left-menu ul li.nav-lighteners a {background:url(../en/images/btn_eclaircissants.gif) no-repeat left top;}
.left-menu ul li.nav-lighteners a:hover {background:url(../en/images/btn_eclaircissants.gif) no-repeat left -57px;}
.left-menu ul li.nav-specialized a {background:url(../en/images/btn_specialites.gif) no-repeat left top;}
.left-menu ul li.nav-specialized a:hover {background:url(../en/images/btn_specialites.gif) no-repeat left -57px;}

.sub-left-menu {width:149px; background-color:#f5f5f4; padding:17px 0;}
.sub-left-menu ul li a {display:block; width:149px; height:15px; text-indent:-999em; margin-bottom:11px;}
.sub-left-menu ul li.nav-about a {background:url(../en/images/btn_cie.gif) no-repeat left top;}
.sub-left-menu ul li.nav-product-list a {background:url(../en/images/btn_liste.gif) no-repeat left top;}
.sub-left-menu ul li.nav-your-skin a {background:url(../en/images/btn_type_peau.gif) no-repeat left top;}
.sub-left-menu ul li.nav-request a {background:url(../en/images/brn_point_de_vente.gif) no-repeat left top; height:24px;}
.sub-left-menu ul li.nav-contact a {background:url(../en/images/btn_contact.gif) no-repeat left top;}

/* French Menu */
.left-menu-fr ul li a {display:block; width:149px; height:57px; text-indent:-999em; margin-bottom:2px;}
.left-menu-fr ul li.nav-protectors a {background:url(../fr/images/btn_protecteurs.gif) no-repeat left top;}
.left-menu-fr ul li.nav-protectors a:hover {background:url(../fr/images/btn_protecteurs.gif) no-repeat left -57px;}
.left-menu-fr ul li.nav-enriched a {background:url(../fr/images/btn_hydratants.gif) no-repeat left top;}
.left-menu-fr ul li.nav-enriched a:hover {background:url(../fr/images/btn_hydratants.gif) no-repeat left -57px;}
.left-menu-fr ul li.nav-exfoliants a {background:url(../fr/images/btn_exfoliants.gif) no-repeat left top;}
.left-menu-fr ul li.nav-exfoliants a:hover {background:url(../fr/images/btn_exfoliants.gif) no-repeat left -57px;}
.left-menu-fr ul li.nav-lighteners a {background:url(../fr/images/btn_eclaircissants.gif) no-repeat left top;}
.left-menu-fr ul li.nav-lighteners a:hover {background:url(../fr/images/btn_eclaircissants.gif) no-repeat left -57px;}
.left-menu-fr ul li.nav-specialized a {background:url(../fr/images/btn_specialites.gif) no-repeat left top;}
.left-menu-fr ul li.nav-specialized a:hover {background:url(../fr/images/btn_specialites.gif) no-repeat left -57px;}

.sub-left-menu-fr {width:149px; background-color:#f5f5f4; padding:17px 0;}
.sub-left-menu-fr ul li a {display:block; width:149px; height:15px; text-indent:-999em; margin-bottom:11px;}
.sub-left-menu-fr ul li.nav-about a {background:url(../fr/images/btn_cie.gif) no-repeat left top;}
.sub-left-menu-fr ul li.nav-product-list a {background:url(../fr/images/btn_liste.gif) no-repeat left top; height:25px;}
.sub-left-menu-fr ul li.nav-your-skin a {background:url(../fr/images/btn_type_peau.gif) no-repeat left top;}
.sub-left-menu-fr ul li.nav-request a {background:url(../fr/images/brn_point_de_vente.gif) no-repeat left top;}
.sub-left-menu-fr ul li.nav-contact a {background:url(../fr/images/btn_contact.gif) no-repeat left top;}

/* CSS Document for content section */
/* splash page ============================================================================ */
*html #splash_container {
	width:670px;
}
#splash_container {
	width:691px;
	display:block;
	margin:0 auto;
	padding:0;
}
#splash_container .wrap {
	width:691px;
	display:block;
	position:absolute;
	top:20%;
}
#splash_container .splash_photo {
	width:370px;
	display:block;
	float:left;
	margin:0 65px 10px 0;
	padding:0;
}
*html #splash_container .splash_content {
	clear:left;
	width:270px;
	float:right;
	margin:0;
	padding:0;
}
#splash_container .splash_content {
	width:254px;
	float:right;
}
#splash_container h1.logo {
	background:url(../images/pro-derm_logo.gif) left top no-repeat;
	width:165px;
	height:64px;
	margin:96px 0 53px 17px;
	padding:0;
}
#splash_container h1.logo span {
	display:block;
	text-indent:-99999em;
}
ul#lang{
	margin:15px 0 0 25px;
	padding:0;
}
ul#lang {
	display:block;
	float:left;
	width:230px;
	list-style:none;
}
ul#lang li {
	display:inline-block;
	float:left;
	}
ul#lang li.fr a {
	display:block;
	width:73px;
	height:11px;
}
ul#lang li.en a {
	display:block;
	width:64px;
	height:11px;
}
ul#lang span{
	display:none;
}
ul#lang li.fr {
	background:url(../images/lang_francais.gif) left top no-repeat;
	margin:0 20px 0 0;
	padding:0;
	width:73px;
	height:11px;
}
ul#lang li.en {
	background: url(../images/lang_english.gif) left top no-repeat;
	margin:0;
	padding:0;
	width:64px;
	height:11px;
}
span.copy {
	clear:both;
	display:block;
	font-family:Arial, Helvetica, sans-serif;
	padding:13px 0 0 0;
	font-size:10px;
}
span.copy sup {
	font-size:6px;
}
/* home page ============================================================================ */
#content {
	width: 577px;
	display:block;
	overflow:hidden;
	float: right;
	margin:0;
	padding:0;
}
#content .wrap {
	padding:13px 9px 9px 9px;
}
.home_content_top {
	clear: both;
	background: url(../en/images/home_image.jpg) left top no-repeat;
	width:577px;
	display:block;
	padding:40px 0 0 0;
	height:160px;
	margin:0;
	overflow:hidden;
}
.home_content_top p {
	padding:0 0 25px 215px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	line-height:20px;
	text-align:justify;
	font-size:13px;
}
.home_content_left {
	margin:5px 21px 0 9px;
	padding:0;
	width:269px;
	background: url(../en/images/home_aloes.jpg) left top no-repeat;
	padding:33px 0 0 0;
	line-height:20px;
	text-align:justify;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	display:inline-block;
	float:left;
}
.home_content_right {
	margin:5px 0 0 0;
	padding:0;
	width:269px;
	background: url(../en/images/home_orange.jpg) left top no-repeat;
	padding:33px 0 0 0;
	line-height:20px;
	text-align:justify;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	display:inline-block;
	float:left;
}
.home_content_left p,
.home_content_right p {
	margin:0;
	padding:0;
}
/* breadcrumb ==================================================================== */
ul#breadlist {
	clear:both;
	margin:25px 0 0 9px;
	padding:0 0 15px 0;
	width:568px;
	border-bottom:solid 1px #CCCCCC;
}
ul#breadlist li.debut, ul#breadlist li {
	color:#000000;
	display:inline;
	list-style-type:none;
	padding-right:5px;
}
ul#breadlist li {
	background: url(../en/images/breadcrumb2.gif) no-repeat scroll left 4px;
	padding-left:1.2em;
}
ul#breadlist li.debut {
	background:transparent none repeat scroll 0 0;
	padding-left:0;
}
ul#breadlist li a {
	color:#003366;
	text-decoration:underline;
}
ul#breadlist li a:hover {
	color:#00A0DD;
	text-decoration:underline;
}
ul#breadlist li.active {
	background: url(../en/images/breadcrumb2.gif) no-repeat scroll left 4px;
	color:#000000;
	padding-left:1.2em;
	text-decoration:none;
}
/* product links ================================================================== */
ul#productlist, ul.productlist {
		list-style-type:none;
		margin:0;
		padding:5px 5px 5px 0;
}
ul#productlist li, ul.productlist li {
		background-image:url(../en/images/pipe.gif);
		background-position:0 0.4em;
		background-repeat:no-repeat;
		padding:1.5px 1.5px 0.5em 1.5em;
}
ul#productlist li a, ul.productlist li a{
		color:#003366;
		text-decoration:underline;
}
ul#productlist li a:hover, ul.productlist li a:hover {
		color:#00A0DD;
		text-decoration:underline;
}
span.linkbackproduct {
	clear:both;
	display:block;
}
.linkbackproduct a:link {
		color:#808080;
		font-weight:bold;
		text-decoration:none;
}
.linkbackproduct a:visited {
		color:#808080;
		font-weight:bold;
		text-decoration:none;
}
.linkbackproduct a:hover {
		color:#808080;
		font-weight:bold;
		text-decoration:underline;
}
.linkbackproduct a:active {
		color:#808080;
		font-weight:bold;
		text-decoration:none;
}
/* heading ======================================================== */
#content h1 {
	height:34px;
	width:568px;
	display: block;
	font-family: 'Century Gothic', 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
	font-size:18px;
	text-transform: uppercase;
	font-weight: normal;
	color:#787878;
	letter-spacing:7px;
	margin:0 0 25px 0;
}
#content h1.contact_us span {
	display:block;
	padding:8px 0 0 0px;
}
#content h1 span {
	display:block;
	padding:8px 0 0 64px;
}
#content .wrap h2 {margin-bottom:5px;}
#content h2.antioxidant_protectors,
#content h2.enriched_moisturizers,
#content h2.skin_lighteners,
#content h2.exfoliants,
#content h2.specialized_products{
	height:34px;
	width:568px;
	display: block;
	font-family:'Century Gothic', 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
	font-size:18px;
	text-transform: uppercase;
	font-weight: normal;
	color:#787878;
	letter-spacing:7px;
	margin:0 0 12px 0;
	}
#content h2.antioxidant_protectors span,
#content h2.enriched_moisturizers span,
#content h2.skin_lighteners span,
#content h2.exfoliants span,
#content h2.specialized_products span {
	display:block;
	padding:4px 0 0 64px;
}
#content h1.antioxidant_protectors,
#content h2.antioxidant_protectors {
	background:url(../en/images/t_antioxidant_protectors.gif) left top no-repeat;
}
#content h1.enriched_moisturizers,
#content h2.enriched_moisturizers {
	background:url(../en/images/t_enriched_moisturizers.gif) left top no-repeat;
}
#content h1.skin_lighteners,
#content h2.skin_lighteners {
	background:url(../en/images/t_skin_lighteners.gif) left top no-repeat;
}
#content h1.exfoliants,
#content h2.exfoliants {
	background:url(../en/images/t_exfoliants.gif) left top no-repeat;
}
#content h1.specialized_products,
#content h2.specialized_products {
	background:url(../en/images/t_specialized_products.gif) left top no-repeat;
}
#content h1.about_us {
	background:url(../en/images/t_about_us.gif) left top no-repeat;
	width:335px;
	height:70px;
}
#content h1.about_us-fr {background:url(../fr/images/t_notre_cie.gif) left top no-repeat; width:405px; height:68px; text-indent:-999em;}
#content h1.about_us span {
	display:block;
	text-indent:-9999em;
}
#content h1.skintype {
	width:453px;
	height:82px;
	background:url(../en/images/t_your_skin_type.gif) left top no-repeat;
}
#content h1.skintype-fr {
	width:560px;
	height:82px;
	background:url(../fr/images/t_type_peau.gif) left top no-repeat;
	text-indent:-999em;
}
#content h1.skintype span {
	display:block;
	text-indent:-99999em;
}
#content h2 {
	color:#003366;
	font-size:12px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}
#content h3 {
	font-family:Verdana,Arial,Helvetica,sans-serif;
	font-size:11px;
	line-height:2em;
	font-weight:bold;
	margin:0;
}
#content h2.alltypes {
	height:17px;
	background:url(../en/images/h_f.jpg) left top no-repeat;
	margin:0 0 10px 0;
	padding:5px 0 0 40px;
	color:#000;
	font-size:11px;
}
/*h2.alltypes span{
	line-height:20px;
	text-align:justify;
	font-family:Verdana,Arial,Helvetica,sans-serif;
	font-size:11px;
	padding:2px 0 0 38px;
	display:block;
}*/
#about p {
	margin:0 0 15px 0;
	padding:0;
	font-size:11px;
	line-height: normal !important;
	text-align:justify;
}
#content .wrap p {
	margin:0 0 14px 0;
	padding:0;
	font-size:11px;
	line-height:1.5em;
	text-align:justify;
}
#content .wrap ul {margin:15px 0;}
#content .wrap .product_detail ul {margin:0 0 15px 0;}

/* product detail ======================================================== */
img.product {
	float: left;
	margin-right:5px;
}
p.desc {
	font-family:Verdana,Arial,Helvetica,sans-serif;
	font-size:11px;
	color:#000000;
	line-height: normal;
	margin:0;
	padding:8px 0 0 0;
}
.product_detail {
	margin:5px 0 0 0;
	border-top:1px #CCCCCC solid;
	padding:15px 0 0 0;
}
.product_detail p {
	margin:0 0 10px 0;
	padding:0;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	line-height: normal;
}
/* skin type ==================================================================== */
.skin_top {
	width:560px;
	height:56px;
	background:url(../en/images/skin_type_top.gif) left top no-repeat;
	display:block;
}
.skin_top-fr {
	width:560px;
	height:56px;
	background:url(../fr/images/skin_type_top.gif) left top no-repeat;
	
}
.skin_top h2, .skin_top-fr h2 {
	display:block;
	text-indent:-99999px;
}
h3.skin_heading {
	background:url(../en/images/skin_bg.gif) left top no-repeat;
	width:560px;
	height:20px;
	overflow:hidden;
	color:#FFFFFF;
	font-size:12px !important;
	font-weight:bold;
	padding:0px 0 2px 2px;
}
.skin_row {
	width:560px;
	background:url(../en/images/skin_row_bg.gif) left top repeat-y;
	overflow:hidden;
	/*display:block;*/
}
.skin_row ul {
	clear:none;
}
.skin_row ul li {
	font-family:Verdana,Arial,Helvetica,sans-serif;
	font-size:11px;
	line-height:normal;
	padding:1px 0 1px 15px;
}
.skin_row ul li.ico_specialites {
	background:url(../en/images/ico_specialites.gif) left 5px no-repeat;
}
.skin_row ul li.ico_protecteurs {
	background:url(../en/images/ico_protecteurs.gif) left 5px no-repeat;
}
.skin_row ul li.ico_hydratants {
	background:url(../en/images/ico_hydratants.gif) left 5px no-repeat;
}
.skin_row ul li.ico_eclaircissants {
	background:url(../en/images/ico_eclaircissants.gif) left 5px no-repeat;
}
.skin_row ul li.ico_exfoliants {
	background:url(../en/images/ico_exfoliants.gif) left 5px no-repeat;
}
#content .wrap ul.cell_left {
	width:145px;
	/*display: inline-block;*/
	float:left;
	margin:0 10px 0 0;
	padding:5px 0 0 5px;
}
#content .wrap ul.cell_middle {
	width:145px;
	/*display: inline-block;*/
	float:left;
	margin:0 10px 0 0;
	padding:5px 0 0 5px;
}
#content .wrap ul.cell_right {
	width:233px;
	/*display: inline-block;*/
	float:left;
	margin:0;
	padding:5px 0 0 5px;
}
/* product list ========================================================== */
.product_row {
	margin:30px 0 0 0;
}
#content h1.product_list {font-size:16px; letter-spacing:0.075em; color:#999; margin-top:15px;}

/* request form ========================================================== */
form.request {
	width:408px;
}
form.request fieldset{
	width:408px;
}
form.request legend{
	display:none;
}
form.request input, form.request textarea {width:275px; border:1px solid #aeaeae; padding:3px;}
form.request ol {
	width:410px;
	display:block;
}
form.request ol li{
	clear:both;
	height:27px;
	margin:0 0 3px 0;
	padding:0 2px 0 2px;
}
form.request ol li.message {
	height:auto !important;
}
form.request label{
	width:120px;
	display:block;
	float:left;
}
form.request input.buttons {
	width:60px;
	clear:both;
	float:right;
	margin:0 2px 0 0;
	border:2px solid #aeaeae;
}
.warning {color:red; font-weight:bold;}