#menu_alternative {
    position: absolute;
    top: 0;

    width: 100%;
    z-index: 10;
}

#menu_alternative .c {}

#menu_alternative .c a.logo {
    display: block;
    width: 300px;
    margin: 60px auto 0 auto;
}

#menu_alternative .c a.logo img {
    max-width: 100%;
}

#menu_alternative .c ul.m {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 30px;
}

#menu_alternative .c ul.m li.m {
    margin: 0 18px;
    position: relative;
}

#menu_alternative .c ul.m li.m > a {
    font: 400 14px/18px "Mst Regular";
    color: #FFF;
    text-transform: uppercase;
    text-decoration: none;
    transition: all .4s ease;
}

#menu_alternative .c ul.m li.m > a:before {
    content: '';
    display: block;
    width: 0;
    height: 2px;
    background-color: #FFF;
    position: absolute;
    bottom: -3px;
    left: 50%;
    transform: translateX(-50%);
    transition: all .4s ease;
}

#menu_alternative .c ul.m li.m > a:hover:before {
    width: 90%;
}

#menu_alternative .c ul.m li.m:nth-child(3) > a,
#menu_alternative .c ul.m li.m:nth-child(4) > a {
    border: 2px solid #FFF;
    text-transform: none;
    border-radius: 10px;
    padding: 4px 15px;
}

#menu_alternative .c ul.m li.m:nth-child(3) > a:before,
#menu_alternative .c ul.m li.m:nth-child(4) > a:before {
    content: none;
}

#menu_alternative .c ul.m li.m:nth-child(4) > a {
    background-color: #FFF;
    color: #8CC63F;
}

#menu_alternative .c ul.m li.m:nth-child(3) > a:hover {
    border-color: #006633;
    color: #006633;
    background-color: #FFF;
}

#menu_alternative .c ul.m li.m:nth-child(4) > a:hover {
    background-color: #8CC63F;
    border-color: #8CC63F;
    color: #FFF;
}

#menu_alternative .c ul.m li.m ul.sm {
    position: absolute;
    top: 30px;
    left: 50%;
    background: #FFFFFF;
    text-align: center;
    box-shadow: 0px 10px 32px 0px rgb(0 0 0 / 40%);
    transform: translateX(-50%) scale(0.5);
    transform-origin: top;
    opacity: 0;
    visibility: hidden;
    transition: visibility 0s ease .6s, opacity .4s ease .2s, transform .4s ease .2s;
}

#menu_alternative .c ul.m li.m a:hover ~ ul.sm,
#menu_alternative .c ul.m li.m ul.sm:hover {
    transform: translateX(-50%) scale(1);
    opacity: 1;
    visibility: visible;
    transition: visibility 0s ease, opacity .4s ease, transform .4s ease;
}

#menu_alternative .c ul.m li.m ul.sm li.sm {
    float: none;
    width: 150px;
    border-top: 1px solid #CCCCCC;
    height: 40px;
    line-height: 40px;
    font-family: "Mst Light";
    font-size: 12px;
}

#menu_alternative .c ul.m li.m ul.sm li.sm a {
    display: block;
    color: #8CC63F;
    text-decoration: none;
    transition: all .4s ease;
}

#menu_alternative .c ul.m li.m ul.sm li.sm a:hover {
    cursor: pointer;
    text-decoration: none;
    color: #FFF;
    background-color: #006633;
}

.logo-mobile {
    display: none;
}

#menu ul li.m a.m {
    font: 400 14px/18px "Mst Regular";
    text-transform: uppercase;
}


#header .blocklangs:hover .langs {
    display: block;
}

#header #boxAccount {
    float: left;
    padding: 0 15px;
}

#menu {
    -webkit-transition: all 0.3s;
    transition: all 0.3s;

    /*background-image: url(../../../templates_main/frontend/images/header.png);*/
    background-color: #FFF;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0);
    color: black;
    /*height:130px;*/
    position: fixed;
    width: 100%;
    z-index: 501;
    top: 0;

    transform: translateY(0);
}

#menu_alternative.active ~ #menu {
    transform: translateY(-100%);
}

#menu.little {
    /*top: -50px;*/
    background-color: rgba(255, 255, 255, 0.9);
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
}

