/* ******************classes pour definir le cadre aux bord arrondis ****************** */
/* ///la div contennant le cadre/// */
.cadre {
width: 850px;
background-color: #FFF;
margin: 40px 0 0 0;
padding: 0;
}

/* ///lla classe bord definissant les propriété communes entre topet left/// */
.bord {
height: 16px;
width: 850px;
background-repeat: no-repeat;
position: relative; /* position relative pour psitionner un element sur celui ci */
}
/*//la ligne arondie haut//*/
.top {
background-image: url("../images/top.gif");
}
/*//la ligne arondie bas//*/
.bottom {
background-image: url("../images/bottom.gif");
}
/*//les lignes de cot?/*/
.interieur {
border-left: 2px solid #fee287;
border-right: 2px solid #fee287;
}
.clearer{
clear : both;
height: 0px;
}

/* ****************** mise en forme page ****************** */

body{
font:12pt black verdana, sans-serif;
background-color:white;
color:#9E9E9E;
margin-top:0px;
}

#wrapper{
margin: 0 auto 0 auto;
width: 850px;
}

/*//div de  dimension fixe qui contient l'image de banniere//*/
#banniere{
width: 850px;
height: 200px;
margin: 0px 30px 5px 0;
padding: 0px;
}

/*config des images de la page */
img{
border:0;
}
/*config des liens de la page */
a{
/*color:#FCC300;*/
color:#2e9edc;
font-weight: bold;
text-decoration:none;
}
a:hover{
color:#acacac;}

/* config de base  des menus de la pages*/
#menu ul, #pied ul{
margin:0px;
list-style-type:none;
padding:0px;
text-align:center;
}

/* ********************** mise en forme menu ************************ */

/* -------------//menu principal//----------------- */
#topmenu {
position: absolute; /*positionnement absolue par rapport ?a posito relative du cadre */
top: -13px; /*positionnement sur la ligne sur cadre */
left: -10px; /*pistionnement centre */
width:870px;
height:27px;
background: url("../images/fondmenu.png");  /*image de fond du menu */
background-repeat: repeat-x;

}

/*//sections du menu principal//*/
#topmenu > li{
float:left; /* float gauche pour aligner les li */
height:27px;
padding:0px;
margin:0px;
/*width:101px; */
line-height: 26px;
font-size: 14px;
}

/* couleurs des liens du menu*/
#topmenu > li > a{
float:left;
/*width:101px; */
height:27px;
color:#2e9edc;
padding-left:6.2px;
padding-right:6.2px;
}

#topmenu #first_menu > a{
  word-spacing: -1px;
}
#topmenu .sep{
  color:#2e9edc;
  font-weight:bold;
}

/*//coloration du texte en rollover//*/
#topmenu  > li  > a:hover{
color:#df8126;
background-image: url("../images/fondhover.png");
background-repeat: repeat-x;
}
/*#topmenu  li:hover  > .sousmenu{
display:block;
}*/

/*#topmenu #long_menu{
  width:140px;
}*/

#topmenu #long_menu a{
/* width:140px;*/
 word-spacing: -1px;
}
/*------//sous menu //-----------------*/

.sousmenu{
z-index:1;
display:none;
font-size: 0.9em;
top: 30px;
height:40px;
position:absolute;
width:690px;
line-height:30px;
}
/*//alignement du texte du sous menu//*/
.sousmenu li{
float:left;
height:35px;
}
/*taille des parties du sous menu power plate */
#parties_pwp li{
width:125px; 
}
/*taille des parties du sous menu amincissement */

#parties_mince li{
  padding-left:20px;
}

/*taille des parties du sous massage*/
#parties_massages li{
width:180px; 
}

.sousmenu a{
float:left;
color:#9E9E9E;
height:35px;
}
/*taille des liens du sous menu power plate */
#parties_pwp a{
width:130px; }

/*taille des liens du sous menu massage*/
#parties_massages a{
width:180px; }

.sousmenu a:hover{
color:#FCC300;
}

#menu .interieur{
height: 25px;
}

/* ****************** mise en forme page contenu ****************** */

