main {
    display: flex;
    justify-content: center;
    align-items: center;
}

#login_container {
    margin-top: 16vh;

    padding: 4vh 10vh;

    height: fit-content;
    width: fit-content;

    border: #2563ae 2px solid;

    border-radius: 24px;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4vh;

    background-color: white;
}

#login_logo_container {
    display: flex;
    justify-content: center;
    align-items: center;

    width: 100%;
}

#login_logo {
    max-height: 12vh;
    max-width: 100%;
    object-fit: contain;
}

.label_input_container {
    display: flex;
    flex-direction: column;
    width: 30vw;
}

.label_input_container input {
    outline: none;
    border: #2563ae 3px solid;
    border-radius: 12px;
    padding: 1vh;
    padding-right: 0.5vw;
    font-size: 2vh;
}

#forgot_password {
    padding: 0.5vh;
    text-align: right;
    font-style: italic;
    cursor: pointer;

    color: rgb(75, 75, 75);
    transition: color 0.3s ease;
}

#forgot_password:hover {
    color: rgb(145, 145, 145);
}

#togglePassword {
    position: absolute;

    margin-top: 1vh;
    padding: 0.6vh;
    right: 35.5vw;
    cursor: pointer;

    width: auto;
    height: auto;

    color: #2563ae;
    font-size: 2vh;
}

#iniciar_sesion {
    color: white;
    background-color: #2563ae;
    font-size: 2vh;

    width: 24vw;
    padding: 1.2vh;

    border: none;
    border-radius: 12px;

    cursor: pointer;

    position: relative;
    overflow: hidden;

    font-weight:bold;

    transition: width 0.3s ease;
}

#iniciar_sesion:hover #iniciar_sesion_after {
    visibility: visible;
    margin-left: 1vw;
    opacity: 1;
    width: 100%;
}

#iniciar_sesion_after {
    width: 0%;
    margin-left: 0px;
    opacity: 0;
    color: white;
    font-size: 1.2rem;

    transition: margin-left 0.3s ease, opacity 0.3s ease;
}

@media (max-width: 720px) {
    #login_container {
        padding-left: 4vh;
        padding-right: 4vh;
    }

    #login_container button {
        width: 60vw;
    }

    .label_input_container {
        width: 70vw;
    }

    #togglePassword {
        right: 16vw;
    }
}