/****************************
*                           *
*           MENU            *
*                           *
****************************/

/* Transition  */
#mairie-menu,
#mairie-menu > .et_pb_row,
#mairie-menu #logo-menu img,
#mairie-menu-icon,
#mairie-menu-icon .blurb-menu-icon {
    transition: all 0.5s ease;
}

@media only screen and (min-width: 981px) {
    /* Hauteur de la ligne */
    #mairie-menu > .et_pb_row {
        height: 100px!important;
    }
    #mairie-menu.reduce > .et_pb_row {
        height: 50px!important;
    }
    /* Largeur des colonnes */
    #mairie-menu > .et_pb_row > .et_pb_column:first-child {
        width: 20%;
    }
    #mairie-menu > .et_pb_row > .et_pb_column:last-child {
        width: 80%;
    }
}
/* Largeur des colonnes */
@media only screen and (max-width: 980px) {
    #mairie-menu > .et_pb_row > .et_pb_column {
        height: 50px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 980px) {
    #mairie-menu > .et_pb_row > .et_pb_column:first-child {
        width: 34%;
    }
    #mairie-menu > .et_pb_row > .et_pb_column:last-child {
        width: 66%;
    }
}
#mairie-menu > .et_pb_row > .et_pb_column {
    display: flex;
    align-items: center;
}

/* ----==== Début Menu ====---- */
/* Bordure */
#mairie-menu .et_pb_menu_inner_container {
    border-left: 1px solid #265d85;
}

/* Hauteur menu */
#mairie-menu .et_pb_menu,
#mairie-menu .et_pb_menu_inner_container,
#mairie-menu .et_pb_menu__wrap {
    height: 100%;
}

/* Marge du menu principal */
#mairie-menu ul#menu-menu-principal {
    margin: 0;
}

/* Centrer le texte verticalement */
#mairie-menu ul#menu-menu-principal > li {
	display: flex;
	align-items: center;
    padding: 0 20px;
    margin: 0;
}
#mairie-menu ul#menu-menu-principal > li:hover {
    background-color: #004170;
}

#mairie-menu ul#menu-menu-principal > li > a {
    text-transform: uppercase;
    padding: 0;
}

/* Icône menu déroulant */
#mairie-menu ul#menu-menu-principal > li.mega-menu > a::after {
	display: none;
}

/* Couleur et taille du texte */
#mairie-menu ul#menu-menu-principal a,
#mairie-menu ul#menu-menu-principal a:hover,
ul.et_mobile_menu a,
ul.et_mobile_menu a:hover {
    opacity: 1;
    background-color: initial;
}

/* ---=== Début Sous-menus ===--- */
#mairie-menu .et_pb_menu__menu li.mega-menu > ul.sub-menu {
	width: 125.1%;
	top: 100px;
	left: -25.1%!important;
    padding: 0;
    border-top: 1px solid #265d85!important;
    display: flex;
}
#mairie-menu.reduce .et_pb_menu__menu li.mega-menu > ul.sub-menu {
	top: 50px;
}

#mairie-menu .et_pb_menu__menu li.mega-menu > ul > li {
    width: 20%;
    padding: 30px!important;
    border-right: 1px dotted #265d85;
}

#mairie-menu .et_pb_menu__menu li.mega-menu > ul > li > a {
    padding: 0;
    width: 100%!important;
    margin-bottom: 10px;
    font-size: 18px!important;
    line-height: 1.15;
    font-weight: 500;
    border-bottom: none;
}

#mairie-menu .et_pb_menu__menu li.mega-menu > ul > li > ul {
    padding-left: 15px;
}

#mairie-menu .et_pb_menu__menu li.mega-menu > ul > li > ul > li > a {
    padding: 0;
    margin-bottom: 8px;
    font-size: 15px!important;
    line-height: 1.15;
    font-weight: 400;
    font-style: italic;
}
#mairie-menu .et_pb_menu__menu li.mega-menu > ul > li > ul,
#mairie-menu .et_pb_menu__menu li.mega-menu > ul > li > ul > li,
#mairie-menu .et_pb_menu__menu li.mega-menu > ul > li > ul > li > a {
    width: 100%!important;
}

#mairie-menu .et_pb_menu__menu li.mega-menu ul.sub-menu > li > a:hover {
    color: #008ef0!important;
}
#mairie-menu .et_pb_menu__menu li.mega-menu > ul.sub-menu > li > ul.sub-menu > li > a:before {
    content: '';
    background-image: linear-gradient(to right, #004170, #008ef0);
    height: 3px;
    position: absolute;
    width: 0;
    top: 50%;
    left: -30px;
    transition: all 0.5s ease;
}
#mairie-menu .et_pb_menu__menu li.mega-menu > ul.sub-menu > li > ul.sub-menu > li > a:hover:before {
    width: 25px;
}
/* ---=== Fin Sous-menus ===--- */

/* ---=== Début Menu mobile ===--- */
/* Changer l'icône hamburger lorsque le menu est ouvert */
#mairie-menu .mobile_nav.opened > span.mobile_menu_bar::before {
    content: '\4d';
}

/* Affichage du menu */
#mairie-menu ul.et_mobile_menu {
    display: block;
    padding: 5% 0;
}

#mairie-menu ul.et_mobile_menu li {
    position: relative;
}
#mairie-menu ul.et_mobile_menu a {
    background-color: initial;
}

