@media screen and (max-width: 768px) {
    .my-main-content {
    height: calc(100% - 70px);
    }
    .my-menu {
    height: 70px;
    }
    .h-100-md {
    height: 100%;
    }

    /* RUBAN GENERAL */
    .logo {
    margin: 0;
    max-height: 6em;
    max-width: 6em;
    }
    .imglogo{
    max-height: 6em;
    max-width: 6em;
    }
    .nav_rs_langue{
        flex-direction:  initial;
    }
    /*Ruban descripteurs*/

    .Typemodal {
    font-size: 0.9em;
    font-style: italic;
    text-align: center; 
    }

    /*Ruban MP*/

    .typeingredient {
    display: none;
    }

    .blocimage {
    max-height: 100%;
    }
    /*footer MP*/
    .textefooter{
    color: #818181;
    font-size: 0.8em;
    }

    /*Page ruban*/ 
    .pagederoulante {
    overflow-x: hidden!important;
    overflow-y: hidden!important;
    }

    .nombres a {
        font-size: 1.8em;
    }
    .nombres p {
        font-size: 1em;
    }
    .nombres {
        margin-bottom: 1em;
    }
    .gifinprogress {
    max-height: 10em;
    }
    .ligneNCAS {
        text-align: center;
    }
    .my-width-max-content-after-md {
    
    }
}

@media screen and (min-width: 768px) {
    .my-width-max-content-after-md {
    width: 40em;
    }
    .wrapper-for-auto-placement-by-column {
    display: grid;
    line-height: 0.5;
    grid-template-rows: repeat(4, 1fr);
    gap: 0em;
    grid-auto-flow: column;
    grid-auto-columns: auto;
    }
}



@media screen and (min-width: 768px) and (max-width: 992px) {
    
    /* RUBAN GENERAL*/
    .logo {
    max-height: 11em;
    max-width: 11em;
    }
    .imglogo {
    margin-top: 2em;
    max-height: 10em;
    max-width: 10em;
    }
    .slogan{
    font-size: 0.8em;
    }
    .boutonruban{
    font-size: 0.7em;
    }
    .naturalsonly{
    font-size: 0.7em;
    }
    /*Ruban descripteurs*/


    .Typemodal {
    font-size: 1em;
    font-style: italic;
    text-align: right; 
    }

    /*Ruban MP*/

    .typeingredient {
    display: none;
    }
    .ligneNCAS {
        text-align: center;
    }
    /* Corps MP */ 
    .scrollbar-inside {
      overflow-y: auto;
      max-height: calc(49vh - 45px);
    }

    

    /*Footer MP*/
    .textefooter{
    color: #818181;
    font-size: 0.9em;
    }

    .nombres a {
        font-size: 1.8em;
    }
    .nombres p {
        font-size: 1em;
    }
    .nombres {
        margin-bottom: 1em;
    }
    .pagederoulante {
    max-height: 31em;
    overflow-y: auto;
    }
    .pagederoulantenew {
    max-height: 31em;
    overflow-y: auto;
    }
    .writinginprogress {
    font-size: 1.2em;
    }
    .gifinprogress {
    max-height: 12em;
    }
}

@media screen and (min-width: 992px) { 
    .my-main-content {
    height: 100%;
    }
    .my-menu {
    height: 100%;
    }
    .h-100-md {
    height: auto;
    }
    /* RUBAN GENERAL*/
    .logo{
    max-height: 12em;
    max-width: 12em;
    }
    .imglogo{
    margin-top: 1em;
    max-height: 100%;
    max-width: 100%;
    }
    .slogan {
    font-size: 0.8em;
    }
    .boutonruban {
    font-size: 0.8em;
    }
    .naturalsonly {
    font-size: 0.8em;
    }
    /*Ruban descripteurs*/

    .Typemodal {
    font-size: 1em;
    font-style: italic;
    text-align: right; 
    }

    .textefooter{
    color: #818181;
    font-size: 0.9em;
    }

    .imgmapMP {
    max-width:100%;
    height: auto;
    }

    /*Page ruban*/ 
    .pagederoulantenew {
    max-height: 25em;
    overflow-y: auto;
    }
    .pagederoulante {
    max-height: 32em;
    overflow-y: auto;
    }

    .nombres a {
    font-size: 2.8em;
    }
    .nombres p {
    font-size: 1.8em;
    }

    .block-presentation-partner {
    font-size: 0.9em;
    text-align: justify;
    }
    .block-presentation-ingredient {
    max-height: 18em;
    font-size: 1em;
    text-align: justify;
    }

    .block-presentation-ingredient tbody {
     overflow-y: auto;
    }

    .gifinprogress {
    max-height: 15em;
    }
    /*
    #dropdown-map {
    left: -50%;
    }*/
}

