@import url("https://fonts.googleapis.com/css?family=Montserrat:200,300,400,600");
html{
  height:100%;
  width: 100%;
}
body {
  padding: 0;
  margin: 0;
  height:100%;
  width: 100%;
}

.title {
  z-index: 10;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  font-family: "Montserrat";
  text-align: center;
  width: 100%;
}
.title h1 {
  position: relative;
  color: #FFF;
  font-weight: 100;
  font-size: 90px;
  padding: 0;
  margin: 0;
  line-height: 1;
  text-shadow: 0 0 10px #ff006c, 0 0 20px #ff006c, 0 0 30px #ff006c, 0 0 40px #ff417d, 0 0 70px #ff417d, 0 0 80px #ff417d, 0 0 100px #ff417d, 0 0 150px #ff417d;
}
.title h1 span {
  font-weight: 600;
  padding: 0;
  margin: 0;
  color: #ffffff;
}
.title h3 {
  font-weight: 200;
  font-size: 20px;
  padding: 0;
  margin: 0;
  line-height: 2;
  color: #fff;
  text-shadow: 0 0 10px #4EFCFE, 0 0 20px #4EFCFE, 0 0 30px #4EFCFE, 0 0 40px #4EFCFE, 0 0 70px #4EFCFE, 0 0 80px #4EFCFE, 0 0 100px #4EFCFE, 0 0 150px #4EFCFE;
  letter-spacing: 12px;
  opacity: 0.4;
}


* {
  box-sizing: border-box;
}


body {
  background-color: #2b1165;
  background: linear-gradient(180deg, #2b1165 0%, #1a3a82 37%, #ab24b1 69%, #f54171 100%);
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100vh;
  position: relative;
  overflow: hidden;
}

.overlay {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  /* background-color: black; */
  background-size: 5px 5px, 5px 5px;
  background-position: -1px -1px, -1px -1px;
  background-image: linear-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
  mix-blend-mode: difference;
  z-index: 10;
}

.glitch {
  clip-path: polygon(0 0, 100% 0, 100% 0.5em, 0 0.5em);
  animation: glitch 10s linear infinite;
  transform: translatex(0.1rem);
}

@keyframes glitch {
  to {
    clip-path: polygon(0 calc(100% - .5em), 100% calc(100% - .5em), 0 100%, 0 100%);
  }
}

@keyframes lightEffect {
  to {
    clip-path: polygon(0 0, 100% 0, 100% 0.5em, 0 0.5em, 0 1em, 100% 1em, 100% 1.5em, 0 1.5em, 0 2em, 100% 2em, 100% 2.5em, 0 2.5em, 0 3em, 100% 3em, 100% 3.5em, 0 3.5em, 0 4em, 100% 4em, 100% 4.5em, 0 4.5em, 0 5em, 100% 5em, 100% 5.5em, 0 5.5em, 0 6em, 100% 6em, 100% 6.5em, 0 6.5em, 0 7em, 100% 7em, 100% 7.5em, 0 7.5em, 0 8em, 100% 8em, 100% 8.5em, 0 8.5em, 0 9em, 100% 9em, 100% 9.5em, 0 9.5em, 0 10em, 100% 10em, 100% 10em, 0 10em, 0 11em, 100% 11em, 100% 11.5em, 0 11.5em, 0 12em, 100% 12em, 100% 12.5em, 0 12.5em, 0 13em, 100% 13em, 100% 13.5em, 0 13.5em, 0 14em, 100% 14em, 100% 14.5em, 0 14.5em, 0 15em, 100% 15em, 100% 15.5em, 0 15.5em, 0 16em, 100% 16em, 100% 16.5em, 0 16.5em, 0 17em, 100% 17em, 100% 17.5em, 0 17.5em, 0 18em, 100% 18em, 100% 18.5em, 0 18.5em, 0 19em, 100% 19em, 100% 19.5em, 0 19.5em, 0 20em, 100% 20em, 100% 20.5em, 0 20.5em);
  }
}

.center
{
  position: relative;
  left:50%;
}

img.statue {
  position: absolute;
  left: -100px;
  top: -200px;
  width: 250px;
  opacity: 0.3;
}


.fa-bandcamp {
  color: white;
  font-size: 40px;
  position: relative;
  top: 100px;
  z-index: 100;
  opacity: 0.7;
}