@charset "utf-8";

/* ====================================================================================================== */
/* ======== STRUCTURE DE LA PAGE ======================================================================== */
/* ====================================================================================================== */

#page{ width:1000px; margin:0 auto; padding:0px; background-image: url(../imgs/interface/back-page.gif); background-repeat: no-repeat; background-position: 0px 98px; }
#header{ height:98px; background-image: url(../imgs/interface/back-header.gif); background-repeat: no-repeat; background-position: 0px 0px; }
#header .logo{ float:left; margin:0 68px 0 45px; display:block; width:132px; height:74px; background-image: url(../imgs/interface/logo-header.gif); background-repeat: no-repeat; background-position: 0px 0px; }
#header .logo b{ display:none; }
#header .links{ float:left; border-bottom:1px solid #4c7a6b; padding:0 13px; margin:25px 0 0 0; display:block; height:24px; line-height:24px; text-transform:uppercase; color:#FFFFFF; font-size:0.9em; font-weight:bold; text-decoration:none; background-image: url(../imgs/interface/puce-header.gif); background-repeat: no-repeat; background-position: 0px 2px; }
#header .links:hover{ background-image: url(../imgs/interface/puce-header-on.gif); }
#header .inscription{ display:block; font-size:11px; font-weight:bold; line-height:20px; text-decoration:none; float:right; margin:76px 30px 0 0; width:100px; height:20px; background-image: url(../imgs/interface/bout-inscription-top.gif); background-repeat: no-repeat; background-position: 0px 0px; text-align:center; /*color:#1aa596;*/color:#ffffff; text-transform:uppercase; }
#header .inscription:hover{ color:#CCCCCC; }
#contenu{ margin:0 10px; background:#FFFFFF;}
#footer{ height:84px; background-image: url(../imgs/interface/back-footer.gif); background-repeat: no-repeat; background-position: 0px 0px; margin:0; padding:0; }
#footer .inscription{ color:#FFFFFF; font-size:0.85em; display:inline-block; position:relative; left:34px; top:28px; height:20px; line-height:20px; }
#footer .inscription a{ width:90px; height:20px; display:inline-block; text-align:center; font-weight:bold; color:#FFFFFF; text-decoration:none; line-height:20px; background-image: url(../imgs/interface/bout-inscription.gif); background-repeat: no-repeat; background-position: 0px 0px; }
#footer .inscription a:hover{ color:#003160; }
#footer .adresse{ color:#96b3a6; font-size:0.85em; float:right; margin:40px 18px 0 0; }
#footer .adresse a{ color:#ffffff; text-decoration:none; }
#footer .adresse a:hover{ color:#003160; }


/* ====================================================================================================== */
/* ======== COLONNES ==================================================================================== */
/* ====================================================================================================== */

#left{ float:left; /*border:1px dashed #FF0000;*/ }
#middle{ float:left; /*border:1px dashed #FF0000;*/ }
#right{ float:right; /*border:1px dashed #FF0000;*/ }
#left.home{width:530px; float:left; margin:0 0 0 70px;}
#left.home ul{ color:#099866; margin:0 0 0 16px; padding:0; font-size:1.0em; list-style-image: url(../imgs/interface/puce-gd-encadre.gif); }
#right.home{ width:300px; margin-right:40px; /* border:1px dashed #FF0000; */ }
#left.inscription{ width:300px; margin:0; }
#left.diagnostic{ width:300px; margin:0 10px; }
#left.monespace{ width:580px; margin:0 0 0 80px; color:#003160; }
#left.monsuivi{ margin:60px 0 0 80px; width:580px; }
#left.monsuivitableau{ margin:30px 0 0 80px; margin-bottom:50px; width:820px; /*border:1px dashed #FF0000;*/ }
#left.traitement{ width:400px; margin:60px 0 0 0;}
#left.recommandation{ width:430px; margin:0 0 0 80px; color:#003160;}
#left.mesdonnees{ width:410px; margin-left:180px; }
#left.mesconseils{ margin:40px 0 0 80px; width:610px; }


