﻿*, body, div, p, form, fieldset, label, input, ol, ul, li, a, h1, h2, h3, h4, span, hr, table, tr, th, td, legend {
	margin:0; padding:0; font-family:Verdana, Arial, Helvetica, sans-serif; }

a img {border:0;}
a:focus {outline:none; }
.nof { border:0; clear:both; visibility:hidden; font-size:1px;}
.couleur { color:#fabb11;}
.fright { float:right;}
.fleft { float:left;}
img.fleft { margin:0 20px 20px 0; }
.nodeco { color:#000; text-decoration:none;}
.nodeco:hover { text-decoration:underline;}
.decaleTop { margin-top:60px;}

body { position:relative; background: #7886a1;  }
#wrapper { width: 980px; text-align: center; margin: auto; background: url(../images/bg.png) repeat-y center top; }

/* En-tete */
#header { position:relative; width:890px; height:150px; margin:0 auto; text-align:center;  background: url(../images/liseret_menu.png) repeat-x 0 116px ; }
#mascotte { position: absolute; width:235px; height:147px; top:0px; left:0px; overflow:hidden;  }

#menu { margin:60px 3px 25px auto;  float: right; display: inline; height: 34px; width: 652px; }
#menu ul {list-style:none; width:655px; height:33px;}
#menu ul li { display: inline; float: left; height:33px; list-style: none; position: relative; }
#menu ul li a { text-indent:-5000px; display: block; height:100%; background-repeat:no-repeat; background-image:url(../images/menu.png); }

/* Sous-menu (rollover) */
#menu ul li ul.sous_rubrique { position: absolute; top: 0; text-align: center; overflow: hidden; }
#menu ul li ul.sous_rubrique li {display:block; height:25px; list-style: none; position: relative; }
#menu ul li ul.sous_rubrique li.sous_menu_first {display:block; height:33px; list-style: none; position: relative; text-indent: -3333px }
#menu ul li ul.sous_rubrique li.sous_menu_first a {text-indent: -3333px; background-repeat:no-repeat; background-image:url(../images/menu.png); }
#menu ul li ul.sous_rubrique a { font-size:11px; font-weight:bold; color:#fff; background-image:none; text-indent: 0; background-color:#f9b30c; text-decoration: none; height:100%; }
#menu ul li ul.sous_rubrique a:hover { color:#000; background-color:#f9b30c; }

#menu_accueil ul.sous_rubrique { width:86px; margin-left: 0px;  }
#menu_demarche ul.sous_rubrique { width:180px;  }
#menu_mediapige ul.sous_rubrique {width:92px; }
#menu_essayer ul.sous_rubrique { width:125px; }
#menu_particuliers ul.sous_rubrique { width:95px; }
#menu_contact ul.sous_rubrique { width:77px;  }

/* au repos */
#menu_accueil a { width:86px; background-position:0 0;  }
#menu_demarche a { width:180px; background-position:-86px 0;  }
#menu_mediapige a {width:92px; background-position:-266px 0; }
#menu_essayer a { width:125px; background-position:-358px 0;  }
#menu_particuliers a { width:95px; background-position:-483px 0;  }
#menu_contact a { width:77px; background-position:-578px 0;  }
/* effet rolover */
#menu_accueil a.active, #menu_accueil a:hover { background-position:0 -33px; }
#menu_demarche a.active, #menu_demarche a:hover { background-position:-86px -33px;  }
#menu_mediapige a.active, #menu_mediapige a:hover { background-position:-266px -33px; }
#menu_essayer a.active, #menu_essayer a:hover { background-position:-358px -33px; }
#menu_particuliers a.active, #menu_particuliers a:hover { background-position:-483px -33px; }
#menu_contact a.active, #menu_contact a:hover { background-position:-578px -33px; }

/* Conteneur général */
#conteneur { position:relative; width:860px; margin:0 auto; text-align:left; z-index:0; }

/* blocs gauche */
#col_gauche, #col_gauche2_, #col_gauche3_ { position:relative; width:211px; font-size:11px; text-align:left; margin-left:10px;  }
#col_gauche2_ {   }
#col_gauche3_ { padding-top:20px;  }

#col_gauche p, #col_gauche2_ p, #col_gauche3_ p { padding:0 16px; }
/* Offre d'essai */
#essai { text-indent:-5000px; position:relative; font-size:17px; height:225px; background: url(../images/essai.png) no-repeat top left;  }
#essai a { 
position:absolute; display:block; width:119px; height:20px; top:190px; left:40px; background:url(../images/btn_essayer_immup.png) 0 0 no-repeat;
font-size:14px; color:#000; text-align:center; }
/* Particuliers col gauche */
#particulier { margin-top:20px; background: url(../images/pied_particuliers.png) center bottom no-repeat; padding-bottom: 20px; position: relative; }
#particulier h2 {  text-indent:-5000px; font-size:14px; padding:10px 0 25px 0; background:url(../images/immup_particuliers.png) center top no-repeat; }
#particulier p { padding:5px 15px; }
#particulier a { display:block;padding:10px 0 0 15px; }

/* Bloc qui varie selon l'horaire */
#bloc_horaire { margin-top:20px;  }

/* Contenu */
.col_droite { position:relative; width:540px; float:right; margin-right: 20px; text-align:left;  }

/* titres */
h1 { font-size:24px; color:#fabb11; text-indent:-5000px; height:60px; }
.accueil h1 { background:url(../images/titre_accueil.png) 0 0 no-repeat; height:95px; }
.demarche h1 { background:url(../images/titre_demarche.png) 0 0 no-repeat; }
.mediapige h1 { background:url(../images/titre_mediapige.png) 0 0 no-repeat; }
.essayer h1 { background:url(../images/titre_essayer.png) 0 0 no-repeat; }
.contact h1 { background:url(../images/titre_contact.png) 0 0 no-repeat; }
.merci h1 { background:url(../images/titre_merci.png) 0 0 no-repeat; }
.erreur h1 { background:url(../images/titre_erreur.png) 0 0 no-repeat; }
.parrainage h1 {margin:20px 0 0 0; background:url(../images/titre_parrainage.png) 0 0 no-repeat; }
.mascotte h1 { background:url(../images/titre_mascotte.png) 0 0 no-repeat; }
.desinscription_invalide h1 { background:url(../images/titre_desinscription_erreur.png) 0 0 no-repeat; }
.erreurappli h1 { background:url(../images/titre_erreur_appli.png) 0 0 no-repeat; }

/* elements */
.col_droite p { padding:14px 30px 0 30px; font-size:12px; }
.col_droite ul { padding:14px 30px 0 30px; font-size:12px; list-style-type: none;  }
.col_droite li { margin-top:14px; }
.col_droite a { color:#f9b30c; font-weight:bold; }
.col_droite a:hover { text-decoration:none;}

.col_droite .accroche { font-size:14px; font-weight:bold; padding:30px 30px 10px 30px; }
p.puce {background:url(../images/puce.png) 0 10px no-repeat;}
ul.puce { list-style-image:url(../images/puce.png); }

/* formulaire de contact */
#errors_form { border:1px solid red; font-size:11px; margin-left:15px; margin-right:15px; margin-top:10px; padding:10px 0px 10px 15px; }
#errors_form p.form_error { padding-top:4px; }

#form_contact { padding-top:20px; }
#form_contact p { clear: both; padding-top:6px; }

.lab { float: left; display: inline; width:150px; text-align:right; margin-right:20px; }
.inputM { width:246px; }
.inputP { width:200px; }
.inputS { width:20px; }
.selectM { width:250px;}

#form_contact textarea { height: 60px; }
#requis { font-size:11px; font-style:italic; padding:10px 0 0 200px; }
#validation { padding-left:200px;  }

.contact_envoye .accroche { padding-top: 15px; }

/* Page Parrainage */
#mascotteParrainage { position:absolute; top:0; left:-10px; width:480px; height:600px; background:url(../images/parrainageNoel.jpg) 0 0 no-repeat; z-index:0}

#form_parrainage { padding:20px 0 70px 0;  }
#form_parrainage p {clear: both; padding-top:6px; }
#form_parrainage .lab { width:200px; }

fieldset { border:0; }
legend { padding-left:160px; font-style:italic; color:#5789aa; }

.parrainage { margin-bottom:60px; }
.parrainage #errors_form { width:370px; margin-left:180px; }
.filleul { margin-bottom: 15px; position: relative; }
.filleul span.filleul_txt { display: inline; float: right; }
.filleul span.filleul_txt span { display: inline; float: none; }
.parrainage .deleted { display: none; }
.ajout { float:left; display:inline; margin-left: 170px; }

#mails_elements { margin-top:20px;}
#desc_parrainage { position:absolute; z-index:9; background: url(../images/bgParrainage.jpg) top left no-repeat; width: 438px; height: 200px; top:380px; left:0; }
#desc_parrainage p { font-size: 14px; padding-left:60px; padding-top:70px; width:340px; }
#note { position:absolute; top:590px; left:60px; font-size: 9px; width:340px; color:#666; }

/* Page mascotte */
#img_mascotte { float: left; display: inline; }
#textes_mascottes { float: right; display: inline; width: 270px; position: relative; }
#textes_mascottes p { padding: 0px; width: 250px; }
.mascotte .sousaccroche { margin-bottom: 15px; }
#exhaustivite { position: absolute; top: -10px; left: -20px; }
#evolutivite { position: absolute; top: 60px; left: 10px; width: 220px; }
#rapidite { position: absolute; top: 170px; left: 20px; }
#regularite { position: absolute; top: 310px; left: 10px; }
#efficacite { clear: both; }

/* Page particuliers */

#particuliers_intro h1 { background:url(../images/titre_particuliers.png) 0 0 no-repeat; }
.particuliers-intro { margin-bottom: 25px; }
.particuliers-intro h4 { padding-left: 30px; padding-top: 15px; text-decoration: underline; }
.particuliers-intro ul { padding: 0px 0 0 45px; list-style-type: disc; }

#mascotte_particuliers { position:absolute;top:0;left:0; width:400px; height:400px; z-index:1; }

.particuliers { width:500px; height: 480px; float:none; margin-left:350px; z-index:2; }
.particuliers h1 { background:url(../images/titre_opposition.png) 0 0 no-repeat; }

label.legend { font-size: 9px; font-style: italic; display: block; margin-left: 170px; width: 246px; } 
p.legend_ip { font-size: 10px; font-style: italic; display: block; padding: 5px 0 0 0; }

/* slogans de bas de page */
.slogan { clear:both; font-size:24px; color:#fabb11; font-weight:bold; padding:30px 0; width:100%; text-indent:-5000px;  }
.accueil div.slogan { background:url(../images/footer_accueil.png) center right no-repeat; }
.demarche div.slogan { background:url(../images/footer_demarche.png) center right no-repeat; }
.mediapige div.slogan { background:url(../images/footer_mediapige.png) center right no-repeat; }
.essayer div.slogan { background:url(../images/footer_essayer.png) center right no-repeat; }
.contact div.slogan, .contact_envoye div.slogan { background:url(../images/footer_contact.png) center right no-repeat; }
.mascotte div.slogan { background:url(../images/footer_mascotte.png) center right no-repeat; }

div.slogan a { width:100%; display:block; }

.col_droite ul.list_classic { padding: 5px 0px 0px 50px; list-style-type:disc; }
.list_classic li { margin-top: 2px; }

/* Footer */
#footer { text-align: center; margin:10px auto 0 auto; font-size:10px; }
#footer a { color: black; text-decoration: none; }
#footer a:hover { text-decoration: underline; }