main{margin:0;padding:0;position:relative;box-sizing:border-box}main .boxTitre{display:flex;flex-flow:column;align-items:center;color:wheat;background:teal;padding:20px 0}main .span{font-size:16px}main .boxButtonUpdate{position:sticky;bottom:20px;text-align:right;padding-right:20px}main textarea{background:none;border:1px solid #d3d3d3}main h1{font-size:50px;letter-spacing:5px}main h1,main h2{text-align:center}main h2{font-size:30px}main input,main textarea{padding:10px 10px;display:block;border:1px solid #d6d4d4;background:#e4e4e4}main .button{padding:10px 20px;border:none;cursor:pointer}main .validButton{background:green;color:#fff}main .dangeButton{background:#811717;color:#fff;margin-right:20px}main .creerDate{cursor:pointer;font-weight:700;margin:20px 0}main .creerDate:hover{color:grey}main h2{margin-top:50px}main .containerAffichage{margin-left:50px}main .buttonAjouterDates{margin-top:20px}.containerAffichage .boxBasseSaison{margin-left:50px;margin-bottom:50px}.boxChoixDates{display:flex;justify-content:space-evenly;flex-flow:wrap;margin:20px auto;max-width:500px}.boxChoixDates .box{display:flex;align-items:center}.boxChoixDates span{margin-right:10px;font-weight:700}.boxChoixDates .boxButton{display:flex;justify-content:center;width:100%;margin:30px auto}.boxChoixDates input{width:100px}.containerLegende{width:90%;margin:20px auto;margin-bottom:0}.containerLegende .etoile:before,.containerLegende .redInfo:before{content:"*";color:#b12222}.containerLegende .redInfo{color:#b12222;font-style:italic;font-size:14px!important}.containerLegende .detail{color:#00f;text-decoration:underline;cursor:pointer}.containerLegende .boxLegendeCouleur{display:flex;margin-bottom:10px}.containerLegende .boxLegendeCouleur .couleurMiniature{display:flex;align-items:center}.containerLegende .boxLegendeCouleur .labelBasseSaison{margin-left:50px}.containerLegende .minHauteSaison{width:50px;height:15px;background:#adadd3;margin-left:10px}.containerLegende .minBasseSaison{width:50px;height:15px;background:#b0ceb0;margin-left:10px}.containerLegende .boxInfoHeure{margin:20px 0}.containerLegende .boxInfoHeure .containerDetail{display:flex;justify-content:space-evenly;flex-flow:wrap}.containerLegende .total{font-weight:700;font-size:1.5rem}.containerLegende .collaborateur{display:flex;align-items:center;margin:0 10px}.containerLegende input{margin-left:10px}.containerLegende .boxCollaborateur{display:flex;justify-content:space-evenly;flex-flow:wrap;margin-top:0;padding:10px 0;background:#d3d3d3}.containerLegende .boxCollaborateur label{font-weight:700}.containerDates{width:90%;margin:auto;box-shadow:0 0 15px 3px grey}.containerDates input,.containerDates textarea{background:none}.containerDates input:hover{cursor:pointer}.containerDates .col{width:23%}.containerDates .headerDates{display:flex;justify-content:space-between;background:teal;position:sticky;top:0}.containerDates .headerDate{padding:10px 0;padding-left:10px;color:#fff}.containerDates .ligneDate{display:flex;justify-content:space-between}.containerDates .ligneDate:hover{background:#d3d3d3}.containerDates .weekend{background:#e2c36e}.containerDates .noWeekend{background:none}.containerDates .possibleChange{background:#d1a2a2}.containerDates .hauteSaison{background:#adadd3}.containerDates .basseSaison{background:#b0ceb0}.containerDates .colHeure{width:8%;text-align:center;padding-left:0}.containerDates .ferme{background:#8b4242;color:#fff}.containerSaison{margin-left:50px}.containerSaison .titleSaison{font-weight:700;cursor:pointer}.containerSaison .titleSaison:hover{color:grey}.containerSaison .boxSaison{margin-left:50px}.containerSaison .hauteSaison{margin-top:20px}.containerSaison button{margin:20px 0}@media screen and (max-width:500px){main .containerAffichage{margin-left:10px}.containerDates{width:100%}.containerDates .headerDate{font-size:8px}.containerDates input,.containerDates textarea{font-size:8px;padding:5px}.containerSaison{margin-left:10px}}@media screen and (max-width:500px) and (max-width:410px){.labelBasseSaison{margin-left:0!important}.couleurMiniature{display:flex;flex-flow:column}.boxLegendeCouleur{display:flex;justify-content:space-evenly}.minBasseSaison,.minHauteSaison{margin-left:0!important}}