/**
 * @file
 * RGR menu deroulant . 
 */


/*  mobile   */

    @media only screen and (min-width : 320px){
        /* body::before {
            content: "media query (min-width : 320px)trouvé";
            font-weight: bold;
            display: block;
            text-align: center;
            background: rgba(255, 255, 0, 0.9); 
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            z-index: 99;
          } */
    .showNav0>ul.niveau1V {
        display: block !important;
    }
    .showNav1>ul.niveau2V {
        display: block !important;
    }
    .showNav2>ul.niveau3V {
        display: block !important;
    }
    
    a.niveau1V {
        width: 120px;
        text-align: right;
    }
    a.niveau2V {
        width: 120px;
        text-align: right;
    }
    a.niveau3V {
        width: 120px;
        text-align: left;
    }
    
    #toolbar {
        background-color: rgba(0, 0, 0, 0);
        left: 0;
        position: fixed;
        top: 0;
        z-index: 999;
    }
   
    nav.menuAff {
        display: block;
        /* !important;*/
        margin-left: -20px;
        /* !important;*/
        text-align: center;
        top: 50px;
        z-index: 500;
       
    }
    /* 
    .icon-hamburger {
        display: inline-block;
        height: 4px;
        margin-top: 10px;
        position: relative;
        transition: all 0.2s ease 0s;
        -webkit-transition: all 0.2s ease 0s;
        -o-transition: all 0.2s ease 0s;
       
        -ms-transition: all 0.2s ease 0s;
        width: 40px;
    }
    ul.icon-hamburger {
        list-style: none;
        width: 40px;
        height: 40px;
    }
    
    span.icon-hamburger {
        background: rgb(16, 2, 173) none repeat scroll 0 0;
        content: "";
        height: 4px;
        top: 0px;
        position: absolute;
        transition: all 0.2s ease 0s;
        -webkit-transition: all 0.2s ease 0s;
        -o-transition: all 0.2s ease 0s;
        
        -ms-transition: all 0.2s ease 0s;
        width: 40px;
        border-style: solid;
        border-width: 1px;
        border-color: black;
   
    }
     
    span.icon-hamburger::before {
        background: white none repeat scroll 0 0;
        content: "";
        height: 4px;
        position: absolute;
        top: -8px;
        transition: all 0.2s ease 0s;
        -webkit-transition: all 0.2s ease 0s;
        -o-transition: all 0.2s ease 0s;
       
        -ms-transition: all 0.2s ease 0s;
        width: 40px;
        border-style: solid;
        border-width: 1px;
        border-color: black;
    }
      
    span.icon-hamburger::after {
        background: white none repeat scroll 0 0;
        content: "";
        height: 4px;
        position: absolute;
        top: 8px;
        transition: all 0.2s ease 0s;
        -webkit-transition: all 0.2s ease 0s;
        -o-transition: all 0.2s ease 0s;
        
        -ms-transition: all 0.2s ease 0s;
        width: 40px;
        border-style: solid;
        border-width: 1px;
        border-color: black;
    }
    .button-menu>.menuAff::after {
        top: 0px;
        transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        
        -ms-transform: rotate(-45deg);
    }
    .button-menu>.menuAff::before {
        top: 0px;
        transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
        -o-transform: rotate(45deg);
       
        -ms-transform: rotate(45deg);
    } 
    */
