@media only screen and (max-width: 500px) {
    main {
        min-height: 0px;
    }

    #boxLangue-responsive {
        width: 100%;
        margin-right: 50px;
        align-items: center;
        justify-content: end;
        display: flex;
    }

    #box-fiche {
        width: 100% !important;
        height: 400px;
    }

    #btnOpenClose {
        z-index: 55 !important;
    }

    #boxUser-responsive {
        width: 100%;
    }

    #connection > a {
        width: 100%;
    }

    #conteneur-fiche {
        width: 95%;
        margin-top: 0;
        padding: 120px 0 10px 0;
        margin-bottom: 0;
    }

    .div-connectes input {
        width: 65%;
    }

    #bouton-valider {
        width: 250px !important;
    }

    #imageSwame {
        z-index: 1;
    }

    .register-box {
        height: 80vh;
        object-fit: cover;
        object-position: left;
    }

    #choix-fiche > h3 {
        font-size: x-large;
    }

    .title {
        font-size: larger;
    }

    .div-connectes > input {
        font-size: small;
    }
}

@media only screen and (max-width: 900px) and (min-width: 501px) { 

    main {
        height: auto !important;
    }

    .register-box {
        height: 160vh;
        object-fit: cover;
    }

    .div-connectes > input {
        width: 80%;
    }

    #choix-fiche > h3 {
        font-size: x-large;
    }

    .title {
        font-size: larger;
    }
}