/**
Icons bootstrap
*/
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css");


/**
Texte
*/

@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');

h1 {
    font-family: "Roboto", sans-serif;
    font-size: 55pt;
    font-weight: 800;
    font-style: normal;
    font-variation-settings:
      "wdth" 100;
}

h2 {

    font-family:  "Roboto";
    font-size: 50pt;
    font-weight: 600;
    color: #323e48;
}


h3 {

    font-family:  "Roboto";
    font-size: 40pt;
    font-weight: 600;
    color: #323e48;
}

.h3_chap_0 {
    background-color: #f5eee0;
    padding-top: 0.5rem;
    padding-right: 1.5rem;
    padding-bottom: 0.5rem;
    padding-left: 1.5rem;
}

.h3_chap_1 {
    background-color: #fcc11b;
    padding-top: 0.5rem;
    padding-right: 1.5rem;
    padding-bottom: 0.5rem;
    padding-left: 1.5rem;
}

.h3_chap_2 {
    background-color: #b0cb4f;
    padding-top: 0.5rem;
    padding-right: 1.5rem;
    padding-bottom: 0.5rem;
    padding-left: 1.5rem;
}

.h3_chap_3 {
    background-color: #a269a4;
    padding-top: 0.5rem;
    padding-right: 1.5rem;
    padding-bottom: 0.5rem;
    padding-left: 1.5rem;
}

.h3_chap_4 {
    background-color: #49babe;
    padding-top: 0.5rem;
    padding-right: 1.5rem;
    padding-bottom: 0.5rem;
    padding-left: 1.5rem;
}

h4 {

    font-family:  "Roboto";
    font-size: 30pt;
    font-weight: 600;
}

.h4_chap_0 {
    color: #bbb2a4;
    padding-top: 0.5rem;
    padding-right: 1.5rem;
    padding-bottom: 0.5rem;
    padding-left: 1.5rem;
}

.h4_chap_1 {
    color: #fcc11b;
    padding-top: 0.5rem;
    padding-right: 1.5rem;
    padding-bottom: 0.5rem;
    padding-left: 1.5rem;
}

.h4_chap_2 {
    color: #b0cb4f;
    padding-top: 0.5rem;
    padding-right: 1.5rem;
    padding-bottom: 0.5rem;
    padding-left: 1.5rem;
}

.h4_chap_3 {
    color: #a269a4;
    padding-top: 0.5rem;
    padding-right: 1.5rem;
    padding-bottom: 0.5rem;
    padding-left: 1.5rem;
}

.h4_chap_4 {
    color: #49babe;
    padding-top: 0.5rem;
    padding-right: 1.5rem;
    padding-bottom: 0.5rem;
    padding-left: 1.5rem;
}

h5 {

    font-family:  "Roboto";
    font-size: 24px;
    font-weight: 400;
}

.subtitle-page{
    font-family:  "Roboto";
    font-size: 25pt;
    font-weight: 600;
}



p,ul,li {
    font-family:  "Roboto";
    font-size: 16pt;
    font-weight: 300;
}

.p-4{ text-align: justify;
    z-index: 2;}

ul {
    padding-left: 10px;
}

a {
    color: white; 
    font-weight: bold;
}

.higlight{
    font-family:  "Roboto";
    font-size: 25pt;
    font-weight: normal;

}


.text-menu{

    font-family:  "Roboto";
    font-size: 18pt;
    font-weight: 500;

}






/**
Couleur de texte
*/

.text-purple{
color :#c13b8eff
}


.text-blue{

    color : #307db8ff

}



.text-red{
 color : #e94c60ff
}
/*
Marge négative pour le bas du menu
*/
.mt-n12 {
    margin-top: -6rem !important;
  }

  .icon_menu{
    height: 50px;
    border-color: #323e48;
    border-style: solid;
    border-width: 3px;
    border-radius: 50px;
    margin-left : 5px;
    margin-top: 2px;
}


