@charset "UTF-8";
/*---------------------------
reset
-----------------------------*/
body, ul, img, p, div, h1, h2, h3, h4, h5{
	margin:0;
	border: 0;
	outline: 0;
	padding: 0;
	}
ol, ul {list-style: none;}
img { display: block; }
a img {border: none;}

/*---------------------------
 general statements 
-----------------------------*/
html {
background:#f2f7e3 url('i/gradient.png') 0 0 repeat-x;
width: 100%;/* width is 100%, so the body can be 100% */
overflow-y: scroll;
}
body {
	font-size: 75%;
	font-family: MyriadPro-Regular, 'Myriad Pro Regular', MyriadPro, 'Myriad Pro', Helvetica, Arial, sans-serif; 
	background:transparent url('i/leaves/leaves3_hole.png') 20% 0 repeat-x;
	min-width: 100%;
	width: auto; /*for the background*/
	text-align: center;
	overflow:auto;
	line-height: 1.5;
	behavior: url("s/csshover3.htc");
}
html>body {font-size: 12px;}


p {
	font-family:MyriadPro-Regular, 'Myriad Pro Regular', MyriadPro, 'Myriad Pro', Helvetica, Arial, sans-serif;
	font-size: 1em;
	color:#333;
	margin-top: 0em;
	margin-bottom: 2em;
	line-height: 1.5em;
	}

a {
	color:#508516;
	text-decoration:underline;
}

 
a:hover {
	text-decoration: underline;
	color: #333;
	background-color: #FFC;
}

h1 {font-size:25px;line-height:0px;	padding: 10px 0;}
h2 {
	color: #2E3163;
	border-bottom: thin dotted #ccc;
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	font-size: 1.35714em;
	line-height: 1.47368em;
	font-style: normal;
	font-weight: normal;
	margin-top: 1.965em;
	margin-bottom: 0.982em;
	margin-right: 0em;
	text-transform: uppercase;
	letter-spacing: 2px;
	display: block;
	text-transform: none;
	position:relative;
	left:-6px;
}
h3 {
	color: #2E3163;
	margin: -1em 0 0.25em 0;
	font-style: normal;
	font-size: 1em;
	font-weight: bold;
	display: block;
	line-height: 2em;
	text-transform: uppercase;
	letter-spacing: 1px;
}

.clear {
	clear: both;
	overflow: hidden;
	width: 1px;
	height: 1px;
	margin: 0 -1px -1px 0;
	border: 0;
	padding: 0;
	font-size: 0;
	line-height: 0;
}
.clearafter {clear: both;}

ul.list {
	margin-top:-1em;
	margin-bottom: 1em;
	display: block;
}
ul.list li {
	list-style:circle;
	margin-left: 2em;
}
ul.list li p {
	margin-top: 0px;
	margin-bottom: 0px;
}



/*---------------------------
internet explorer #header, .productbox, #productimg { behavior: url("s/csshover3.htc");}
#header img, div.productbox img, #productimg img { behavior: url(s/iepngfix.htc) } .depigment, .antiage, .atopie

-----------------------------*/

img, .productbox, .productimg, h1 strong a, .vigur, .vigur1 { behavior: url("/s/iepngfix.htc"); }
* html div#header {border: none;}
* html.productbox33 {border: none;}
* html div#mainContent {border: none; background-image:none;}

/*---------------------------
leaves parallax
-----------------------------*/

* html body {
	background: url('i/leaves/leaves.gif') 0 0 repeat-x;
	width: 100%;/*style for IE*/
}

div#midground{
    background:transparent url('i/leaves/leaves2.png') 40% 0 repeat-x;
    margin: 0;
    padding: 0;
    width: 100%;

}
* html div#midground {background:none}

div#foreground{
	background: transparent url('i/leaves/leaves4.png') -152% -10% repeat-x;
	margin: 0;
	padding: 0;
	width: 100%;
	position: absolute;
	top:0;
	left:0;
	right: 0;
	height: 70px;
	z-index: 5;
}
* html div#foreground {background:none}

/*---------------------------
header
-----------------------------*/
#header {
	display: block;
	overflow:hidden;
	clear:both;
	padding: 0.5em 1.5em 1em 1.5em;
	height: 5em;
	border-top: 1px dotted #999;
	border-right: 1px dotted #999;
	border-left: 1px dotted #999;
	background-color: #fff;
	background-image: url(i/button_header.gif);
	background-repeat: repeat-x;
	background-position: bottom;
	}
