* {
    padding: 0px;
    margin: 0px;
    list-style: none;
    font-family: 'Lato';
    text-decoration: none;
    box-sizing: border-box;
    width: 100%;
}

img{
    max-width: 100%;
    height: auto;
}

header #imagen{
    padding: 0% 45% 0% 45%;
    background-color: white;
}

h1{
    font-family: 'Lato';
    background-color: #FBBA0E;
    color: white;
    font-size: 30px;
    font-weight: 700;
    text-align: center;
}

a{
    font-family: 'Lato';
    color: #FBBA0E;
    border-radius: 10px;
}

#sitio-web{
    padding: 5% 0% 5% 0%;
}

#sitio-web a{
    color: white;
    background-color: #E72585;
}

#app{
    padding: 0% 0% 5% 0%;
}

#app a{
    color: white;
    background-color: #674192;
}

/** TITULOS **/

h2{
    font-family: 'Lato';
    font-size: 20px;
    font-weight: 400;
    text-align: center;
    padding: 1%;
}

h2 a{
    padding: 1%;
    width: 100%;
}

h3{
    font-family: 'Lato';
    font-size: 16px;
    font-weight: 400;
    text-align: center;
    padding: 1%;
}

h3 a{
    padding: 3%;
    width: 100%;
}

h4{
    font-family: 'Lato';
    font-size: 14px;
    font-weight: 400;
    text-align: center;
    padding: 1%;
}

h4 a{
    padding: 4%;
    width: 100%;
}

h5{
    font-family: 'Lato';
    font-size: 12px;
    font-weight: 400;
    text-align: center;
    padding: 1%;
}

h5 a{
    padding: 5%;
}

/** NIVELES **/

.nivel-1{
    display: flex;
    text-align: center;
    padding: 1%;
}

.nivel-2{
    display: flex;
    text-align: center;
    padding: 1%;
}

.nivel-3{
    display: flex;
    text-align: center;
    padding: 1%;
}

.nivel-4{
    display: flex;
    text-align: center;
    padding: 1%;
}

#app .nivel-2 h3 a{
    padding: 1% 3%;
}

/** FOOTER **/

footer{
    font-family: 'Lato';
    background-color: #5AB257;
    color: white;
    font-weight: 300;
    font-size: 14px;
    font-style: italic;
    text-align: center;
    padding: 2% 0% 3% 5%;
}

/* RESPONSIVE */

@media (max-width:50em) {
    
    header #imagen{
        padding: 0% 30% 0% 30%;
    }
    
    h1{
        font-size: 20px;
        padding: 1%;
    }
    
    h2 a{
        padding: 2%;
    }
    
    h3 a{
        font-size: 14px;
        padding: 2%;
    }
    
    h4 a{
        font-size: 12px;
        padding: 2%;
    }
    
    h5 a{
        font-size: 10px;
        padding: 2%;
    }
    
    #sitio-web a{
        color: #E72585;
        background-color: white;
    }
    
    #app a{
        color: #674192;
        background-color: white;
    }
    
    .nivel-1{
        display: block;
        padding: 3%;
    }
    
    .nivel-2{
        display: block;
        padding: 3%;
    }
    
    .nivel-3{
        display: block;
        padding: 3%;
    }
    
    .nivel-4{
        display: block;
        padding: 3%;
    }
    
    footer{
            font-size: 11px;
            padding: 4%;
        }
    
}