body {
  padding: 0;
  margin: 0;
}

.twitch {
    border-color: blueviolet;
    color: blueviolet;
    font-weight: bold;
}



img {
  position: relative;
  left: 3%;
}

#hero {
  position: absolute;
}

h1 {
    font-family: "Tiny5", sans-serif;
    font-weight: 400;
    font-style: normal;
    background-color: white;
    }

p {
    color: white;
    font-family: "Silkscreen", sans-serif;
    font-weight: 200;
    font-style: normal;
}

.public {
    font-weight: bold;
}

.youtube {
    font-weight: bold;
}

.twitter {
    font-weight: bold;
}

.discord {
    font-weight: bold;
}

.copyright {
  font-size: 10px;
}

.sun {
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: -1;
}

#music {
    position:fixed;
   left:0px;
   bottom:0px;
   height:100px;
   width:100%;
   background: black;
}

    
    * {
        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: transparent;
        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;
      }
      
      .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%);
        }
      }
      .sun {
        width: 40vh;
        height: 40vh;
        font-size: 1rem;
        border-radius: 20vh;
        position: relative;
        overflow: hidden;
      }
      .sun:before {
        content: "";
        display: block;
        position: absolute;
        top: 0;
        height: 50%;
        background-color: #f54171;
        background: linear-gradient(0deg, #2b1165 0%, #1a3a82 37%, #ab24b1 69%, #f54171 100%);
        background-size: 40vh 40vh;
        width: 100%;
      }
      .sun:after {
        content: "";
        display: block;
        position: absolute;
        bottom: 0;
        width: 100%;
        height: 50%;
        background-color: #f54171;
        background: linear-gradient(0deg, #2b1165 0%, #1a3a82 37%, #ab24b1 69%, #f54171 100%);
        background-size: 40vh 40vh;
        background-position: bottom center;
        clip-path: polygon(0 -10em, 100% -10em, 100% -10.5em, 0 -10.5em, 0 -9em, 100% -9em, 100% -9.5em, 0 -9.5em, 0 -8em, 100% -8em, 100% -8.5em, 0 -8.5em, 0 -7em, 100% -7em, 100% -7.5em, 0 -7.5em, 0 -6em, 100% -6em, 100% -6.5em, 0 -6.5em, 0 -5em, 100% -5em, 100% -5.5em, 0 -5.5em, 0 -4em, 100% -4em, 100% -4.5em, 0 -4.5em, 0 -3em, 100% -3em, 100% -3.5em, 0 -3.5em, 0 -2em, 100% -2em, 100% -2.5em, 0 -2.5em, 0 -1em, 100% -1em, 100% -1.5em, 0 -1.5em, 0 0, 100% 0, 100% -0.5em, 0 -0.5em, 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);
        animation: lightEffect 20s linear infinite reverse;
      }
      
      @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);
        }
      }