/* CSS Document */


*{
margin:0;
padding:0;}

.spacer{
margin:0;
padding:0;
clear:both;
dsiplay:block;}

body{
margin:0;
padding:0;
background-color:#000000;}

#general{
width:1037px;
min-height:570px;
height:auto;
margin:40px auto;
background:#000 url(../images/back-left-right.gif) repeat-y 0 0;
}

#left{
float:left;
width:351px;
height:auto;}

h1{
width:351px;
heoght:115px;
background:url(../images/back-logo.jpg) no-repeat 0 0;}

a#logo{
width:255px;
height:115px;
display:block;
text-indent:-5000px;
background:url(../images/logo-echodesoi.jpg) no-repeat right bottom;}

dl#menu{
position:relative;
width:351px;
height:177px;
background:url(../images/back-menu.jpg) no-repeat 0 0;
padding-top:0px;}

dl#menu dt{
list-style:none;
width:227px;
height:18px;}

a#m0, a#m1, a#m2, a#m3, a#m4, a#m5, a#m6, a#m7{
width:227px;
height:18px;
display:block;
text-indent:-5000px;}

a#m0{background:url(../images/m0-accueil.jpg) no-repeat -227px 0;}
a#m0:hover{background:url(../images/m0-accueil.jpg) no-repeat 0 0;}
a#m1{background:url(../images/m1-approche.jpg) no-repeat -227px 0;}
a#m1:hover{background:url(../images/m1-approche.jpg) no-repeat 0 0;}
a#m2{background:url(../images/m2-imageperso.jpg) no-repeat -227px 0;}
a#m2:hover{background:url(../images/m2-imageperso.jpg) no-repeat 0 0;}
a#m3{background:url(../images/m3-imagepro.jpg) no-repeat -227px 0;}
a#m3:hover{background:url(../images/m3-imagepro.jpg) no-repeat 0 0;}
a#m4{background:url(../images/m4-entreprises.jpg) no-repeat -227px 0;}
a#m4:hover{background:url(../images/m4-entreprises.jpg) no-repeat 0 0;}
a#m5{background:url(../images/m5-partenaires.jpg) no-repeat -227px 0;}
a#m5:hover{background:url(../images/m5-partenaires.jpg) no-repeat 0 0;}
a#m6{background:url(../images/m6-actu.jpg) no-repeat -227px 0;}
a#m6:hover{background:url(../images/m6-actu.jpg) no-repeat 0 0;}
a#m7{background:url(../images/m7-contact.jpg) no-repeat -227px 0;}
a#m7:hover{background:url(../images/m7-contact.jpg) no-repeat 0 0;}

dl#menu dd#smenu1{
position:absolute;
display:block;
left:215px;
top:0;
width:69px;
visibility:hidden;
margin:0;
padding:0;
z-index:10;
}

dd#smenu1 ul{
list-style:none;
margin:0;
padding:0;
}

dd#smenu1 li{
list-style:none;
width:auto;
height:20px;}
a#m21, a#m22, a#m23{
display:block;
text-indent:-5000px;
width:69px;
height:20px;
}

a#m21{	background:url(../images/m21-feminin.gif) no-repeat -69px 0;}
a#m21:hover{background:url(../images/m21-feminin.gif) no-repeat 0 0;}
a#m22{	background:url(../images/m22-masculin.gif) no-repeat -69px 0;}
a#m22:hover{background:url(../images/m22-masculin.gif) no-repeat 0 0;}
a#m23{	background:url(../images/m23-visages.gif) no-repeat -69px 0;}
a#m23:hover{background:url(../images/m23-visages.gif) no-repeat 0 0;}


#citation{
width:261px;
background:#fff url(../images/back-guillements.jpg) no-repeat 0 0;
margin:30px 10px 0 80px;
}


/********************************************************************************/
/********************************************************************************/
/********************************************************************************/


#top-right{
float:left;
width:678px;
height:101px;
background:#000 url(../images/back-top.jpg) no-repeat right bottom;}

#content-right{
float:left;
background-color:#FFFFFF;
margin-left:20px;
}

/******************************      HOME      *********************************/