h1 strong { display: block; position: relative; top: 0; font-size: 15px; font-style: normal; font-weight: normal; color:#333; left: 0; text-align: right; }
h1 strong a {
	position: relative;
	display: block;
	float:left;
	clear:both;
	text-indent: -9999px;
	border: none;
	text-align: left;
	background:transparent url('i/logoelatiumB.png') 0 0 no-repeat;
	display:block;
	width:154px;
	height:48px;
}
	
h1 strong a img {
	padding: 0 0 0 0;
	clear:both;
}
	/*\*/ h1 strong a { overflow: hidden; } /**/

h1 strong span {
	position: relative;
	bottom:-2.5em;
	right:1em;
	float:right;
	font-style:italic;
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #666;
	text-shadow: 1px 1px 1px rgba(255,255,255, .5);
}
h1 strong a:hover {background-color: transparent;}
h1 strong a:hover img, h1 strong a:focus img {opacity: 0; filter:alpha(opacity=0); background-color: transparent;}
/* ie6 needs his fix*/
h1 strong a:hover img {zoom:1;}
/*end hover*/

/*---------------------------
containers
-----------------------------*/


#container {
	margin: 1.5em auto 1em auto;
	text-align: center;
	width: 52em;
}


#mainContent {
	padding: 4em 2em 2em 2em;
	background: #FFF url(i/main_shadow.jpg) 50% -1px repeat-x;
	-moz-border-radius-bottomleft: 10px;
	-moz-border-radius-bottomright: 10px;
	-webkit-border-bottom-left-radius: 10px;
	-webkit-border-bottom-right-radius: 10px;
	border-bottom: 1px dotted #999;
	border-right: 1px dotted #999;
	border-left: 1px dotted #999;
	text-align: center;
}

.intro {
	display:block;
	padding: 0.5em 0 0 2em;
	margin: 1em 0 0 1em;
	overflow:auto;
	text-align:left;
	width: 22em;
}
.introleft {
	float: left;
	clear: left;
}
.introright {
	float: right;
	clear: right;
	margin-left: 0px;
	margin-right: 2em;
}
#paypal {
	overflow:hidden;
	clear: both;
	overflow:hidden;
	margin: 1em 0 2em 0;
	text-align: center;
	vertical-align: bottom;
	width: 54em;
	background-color: #999;
}
#products {
	text-align:center;
	background-color: rgb(243, 240, 220);
	border-bottom: 1px dashed rgb(170, 160, 144);
	overflow: hidden;
}

#footer {
	text-align: right;
	padding: 1em 2em;
	color: #666;
	clear: both;
}
#footer a {
	color: #333;
	text-decoration: none;
}
#footer a:hover {text-decoration:underline;}

 
/*---------------------------
navigation
-----------------------------*/ 
div#menumain {
	background: #FFF;
	line-height:normal;
      }

#menumain ul {
	margin:0;
	padding:0px 1em 0 2em;
	list-style:none;	 
	}
#menumain li {
      float:left;
      background:url("i/button_left.gif") no-repeat left bottom;
      margin:0;
      padding:0 0 0 9px;
      }
#menumain a {
	float:left;
	display:block;
	background:url("i/button_right.gif") no-repeat right bottom;
	padding:4px 12px 5px 3px;
	margin:0 5px 0 0;
	font-size: 12px;
	text-decoration:none;
	color:#666;
	font-weight:normal;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-family: Verdana, Geneva, sans-serif;
	text-shadow: 1px 1px 1px rgba(255,255,255, .5);
}
/* Commented Backslash Hack
     hides rule from IE5-Mac \*/
 #menumain a {float:none;}
 /* End IE5-Mac hack */

#menumain a:hover { color:#2E3163; }
#menumain a:active { color:#ffffff; }



#menumain li#current { background-image:url(i/button_left_on.gif); margin-top:-1px; padding-top:1px; font-weight: bold;      }
#menumain li#current a { background-image:url(i/button_right_on.gif); color:#2E3163; margin-top:-1px; padding-top:5px; }	
	
#menumain li.panier {
	float: right;
	display:none;
	}
	

/*---------------------------
nos produits
-----------------------------*/ 
div.productbox {
	display:-moz-inline-stack;/* Firefox 2 and under*/
	display:inline-block;/* FF3, Opera, Safari */
	width:25%;
	font-size:1.2em;
	text-align: center;
	clear:none;
	min-height: 260px;
	zoom: 1;
   *display: inline;
	_height: 260px;
	}
	
	
	
	
	
div.clearafter.productbox {
	border:0;
	clear:right; }
	
		
.productbox33 {
	background:none;
	display:-moz-inline-box;/* Firefox 2 and under*/
	display:inline-block;/* FF3, Opera, Safari */
	width:31%;
	margin: 0em 1% 0 0;
	font-size:1.2em;
	text-align: center;
	clear: right;
	padding: 0.5em 0 0 0;
	border-top: thin dotted #ccc;
	height: 3em;
	vertical-align: bottom;
	color: #666;
	zoom: 1;
   *display: inline;
	line-height: 1;
}

