@font-face {
  font-family: 'SlatePro';
  src: url('fonts/SlatePro.woff2') format('woff2')
}
@font-face {
  font-family: 'TuskerGrotesk';
  src: url('fonts/TuskerGrotesk.woff2') format('woff2')
}

:root {
  --font: "SlatePro", sans-serif;
  --font-title: "TuskerGrotesk", sans-serif;
  --black: #1c1f33;
  --gray: #FAF7E7;
  --gray-1: #ededed;
}

* {
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

body {
  font-size: 1rem;
  background-color: #333;
  font-family: var(--font);
  color: var(--black);
  text-align: justify;
  color: #FAF7E7;
}

a {
  text-decoration: none;
  display: block;
  color: var(--black);
}
a:hover, a:focus, a:active, a:visited {
  color: var(--black);
}

h1 {
  font-family: var(--font-title);
  font-size: 5vh;
  font-weight: normal;
  margin: 0 auto;
  padding: 0;
  width: 100%;
  text-transform: uppercase;
  color: #333;
  pointer-events: none;
  text-align: center;
  background-color: #FAF7E7;
}

h2 {
  font-family: var(--font-title);
  font-size: 4vh;
  text-align: left;
  pointer-events: none;
  text-align: center;
}
h2 sup {
  background-color: #FAF7E7;
  color: #333;
  padding: .5rem;
}

h3 {
  font-size: 1.75vh;
  line-height: 1.55vh;
  text-align: left;
}
h3 sup {font-family: var(--font);}

h4 {
  width: 600px;
  padding: .5rem;
  background-color: #FAF7E7;
  color: #333;
  font-weight: normal;
  text-align: center;
  margin: 0 auto;
}

article {
  width: 100%;
}

main {
  width: 100%;
  padding: 0 5% 5% 5%;
  margin: 0 auto;
}
main p {
  font-family: var(--font);
  font-size: 2vh;
  line-height: 3vh;
  font-weight: normal;
  letter-spacing: .5px;
  padding: 1rem;
  pointer-events: none;
}
main p b {
  font-family: var(--font-title);
  text-transform: uppercase;
}
main img {
  width: 600px;
  height: auto;
  display: block;
  pointer-events: none;
  margin: 0 auto;
}

div#postInfo {
  display: inline-block;
  text-align: center;
  font-family: var(--font-title);
  background-color: #FAF7E7;
  color: #333;
  width: 100%;
  font-weight: normal;
  pointer-events: none;
  text-transform: uppercase;
  border-top: 3px solid #333;
}
div#postInfo h3 {
  display: inline-block;
  font-size: 1.5vh;
  line-height: 2vh;
}