@font-face {
  font-family: "Under-the-influence";
  src: url("fonts/under-the-influence.ttf");
}

@font-face {
  font-family: "Trashed Light";
  src: url("fonts/Trashedlight-Regular.ttf");
}

@font-face {
  font-family: "Unispace";
  src: url("fonts/unispace-italic.ttf");
}

@font-face{
  font-family: "Army Rust";
  src: url("fonts/ARMY RUST.ttf");
}

@font-face {
  font-family: "CarbonType";
  src: url("fonts/carbon.ttf")
}

body {
  background-color: #040404;
  color: grey;
}

#relive {
  text-align: center;
  font-family: "Unispace";
  font-size: 2em;
  text-shadow: 0 2px 1px #CCC;
}

#relive a {
  color: blue;
  text-decoration: underline;
}

#relive a:hover {
  cursor: pointer;
}

#countdown {
  padding-top: 25vh;
  text-align: center;
  /* display: none; */
}

#countdown h1 {
  font-family: "Under-the-influence", cursive;
  font-size: 48px;
  letter-spacing: 0.4em;
  color: lightgrey;
  text-shadow: yellow 0 4px 10px;
}

#countdown h2 {
  padding-top: initial;
  font-family: "Unispace", monospace;
  font-size: 40px;
  color: red;
}

#rip {
  background: center / contain no-repeat black url('haunted-graveyard.jpg');
  padding-top: 4em;
  padding-bottom: 4em;
  color: grey;
  text-align: center;
  display: none;
}

#rip h1 {
  font-family: "Under-the-influence", cursive;
  font-size: 60px;
  letter-spacing: 0.4em;
  color: red;
  text-shadow: grey 0 4px 4px;
}

#rip h2 {
  font-family: "Under-the-influence", cursive;
  font-size: 52px;
  letter-spacing: 0.4em;
  color: red;
  text-shadow: grey 0 4px 4px;
}

#rip h3 {
  font-family: "CarbonType", cursive;
  font-size: 40px;
  color: black;
  letter-spacing: 0.4em;
  text-shadow: white 0 0px 8px;
}

#credits {
  text-align: center;
  font-family: "Unispace", monospace;
  padding: 2em 10vw;
  display: none;
}

#credits h1 {
  text-shadow: 0px 2px red;
}

#megan {
  color: pink;
}