/**
 * Barre de navition
 */
 
div.mois {
    border-right: 5px solid white;
    background: #E6E6E6;
    border-radius: 20px;
}
 
div#calendar {
  margin:0px auto;
  padding:0px;
  width: 100%;
  font-family:Helvetica, "Times New Roman", Times, serif;
  margin-bottom: 0;
  padding: 20px;
}
 
div#calendar div.box {
    position:relative;
    top:0px;
    left:0px;
    width:100%;
    height:40px;
    color: #2E3192;
    text-align: center;
}
 
 
div#calendar div.header a.prev,div#calendar div.header a.next { 
    position:absolute;
    top:0px;   
    height: 17px;
    display:block;
    cursor:pointer;
    text-decoration:none;
    color:#FFF;
}
 
div#calendar div.header span.title {
    color:#2E3192;
    font-size:30px;
}
 
 
div#calendar div.header a.prev {
    left:0px;
}
 
div#calendar div.header a.next {
    right:0px;
}
 

/**
 * Cellules
 */
div#calendar div.box-content {
    border-top:none;
}
 
div#calendar ul.label {
    float:left;
    margin: 0px;
    padding: 0px;
}
 
  
div#calendar ul.dates {
    display: block;
    width: 100%;
    float:left;
    margin: 0px;
    padding: 0px;
}
 
/** overall width = width+padding-right**/
div#calendar ul.dates li,
div#calendar ul.label li {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin:0px;
    padding:0px 10px;
    vertical-align:middle;
    float:left;
    list-style-type:none;
    width:14.2857%;
    height:80px;
    font-size:25px;
    color:#000;
    text-align:center; 
}

div#calendar ul.dates li {color:#fff;}


.contenucellule {
    width: 100%;
    height: 75%;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

div#calendar ul.dates li.red .contenucellule {
    background-color: red; 
}

div#calendar ul.dates li.red .contenucellule:empty {
    background-color: white; 
}

div#calendar ul.dates li.green .contenucellule {
    background-color: green;  
}
 
div#calendar ul.dates li.orange .contenucellule,
div#calendar ul.dates li.purple .contenucellule {
    background-color: orange;  
}

div#calendar ul.dates li a,
div#calendar ul.label li a {
    display:block;
    font-size:14px;
    color: #fff;
}

.nbplaces {
    font-size: 80%;
}
 
:focus {
    outline:none;
}
 
div.clear{
    clear:both;
}  

.green, .orange, .purple {
  position: relative;  /* les .infobulle deviennent référents */
}

/* on génère un élément :after lors du survol et du focus :*/

.green:hover::after,
.green:focus::after,
.orange:hover::after,
.orange:focus::after,
.purple:hover::after,
.purple:focus::after {
  content: attr(aria-label); 
  position: absolute;
  bottom: 4.9em;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
  /*white-space: nowrap;*/
  padding: 5px 14px;
  background: #413219;
  color: #fff;
  border-radius: 4px;
  font-size: 1.2rem;
  width: 125px;
}

.green[aria-label]:hover:before,
.green[aria-label]:focus:before,
.orange[aria-label]:hover:before,
.orange[aria-label]:focus:before,
.purple[aria-label]:hover:before,
.purple[aria-label]:focus:before {
  content: "▼";
  position: absolute;
  top: -1em;
    left: 50%;
    transform: translateX(-50%); /* on centre horizontalement  */
  font-size: 20px;
  color: #413219;
}

.green[aria-label]:focus,
.orange[aria-label]:focus,
.purple[aria-label]:focus {
  outline: none;
}

a.boutonreserver {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.slick-track
{
    display: flex !important;
}

.slick-slide
{
    height: inherit !important;
}