.area-login{
    --bs-gutter-x: 0;
    align-items: center;
}

.esquerda{
    text-align: center;
}

.direita{
    padding: 8% 0;
    background-color: rgb(255, 100, 100);
}

.direita_cadastro{
    padding: 8% 0;
    background-color: #62C2A2;
}

.window-login{
    background-color: white;
    border: solid 5px rgb(255, 100, 100);
    border-radius: 15px;
    width: 50%;
}

.window-register{
    background-color: white;
    border: solid 5px #62C2A2;
    border-radius: 15px;
    width: 70%;
}
.window-forgot{
    background-color: white;
    border: solid 5px #62C2A2;
    border-radius: 15px;
    width: 70%;
}
.esqueceuSenha{
    padding: 10px 20px;
    border: 1px solid;
    border-radius: 5px;
    border-color: black;
    background-color: white;
    color: black;
    transition: 0.2s;
}
.esqueceuSenha:hover{
    background-color: white;
    color: #62C2A2;
    border-color: #62C2A2;
}

.window-redefiniu{
    background-color: white;
    border: solid 5px rgb(255, 100, 100);
    border-radius: 15px;
    width: 70%;
}

.redefiniuSenha{
    padding: 10px 20px;
    border: 1px solid;
    border-radius: 5px;
    border-color: black;
    background-color: white;
    color: black;
    transition: 0.2s;
}
.redefiniuSenha:hover{
    background-color: white;
    color: rgb(255, 100, 100);
    border-color: rgb(255, 100, 100);
}

@media only screen and (max-width: 767px) {

    .esquerda{
        padding: 5%;
    }

    .window-register{
        width: 95%;
    }
}

.form_login{
    margin: 8%;
}

.entrar{
    text-align: center;
}

.entrar > button{
    margin-top: 2rem;
    width: 50%;
    color: white;
    border: solid 1px rgb(255, 100, 100);
    border-radius: 15px;
    background-color: rgb(255, 100, 100);
}

.cadastrar{
    text-align: center;
}

.cadastrar > button{
    width: 50%;
    color: white;
    border: solid 1px #62C2A2;
    border-radius: 15px;
    background-color: #62C2A2;
}