@font-face {
  font-family: "UnimedSlab";
  src: url("../fonts/unimedslab-semibold.woff2") format("woff2"),
  url("../fonts/unimedslab-semibold.woff") format("woff");
  font-weight: 600;
  font-style: normal;
}
@font-face {
  font-family: "UnimedSans";
  src: url("../fonts/unimedsans-regular.woff2") format("woff2"),
  url("../fonts/unimedsans-regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "UnimedSans";
  src: url("../fonts/unimedsans-bold.woff2") format("woff2"),
  url("../fonts/unimedsans-bold.woff") format("woff");
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: "UnimedSans";
  src: url("../fonts/unimedsans-black.woff2") format("woff2"),
  url("../fonts/unimedsans-black.woff") format("woff");
  font-weight: 900;
  font-style: normal;
}
@font-face {
  font-family: "UnimedSerif";
  src: url("../fonts/unimedserif-bold.woff2") format("woff2"),
  url("../fonts/unimedserif-bold.woff") format("woff");
  font-weight: 700;
  font-style: normal;
}

:root {
  --color-green: #007A40;
  --color-green-light: #00985C;
  --color-yellow: #DFA329;
  --color-white: #FFF;
  --font-slab: 'UnimedSlab', sans-serif;
  --font-sans: 'UnimedSans', sans-serif;
  --font-serif: 'UnimedSerif', serif;
}


.font-slab {
  font-family: var(--font-slab);
}

.font-sans {
  font-family: var(--font-sans);
}

.font-serif {
  font-family: var(--font-serif);
}

.bg-green {
  background-color: var(--color-green);
}

.bg-green-gradient {
  background: linear-gradient(to bottom, var(--color-green-light), var(--color-green));
}

.bg-yellow {
  background-color: var(--color-yellow);
}

.text-green {
  color: var(--color-green);
}

.text-green-light {
  color: var(--color-green-light);
}

.text-yellow {
  color: var(--color-yellow);
}

.border-green {
  border-color: var(--color-green);
}

.border-yellow {
  border-color: var(--color-yellow);
}

.hyphens {
  hyphens: auto;
}
.no-hyphens {
  hyphens: none;
}

*[class$="text-6xl"] {
}

@media all and (max-width: 1023px) {
  .main-logo {
    max-width: 360px;
  }
}
@media all and (min-width: 1024px) {
  .main-logo {
    max-width: 90%;
  }
}

@media all and (min-width: 1281px) {
  .xl\:h-36 {
    height: 9.2rem
  }

  .xl\:text-6xl {
    font-size: 3.75rem !important;
  }
}

@media all and (max-width: 768px) {
  #menu-button {
    transform: scale(0.9);
  }
}