/* ---------------------------- ---------- ---------------------------- */
/* ---------------------------- ---------- ---------------------------- */
/* ---------------------------- NAVIGATION ---------------------------- */
/* ---------------------------- ---------- ---------------------------- */
/* ---------------------------- ---------- ---------------------------- */

/* ---------------------------- ---------- ---------------------------- */
/* ---------------------------- NAV - DESK ---------------------------- */
/* ---------------------------- ---------- ---------------------------- */

.Navigation-Global-Container{
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100vw;
    height: 63px;
    z-index: 12000000;
}

.Navigation-Principal-Container{
    position: absolute;
    left: var(--Navigation-Principal-Container-Left);
    width: var(--Navigation-Principal-Container-Width);
    top: 19px;
    height: 25px;
    z-index: 12000010;
}

.Navigation-Background{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100vw;
    height: 63px;
    background-color: var(--light);
    background-color: rgba(255, 251, 244, 0.01);
    backdrop-filter: blur(10px); /* flou de l'arrière-plan */
    -webkit-backdrop-filter: blur(10px); /* pour Safari */
    z-index: 12000001;
}

.Navigation-Logo-Container{
    position: absolute;
    left: 0px;
    top: -1px;
    height: 27px;
    width: 94px;
}

.Navigation-Logo{
    position: absolute;
    left: 0px;
    top: 0px;
    height: 27px;
    width: auto;
}

.Navigation-Logo-Trigger, .Navigation-Logo-Home-Trigger, .Ios-Navigation-Logo-Trigger, .Ios-Navigation-Logo-Home-Trigger, .Ios-Navigation-Menu-Trigger, .Ios-Navigation-Home-Menu-Trigger{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 12000010;
}

.Ios-Navigation-Home-Menu-Trigger:hover{
    cursor: pointer;
}

.Ios-Navigation-Menu-Trigger{
    display: none;
}

.Ios-Navigation-Menu-Trigger.Ios-Navigation-Menu-Trigger-On{
    display: block;
}

.Ios-Navigation-Menu-Trigger:hover{
    cursor: pointer;
}

.Navigation-Logo-Trigger:hover{
    cursor: pointer;
}

.Navigation-Logo-Home-Trigger:hover{
    cursor: pointer;
}

.Ios-Navigation-Logo-Trigger:hover{
    cursor: pointer;
}

.Ios-Navigation-Logo-Home-Trigger:hover{
    cursor: pointer;
}

.Navigation-Main-Container{
    position: absolute;
    display: flex;
    justify-content: space-between;
    right: 0px;
    top: 0px;
    height: 25px;
    width: 386px;
}

.Navigation-Container{
    position: relative;
    top: 0px;

}

.Navigation-Container-1{
    width: 101px;
    height: 25px;
}

.Navigation-Container-2{
    width: 140px;
    height: 25px;
}

.Navigation-Container-3{
    width: 45px;
    height: 25px;
}

.Navigation-Link{
    position: absolute;
    top: 0px;
}

.Navigation-Link-1{
    right: 0px;
}

.Navigation-Link-1:hover{
    color: var(--second);
}

.Navigation-Box-Container{
    position: absolute;
    top: 0px;
    left: 0px;
    height: 25px;
    width: 140px;
    background-color: var(--light);
    border: 1px solid var(--dark);
    box-sizing: border-box;
    border-radius: 30px;
}

.Navigation-Box-Container:hover{
    border: 1px solid var(--var9);
    cursor: pointer;
}

.Navigation-Box-Container:hover * {
    color: var(--var9);
}


.Navigation-Link-2{
    width: 100%;
    left: 50%;
    transform: translateX(-50%);
}

.Notif{
    position: absolute;
    right: -7px;
    top: -10px;
    width: 23px;
    height: 23px;
}

.Language-Main-Container{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 45px;
    height: 25px;
    border-radius: 30px;
    background-color: var(--dark);
}

.Language-Main-Container:hover{
    cursor: pointer;
}

.Language-Switch{
    position: absolute;
    right: 21px;
    top: 1px;
    width: 23px;
    height: 23px;
    background-color: var(--light);
    border-radius: 23px;
    transition: 0.12s ease-in;
}

.Language{
    position: absolute;
    top: 6px;
}

.Language-Fr{
    left: 5px;
}

.Language-En{
    right: 4px;
}

/* ---------------------------- ---------- ---------------------------- */
/* ---------------------------- NAV -- IOS ---------------------------- */
/* ---------------------------- ---------- ---------------------------- */

.Ios-Navigation-Global-Container{
    display: none;
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100vw;
    height: 50px;
    z-index: 12000000;
}

.Ios-Navigation-Principal-Container{
    position: absolute;
    top: 13px;
    left: var(--Ios-Navigation-Principal-Container-Left);
    width: var(--Ios-Navigation-Principal-Container-Width);
    height: 24px;
    z-index: 12000010;
}

.Ios-Navigation-Background{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100vw;
    height: 50px;
    background-color: var(--light);
    background-color: rgba(255, 251, 244, 0.01);
    backdrop-filter: blur(10px); /* flou de l'arrière-plan */
    -webkit-backdrop-filter: blur(10px); /* pour Safari */
    z-index: 12000001;
}

.Ios-Navigation-Background.Ios-Navigation-Background-On{
    background-color: rgba(151, 137, 114, 0.01);
}

.Ios-Navigation-Logo-Container{
    position: absolute;
    left: 0px;
    top: 0px;
    height: 24px;
    width: 94px;
}

.Ios-Navigation-Logo{
    position: absolute;
    left: 0px;
    top: 0px;
    height: 24px;
    width: auto;
}

.Ios-Navigation-Logo.Ios-Navigation-Logo-On{
    display: none;
}

/* ---------------------- NAVIGATION IOS BURGER ---------------------- */

.Burger-Container{
    position: absolute;
    right: 0px;
    top: 4px;
    height: 16px;
    width: 40px;
}

.Burger-Container:hover{
    cursor: pointer;
}

.Burger-Container:hover * {
    background-color: var(--second);
}

.Burger-Line{
    position: absolute;
    left: 0px;
    width: 40px;
    height: 2px;
    background-color: var(--dark);
}

.Burger-Line-Top{
    top: 0px;
}

.Burger-Line-Bottom{
    bottom: 0px;
}

.Burger-Cache{
    display: none;
    position: absolute;
    top: 0px;
    right: 0px;
    height: 24px;
    width: 40px;
    width: 100%;
    z-index: 60000;
    z-index: 12000012;
}

.Burger-Cache.Burger-Cache-On{
    display: block!important;
    position: absolute;
    top: 0px;
    right: 0px;
    height: 24px;
    width: 40px;
    width: 100%;
    z-index: 60000;
    z-index: 12000012;
}