@font-face {
  font-family: "AnalogueOS";
  src: url(https://humantooth.neocities.org/fonts/AnalogueOS-Regular.woff)
    format("woff");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "jgs7";
  src: url(https://humantooth.neocities.org/fonts/jgs7.woff) format("woff");
  font-weight: normal;
  font-style: normal;
}

p {
  color: #f2f2f2;
  margin-left: 10px;
  margin-right: 10px;
  text-align: center;
  font-size: 12px;
  font-family: "jgs7";
}

a {
  color: white;
  font-size: 13px;
  text-decoration: none;
  font-family: "jgs7";
}

.video-background {
  background: #000;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -99;
}

.video-foreground,
.video-background iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#vidtop-content {
  top: 0;
  color: #fff;
   pointer-events: none;
}

#vidtop-content a{
  pointer-events: auto;
  }

.vid-info {
  position: absolute;
  top: 0;
  right: 0;
  width: 25%;
  background: rgba(0, 0, 0, 0.3);
  color: #fff;
  font-family: Avenir, Helvetica, sans-serif;
  border-radius: 1px;
}

.vid-info a {
  display: block;
  color: black;
  text-decoration: none;
  background: rgba(255, 255, 255, 0.5);
  transition: 0.6s background;
  border-bottom: none;
  text-align: center;
  border-radius: 1px;
}

a:hover {
  transition-duration: 1s;
  text-shadow: black 0 0 10px;
}

#back a{
  color:black;
  padding-top:10px;
}

@media (min-aspect-ratio: 16/9) {
  .video-foreground {
    height: 300%;
    top: -100%;
  }
}
@media (max-aspect-ratio: 16/9) {
  .video-foreground {
    width: 300%;
    left: -100%;
  }
}
@media all and (max-width: 600px) {
  .vid-info {
    width: 50%;
    padding: 0.5rem;
  }
  .vid-info h1 {
    margin-bottom: 0.2rem;
  }
}
@media all and (max-width: 500px) {
  .vid-info .acronym {
    display: none;
  }
}