#middle.inscription{ margin-left:20px; width:auto; }
#middle.diagnostic{ width:320px; }
#right.inscription{ margin-right:230px; width:auto; }
#middle.demarrecure{ margin-right:10px; margin-left:20px; width:auto; }
#right.diagnostic{ margin:180px 20px 0 0; padding:0; width:auto; }
#right.texte{ margin-right:40px; margin-top:120px; width:600px; }



/* ====================================================================================================== */
/* ======== NAVIGATION INTERIEURE ======================================================================= */
/* ====================================================================================================== */

/* NAV MON ESPACE (right) */
#nav-espace{ width:200px; float:right; margin-right:70px; margin-bottom:30px;}
#nav-espace .top{background-image: url(../imgs/interface/nav-monespace-top.jpg);background-repeat: no-repeat;background-position: 0px 0px;height: 350px;width: 200px; }
#nav-espace .bottom { padding:0 10px 15px 15px; background-image: url(../imgs/interface/nav-monespace-bottom.jpg); background-repeat: no-repeat; background-position: 0px bottom; }
#nav-espace .bottom a { color:inherit; text-decoration:none; display:block; color:#006851; font-size:1.2em; font-weight:bold; padding:0 0 0 10px; background-image: url(../imgs/interface/nav-monespace-fleche.gif); background-repeat: no-repeat; background-position: 2px 7px; margin-bottom:5px; }
#nav-espace .bottom a:hover, #nav-espace .bottom a.on { color:#003160; }

/* NAV CONNECTE (home) */
#nav-connecte { position:absolute; margin-top:74px; margin-left:160px; height:24px; line-height:24px; }
#nav-connecte a { text-transform:uppercase; font-size:11px; font-weight:bold; color:#FFFFFF; text-decoration:none; margin-right:6px; padding-left:12px; background-image: url(../imgs/interface/nav-connecte-puce.gif); background-repeat: no-repeat; background-position: 0px center; }
#nav-connecte a:hover,#nav-connecte a.on{ color:#003066; }


/* ====================================================================================================== */
/* ======== FORMULAIRE CONNEXION+INSCRIPTION ============================================================ */
/* ====================================================================================================== */
/*
#connexion label{ display:block; color:#9c9d9f; text-transform:uppercase; height:20px; line-height:20px; font-size:11px; font-weight:bold; margin:5px 0; }
#connexion input{ float:right; height:18px; width:178px; border:1px solid #FFFFFF; line-height:18px; font-size:12px; background-image: url(../imgs/interface/fd-champ.gif); background-repeat: no-repeat; background-position: 0px 0px; padding-left:5px; }
*/
#connexion label{ vertical-align:middle; float:left; color:#9c9d9f; text-transform:uppercase; font-size:11px; font-weight:bold; margin:3px 0; }
#connexion input{ vertical-align:middle; float:right; height:18px; width:178px; border:1px solid #FFFFFF; line-height:18px; font-size:12px; background-image: url(../imgs/interface/fd-champ.gif); background-repeat: no-repeat; background-position: 0px 0px; padding-left:5px; }