/* ------------------------------------- */
.icon-hamburger {
    display: inline-block;
    height: 7px;
    margin-top: 21px;
    position: relative;
    transition: all 0.2s ease 0s;
    -webkit-transition: all 0.2s ease 0s;
    -o-transition: all 0.2s ease 0s;
    /* -moz-transition: all 0.2s ease 0s; */
    -ms-transition: all 0.2s ease 0s;
    width: 49px;
    
}
ul.icon-hamburger {
    list-style: none;
    width: 49px;
    height: 49px;
}
span.icon-hamburger {
    /* background: #076906 none repeat scroll 0 0; */
    background: rgb(255, 255, 255);
    content: "";
    height: 9px;
    top: 0px;
    position: absolute;
    transition: all 0.2s ease 0s;
    -webkit-transition: all 0.2s ease 0s;
    -o-transition: all 0.2s ease 0s;
    /* -moz-transition: all 0.2s ease 0s; */
    -ms-transition: all 0.2s ease 0s;
    width: 51px;
    border-style: solid;
    border-width: 1px;
    border-color: black;

}
span.icon-hamburger::before {
    /* background: #076906 none repeat scroll 0 0; */
    background: #ffffff;
    content: "";
    height: 7px;
    position: absolute;
    top: -16px;
    transition: all 0.2s ease 0s;
    -webkit-transition: all 0.2s ease 0s;
    -o-transition: all 0.2s ease 0s;
    /* -moz-transition: all 0.2s ease 0s; */
    -ms-transition: all 0.2s ease 0s;
    width: 49px;
    border-style: solid;
    border-width: 1px;
    border-color: black;

}
span.icon-hamburger::after {
    /* background: #076906 none repeat scroll 0 0; */
    background: #ffffff;
    content: "";
    height: 7px;
    position: absolute;
    top: 16px;
    transition: all 0.2s ease 0s;
    -webkit-transition: all 0.2s ease 0s;
    -o-transition: all 0.2s ease 0s;
    /* -moz-transition: all 0.2s ease 0s; */
    -ms-transition: all 0.2s ease 0s;
    width: 49px;
    border-style: solid;
    border-width: 1px;
    border-color: black;

}
span.icon-hamburger.menuAff {
    top: 0px;
    left: 14px;
    height: 8px;
    /* background-color: #690606; */
    background-color: #ffffff;
    width: 55px;
    border-style: solid;
    border-width: 1px;
    border-color: black;
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    /* -moz-transform: rotate(0deg); */
    -ms-transform: rotate(0deg);
}
.button-menu>.menuAff::after {
    /*0 et -21 de .button-menu>.menuAff */
    top: 0px;
    left: -7px;
    height: 7px;
    background-color: #ffffff;
    width: 63px;
    border-style: solid;
    border-width: 1px;
    border-color: black;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    /* -moz-transform: rotate(-45deg); */
    -ms-transform: rotate(-45deg);
}
.button-menu>.menuAff::before {
    /*0 et -21 de .button-menu>.menuAff */
    top: 0px;
    left: -7px;
    background-color: #ffffff;
    width: 63px;
    height: 7px;
    border-style: solid;
    border-width: 1px;
    border-color: black;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    /* -moz-transform: rotate(45deg); */
    -ms-transform: rotate(45deg);
}
.button-menu {
    background-color: #00000000;
    height: 49px;
    width: 49px;
}
.button-menu>.menuAff {
    background-color: #00000000;
    height: 49px;
    top: -21px;
}





    /* ------------------------------- */
    a.niveau1V,
    a.niveau2V,
    a.niveau3V,
    ul.niveau1V,
    ul.niveau2V,
    ul.niveau3V,
    li.niveau1V,
    li.niveau2V,
    li.niveau3V,
    nav.niveau1V {
        box-sizing: border-box;
    }
    nav.niveau1V {
        z-index: 999;
    }
    ul.niveau0V {
        max-width: 240px;
        /* à adapter*/
        display: -webkit-flex;
        display: flex;
        -webkit-flex-direction: column;
        flex-direction: column;
        /* MENU VERTICAL */
        -webkit-justify-content: center;
        justify-content: center;
        margin: 0;
        list-style: none;
         width: 120px; 
        /* float: right; */
    }
}


/* bouton dans message display */


/*equivalent niveau3V */


/*version PC et tablette */

