/* reset */

*{
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
}

main {
    background-color: #DADADA;
}


/* main */

    .portada-mobile {
        width: 100%;
    }

    .portada-desktop {
        display: none;
    }

    .registro {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 100px;
        max-width: 1200px;
        margin: 0 auto;
        padding: 20px;
    }
    
    .detalles, .formulario {
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .detalles {
        flex-direction: column;
        gap: 20px;
    }
        
    .detalles img {
        max-width: 100%;
        height: auto;
    }


        /* main responsive */

        @media screen and (min-width:768px) {
            
            header img {
                height: 50px;
            }

            .portada-mobile {
                display: none;
            }

            .portada-desktop {
                display: initial;
                width: 100%;
            }           
        
            .registro {
                flex-direction: row;
                justify-content: center;
            }

            .detalles, .formulario {
                flex: 1;
            }
        
        }

/* footer */

footer {
    background-color: #0A32A6;
    padding: 20px;
}

footer img {
    height: 50px;
}

.footer-legales {
    color: white;
    font-size: 10px;
    font-family: "articulat-cf", sans-serif;
    font-weight: 400;
    font-style: normal;
    display: inline;
}

.footer-rrss {
    display: none;
}

        /* footer responsive tablet */

        @media screen and (min-width:768px) {

        footer {
            display: grid;
            grid-template-columns: repeat(2,1fr);
        }

        .footer-legales p {
            padding-bottom: 10px;
        }

        .footer-der {
            text-align: right;
        }

        .footer-rrss {
            display: initial;
        }

        .footer-rrss p {
            display: inline;
            color: white;
            font-size: 15px;
            font-family: "articulat-cf", sans-serif;
            font-weight: 400;
            font-style: normal;
        }

        .footer-rrss img {
            height: 15px;
        }
        }