html,body{margin:0; padding:0;}
body{font-family: Tahoma, Arial,helvetica,sans-serif; font-size:12px; color:#838383; }
p{font-family: Tahoma, Arial,helvetica,sans-serif; font-size:1em; color:#838383; line-height: 13px}
input, select, textarea{font-family: Tahoma, Arial,helvetica,sans-serif; font-size:12px; color:#838383;}
h1, h1 a{font-family: Tahoma, Geneva, sans-serif; font-size:20px; color:#004B93; font-weight:bold; margin:0; font-style:italic;text-decoration:none;}
h1 a:hover{color:#8fc400;}
h2, h2 a{font-family:Tahoma, Geneva, sans-serif; font-size:16px; color:#82A6D1; font-weight:bold; letter-spacing:0; margin:0; text-decoration:none;}
h2 a:hover{color:#1886ed;}
h3, h3 a{font-family: Tahoma, Geneva, sans-serif; font-size:12px;color:#004C92; font-weight:bold; letter-spacing:0; margin:0; text-decoration:none; line-height:14px;}
h3 a:hover{color:#8fc400;}
h4, h4 a{font-family:Century Gothic, Apple Gothic, sans serif; font-size:12px; color:#EA5800; font-weight:bold; letter-spacing:0; margin:0; text-decoration:none; line-height:12px;}
h4 a:hover{color:#58aaf1;}
ul{list-style-type: none; padding: 0; margin: 0 0 4px 0;}
li{font-family: Tahoma, Arial,helvetica,sans-serif; font-size:1em; background: url(images/fleche-ssmenu.gif) no-repeat 0 .2em; padding:0 0 0 14px; margin:0 0 2px 4px; border:0;}
ul ul li{background-image: url(images/puce-small.gif);background-position: 0 .4em; margin:0 0 2px 8px;}
dl dt{font-family: Tahoma, Arial,helvetica,sans-serif; font-size:14px; color:#004C92; background: url(images/fleche-bleue.gif) no-repeat 0 .4em; padding:0 0 0 24px; margin:0 0 2px 4px; border:0;}
dl dt.google {background: url(images/ico-google.gif) no-repeat 0 0; height:35px; padding-left:40px; line-height:28px}
dl dd {margin: 5px 0 0 26px}
p{margin:0;}
em{font-size:13px; color:#666666;} /* utile pour les citations et témoignages : met sémantiquement et graphiquement en enphase*/
strong{color:#777;}/* s'il s'agit de mettre un texte en gras pour des besoins de visibilité (ne nécessitant pas de sémantique), la balise est toujours disponible dans la couleur par défaut */
a img{border:0;}/* permet de supprimer la bordure par défaut qui entourant les images encapsulées dans des liens */
a.cadre img, img.cadre{border:1px solid #dddddd;}/* applique un cadre aux images contenues dans un lien et gère le rollover _ applicable aussi bien à une image non cliquable */
a.cadre:hover img{border:1px solid #ffc14f;}
body #content .gris {color:#666}
body #content .bleuclair {color:#248AC3}
body #content .bleu {color:#004C92}
/*------------------------------------------------------------------
2. Liens
------------------------------------------------------------------*/
a{font-family:Tahoma, Geneva, sans-serif; font-size:11px;color:#75a6e4; text-decoration: underline;}
a:hover{color : #fda700;}
a.lienpuce, a.lienpucedroite {padding-left:14px; background:url(images/puce.gif) no-repeat 0 .3em; font-size:12px; cursor:pointer;}/* inclut une puce devant chaque lien portant la classe */
a.lienpucedroite {float:right;}/* version alignée à droite de la classe "lienpuce" */
a.lienpuce:hover, a.lienpucedroite:hover {color : #fda700;}
a.lienpdf {font-family:Century Gothic, Apple Gothic, sans serif; font-size:13px; font-weight:normal; text-decoration:none; color:#c72608; background:url(images/ico-pdf.gif) no-repeat top left; padding:5px 0 5px 26px;}
a.lienpdf:hover {color:#ef2600;}/* inclut le logo acrobat PDF devant chaque lien portant la classe */
a.suitebleu{display:block; float:right; clear:both; color:#fff; background-color:#31548e; text-decoration:none; padding: 4px 20px}
a.suitejaune{display:block; float:right; clear:both; color:#414142; background-color:#ffd001; text-decoration:none; padding: 4px 20px}
/* boutons */
a.btngris{display:-moz-inline-box; display:inline-block;margin:0; padding:0; font-family: Arial, Helvetica, sans-serif; font-size:12px; text-decoration:none; color:#fff;
white-space:nowrap; text-align:center; vertical-align:middle; cursor:pointer; border:0; background:none;}
a.btngris:hover span span span {color:#003}
a.btngris span{ position:relative; float:left; padding:0 0 0 16px; vertical-align:middle; background:url(images/bt-left-gris.png) left top no-repeat; _background-image:url(images/bt-left-gris.gif);}
a.btngris span span{padding:0 16px 0 0; background:url(images/bt-right-gris.png) right top no-repeat; _background-image:url(images/bt-right-gris.gif);}
a.btngris span span span{ height:34px;font-weight:bold; padding:0 2px; line-height:26px; background:url(images/bt-bg-gris.png) left top repeat-x; _background-image:url(images/bt-bg-gris.gif);}
a.btFa1 {background: transparent url(images/bg-bt1-a.jpg) no-repeat scroll top right; color: #444;display: block; float: left;font: normal 12px arial, sans-serif;
height: 30px; margin:6px 0 0 4px; padding-right: 18px; /* sliding doors padding */ text-decoration: none;}
a.btFa1 span {background: transparent url(images/bg-bt1-span.jpg) no-repeat; display: block; line-height: 16px; padding: 5px 15px 9px 40px;}
a.btFa2 {background: transparent url(images/bg-bt2-a.jpg) no-repeat scroll top right; color: #E4EEF8;display: block; float: left;font: normal 12px arial, sans-serif;
height: 30px; margin:6px 0 0 4px; padding-right: 18px; /* sliding doors padding */ text-decoration: none; cursor:default}
a.btFa2 span {background: transparent url(images/bg-bt2-span.jpg) no-repeat; display: block; line-height: 14px; padding: 5px 15px 11px 40px;}
a.btSubmit {background: transparent url(images/bg-btSubmit-a.gif) no-repeat scroll top right; color: #E7E7E7;display: block; font: bold 14px Tahoma, Geneva, sans-serif;
height: 52px; margin:6px 0 0 4px; padding-right: 12px; /* sliding doors padding */ text-decoration: none;}
a.btSubmit span {background: transparent url(images/bg-btSubmit-span.gif) no-repeat; display: block; line-height: 24px; padding: 14px 15px 14px 26px;}
a.btSubmit:hover {color:#fff}
a.btPlus {background: transparent url(images/bg-btplus-a.gif) no-repeat scroll top right; color: #fff;display: block; font: normal 11px Tahoma, Geneva, sans-serif;
height: 21px; margin:6px 0 0 4px; padding-right: 9px; /* sliding doors padding */ text-decoration: none;}
a.btPlus span {background: transparent url(images/bg-btplus-span.gif) no-repeat; display: block; line-height: 12px; padding: 3px 15px 6px 26px;}
a.btPlus:hover {color:#def9f9;}
a.btRouge {background: transparent url(images/bg-bt-rouge-a.gif) no-repeat scroll top right; color: #E7E7E7;display: block; float: left;font: normal 14px Tahoma, Geneva, sans-serif;
height: 31px; margin:6px 0 0 4px; padding-right: 12px; /* sliding doors padding */ text-decoration: none;}
a.btRouge span {background: transparent url(images/bg-bt-rouge-span.gif) no-repeat; display: block; line-height: 15px; padding: 7px 15px 9px 28px;}
hr{display:block; text-decoration:none; height:0; clear:both; border:0; visibility: hidden; margin:0; padding:0;}
u{display:block;text-decoration:none; height:1px; font-size:1px; clear:both;}/* balise obsolète reconvertie, très utile pour forcer un passage à la ligne ou définir la hauteur d'un objet contenant des balises en float */
u.esp,u.sep{height:18px;}/* en lui attribuant cette classe, permet d'espacer des paragraphes de manière significative (en lieu et place d'un
*/
u.sep{background:url(images/points-h.gif) repeat-x center;}/* hérite des précédents et inclut une séparation en pointillés */
/*######## CLASSES #########*/
div.curvy{background:url(images/curvy1.gif) no-repeat top left; margin:0; padding:0;}/* classe crééant un cadre arrondi sur un div auquel on en imbrique 3 autres : */
div.curvy div{background:url(images/curvy2.gif) no-repeat top right; margin:0; padding:0;}
div.curvy div div{background:url(images/curvy3.gif) no-repeat bottom right; margin:0; padding:0;}
div.curvy div div div{background:url(images/curvy4.gif) no-repeat bottom left; margin:0; padding:16px;}
.c{text-align:center;}/* alignement de texte inline */
.g{text-align:left;}
.d{text-align:right;}
.j{text-align:justify;}
/* MARGES */
.dep{overflow: visible;}
.rel{position:relative;}
.dispnone{display:none;}
.h100 {height:100px;}
.h120 {height:120px;}
.h140 {height:140px;}
.h160 {height:160px;}
.h180 {height:180px;}
.h200 {height:200px;}
.mt5 {margin-top:5px;}
.mt10 {margin-top:10px;}/* permet de gérer les marges internes et externes en haut et en bas d'un élément : utile pour les espacement de paragraphes */
.mt20 {margin-top:20px;}
.mt30 {margin-top:30px;}
.mt40 {margin-top:40px;}
.mt50 {margin-top:50px;}
.mt60 {margin-top:60px;}
.mt70 {margin-top:70px;}
.mt80 {margin-top:80px;}
.mt90 {margin-top:90px;}
.mt100 {margin-top:100px;}
.mb5 {margin-bottom:5px;}
.mb10 {margin-bottom:10px;}
.mb20 {margin-bottom:20px;}
.mb30 {margin-bottom:30px;}
.mb40 {margin-bottom:40px;}
.mb50 {margin-bottom:50px;}
.mb60 {margin-bottom:60px;}
.mb70 {margin-bottom:70px;}
.mb80 {margin-bottom:80px;}
.mb90 {margin-bottom:90px;}
.mb100 {margin-bottom:100px;}
.mt-10 {margin-top:-10px;}
.mt-15 {margin-top:-15px;}
.mt-20 {margin-top:-20px;}
.mt-25 {margin-top:-25px;}
.mt-30 {margin-top:-30px;}
.marg15 {margin:15px;}
.marg20 {margin:20px;}
.pad10 {padding:10px;}
.pad15 {padding:15px;}
.pad20 {padding:20px;}
.padg{padding-left:10px;}/* marges internes */
.padd{padding-right:10px;}
.padh{padding-top:10px;}
.padb{padding-bottom:10px;}
.margd{margin-right:10px; float:left;} /* marges externes latérales et alignement : utiles pour placer une visuel au sein d'un texte */
.margg{margin:0 0 10px 10px; float:right;}
.margauto{margin: 0 auto}/* en complément d'une classe de type largeur "l50", permet de centrer un élément de type block */
.fleft{float:left;}
.fright{float:right;}
.note{font-size:10px; color:#bbbbbb;}/* utiles pour les mentions annexes ou légende de photo */
.fleche {background:url(images/fleche-bleue.gif) 0 4px no-repeat; padding-left:20px}
.pointer{cursor:pointer;}/* force le pointeur de lien sur un élément cliquable */
.clear{clear:both;}/* place l'élément concerné sous les boîtes flottantes qui le précèdent*/
.clearl{clear:left;}
.clearr{clear:right;}
.dispone{display:none}
.l5{width:5%;}
.l10{width:10%;}
.l15{width:15%;}
.l20{width:20%;}
.l25{width:25%;}
.l30{width:30%;}
.l35{width:35%;}
.l40{width:40%;}
.l45{width:45%;}
.l48{width:48%;}
.l50{width:50%;}
.l55{width:55%;}
.l60{width:60%;}
.l65{width:65%;}
.l70{width:70%;}
.l75{width:75%;}
.l80{width:80%;}
.l85{width:85%;}
.l90{width:90%;}
.l95{width:95%;}
.l100{width:100%;}
.w100 {width:100px}
.l150{width:150px;}
.l200{width:200px;}
.l250{width:250px;}
.l300{width:300px;}
.l350{width:350px;}
.l400{width:400px;}
.l450{width:450px;}
.l500{width:500px;}
.l550{width:550px;}
.l600{width:600px;}
.l650{width:650px;}
.l700{width:700px;}
.cur{cursor:pointer;}
.champcontact, .champfocus, .champerreur{padding:2px 2px 2px 4px;}
.champcontact{background: #ffffff; border:1px solid #dbdfe6; border-bottom:1px solid #e3e9ef; border-top:1px solid #abadb3;}
.champfocus{background: #ffffff; border:1px solid #a4c9e3; border-bottom:1px solid #b7d9ed; border-top:1px solid #3d7bad; color:#0063BB;}
.champerreur{background:url(images/input-erreur-bg.gif) repeat-x top #e3ecf7; color:#2F5992; border:1px solid #4BDBFF; }
input.send{background: url(images/input-send-bg.gif) no-repeat top left #448ed4; border:1px solid #0258af; color:#ffffee;}
.erreur, .icoerreur{font-family: Century Gothic, Apple Gothic, sans-serif; color:#dc6300;font-weight:bold; font-size:13px; font-style:italic;}
.icoerreur{padding:4px 0 4px 26px; background:url(images/ico-erreur.gif) no-repeat center left;} /* à placer sur un label d'erreur de formulaire : place une icone devant*/
div.contactForm { width: 300px; margin-left: auto; margin-right: auto; }
div.contactForm label { display: block; font-weight: bold; color: #2f5992; margin-bottom: 4px; }
div.contactForm label input,
div.contactForm label textarea,
div.contactForm label select { width: 96%;}
div.facultativeFields { padding-top: 14px; }
div.facultativeFields .champcontact { background: #f4f0dd; border-color: #e2dad4; }
/* Fenetres modales */
body.pageCredits, .pageMentionsLegales, .pagePlanSite{background:none;}
body.pageCredits body{background:url(images/credits.jpg) no-repeat center 5px #ffffff; text-align:center;}
body.pageCredits a{display: block; width:400px; margin:0 auto; height:274px; text-decoration:none;}
body.pageMentionsLegales body, .pagePlanSite body{background:#ffffff; padding:10px 0;}
body.pagePlanSite a{text-decoration:none;}