@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap");

@font-face {
    font-family: Museo;
    src: url("../fonts/museo500-regular.otf");
}
.museo {
  font-family: Museo, serif;
}


.section-header-black {
  font-family: Museo, serif;
  font-size: 2.3rem;
  padding-bottom: 30px;
  margin-top: 30px;
  font-weight: 600;
}
.section-header,
.section-header-400 {
    font-family: Museo, serif;
    color: var(--brand-redprimary-500);
    font-size: 2.5rem;
    margin-bottom: 2rem;

}

.section-header {
    font-weight: 600;
}

.section-header-400 {
    font-weight: 400;
}

.red-text {
  color: var(--brand-redprimary-500);
}


.huge {
  font-size: 2.25em;
}

.huge-slim {
  font-size: 1.5em;
  font-weight: 300;
}


.bulk-text {
    font-family: Poppins, serif;
    color: #2D2E2C;
    font-weight: 400;
    font-size: 15px;
    line-height: 25px;
}


/* We shouldn't need these, as Bootstrap 5.1 includes the following classes: 
.fw-lighter {
  font-weight: lighter;
}

.fw-light {
  font-weight: 300;
}

.fw-normal {
  font-weight: 400;
}

.fw-bold {
  font-weight: 700;
}

.fw-bolder {
  font-weight: bolder;
}
*/

.font-weight-200 {
    font-weight: 200;
}

.font-weight-300 {
    font-weight: 300;
}

.font-weight-400 {
    font-weight: 400;
}

.font-weight-500 {
    font-weight: 500;
}

.font-weight-600 {
    font-weight: 600;
}

@media (min-width: 768px) {
  .huge {
      font-size: 3em;
  }

  .huge-slim {
      font-size: 1.5em;
      font-weight: 300;
  }
}

@media (min-width: 900px) {
  .huge {
      font-size: 3.5em;
  }

  .huge-slim {
      font-size: 2em;
      font-weight: 300;
  }
}

@media (min-width: 1220px) {
  .huge {
      font-size: 4em;
  }

  .huge-slim {
      font-size: 3em;
      font-weight: 300;
  }
}