#menu.load {
    top: -130px;
}

body #menu .c {
    /*margin: 0px auto;*/
    /*max-width: 1275px;*/
    margin: 0 50px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}


body #menu .c .logo img {
    height: 60px;
    transition: all .4s ease;
}

body #menu.little .c .logo img {
    height: 40px;
}

body #menu .c ul.m {
    height: 80px;
    display: flex;
    align-items: center;
    transition: all .4s ease;
}

body #menu.little .c ul.m {
    height: 50px;
}

/* Premier niveau du menu */

#menu ul li.m {
    display: inline-block;
    position: relative;
    margin: 0 18px;
}

/*#menu ul li.m:hover {
    background: #96c11f;
}*/

/*#menu ul li.m:nth-child(1) {
    background: white;
}*/

#menu ul li.m a.m {
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    position: relative;
    display: block;
    text-align: center;
    color: black;
}

#menu ul li.m a.m:before {
    content: '';
    display: block;
    width: 0;
    height: 1px;
    background-color: #000;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    transition: all .4s ease;
}

#menu ul li.m a.m:hover:before {
    width: 90%;
}

#menu ul li.m.has_submenu a.m {
    padding-right: 12px;
}

#menu ul li.m.has_submenu a.m:after {
    content: '';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 4px 0 4px;
    border-color: #000 transparent transparent transparent;
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
}

#menu ul li.m:nth-child(4) a.m:before,
#menu ul li.m:nth-child(5) a.m:before,
#menu ul li.m:nth-child(6) a.m:before {
    content: none;
}

#menu ul li.m:nth-child(4) a.m {
    color: #8CC63F;
    text-transform: none;
    border: 2px solid #8CC63F;
    border-radius: 10px;
    padding: 4px 42px;
}

#menu ul li.m:nth-child(4) a.m:hover {
    background-color: #006633;
    color: #FFF;
    border-color: #006633;
}

#menu ul li.m:nth-child(5) a.m {
    color: #FFF;
    background-color: #8CC63F;
    text-transform: none;
    border: 2px solid #8CC63F;
    border-radius: 10px;
    padding: 4px 42px;
}

#menu ul li.m:nth-child(5) a.m:hover {
    background-color: #006633;
    border-color: #006633;
}

#menu ul li.m:nth-child(6) a.m {
    color: #FF5733;
}

#menu ul li.m:nth-child(6) a.m i {
    display: inline-block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 1px solid #FF5733;
    line-height: 20px;
    margin-right: 5px;
}

#menu ul li.m:nth-child(6) a.m:hover i {
    animation-name: icon-wiggle;
    animation-iteration-count: 1;
    animation-duration: .6s;
    animation-timing-function: linear;
}

@keyframes icon-wiggle {
    0%, 40%, 80% {
        transform: rotate(-20deg);
    }
    20%, 60%, 100% {
        transform: rotate(20deg);
    }
}

/*#menu ul li.m a.m.little {
    height: 130px;
    line-height: 125px;
}*/

#menu ul li a.m:hover {
    cursor: pointer;
    text-decoration: none;
}

/* Second niveau du menu */

#menu ul.sm {
    position: absolute;
    top: 48px;
    left: 50%;
    text-align: center;
    box-shadow: 0px 10px 32px 0px rgba(0, 0, 0, 0.4);
    transform: translateX(-50%) scale(0.5);
    transform-origin: top;

    opacity: 0;
    visibility: hidden;
    transition: visibility 0s ease .6s, opacity .4s ease .2s, transform .4s ease .2s;
}

#menu.little ul.sm {
    top: 33px;
}

#menu li.m a:hover ~ ul.sm,
#menu ul.sm:hover {
    transform: translateX(-50%) scale(1);
    opacity: 1;
    visibility: visible;
    transition: visibility 0s ease, opacity .4s ease, transform .4s ease;
}

#triangle-down {
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 8px solid #CCCCCC;
    margin: auto;
    position: absolute;
    z-index: 100;
    right: 0;
    left: 0;
}

#menu ul.sm li.sm {
    float: none;
    width: 150px;
    border-top: 1px solid #CCCCCC;
    height: 40px;
    line-height: 40px;
    font-family: "Mst Light";
    font-size: 12px;
}

