@font-face {
  font-family: "BonVivantSerifBold";
  src: url('/assets/fonts/BonVivantSerifBold.woff2') format('woff2'), url('/assets/fonts/BonVivantSerifBold.woff') format('woff');
  font-display: swap;
}
@font-face {
  font-family: "BonVivant-Regular";
  src: url('/assets/fonts/BonVivantRegular.woff2') format('woff2'), url('/assets/fonts/BonVivantRegular.woff') format('woff');
  font-display: swap;
}
@font-face {
  font-family: "BonVivantSerif";
  src: url('/assets/fonts/BonVivantSerif.woff2') format('woff2'), url('/assets/fonts/BonVivantSerif.woff') format('woff');
  font-display: swap;
}

@font-face {
  font-family: 'Muli';
  src: url('/assets/fonts/muli-webfont.woff2') format('woff2'),
       url('/assets/fonts/muli-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-display: swap;
  font-family: 'Muli Light';
  src: url('/assets/fonts/muli-lightitalic-webfont.woff2') format('woff2'),
       url('/assets/fonts/muli-lightitalic-webfont.woff') format('woff');
  font-weight: normal;
  font-style: italic;
}

@font-face {
  font-family: 'Muli Light';
  src: url('/assets/fonts/muli-light-webfont.woff2') format('woff2'),
       url('/assets/fonts/muli-light-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Muli';
  src: url('/assets/fonts/muli-bold-webfont.woff2') format('woff2'),
       url('/assets/fonts/muli-bold-webfont.woff') format('woff');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Muli';
  src: url('/assets/fonts/muli-semibold-webfont.woff2') format('woff2'),
       url('/assets/fonts/muli-semibold-webfont.woff') format('woff');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

/* ensure anchor tag scroll *works* properly, scrolls an extra 100px to ensure content isn't hidden behind the header */
/* https://stackoverflow.com/a/24298427 */
/* adds a lot of whitespace on several components */
/*[id]:not([id="headerContainer"]):not([id="header"])::before {
  content: '';
  display: block;
  height:      100px;
  margin-top: 100px;
  visibility: hidden;
}*/

body, a, p, h1, h2, h3 {
  margin: 0;
}

body > .container {
  max-width: 1440px;
  width: 1440px;
  overflow: hidden;
  padding: 0 calc((100vw - 1440px) / 2);
}

@media (max-width: 1440px) {
  body > .container {
    width: auto;
  }
}

a,
a:before {
  color: black;
  transition: color .3s cubic-bezier(.59,.08,.385,1);
}

a:hover {
  color: #C69957;
  transition: color .3s cubic-bezier(.59,.08,.385,1);
}

a:hover:before {
  background: #C69957 !important;
}