body {
    display: grid;
    place-items: center;
    height: 100vh;
    background: #00B7E4;
}

.login-container {
    display: flex;
    /* width: 627px; */
    padding: 40px 160px 40px 160px;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    border-radius: 20px;
    background: #FFF;
        zoom: 75%;
            aspect-ratio: 7 / 1;
}
#togglePassword{
    cursor: pointer;
}

.footer-links {
    display: flex;
    height: 40px;
    align-items: center;
    gap: 28px;
}

.login-container img {
    width: 163px;
    border-radius: 20px;

}

.login-container h2 {
    color: #383D3A;
    font-family: Outfit;
    font-size: 35px;
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
        margin: 0;
}

.form-control {
    border-radius: 10px;
}
.login_btn:disabled{
background: #A4A4A7;
}
.login_btn:not(:disabled){
   background: #FF8189; 
}
.login_btn{
    border-radius: 30px;
    width: 100%;
 border-radius: 100px;

    margin-top: 32px;
   border: none;
    display: flex;
height: 40px;
padding: 0px 16px;
justify-content: center;
align-items: center;
gap: 16px;
align-self: stretch;
color: var(--Font-White, #FFF);
text-align: center;
font-family: Mulish;
font-size: 16px;
font-style: normal;
font-weight: 700;
line-height: normal;
text-transform: capitalize;
}
input::placeholder {
color:  #707C7E;
font-family: Mulish;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 120%; /* 21.6px */
}


.introtext p {
    color: #383D3A;
    text-align: center;
    font-family: Mulish;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 120%;
    /* 21.6px */
        margin: 0;
    width: 413px;
}

.logincontent {
    width: 413px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 32px;
}

.introtext {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    align-self: stretch;
}

.footer-links a {
    color: #707C7E;
    font-family: Mulish;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 120%;
    /* 19.2px */
    text-decoration: none;
}
form>div{
    display: flex;
flex-direction: column;
align-items: flex-start;
gap: 4px;
align-self: stretch;
}
form {

    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 32px;
    align-self: stretch;
}

form label {
    color: #383D3A;
    font-family: Mulish;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 120%;
    /* 19.2px */
    margin: 0px !important;
}

form input {
    display: flex;
    height: 44px;
    padding: 8px 16px;
    align-items: center;
    align-self: stretch;
    border-radius: 12px;
    border: 1px solid  #B3B6C0;
    background:  #FFF;
}