/* .error{background-color: #FFA0A0;} */
.invalid-feedback {display:none;}
.error .invalid-feedback {display:block;}
.cacher {display:none;}

#content {padding-top:2rem; padding-bottom:1.5rem;font-size:.875rem;}
#body {background:#e0e0e0; }
#body.page1  {background:#00b2c5;}


.centrePage {width:100%;}

.titrePage {color:#fff; text-align:center; margin-bottom:2rem;}
.titrePage h1 {font-size:1.5rem; margin-bottom:.4rem;}
.titrePage p {font-size:1.2rem;}

.box {background:#fff; padding:.8rem 1rem; position:relative;}
.box h3 {font-size:1.3rem; font-weight:normal; padding-bottom:1rem; border-bottom:1px solid #EAEAEA; }
.box h2 {background:#282828; font-size:1.1rem; font-weight:normal; margin:-.8rem -1rem; padding:1rem 1rem; color:#fff; margin-bottom:.8rem;}

.box-flex-1 {-webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1;}
.custom-control .custom-control-label::before {cursor:pointer;}

.ligne {padding:1rem .5rem; font-size:1rem; cursor:pointer; border-bottom:1px solid #EAEAEA;}
.liste .ligne:last-child {border-bottom:0;}
.ligne .ligne-code {width:45px; padding:0; line-height:30px; text-align:center; margin-right:.75rem; border:2px solid transparent; border-radius:2px;}
.ligne .ligne-label {line-height:1; padding:0;}
.ligne:hover {background:#00b2c5;}
.ligne:hover .ligne-code {color:#fff; border-color:#fff!important;}
.ligne:hover .ligne-label {color:#fff;}

.btn-primary {background-color: #00b2c5 !important; border-color: #00b2c5 !important;}
.btn-primary:hover {background-color: #24c7d6 !important; border-color: #24c7d6 !important;}
.btn-etape {border-radius:0; width:100%;}
.btn-etape .btn-label{line-height:1; text-align:left; padding:.5rem 0;}
.btn-etape .btn-label-first{display:block; font-weight:bold;}
.btn-etape .btn-label-description{font-size:.875rem;}
.btn-etape .fa{width:30px;}

.btn-secondary {background-color: #7F7F7F; border-color:#7F7F7F;}
.btn-secondary:hover {background-color: #282828; border-color:#282828;}
.btn-sm {font-size:.775rem; line-height:1;}

.annotation {font-size:.875rem; font-style:italic;}

.lien {font-weight:bold; color: #00b2c5 !important;}
.lien :hover {color: #24c7d6 !important;}

.recap-final {padding-left:15px; padding-right:15px;}

/* ****************** ****** ****************** */
/* ****************** PAGE 1 ****************** */
/* ****************** ****** ****************** */
.page1.etape1 .btn-etape {display:none !important;}
.page1.etape2 .liste + .btn-etape {margin-top:2rem;}

.page1 .liste .ligne { border-bottom:0;}
.page1 .liste .bloc-ligne { border-bottom:1px solid #EAEAEA;}
.page1 .liste .bloc-ligne:last-child {border-bottom:0;}

.page1 .ligne {padding:.5rem;}
.passager {padding:.5rem; border-bottom:1px solid #EAEAEA; font-size:.875rem;}
.passager label {margin:0 .5rem 0 0; color:#fff;}
.passager .input-group {width:100px;}

.selection .ligne,
.selection .passager {background:#00b2c5; border-bottom-color:#fff;}
.selection .ligne .ligne-code {color:#fff; border-color:#fff!important;}
.selection .ligne .ligne-label {color:#fff;}

.form-control-sm,
.input-group-sm > .form-control,
.input-group-sm > .input-group-append > .btn,
.input-group-sm > .input-group-append > .input-group-text,
.input-group-sm > .input-group-prepend > .btn,
.input-group-sm > .input-group-prepend > .input-group-text {padding:.2rem .5rem;}

.cgu {margin-bottom:2rem;}


.passager .input-group.nombreSelector input.form-control {width:37px; text-align: center; display:flex;height:2.1em;}
.passager .input-group.nombreSelector {width:35%; display:flex;}
.passager label {width:55%; text-align: right;}


/* ****************** ****** ****************** */
/* ****************** PAGE 2 ****************** */
/* ****************** ****** ****************** */

/* Récapitulatif */
.lien-effacer {font-size:.875rem; color:#727272; cursor:pointer;}
.lien-effacer:hover {color: #24c7d6;}
#zoneDroite .lien-effacer { text-align:right;}
.recapitulatif {padding-left:.8rem;}
.recap-step h4 {font-size:.875rem; font-style:italic; color:#7F7F7F; position:relative; line-height:22px; margin:0; padding-left:1rem;}
.recap-step h4 .step{font-style:normal; position:absolute; left:-11px; top:0; width:22px; line-height:20px; text-align:center; background:#fff; border:1px solid #7F7F7F; border-radius:11px;}
.recap-step-detail{border-left:1px solid #7F7F7F; padding-left:1rem; padding-bottom:1.5rem; color:#282828;}

/* Récapitulatif haut */
.page2.etape1 .recap-final-step-1,
.page2.etape1 .recap-final-step-2,
.page2.etape1 .recap-final-step-3,
.page2.etape1 .btn-step-1,
.page2.etape1 .btn-step-2,
.page2.etape1 .btn-step-3 {display:none;}

.page2.etape2 .recap-final-step-2,
.page2.etape2 .recap-final-step-3,
.page2.etape2 .btn-step-0,
.page2.etape2 .btn-step-2,
.page2.etape2 .btn-step-3 {display:none;}

.page2.etape3 .recap-final-step-3,
.page2.etape3 .btn-step-0,
.page2.etape3 .btn-step-1,
.page2.etape3 .btn-step-3 {display:none;}

.page2.etape4 .btn-step-0,
.page2.etape4 .btn-step-1,
.page2.etape4 .btn-step-2 {display:none;}

/* Étapes */
.page2 .step-date,
.page2 .step-lieu,
.page2 .step-horaire,
.page2 .recap-step-detail .btn {display:none;}

.page2.etape1 .step-date{display:block;}
.page2.etape1 .recap-step-0 .recap-step-detail .btn{display:inline-block;}
.page2.etape1 .recap-step-1 h4 {color:#00b2c5;}
.page2.etape1 .recap-step-1 h4 .step {border-color:#00b2c5; background:#00b2c5; color:#FFF;}
.page2.etape1 .recap-step-1 .recap-step-detail,
.page2.etape1 .recap-step-2,
.page2.etape1 .recap-step-3,
.page2.etape1 .recap-step-4 {display:none;}

.page2.etape2 .recap-step-1 .recap-step-detail .btn{display:inline-block;}
.page2.etape2 .step-lieu,
.page2.etape2 .recap-step-1 .recap-step-detail,
.page2.etape2 .recap-step-2 {display:block;}
.page2.etape2 .recap-step-2 h4 {color:#00b2c5;}
.page2.etape2 .recap-step-2 h4 .step {border-color:#00b2c5; background:#00b2c5; color:#FFF;}
.page2.etape2 .recap-step-2 .recap-step-detail,
.page2.etape2 .recap-step-3,
.page2.etape2 .recap-step-4 {display:none;}

.page2.etape3 .recap-step-2 .recap-step-detail .btn{display:inline-block;}
.page2.etape3 .step-lieu,
.page2.etape3 .recap-step-2 .recap-step-detail,
.page2.etape3 .recap-step-3 {display:block;}
.page2.etape3 .recap-step-3 h4 {color:#00b2c5;}
.page2.etape3 .recap-step-3 h4 .step {border-color:#00b2c5; background:#00b2c5; color:#FFF;}
.page2.etape3 .recap-step-3 .recap-step-detail,
.page2.etape3 .recap-step-4 {display:none;}

.page2.etape4 .recap-step-3 .recap-step-detail .btn{display:inline-block;}
.page2.etape4 .step-horaire,
.page2.etape4 .recap-step-3,
.page2.etape4 .recap-step-3 .recap-step-detail,
.page2.etape4 .recap-step-4 {display:block;}
.page2.etape4 .step-horaire .typeHoraire1 {background:#32d332;}

.page2.etape4 .recap-step-4 h4 {color:#00b2c5;}
.page2.etape4 .recap-step-4 h4 .step {border-color:#00b2c5; background:#00b2c5; color:#FFF;}
.page2.etape4 .recap-step-4 .recap-step-detail{display:none;}


.page2.etape1 .box h2,
.page2.etape2 .box h2,
.page2.etape3 .box h2 {border-bottom:0;}

/* Étape 1 */
.calendrier {margin-bottom:2rem;}
.ui-datepicker.ui-datepicker-multi {width:100% !important;}
.ui-datepicker-multi .ui-datepicker-group {width:50%;}
.ui-datepicker-multi .ui-datepicker-group:nth-of-type(2n+1) {clear:both;}
.ui-widget-content {border:0;}
.ui-widget-header {border:0; background:#EAEAEA;}
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {border:0 !important;}
.ui-datepicker td {padding:0 0 1px!important;}
.ui-datepicker {padding:0 !important;}
.ui-state-disabled,
.ui-widget-content .ui-state-disabled,
.ui-widget-header .ui-state-disabled {opacity:.75 !important; filter: Alpha(Opacity=75) !important;}
.ui-state-selected .ui-state-default{background:#00b2c5; color:#fff;}
.ui-state-selected .ui-state-default:hover{background:#24c7d6;}
.ui-datepicker td span,
.ui-datepicker td a {padding:.25rem .2rem; font-size:.7rem;}
.ui-datepicker .ui-datepicker-buttonpane {margin:0; padding:0;}
.ui-datepicker .ui-datepicker-buttonpane button {margin:0; padding:.25rem .6rem; background:#00b2c5; color:#fff; opacity:1 !important; filter: Alpha(Opacity=100) !important;}
.ui-datepicker .ui-datepicker-buttonpane button:hover {background:#24c7d6;}

/* ****************** ****** ****************** */
/* ****************** PAGE 3 ****************** */
/* ****************** ****** ****************** */
.recap-final .lien-effacer {display:inline-block; font-size:.775rem; line-height:1; padding: .25rem .5rem;}
.recap-final-label {color:#7F7F7F;}
.page3 .form-group textarea {height:80px;}

.page3 .box h2 {margin-bottom:.8rem;}


/* ****************** ****** ****************** */
/* ****************** PAGE 4 ****************** */
/* ****************** ****** ****************** */
.confirmation {text-align:center;}

@media (min-width: 768px) {
    .centrePage {width:700px; margin:0 auto;}

}