/*===| I. MAIN LAYOUT  |=====================================================*/
* {margin: 0;}
html, body {height: 100%;width: 100%;}
ul, li{list-style: none;list-style-position: outside;	margin: 0;	padding: 0;}
p{padding: 0;}
.left{float: left;} .right{float: right;}
#push, .clr	{clear: both;}

body{background:#ffffff;}
#bg1{position:absolute;z-index: 1; width:100%;}
#bg0{position:absolute;z-index: 1; width:100%;}
#bg2{position:absolute;z-index: 2; width:100%;}
#bg3{position:absolute;z-index: 3;}

#wrap-container{position:relative;z-index:4; width: 100%;}
#container{margin:0 auto; text-align: left;}
#content{background:url("images/bg-container.jpg") center top repeat-y;}
#wrap-container1{position:absolute; top:25%; width: 100%;}

/* ===| II. HEADER ELEMENTS |================================================*/
#site-header.outter{}
#site-header .inner{}

/* ===| III. LEFT COLUMN ELEMENTS |===========================================*/
#left-outter{float:left; margin: 0; overflow: hidden;}
#left-inner{padding:18px 19px 0px 21px;}

/* ===| IV. RIGHT COLUMN ELEMENTS |===========================================*/
#right-outter{	float:left;	margin:0; padding:0; overflow: hidden;}
#right-inner{padding:18px 0px 0px 0px;}


/*................actualites...................*/
#actualite{
	width:291px;
	height:182px;
	background: url(../../images/charte/bg-actualites.jpg) no-repeat top left;
}
#actualite div.inner{
    padding:41px 4px 0 20px;
	height:98px;
}
	#actualite div.inner img{
	  border: solid 1px #ffffff;
	  float:left;
	  margin:14px 14px 0 0px;
	}
	#actualite .inner p {
	  padding-right:35px;
	}
#detail{
  float: right;
  padding-right:41px;
  padding-top:1px;
}
.mdm-pages{ text-align:center; padding-bottom:10px; padding-top:10px;}


/*..................coordonnees.................................*/
#contact-info{
	width:291px;
	height:209px;
	background: url(../../images/charte/bg-coordonnees.jpg) no-repeat top left;
}
.title-info{ 
	padding-top:68px;
	padding-bottom:8px;
}
#info-text{
	float:left;
	width:150px;
	padding-left:20px;
}
	#info-text p{
		float:left;
		line-height:14px!important;
		padding-top:6px;
	}
#text-info{margin-top:0px; margin-bottom:11px; width:150px;}

.mail-adress{ padding-left:18px; padding-top:1px;}

/*..................................... plan ....................................*/
#plan-image{
	float:left;
	padding-top:10px;
	padding-bottom:0px!important;
	margin-bottom:0px!important;
}
.plan-button{
  width: 180px;
  float: left;
  text-align: left;
}
	.plan-button img{
	  margin: 10px 4px 0 0px;
	  float: left;
	}

/*..................idees.................................*/
#idees{
	width:291px;
	height:174px;
}

/* ===| V. FOOTER BOXES |=====================================================*/
#wrap-footer {position:relative; z-index: 4;}
#fwrap1 {position:absolute; z-index: -3; left:0; }
#fwrap2 {position:absolute; z-index: -2; left:0; }
#fwrap3 {position:absolute; z-index: -1; left:0; }

#footer.outter	{ margin: 0 auto; padding: 0px; background:url("images/bg-footer.jpg") no-repeat top center; height:67px;}
#footer .inner	{padding: 0 0 0px;}

/*..................newsletter.................................*/
#newsletter{
	width:270px;
	height:41px;
	position:absolute;
	top:10px;
	padding-left:708px;
    background: url(images/bg-news.jpg) no-repeat right top;
}
.inForm{
	width:224px;
	height:16px;
	margin:0px;
	border: solid 1px #ebb3c1;
	background-color:#ffffff;
	font-family: Arial;
	font-size: 11px;
	font-weight: normal;
	color: #575757;
    float:left;
    padding-left: 5px;
}
.inFormOver{
	width:224px;
	height:16px;
	margin:0px;
	border: solid 1px #c05b7a;
	background-color:#f7e1e7;
	font-family: Arial;
	font-size: 11px;
	font-weight: normal;
	color: #881834;
    float:left;
    padding-left: 5px;
}

.buttonOK{
	background:url(../../images/charte/ok.jpg) no-repeat top left;
	width: 29px;
	height: 20px;
    float: left;
	margin-left:1px;
}
.buttonOKover{
    background:url(../../images/charte/ok-over.jpg) no-repeat top left;
	width: 29px;
	height: 20px;
    float:left;
	margin-left:1px;
	cursor: pointer;
}

/* ===| VI. OTHER ELEMENTS |====================================================*/
img {border: 0;}
	
