body input{
    font-size: 14px;
}

.logo{
    position: absolute;
    top: 17.6%;
    width: 12.5vh;
    height: auto;
    left: 50%;
    transform: translate(-50%, -50%);
    padding-right: 2.36%;
}

.login-card{
    margin-left: 34.44%;
    background-color: white;
    border-radius: 20px;
    width: 30.42%;
    margin-top: 27.64vh;
    height: 52.83vh;
    box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.5);
}

.login-title{
    padding-top: 5.17vh;
    color: #262624;
    letter-spacing: -0.95px;
    line-height: 34px;
    text-align: center;
    margin: 0px;
    font-family: 'Poppins';
    font-weight: bold;
}

.login-form-div{
    height: 17.77vh;
    padding-left: 13.47%;
}

.login-form-label{
    color: #262624;
    font-family: 'Poppins';
    font-weight: bold;
    line-height: 16px;
    text-align: left;
    position: absolute;
    left: 39.1%;
}

.user{
    top: 43.16vh;
}

.password{
    top: 53.13vh;
}

.form-input{
    border-radius: 22.5px;
    border: 1px solid #D5DCE5;
    position: absolute;
    width: 20.5%;
    height: 4.89vh;
    padding-left: 1.73%;
    color: #D5DCE5;
    line-height: 17px;
    text-align: left;
}

.user-input{
    top: 47.09vh;
    font-family: 'Poppins';
    font-weight: 200; 
    line-height: 17px;
}

.password-input{
    top: 57.05vh;
    font-family: 'Poppins';
    font-size: 29px;
    font-weight: bolder;
    line-height: 35px;
    text-align: left;
}

.forgot-div{
    position: absolute;
    top: 61.85vh;
    text-align: center;
    width: 22.36%;
}
.forgot-text{
    position: relative;
    bottom: 0.8vh;
    margin: 0px;
    color: #4287CE;
    font-family: 'Poppins';
    font-weight: 200;
    line-height: 14px;
}

.button-submit-login{
    position: absolute;
    top: 66.89vh;
    width: 22.36%;
    text-align: center;
}

.button-submit-signin{
    position: absolute;
    top: 72.56vh;
    width: 22.36%;
    text-align: center;
    transition: all ease 300ms;
}

.submit{
    border-radius: 38px;
    width: 72.06%;
    height: 4.69vh;
    border: 1px solid #4287CE;
    font-family: 'Poppins';
    font-weight: 500;
}

.submit-login{
    color: #FFFFFF;
    background-color: #4287CE;
    line-height: 17px;
}

.submit-signin{
    color: #4287CE;
    background-color: #FFFFFF;
    line-height: 17px;
}

::placeholder { 
  color: #D5DCE5;
  opacity: 1;

}

:focus {
  outline: 0;
  outline-color: transparent;
  outline-style: none;
}

#icon-eye {
    position: relative;
    top: -30px;
    right: -40%;
}

/* Breakpoints Responsive */

@media screen and (max-width: 900px){
    .login-card{
        margin-left: 24.44%;
        width: 50.42%;
    }
    .login-form-label{
        left: 32.6%;
    }
    .form-input{
        width: 33.5%;
    }
    .forgot-div{
        width: 35.36%;
    }
    .button-submit-login{
        width: 35.36%;
    }
    .button-submit-signin{
        width: 35.36%;
    }
    submit{
        font-size: 88%;
    }
}

@media screen and (max-width: 600px){
    body{
        width: 100%;
        height: 100%;
        display:grid;
    }
    .logo{
        top: 60px;
        width: 16.5vh; 
        min-width: 104px;
    }
    .login-card{
        margin-top: 122px;
        margin-left: 8.3%;
        width: 83.33%;
    }
    .login-title{
        padding-top: 28px;
        font-size: 150%;
    }
    .login-card{
        height: 438px;
    }
    .login-form-title{
        padding-left: 6.6%;
    }
    .login-form-label{
        left: 16.4%;
        font-size: 75%;
        position: inherit;
        margin-bottom: 8px;
    }
    .user{
        top: 223px;
    }
    .password{
        top: 307px;
    }
    .user-input{
        top: 259px;
        font-size: 81%;
    }
    .password-input{
        top: 342px;
        font-size: 130%;
    }
    .login-form-div{
        padding-left: 6.67%;
        margin-top: 40px;
    }
    .form-input{
        width: 84.5%;
        padding-left: 7.1%;
        min-height: 40px;
        position: inherit;
    }
    .forgot-div{
        width: 93.33%;
        top: 383px;
        position: inherit;
        margin-bottom: 29.55px;
    }
    .button-submit-login{
        width: 93.33%;
        top: 434px;
        position: inherit;
        padding-right: 6.67%;
        margin-bottom: 8px;
    }
    .button-submit-signin{
        width: 93.33%;
        top: 492px;
        position: inherit;
        padding-right: 6.67%;
    }
    .submit{
        width: 72.58%;
        height: 39px;
    }
    .forgot-text{
        font-size: 62.5%;
    }
    .footer-copyright{
        margin-top: 4vh;
        padding: 0px 18%;
        margin-bottom: 4vh;
    }
    .submit-login{
        font-size: 75%;
    }
    .submit-signin{
        font-size: 75%;
    }
}
