/*
.planning .ligne-titre .box{
    background-color:#DDDDDD;
    text-align:center;
    padding:5px;
}


.planning .ligne .box{
    background-color:#F0F0F0;
    text-align:center;
    padding:5px;
    margin-bottom:3px;
    height:50px;
}
*/



 
/* on prépare le label */
[type="checkbox"]:not(:checked) + label,
[type="checkbox"]:checked + label {
  position: relative; /* permet de positionner les pseudo-éléments */
  padding-left: 10px; /* fait un peu d'espace pour notre case à venir */
  cursor: pointer;    /* affiche un curseur adapté */
  font-size:13Px;

}



.planning{
 
}

.planning-footer{
    font-size:13px;
    color:#888888;
    text-align:center;
    padding-top:10px;
  
}


.titre-planning{

    font-size:18px;
    font-weight:bold;
    padding-bottom:0px;
    border-bottom:1px solid #CCCCCC;
    padding-bottom:5px;
    padding-top:5px;
}


.titre-planning .col-gauche{
    font-size:15px;
    font-weight:bold;
}

.titre-planning .col-droite{
    font-size:14px;
    font-weight:normal;
    text-align:right;
    padding-top:20px;
    font-style:italic;
}


@media (max-width: 1000px) {
    .titre-planning .col-droite{
        font-size:14px;
        font-weight:normal;
        text-align:center;
        padding-top:5px;
    }
  
    .titre-planning .col-gauche{
          text-align:center;
    }
}




.planning .titre-action{
    background-color:#FFFFFF;
    padding:0px;
    margin:-10px;
    margin-bottom:10px;
}

.planning .titre-action .col-gauche{
    text-align:left;
    padding:0px;
        padding-bottom:2px;
}

.planning .titre-action .col-droite{
    text-align:right;
    padding:0px;
        padding-bottom:2px;
}

.planning .titre-action .col-center{
    text-align:center;
    padding:0px;
    padding-bottom:2px;
    font-size:22px;
    font-weight:bold;
}


.planning .titre-action a.btn-action {
    font-size:13px;
    font-weight:normal;
    padding:6px 20px;
    text-align:center;
    display:inline-block;
    background-color:#A0A0A0;
    color:#FFFFFF;
    margin-top:5px;
  
    text-decoration:none;
}

.planning .titre-action a.btn-action:hover{
     background-color:#87b2f4;
}


/********************************************************************/
/********************************************************************/
/* .planning .titre-jours */
/********************************************************************/
/********************************************************************/


.planning .titre-jours{

    background-color:#FFFFFF;
}

.planning .col-7jours{
    width:14%;
    display:inline-block;
    float:left;
}


.planning .jour-titre{
    padding:0px;
    padding-right:1px;
    padding-bottom:1px;

}

.planning .jour-titre .box{
    text-align:center;
    font-size:14px;
    padding:0px;
        background-color:#E0E0E0;

}

.planning .jour-titre .nom{

    font-size:15px;
    line-height:15px;
    font-weight:normal;
    color:#000000;
    padding:5px 0px;
}

.planning .jour-titre .num{
    padding:8px 0px;
    font-size:16px;
    line-height:10px;
    color:#000000;
}

@media (max-width: 768px) {
    .planning .jour-titre .nom {
        font-size:13px;
        font-weight:normal;
    }

    .planning .jour-titre .num{
        padding:8px 0px;
        font-size:16px;
        line-height:10px;
    }

}

/********************************************************************/
/********************************************************************/
/* .planning .jour  */
/********************************************************************/
/********************************************************************/


.planning .jour{
    padding:0px;
    padding-right:1px;
}

.planning .jour .box{
    /*background-color:#A0A0A0;*/
    text-align:center;
    font-size:12px;
    padding:0px;
    min-height:500px;

}


.planning .jour a.animation-box {
    background-color:#F0F0F0;
    margin-bottom:1px;
    display:block;
    text-decoration:none;
}

.planning .jour a.box-etat-disponible {
    background-color:#d1e3ff;
}

.planning .jour a.box-etat-reserve {
    background-color:#d2b8e6;
    color:#6a4c81;
}

.planning .jour a.box-etat-ferme {
    background-color:#E0E0E0;
}

.planning .jour a.box-etat-disponible:hover {
    background-color:#87b2f4;
}



.planning .jour .titre a {
    margin-top:1px;
    font-size:13px;
    color:#1f60d6;
    font-weight:bold;
    display:block;
    height:20px;
}

.planning .jour .heure {
    margin-top:0px;
    padding:2px 0px;
    font-size:10px;
    font-weight:normal;
    color:#000000;

}

.planning .jour .heure-debut{

    text-align:right;
    padding-right:3px;
}

.planning .jour .heure-fin{
    padding-left:3px;
    text-align:left;
}


.planning .jour .tarif{
    margin-top:0px;
    padding:2px 0px;
    font-size:10px;
    font-weight:bold;
}


@media (max-width: 768px) {

    .planning .titre-action .col-gauche {
        text-align:center;
    }

       .planning .titre-action .col-droite {
        text-align:center;
    }

    .planning .jour .heure {
        font-size:9px;
    }
    
    .planning .jour .heure-debut{
        text-align:center;
        padding-right:0px;
    }

    .planning .jour .heure-fin{
        padding-left:0px;
        text-align:center;
    }
}








/********************************************************************/
/********************************************************************/
/* .planning-reservation */
/********************************************************************/
/********************************************************************/

.planning-reservation{

}


.planning-reservation-top-header{
    padding:8px 0px;
    background-color:#FFFFFF;
    font-size:13px;
}

.col-gauche{
    color:#666666;
    font-weight:bold;
}

.col-droite{
    color:#666666;
    text-align:right;
}

