@import url('https://fonts.googleapis.com/css2?family=Kanit&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Play&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Amatic+SC:wght@700&display=swap');
*{    margin: 0;
    box-sizing: border-box;
}

.general{
    background-image: url(../img/2255.jpg);
    background-color: rgb(22, 170, 170);
    width: 100vw;
    min-height: 100vh;
}

.cabecera{
    width: 100%;
    height: 12vh;
    background-color: rgb(107, 221, 221);
    text-align: center;
    position: fixed;
    top: 0;
}

.botonera{
    width: 90vw;
    height: 12vh;
    font-family: 'Kanit', sans-serif; 
    margin: auto;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;

}
    .pie_pagina{  
    width: 100%;
    height: 6%;
    background-color: rgb(107, 221, 221);
    text-align: center;
    /* Para fijar el pie de pagina */
    position: fixed;
    bottom: 0;
}

.principal{
    width: 90vw;
    margin: auto;
    margin-top: 12vh;
    margin-bottom: 6vh;
    height: 100vh;
    padding-top: 10vh;
    display: flex;
    flex-wrap: wrap;
    }

    .presentacion{
        width: 100%;
        height: 100%;
        background-color: rgb(93, 93, 248);
    }

    .titulo{
        width: 100%;
        height: 100%;
        margin: auto;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        font-size: 1.5rem;
        text-align: center;
        font-family: 'Play', sans-serif;
        }

        .conociendome{
            width: 100%;
            height: 100%;
            background-color: rgb(235, 123, 32);
            font-size: 2rem;
            text-align: center;
            margin: auto;
            justify-content: center;
            font-family: 'Amatic SC', cursive;
        }

        .izq{
            margin-left: 5%;
            text-align: left;
            
        }

        .illia{
            width: 100%;
            height: 100%;
            background-color: rgb(216, 53, 53);
            font-size: 2rem;
            text-align: center;
            margin: auto;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            font-family: 'Play', sans-serif;
        }

        .futuro{
            width: 100%;
            height: 100%;
            background-color: rgb(227, 241, 99);
            font-size: 2rem;
            text-align: center;
            margin: auto;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            font-family: 'Play', sans-serif;
        }

        .contactos{
            width: 100%;
            height: 100%;
            background-color: rgb(245, 113, 201);
            font-size: 2rem;
            text-align: center;
            margin: auto;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            font-family: 'Play', sans-serif;
        }