:root{
    --blanco: #FFFFFF;
    --oscuro: #212121;
    --primario: #FFC107;
    --secundario: #0097A7;
    --gris: #757575;
}

html{
    font-size: 62.5%;
}

body{
    font-size: 16px;
    font-family: 'Krub', sans-serif;
}

.titulo{
    text-align: center;
    font-size:  3.8rem;
}

.titulo span{
    font-size: 2rem;
}

.contenedor{
    max-width: 120rem;
    margin: 0 auto;
    
}

.navegacion-principal{
    display: flex;
    flex-direction: column;;
    justify-content: space-between;
}
.nav-bg{
    background-color: var(--secundario);
}

.navegacion-principal a{
    display: block;
    text-align: center;
    padding: 1rem;
    color: var(--blanco);
    text-decoration: none;
    font-size: 1rem;
    font-weight: 700;
} 

.navegacion-principal a:hover {
    background-color: var(--primario);
    color: var(--oscuro);
}


@media (min-width: 480px) { /*para celulares */
    h1{

    }
}
@media (min-width: 768px) { /** tablet **/
    .navegacion-principal{
        flex-direction: row;

    }
}

@media (min-width: 1140px) {/* para laptop y computadoras* escritorio*/
    
}

@media (min-width: 1400px) {
    
}