@media screen and (min-width: 1281px) { 
    .pagederoulantenew {
    max-height: 50em;
    overflow-y: auto;
    }
    .pagederoulante {
    max-height: 54em;
    overflow-y: auto;
    }
}

/* BARRE DE RECHERCHE */
/* .texterecherche::placeholder {
    font-size: 0.8em;
}
.lignerecherche {
    line-height: 1.3;
}
.lignerecherche:hover {
    background-color: #FAE8BE;
    line-height: 1.35;
}
.text-highlighted {
    color : #D64E26;
    font-weight: 600;
}
.nom_de_l_ingredient {
    text-transform: uppercase;
    font-size: 85%;
    color: black;
    font-weight: 500;
}
.synonymes {
    font-size: 75%;
    color: grey;
    white-space: nowrap;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    font-style: italic;
}
.numero_cas {
    font-size: 70%;
    color: black;
}
#barrederesultat {
    max-height: 18em;
    overflow-x: auto;
    border-bottom-left-radius: 0.75em;
}
.disabledSearchItem * {
    color: grey !important;
} */

/* TABLEAUX IFRA */
table {
    line-height: 0.9;
    border:  #F5B7A4!important;
}
.table>thead  {
    background-color: #FBE5D6FF !important;
    font-weight: bold !important;
    font-size: 1em;
}
.table>tbody {
    font-size: 0.9em;
}


.h2 {
    font-weight: 300;
}
dd b {
    font-weight: 600;
}

