@charset "UTF-8";
@import url("https://cdn-images-1.medium.com/fit/t/1600/480/0*_dKBm_6EpOZCC8pP");
/**
 * * Title
 * * You can change the text styles to whatever you want ¯\_(ツ)_/¯
 * */
h1 {
  color: #FFFFFF;
  font-family: "Poppins", sans-serif;
  font-size: 50px;
  font-weight: 900;
  text-transform: uppercase;
  white-space: nowrap;
  opacity: 0;
}

h2 {
  color: #FFFFFF;
  font-family: "Poppins", sans-serif;
  font-size: 35px;
  font-weight: 900;
  text-transform: uppercase;
  white-space: nowrap;
  opacity: 100;
}

a {
    text-decoration:none;
}

::-moz-selection {
  background: black;
}

::selection {
  background: black;
}

/**
 * * Main
 * */
.page {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 0;
  min-height: 100vh;
  background-color: black;
  background-image: url("https://store.boomkub.com/assets/img/bg.jpg");
  background-position: center;
  background-size: cover;
  overflow: hidden;
}

/**
 * * Decorative vignette
 * */
.vignette {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: radial-gradient(rgba(0, 0, 0, 0), black);
  pointer-events: none;
  /*z-index: -1;*/
  opacity: 1;
  transition: opacity 250ms;
}
@media screen and (max-width: 900px) {
  .vignette {
    opacity: 0.8;
  }
}

/**
 * * Decorative lines
 * */
.lines {
  position: absolute;
  top: 0;
  bottom: 0;
  min-width: 960px;
  border-right: 1px solid black;
  border-left: 1px solid black;
  pointer-events: none;
}
.lines__inner, .lines::before {
  position: absolute;
  top: 0;
  left: 33%;
  bottom: 0;
  width: 33%;
}
.lines::before {
  content: "";
  border-right: 1px solid black;
  border-left: 1px solid black;
}
.lines__inner {
  box-shadow: 0 0 15px 5px black;
  opacity: 0;
}

/**
 * * Restart button
 * */
.restart {
  position: fixed;
  left: 50%;
  bottom: 20px;
  transform: translate(-50%, 0);
  width: 30px;
  height: 30px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='512' height='512' viewBox='0 0 512 512'%3E%3Cpath fill='%23FFF' d='M133,440a35.37,35.37,0,0,1-17.5-4.67c-12-6.8-19.46-20-19.46-34.33V111c0-14.37,7.46-27.53,19.46-34.33a35.13,35.13,0,0,1,35.77.45L399.12,225.48a36,36,0,0,1,0,61L151.23,434.88A35.5,35.5,0,0,1,133,440Z'/%3E%3C/svg%3E") center/cover;
  border: none;
  outline: none;
  opacity: 0.15;
  cursor: pointer;
  transition: opacity 300ms;
}
.restart:hover {
  opacity: 1;
}