#paves-home{
float:left;
width:293px;}

#img-perso-home{
width:279px;
height:223px;
background:url(../images/back-paves1.gif) no-repeat 0 0;
padding:7px;}
#img-pro-home{
width:279px;
height:223px;
background:url(../images/back-paves2.gif) no-repeat 0 0;
padding:7px;}

#img-perso-home p, #img-pro-home p{
margin-left:20px;}

#img-perso-home h3{
width:280px;
height:40px;
display:block;
text-indent:-5000px;
background:url(../images/tit-image-perso.gif) no-repeat 16px 5px;}
#img-pro-home h3{
width:280px;
height:40px;
display:block;
text-indent:-5000px;
background:url(../images/tit-image-pro.gif) no-repeat 19px 5px;}




#valeurs-home{
float:left;
width:250px;
padding:0 20px 0 30px;}

h2#valeurs{
width:226px;
height:55px;
display:block;
text-indent:-5000px;
background:url(../images/tit-echodesoi-home.gif) no-repeat 0 0;}

#fond-right{
float:left;
width:65px;
height:469px;
background:url(../images/back-right-home.jpg) no-repeat 0 0;}


/********************************    APPROCHE   **********************************/

#content-right-type{
float:left;
background-color:#FFFFFF;
margin:20px 35px 35px 20px;
width:558px;
}

h2#approche{
width:287px;
height:32px;
display:block;
text-indent:-5000px;
background:url(../images/tit-notre-approche.gif) no-repeat 0 0;}

h3.puce1, h3.puce2, h3.puce3, h3.puce4{
height:20px;
font:12px Verdana, Arial, Helvetica, sans-serif;
color:#ff6600;
font-weight:bold;
margin-top:10px;
padding:5px 0 0 25px;}
h3.puce1{background:url(../images/puce1.jpg) no-repeat 0 0;}
h3.puce2{background:url(../images/puce2.jpg) no-repeat 0 0;}
h3.puce3{background:url(../images/puce3.jpg) no-repeat 0 0;}
h3.puce4{background:url(../images/puce4.jpg) no-repeat 0 0;}

.citation-type{
margin:30px 10px 0 85px;
}

/********************************    Image Personnelle : FEMININ   MASCULIN   VISAGE  **********************************/

h2#feminin{
width:330px;
height:32px;
display:block;
text-indent:-5000px;
background:url(../images/tit-perso-fem.gif) no-repeat 0 0;}

h2#masculin{
width:350px;
height:32px;
display:block;
text-indent:-5000px;
background:url(../images/tit-perso-masc.gif) no-repeat 0 0;}

h2#visage{
width:350px;
height:32px;
display:block;
text-indent:-5000px;
background:url(../images/tit-perso-visage.gif) no-repeat 0 0;}

h2#image-perso{
width:300px;
height:32px;
display:block;
text-indent:-5000px;
background:url(../images/tit-image-perso2.gif) no-repeat 0 0;}


h2#image-pro{
width:300px;
height:32px;
display:block;
text-indent:-5000px;
background:url(../images/tit-pro.gif) no-repeat 0 0;}

h2#entreprises{
width:300px;
height:32px;
display:block;
text-indent:-5000px;
background:url(../images/tit-entreprises.gif) no-repeat 0 0;}

h2#quisuisje{
width:300px;
height:32px;
display:block;
text-indent:-5000px;
background:url(../images/tit-quisuisje.gif) no-repeat 0 0;}


h2#partenaires{
width:300px;
height:32px;
display:block;
text-indent:-5000px;
background:url(../images/tit-partenaires.gif) no-repeat 0 0;}

h2#actu{
width:300px;
height:32px;
display:block;
text-indent:-5000px;
background:url(../images/tit-actu.gif) no-repeat 0 0;}

h2#sitemap{
width:300px;
height:32px;
display:block;
text-indent:-5000px;
background:url(../images/tit-sitemap.gif) no-repeat 0 0;}

h2#mentions{
width:300px;
height:32px;
display:block;
text-indent:-5000px;
background:url(../images/tit-mentions.gif) no-repeat 0 0;}


