.login {
    overflow: hidden;
}

.login p {
    color: var(--words-color);
}

.login .login_page {
    max-height: 1vw;
    overflow-y: hidden;
    width: 90vw;
    padding-left: 5vw;
    padding-right: 4vw;
    display: inline-block;
}
.login .login_page.active {
    max-height: 1000000vw;
    height: 100%;
}

.login input {
    width: 82vw !important;
}

.login .passField {
    position: relative;
}

.login .passField img {
    width: 6vw;
    padding: 5vw;
    padding-top: 3.25vw;
    padding-bottom: 3.25vw;
    position: absolute;
    right: 0vw;
    bottom: 1vw;
    filter: invert(var(--invert));
}

.login .logo {
    width: 15vw;
    margin-bottom: 15vw;
    margin-top: 15vw;
    filter: invert(var(--invert));
}

.login .main h1 {
    margin-bottom: 4vw;
}

.login .main .fields {
    margin-top: 20vw;
}

.login .main .main_button {
    width: 100%;
    margin-top: 6vw;
}

.login .forgot {
    color: var(--words-color);
    margin-top: 5vw;
    text-align: center;
    margin-bottom: 8vw;
}

.login .reset1 button, .login .reset3 button {
    width: 100%;
}

.login .reset .user {
    margin-top: 8vw;
}

.login p.error {
    color: rgb(255, 52, 52);
    text-align: center;
    display: none;
}