.hero-bg{
    background-image: url('../assets/hero.jpg');
    background-size: cover;
    background-position: 50%;
}

.text-shadow{
    text-shadow: 0 1px 2px #000;
}

.text-shadow-md{
    text-shadow: 0 2px 5px #000;
}

.text-shadow-lg{
    text-shadow: 0 3px 10px #111;
}

h1 {
    scroll-margin-top: 100px;
    scroll-snap-margin-top: 100px;
}

.short-stack-regular {
  font-family: "Short Stack", cursive;
  font-weight: 400;
  font-style: normal;
}

body, .mozilla-text-400 {
  font-family: "Mozilla Text", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

.mozilla-headline-400 {
  font-family: "Mozilla Headline", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
}

.lato-thin {
  font-family: "Lato", sans-serif;
  font-weight: 100;
  font-style: normal;
}

.lato-light {
  font-family: "Lato", sans-serif;
  font-weight: 300;
  font-style: normal;
}

.lato-regular {
  font-family: "Lato", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.lato-bold {
  font-family: "Lato", sans-serif;
  font-weight: 700;
  font-style: normal;
}

.lato-black {
  font-family: "Lato", sans-serif;
  font-weight: 900;
  font-style: normal;
}

.lato-thin-italic {
  font-family: "Lato", sans-serif;
  font-weight: 100;
  font-style: italic;
}

.lato-light-italic {
  font-family: "Lato", sans-serif;
  font-weight: 300;
  font-style: italic;
}

.lato-regular-italic {
  font-family: "Lato", sans-serif;
  font-weight: 400;
  font-style: italic;
}

.lato-bold-italic {
  font-family: "Lato", sans-serif;
  font-weight: 700;
  font-style: italic;
}

.lato-black-italic {
  font-family: "Lato", sans-serif;
  font-weight: 900;
  font-style: italic;
}