/*Hauteur des éléments*/

.vw-70{
  margin-left: 6vw;
  margin-right: 6vw;

}

.vh-92{
height: 92vh !important;
}

.vh-5{
height: 5vh !important;
}

.vw-5{
width: 5vw !important;
}

.vw-3{
  width: 3vw !important;
  margin: 50% 0% 10% 0%;
}


.vw-10{
width: 10vw !important;
}




/*Cartographie  */

#smallmap{
  width: 100%;
  height: 100%;
  min-height: 400px;
  max-height: 500px;
  display: inline-block;
}

/* Popup concernant le survol du département*/
/*
.popupDep{
  background-color: #de656aff !important;
  color: #fff !important;

}*/

/* Popup au survol d'un tunnel */
.popupTunnel{
  background-color: #5a5199 !important;
  color: #ffffffff !important;

}


/* Regroupe: Style image + position + typo chiffre*/
.cluster {
  height: 25px;
  width: 25px;
  text-align: center !important;
  line-height: 25px;
  font-size:  13px;
  font-family: 'open_sansregular', sans-serif;
  font-weight: bolder;
  color: #de656aff;
  background-image: url('../img/logo_cluster_markers.svg');
  background-size: 25px 25px;
}

/* fond de carte blanc*/
.leaflet-container {
    background: #fff !important;
}


/*
Fenêtre s'affichant au clic sur un tunnel
*/
#popup {
    background-color: white;
    position : absolute;
    bottom : 10vh;
    right : 2vw;
    z-index:10000;
    border-radius: 20px;
    padding:10px;
     text-align: center;
    display: none;
    width : 25vw;
    border : 4px solid #de656aff;

}

/*
Fon d'écran qui s'affiche lorsque l'on voit une fiche
*/
#background{
  display: none;
  z-index: 120000;
  position:absolute;
  top:0px;
  left:0px;
  opacity: 0.8;
}


/*
Position au dessus d'une fiche des boutons imprimer et fermer
*/
#imprimer{
  z-index: 150000;

}



#fermer{
  z-index: 150000;


}


/*
CSS de la fiche (positionnement par rapport aux bords de l'écran)
*/
#fiche{
      position : absolute;
  bottom : 5vh;
  top : 5vh;
  right : 5vw;
  left : 5vw;
  overflow: auto;
  overflow-x: hidden;
  z-index: 150000;
  display: none;

}



/* Style motif de vague violette */
.wave{
background-image : url("../img/motif_entete_piedpage.svg");
background-repeat: repeat;
background-size: 20px 20px;
}


/* Style motif de vague ros */

.wave_pink{
background-image : url("../img/motif_sous_titre.svg");
background-repeat: repeat;
background-size: 20px 20px;
}

.pink_bg_light{
    background-color: #f6c6c7;
}

.pink_bg{
  background-color: #de656aff
}
/* Texte et titre */
h1 { font-family: Calibri; font-size: 34px; font-style: normal; font-variant: normal; color:white }
h2 { font-family: Calibri; font-size: 20px; font-style: normal; font-variant: normal; color:white }

.white_subtitle{
font-family: Arial Black,Arial Bold,Gadget,sans-serif;  font-size: 18px; font-style: normal; font-variant: normal; color:white; font-weight: 500;
}

.white_subtitle_lat_bar{line-height : 10px , font-family: Arial Black, Arial Bold, Gadget, sans-serif; font-size: 14px; font-style: normal; font-variant: small-caps; font-weight: 600; padding-top: 2px ; padding-bottom:2px; color :white }

.normal_black_text{font-family: "Calibri"; font-size: 14px; font-style: normal; font-variant: normal; color:white; font-weight: lighter; color:black}