.icon_menu_mini{
    height: 25px;
    border-color: #323e48;
    border-style: solid;
    border-width: 3px;
    border-radius: 50px;
    margin-left : 5px;
    margin-top: 2px;
}


/*
Position des guillemets
*/

.guillemet_haut{

    position: relative;
    left: calc(-50% + 80px);
    top: 20px;
    width : 80px ;
    height :  50px;
}


.guillemet_bas{

    position: relative;
    left: calc(50% - 80px);
    top: -20px;
    width : 80px ;
    height :  50px;
}



/*
Menu déroulant
*/

#menu {
    z-index: 3;
}



.dropdown-content {
    display: none;
    position: absolute;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: -1;
    left:25px;
    margin-top: -50px;
    color:white;
    height:50px;
    padding-right: 40px;
    border-radius: 0px 100px 100px 0px;
}
  
.dropdown-content table {
    height : 100%;
}

.dropdown-content a {
  
    text-decoration: none;
    display: inline-block;
    color:white;
    max-width: fit-content;
    padding-left: 60px;
    overflow: hidden;
    white-space: nowrap;
    font-size: large;
}
  

.dropdown-content:hover {background-color: #ddd;}
  
.dropdown:hover .dropdown-content {display: block;}
        
.dropdown-content.chap_0 { background-color: #f5eee0;}
.dropdown-content.chap_0 a { color: #323e48;}
.dropdown-content.chap_0:hover {background-color: #bbb2a4;}

.dropdown-content.chap_1 { background-color: #fcc11b;}
.dropdown-content.chap_1 a { color: #323e48;}
.dropdown-content.chap_1:hover {background-color: #ffe6b3;}

.dropdown-content.chap_2 { background-color: #b0cb4f;}
.dropdown-content.chap_2 a { color: #323e48;}
.dropdown-content.chap_2:hover {background-color: #dfeab9;}

.dropdown-content.chap_3 { background-color: #a269a4;}
.dropdown-content.chap_3 a { color: #323e48;}
.dropdown-content.chap_3:hover {background-color: #dac3db;}

.dropdown-content.chap_4 { background-color: #49babe;}
.dropdown-content.chap_4 a { color: #323e48;}
.dropdown-content.chap_4:hover {background-color: #b6e3e5;}


        /*
        Sous-menu
        */


        .dropdown-content-mini {
            display: none;
            position: absolute;
            min-width: 160px;
            box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
            z-index: -1;
            left:30px;
            margin-top: -25px;
            color:white;
            height:25px;
            padding-right: 30px;
            border-radius: 0px 100px 100px 0px;
        }
          
        .dropdown-content-mini table {
            height : 100%;
        }
        
        .dropdown-content-mini a {
          
            text-decoration: none;
            display: inline-block;
            color:white;
            max-width: fit-content;
            padding-left: 30px;
            overflow: hidden;
            white-space: nowrap;
            font-size: large;
        }
          
        
        .dropdown-content-mini:hover {background-color: #ddd;}
          
        .dropdown:hover .dropdown-content-mini {display: block;}
        
        .dropdown-content-mini.chap_0 { background-color: #f5eee0;}
        .dropdown-content-mini.chap_0 a { color: #323e48;}
        .dropdown-content-mini.chap_0:hover {background-color: #bbb2a4;}

        .dropdown-content-mini.chap_1 { background-color: #fcc11b;}
        .dropdown-content-mini.chap_1 a { color: #323e48;}
        .dropdown-content-mini.chap_1:hover {background-color: #ffe6b3;}
        
        .dropdown-content-mini.chap_2 { background-color: #b0cb4f;}
        .dropdown-content-mini.chap_2 a { color: #323e48;}
        .dropdown-content-mini.chap_2:hover {background-color: #dfeab9;}

        .dropdown-content-mini.chap_3 { background-color: #a269a4;}
        .dropdown-content-mini.chap_3 a { color: #323e48;}
        .dropdown-content-mini.chap_3:hover {background-color: #dac3db;}

        .dropdown-content-mini.chap_4 { background-color: #49babe;}
        .dropdown-content-mini.chap_4 a { color: #323e48;}
        .dropdown-content-mini.chap_4:hover {background-color: #b6e3e5;}





.menu_accueil, .menu_fragilite, .menu_pratique, .menu_action {
    color: black;
    display: grid;
}

.menu_accueil:hover {color: #39a493;}

.menu_fragilite:hover {color: #c13b8eff;}

.menu_pratique:hover {color: #307db8ff;}

.menu_action:hover {color: #e94c60ff;}

#image_temoignage_1{
    align-self: first baseline !important;
    margin-top: 50px;
}

body {
    overscroll-behavior: none;
}

.container-comm {
    overscroll-behavior: none;
    display: flex;
    flex-wrap: nowrap;
    margin-top: 24px;
    margin-bottom: 24px;
}

.com-2{
    z-index: 1;
    background-color: #f9ebf4;
}





#map { height: 800px; }


.graph {
    height: 500px;
}

.graph_2 {
    height: 800px;
}



b{
    font-weight: 600;
}

.encart1.chap1{
    background-color: #fcc11b;
    border: #ffffff solid 40px;
    color:#323e48;
}
.encart2.chap1{
    background-color: #ffe6b3;
    border: #ffffff solid 40px;
    color:#323e48;
}

.encart_chap1 p{
    margin: 0;
    padding: 0!important;
}

.encart_chap1_h1 {
    font-family:  "Roboto";
    font-size: 30pt;
    font-weight: 600;
    color: #fcc11b;
}

.encart_chap1_h2 {
    font-family:  "Roboto";
    font-size: 30pt;
    font-weight: 400;
    color: #fcc11b;
}

.encart_chap1_h3 {
    font-family: "Roboto";
    font-size: 18pt;
    font-weight: 300;
}


.encart1.chap2{
    background-color: #b0cb4f;
    border: #ffffff solid 40px;
    color:#323e48;
}
.encart2.chap2{
    background-color: #dfeab9;
    border: #ffffff solid 40px;
    color:#323e48;
}

.encart_chap2 p{
    margin: 0;
    padding: 0!important;
}

.encart_chap2_h1 {
    font-family:  "Roboto";
    font-size: 30pt;
    font-weight: 600;
    color: #b0cb4f;
}

.encart_chap2_h2 {
    font-family:  "Roboto";
    font-size: 30pt;
    font-weight: 400;
    color: #b0cb4f;
}

.encart_chap2_h3 {
    font-family: "Roboto";
    font-size: 18pt;
    font-weight: 300;
}

@media screen and (min-width: 1080px) {
    .panel-comm{
        width: 56%;
        padding-right: 10%;
        margin-top: 8%;
    }
}   


@media screen and (min-width: 480px) {
    .panel-comm{
        width: 56%;
        padding-right: 10%;
        margin-top: 6%;
    }
}


.col {
    display: flex;
    justify-content: center;
    align-items: center;
}


.etiquette_msd {
    color: #ffffff;   
    background-color: #323e48;
    padding: 4px 8px;    
    border-radius: 4px;   
    border: 1px solid #323e48; 
    white-space: nowrap;    
    text-align: center;   
    font-family: "Roboto"; 
}
.nom_com {
    font-size: 10px;
    font-weight: bold;
    color: #323e48;
    padding: 2px 5px;
    text-shadow: 
    -1px -1px 0 #fff,
    1px -1px 0 #fff,
    -1px  1px 0 #fff,   
    1px  1px 0 #fff;
    white-space: nowrap; 
    font-family: "Roboto";
}



.leaflet-control {
    background-color: #ffffff;
    padding: 10px;
    white-space: nowrap;
}


.graph{
    padding : 0 !important;
}

.info.legend {
  font-family: 'Roboto';
  min-width: 230px;
}

.leaflet-bottom.leaflet-control {
  margin-bottom: 10px;
}
.leaflet-right.leaflet-control {
  margin-right: 10px;
}
/*
@media print {
  #header,
  #footer,
  #nav {
    display: none !important;
  }
}
*/