:root{
    --fuenteHeading: 'PT Sans', sans-serif;
    --fuenteParrafos: 'Open Sans', sans-serif;

    --primario: #784D3C;
    --blanco: #ffffff;
    --negro: #000000;
    --gris: #e1e1e1;
}

/*dice el profe que no debe de faltar el código de: pail_irish*/
/* apply a natural box layout model to all elements, but allowing components to change */
html {
    box-sizing: border-box;
    /*se define el tamaño de la fuente, para hacer que 1rem = 10px*/
    font-size: 62.5%;
  }

  /*selectores universales, seleccionan todos los elementos*/
*, *:before, *:after {
    box-sizing: inherit;
}

body{
    font-family: var(--fuenteParrafos);
    font-size: 1.6rem;
    line-height: 2;
}

/*Globales*/
.contenedor{
    max-width: 100rem; /*este espacio se va a utilizar mientras haya ese espacio disponible*/
    width: 85%; /*este width es para dispositivos móviles. para que el texto no quede tan
                pegado a las orillas. y se utiliza para cuando las pantallas son menores a los 
                100rem definidos en max-width*/
    margin: 0 auto;
}

a{
    text-decoration: none;
}

h1, h2, h3, h4{
    font-family: var(--fuenteHeading);
    line-height: 1.2;
}

h1{
    font-size: 4.8rem;
}

h2{
    font-size: 3.5rem;
}
h3{
    font-size: 3rem;
}
h4{
    font-size: 2.8rem;
}

img{
    max-width: 100%;
}

/* Utilidades*/
.no-margin{
    margin: 0;
}

.no-padding{
    padding: 0;
}

.centrar-texto{
    text-align: center;
}