@media only screen and (min-device-width: 768px) {
   /*  body::before {
        content: "media query (min-width : 768px) trouvé";
        font-weight: bold;
        display: block;
        text-align: center;
        background: rgba(255, 255, 0, 0.9); 
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        z-index: 99;
      } */
    nav.menuAff {
        display: block;
        /* !important;*/
        margin-left: -20px;
        /* !important;*/
        text-align: center;
        top: 50px;
        z-index: 500;
        background: blue;
    }
    .icon-hamburger {
        display: inline-block;
        height: 7px;
        margin-top: 21px;
        position: relative;
        transition: all 0.2s ease 0s;
        -webkit-transition: all 0.2s ease 0s;
        -o-transition: all 0.2s ease 0s;
        /* -moz-transition: all 0.2s ease 0s; */
        -ms-transition: all 0.2s ease 0s;
        width: 49px;
        
    }
    ul.icon-hamburger {
        list-style: none;
        width: 49px;
        height: 49px;
    }
    span.icon-hamburger {
        /* background: #076906 none repeat scroll 0 0; */
        background: rgb(5, 233, 35);
        content: "";
        height: 9px;
        top: 0px;
        position: absolute;
        transition: all 0.2s ease 0s;
        -webkit-transition: all 0.2s ease 0s;
        -o-transition: all 0.2s ease 0s;
        /* -moz-transition: all 0.2s ease 0s; */
        -ms-transition: all 0.2s ease 0s;
        width: 51px;
        border-style: solid;
        border-width: 1px;
        border-color: black;

    }
    span.icon-hamburger::before {
        /* background: #076906 none repeat scroll 0 0; */
        background: #ffffff;
        content: "";
        height: 7px;
        position: absolute;
        top: -16px;
        transition: all 0.2s ease 0s;
        -webkit-transition: all 0.2s ease 0s;
        -o-transition: all 0.2s ease 0s;
        /* -moz-transition: all 0.2s ease 0s; */
        -ms-transition: all 0.2s ease 0s;
        width: 49px;
        border-style: solid;
        border-width: 1px;
        border-color: black;

    }
    span.icon-hamburger::after {
        /* background: #076906 none repeat scroll 0 0; */
        background: #ffffff;
        content: "";
        height: 7px;
        position: absolute;
        top: 16px;
        transition: all 0.2s ease 0s;
        -webkit-transition: all 0.2s ease 0s;
        -o-transition: all 0.2s ease 0s;
        /* -moz-transition: all 0.2s ease 0s; */
        -ms-transition: all 0.2s ease 0s;
        width: 49px;
        border-style: solid;
        border-width: 1px;
        border-color: black;

    }
    span.icon-hamburger.menuAff {
        top: 0px;
        left: 14px;
        height: 7px;
        /* background-color: #690606; */
        background-color: #ffff00;
        width: 63px;
        border-style: solid;
        border-width: 1px;
        border-color: black;
        transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        /* -moz-transform: rotate(0deg); */
        -ms-transform: rotate(0deg);
    }
    .button-menu>.menuAff::after {
        /*0 et -21 de .button-menu>.menuAff */
        top: 0px;
        left: -7px;
        background-color: #ffffff;
        width: 63px;
        border-style: solid;
        border-width: 1px;
        border-color: black;
        transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        /* -moz-transform: rotate(-45deg); */
        -ms-transform: rotate(-45deg);
    }
    .button-menu>.menuAff::before {
        /*0 et -21 de .button-menu>.menuAff */
        top: 0px;
        left: -7px;
        background-color: #ffffff;
        width: 63px;
        border-style: solid;
        border-width: 1px;
        border-color: black;
        transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        /* -moz-transform: rotate(45deg); */
        -ms-transform: rotate(45deg);
    }
    .button-menu {
        background-color: #00000000;
        height: 49px;
        width: 49px;
    }
    .button-menu>.menuAff {
        background-color: #00000000;
        height: 49px;
        top: -21px;
    }
    .showNav0>ul.niveau1V {
        display: block !important;
    }
    .showDrapeaux>div.n1Drapeaux {
        display: block !important;
        ;
    }
    div.n1Drapeaux {
        display: none;
    }
    /*pour décaler l'ecran de loggin drupal (because menu) et couleurs*/
    form.user-login-form {
        margin-left: 180px !important;
        background-color: #550000 !important;
        color: #ffffff;
        max-width: 50%;
    }
    .user-login-form>div>label {
        color: #31bdeb;
        width: 300px;
        float: left;
    }
    .user-login-form>div>div {
        color: #9f933e;
        margin-left: 120px;
    }
    .user-login-form>div>input {
        margin-left: 120px;
    }
    /* fin rajout menu simili telephone*/
    a.niveauDisplay {
        display: block;
        /* font-size: 0.9em; */
        padding: 0px;
        text-decoration: none;
        /*  font-family: Arial,sans-serif,"Times New Roman", Times, serif; */
        margin: auto;
        box-sizing: border-box;
        width: 250px;
        text-align: center;
        float: left;
    }
    a.niveauDisplay:hover {
        text-decoration: none;
    }
    a.boutonTraduction {
        font-size: 1.2em;
        font-weight: bold;
        padding: 5px;
        text-decoration: none;
        font-family: "Times New Roman", Times, serif;
        z-index: 1;
        margin: 0px;
        color: #ffffff;
        background: #20aa20;
        text-decoration: none;
        border-radius: 15px;
        min-height: 30px;
    }
    /* mis ici pour avoir la meme couleur que sans survol */
    a.boutonTraduction:hover {
        background: #80aa80;
        color: #5a5a5a;
    }

    nav.niveau1V {
        z-index: 999;
    }
    a.niveau1V,
    a.niveau2V,
    a.niveau3V {
        display: block;
        /* font-size: 0.9em; */
        padding: 0px;
        text-decoration: none;
        /*  font-family: Arial,sans-serif,"Times New Roman", Times, serif; */
        margin: 0px;
    }
    a.niveau1V {
        width: 150px;
        text-align: right;
    }
    a.niveau2V {
        width: 160px;
        text-align: right;
    }
    a.niveau3V {
        width: 250px;
        text-align: right;
    }
    ul.niveau0V {
        max-width: 240px;
        /* à adapter*/
        display: -webkit-flex;
        display: flex;
        -webkit-flex-direction: column;
        flex-direction: column;
        /* MENU VERTICAL */
        -webkit-justify-content: center;
        justify-content: center;
        margin: 0;
        list-style: none;
        width: 150px;
        /*  float: right;*/
    }
}