/*//alignement du  titre par rapport au cadre top//*/
#titre {
background-image: url("../images/fondhover.png");
background-repeat: repeat-x;
position: absolute;
top: -11px;
width: 160px;
left: 345px;
text-align:center;
}

/*//marges de la div du contenu texte  sans enelver le bords du contenu//*/
#texte {
margin:0;
padding: 10px 20px 40px 20px;
font-size: 0.8em;
text-align:justify;
}

/* titre des pages */
h1{
font-size:1.2em;
color: #df8126;
margin:0;
padding:0;
font-weight:normal;
}
/*sous titres des pages */
h2{
font-size:1.2em;
color:#2e9edc;
margin-left:0;
margin-bottom:0;
}

h3{
font-weight:bold;
font-size:1em;
}



#texte ul{
text-align:left;
}
/*bare sous le sous titre */
.bare{
width:280px;
height:2px;
background-image:url("../images/bare2.gif");
margin-bottom:20px;
background-repeat:no-repeat;
}

/*bare  de liens ver haut de page */
.bare_hp{
background-image:url("../images/bare_haut_page.gif");
margin-bottom:20px;
width:81px;
height:2px;
background-repeat:no-repeat;
}
.haut_page{
float:right;
width:100px;
font-size: 0.8em;
margin-right:0;
}
.haut_page a{
color:#FCC300;
}
.haut_page a:hover{
color:#df8126;
}
/*float des  photos*/
.photodroite{
float:right;
margin-left:20px;
}
.photogauche{
float:left;
margin-right:20px;

}
.photo_massage{
  margin-bottom:10px;
}

.photocentre{
text-align:center;
}

.photo_marge_bas{
 margin-bottom:30px;
}

.photo_marge_haut{
 margin-top:30px;
}

.contenudroit{
float:right;
}


.colonnes_trois{
   float:left;
   width:30%;
   margin-left:15px;
   margin-right:15px;
}

/* les sous parties  */
.sous_parties{
color:#df8126;
font-weight:bold;
text-align:center;
margin:0;
padding:0;
margin-bottom:30px;
}
.sous_parties a{
color:#FCC300;
}

.sous_parties a:hover{
color:#df8126;
}

/* *********partie Index ************** */
#index .photodroite{
width:400px;
}

#index{
    position: relative;
    margin-bottom:20px;
}

#index .dispo_medical{
    position:absolute;
    bottom:-60px;
    left:150px;
}

#index .dispo_medical img{
    width:80px;
}
/* *********partie Power Plate ************** */
/* la photo de la pwoer plate entoure le texte */
#texte_haut_pwp {
height:252px;
background-image:url("../images/power_plate_machine.jpg");
background-repeat:no-repeat;
background-position:right top;
padding-right:100px;
}

#texte_bas_pwp{
margin-top:30px;
}

#texte_bas_pwp  .photogauche{
width:450px;
margin-right:20px;
margin-top:10px;
}
#texte_pwp_droit{
float:left;
width:300px;
}
#texte_pwp_droit ul{
margin-top:0;
}
#texte_bas_pwp li{
margin-bottom:5px;
}

/*.pwp{
    position: relative;
}
.pwp .dispo_medical{
   position: absolute;
   width:100px;
   top:-5px;
   left:5px;
}*/

.pwp .dispo_medical img{
    width:100px;

}
/* *********partie power bike************** */
#power_bike ul{
    margin:0;
    padding:0;
}
#power_bike li{
    padding:0px;
}

#power_bike .premier{
    margin-left:10px;
}
#power_bike .dernier{
    margin-right:0px;
}
#power_bike h4{
    margin:0;
    margin-bottom:5px;
}

#power_bike .photogauche{
    margin-bottom:10px;
}

/* *********partie musculation************** */
#musculation  .photodroite{
width:400px;
margin-top:20px;
}

#musculation  .photogauche{
width:250px;
}

/* *********partie amincissement************** */

#amincissement .photodroie{
width:258px;
}

#amincissement .photogauche{
width:150px;
margin-bottom:10px;
}

#amincissement li{
margin-left:40px;
}
/****** sous partie wrap ******/
#wrap .photogauche{
width:170px;
margin-right:0px;
}
#wrap .contenudroit{
width:630px;
}

