/*Enfoque mobile first: en el código
vamos de lo más pequeño a lo más grande.
En diseño deberíamos arrancar de mobile,
pero en general un par de ajustes son suficientes.

Breakpoint  Class infix Dimensions
X-Small None  <576px (Por defecto sin @media query)

Small sm  ≥576px
Medium  md  ≥768px
Large lg  ≥992px
Extra large xl  ≥1200px
Extra extra large xxl ≥1400px

*/

/*Small sm  ≥576px*
Estamos poniendo la regla que para las pantallas a partir de x
tenga en cuenta tales o cuales atributos. Siempre van entre {  }
Como un bloque con sus propias reglas.
Todos los atributos se heredan de los tamaños menores, excepto que haya
regla.
*/
/*/*Small sm  ≥576px*/
@media screen and (min-width: 576px) {
}
/*Medium md  ≥768px*/
@media screen and (min-width: 768px) {
    .link-item.pipe::after, .toolbox .pipe::after {
    content: '|';
    padding: 1rem;
}
}
/*Large lg  ≥992px*/
@media screen and (min-width: 992px) {
  header nav, .featured-box {
    width: 50%;
    margin: 0 auto;
}
}
/*Extra large xl  ≥1200px. Generalmente hasta acá*/
@media screen and (min-width: 1200px) {
}
/*Extra extra large xxl  ≥ 1400px*/
@media screen and (min-width: 1400px) {
}