.productbox a {
	margin:auto;
	display:block;
	text-decoration:none;
	}

/*image  hover*/
.productbox a img{
	margin:auto;
	padding-bottom:1em;
	opacity: 1;
	-webkit-transition: opacity 0.2s linear;
	}
.productbox a:hover span, .productbox a:hover {
	background-color: transparent;
	text-decoration: underline;
}	
.productbox a:hover img {opacity: 0; filter:alpha(opacity=0);}
/* ie6 needs his fix*/
.productbox a:hover img {zoom:1;}
/*end hover*/
	
.productbox a span {
	background-image:none;
	font-size:medium;
	line-height: 120%;
	overflow: visible;
}
.atopie {
	color: #009999;
	background:url("i/p/atopiques_250_bg.png") 50% top no-repeat;
}
.atopiebg {color: #009999;}

.depigment {
	background:url("i/p/depigmentant_200_bg.png") 50% top no-repeat;
	color: #5D5269;
}
.depigmentbg {color: #5D5269;}

.antiage {
	background:url("i/p/antiage_200_bg.png") 50% top no-repeat;
	color: #85669B;
}
.antiagebg {color: #85669B;}


h2 a {
	color: #2E3163;
	text-decoration: none;}



/*---------------------------
Concept
-----------------------------*/

#TOC{
	display:block;
	float: right;
	clear: left;
	padding: 0;
	width: 8em;
	margin-top: -3em;
	line-height: 2em;
	text-align: left;
	margin-right: 0.5em;
}
#concept {
	display: block;
	float: left;
	clear: left;
	padding: 0 0 0 2em;
	overflow:auto;
	text-align:left;
	width: 36em;
	margin-top: -3em;
	height: 1%;
}

#concept h2:target, #concept h3:target {background: transparent; padding: 1em; background-color:#FFC;}

#concept h2 span, #concept h3 span {display:none;}
#concept h2:target span, .concept h3:target span {display:block;text-align:right; color:#999; font-size:0.5em;}

#concept #environnement_labels { margin-bottom: 2em; }
#TOC h3 {
	margin:0;
	text-transform: none;
}

#TOC h4 {
	margin-top: 3em;
	margin-bottom: 1em;
	color: #2E3163;
	font-style: normal;
	font-size: 1em;
	font-weight: bold;
	display: block;
	line-height: 2em;
	text-transform: none;
	letter-spacing: 1px;
}
#TOC p {text-align:inherit;
margin:0;}

/*---------------------------
single_product
-----------------------------*/

#productimg {
	display: block;
	float: left;
	clear:left;
	padding: 2em 0 0 0em;
	width: 17em;
	margin: .1em 0 0 .5em;
}
#productdescription {
	width:26em;
	display: block;
	float: right;
	text-align: left;
	overflow: visible;
	margin: .1em .5em 0 0;
	}


#productdescription p{
	line-height: 1.7em;
	margin: 0 0 0.5em 0;
	display: block;
	text-align: justify;
	}
	
#productdescription h3{
	clear:both;
	margin: 0.5em 0;
	}	
.prix {
	margin: 4em 0 0 0em;
	display:block;
	clear:left;
	float:left;
	font-size: 1.2em;
	letter-spacing: 1px;
	height: 30px;
	background: url(i/price_bg.gif) no-repeat;
	padding: 0 20px 0 11px;
	line-height: 30px;
}
/*ajouter  hover*/
#ajouter {
	margin:2em 0 0 0em;
	padding: 0em;
	display:inline-block;
	float:left;
	clear:none;
	opacity: 1;
	position: relative;
	text-align: left;
	left: -1px;
}

#afficher {
	margin:0.2em 0 0 0em;
	padding: 0em;
	display:inline-block;
	float:left;
	clear:none;
	position: relative;
	text-align: left;
	left: -1px;
}

#afficher:active, #ajouter:active  {
	opacity: 0.6;
	}
	


#productimg p {
	float: left;
	clear: left;
	display: block;
	margin: 1.5em 0.5em 0 .5em;
	text-align: left;
	font-size: 0.9em;
	line-height: 1.2em;
	color: #666;
	width: 9em;
}

#productimg img#paypallogo {
	display: inline-block;
	clear: left;
}

#panier {
		float:right;
		clear:both;
}

#fraisport {
	margin: 0.5em 0 0 0;
	display: inline-block;
}

#listsoins li {
	display: block;
	float: left;
	font-size: smaller;
}

/*----------------composition----*/
h2.trigger{
	padding: 0 0 0 34px;
	background: url(i/plusminus.gif) no-repeat;
	height: 30px;
	line-height: 30px;
	clear: both;
	border: 0;
	margin: 0 0 0 -3px;

}