img.thumb{
	margin:0px 18px 0px 0px; 
	width:123px; 
	height:158px; 
}
img.thumb0{
	margin:0px 0px 0px 10px; 
	width:157px; 
	height:104px; 
}
img.thumb1{
	margin:0px 17px 0px 0px; 
	width:46px; 
	height:64px; 
}
img.thumb2{
	margin:0px 0px 0px 0px; 
	width:117px; 
	height:64px; 
}
img.thumb3{
	margin:0px 18px 0px 0px; 
	width:157px; 
	height:104px; 
}
img.thumb4{
	margin:117px 0px 0px 10px; 
	width:123px; 
	height:158px; 
}
img.thumb5{
	margin:5px 18px 0px 0px; 
	width:157px; 
	height:104px; 
}
img.thumb6{border:1px solid #72b400; padding:3px; margin:0 10px 0 0px; background:#ffffff;}


#menu2 ul li{display: inline;}

.separator{width:100%;	height:0px; clear:both; padding:0; margin:15px 0; border-top: 1px solid; border-bottom: 1px solid; line-height: 0px; font-size: 0; overflow: hidden;}
.line{width:100%;	height:1px; clear:both;}

.title{
	background:url(../../images/charte/bg-h1.jpg) no-repeat top left;
	height:58px;
	width: 658px;
	margin-bottom:16px;
}
.title1{
	background:url(../../images/charte/bg-h1.jpg) no-repeat top left;
	height:43px;
	width: 658px;
	padding-top:15px;
	margin-bottom:5px;
}

.text-color{ color:#6eae00; font-weight:bold;}
.text-color1{ color:#c15470; font-weight:bold;}

.text-page{ padding-top:4px;}
.text-page0{ padding-top:11px; padding-bottom:14px;}
.text-page1{ padding-top:5px;}

.paragraph{ width:100%; float:left; padding-top:13px; padding-bottom:10px;}
.paragraph1{ width:100%; float:left; padding-top:11px; padding-bottom:10px;}
.paragraph2{ width:100%; float:left;}
.paragraph3{ width:100%; float:left; padding-bottom:10px;}


/*............................ list ..........................................*/
ul.list{
	padding:0px 0px 0px 0px;
    float:left;
    margin: 0;
	width:88px;
	}
	ul.list li{
		background: url(../../images/charte/bullet.jpg) no-repeat top left;
		background-position:0px 7px;
		text-align:left;
		line-height:20px;
		font-family: Arial;
		font-size: 12px;
		color:#333333;
		font-weight:normal;
		padding:0px 0px 1px 12px;
	}
ul.list0{
	padding:0px 0px 0px 17px;
    float:left;
    margin: 0;
	width:200px;
	}
	ul.list0 li{
		background: url(../../images/charte/bullet.jpg) no-repeat top left;
		background-position:0px 7px;
		text-align:left;
		line-height:20px;
		font-family: Arial;
		font-size: 12px;
		color:#333333;
		font-weight:normal;
		padding:0px 0px 1px 12px;
	}
ul.list1{
	padding:2px 0px 0px 0px;
    float:left;
    margin: 0;
	width:430px;
	}
	ul.list1 li{
		background: url(../../images/charte/bullet.jpg) no-repeat top left;
		background-position:0px 9px;
		text-align:left;
		line-height:24px;
		font-family: Arial;
		font-size: 12px;
		color:#333333;
		font-weight:normal;
		padding:0px 0px 1px 12px;
	}


/*.......................................... bg text ....................................*/
.bg-text{
	width:426px;
	height:88px;
	float:left;
	padding:16px 36px 0px 21px;
	margin-top:1px;
	background: url(../../images/charte/bg-text.jpg) no-repeat left top;
}
.bg-text0{
	width:441px;
	height:88px;
	float:left;
	padding:16px 21px 0px 21px;
	margin-top:1px;
	background: url(../../images/charte/bg-text.jpg) no-repeat left top;
}
.bg-text1{
	width:466px;
	height:82px;
	float:left;
	padding:15px 25px 0px 26px;
	margin-top:6px;
	margin-bottom:1px;
	background: url(../../images/charte/bg-text1.jpg) no-repeat left top;
}
.bg-col1{
	float:left;
	width:150px
}
.bg-col2{
	float:left;
	width:264px;
	padding-left:52px;
}

.bg-text2{
	width:638px;
	height:179px;
	float:left;
	padding:5px 10px 0px 10px;
	margin-top:6px;
	margin-bottom:5px;
	background: url(../../images/charte/bg-text2.jpg) no-repeat left top;
}
.bg-text3{
	width:638px;
	height:124px;
	float:left;
	padding:10px 10px 0px 10px;
	margin-top:6px;
	margin-bottom:0px;
	background: url(../../images/charte/bg-text3.jpg) no-repeat left top;
}
	.bg-text3 img{ padding-top:6px;}
.bg-text4{
	width:638px;
	height:113px;
	float:left;
	padding:11px 10px 0px 10px;
	margin-top:6px;
	margin-bottom:0px;
	background: url(../../images/charte/bg-text4.jpg) no-repeat left top;
}
.bg-text5{
	width:638px;
	height:43px;
	float:left;
	padding:20px 10px 0px 10px;
	margin-top:6px;
	margin-bottom:20px;
	background: url(../../images/charte/bg-text5.jpg) no-repeat left top;
}
	.bg-text5 p{ 
		text-align:center;
		font-weight:bold;}
	
	
/*.............................. table .........................................*/
table.design{
    margin:0px 0px 10px 0px;
	float:left;
}

	table.design td {
		padding: 3px 5px;
		border: 1px solid #f5cdda;
		background-color: #fff8fa;
		color: #333333;
	}
table.design0{
    margin:8px 0px 10px 0px;
	float:left;
}

	table.design0 td {
		padding: 3px 5px;
		border: 1px solid #f5cdda;
		background-color: #fff8fa;
		color: #333333;
	}
table.design1{
    margin:0px 0px 0px 0px;
	float:left;
}
	table.design1 td {
		padding: 3px 5px;
		border: 1px solid #f5cdda;
		background-color: transparent;
		color: #333333;
	}
table.design2{
    margin:0px 0px 0px 0px;
	float:left;
}

	table.design2 td {
		padding: 3px 5px;
		border: 1px solid #f5cdda;
		background-color: #fff8fa;
		color: #333333;
	}


.highlight{color: #911837!important; font-weight:bold; text-align:center!important; margin:0 auto; width:50px!important;}
.highlight0{color: #911837!important; font-weight:bold; text-align:center!important; margin:0 auto; width:95px;}
.highlight1{color: #c44e73!important; font-weight:bold; text-align:center!important; margin:0 auto;}

.table-width{ width:270px;}
.table-width0{ width:600px;}
.table-width1{ width:410px;}
.table-width2{ width:390px;}
.table-width3{ width:345px;}
.table-width4{ width:140px;}
.table-width5{ width:340px;}
.table-width6{ width:540px;}


.text-table{ padding-left:20px; padding-top:5px;}

/*.......................................... expand buttons .................................................*/

.expand-button1{
    float: left;
    background: #a32a48 url(../../images/charte/soins-visage.jpg) no-repeat top left;
    width:653px;
    height:45px;
    cursor: pointer;
    padding: 0px 5px 0px 0px;
	border-bottom: solid 1px #881834;
}
.expand-button1-over{
    float: left;
    background: #dc8aa4 url(../../images/charte/soins-visage-over.jpg) no-repeat top left;
    width:653px;
    height:45px;
    cursor: pointer;
    padding:0px 5px 0px 0px;
	border-bottom: solid 1px #c86e8a;
}
.expand-button2{
    float: left;
    background: #a32a48 url(../../images/charte/soins-corps.jpg) no-repeat top left;
    width:653px;
    height:45px;
    cursor: pointer;
    padding: 0px 5px 0px 0px;
	border-bottom: solid 1px #881834;
}
.expand-button2-over{
    float: left;
    background: #dc8aa4 url(../../images/charte/soins-corps-over.jpg) no-repeat top left;
    width:653px;
    height:45px;
    cursor: pointer;
    padding:0px 5px 0px 0px;
	border-bottom: solid 1px #c86e8a;
}

.right3{float: right; margin: 0px 0px 0px 0px; margin-bottom:0px; }
.collapse-div{float:left; width:658px; padding-bottom:5px;}


/*........................................ slider ..........................................................*/
#slider-code { height: 158px; overflow:hidden; float:left; padding-right:22px; padding-bottom:15px; }
#slider-code .viewport { float: left; width: 123px; height: 158px; overflow: hidden; position: relative; }
#slider-code .buttons { display: block; margin: 70px 2px 0 0; float: left; }
#slider-code .next { margin: 70px 0 0 2px;  }
#slider-code .disable { visibility: hidden; }
#slider-code .overview { list-style: none; position: absolute; padding: 0; margin: 0; left:0; top: 0; }
#slider-code .overview li{ float: left; margin:0px; padding-bottom:0px; height:158px;  width: 123px;}
						
/*........................................ mentions-legales .................................................*/

.text-mentions{
	float:left;
	width:220px;
}

.text-mentions1{
	float:left;
	width:300px;
	padding-top:10px;
}
	.text-mentions1 p{ padding-top:9px;}
.text-mentions2{
	float:left;
	width:400px;
	padding-left:90px;
}	
.coordonnees-mentions{
	padding-top:20px;
}
.img-mentions{
	float:left;
	padding-right:25px;
	height:100px;
}
.icon-tel{ 
	float:left; 
	padding-right:10px;
}


/* ===| VII. CONTACT FORM |=====================================================*/
#frmContact{margin: 0; padding: 5px; width: 98%;}
#frmContact label{display: block; padding: 4px 2px; border-bottom: 1px solid #ffffff; clear:both;}
#frmContact label span{display:block; width: 29%; float: left;}
#frmContact label input, #frmContact label textarea{width: 40%; vertical-align: top;}

div.submit-buttons{clear: both;	text-align: center; padding: 4px 2px;}
div.submit-buttons input{	border: 1px solid #fff; background: #ccc;}
div.submit-buttons a:hover input{ border: 1px solid #ccc; background: #fff;}