/*=== FUENTES ===*/

@font-face {
  font-family: 'Bolivar';
  src: url('../fonts/Bolivar-Light.woff2') format('woff2');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Bolivar';
  src: url('../fonts/Bolivar-Light-Italic.woff2') format('woff2');
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Bolivar';
  src: url('../fonts/Bolivar-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Bolivar';
  src: url('../fonts/Bolivar-Italic.woff2') format('woff2');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Bolivar';
  src: url('../fonts/Bolivar-SemiBold.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Bolivar';
  src: url('../fonts/Bolivar-SemiBold-Italic.woff2') format('woff2');
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Bolivar';
  src: url('../fonts/Bolivar-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Bolivar';
  src: url('../fonts/Bolivar-Bold-Italic.woff2') format('woff2');
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Bolivar';
  src: url('../fonts/Bolivar-ExtraBold.woff2') format('woff2');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Bolivar';
  src: url('../fonts/Bolivar-ExtraBold-Italic.woff2') format('woff2');
  font-weight: 800;
  font-style: italic;
  font-display: swap;
}

/*=== FIN FUENTES ===*/

:root {
  --fuente: 'Bolivar';
  --boton__radius: 4px;
  --boton__radiusPill: 2rem;
  --migaDePan__margenY: .6rem;
  --menu__tamano: 260px;
  --marco__tamanoX: .5rem;
  --marco__tamanoY: .5rem;
  --encabezado__alto: 1px;
  --marco__redondeado: .5rem;
  --marco__sombra: 0 1px 7px hsla(0, 0%, 0%, .3);

  --calififcarBoton__background: hsl(38, 77%, 47%);
  --calififcarBoton__border: 6px solid hsl(38, 77%, 59%);
}

@media (min-width: 992px) {
  :root {
    --marco__tamanoY: .8rem;
    --marco__tamanoX: .8rem
  }
}

html {
  font-size: 18px
}

@media (min-width: 768px) {
  html {
    font-size: 20px
  }
}

body {
  font-family: var(--fuente);
  color: hsl(47, 7%, 30%);
  line-height: 1.4;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none
}

h1,
h2,
h3,
h4 {
  font-family: "Bolivar";
}