.hidden {
    display: none;
}

.header-logo-img{
    object-fit: contain;
    object-position: center;
    width: 100%;
    height: 100%;
}

.header-logo-link{
    height: 9vh;
    margin: auto;
    padding: 0.4vh 0;
}

#header {
    height: auto;
}
#header .navbar-section{
    height: auto;
}

.header-fixed #header {
    z-index: 3;
}

#footer{
    padding: 1rem;
}

.footer-custom{
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.footer-custom p{
    margin-bottom: 0;
    text-align: left;
}

.footer-groupname{
    font-size: 1.1em;
}

.footer-privacy{
    color: #acb3c2;
    font-size: 0.8em;
    font-style: italic;
}

.footer-privacy:visited{
    color: #acb3c2;
}

.footer-privacy:hover{
    text-decoration: none;
}

.footer-icons{
    display: flex;
}

.footer-icon{
    width: 30px;
    margin: 8px;
}

body #tarteaucitronRoot #tarteaucitronAlertBig{
    background-color: rgb(37, 51, 117);
}

.mobile-menu .button_container.active .top {
    background: #3085ee;
}

.mobile-menu .button_container.active .bottom {
    background: #3085ee;
}

/* body.header-fixed.header-animated #header.scrolled {
    height: 9vh;
} */

.dropmenu .connexion-menu{
    display: flex;
    align-items: center;
}

.treemenu .connexion-menu{
    display: flex;
    align-items: center;
}
.dropmenu .connexion-menu i{
    padding-left: 15px;
}

.dropmenu .connexion-menu .login-status a{
    padding-left: 5px;
}

.treemenu .connexion-menu .login-status a{
    margin-left: 5px;
}

.home-container{
    display: flex;
    justify-content: center;
    align-items: center;
}

.home-img{
    width: 100%;
}

.home-txt{
    width: 45%;
}

.home-txt p{
    margin: 8px;
}

.art-backbutton{
    background: white;
    border-radius: 10em;
    border-style: double;
    border-width: 3px;
    border-color: #454d5d;
    color: #454d5d;
    display: table;
    margin-left: auto;
    margin-right: auto;
    padding: 0.4em;
    user-select: none;
}

.art-backbutton:hover{
    cursor: pointer;
}

.page-directeur .art-container{
    display: flex;
    align-items: center;
    padding: 3vh 0px;
}

.page-directeur .art-img{
    width: 30%;
}

.page-directeur .art-txt{
    width: 70%;
}

.page-discographie .art-container{
    display: flex;
    align-items: center;
}

.page-discographie .art-img{
    width: 30%;
}

.page-discographie .art-txt{
    width: 70%;
}

.page-discographie .art-txt p{
    margin: 0;
}

.page-discographie .art-txt li{
    margin: 0;
}

.page-discographie .art-txt ol{
    margin-top: 0;
}

.page-historique .art-container{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row-reverse;
}

.page-historique .art-img{
    width: 100%;
}

.page-historique .art-txt{
    width: 60%;
}

/* .home-txt::after{

} */

.page-historique .art-txt p{
    margin-bottom: 1em;
}


.members-container-txt{
    display: flex;
    /* justify-content: space-evenly; */
    /* flex-direction: column; */
    /* flex-wrap: wrap; */
    align-items: center;

}

.members-container-img{
    display: flex;
    justify-content: center;
}

.members-container-img figure{
    margin: 0;
}


.members-img{
    margin: 0;
    /* max-width: 300px; */
    /* height: 500px; */

}



/* .members-img:hover{
    background-image: url(/images/IMG_5721_5.jpg);

} */

/* .members-txt{
    width: 60%;
} */

.members-container p{
    margin: 0;
}

.members-txt ul{
    margin: 0;
}

.page-galerie-html{
    overflow-y: hidden !important;
}

.page-galerie{
    overflow-y: auto !important;
    max-height: 100vh;
}

.page-galerie .gallery-event-img{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    align-items: center;
}

.page-galerie .gallery-event-img a{
    display: block;
    width: calc(15% - 20px);
    overflow: hidden;
    padding: 0.5%;
    aspect-ratio: 4/3;
}

.page-galerie .gallery-event-img img{
    height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: center;
}


.gallery-event-video{
    position: relative;

}

.gallery-event-video::after{
    position: absolute;
    left: 50%;
    top:50%;
    translate: -50% -50%;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40%;
    aspect-ratio: 1/1;
    color: #ffffffcf;
    content: "▶";
    font-size: 130%;
    border: 6px solid #ffffffcf;
    border-radius: 500px;

}


.agenda-event{
    display: flex;
    align-items: center;
    text-decoration: none;
}

.agenda-event:hover {
    text-decoration: none;
}

.agenda-old-event{
    font-style: italic;
}

.agenda-day{
    font-size: 3vw;
    padding: 0.25em 0.25em 0em 0.25em;
    margin: 0;
    color: #454d5d;
}