.normal_pink_text{font-family: "Calibri"; font-size: 14px; font-style: normal; font-variant: normal; color:white; font-weight: lighter; color:#fbb7ba}

.normal_grey_text{font-family: "Calibri"; font-size: 14px; font-style: normal; font-variant: normal; color:white; font-weight: lighter; color:#6c757d}

.normal_purple_text{font-family: "Calibri"; font-size: 16px; font-style: normal; font-variant: normal; color:white; font-weight: lighter; color:#5a5199}


.pink_subtitile{font-family: "Calibri"; font-size: 14px; font-style: normal; font-variant: normal; color:white;  color:#f58e93}


.normal_white_text{
  font-family: "Calibri"; 
  font-size: 1.05rem; 
  font-style: normal; 
  font-variant: normal; 
  color:white; 
  font-weight: lighter;
}



/* Menus */

/* Boites à cliquer */
.form-check-input:active[type="checkbox"]{
  box-shadow: 0 0 2px #5a5199;
  -webkit-transition: all 0.5s ease-in-out;
  border: 0px;
  color: #fff;

}

.form-check-input:focus[type="checkbox"]{
  border-color: #5a5199;
  outline: 0;
  box-shadow: 0 0 0 .25rem #5a519930;
}


.form-check-input:checked[type="checkbox"]{
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
  background-color: #5a5199
}



/* Boutons */
.btn-change {
    box-shadow: 0 0 2px #de656aff;
    -webkit-transition: all 0.5s ease-in-out;
    border: 0px;
    color: #fff;

}

.btn_clicked{
  box-shadow: 0 0 8px #de656aff;

}

.btn:focus{
  box-shadow: 0 0 8px #de656aff;

}


.btn-custom_purple {
  color: #ffffff;
  background-color: #5a5199;
  border:none;
  font-weight: bold;
  padding:0px;
}

.btn-custom_purple:hover,
.btn-custom_purple:active,
.btn-custom_purple:focus,
.btn-custom_purple.active {
  background: #7a7795;
  color: #ffffff;
  border:none;

}


.btn-custom {
  color: #ffffff;
  background-color: #de656aff;
  border:none;
  font-weight: bold;
  padding:0px;

}

.btn-custom:hover,
.btn-custom:active,
.btn-custom:focus,
.btn-custom.active {
  background: #e24e69;
  color: #ffffff;
  border:none;

}

.btn-check,.recherche {
  font-size: large;
}

.btn-check:checked  + .btn-secondary{
width: 100%;
border-radius: 0px;
background-color:#de656aff;
border:none;
font-size: large;

}

/*Slider */
.ui-slider-horizontal .ui-slider-range{
  background-color: #6c757d
}

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active{
    background-color: #5a5199
}

.dropright {
  padding:0px;

}


/* Bouton France*/


#button{
  position:absolute;
  z-index: 1000;
  left:2vw;
  bottom:3vh;
  width: 15%;
}


#home{
  position: absolute;
  left: 50px;
  top : 10px;
  z-index : 1000;
  background-color: #de656aff
}


.homebutton, .homebutton:active{
background: none;
  border : none;
  border : 2px solid rgba(0,0,0,0.2);
  border : none;
}

.homebutton:hover{
  background-color :white;
  background-image:url( "../img/black-home-svgrepo-com.svg");
}


/* Menu déroulant pour les filtres si l'écran est trop petit*/

.menu-scroll {
  overflow-y: scroll;
  max-height: 200px;
}





body{
   font-family: Calibri; font-size: 13px; font-style: normal; font-variant: normal; color:#313e48;
    -webkit-print-color-adjust: exact !important;
    color-adjust: exact; /*firefox & IE */;
}



/*Bouton de recherche unique*/
.recherche{
width: 100%;
border-radius: 0px;
background-color:#fff;
border:none;
color:#313e48;
}


.recherche:focus{
border:none;
transition:none;
background-color:#de656aff;

}

.btn-check:focus + .btn-secondary{
  border:none;
  transition:none;
  background-color:#de656aff;
  box-shadow: none;
}


.recherche:active{
border:none;
transition:none;
background-color:#de656aff;

}


.recherche:hover{
width: 100%;
border-radius: 0px;
background-color:#ed9ea1ff;
border:none;

}


.disabledropdown{
 color : #444444;
 background-color: #6c757d;
}


.disabledropdown:hover,
.disabledropdown:active,
.disabledropdown:focus,
.disabledropdown:activ{
 color : #444444;
 background-color: #6c757d;

}



.border_bot{

  border-bottom: solid;border-width: 1px;
}


.form-check-inline2 {
  display: inline-block;
  margin-bottom: 0;
  vertical-align: middle;
}

@media (max-width: 1200px) {
  .form-check-inline2 {
    display: block;

  }
}


@media (max-width: 1200px) {
  .form-check-inline {
    display: block;

  }
}

.table-striped > tbody > tr:nth-child(2n+1) > td, .table-striped > tbody > tr:nth-child(2n+1) > th {
  background-color: lightblue !important;
}

.legend {
  background: rgba(255,255,255,0.6);
  padding: 0.2em;
  border-radius: 0.2em;
}

.btn_couche{
  margin-top: 1em;
  background-color: rgba(255, 255, 255, 0.6);
}

.btn_clicked_couche{
  margin-top: 1em;
  background-color: rgba(13, 243, 59, 0.4);
}

.carousel-caption {
  right: 1%;
  bottom: 0px;
  text-align: right !important;
  padding: 0px !important;
} 

#boutonCoucheFiltre{
  margin: 0px 0px 15px 0px;
}

#separator {
  width: 5px;
  user-select: none;
}

#col-filtre {
  overflow: auto;
  width: 25%;
}

#col-map{ 
  width: 75%;
  overflow: hidden; 
  height: 100%;
}

.tabulator-tableholder{
  background-color: white;
}