@media screen and (max-width:1024px) {


    /*bOUTONS INTERACTIFS*/

    .button {
        position: absolute;
        cursor: pointer;
        transition: opacity 0.35s, transform 0.35s;
        background-color: #FFFFFF;
        border: solid #FFFFFF 1.5rem;
        border-radius: 5rem;
        padding: .5rem 1rem .5rem 1rem !important;
        text-align: center;
        vertical-align: middle;
        font-size: 1rem !important;
        color: #41555C;
    }

    header {
        position: fixed;
        z-index: 1000;
        width: 100%;
        height: 10rem;
        margin: 0;
        padding: 0;
        background-color: #3DC39E;
        top: 0;
    }


    .side-nav {
        display: none;

    }

    .mobile-trigger {
        display: block;
        margin-right: 1em;
        cursor: pointer;
    }

    .menu-trigger{
        position: fixed;
        top: 3rem;
        left: 3rem;
    }

    .mobile-trigger input[type="checkbox"] {
        display: none;
    }

    .mobile-trigger input[type='checkbox']:checked + nav {
        display: block;
        animation: opacite .5s;

    }

    @keyframes opacite {
        0%{
            opacity: 0;
        }
        100%{
            opacity: 100%;
        }
    }


    /*main*/
    main{
        padding: 0;
    }

    .contenu {
        margin : 0 3rem 0 3rem;

    }

    .equipe{
        justify-content: center;
    }

    .equipe div{
        text-align: center;
    }

    #wrapper{
        width: 100vw;
        height: 100vh;

    }

    .container{
        height: 100vh;
        width: 95vw;

    }

    body{
        object-fit: initial!important;
        position: relative!important;
        /*top: 0px !important;*/
        /*right: 0px !important;*/
        /*bottom: 0px !important;*/
        /*left: 0px !important;*/
        /*box-sizing: border-box !important;*/
        /*min-width: 0px !important;*/
        /*max-width: none !important;*/
        /*min-height: 0px !important;*/
        /*max-height: none !important;*/
        /*width: 100% !important;*/
        /*height: 100% !important;*/
        /*transform: none !important;*/
        /*margin: 0px !important;*/
    }

}

@media screen and (max-width:1650px) {
    #wrapper{
        width: 100vw;
        height: 100vh;

    }

    .container{
        height: 100vh;
        width: 95vw;

    }

}

@media screen and (max-width:1500px) {
    .button {
        position: absolute;
        cursor: pointer;
        transition: opacity 0.35s, transform 0.35s;
        background-color: #FFFFFF;
        border: solid #FFFFFF 1.5rem;
        border-radius: 5rem;
        padding: 1rem 2rem 1rem 2rem !important;
        text-align: center;
        vertical-align: middle;
        font-size: 1.5rem !important;
        color: #41555C;
    }
}