#mairie-menu ul.et_mobile_menu,
#mairie-menu ul.et_mobile_menu > li > ul.sub-menu {
    left: 100%;
    position: fixed;
    top: 50px;
    height: calc(100vh - 50px);
    width: 100vw;
    transition: .3s all ease;
}
#mairie-menu .et_mobile_nav_menu ul.opened {
    left: 0!important;
}

#mairie-menu ul.et_mobile_menu > li > a {
    font-weight: 400;
    text-transform: uppercase;
    border-color: #265d85;
    padding: 30px 5%;
}
#mairie-menu .et_mobile_menu > li:first-child > a {
    padding-top: 10px;
}

#mairie-menu ul.et_mobile_menu > li > ul.sub-menu {
    padding-left: 0;
    padding-bottom: 5%;
    z-index: 100;
}
#mairie-menu ul.et_mobile_menu > li > ul.sub-menu.opened {
    overflow-y: scroll;
}

#mairie-menu ul.et_mobile_menu > li > ul.sub-menu > li.backlink-menu {
    padding: 20px 5%;
    border-bottom: 1px solid #265d85;
    color: #fff;
    text-transform: uppercase;
    display: flex;
}
#mairie-menu ul.et_mobile_menu > li > ul.sub-menu > li {
    padding: 15px 10%;
}

#mairie-menu ul.et_mobile_menu > li > ul.sub-menu > li > a {
    padding: 10px 0;
    font-weight: 600;
}

#mairie-menu ul.et_mobile_menu > li > ul.sub-menu > li > ul.sub-menu {
    padding-left: 15px;
}
#mairie-menu ul.et_mobile_menu > li > ul.sub-menu > li > ul.sub-menu > li {
    padding-left: 0;
}

#mairie-menu ul.et_mobile_menu > li > ul.sub-menu > li > ul.sub-menu > li > a {
    padding: 10px 0;
    font-style: italic;
    font-size: 18px!important;
    font-weight: 400;
    line-height: 1em;
}

@media only screen and (max-width: 767px) {
    #mairie-menu ul.et_mobile_menu > li > a {
        padding: 20px 5%;
    }
    #mairie-menu ul.et_mobile_menu > li > ul.sub-menu > li {
        padding: 10px 5%;
    }
    #mairie-menu ul.et_mobile_menu > li > ul.sub-menu > li > ul.sub-menu > li > a {
        font-size: 16px;
    }
}

/* Icônes */
#mairie-menu .et_mobile_menu > li > a:after,
#mairie-menu .et_mobile_menu > li > ul.sub-menu > li.backlink-menu:before {
    font-size: 30px;
    font-family: 'ETmodules';
    color: #fff;
}
#mairie-menu .et_mobile_menu > li > a:after {
    content: '\39';
    position: absolute;
    right: 0;
    margin-right: 5%;
}
#mairie-menu .et_mobile_menu > li > ul.sub-menu > li.backlink-menu:before {
    content: '\38';
    padding-right: 20px;
}
/* ---=== Fin Menu mobile ===--- */
/* ----==== Fin Menu ====---- */

/* ----==== Début Menu Icônes ====---- */
/* Position */
#mairie-menu-icon.reduce {
    top: 50px!important;
}

/* Largeur des colonnes */
#mairie-menu-icon .et_pb_column {
    width: 20%!important;
}

/* Marge des modules */
@media only screen and (min-width: 981px) {
    #mairie-menu-icon .blurb-menu-icon {
        margin: 5px 30px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 980px) {
    #mairie-menu-icon .blurb-menu-icon {
        margin: 3px 18px;
    }
}

/* Centrer le texte verticalement par rapport à l'icône */
#mairie-menu-icon .blurb-menu-icon a {
    display: flex;
    align-items: center;
    height: 44px;
}

/* Taille et marge droite de l'icône */
#mairie-menu-icon .blurb-menu-icon a > i {
    font-size: 30px;
    margin-right: 10px;
}

/* Taille et couleur du texte */
#mairie-menu-icon .blurb-menu-icon a > span {
    color: #004170!important;
    font-size: 14px;
}
#mairie-menu-icon .blurb-menu-icon:hover a > span {
    color: #008ef0!important;
}

@media only screen and (max-width: 767px) {
    #mairie-menu-icon .blurb-menu-icon {
        margin: 0;
    }
    #mairie-menu-icon .blurb-menu-icon a {
        justify-content: center;
    }
    #mairie-menu-icon .blurb-menu-icon a > i {
        font-size: 25px;
        margin-right: 0;
    }
    #mairie-menu-icon .blurb-menu-icon a > span {
        display: none;
    }
}
/* ----==== Début Menu Icônes ====---- */

/* Recherche */
@media only screen and (min-width: 981px) {
    #mairie-menu .et_pb_menu__search-button {
        margin-right: 20px;
        margin-left: auto;
    }
}
#mairie-menu .et_pb_menu__search .et_pb_menu__search-input {
    color: #fff;
    font-size: 16px!important;
    padding-left: 20px;
}
#mairie-menu .et_pb_menu__search .et_pb_menu__search-input::placeholder {
    color: #fff;
    font-style: italic;
}



/****************************
*                           *
*          FOOTER           *
*                           *
****************************/

@media only screen and (max-width: 981px) {
    .et_pb_section_1_tb_footer .et_pb_column:first-child {
        margin-bottom: 10px;
    }
}