@font-face {
  font-family: "Host Grotesk";
  src: url("../fonts/HostGrotesk-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Host Grotesk";
  src: url("../fonts/HostGrotesk-SemiBold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Host Grotesk";
  src: url("../fonts/HostGrotesk-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Host Grotesk";
  src: url("../fonts/HostGrotesk-ExtraBold.woff2") format("woff2");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: Overpass;
  src: url("../fonts/Overpass-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: Overpass;
  src: url("../fonts/Overpass-SemiBold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: Overpass;
  src: url("../fonts/Overpass-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: Overpass;
  src: url("../fonts/Overpass-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
.hg-font {
  font-family: "Host Grotesk", Arial, sans-serif;
  font-weight: 600;
}

.hg-w-400 {
  font-weight: 400 !important;
}

.hg-w-600 {
  font-weight: 600 !important;
}

.hg-w-700 {
  font-weight: 700 !important;
}

.op-font {
  font-family: Overpass, Arial, sans-serif;
  font-weight: 600;
}

.op-w-400 {
  font-weight: 400 !important;
}

.op-w-600 {
  font-weight: 600 !important;
}

.op-w-700 {
  font-weight: 700 !important;
}

/*# sourceMappingURL=custom-fonts.css.map*/