#menu ul.sm li.sm a.sm {
    display: block;
    transition: all .4s ease;
    background-color: #fff;
}

#menu ul.sm li.sm a.sm:hover {
    cursor: pointer;
    text-decoration: none;
    color: #FFF;
    background-color: #006633;
}

/*#menu ul.m li.m:hover .sm {
    display: block;
    color: black;
}*/

/* Elements cachés */

#menu .menutab {
    display: none
}

#menu .mmenu {
    display: none;
    padding: 7px 30px;
}

#menu .menu-profil {
    display: none;
    align-items: flex-start;
    text-align: left;
}

#menu .menu-profil .camping_car {
    display: none;
}

#menu .menu-profil .menu {
    font-family: var(--font-regular);
}

#menu .menu-profil .menufirst {
    font-size: 20px;
    line-height: 24px;
    margin-bottom: 0.625rem;
    padding: 0.375rem 0;
    width: 90%;
}

/* #menu .menu-profil .menufirst:not(:first-child) { */
    /* margin-bottom: 1.875rem; */
/* } */

#menu .menu-profil .menu.disconnect_button{
	margin-top:20px;
}

#menu .menu-profil .menu2 {
    font-size: 15px;
    line-height: 25px;
    margin-left: 1.25rem;
}

#menu .menu-profil .menu2.menufinal {
    /* margin-bottom: 1.875rem; */
    margin-bottom: 15px;
}

#menu .menu-profil {
    margin-bottom: 1.875rem;
}

#menu .menutab-profil {
    position: relative;
    display: none;
    font-family: var(--font-regular);
    font-size: 20px;
    line-height: 24px;
    margin-bottom: 1.875rem;
    color: var(--color-first-1);
    transition: all 0.4s ease;
}

#menu .menutab-profil::before {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' xmlns:v='https://vecta.io/nano'%3E%3Cdefs%3E%3CclipPath id='A'%3E%3Cpath fill='none' d='M0 0h10v18.75H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3Ccircle cx='15' cy='15' r='15' fill='%23f3f9eb'/%3E%3Cpath d='M15 1a14 14 0 0 0-9.9 23.9c5.468 5.468 14.332 5.468 19.8 0s5.468-14.332 0-19.8A13.91 13.91 0 0 0 15 1m0-1c8.284 0 15 6.716 15 15s-6.716 15-15 15S0 23.284 0 15 6.716 0 15 0z' fill='%238cc63f'/%3E%3Cg transform='translate(10 5.999)' clip-path='url(%23A)'%3E%3Cpath d='M9.955 14.377v-.033c-.006-2.098-1.326-3.967-3.3-4.676l-.546-.2.543-.2A4.74 4.74 0 0 0 4.447.116a4.74 4.74 0 0 0-4.179 4.71c.005 1.976 1.229 3.743 3.076 4.443l.543.2-.546.2c-1.973.71-3.291 2.579-3.297 4.676v4.322h9.911zM5.344 8.184h-.182H5l-.374-.042a2.93 2.93 0 0 1-.354-.077 3.31 3.31 0 0 1-.342-.113l-.166-.066c-.055-.023-.107-.053-.159-.079l-.155-.082-.146-.094a2.68 2.68 0 0 1-.271-.2 3.59 3.59 0 0 1-.234-.225 1.67 1.67 0 0 1-.193-.241l-.079-.124c-.027-.039-.051-.08-.07-.123a1.95 1.95 0 0 1-.172-.47l-.033-.2c-.008-.059 0-.122 0-.174v-.079c0-.023.007-.045.01-.065l.016-.1.015-.081h.087l.026.075.029.088.018.055.028.06.061.136c.022.05.057.1.088.149.073.113.157.218.249.316.046.055.108.1.163.157s.125.1.188.15.139.095.214.138l.115.064.057.033.062.028.252.11.131.05.136.042a4.32 4.32 0 0 0 .563.13l.275.036.162.008.144.01a5 5 0 0 0 .568-.019 4.14 4.14 0 0 0 .53-.081c.159-.033.315-.076.468-.129.132-.045.262-.097.389-.156l.159-.08.134-.075.105-.063c.031-.018.058-.04.08-.055l.064-.042.065.057-.035.073a1.54 1.54 0 0 1-.12.2l-.1.136c-.036.05-.085.1-.134.15a2.72 2.72 0 0 1-.37.313c-.072.053-.152.1-.235.149s-.174.092-.268.133c-.197.087-.403.154-.613.2a3.61 3.61 0 0 1-.684.089' fill='%238cc63f'/%3E%3C/g%3E%3C/svg%3E");
}

