@font-face {
  font-family: "Instrument Serif";
  src: url("/res/fonts/Instrument_Regular.woff2") format("woff2-variations");
  font-weight: 400;       
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Instrument Serif";
  src: url("/res/fonts/Instrument_Italic.woff2") format("woff2-variations");
  font-weight: 400;       
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Ubuntu Sans";
  src: url("/res/fonts/Ubuntu.woff2") format("woff2-variations");
  font-weight: 100 800;       
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Ubuntu Sans";
  src: url("/res/fonts/Ubuntu_Italics.woff2") format("woff2-variations");
  font-weight: 100 800;       
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Cabin";
  src: url("/res/fonts/Cabin.woff2") format("woff2-variations");
  font-weight: 100 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Cabin";
  src: url("/res/fonts/Cabin_Italics.woff2") format("woff2-variations");
  font-weight: 100 700;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Unbounded";
  src: url("/res/fonts/Unbounded.woff2") format("woff2-variations");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Material Symbols Outlined";
  src: url("/res/fonts/MaterialSymbols.woff2") format("woff2-variations");
  font-weight: 100 700;
  font-style: normal;
  font-display: swap;
}

.material-symbols-outlined {
  font-family: 'Material Symbols Outlined';
  font-weight: 500;
  font-style: normal;
  font-size: 20px;  /* Preferred icon size */
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;
}

h1, h2, h3, h4, p, li, ul {
    margin: 0;
}

h1, h2, h3, h4 {
    font-family: "Instrument Serif";
    font-style: italic;
}

h1 {
    font-size: 1.8rem;
    letter-spacing: -0.3px;
}

p {
    font-family: "Cabin";
    font-size: 1.2rem;
    font-weight: 500;
    text-align: justify;
    color: inherit;
}

@media screen and (min-width: 800px) {
  h1 {
    font-size: 3rem
  }
}