.planning-reservation{
    padding-top:00px;
}

.planning-reservation .box{
    margin:0 auto;
    width:100%;
    background-color:#FFFFFF;

    padding-bottom:0px;
}

.planning-reservation .box .zone-header{
    font-size:13px;
    padding:8px 0px;
    color:#444444;
    border-bottom:1px solid #EAEAEA;
    padding-bottom:10px;
}

.planning-reservation .box .zone-header .col-droite{
    text-align:right;
}

.planning-reservation .box .zone-titre{
    text-align:center;
    margin-top:30px;
}

.planning-reservation .box .zone-titre .texte1{
    text-transform:uppercase;
    font-weight:bold;
    font-size:22px;
    color:#555555;
}

.planning-reservation .box .zone-titre .texte2{
    color:#000000;
    font-size:20px;
    font-weight:bold;
}

.planning-reservation .box .zone-details{
    color:#000000;
    font-size:16px;
    text-align:center;
    margin-top:0px;
    background-color:#FFFFFF;
    padding:10px;


}

.planning-reservation .box .zone-details .date{
    color:#206898;
    font-weight:bold;
}



.planning-reservation .formulaire .ligne{
    margin-top:0px;
    padding:5px 0px;
}

.planning-reservation .formulaire .titre{
    font-size:17px;
    font-weight:bold;
    text-align:center;
    margin-top:15px;
    margin-bottom:10px;
}


.planning-reservation .formulaire .champ-titre{
    text-align:right;
    padding-top:2px;
    font-weight:bold;
    font-size:13px;

}

.planning-reservation .formulaire .champ-valeur {
    font-size:13px;
    color:#666666;
    padding:0px;
   
}

.planning-reservation .formulaire .champ-valeur-checkbox {
    font-size:13px;
    color:#666666;
    padding:0px;
    padding-top:3px;
    font-weight:normal;
   
}

.planning-reservation .formulaire .champ-valeur-checkbox input{
    font-size:13px;
}

.planning-reservation .formulaire .champ-valeur input{
    border:1px solid #E0E0E0;
    padding:6px;
    color:#206898;
    width:95%;
    font-weight:bold;
        font-size:14px;
}



.planning-reservation .formulaire .champ-valeur select{
    border:1px solid #E0E0E0;
    padding:6px;
    color:#206898;
    width:95%;
    font-size:13px;
}

.planning-reservation .formulaire .champ-valeur .textarea{
    border:1px solid #E0E0E0;
    padding:6px;
    color:#206898;
    width:90%;
}

@media (max-width: 1000px) {

    .planning-reservation .formulaire {
        padding:0px 30px;
 
    }

    .planning-reservation .formulaire .champ-titre{
        text-align:left;
        padding-left:0px;
    }

    .planning-reservation .formulaire .champ-valeur {
        text-align:left;
    }

    .planning-reservation .formulaire .champ-valeur input{
        text-align:left;

    }

}

/********************************************************************/
/********************************************************************/
/* .formulaire zone montant */
/********************************************************************/
/********************************************************************/


.planning-reservation .formulaire input.btn-valider{
    background-color:#12c09d;
    padding:px;
    color:#FFFFFF;
    width:180px;
    display:inline-block;
    font-size:13px;
    text-align:center;
    text-decoration:none;
    border:0px;
    border-radius:3px;

}

.planning-reservation .formulaire input.btn-valider:hover{
    background-color:#059275;
}


.planning-reservation  .box .zone-montant{
    margin-top:20px;
    padding:0;
    padding-top:4px;
    font-weight:bold;
    text-align:center;
}



.planning-reservation  .box .zone-montant .montant{
    font-size:22px;
    color:#3290cf;
    font-weight:bold;
    padding:0;
    padding-right:15px;
}

.planning-reservation  .box .zone-action{
    margin-top:30px;
    text-align:center;
}

.planning-reservation  .box .zone-action .col-gauche{
    text-align:right;
}

.planning-reservation  .box .zone-action .col-gauche img{
    width:300px;
}

.planning-reservation  .box .zone-action .col-droite{
    text-align:left;
    padding-top:10px;
}

.planning-reservation  .box a.btn-payer{
    background-color:#8ad924;
    padding:15px 20px;
    color:#FFFFFF;
    border-radius:2px;
    text-decoration:none;
}

.planning-reservation  .box a.btn-payer:hover{
    background-color:#6bb806;
}

.planning-reservation  .box .box-bilan{
   margin-top:20px;
   border:1px dashed #E0E0E0;
   padding:20px 0px;
}



.planning-reservation a.btn-retour-fin-paiement{
    background-color:#206898;
    padding:10px 20px;
    color:#FFFFFF;
    width:180px;
    display:inline-block;
    font-size:15px;
    text-align:center;
    text-decoration:none;
    border:0px;
    border-radius:3px;

}

.planning-reservation a.btn-retour-fin-paiement:hover{
    background-color:#059275;
}


@media (max-width: 1000px) {

    .planning-reservation  .box .zone-action .col-droite{
        text-align:center;
        padding-top:0px;
    }

}


/********************************************************************/
/********************************************************************/
/* .form-notification */
/********************************************************************/
/********************************************************************/



.form-notification {
    background-color:#84c6a5;
    color:#FFFFFF;
    padding:12px 20px;
    border-radius:5px;
    font-weight:bold;
    margin-top:10px;
    margin-bottom:15px;
    font-size:15px;
    text-align:center;
}



.form-notification-bloc-warning {
    background-color:orange;
    color:#FFFFFF;
    padding:12px 20px;
    border-radius:5px;
    font-weight:bold;
    margin-top:10px;
    margin-bottom:15px;
    font-size:15px;
    text-align:center;
}