/* TABLEAUX DERIVES */
.div_table_derives {
    /*display: none;*/
    width: auto;
    max-height: auto;
    background-color: white;
}
.popover {width: auto!important; max-width: 99999999px; border: 1px solid #B34CDF;}
.table_derives {border-collapse: collapse; overflow-y:auto; max-height: 15em;white-space: nowrap; border-color:#FBE5D6FF!important;}
table.table_derives thead {font-size: 0.9em ; border-color:#FBE5D6FF!important; border-bottom-color:#FBE5D6FF!important ;}
table.table_derives tbody {font-size: 0.7em!important;border-color:#FBE5D6FF!important;}
table.table_derives th {font-weight: normal!important;}
.liensortant {color: cadetblue;}
/* FIN TABLEAUX DERIVES */

.bi-question-circle {
    color: black;
    cursor: help;
}


.lieninterne {
    color: cadetblue;
}
.interpop {
    color: #6584B4;
    text-decoration: none!important;
}
.interpop:hover {
    color: #163360;
    cursor: help;
}

.titrefooter {
    color: #818181;
    font-weight: bold;
    font-size: 0.9em;
}



/* RUBAN GENERAL */
#logoh1 {
font-size: 1em!important;
}

.listederoulantemaps{
    font-size: 0.8em;
    border-radius: 0.25em;
    border: 1px solid #ced4da;
    color: grey;
}

.selectmap {
    text-transform: uppercase;
    font-weight: bold;
    color: blue;
    font-size: 0.9em;
}
.NCasweek{
    color: black;
    font-weight: normal;
    font-size: 0.8em;
}
.naturalsonly {
    color: #D64E26 ;
    font-weight: bold !important;
}
.iconeRS{
    color: black;
}
.iconeRS:hover , .imglogo:hover , .imglang:hover{
    transform: scale(1.1);
    cursor:pointer;
}

.imglang {
    max-height: 0.9em;
    max-width: 1.8em; 
    border-radius: 0.2em;
}

.form-switch{
    margin-top: 0.5em;
}

.scrollbar-inside {
  overflow-y: auto;
  max-height: calc(53vh - 45px);
}

.form-check-input:checked {
    background-color: Green;
    border-color: green;
}

.copyright {
color: #D64E26;
font-size: 0.6em !important;
}

/* Navbar */
.navMP {
    font-weight: bold;
    color: #818181;
    font-size: 0.9em;
}
.nav-link:hover{
    color: black !important;
    cursor: pointer;
}

/* PAGES RUBAN */
.titre {
    color:#D64E26;
    font-size: 1.2em;
    font-weight: 600;
}

.Sous-Titre{
    font-size: 0.8em;
    font-weight: normal;
}
.sources {
    border: 1px solid #D64E26;
    box-shadow: 1.5px 1.5px 22px 0px rgb(251 229 214);
}
.sources h3 {
    color: #D64E26;
    font-size: 1.2em;
}
.sources li {
    font-size: 0.8em;
}
.pagederoulante a {
    text-decoration: none;
    color: cadetblue;
}
.pagederoulantenew a {
    text-decoration: none;
    color: cadetblue;
}

/* CONTACT */
.mail , .mail2 {font-size: 0.9em;}
.mail ul {font-size: 1em;}

/* LEGAL */
.Titre1 {font-size: 1em;}
.Titre2 {font-size: 0.9em;}
.Soustitre1{font-size: 1em; font-weight: 500;}
.infogénérales {line-height: 1.3;font-size: 0.8em;}
.paragraphelegal {font-size: 0.8em;}
.miniliste {font-size: 0.8em;margin-top: 0;}
.miniliste2 {font-size: 0.8em;text-decoration: underline;}


/* PARTNER */
.typepartner {
    color: #D64E26;
    font-size: 1.1em !important;
}

.profession {
    font-style: italic;
}
.nouveausupporter {
    color: #D64E26;
}
.listecontributeurs li {
    font-size: 0.7em;
}
.listecontributeurs ul {

}
.logostandards {
    border: 1px solid #FBE5D6FF;
    box-shadow: 2px 2px 22px 0px rgb(251 229 214);
}
.logostandards:hover{
    transform: scale(1.1);
    cursor:pointer;
}

/*discover */
.textepresentation p {
    font-size: 0.8em;
}
.textepresentation b {
    font-weight: 600;
}
.nombres a {
    color: #D64E26;
    font-weight: bold;
}
.nombres p {
    font-weight: 600;
    text-transform: uppercase;
}


/* ingredientslist */

/* carte liste*/
.categoriescartes {
    line-height: 0.5;
    font-weight: bold;
    color: #D64E26;
    text-align: center;
}


/* pages sponsors */
.blockcontactentreprise h2 {
    font-size: 0.8em;
    font-weight: normal;
}
.nomsociété {
    font-size: 1.5em;
    color: #D64E26;
}
.listMPsociété {
  overflow-y: auto;
  max-height: 80%;
}
#nav-general-presentation p {
    font-size: 0.9em;
    text-align: justify;
}
.zonebouton {
    margin: auto;
}

.logopagesponsors {
    max-height: 10em;
    max-width: auto;
}


/* WRITING IN PROGRESS*/
.writinginprogress {
    font-size: 1.5em;
}
.gifinprogress {
    text-align: center;
}

/* NOUVEAUTES */

/* positionnement général*/
.timeline{ position: relative; margin: 0px auto; width:100%;}

/* gestion des blocks généraux*/
.ajoutMP{color:black; font-size: 1em; font-weight: 500;}
.DateAjout{ color:#D64E26; font-size:1.2em; font-weight: 500;}
.timeline a {font-size: 1em;}
.blocnouveaute {font-size: 0.8em;}
.blocnouveaute h2 {color: #D64E26;font-size: 1.2em;font-weight: bold;}
/* intégration de la ligne verticale */
.timeline:before{ content: ''; position:absolute; left:50%; width:1%; height:100%; background-color:#D64E26;}
/*Suppression du bullet point et sizing du bloc */
.timeline ul li{ list-style: none; position:relative; width:49%;}
/*for every odd numbered bullet point, align to the left OK*/
.timeline ul li:nth-child(odd){ text-align:right; float:left; clear:both; right: 3%; width: 50%;}
/* for every even numbered bullet point, align to the right OK*/
.timeline ul li:nth-child(even){ text-align:left; float:right; clear:both; width: 50%;}
/*create circle icon on the timeline from the left (odd) OK */
.timeline ul li:before { content:''; position:absolute; width:30px; height:30px; background-color:#F7B88E; border-radius:60%; box-shadow: 0 0 0 5px rgba(251, 229, 214); z-index:1}
/*position the circle icons on the timeline OK*/
.timeline ul li:nth-child(odd):before{}
.timeline ul li:nth-child(even):before{ left: -1.8em;}

/*styling the numbering. OK */
.timeline ul li:before{ font-weight:bold; font-size:0.9em; color:white; text-align:center; padding-top:0.7%;}
/*décalage des titres pour laisser la place aux bullets */
.timeline ul li:nth-child(odd) h2 {padding-right: 5%;}
.timeline ul li:nth-child(even) h2 {padding-left: 5%;}
.card_new_partner {float: right; max-width: 20em; text-align: center; display: flex; justify-content: center;flex-direction: row-reverse; flex-wrap: wrap; align-content: stretch;}
    align-items: center;}
.card_new_partner h5 {font-size: 1em;}
.card_new_partner p {font-size: 0.8em;}


@media screen and (max-width: 768px) {
    .timeline:before{left:2.5%!important;}
    /*for every odd numbered bullet point, align to the left OK*/
    .timeline ul li:nth-child(odd){ text-align:left; float:right; clear:both; left:0%; width: 100%;}
    /* for every even numbered bullet point, align to the right OK*/
    .timeline ul li:nth-child(even){ text-align:left; float:right; clear:both; width: 100%;}
    /*position the circle icons on the timeline */
    .timeline ul li:nth-child(even):before{ left: -1.0em;}
    .timeline ul li:nth-child(odd):before{left: -4.5%;}
    /*décalage des titres pour laisser la place aux bullets */
    .timeline ul li:nth-child(odd) h2 {padding-left: 2%!important;}
    .timeline ul li:nth-child(even) h2 {padding-left: 3%!important;}
    .card_new_partner {float: left;} 
    .card_new_partner h5 {font-size: 0.9em;}
.card_new_partner p {font-size: 0.7em;}
    
}
@media screen and (min-width: 768px) and (max-width: 992px) {
    .ajoutMP{font-size: 0.9em;}
    .DateAjout{font-size:1.1em;}
    .timeline a {font-size: 0.9em;}
    .blocnouveaute {font-size: 0.7em;}
    .blocnouveaute h2 {font-size: 1.1em;}
    .timeline ul li:nth-child(odd){right: 5%;}
    /*position the circle icons on the timeline OK*/
    .timeline ul li:nth-child(even):before{left: -1.9em;}
    .timeline ul li:nth-child(odd):before{right: -11%;}
}


.navbar-toggler-icon {
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}

/*
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button {
   -webkit-appearance: none;
}*/

/* COULEUR MULTIMAP */

/* Pour les map ScenTree */ 
.ruban, .ruban_for_map_number_4 {background-color: #FBE5D6;}
.offcanvas, .offcanvas_for_map_number_4 {background-color: #FBE5D6;}
.boutonruban, .boutonruban_for_map_number_4 {color: #D64E26 ; font-weight: 500 !important;}


/* Pour Naturels ScenTree */ 
.ruban_for_map_number_2 {background-color: #A0CE9E;}
.offcanvas_for_map_number_2 {background-color: #A0CE9E;}
.boutonruban_for_map_number_2 {color: #478844 ; font-weight: 500 !important;}
.copyright_for_map_number_2 {color: #478844; font-weight: 500 !important;}

/* Pour Synthétiques ScenTree */ 
.ruban_for_map_number_3 {background-color: #9BD3F3;}
.offcanvas_for_map_number_3 {background-color: #9BD3F3;}
.boutonruban_for_map_number_3 {color: #1888C9; font-weight: 500 !important;}
.copyright_for_map_number_3 {color: #1888C9; font-weight: 500 !important;}


/* Pour les map partenaires */ 
.ruban_for_map_number_5, .ruban_for_map_number_6, .ruban_for_map_number_7,.ruban_for_map_number_8,.ruban_for_map_number_9
{background-color: #C7D6D5;}
.offcanvas_for_map_number_5, .offcanvas_for_map_number_6, .offcanvas_for_map_number_7, .offcanvas_for_map_number_8, .offcanvas_for_map_number_9
{background-color: #C7D6D5;}
.boutonruban_for_map_number_5, .boutonruban_for_map_number_6, .boutonruban_for_map_number_7, .boutonruban_for_map_number_8, .boutonruban_for_map_number_9
{color: #6D7275 !important;}
.copyright_for_map_number_5, .copyright_for_map_number_6, .copyright_for_map_number_7, .copyright_for_map_number_8, .copyright_for_map_number_9
{color: #6D7275 !important;}

img.img-fluid.logoothermaps {
    max-width: 200%!important;
    max-height: 200%!important;
}
.lignerecherchemaps {
    line-height: 1.1;
}
.lignerecherchemaps:hover {
    background-color: #FAE8BE;
    line-height: 1.15;
}
.imglogoothersmaps {
max-height: 6em;
max-width: 6em;
}



/* https://mdbootstrap.com/docs/standard/extended/dropdown-hover/ */
/* .dropdownmap:hover>.dropdown-menu {
  display: block;
} */

.dropdownmap>.my-dropdown-toggle:active {
  /*Without this, clicking will make it sticky*/
    pointer-events: none;
}

/* .dropdown-map {
    font-size:0.8em; max-height: 25em;
} */

/*.bootstrap-table .fixed-table-toolbar .columns-right {display: none!important;}*/

.fixed-table-container {overflow-y: auto; height: 50vh; white-space: nowrap;}
.table_MP_entreprise {font-size: 0.8em; width: 100%;}
.fixed-table-container thead th {position: sticky;top: 0px; background-color: #FBE5D6FF !important; border: 1px solid #ccc; font-weight: bold;}

@media screen and (max-width: 992px) {
.imgpartenaires {max-width: 30%;}
}

@media screen and (min-width: 993px) {
.imgpartenaires {max-width: 90%;}
}


/* NOUVEAU STYLE DES FONTS*/
@media screen and (max-width: 768px) {
    .NomDescripteurs {text-align: center; font-size:2em; font-weight:bold; line-height:1; padding: 0.3em;}
    .textedescripteurs {text-align: justify; font-size:1em; font-weight:normal; line-height:1; margin-top:1.5em;}
    .creditsphoto {color: grey; font-size: 0.7em;}
    .NomMP {font-size: 1.25em; font-weight: bold; text-align: center; margin:0;}
    .ligneinfo {text-align: justify; font-weight: normal;}
    .titrecatégorie{font-size: 0.7em;}
    .texteinfo {font-size: 0.5em;}
}
@media screen and (min-width: 768px) and (max-width: 992px) {
    .NomDescripteurs {text-align:center; font-size:2em; font-weight:bold; line-height:1; padding: 0.3em;}
    .textedescripteurs {text-align: justify; font-size:1em; font-weight:normal; line-height:1;margin-top:1.5em;}
    .creditsphoto {color: grey; font-size: 0.7em;}
    .NomMP {font-size: 1.25em; font-weight: bold; text-align: center; margin:0;}
    .ligneinfo { text-align: justify; font-weight: normal;}
    .titrecatégorie{ font-size: 0.7em;}
    .texteinfo {font-size: 0.5em;}
}
@media screen and (min-width: 993px) and (max-width: 1281px) {
    .NomDescripteurs {text-align:center; font-size:2em; font-weight:bold; line-height:1; padding: 0.3em;}
    .textedescripteurs {text-align: justify; font-size:1em; font-weight:normal; line-height:1;margin-top:1.5em;}
    .creditsphoto {color: grey; font-size: 0.7em;}
    .NomMP {font-size: 1.25em; font-weight: bold; text-align: center; margin:0;}
    .ligneinfo {text-align: justify; line-height: 0.8; font-weight: normal;}
    .titrecatégorie{ font-size: 0.7em;}
    .texteinfo {font-size: 0.5em;}
}
@media screen and (min-width: 1281px) {
    .NomDescripteurs {text-align:center; font-size:2em; font-weight:bold; line-height:1; padding: 0.3em;}
    .textedescripteurs {text-align: justify; font-size:1em; font-weight:normal; line-height:1;margin-top:1.5em;}
    .creditsphoto {color: grey; font-size: 0.9em;}
    .NomMP {font-size: 1.5em; font-weight: bold; text-align: center; margin:0;}
    .ligneinfo {text-align: justify; line-height: 0.7; font-weight: normal;}
    .titrecatégorie{ font-size: 0.4em;}
    .texteinfo {font-size: 0.4em;}
}

/* NOUVEAU STYLE DES IMAGES*/
@media screen and (max-width: 768px) {
    .imgMP {max-width:50%; height:auto;}
    .imgMPsynth {max-width:40%!important; height: 30%!important;}
    .imgdescripteurs {max-width:80%; height:auto; margin: 1em;}
    .imgsponsor {max-height: 4em; max-width: 4em; border: 1px solid #FBE5D6FF; box-shadow: 2px 2px 22px 0px rgb(251 229 214);}
    .imgsponsor:hover{transform: scale(1); cursor:pointer;}
}
@media screen and (min-width: 768px) and (max-width: 992px) {
    .imgMP {max-width:50%; height:auto;}
    .imgMPsynth {max-width:40%!important; height: 30%!important;}
    .imgdescripteurs {max-width:80%; height:auto; margin: 1em;}
    .imgsponsor {max-height: 4em; max-width: 4em; border: 1px solid #FBE5D6FF; box-shadow: 2px 2px 22px 0px rgb(251 229 214);}
    .imgsponsor:hover{transform: scale(1.1); cursor:pointer;}
}
@media screen and (min-width: 993px) and (max-width: 1281px) {
    .imgMP {max-width:60%; height:auto;}
    .imgMPsynth {max-width:auto; height: 60%;}
    .imgdescripteurs {max-width:80%; height:auto; margin: 1em;}
    .imgsponsor {max-height: 4em; max-width: 4em; border: 1px solid #FBE5D6FF; box-shadow: 2px 2px 22px 0px rgb(251 229 214);}
    .imgsponsor:hover{transform: scale(1.1); cursor:pointer;}
}
@media screen and (min-width: 1281px) {
    .imgMP {max-width:60%; height:auto;}
    .imgMPsynth {max-width:auto; height: 60%;}
    .imgdescripteurs {max-width:80%; height:auto; margin: 1em;}
    .imgsponsor {max-height: 4em; max-width: 4em; border: 1px solid #FBE5D6FF; box-shadow: 2px 2px 22px 0px rgb(251 229 214);}
    .imgsponsor:hover{transform: scale(1.1); cursor:pointer;}
}

.leaflet-popup-close-button {display: none;}
.leaflet-popup-tip-container {display: none;}