#menu:not(.menuactive) .menutab-profil {
    position: absolute;
    top: 5px;
    left: -90px;
    padding: 10px 0;
    font-size: 0;
}

/*  ------------------------------------------------
    IDCOOKIE
    ------------------------------------------------ */

#idcookie {
    color: #FFF;
    background: rgba(0, 0, 0, 0.7);
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 9999;
    box-shadow: 0px -1px 3px rgba(0, 0, 0, 0.3);
    padding: 10px 20px;
    padding-right: 30px;
}

#idcookie span, #idcookie a {
    display: inline-block;
}

#idcookie .buttoncookie {
    display: inline-block;
    padding: 10px;
    font-size: 1.5em;
    position: absolute;
    right: 10px;
    top: 0;
}

#idcookie .buttoncookie:hover {
    cursor: pointer;
    background: #000;
    color: #FFF;
    text-decoration: none;
}

#menu .lienAccueil {
    width: 100%;
    height: 80px;
    display: inline-block;
}

/*  ------------------------------------------------
    RESPONSIVE
    ------------------------------------------------ */
@media screen and (max-width: 1366px) {
    #menu ul li.m {
        margin: 0 12px;
    }

    #menu ul li.m:nth-child(4) a.m,
    #menu ul li.m:nth-child(5) a.m {
        padding: 4px 20px;
    }
}

