/**
 * 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
 */
 
.block td {font : 12px arial ; padding : 2px 8px 2px 0}
#calendriers {border-collapse : separate ; border-spacing : 20px}
#calendriers td {vertical-align : top}
.calendrier-annonce {font : 12px Arial ; width : 120px ;  border-collapse : collapse ; text-align : center ; vertical-align : middle ; margin : 0 1px}
.calendrier-annonce caption {border-bottom : 1px solid #fff ; color : #fff ; font-weight : bold ; background : url(http://www.papvacances.fr/images/fond-calendrier-annonce.gif) no-repeat ; padding : 3px}
.calendrier-annonce tbody th {border-bottom : solid 1px #ccc ; border-right : solid 1px #cacaca ; width : 60px}
.calendrier-annonce tbody td {border-bottom : solid 1px #ccc ; border-left : solid 1px #cacaca ; width : 60px}
.basse th {background-color : #74fb69}
.moyenne th {background-color : #fdd26a}
.haute th {background-color : #ff8f53}
.tres-haute th {background-color : #ff4343}
.indisponible th {background : #eeeeee url(http://www.papvacances.fr/images/fond-indisponible.gif) center no-repeat}
.indisponible td {text-decoration : line-through}
.non-precisee th {background-color : #eeeeee}

#promotions {border : solid 3px #c00 ; margin-top : 10px ; margin-bottom : 10px ; margin-left : 20px}
#promotions img {display : block}
#promotions td {vertical-align : middle}
#promotions .promo {font : bold 13px Verdana ; color : #f00}