/*
 * CSS du menu principal V5
 * @author Morgan Lecoq : avril 2021
 */
/* 2022-05 */
.overflow--hidden{
    overflow-y: hidden;
}

/* RESET Localiser */
.network-header *,
.front-header *{
    text-decoration: none;
    list-style: none;
    padding: initial;
    margin: initial;
    box-sizing: border-box;
}
.center{margin: 0 auto;}

/* x - x - x - x - x - x - x - x - x - x Général x - x - x - x - x - x - x - x - x - x - x -  */

    /* color général */
    .c-green--dark, .c-purple--dark, .c-pink--dark,
    .c-blue--dark{color: #161E4A;}

    .c-green--light, .c-purple--light, .c-pink--light,
    .c-blue--light{color: #648CDB}

    /* background général */

    .bg-green--dark, .bg-purple--dark, .bg-pink--dark, .bg-yellow--dark,
    .bg-blue--dark{background: #161E4A;}

    .bg-green--light, .bg-purple--light, .bg-pink--light, .bg-yellow--light,
    .bg-blue--light{background: #648CDB}

    .bg-green--ultralight, .bg-purple--ultralight, .bg-gray--ultralight, .bg-pink--ultralight, .bg-yellow--ultralight,
    .bg-blue--ultralight{background:#F2FAFF}

    .bg-black--dark{color:black;}


    /* Général mise en forme */
    .g-title--xl{
        font-family: "Poppins", Sans-Serif;
        font-style: normal;
        font-weight: bold;
        font-size: 28px;
        line-height: 40px;
        letter-spacing: 0px;
        margin: 0;
    }
    .g-title--l{
        font-family: "Poppins", Sans-Serif;
        font-style: normal;
        font-weight: 600;
        font-size: 28px;
        line-height: 40px;
        letter-spacing: 1px;
    }
    .g-subtitle{
        font-family: "Poppins", Sans-Serif;
        font-style: normal;
        font-weight: 600;
        font-size: 14px;
        line-height: 35px;
        margin: 0;
        letter-spacing: 1px;
        text-transform: uppercase;
    }

    /* CTA */
    .cta__secondary{
        display: inline-flex;
        flex-direction: row;
        align-items: center;
        padding-left: 20px;
        padding-right: 20px;
        border:2px solid black;
        line-height: 50px;
        font-family: "Poppins", Sans-Serif;
        font-style: normal;
        font-weight: 500;
        font-size: 16px;
    }
    .cta__secondary.cta__secondary--light{border-color: white;color: white;}

    /* TAG */
    .tag--pro{
        position: relative;
        display: inline-block;
        top:-6px;
        align-self: center;
        padding: 0px 5px;
        margin-left: 10px;
        background: #182E2C;
        color: white;
        font-weight: 500;
        font-style: normal;
        font-size: 8px;
        line-height: 16px;
        letter-spacing: 0.5px;
    }
    .tag--pro::after{
        content: '';
        position: absolute;
        left: 0px;
        bottom:-8px;
        width: 0;
        height: 0;
        border-left: 0px solid transparent;
        border-right: 12px solid transparent;
        border-top: 8px solid #648CDB;
        clear: both;
    }
    .dropdown-triange{
        display : inline-block;
        height : 0;
        width : 0;
    }


/* x - x - x - x - x - x - x - x - x - x Header x - x - x - x - x - x - x - x - x - x - x -  */

    .front-header,
    .network-header{
        position: -webkit-sticky;
        position: sticky;
        top: 0;
        z-index: 100;
    }

/* x - x - x - x - x - x - x - x - x - x Nav primary x - x - x - x - x - x - x - x - x - x  */

    .front-header{box-shadow: 0px 4px 40px rgba(0, 0, 0, 0.15);}
    .front-header .nav-primary{
        display: flex;
        position: sticky;
        height: 70px;
        background: white;
        z-index: 1;
        transition: all 0.2s ease-in-out;
    }
    .front-header .nav-primary .container{
        margin: 0 auto;
        border-bottom: none;
    }
    .nav-primary .container{
        display: flex;
        flex-direction: row;
        justify-content: space-between;

        position: sticky;
        height: 70px;
        z-index: 1;
        box-sizing: border-box;
        border-bottom: 1px solid #e6e6e6;
    }

    /* x - x - x Lv 0 x - x */
    .nav-primary ul.lv-0{
        display: flex;
        align-content: center;
    }
    .nav-primary ul.lv-0:first-of-type li:first-of-type{margin-left: 0px}
    .nav-primary ul.lv-0 > li{
        position: relative;
        display: flex;
        align-content: baseline;
        align-items: center;
        margin-left: 5px;
    }
    .nav-primary ul.lv-0 > li > a{
        font-family: Poppins;
        font-style: normal;
        font-weight: 500;
        font-size: 14px;
        color: #000000;

        display: flex;
        align-items: center;
        text-align: center;

        padding:0px 10px;
        line-height: 40px;
        height: 40px;
    }
    .nav-primary ul.lv-0 > li:hover > a{
        background: #EDF6FF;
        border-radius: 5px
    }
    .nav-primary ul.lv-0 > li > a > i{
        font-size:18px;
        display: inline-block;
        width: 18px;
        opacity: 0.8
    }
    .nav-primary ul.lv-0 > li.active{position: relative}
    .nav-primary ul.lv-0 > li.active::after{
        position: absolute;
        top: calc(100% - 5px);
        right: calc(50% - 15px);
        height: 5px;
        width: 30px;
        content: " ";
        background: #648CDB;
        border-radius: 5px;
        overflow: hidden;
    }

    /* x - x - x Dropdown x - x */
    .nav-primary .dropdown{
        position: absolute;
        display: none;
        top: calc(100% - 5px);
        right: 0px;
        width: 200px;

        background: #FFFFFF;
        box-shadow: 0px 4px 25px rgba(0, 0, 0, 0.15);
        border-radius: 5px;
    }
    /* x - x - x Dropdown Active x - x */
    .nav-primary ul.lv-0 > li:hover .dropdown{display: block}

    /* x - x - x Lv 1 x - x */
    .nav-primary .dropdown hr{margin: 0px;border: 0px;border-bottom: 1px solid #ebebeb}
    .nav-primary .dropdown ul.lv-1{}
    .nav-primary .dropdown ul.lv-1:nth-of-type(1){padding: 20px 20px 15px;}
    .nav-primary .dropdown ul.lv-1:nth-of-type(2){padding: 15px 20px 20px;}
    .nav-primary .dropdown ul.lv-1 > li{}
    .nav-primary .dropdown ul.lv-1 > li > a{
        display: flex;
        justify-content: flex-start;
        align-items: center;
        flex-grow: 1;
        text-decoration: none;
        color: black;
        font-family: Poppins;
        font-style: normal;
        font-weight: 500;
        font-size: 13px;
        line-height: 30px;
    }
    .nav-primary .dropdown ul.lv-1 > li > a i{
        font-size:18px;
        display: inline-block;
        width: 18px;
        margin-right: 10px;
        opacity: 0.8
    }

/* = = = = = = =  Primary nav left = = = = = = = = = = = = = = = = = = */

    /* x - x - item-logo  x - x */
    .nav-primary ul.lv-0 > .item-logo .logo{height: 28px;width: auto;}
    .nav-primary ul.lv-0 > li.item-logo:hover > a{background: transparent}

    /* x - x - item-logoNetwork  x - x */
    .nav-primary ul.lv-0 > li.item-logoNetwork{}
    .nav-primary ul.lv-0 > li.item-logoNetwork .logo{height: 28px;width: auto;}
    .nav-primary ul.lv-0 > li.item-logoNetwork:hover > a{background: transparent}

    /* x - x - item-press  x - x */
    .nav-primary ul.lv-0 > .item-press{}
    .nav-primary ul.lv-0 > .item-press > p{
        align-items: center;
        display: flex;
        flex-direction: column;
        border-left: 1px solid gray;
        display: flex;
        align-items: flex-start;
        justify-content: center;
        padding: 0px 10px;
        height: 30px;
    }
    .nav-primary ul.lv-0 > .item-press > p > a{
        font-family: 'Poppins';
        text-transform: uppercase   ;
        font-style: normal;
        font-weight: 600;
        font-size: 8px;
        line-height: 15px;
        letter-spacing: 1px;
        color: black;
        opacity: 0.8;
        transition: all 0.3s ease-in-out;
    }
    .nav-primary ul.lv-0 > .item-press > p > a:hover{opacity:1;}

    /* x - x - item-frontAccess  x - x */
    .nav-primary ul.lv-0 > li.item-frontAccess{}
    .nav-primary ul.lv-0 > li.item-frontAccess a{
        border: 1px solid black;
        border-radius: 5px;
        line-height: 40px;
    }

/* = = = = = = =  Primary nav right = = = = = = = = = = = = = = = = = = */

    /* x - x - x  item-login  x - x */
    .nav-primary ul.lv-0 > li.item-login{}
    .nav-primary ul.lv-0 > li.item-login a{
        border: 1px solid black;
        border-radius: 5px;
        line-height: 40px;
    }
    .nav-primary ul.lv-0 > li.item-login a i{
        margin-left: 10px;
        font-size: 20px;
        text-rendering: geometricPrecision;
    }

    /* x - x - x  item-networkAccess  x - x */
    .nav-primary ul.lv-0 > li.item-networkAccess{}
    .nav-primary ul.lv-0 > li.item-networkAccess a{
        border: 1px solid black;
        border-radius: 5px;
        line-height: 40px;
    }

    /* x - x - x  item-account  x - x */
    .nav-primary ul.lv-0 > li.item-account > a{
        background: #EDF6FF;
        display: flex;
        justify-content: center;
        align-content: center;
        border-radius: 4px;
        height: 40px;
    }
    .nav-primary ul.lv-0 > li.item-account a .my-avatar{
        width: 32px;
        height: 32px;
        border-radius: 32px;
    }
    .nav-primary ul.lv-0 > li.item-account a .btn-burger{
        background: transparent;
        border:none;
        padding-left: 10px;
    }
    .nav-primary ul.lv-0 > li.item-account > a > i{font-size: 12px;margin-left: 5px;opacity: 0.5}

    /* x - x - x  item-search  x - x */
    .nav-primary ul.lv-0 .item-search{}

    /* x - x - x  item-language  x - x */
    .nav-primary ul.lv-0 > li.item-language > a > i{font-size: 12px;margin-left: 5px;opacity: 0.5}



/* x - x - x - x - x - x - x - x - x - x Nav Primary Mobile x - x - x - x - x - x - x - x - x - x */

    .nav-primary-mobile{
        box-sizing: border-box;
        position: fixed;
        z-index: 10;
        top: 0px;
        display: none;

        justify-content: space-between;
        flex-direction: row-reverse;
        align-items: center;
        padding-left: 0px;
        padding-right: 20px;

        height: 70px;
        width: 100%;
        background: white;
    }
    .nav-primary-mobile .logo{
        max-width: 100px;
        height: auto;
    }
    .nav-primary-mobile .btn{
        border: initial;
        padding: initial;
        align-items: initial;
        margin: initial;
    }
    .nav-primary-mobile .btn-burger {
        display: block;
        width: 80px;
        height: 80px;
        position: relative;
        background: transparent;
        outline:none;

        display: flex;
        align-items: center;
        justify-content: center;
    }
    .nav-primary-mobile .btn-burger span{display: flex;width: 25px;height: 22px;position: relative;}
    .nav-primary-mobile .btn-burger em:before,
    .nav-primary-mobile .btn-burger em:after,
    .nav-primary-mobile .btn-burger em{
        content: ' ';
        display: block;
        width: 25px;
        height: 3px;
        background-color: black;
        border-radius: 2px;
        position: absolute;box-sizing: border-box;
    }
    .nav-primary-mobile .btn-burger em {top: 10px;width: 20px;}
    .nav-primary-mobile .btn-burger em:after {top: 8px;}
    .nav-primary-mobile .btn-burger em:before {top: -8px;}
    .nav-primary-mobile .btn-burger:focus{outline:none;}

    /* BTN Burger */
    .btn-burgerAnimate em{
        left: 0;
        transition: all 0.3s ease;
    }
    .btn-burgerAnimate em {
        left: 0;
        transition: all 0.3s ease 0.2s;
    }
    .btn-burgerAnimate em:after {
        left: 0;
        transition: all 0.3s ease;
    }
    .btn-burgerAnimate:not(.collapsed) em{
        background-color: transparent;
        transition: all 0.3s ease;
    }
    .btn-burgerAnimate:not(.collapsed) em:before {
        top: 0px;
        height: 3px;
        transform: rotate(135deg);
        transition: all 0.3s ease 0.2s;
        background-color: black;
    }
    .btn-burgerAnimate:not(.collapsed) em:after {
        top: 0px;
        height: 3px;
        transform: rotate(-135deg);
        background-color: black;
        transition: all 0.3s ease 0.2s;
    }
    .nav-primary ul.lv-0 .item-frontAccess.mobile{display: none}

/* x - x - x - x - x - x - x - x - x - x Nav Primary Mobile x - x - x - x - x - x - x - x - x - x */

/* Desktop 1280 (landscape) ----------- */
    @media (max-width: 1280px) {}

/* Tablette (landscape) --------------- */
    @media (max-width: 1024px) {

        /* Network mobile */
        .network-header .nav-primary ul.lv-0 .item-program,
        .network-header .nav-primary ul.lv-0 .item-videolibrary,
        .network-header .nav-primary ul.lv-0 .item-network{display: none}
        .network-header .nav-primary ul.lv-0  .item-frontAccess{display: block}

        .nav-primary ul.lv-0:first-of-type{display: none}
        .nav-primary-mobile{display: flex;border-bottom: 1px solid #e6e6e6;}
        .front-header .nav-primary{height: initial}
        .nav-primary .container{height: initial;border-bottom: 0}
        .nav{
            position: absolute;

            right: 0;
            bottom:0;
            z-index: auto;

            /* Animation*/
            visibility: hidden;
            overflow: hidden;
            width: 0px;
            opacity: 0;

            /* Scroll*/
            overflow: auto;
            height: calc(100vh - 70px);
            position: absolute;
            top: 70px;

            display: flex;
            background: white;
            flex-direction: column;
            justify-content: flex-start;
            box-sizing: border-box;
            transition: opacity 250ms ease-in-out;
        }
        .nav.active{
            opacity: 1;
            left: 0%;
            visibility: visible;
            width: 100%;
            overflow: auto;
        }
        .nav.active .nav-primary ul.lv-0{opacity: 1;}
        .nav.active .nav-secondary ul.lv-0{opacity: 1;}

        .nav-primary{
            position: relative;
            display: flex;
            height: auto;
            padding-top: 0;
        }
        .nav-primary .nav-primary__container{
            flex-direction: column;
            padding: 20px;
            padding-top: 0px;
            width: 100%;
        }

        body.network .nav-primary .nav-primary__container > .g-subtitle{
            display: block;
            text-align: right;
            color: black;
        }

        /* Nav primary - LV-0 */
        .nav-primary ul.lv-0{
            flex-direction: row-reverse;
            align-items: center;
            justify-content: space-between;
            width: 100%;
        }
        .nav-primary ul.lv-0 > li{
            display: flex;
            align-items: center;
            position: relative;
            padding-right: 0px;
            justify-content: flex-end;
            order:1;
        }
        .nav-primary ul.lv-0 > li{display: none}
        .nav-primary ul.lv-0 > li.mobile{
            display: block;
            margin: 15px;
        }
        .nav-primary ul.lv-0 > li.item-networkAccess a,
        .nav-primary ul.lv-0 > li.item-frontAccess a,
        .nav-primary ul.lv-0 > li > a{
            height: auto;
            line-height: 50px;
            font-weight: 600;
            border: 1px solid black;
            border-radius: 5px;
        }
        .nav-primary ul.lv-0 > li:hover .dropdown{display: none}
        .nav-primary ul.lv-0 .item-home a {background: transparent;}
        .nav-primary ul.lv-0 .item-search{display: none;}
        .nav-primary ul.lv-0 ul.lv-0-1 {
            border-right-width: 0px;
        }
        .nav-primary ul.lv-0 ul.lv-0-1 li {
            padding-right: 0;
            line-height: 40px;
        }
        .nav-primary ul.lv-0 ul.lv-0-1 a {
            font-size: 18px;
            height: auto;
        }


        .nav-primary__dropdown ul.lv-1 li > a:hover {
            background: initial;
        }
        .nav-primary .nav-primary__dropdown{display: block;box-shadow: none;position: initial;}
        .nav-primary .nav-primary__dropdown ul.lv-1{display: flex;}
        .nav-primary .nav-primary__dropdown li.lv-1 a:hover{background: initial;}
    }

/* Tablette (landscape) --------------- */
    @media (max-width: 760px) {}

/* x - x - x - x - x - x - x - x - x - x Nav secondary x - x - x - x - x - x - x - x - x - x */

    .network-header .nav-secondary{display: none}
    .nav-secondary{
        position: absolute;
        width: 100%;
        background: black;
        border-top:1px solid black;
        transition: all 0.2s ease-in-out;
    }
    .nav-secondary.hidden {
        /*margin-top: -65px;*/
        opacity: 0;
    }
    /* Nav secondary -- Active*/
    .nav-secondary.active{
        border-top:1px solid #e7e7e7;
        background: white;
    }
    .nav-secondary .nav-secondary__container{ margin:0 auto;}
    .nav-secondary .nav-secondary__container > .g-subtitle{display: none}
    .nav-secondary .nav-secondary__account{
        display: none;
        background: #F6F6F6;
    }

    /* Nav secondary - LV-1 */
    .nav-secondary ul.lv-0{
        display: flex;
        justify-content: space-between;
        margin: 0px;
        padding-left: 0;
    }
    .nav-secondary li.lv-0{position: relative;}

    .nav-secondary li.lv-0.active > a::after{
        content: " ";
        display: block;
        height: 4px;
        position: absolute;
        width: 100%;
        background: #000;
        top: 0px;
    }

    .nav-secondary li.lv-0.active > .dropdown {
        box-shadow: 0 40px 40px rgba(0, 0, 0, 0.2);
    }

    .nav-secondary li.lv-0>a{
        font-family: "Poppins", Sans-Serif;
        font-style: normal;
        font-weight: 500;
        font-size: 14px;
        line-height: 50px;
        color:white;
        padding-left: 10px;
        padding-Right: 10px;
        text-align: center;
    }
    .nav-secondary li.lv-0 > a > i.fa-chevron-down{
        font-size: 10px;
        margin-left: 5px;
        transform: rotateZ(0deg);
        transition: transform 300ms ease-in-out;
    }
    .nav-secondary.active li.lv-0 > a > i.fa-chevron-down{color: black}
    .nav-secondary li.lv-0.active > a > i.fa-chevron-down{transform: rotateZ(-180deg);}

    /* Nav secondary - LV-1 -- Active*/
    .nav-secondary.active li.lv-0 > a{
        color:black;
    }

    /* Nav secondary - Dropdown */
    .nav-secondary .dropdown{
        position: fixed;
        width: 100%;
        background: white;
        left: 0;
        box-shadow: 0px 40px 40px #0000000d;
        visibility: hidden;
        opacity: 0;
        margin-top: 40px;
        transition: all 0.250s ease-in-out;
        top: 120px;
    }
    /* Nav secondary - Dropdown -- Active */
    .nav-secondary li.lv-0.active > .dropdown{
        visibility: visible;
        margin-top: 0px;
        opacity: 1;
    }

    /* Grid section / Aside  */
    .nav-secondary .dropdown .dropdown__container{
        display: grid;
        grid-template-columns: auto 300px;
        grid-template-rows: 1fr;
        min-height: 360px;
        margin:0 auto;
        padding-top: 30px;
    }

    /* Grid section / Nav mobile  */
    .nav-secondary .dropdown .dropdown__nav{display: none;}

    /* Content section - LV-1  */
    .nav-secondary .dropdown section{
        display: grid;
        grid-template-columns: 300px auto;
        grid-template-rows: 1fr;
        z-index: 1;
    }

    .nav-secondary .lv-1 {
        padding: 0;
        margin: 0;
    }
    .nav-secondary .dropdown .dropdown__content-lv1 .btn-close{display: none;}
    .nav-secondary .dropdown .dropdown__content-lv1 h2{height: 60px;line-height: 50px;}
    .nav-secondary .dropdown .dropdown__content-lv1 h2 .tag--pro{}
    .nav-secondary .dropdown li.lv-1 a{
        font-family: "Poppins", Sans-Serif;
        font-style: normal;
        font-weight: 600;
        font-size: 20px;
        line-height: 35px;
        color: black;
    }
    .nav-secondary .dropdown li.lv-1 a span{}
    .nav-secondary .dropdown li.lv-1 a i{margin-left: 10px}

    /* Content section - LV-2  */
    .nav-secondary .dropdown .dropdown__content-lv2{
        padding-left: 50px;
        padding-top: 60px;
        columns: 2;
        height: 100%;
    }
    .nav-secondary .dropdown ul.lv-2 {
        margin: 0;
        padding: 0;
        padding-bottom: 20px;
        page-break-inside: avoid;
        display: block;
        flex-direction: column;
    }
    /* Nav sur une colonne pour participer et a propos */
    .nav-secondary .dropdown.dropdown--participate .dropdown__content-lv2 {
        columns: 1;
    }

    .nav-secondary .dropdown li.lv-2{}
    .nav-secondary .dropdown li.lv-2 a{
        font-family: "Poppins", Sans-Serif;
        font-style: normal;
        font-weight: 500;
        font-size: 14px;
        line-height: 28px;
        color: Black;
        position: relative;
    }

    .nav-secondary .dropdown li.lv-2 a::after {
        position: absolute;
        content: "";
        top: 100%;
        left: 0;
        width: 100%;
        height: 2px;
        transform: scaleX(0);
        transform-origin: right;
        transition: transform 0.5s;
        background: #648CDB;
    }

    .nav-secondary .dropdown--mifa li.lv-2 a::after{background: #648CDB;}
    .nav-secondary .dropdown--festival li.lv-2 a::after{background: #648CDB;}

    .nav-secondary .dropdown li.lv-2 a:hover {opacity: 0.8;}
    .nav-secondary .dropdown li.lv-2 a:hover::after {transform: scaleX(1);transform-origin: left;}

    .nav-secondary .dropdown li.lv-2 a span{}
    .nav-secondary .dropdown li.lv-2 a span i{}

    /* Exibition Zoom  */
    .nav-secondary .dropdown aside.dropdown__exibition{padding: 30px; flex-direction:column;}
    .nav-secondary .dropdown aside.dropdown__exibition .g-title--l{color: white;padding-bottom: 15px;}

    /* Aside Zoom  */
    .nav-secondary .dropdown aside.dropdown__zoom ul{
        padding: 30px;
        margin: 0;
        margin-right: 30px;
    }

    .nav-secondary .dropdown aside.dropdown__zoom ul li.lv-3 a{
        font-family: "Poppins", Sans-Serif;
        font-style: normal;
        font-weight: 500;
        font-size: 18px;
        line-height: 35px;
        color: white;
    }

    /* Position picture */
    .nav-secondary .dropdown aside{position: relative;}
    .nav-secondary .dropdown aside .dropdown__img{
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        /* width : calc( ecran / 2 - container / 2 + zoom width */
        width: calc(100vw / 2 - 1170px / 2 + 300px);
        z-index: -1;
    }

    /* Specific picture */
    .nav-secondary .dropdown--festival aside .dropdown__img{
        background: url("../interface/header/dropdown__festival.jpg");
        background-size: cover;
    }
    .nav-secondary .dropdown--mifa aside .dropdown__img{
        background: url("../interface/header/dropdown__mifa.jpg");
        background-size: cover;
    }
    .nav-secondary .dropdown--about aside .dropdown__img{
        background: linear-gradient(120deg, #000 0%, rgba(82, 33, 125, 0) 100%), url("../interface/header/dropdown__about.jpg");
        background-size: cover;
    }
    .nav-secondary .dropdown--participate aside .dropdown__img{
        background: linear-gradient(120deg, #000 0%, rgba(82, 33, 125, 0) 100%), url("../interface/header/dropdown__participate.jpg");
        background-size: cover;
    }
    .nav-secondary .dropdown--offers aside .dropdown__img{
        background: linear-gradient(120deg, #000 0%, rgba(82, 33, 125, 0) 100%), url("../interface/header/dropdown__offers.jpg");
        background-size: cover;
    }
    .nav-secondary .dropdown--program aside .dropdown__img{}

    /* général -- tag pro MIFA */
    .nav-secondary .dropdown--mifa .tag--pro{background: #182E2C;color: white;font-weight: 500;text-transform: capitalize;top: -14px;}
    .nav-secondary .dropdown--mifa .tag--pro::after{border-top: 8px solid #648CDB;}

    .dropdown-triange{
        display : inline-block;
        height : 0;
        width : 0;
    }

/* x - x - x - x - x - x - x - x - x - x Nav-Secondary Mobile x - x - x - x - x - x - x - x - x - x */

/* Desktop 1280 (landscape) ----------- */
    @media (max-width: 1280px) {
        .nav-secondary .dropdown section{grid-template-columns: 250px auto;}
        .nav-secondary .dropdown .dropdown__content-lv2{padding-left: 30px;padding-bottom: 30px;}
        .nav-secondary .dropdown aside .dropdown__img{width: calc(100vw / 2);}
    }

/* Tablette (landscape) --------------- */
    @media (max-width: 1024px) {

        .network-header,
        .front-header {min-height: 70px;}

        .network-header .nav-secondary{
            display: flex;
            flex-direction: column;
        }
        .nav-secondary{
            position: relative;
            background: white;
            border: 0px;
            height: auto;
            flex-direction: row;
            flex: auto;
        }
        .nav-secondary.active {border-top: 0px;}
        .nav-secondary.hidden{margin-top: initial;}
        .nav-secondary .nav-secondary__container > .g-subtitle{display: block}
        .nav-secondary .nav-secondary__container.nav-secondary__account{
            display: flex;
            flex-grow: 1;
            padding-bottom: 100px;
        }
        .nav-secondary__container.container{
            flex-direction: column;
            padding: 20px;
            width: 100%;
        }
        .nav-secondary__container{padding: 0px;}
        .nav-secondary__container > .g-subtitle{
            display: block;
            text-align: right;
        }
        .nav-secondary ul.lv-0{flex-direction: column-reverse;}
        .nav-secondary li.lv-0{
            display: flex;
            justify-content: flex-end;
            position: initial;
        }

        .nav-secondary li.lv-0>a,
        .nav-secondary .dropdown li.lv-1 > a{
            color: black;
            line-height: 50px;
            height: 50px;
            font-weight: 600;
            font-size: 18px;
        }
        .nav-secondary li.lv-0 > a > i{font-size: 20px;margin-left: 10px;}
        .nav-secondary li.lv-0 > a > i.fa-chevron-down{
            font-size: 15px;
            transform: rotate(-90deg);

        }
        .nav-secondary li.lv-0 > .dropdown{left: 100%;top: 0;margin-top: 0px;}
        .nav-secondary li.lv-0.active > .dropdown {
            position: fixed;
            display: flex;
            z-index: 100;
            top: 0;
            left: 0;
            bottom: 0;
            height: 100vh;
            overflow: auto;
            visibility: visible;
            opacity: 1;
            background: white;
        }
        .nav-secondary li.lv-0.active{}
        .nav-secondary li.lv-0.active > a::after{display: none;}

        /* Dropdown Mobile */
        .nav-secondary .dropdown .dropdown__container{
            margin-top: 0px;
            grid-template-columns: auto;
            grid-template-rows: auto;
            min-height: auto;
            width: 100%;
            padding-top: 70px;
        }
        .nav-secondary .dropdown .dropdown__nav{
            position: fixed;
            height: 70px;
            width: 100%;
            top:0;
            left: 100%;
            right: 0;
            display: flex;
            justify-content: space-between;
            border-bottom:1px solid #e6e6e6;
            background: white;
            opacity: 1;
            transition: all 0.250s ease-in-out;
        }
        .nav-secondary li.active > .dropdown .dropdown__nav{
            left: 0%;opacity: 1;
        }
        .nav-secondary .dropdown .dropdown__nav .btn-dropdown-close{
            width: 70px;
            font-size: 18px;
            background: initial;
            border: initial;
            padding: 0px;
        }
        .nav-secondary .dropdown .dropdown__nav h2{
            font-size: 22px;
            font-weight: 600;
            text-align: right;
            padding-left: 20px;
            padding-right: 20px;
            line-height: 70px;
            letter-spacing: 0px;
        }
        .nav-secondary .dropdown aside{display: none;}
        .nav-secondary .dropdown section {
            display: grid;
            grid-template-columns: auto;
            grid-template-rows: min-content auto;
            /* Scroll*/
            width: 100%;
            overflow: auto;
            height: calc(100vh - 70px);
            position: absolute;
            top: 70px;
        }
        .nav-secondary .dropdown .dropdown__content-lv1{
            padding: 20px;
        }
        .nav-secondary .dropdown .dropdown__content-lv2{
            columns: 1;
            padding: 20px 30px;
        }
        .nav-secondary .dropdown .dropdown__content-lv1 h2{display: none}
        .nav-secondary .dropdown .dropdown__content-lv1 h2 .tag--pro{display: none;}
        .nav-secondary .dropdown .dropdown__content-lv1 .btn-close {
            display: block;
            position: absolute;
        }
        .nav-secondary .dropdown li.lv-1 {display: flex;justify-content: flex-end;}
        .nav-secondary .dropdown li.lv-2 {display: flex;justify-content: flex-end;}
        .nav-secondary .dropdown li.lv-2 a{
            font-weight: 500;
            font-size: 16px;
            line-height: 40px;
        }
        .nav-secondary .dropdown ul.lv-2{
            display: block;
        }
    }

/* Tablette (landscape) --------------- */
    @media (max-width: 760px) {}

/* Section Header Transparent ------------------------------------------------------- */
    main.landing{margin-top: -70px;}
    body.landing > header {}
    body.landing > header.no_sticky {position: relative;}
    body.landing > header.sticky {
        position: sticky;
        transition: all 0.4s ease-in-out;
    }

/* Tablette (landscape) --------------- */
    @media (min-width: 1024px) {
        .landing .front-header.transparent{
            box-shadow: initial;
        }
        .landing .transparent .nav-secondary,
        .landing .transparent .nav-primary {
            background: transparent;
            color: #fff;
        }
        .landing .transparent .nav-secondary {
            border-top: 1px solid rgba(255, 255, 255, 0.2);
        }
        .landing .transparent .nav-primary ul.lv-0 ul.lv-0-1 {
            border-right-color: #fff;
        }
        .landing .transparent .nav-primary .item-press > p > a{
            font-weight: 400;
            opacity: 1;
        }
        .landing .transparent .nav-primary .lv-0 > li > a {color: white;}
        .landing .transparent .nav-primary .lv-0 > li > p > a{color: white;}

        .landing .transparent .nav-primary .item-account > a,
        .landing .transparent .nav-primary .item-networkAccess a,
        .landing .transparent .nav-primary .item-login a{
            border: 1px solid rgba(255, 255, 255, 0.5);
            background: transparent;
        }
        .landing .transparent .nav-primary .lv-0 > li:hover > a{
            background: rgba(255, 255, 255, 0.2);
        }
        .landing .transparent .nav-primary .lv-0 li .nav-primary__dropdown a {
            color: #000;
        }

        .landing .transparent .nav-primary .logo-home {
            filter: invert(1);
        }

        .landing .transparent .nav-secondary li.lv-0 > a,
        .landing .transparent .nav-primary .lv-0 li p#dateEvent {
            text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
        }

        .landing .transparent .nav-primary .logo-home img {
            filter: drop-shadow(0px 0px 5px rgba(255, 255, 255, 0.5));
        }
    }