h2.trigger a {
	color: #000000;
	text-decoration: none;
	display: block;
	font-size: 75%;
	font-family: MyriadPro-Regular, 'Myriad Pro Regular', MyriadPro, 'Myriad Pro', Helvetica, Arial, sans-serif;
	border: 0px;
	cursor: pointer;
}

h2.hover:hover {
	background-color:#FFC;
	border-bottom:0 ;
	text-decoration: none;
}
h2 a:hover {
	background-color:transparent;
	text-decoration: none;
	cursor: pointer;
}
h2.active {background-position: left bottom;
} /*--When toggle is triggered, it will shift the image to the bottom to show its "opened" state--*/
.toggle_container {
	overflow: hidden;
	clear: both;
}
.toggle_container .block { padding: 0px;}

	

/*---------------------------
comment nous trover
-----------------------------*/

#sidebar {
	margin-top: 0em;
	margin-left: 1em;
	padding-left: 1em;
	text-align: left;
	width: 16em;
	float: left;
	clear: left;
}

#map {
	float: right;
	width: 34em;
	height: 30em;
	margin: 0 1em 0 0;
}

#sidebar h2 {
	margin-top: 0px;
	margin-right: 0px;
}

#notreaddress, .notreaddress {
	text-align: left;
	margin-left: 1em;
	padding-left: 1em;
	margin-top: -3em;
	width: 15em;
	float: left;
	clear: left;
}
.pointsd {
	text-align: left;
	margin-left: 1em;
	padding-left: 1em;
	float: left;
	clear: left;
	width: 16em;
}
.pointsd h2 {margin:0em 0 1em -0.5em;}
.sidebar-entry { text-align:left; line-height:2.5em; }
a.sidebar-entry { color:inherit;}
a.sidebar-entry:hover {background-color: #FFC; text-decoration: underline}
a.sidebar-entry:focus {background-color:#FFC; text-decoration: none}
.iw-cell-2 {
	background-color: #FFC;
	font-weight:bold
}

#novel {display:none;}
#trouverintro p {
	text-align: left;
	padding: 0em 0em 0em 2em;
}

#notreaddress h2 { margin-right: 0px; }

/*---------------------------
qui sommes nous
-----------------------------*/

.illustration_right {
	display: block;
	float: right;
	margin: 0 10px 0 1em;
	padding: 5px;
	border: thin dotted #DDD;
	background-color:#fff;
	box-shadow: 0px 0px 5px #AAA;
	-moz-box-shadow: 0px 0px 5px rgba(100, 100, 100, .8);
	-webkit-box-shadow: 0px 0px 5px rgba(100, 100, 100, .8);
	filter: 
        progid:DXImageTransform.Microsoft.Shadow(color=#eeeeee,direction=0,strength=7)
        progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=90,strength=10)
        progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=180,strength=10)
        progid:DXImageTransform.Microsoft.Shadow(color=#eeeeee,direction=270,strength=7);
}

/*---------------------------
sortimata
-----------------------------*/

.productbox33 a img {
	text-align: center;
	margin: 0 auto 0 auto;
	vertical-align: bottom;
}

.productbox33 p { line-height: 1.2em; }

#concept p {
	line-height: 1.4em;
	text-align: justify;
	}

#produitsintro {
	text-align: justify;
	float: left;
	margin: 0 1em .1em 2em;
	width: 44em;
	clear: both;
	padding: 0;
	display: block;
}

#productdescription h1 {
	font-size:2.5em;
	font-weight:lighter;
	line-height: 1em;
	margin: 30px 0 0 0;
	position: relative;
	left: -0.3em;
}

img#paypallogo2 {
	clear:left;
	display: inline-block;
	margin: 0 0 -0em em;
	float: left;
}

.vigur {
	margin: 2em -2em 0 -2em;
	clear: both;
	background:transparent  url(i/uusgradient.png);
	background-repeat: no-repeat;
	background-position: 20% 50%;
	height: 50px;
}

.vigur1 {
	margin: 2em -2em 0 -2em;
	clear: both;
	background-image: url(i/uusgradient.png);
	background-repeat: no-repeat;
	background-position: 75% 50%;
	height: 50px;
}

.vigur3 {
	margin: 2em -2em 0 -2em;
	clear: both;
	background-image: url(i/uusgradient.png);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	height: 50px;
}

#productimg img {
	clear: none;
	float: right;
}
#productimg p img {
	clear: left;
	float: left;
	margin: 0 0 0 -7px;
}

h3 em { text-transform: none; 	margin: 0 0 0 -5px;
	margin: 0 0 0 -5px;
}

#concept h3 { margin-top: 1em; }

#down { margin-top: 3em;}

#punane {color:red;}
