/* --------------------------------------------Acceuil---------------------------------------- */
*{

    & main {
        grid-template-rows:var(--10b) var(--5b) calc(var(--4b) + var(--demi-b));
        height:var(--abs-innerH-b-nav);
        row-gap:var(--2b);
        padding:0;
        padding-top:var(--b);
        overflow:visible;

        & .Acc_img_container{
            overflow:hidden;
            max-height:50em;
            min-height:270px;
            width:var(--innerW-b-nav);
            /* gap:var(--b); */
            grid-column:1;
            padding-top:var(--demi-b);
            display:flex;
            justify-content:center;
            margin:auto;
            & img{
                /* margin:var(--demi-b); */
                /* margin-bottom:var(--2b); */
                height:270px;
                max-width:98vw;
                               
            }
        }
        & section{
            display:flex;
            justify-items:center;
                align-items:center;
            &:nth-child(2){
                position:relative;
                grid-column:1;
                width:calc(100% - var(--nav));
                min-width:400px;
                justify-items:center;
                align-items:center;
                height:100%;


                & .acceuil{
                    width:fit-content;
                    margin:auto;
                    padding:var(--b);
                    border-radius:var(--b);
                    background-color:var(--Emphasis-color);
                    justify-content:center;

                    & h5{
                        position:relative;
                        justify-self:center;
                        text-align: center;
                        text-justify: center;
                        color:var(--BG-color);
                        /* text-wrap:nowrap; */
                    }
                    & h4{
                        position:relative;
                        padding:var(--quart-b);
                        justify-self:center;
                        text-align: center;
                        text-justify: center;
                        color:var(--BG-color);
                        text-wrap:nowrap;
                    }
                    & h2{
                        position:relative;
                        padding:var(--quart-b);
                        justify-self:center;
                        text-align: center;
                        text-justify: center;
                        color:var(--BG-color);
                        text-wrap:nowrap;
                    }

                    & #Txt_Acceuil
                    {
                        & *{
                            color:var(--BG-color);
                            font-family:var(--font);
                        }
                        /* font-size:var(--demi-b); */
                        font-family:var(--font);
                        line-height: var(--b);
                        font-weight:600;
                        padding:var(--demi-b);
                        text-align:center;
                        color:var(--BG-color);
                        min-width:200px;
                    }

                }
            }

            &:nth-child(3){
                position:relative;
                width:calc(100% - var(--nav));
                margin:0;
                grid-column:1/span 3;
                grid-row:3;
                z-index:50;
                & .Acc_link_list{
                    list-style-type:none;
                    margin:0;

                    & li{
                        position:relative;
                        display:flex;
                        margin:0;
                        padding:var(--quart-b);
                        background-color:var(--Button-color);
                        width:100%;
                        height:var(--b);
                        /* min-height:50px; */
                        align-items:center;
                        justify-content:center;
                        overflow:hidden;
                        transition-property:background-color;
                        transition-duration: var(--t);

                        &:hover{
                            background-color:white;
                            cursor:pointer;
                            & a
                            {
                                color:var(--Emphasis-color);

                            }


                        }
                        & a{
                            display:inline-block;
                            display:flex;
                            align-items:center;
                            text-decoration:none;
                            animation-fill-mode:forwards;
                            padding-left:var(--b);
                            width:100vw;
                            height:100%;
                            color:var(--BG-color);
                            font-size:var(--b);
                            &:first-child{
                                animation-delay:1s;
                                animation:animHeadline 2s ease-in-out;
                            }
                            &:nth-child(2){
                                animation-delay:2s;
                                animation:animHeadline 2s ease-in-out;
                            }
                            &:last-child{
                                animation-delay:3s;
                                animation:animHeadline 2s ease-in-out;
                            }
                        }
                    }
                }
            }
        }
    }
}

/* ================================MEDIA-QUERIES=========================================*/
/* ================================MEDIA-QUERIES=========================================*/
/* ================================MEDIA-QUERIES=========================================*/


@media screen AND (max-width:740px){
    main{
        position:relative;
        padding:0;
        padding-bottom:var(--nav-m);
        display:grid;
        margin:0;
        height:var(--abs-innerH-b);
        grid-template-columns:1fr;
        grid-template-rows:auto;
        width:100vw;

        align-items:center;
        gap:var(--b);

        & .Acc_img_container{
            margin:0;
            margin-top:var(--nav);
            display:flex;
            align-self:center;
            position:relative;
            height:var(--10b);
            grid-row:1;
            width:100vw;
            padding:0;
            img{
                height:auto;
                margin:0;
                &:first-of-type{
                    width:75%;

                }
                &:last-of-type{
                    width:25%;

                }
            }
        }

        & section{
            margin:0;
            width:var(--abs-innerW);
            &:nth-of-type(1){
                gap:0;
                img{
                    width:100%;
                    height:auto;
                }
            }
            &:nth-of-type(2){
                width:100vw;
                & .acceuil{
                    height:fit-content;
                    padding:var(--demi-b);
                    width:calc(100vw - var(--b));
                    
                    border-radius:0;
                    grid-row:2;
                    & #Nom_acceuil{
                        margin:auto;
                    }
                    & h5{
                        text-wrap:wrap;
                    }
                    & #Txt_acceuil{
                        color:var(--FG-color);
                        
                    }             
                }

            }
            
            &:last-of-type{
                height:fit-content;
                order:3;
                width:100vw;
            }
        }
        
    }

}