/**
 * Annulation des styles par défaut
 */

body {margin: 0; padding: 0;}
img {display: block;}
a img {border: 0;}
p, ul, ol, dl, dd, dt, h1, h2, h3, h4, h5, h6, li, table, div, td, th, form, textarea, input, select {margin: 0; padding: 0; border: 0;}
ul, ol {list-style-type: none;}
table {border-collapse: collapse; border-spacing: 0;}

/**
 * Classe dotclear
 */

.clear {clear: both ; margin : 0 ; padding : 0}

/**
 * Barre de contrôle
 * On utilise une background-image sur le body pour prolonger le panneau de
 * contrôle jusqu'en bas de la page. (voir
 * http://marcarea.com/tuto/10_astuces_css.php)
 */

body.controle {background-image : url(images/fond-controle.gif) ; background-repeat : repeat-y}

#controle {font : 11px Arial ; color : #000 ; width : 176px ; float : left}
#controle h2 {padding-top : 15px ; text-align : center}
#controle .submit {width : 158px ; margin : 5px ; padding : 1px ; background : #2051af ; font : bold 11px Arial ; color : #fff ; cursor : pointer}

#controle-infos {display : block ; width : 174px ; background : url(images/fond-legende.gif) 0px 0px repeat-y ; border-top : 1px solid #fff ; font-weight : bold ; overflow : hidden}
#controle-infos li {padding : 3px 5px ; border-bottom : 1px solid #fff}
#controle-infos select {font : bold 11px Arial}
#controle-infos input {font : bold 11px Arial ; border : solid 1px #99c ; padding : 1px 2px ; background : transparent}

#controle-menu {border-top : 1px solid #fff}
#controle-menu li {line-height : 0 /*hackIE*/}

#mode-d-emploi {width : 174px ; background: url(images/fond-legende.gif) 0px 0px repeat-y ; border-top : 1px solid #fff ; border-bottom : 1px solid #fff}
#mode-d-emploi p {margin : 8px 12px ; text-align : justify}
#mode-d-emploi table {border : 2px dotted #f00 ; background : #fff ; margin : 0 12px ; font-weight : bold}
#mode-d-emploi table th {vertical-align : middle ; padding : 5px 5px}
#mode-d-emploi table td {padding : 5px 5px ; font-size : 11px /*hack IE*/}
#mode-d-emploi .caption {text-align : center ; text-transform : uppercase}

#commentaire {background : url(images/fond-legende.gif) 0px 0px repeat-y ; text-align : center}
#commentaire textarea {width : 156px ; height : 130px ; margin : 5px ; padding : 3px ; border : solid 1px #ccc ; background : #fff ; font : bold 11px Arial ; color : #000}

/**
 * Changer l'apparence
 */

#changer-apparence {display : block ; margin : 30px}
#changer-apparence dt {display : block ; clear : both ; text-align : center ; font : bold 11px Arial ; text-transform : uppercase ; padding : 8px 0 4px}
#changer-apparence dd {float : left ; display : block ; border : solid 1px #fff ; margin : 5px}
#changer-apparence dd.selected {background-color : #eee ; border : solid 1px #000}
#changer-apparence dd a {display : block}
#changer-apparence dd img {display : block ; margin : 10px}

/**
 * Valider, Publier, Refuser, ...
 */

#publier {display : block ; width : 480px ; margin : 0 20px}
#publier p {font : bold 11px Trebuchet MS ; margin : 5px 2px}
#publier #disclaimer {font : 10px Arial ; color : #555 ; margin : 10px 0 ; padding : 3px 5px ; border : solid 2px #faa ; background-color : #fee}
#publier form {text-align : center ; margin : 20px}
#publier img.attention {display : block ; margin-left : 240px}
#publier dt {font : bold 12px Arial ; color : #c33232 ; text-transform : uppercase ; background : url(images/icone-attention.gif) no-repeat ; padding : 0 0 2px 20px ; margin : 0 20px}
#publier dd {font : bold 11px Arial ; margin : 10px 20px}
#publier .bouton {margin : 30px 180px}

/**
 * Infobulles
 */

#infoBulle {display : none ; background : #ffc ; border : 1px solid #999 ; width : 210px}
#insideBulle {margin : 3px ; font : 11px Arial, Helvetica, sans-serif}

/**
 * Mots interdits
 */

.interdit {background-color : #d66 ; border : solid 1px #a00}

/**
 * GMap
 */
#gmaps-iframe {border : 0 ; padding : 0 ; margin : 5px 0 10px 32px}

/**
 * Calendrier & tarifs
 */
#calendrier {font : 11px Arial}
#calendrier table {font : 11px Arial}
#calendrier ul {margin : 0 ; padding : 0 ; position : relative ; display : block ; list-style-type : none ; clear : left}
#calendrier li {padding : 0 ; position : relative ; float : left ; display : inline}
#calendrier table {margin : 5px ; padding : 0px ; text-align : center ; border-collapse : collapse ; width : 145px}
#calendrier table caption {margin : 0 5px ; font-size : 1em ; text-align : center ; background : #CCFFFF}
#calendrier table th {color : #493 ; background : transparent}
#calendrier table td {width : 14% ; line-height : 2em ; border : 1px solid #EEE}
.tarifs {font : 12px Arial ; border-collapse : separate ; border-spacing : 10px}
.tarifs th {width : 20px ; height : 20px ; border : solid 1px #eee}
.bg_ciel           {background-color: #deefff}
.bg_Dispo         {background-color: #deefff}
.bg_Indispo     {background-color: #deefff ; text-decoration : line-through}
.bg_Basse         {background-color: #8adea0;}
.bg_Moyenne     {background-color: #dedd8a;}
.bg_Haute         {background-color: #dea08a;}
.bg_TreHaute   {background-color: #d44c4c;}
.bg_Nsp             {background-color: #deefff }