.login{
    display: flex;
    justify-content: center;
    height: 100vh;
}


.login .link-daftar{
    color: #192252;
    font-weight: 600;
}

.login .login-box{
    padding: 24px;
    width: 450px;
    border: 1px solid rgba(1, 1, 1, 0.136)
}

.login .btn-login{
    background-color: #192252;
    color: white;
    font-weight: 600;
}

.login .btn-login:hover{
    color:white;
    background-color: #2A3563;
}

.login .btn-brand{
    padding: 12px 32px;
    border-radius: 100px;
    height: fit-content;
    width: fit-content;
    color: white;
    background-color: #C62F27;
    font-weight: 600;
    text-decoration: none;
    font-size: 16px;
    border: none;
}

.login .btn-brand:hover{
    background-color: #AA1C21;
    color: white;
}

.login .forget-password{
    color: #2A3563;
}


@media (max-width: 768px) {
    .login .login-box{
        padding: 24px;
        width: 60%;
        border: 1px solid rgba(1, 1, 1, 0.136)
    }
}

@media (max-width: 576px){
    .login .login-box{
        padding: 24px;
        width: 90%;
        border: 1px solid rgba(1, 1, 1, 0.136)
    }
}


/* forget password page */
.forget{
    display: flex;
    justify-content: center;
    height: 100vh;
}


.forget .link-daftar{
    color: #192252;
    font-weight: 600;
}

.forget .forget-box{
    padding: 24px;
    width: 100%;
    border: 1px solid rgba(1, 1, 1, 0.136)
}

.forget .btn-forget{
    background-color: #192252;
    color: white;
    font-weight: 600;
}

.forget .btn-forget:hover{
    color:white;
    background-color: #2A3563;
}

.forget .btn-brand{
    padding: 12px 32px;
    border-radius: 100px;
    height: fit-content;
    width: fit-content;
    color: white;
    background-color: #C62F27;
    font-weight: 600;
    text-decoration: none;
    font-size: 16px;
    border: none;
}

.forget .btn-brand:hover{
    background-color: #AA1C21;
    color: white;
}

.forget .forget-password{
    color: #2A3563;
}

.input-password{
    width: 100%;
    border: none;
}

.input-password:focus{
    outline: none;
}

.btn-eye{
    cursor: pointer;
    border: none;
    background-color: transparent;
}

.btn-eye:focus{
    outline: none;
}


@media (max-width: 768px) {
    .forget .forget-box{
        padding: 24px;
        width: 60%;
        border: 1px solid rgba(1, 1, 1, 0.136)
    }
}

@media (max-width: 576px){
    .forget .forget-box{
        padding: 24px;
        width: 90%;
        border: 1px solid rgba(1, 1, 1, 0.136)
    }
}