* {
    margin: 0;
    padding: 0;
}

body {
    background-color: #212121;
}

#page {
    margin: 7% 30% 0% 30%;
    width: auto;
    height: 100%;
    border: solid 1px white;
    padding: 15px;
}

label {
    color: white;
}

#connexion {
    margin: 0% 2% 3% 2%;
    width: auto;
    height: 1fr;
    padding: 10px;
}

label.connexion {
    margin-left: 17%;
    font-size: 18px;
    display: flex;
}

input.connexion_value {
    width: 50%;
    background-color: #eeeeee;
    border: solid 2px rgb(230, 230, 230);
    border-radius: 3px;
}

#email {
    margin-left: 8%;
    margin-top: -0.4%;
}

#pwd {
    margin-left: 4.5%;
    margin-top: -0.4%;
}

img {
    width: 80%;
    margin-left: 12.5%;
}


/* Lien vers la liste de comptes rendus */

#connect {
    margin-left: 38%!important;
    margin-top: 4%;
    width: 12em;
    background-color: white;
    color: black;
    border-radius: 1em;
    padding: 2%;
    border-left: white 1px solid;
    transition: 1s;
    font-size: 18px;
}

#connect:hover {
    background-color: rgb(207, 208, 209);
}

@media all and (max-width: 1300px) {
    #page {
        margin: 0% 25% 0% 25%;
        width: auto;
        height: 100%;
        border: solid 1px white;
        padding: 15px;
    }
    #email {
        margin-left: 14%;
        margin-top: -2%;
    }
    #pwd {
        margin-left: 8%;
        margin-top: -2%;
    }
    input.connexion_value {
        width: 60%;
        background-color: #eeeeee;
        border: solid 2px rgb(230, 230, 230);
        border-radius: 3px;
    }
    label.connexion {
        margin-left: 9.5%;
        font-size: 18px;
        display: flex;
    }
    #connect {
        margin-left: 28%!important;
        margin-top: 8%;
        width: 12em;
        background-color: white;
        color: black;
        border-radius: 1em;
        padding: 2%;
        border-left: white 1px solid;
        transition: 1s;
        font-size: 18px;
    }
}

@media all and (max-width: 800px) {
    #page {
        margin: 20% 3% 0% 3%;
        width: auto;
        height: 100%;
        border: solid 1px white;
        padding: 15px;
    }
    #email {
        margin-left: 15.25%;
        margin-top: -2%;
    }
    #pwd {
        margin-left: 10%;
        margin-top: -2%;
    }
    input.connexion_value {
        width: 60%;
        background-color: #eeeeee;
        border: solid 2px rgb(230, 230, 230);
        border-radius: 3px;
    }
    label.connexion {
        margin-left: 5%;
        font-size: 18px;
        display: flex;
    }
    #connect {
        margin-left: 29%!important;
        margin-top: 8%;
        width: 12em;
        background-color: white;
        color: black;
        border-radius: 1em;
        padding: 2%;
        border-left: white 1px solid;
        transition: 1s;
        font-size: 18px;
    }
}