body {
  background: black;
  cursor: crosshair;
  margin: 0
}

html {
  font-size: min(max(1rem, 6vw), 24px);
}

@font-face {
  font-family: Sangbleu;
  src: url(fonts/SangBleuKingdom-Light-WebXL.woff2);
  font-weight: lighter;
}

/* Begin Queries */

/* XL */
@media screen and (min-width: 2001px) {
   .btn-container {
    background-color: none;
  }

  .maincontainer {
  position: sticky;
  padding-top: 30%;
   transform: translateY(0%);
  }
}

/* L */
@media screen and (min-width: 1001px) and (max-width: 2000px) {
    .btn-container {
    background-color: none;
  }

    .maincontainer {
  position: sticky;
  padding-top: 30%;
   transform: translateY(0%);
  }

}

/* M */
@media screen and (min-width: 600px) and (max-width: 1000px) {
    .btn-container {
    background-color: none;
  }

  .maincontainer {
  position: sticky;
  padding-top: 50%;
   transform: translateY(25%);
  }
}

/* S */
@media screen and (min-width: 1px) and (max-width: 599px) {
    .btn-container {
    background-color: none;
  }

  .maincontainer {
  position: sticky;
  padding-top: 50%;
   transform: translateY(50%);
  }

}

/* END Queries */

.maincontainer {
  width: 100%;
  background-color: none;
  z-index: 2;
  border: none;
  text-align:center;
  background-color: none;
  }

.video {
  pointer-events: none;
  border: none;
  z-index: 1;
  position: fixed;
  right: 0;
  bottom: 0;
  min-width: 100%;
  min-height: 100%;
}

.btn-container {
  border: none;
  background-color: none;
  position: sticky;
  width: 100%;
}

.btn {
font-family: "Sangbleu", "Courier New", Courier, monospace;
  font-size: 2rem;
  font-weight: regular;
  background: none;
  padding-top: 16px;
  padding-bottom: 16px;
  padding-left: 40px;
  padding-right: 40px;
  text-align: center;
  text-decoration: none;
  text-transform: none;
  color: #fff;
border: 1px solid white;
  border-radius: 3px;
  cursor: pointer;
  box-shadow: none;
  position: sticky;
}

.btn:hover {
 background-color: #000000;
  border: 1px solid white;
}

.btn:active {
  background-color: #000000;
  border: 1px solid white;
}

.h1 {
  z index: 2;
  font-family: "Sangbleu";
  font-size: 1rem;
  color: #FFFFFF;
  font-weight: lighter;
  border: none;
  position: sticky;
  margin-bottom: 3rem;
}

#animation {
  z-index: 0;
}

#footer {
  font-family: "Courier New";
  font-size: .8rem;
  font-weight: regular;
  text-align: center;
  color: #ffffff;
  background: none;
  width: 60%;
  border: none;
  position: fixed;
  left: 20%;
    top: 95%;
    transform: translateX(-50%);
    transform: translateY(-50%);
    background-color: none;

    z-index: 3;
}