.agenda-month{
    font-size: 2vw;
    padding: 0.25em 0.25em 0em 0.25em;
    margin: 0;
    color: #454d5d;
}

.agenda-year{
    font-size: 1.5vw;
    padding: 0.25em 0.25em 0em 0.25em;
    margin: 0;
    color: #454d5d;
}

.agenda-time{
    font-size: 2vw;
    padding: 0em 0.25em;
    margin: 0;
    color: #454d5d;
    width: 100%;
    text-align: center;
}

.agenda-date{
    display: flex;
    align-items: center;
}

.agenda-descriptions{
    padding-left: 4vw;
    color: #454d5d;
}

.concert-day{
    font-size: 3vw;
    padding: 0.25em 0.25em 0em 0em;
    margin: 0;
    color: #454d5d;
}

.concert-month{
    font-size: 2vw;
    padding: 0.25em 0.25em 0em 0.25em;
    margin: 0;
    color: #454d5d;
}

.concert-year{
    font-size: 1.5vw;
    padding: 0.25em 0.25em 0em 0.25em;
    margin: 0;
    color: #454d5d;
}
.concert-time{
    font-size: 2vw;
    padding: 0em 0em 1em 0em;
    margin: 0;
    color: #454d5d;
    width: 100%;
    text-align: left;
}

.concert-date{
    display: flex;
    align-items: center;
}

/* .concert-img{
    height: 60vh;
}

.concert-img img{
    height: 100%;
    max-width: inherit;
} */

.concert-img img{
    max-height: 60vh;

}


.presentation-article{
    text-decoration: none;
}

.presentation-article:hover{
    text-decoration: none;
}

.presentation-txt-img{
    display: flex;
    align-items: center;
}

.presentation-descriptions p{
    color: #454d5d;
    padding-left: 10px;
}

.presentation-img{
    max-width: 175px;
    max-height: 175px;
}

.presentation-members-img{
    display: flex;
    max-height: 175px;
    max-width: 175px;
}

.linkstyle{
    display: block;
}


.infos-voueno p{
    margin: 0;
}

.overlay{
    background-color: white;
}

/* Tablet */
@media screen and (max-width: 1200px) {
    .home-container{
        flex-wrap: wrap;
    }
    .home-txt{
        width: 70%;
        text-align: center;
    }

    .footer-custom{
        flex-direction: column;
    }

    .footer-custom p{
        text-align: center;
    }

    .footer-icon{
        width: 25px;
        margin: 12px;
    }

    /* .footer-groupname{
        font-size: 1em;
    } */
    
    /* .footer-privacy{
        font-size: 0.7em;
    } */
    
    .art-container{
        flex-wrap: wrap;
        justify-content: center;
        
    }

    .art-txt{
        width: 70%;
        text-align: center;
    }

    .page-liens h3{
        text-align: center;
    }

    .page-liens a{
        text-align: center;
    }

    .page-discographie .art-txt li{
        text-align: left;
    }

    .members-container-txt{
        /* font-size: 0.5em; */
        flex-direction: column;

    }

    .members-container-txt figure{
        /* font-size: 0.5em; */
        /* max-height: 50vh; */
        /* object-fit: cover;
        object-position: center; */
        margin: 0;
    }

    .members-container-txt figure>img{
        /* font-size: 0.5em; */
        max-height: 40vh;
        width: 60vw;
        object-fit: cover;
        object-position: center;
    }

    .members-container-txt h4{
        font-size: 1em;
    }

    .art-title{
        text-align: center;
    }

    .page-galerie .gallery-event-img a {
        width: calc(30% - 20px);
    }

    .gallery-event-video::after{
        width: 42%;
        font-size: 200%;
        border: 7px solid #ffffffcf;
    }

    .agenda-day{
        font-size: 5vw;
        padding: 0.25em 0.25em 0em 0.25em;
        margin: 0;
        color: #454d5d;
    }
    
    .agenda-month{
        font-size: 4vw;
        padding: 0.25em 0.25em 0em 0.25em;
        margin: 0;
        color: #454d5d;
    }
    
    .agenda-year{
        font-size: 3vw;
        padding: 0.25em 0.25em 0em 0.25em;
        margin: 0;
        color: #454d5d;
    }
    
    .agenda-time{
        font-size: 4vw;
        padding: 0em 0.25em;
        margin: 0;
        color: #454d5d;
        width: 100%;
        text-align: center;
    }
    
    .concert-day{
        font-size: 5vw;
    }
    
    .concert-month{
        font-size: 4vw;
    }
    
    .concert-year{
        font-size: 3vw;
    }
    .concert-time{
        font-size: 4vw;
    }

}

/* MOBILE */
@media screen and (max-width: 768px) {
    .page-galerie .gallery-event-img a {
        width: calc(50% - 20px);

    }
}