.floatleft{
float:left;
margin: 0 20px 5px 0;}
.floatright{
float:right;
margin: 0 0 5px 20px;}


h2.tarifs{
width:250px;
height:32px;
display:block;
text-indent:-5000px;
background:url(../images/tit-declinaisons.gif) no-repeat 0 0;}

ul.prestas{
font:11px Verdana, Arial, Helvetica, sans-serif;
color:#343434;
list-style:none;
padding-left:35px;}

ul.prestas li{line-height:15px;}
ul.prestas li.ssli-marron{
line-height:15px;
margin-left:-30px;
font:11px Verdana, Arial, Helvetica, sans-serif;
color:#7d544b;
font-weight:bold;}


h3#ss-perso-fem{
float:left;
width:139px;
height:64px;
background:url(../images/image-perso-feminin.jpg) no-repeat 0 0;
padding:250px 20px 20px 20px;
margin:0 10px 0 0;}
h3#ss-perso-hom{
float:left;
width:139px;
height:64px;
background:url(../images/image-perso-masculin.jpg) no-repeat 0 0;
margin:0 10px 0 0;
padding:250px 20px 20px 20px;}
h3#ss-perso-visage{
float:left;
width:139px;
height:64px;
background:url(../images/image-perso-visage.jpg) no-repeat 0 0;
margin:0;
padding:250px 20px 20px 20px;}


.etapes{
text-align:left;
width:230px;
margin:40px 0 0 85px;
background-color:#f7e2be;}

.etapes p{
font:10px Verdana, Arial, Helvetica, sans-serif;
color:#7d544b;
margin:10px;}

h2.image-etapes{
width:240px;
height:32px;
display:block;
text-indent:-5000px;
background:#fff url(../images/tit-approche.gif) no-repeat 10px 0;}

h2.temoignages{
width:240px;
height:32px;
display:block;
text-indent:-5000px;
background:#fff url(../images/tit-temoignages.gif) no-repeat 10px 0;}



/********************************    CONTACT   **********************************/

h2#contact{
width:287px;
height:32px;
display:block;
text-indent:-5000px;
background:url(../images/tit-contact.gif) no-repeat 0 0;}



#form-contact{
float:left;
width:500px;
font:11px Verdana, Arial, Helvetica, sans-serif;
color:#343434;
margin-top:20px;
padding-left:35px;
background-color:#f9ebd1;}

#form-contact label.champs{
float:left;
width:60px;
margin: 5px 15px 0 0;
font:11px Verdana, Arial, Helvetica, sans-serif;
color:#343434;}
label.champs-bt{
float:left;
width:170px;
margin: 5px 15px 0 0;
font:11px Verdana, Arial, Helvetica, sans-serif;
color:#343434;}

#form-contact li{
width:400px;
clear:both;}

li#champs-oblig{
color:#ff6600;
text-align:right;
}

form.form  input.champs, textarea.champs{
margin:2px 0;
float:right;
}

form.form  input.boutons{
margin:0 5px;
float:left;
}


form.form  li{
list-style:none;
text-align:left;
}

form.form a{
font-weight:bold;
color:#7d544b;
margin-left:110px;
font:11px Verdana, Arial, Helvetica, sans-serif;
text-decoration:none;}
form.form a:hover{
color:#7d544b;
text-decoration:underline;}

.erreur{
background-color:#fff;
border:1px solid red;
color:#ff66000;
float:right;
margin: 5px 0 0 0;
}

#error{
font:10px Verdana, Arial, Helvetica, sans-serif;
color:red;}

a#envoi{
width:200px;
height:30px;
display:block;
text-indent:-5000px;
margin-top:10px;
background:url(../images/bt-envoi-form.gif) no-repeat 100px 0;}
a#envoi:hover{
background:url(../images/bt-envoi-form.gif) no-repeat 100px 0;}



/**************************    FOOTER    ************************************/



#footer{
clear:both;
width:967px;
height:40px;
background:#000 url(../images/back-bottom.jpg) no-repeat 55px 0;
text-align:right;
padding:10px 70px 0 0;}

