#login-form {
    background-color: var(--grey-color-3);
    padding: 20px;
    border-radius: 10px;
    justify-self: center;
}

#login-form .form-group {
    display: grid;
    justify-items: flex-start;
}

#login-form .form-control-label {
    width: 300px;
    text-align: start;
}

/* Permet de mettre les inputs form sur la meme longueur */
.input-group {
    display: ruby-text;
}

.input-group.focus {
    outline: none !important;
}

#login-form .form-control {
    color: var(--secondary-color);
    width: 300px;
    height: 44px;
    border-radius: 10px;
    border: 2px #23374c80 solid;
    background-color: var(--grey-color-6);
    gap: 0;
}

#login-form .form-control:focus {
    color: #232323;
    background-color: #fff;
    outline: .1875rem solid var(--primary-color);
    border-color: var(--primary-color);
}

#login-form .form-control-label {
    font-size: 20px;
}

#login-form .form-btn {
    display: block;
    width: 446px;
    height: 65px;
    font-size: 24px;
    margin-top: 30px;
    float: none !important;
}

#login-form .form-footer {
    padding-bottom: 30px;
}


/* Mobile */
@media (min-width: 300px) {


    .form-control {
        width: 250px;
    }

    .form-btn {
        width: 250px;
        height: 45px;
        font-size: 18px;
    }
}

/* Tablette */
@media (min-width: 768px) {


    .form-control-comment {
        display: flex;
        width: 300%;
    }


}

/* Ordinateur */
@media (min-width: 1500px) {

    .address-form,
    .customer_form,
    .register-form {
        max-width: 100%;
    }

}