/**
 * 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
 * https://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}

/**
 * Calendrier & tarifs
 */
 
.tarifs {font : 12px arial ; padding : 2px 8px 2px 0}

/* Calendriers Tarifs et Réservations
======================================*/
table.tarifs {padding:0px; margin-left:10px}

table.tarifs {font:12px trebuchet MS}
table.tarifs th {font-weight:bold; padding:3px 0}
table.tarifs th.day {}
table.tarifs th.price {width:70px; text-align:center; color:#fff; background-color:#0784BA; border:1px solid #fff; border-bottom:2px solid #fff;}
table.tarifs th.last  {}
table.tarifs td  {vertical-align:middle}
table.tarifs td.month {padding-right:10px; text-align:right; color:#777; width:90px }
table.tarifs td.grille_calendrier {color:#555; height:25px; width:25px; text-align:center}
table.tarifs td.grille_calendrier-promotion {background-color:#FFE793;color:#555; height:25px; width:25px;text-align:center}
table.tarifs td.grey  {background-color:#EAF1F7}
table.tarifs td.cell-tarif {font:12px arial; background-color:#f4f4f4; border-bottom:3px solid #fff; border-right:1px solid #fff; color:#888}
table.tarifs td.cell-tarif-promotion {color:#F78132; font-weight:bold; border-bottom:3px solid #fff; border-right:1px solid #fff;}

table.tarifs td.cell-tarif, table.tarifs td.cell-tarif-promotion  {text-align:right; padding-right: 5px;}
table.tarifs td.reserved {background-color:#FCB5B5; color:#AF4F4F}
table.tarifs td.selected_reserved{background-color:#FFCC00; color:#AF4F4F}
table.tarifs td.highlight {background-color:#E88F8F;cursor:pointer;}
table.tarifs td.arrow-grey {background: url("https://papvacances.fr/images/bg/arrow-grey.png") no-repeat center left #f4f4f4}
table.tarifs td.arrow-white {background: url("https://papvacances.fr/images/bg/arrow-white.png") no-repeat center left #f4f4f4}
table.tarifs td.arrow-promotion {background: url("https://papvacances.fr/images/icones/star-yellow.png") no-repeat scroll 2px 2px #F4F4F4}

.legende {text-align:right; margin:5px}
.legende img {display:inline}