/*version commune PC et mobile */

ul.niveau1V,
ul.niveau2V,
ul.niveau3V {
    /* position: relative; */
    padding: 0 0 0 0;
}

li.niveau1V,
li.niveau2V,
li.niveau3V {
    position: relative;
    padding: 0;
}

ul.niveau1V {
    z-index: 500;
    display: none;
    /* on affiche */
}

ul.niveau2V {
    z-index: 600;
}

ul.niveau3V {
    z-index: 700;
}

ul.niveau2V,
ul.niveau3V {
    position: absolute;
    /* SOUS-MENU sur le coté */
    /*width:100%; */
    top: 0px;
    left: 88%;
    /* à droite  position fleche*/
    display: none;
    /* on masque */
    /* margin-left: 12px; */
}

li.niveau1V:hover>ul.niveau2V {
    display: block;
    /* on affiche */
    padding: 0 0 0 0;
    z-index: 1;
}

li.niveau2V:hover>ul.niveau3V {
    display: block;
    /* on affiche */
    padding: 0 0 0 0;
    z-index: 1;
}

a.niveau1V:hover,
a.niveau2V:hover,
a.niveau3V:hover {
    text-decoration: none;
}

i.plus {
    display: inline-block;
    /* background-position: right 100%;  */
    background: transparent url(../../images/flecheMini.png);
    /*BORDER-BOTTOM: #b0b0b0 3px solid; */
    background-repeat: no-repeat;
    /* z-index: 1;   */
    width: 20px;
    height: 20px;
    /* margin-top: 10px; */
    /* align: center; */
    vertical-align: middle;
}

i.plusVide {
    display: inline-block;
    /* background-position: right 100%;  */
    background: transparent;
    /*BORDER-BOTTOM: #b0b0b0 3px solid; */
    background-repeat: no-repeat;
    /* z-index: 1;   */
    width: 20px;
    height: 20px;
    /* margin-top: 10px; */
    /* align: center; */
    vertical-align: middle;
}