/****** sous partie narl******/

#sceance_narl{
margin:0 auto 0 auto;
width : 750px;
}
#sceance_narl .photogauche{
width:400px
}
#sceance_narl div{
margin-top:100px;
float:left;
width:300px;
}

#sceance_narl ul{
margin-left:20px;
}
/* *********partie remise en forme************** */

#remise_en_forme .photogauche{
margin-top:7px;
width:350px;
}
/* *********inovo************* */

#inovocontenu  div {
width:353px;
margin:10px auto 30px auto;
}
#inovobienfaits{
float:left;
margin-right:30px;
}
#inovoamelio{
float:left;
margin-right:30px;
}
#inovotout{
margin: 0 auto 20px auto;
width: 600px;
}
/* *********debussy************* */

#debussycontenu{
float:left;
width:490px;

}

#debussycontenu2{
float:left;
width:390px;
margin-top:20px;

}
.catDebussy #titre, .catMassage #titre, .catInovo #titre{
width:250px;
left:300px;
}

#logoDebussy{
height:115px;
width:389px;
margin: 0 auto 0 auto;
margin-bottom:10px;
}

#debussy  .photodroite{
width:400px;
margin-left:10px;
}

#debussy  .photogauche{
width:300px;
margin-right:10px;

}

#debussy .photocentre{
width:400px;
height:153px;
margin: 0 auto 0 auto;
margin-bottom:20px;
margin-top:10px;
}
/* *********partie energetique************** */

#lithotherapie .photogauche{
width:114px;
margin-top:10px;
}

#reiki .photogauche{
width:275px;
}

#reiki:first-child{
padding-top:30px;
}

#reiki li{
margin-left:20px;
padding-top:5px;
}

/* *********partie massage************** */

#huiles .photogauche{
width:200px;
}

#herbal .photogauche{
width:300px;
}

#rose.photodroite{
width:300px;
}

#massage h2{
margin-top:30px;
}
#tibetcontenu{
background-image:url("../images/mer_morte.jpg");
background-repeat:no-repeat;
background-position:left top;
height:262px;
margin-bottom:30px;
}
#tibet1{
margin-left:310px;
}
#tibet2{
margin-left: 170px;
}


#contact .photogauche{
width:90px;
}
#contact .libele{
float:left;
width:30px;
}

#contact a{
color:#FCC300;
}
#contact a:hover{
color:#acacac;
}

#formulaire div{
margin:10px 0 10px 0;
}
#formulaire {
width:650px;
margin: 40px auto 20px auto;

}
#formulaire label{
float:left;
width:100px;
}

.bouton input{
float:left;
width:100px;
margin:20px 10px 10px 10px;
}
.bouton{
height : 50px;
width : 400px;
left : 100px;
padding-top : 0px;
padding-left : 90px;

}

/* *********partie accces************** */

#adresse .photogauche{
width: 300px;
margin:90px 0 10px 0;
text-align:center;
}
#adresse .photodroite{
width:468px;
margin:30px 0 10px 0;
}

/*//alignement du logo par rapport au cadre bottom//*/

#logo {
position:absolute;
left:375.5px;
top: -11px;
width:105px;
height:65px;
}


/* ****************** mise en forme pied de page ****************** */
#pied {
width:850px;
}
#pied li {
font-size:0.7em;
display:inline;
padding-right:3px;
padding-left: 3px;
word-spacing:-1px;
}




/* menu séparé en deux ul pour passer outrele logo */
#basMenuGauche{
float: left;
width: 376px;
}

#basMenuDroit{
float: right;
width: 368px;
text-align:left !important;
}
#basMenuDroit li{
padding-right:2px;
padding-left: 2px;
}
/* couleur  desliens */
#pied a{
color:#9E9E9E;
}
#pied a:hover{
color:#FCC300;
}



.lien_important{
    text-align:center;
    padding-left:5px;
    padding-right:5px;
    font-size: 14px;
    color: red!important;
}

.lien_important:hover{
    color: #CB324E!important;
}

.sep_rouge{
    color:red;
    font-size:14px;
    font-weight: bold;
}
