:root{
    --blanco: #ffffff;
    --oscuro: #212121;
    --primario: #2596be;
    --primarioOscuro: #07519f;
    --secundario:#42aede;
    --secundarioOscuro: #478fba;
   
  
    --fuente-principal: 3.8rem;
}

/*---------------------------Universales------------------------------*/
html{
    font-size: 62.5%;
    box-sizing: border-box;
    scroll-snap-type: y mandatory;
}
  
/*.servicios,
  .navegacion-principal,
  .formulario
  {
    scroll-snap-align: center;
    scroll-snap-stop: always;
}*/
  
*, *:before, *:after {
    box-sizing: inherit;
}



body{
    font-size: 16px;
    font-family: 'Krub', sans-serif;
    background-image: linear-gradient(to top, var(--grisClaro) 0%, var(--blanco) 100%);
  }



.contenedor{
    max-width: 120rem;
    margin: 0 auto;
    
}
  
h1{
    font-size: var(--fuente-principal);
}
  
h2{
    font-size: 2.8rem;
}
  
h3{
    font-size: 1.8rem;
}
  
h1,h2,h3 {
    text-align: center;
}
  
h1.titulo span{
    font-size: 2rem;
}
  
.w-sm-100{
    width: 100%;
}
  
@media(min-width: 768px){
    .w-sm-100{
        width: auto;
    }
}
  
.flex{
    display: flex;
}
  
.alinear-derecha{
    justify-content: flex-end;
}

.alinear-centro{
    justify-content: center;
}
/*---------------------------Header------------------------------*/
img, video {
    max-width: 100%;
    height: auto;
}
  
.imagenLogo{
    display: flex;
    justify-content:space-around;
    align-items: center;
}

/*---------------------------Navegacion------------------------------*/

.nav-bg{
    background-color: var(--primarioOscuro);
    border-radius: 3rem;   
}
  
.navegacion-principal{
    display: flex;
    flex-direction: column;
}
  
@media(min-width: 480px){
    .navegacion-principal{
        flex-direction: row;
        justify-content: space-between;
    }
}

.navegacion-principal a{
    display: block;
    text-align: center;
    color: var(--blanco);
    text-decoration: none;
    font-size: 2rem;
    font-weight: 700;
    padding: 1.8rem;
    padding-bottom: -1rem;
 
}
  
.navegacion-principal a:hover{
    background-color: var(--blanco);
    color: var(--primarioOscuro);
}


  