@media screen and (max-width: 1199px) {
    body #menu .c .logo img {
        height: 40px;
    }

    #menu ul li.m {
        margin: 0 8px;
        padding: 6px 0;
    }

    #menu ul li.m a.m {
        font-size: 12px;
        line-height: 18px;
    }

    #menu ul.sm li.sm a.sm {
        background-color: transparent;
    }

    #menu ul li.m:nth-child(4) a.m,
    #menu ul li.m:nth-child(5) a.m {
        padding: 4px 15px;
    }

    .logo-mobile {
        display: flex;
        justify-content: left;
        padding-left: 1rem;
        align-items: center;
        background-color: #FFF;
        text-align: center;
        height: 60px;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 999;
        width: 100%;
        box-shadow: 0 0 5px rgba(0, 0, 0, 0);
        transition: all .4s ease;
    }

    .logo-mobile img {
        height: 40px;
        transition: all .4s ease;
    }

    #menu.little + .logo-mobile {
        height: 50px;
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
        background-color: rgba(255, 255, 255, 0.9);
    }

    #menu.little + .logo-mobile img {
        height: 30px;
    }

    #menu.menuactive + .logo-mobile {
        filter: blur(3px);
    }

    #menu_alternative {
        display: none;
    }

    #menu {
        position: fixed;
        top: 0 !important;
        margin-left: 0;
        margin-top: 0;
        height: auto;
        width: 250px;
        right: -250px;
        height: 100%;
        z-index: 10000;
        transform: translateY(0) !important;
    }

    body #menu .c {
        margin: 65px 10px;
    }

    body #menu .c .logo {
        display: none;
    }

    /* Menu responsive */
    .client_myAccount #menu.logged ul.m {
        display: none !important;
    }

    #menu ul li.m:not(:first-child) {
        margin-top: 15px;
    }

    #menu ul li.m, #menu ul li.sm {
        width: 100%;;
    }

    #menu ul.m, #menu ul.sm {
        display: block;
        visibility: visible;
        opacity: 1;
        position: relative;
        top: 0;
        left: 0;
        width: 100%;
        transform: none !important;
    }

    #menu ul li.m a.m {
        text-align: left;
        font-size: 20px;
        line-height: 24px;
        text-transform: none;
    }

    #menu ul li.m a.m:hover {
        color: #94C11F;
    }

    #menu ul li.m:nth-child(4) a.m,
    #menu ul li.m:nth-child(5) a.m {
        color: #000;
        border: none;
        background: none;
        border-radius: 0;
        padding: 0;
    }

    #menu ul li.m:nth-child(4) a.m:hover,
    #menu ul li.m:nth-child(5) a.m:hover {
        background: none;
        color: #94C11F;
        border: none;
    }

    #menu ul li.m:nth-child(6) a.m:hover {
        color: #FF5733;
    }


    #menu ul li.m a.m:before,
    #menu ul li.m a.m:after {
        content: none !important;
    }

    #menu li.m.open ul.sm {
        display: block;
    }

    #menu.menuactive {
        right: 0;
        background: none;
        background-color: white;
        text-align: center;
    }

    body.menuactive .bodyinner {
        position: relative;
        right: 250px;
    }

    body.menuactive #header .headerright {
        left: 250px;
    }

    #menu .menutab {
        color: #8CC63F;
        /*background: #FFF;*/
        display: block;
        position: absolute;
        text-align: center;
        width: 50px;
        top: 7px;
        left: -50px;
        padding: 10px 0px;
        z-index: 200000;
        cursor: pointer;
        transition: all .4s ease;
    }

    #menu.menuactive .menutab {
        left: unset;
        right: 0;
    }

    #menu.menuactive .menutab:before {
        content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17' viewBox='0 0 17 17'%3E%3Cg transform='translate(-220.5 -28.5)'%3E%3Cpath d='M15,16a1,1,0,0,1-.707-.293l-15-15a1,1,0,0,1,0-1.414,1,1,0,0,1,1.414,0l15,15A1,1,0,0,1,15,16Z' transform='translate(221.5 29.5)' fill='%23333'/%3E%3Cpath d='M0,16a1,1,0,0,1-.707-.293,1,1,0,0,1,0-1.414l15-15a1,1,0,0,1,1.414,0,1,1,0,0,1,0,1.414l-15,15A1,1,0,0,1,0,16Z' transform='translate(221.5 29.5)' fill='%23333'/%3E%3C/g%3E%3C/svg%3E");
    }

    #menu.little .menutab {
        top: 2px;
    }

    #menu.little:not(.menuactive) .menutab-profil {
        top: 0;
    }

    #menu .mmenu {
        display: block;
    }

    #menu ul.sm {
        margin-left: 20px;
        width: calc(100% - 20px);
        text-align: left;
        border: none;
        box-shadow: none;
    }

    #menu.little ul.sm {
        top: 0;
    }

    #menu ul.sm li.sm {
        height: auto;
        border: none;
        width: auto;
    }

    #menu ul.sm li.sm a.sm {
        font: 400 14px/18px "Mst Regular";
        color: #000;
    }

    #menu ul.sm li.sm a.sm:hover {
        background: none;
        color: #8CC63F;
    }

    body #menu .c .l {
        display: block;
        float: none;
        position: fixed;
        right: 0;
        left: 0;
        width: auto;
        text-align: center;
    }

    #menu.little {
        top: 0;
    }

    #menu ul li.m:nth-child(1) {
        /*display: none;*/
    }

    body #menu .c ul.m {
        width: 100%;
        height: 100%;
        flex-wrap: wrap;
    }

    #camping-car .cols .left {
        width: 95%;
        margin: 0 2.5%;
        float: none;
    }

    #camping-car .cols .right {
        width: 95%;
        position: relative;
        margin: 2.5%;
        float: none;
    }

    #camping-car .cols .right:after {
        clear: both;
        content: "";
        display: block;
    }

    #camping-car .cols .right .reservation {
        top: 0px !important;
    }

    #menu.logged {
        background-color: var(--color-second-3);
    }

    .client_myAccount #menu .menu-profil {
        display: flex;
        flex-direction: column;
    }

    #menu .menutab-profil {
        display: flex;
        align-items: center;
        gap: 0.313rem;
    }
}


@media screen and (max-width: 600px) {

    .marques {
        left: 100px;
        margin: auto;
        transform: scale(0.5, 0.5) translateX(-50%) !important;
        top: -43px !important;
        height: 130px !important;
    }

    #header #logo {
        margin-top: 40px;
    }

    #header .title {
        display: none;
    }

}