a.connexion{ display:block; font-size:11px; font-weight:bold; margin:3px 0; line-height:20px; text-decoration:none; width:100px; height:20px; background-image: url(../imgs/interface/bout-connexion.gif); background-repeat: no-repeat; background-position: 0px 0px; text-align:center; color:#1aa596; text-transform:uppercase; }
a.connexion:hover{ color:#003160; }
.valider6{ position:absolute; margin-top:-35px; left:710px; display:block; width:120px; height:120px; background-image: url(../imgs/forms/etape2.png); background-repeat: no-repeat; background-position: 0px 0px; }
.valider5{ position:absolute; margin-top:40px; left:340px; display:block; width:120px; height:120px; background-image: url(../imgs/forms/etape2.png); background-repeat: no-repeat; background-position: 0px 0px; }
.valider4{ position:absolute; margin-top:10px; left:450px; display:block; width:120px; height:120px; background-image: url(../imgs/forms/etape2.png); background-repeat: no-repeat; background-position: 0px 0px; }
.valider3{ position:absolute; margin-top:-105px; left:485px; display:block; width:120px; height:120px; background-image: url(../imgs/forms/etape2.png); background-repeat: no-repeat; background-position: 0px 0px; }
form .valider2{ position:absolute; margin-top:-105px; left:335px; display:block; width:120px; height:120px; background-image: url(../imgs/forms/etape1.png); background-repeat: no-repeat; background-position: 0px 0px; }
form .valider{ position:relative; margin-top:-90px; left:310px; display:block; width:120px; height:120px; background-image: url(../imgs/forms/valider.png); background-repeat: no-repeat; background-position: 0px 0px; }
form .validerFixe{ position:relative; margin-top:-90px; left:210px; display:block; width:120px; height:120px; background-image: url(../imgs/forms/valider.png); background-repeat: no-repeat; background-position: 0px 0px; }
form .validerFixe{ margin:10px 0 0 0; }
form .valider:hover,form .validerFixe:hover{ background-image: url(../imgs/forms/valider-on.png); }
form .valider b,form .validerFixe b{ display:none; }
form label{ color:#006851; font-size:0.85em; font-weight:normal; vertical-align:middle; }
form blockquote{ margin-top:0; margin-bottom:0; }
form input,form select{ border:1px solid #0cb1b4; font-size:0.9em; color:#006851; vertical-align:middle; }
form input{ width:200px; }
form .checkbox{ border:none; width:auto; vertical-align:middle; padding:2px; margin:1px; }
form .requis{ display:inline-block; width:7px; height:7px; background-image: url(../imgs/forms/requis.gif); background-repeat: no-repeat; background-position: 0px 0px; margin-left:2px; }
form .txrequis{ display:inline-block; background-image: url(../imgs/forms/requis.gif); background-repeat: no-repeat; background-position: 0px center; padding:0 0 0 8px; color:#006851; font-size:0.85em; font-style:italic; }
form.inscription01 .legende{ color:#006851; font-size:0.85em; font-weight:bold; }
form.inscription01 .legende i{ font-weight:normal;}
form.inscription01 .legende-pt{ color:#006851; font-size:0.80em; }
form.inscription01{ margin-top:90px; margin-bottom:40px; }
form.inscription01 .top{ background-image: url(../imgs/forms/cadre-form01-top.gif); background-repeat: no-repeat; background-position: 0px 0px; height: 20px; width: 406px; }
form.inscription01 .bottom{ background-image: url(../imgs/forms/cadre-form01-down.gif); background-repeat: no-repeat; background-position: 0px bottom; width: 386px; padding:0 10px 10px 10px; }
form.inscription01 .titre{ background-image: url(../imgs/titres/form-inscription-01.gif); height: 30px; width: 300px; background-repeat: no-repeat; background-position: 0px 0px; margin:0 auto 10px auto; }
form.inscription02 .legende{ color:#003066; font-size:0.9em; font-weight:bold; }
form.inscription02 .legende i{ font-weight:normal;}
form.inscription02 .legende-pt{ margin-top:5px; color:#003066; font-size:0.85em; }
form.inscription02{ margin-top:40px; margin-bottom:40px; margin-right:30px; width:350px; }
form.inscription02 .top{ background-image: url(../imgs/forms/cadre-form02-top.gif); background-repeat: no-repeat; background-position: 0px 0px; height: 20px; width: 350px; }
form.inscription02 .bottom{ background-image: url(../imgs/forms/cadre-form02-down.gif); background-repeat: no-repeat; background-position: 0px bottom; width: 310px; margin-bottom:5px; padding:0 20px 20px 20px; }
form.inscription02 .titre{ background-image: url(../imgs/titres/form-inscription-02.gif); height: 30px; width: 332px; background-repeat: no-repeat; background-position: 0px 0px; margin:0 auto; }
form.inscription02 h3{ font-size:1em; }
form.inscription02 h4{ margin-top:10px; }
form.inscription02 p{ color:#003160; margin:8px 0; font-size:0.9em; }
form.inscription02 strong{ color:#022e5d; font-size:1.4em; }
form.inscription02 ol{ color:#003066; font-size:0.85em; margin:2px 0 0 22px; }
form.inscription02 ul{ color:#003066; font-size:0.85em; margin:2px 0 0 22px; }


#oubli p{ font-size:13px; color:#333333; font-weight:bold; margin-bottom:10px; }
#oubli p b{ color:#003066; }
#oubli label{ color:#000000; font-size:13px; }
#oubli input{ border:1px solid #999999; font-size:14px; padding:2px; }
#oubli a{ width:200px; height:24px; background-image: url(../imgs/interface/bout-recevoirmail.gif); background-repeat: no-repeat; margin:10px auto 0 auto; font-size:12px; text-align:center; line-height:24px; background-position: 0px 0px; display:block; font-weight:bold; text-decoration:none; color:#085744; }

#satisfaction label{ font-size:13px; color:#052151; vertical-align:middle;border:1px dashed #FF0000; display:inline-block; }
#satisfaction .checkbox{ vertical-align:middle; border:1px dashed #FF0000;}
#satisfaction .deroulant{ font-size:13px; color:#052151; margin-bottom:5px; }
#satisfaction .question{ font-size:12px; color:#052151; margin-bottom:5px; text-align:left; margin-top:14px; }
#satisfaction .question2{ font-size:12px; color:#008d51; font-weight:bold; margin-bottom:5px; text-align:left; }
#satisfaction textarea{ display:block; width:100%; border:1px solid #008d51; overflow:auto;}


/* ====================================================================================================== */
/* ======== RUBRIQUES =================================================================================== */
/* ====================================================================================================== */

/* TITRES+VISUELS RUBRIQUES */
.titre-home{ height:300px; background-image: url(../imgs/titres/home.jpg); background-repeat: no-repeat; background-position: 0px 0px; margin-bottom:18px; }
.titre-monespace{ height:500px; background-image: url(../imgs/titres/monespace.jpg); background-repeat: no-repeat; background-position: 0px 0px; }
.titre-monespace-vierge{ height:500px; background-image: url(../imgs/ambiance/monespace-vierge.jpg); background-repeat: no-repeat; background-position: 0px 0px; }
.titre-pave{ padding:4px; margin:12px 0 8px 0; color:#009460; padding-left:25px; font-size:1.2em; background-image: url(../imgs/interface/pave-titre.gif); background-repeat: no-repeat; background-position: 0px 0px; }
.titre-notre-recommandation{ position:relative; margin:60px 0 40px 0; background-image: url(../imgs/titres/notre-recomandation.gif); background-repeat: no-repeat; background-position: 0px 0px; height: 45px; width: 470px; }
.titre-diagnostic{ background-image: url(../imgs/titres/diagnostic.gif); background-repeat: no-repeat; background-position: 0px 0px; height: 195px; width: 285px; margin:50px 0 30px 0; }
.visuel-diagnostic{ background-image: url(../imgs/ambiance/femme-diagnostic.jpg); background-repeat: no-repeat; background-position: 0px 0px; height: 500px; width: 300px; }
.produit-inscription{ float:left; margin-top:86px; /* border:1px dashed #FF0000; */ }
.produit-recommandation{ float:left; margin-left:20px; /* border:1px dashed #FF0000; */ }
.produit-traitement{ float:left; margin:60px 10px 0 10px; /* border:1px dashed #FF0000; */ }

/* RECOMMANDATION */
.debut-recommandation{ color:#009460; font-size:1em; line-height:1.1em; font-weight:bold; margin:60px 100px 20px 80px; }
.fin-recommandation{ color:#009460; font-size:1em; font-weight:bold; text-align:center; padding:40px 0; }

/* MON SUIVI */
.monsuivi h3{ color:#003160; font-size:1.4em; text-transform:none; font-weight:normal; margin-bottom:15px; }
.monsuivi h4{ background:none; padding:0; color:#003160; font-size:1.2em; color:#009460; margin:20px 0 5px 0; }
.monsuivi span.monespace{ color:#009460;  }
.monsuivi span.jours-traitement{ float:right;margin-bottom:10px; }
.monsuivi span.jours-traitement b{ color:#009460; }
.monsuivitableau td{ background-color:#FFFFFF; font-size:0.9em; color:#169361; }
.monsuivitableau td.legendeleft{ background-color:#5ab28f; font-size:1.1em; font-weight:bold; color:#FFFFFF;}
.monsuivitableau td b{ font-size:1.1em; }
.monsuivitableau td.jouractive{ background-color:#bfe5ea; }
.monsuivitableau select{ font-size:11px; padding:2px; margin:2px; border:1px solid #009460; }
.monsuivitableau select li{ text-align:center;}
.monsuivitableau table a:hover{ cursor:help; color:#003160; }

/*
.mesconseils h3.titre-mesconseils{ width:380px; padding:10px 10px 6px 10px; margin:10px 0; font-weight:bold; font-size:12px; color:#009460; background-image: url(../imgs/interface/fond-titre-mesconseils.gif); background-repeat: no-repeat; background-position: 0px top;  }
.mesconseils h4{ background:none; padding:0; color:#003160; font-size:1em; color:#009460; margin:10px 0 5px 0; padding-left:12px; }
.mesconseils h5{ background:none; padding:0; color:#003160; font-size:0.9em; margin:10px 0 5px 0; padding-left:12px; }
.mesconseils p{ padding-left:12px; font-size:0.9em; }
.mesconseils img{ margin:10px 0 0 12px; }
*/

.mesconseils h3{ font-size:19px; color:#009460; margin:15px 0; }
.mesconseils h4{ font-size:15px; padding:5px 10px; color:#009460; margin:15px 0; background-image: url(../imgs/interface/fond-titre-mesconseils.gif); background-repeat: no-repeat; background-position: 0px 0px; }
.mesconseils h5{ font-size:13px; padding:3px 0 3px 18px; color:#003160; margin:15px 0 7px 0; background-image: url(../imgs/interface/puceh5.gif); background-repeat: no-repeat; background-position: 0px center; }

.mesconseils p{ margin-top:5px; margin-bottom:5px; font-size:12px; color:#003160; text-align:justify; }
.mesconseils ul,.mesconseils ol{ margin-top:5px; margin-bottom:5px; margin-left:20px; font-size:12px; color:#003160; }

.mesconseils img{ margin:5px 0; }



.mesconseils .navsemaine { color:#003160; margin-bottom:20px; }
.mesconseils .navsemaine a{ font-size:17px; color:inherit; text-decoration:none;}
.mesconseils .navsemaine a.on{ font-weight:bold;}
.mesconseils img{ margin-top:5px; margin-bottom:5px; }



.traitement ul,.traitement ol{ color:#003160; text-align:justify; }
.traitement p{ text-align:justify;}


.avertissement{ color:#003160; cursor:pointer; }
.avertissement em{ display:none; }
.avertissement i{ font-style:normal; }

.avertissementOn{ color:#003160; text-decoration:none; cursor:default; }
.avertissementOn em{ font-style:normal; }
.avertissementOn i{ display:none; }






/* HOME */
a.big-inscription{ display:block; margin:30px auto; width:310px; height:30px; line-height:30px; text-align:center; background-image: url(../imgs/interface/bout-inscription-home.gif); background-repeat: no-repeat; background-position: 0px 0px; font-size:1.2em; font-weight:bold; color:#FFFFFF; text-decoration:none; }
a.big-inscription:hover{ /*color:#003160; */color:#CCCCCC; }
.encadre{ background-color:#f2f8f7; border:1px solid #d1ece2; padding:10px; }
.encadre .left{ float:left; width:40%; }
.encadre .right{ float:right; width:50%;}

/* GENERIC */
.alerte{ background-color:#ffc9c9; padding:2px; font-size:11px; font-weight:bold; color:#ab0000; text-align:center; text-transform:uppercase; }
.reussite{ background-color:#dbf3f4; padding:3px; font-size:11px; font-weight:bold; color:#085744; text-align:center; text-transform:uppercase; border:2px solid #085744; }

.invisible{ display:none; }
.clr{ clear:both; }
.asterisque{ font-size:0.85em; font-style:italic; }
.spacev-30{ height:30px; }
.spacev-50{ height:50px; }
.spacev-5{ height:5px; }
.spacev-10{ height:10px; }
.infobulle { position: absolute; top:0px; left:0px; visibility : hidden; border: 1px solid #169361; padding: 5px; font-size: 14px; background-image: url(../imgs/interface/bulle.png); background-repeat: repeat; background-position: 0px 0px; }

.vert{color:#009460;}

/* BLOCS CONNEXIONS+PRODUITS (right home) */
.blocTease{ margin:30px 0 0 0; }
.blocTease .haut{ display:block; height:10px; background-image: url(../imgs/interface/petit-cadre-top.gif); background-repeat: no-repeat; background-position: 0px 0px; }
.blocTease .bas{ padding:0 10px 10px 10px; background-image: url(../imgs/interface/petit-cadre-down.gif); background-repeat: no-repeat; background-position: 0px bottom; }
.blocTease a.lien{ padding-left:10px; color:#006750; text-transform:uppercase; font-size:0.85em; text-decoration:none; font-weight:bold; background-image: url(../imgs/interface/fleche-verte.gif); background-repeat: no-repeat; background-position: 0px center; }
.blocTease a.lien:hover{ color:#003160; }
.blocTease a.lienpt{ color:#9c9d9f; font-size:0.85em; text-decoration:none; }
.blocTease a.lienpt:hover{ color:#003160; }

.dev{ padding:10px; background-color:#CCCCCC; border:2px dashed #666666; position:fixed; bottom:0px; font-size:11px; }
.dev a{ color:#333333; display:block; }






	
/* use a semi-transparent image for the overlay */
#overlay {
	/*background-image:url(../imgs/overlay/transparent.png);*/
	color:#efefef;
	height:270px;
}

/* container for external content. uses vertical scrollbar, if needed */
div.contentWrap {
	height:260px;
	overflow-y:auto;
}




/* ====================================================================================================== */
/* ======== A JETER ===================================================================================== */
/* ====================================================================================================== */
/*
#left-pt{ width:300px; float:left; margin:0 0 0 30px; }
#left-gd{ width:530px; float:left; margin:0 0 0 70px; }
#left-gd ul{ color:#099866; margin:0 0 0 16px; padding:0; font-size:1.1em; list-style-image: url(../imgs/interface/puce-gd-encadre.gif); }
#left-pt-nomargin{ width:300px; float:left; margin:0; }
#left-mid{ width:430px; float:left; margin:0 0 0 80px; color:#003160; }
#left-mid p{ margin-left:25px; font-size:0.9em; }
#left-mid ul{ margin-left:38px; font-size:0.9em; }
#right-pt{ width:300px; float:left; margin:0 0 0 40px; }
#right-free{ float:left; margin:0 0 0 40px; width:auto; }
*/