#header_login{
    align-items: center;
    background-color: var(--color-principal);
    display: flex;
    flex-direction: column;
    height: 40dvh;
    justify-content: center;
    row-gap: 10px;
}

    #header_login figure img{
        height: 100px;
    }

    #header_login h2{
        color: #EBECD7;
        margin: 0;
    }

main section{
    align-items: center;
    background-color: var(--color-principal) !important;
    height: 60dvh;
    margin-top: 0 !important;
    min-height: auto !important;
    padding: 0 !important;
}

    main section form {
        display: flex;
        flex: 1;
        flex-direction: column;
        background-color: var(--color-secundario);
        border-radius: 20px 20px 0 0;
        justify-content: center;
        margin: 0;
        padding: 0 40px;
        row-gap: 25px;
        width: 100%;
    }

        main section form article{
            display: flex;
            flex-direction: column;
            row-gap: 5px;
        }

            main section form article div{
                align-items: center;
                column-gap: 10px;
                display: flex;
            }

                section form article div ion-icon{
                    color: var(--color-fuente);
                    font-size: 30px;
                }

                section form article div label{
                    color: var(--color-fuente);
                    font-size: 20px;
                    font-weight: 500;
                }

                section form article input {
                    border: none;
                    background-color: var(--color-secundario);
                    border-radius: 12px;
                    box-shadow: var(--box-shadow);
                    color: var(--color-fuente);
                    font-size: 16px;
                    height: 50px;
                    padding: 15px;
                }
                
            main section form button{
                border-radius: 12px;
                border: none;
                background-color: var(--color-botones);
                color: var(--color-secundario);
                font-size: 18px;
                font-weight: 600;
                height: 50px;
            }

@media(min-width: 768px){
    main section form{
        border-radius: 20px;
        flex: none;
        padding: 40px;
        row-gap: 40px;
    }
}

@media(min-width: 768px) and (max-width: 1023px){
    main section form{
        width: 50%;
    }

        main section form article{
            row-gap: 10px;
        }
}

@media(min-width: 1024px){
    main section form{
        width: 25%;
    }

        main section form article{
            row-gap: 15px;
        }
}