/*THEME BY PEACH FEEL FREE TO USE*/
    /*if you have multiple pages, add the text between <style> and </ style> in your style.css page */
    /*change background color/image*/
    
    body{
      background-color:black;
      background-image: url("");
      background-size: 90px 90px;}
  .spacebg {
	width:150%;
	min-height:calc(100vh + 468px);
	position:fixed;
	top:0;
	left:-250px;
	background-image: url("/background/space_bg.gif");
	will-change: transform, filter;
	z-index:-1;
    }
    @-webkit-keyframes backgroundScroll {
        0% {transform: translateY(-468px);}
        100% {transform: translateY(0px);}
        }

    @keyframes backgroundScroll {
        0% {transform: translateY(-468px);}
        100% {transform: translateY(0px);}
        }
    @-webkit-keyframes backgroundScroll2 {
        0% {transform: translateY(-374px) scale(0.8); opacity: 0.66;}
        100% {transform: translateY(0px) scale(0.8); opacity: 0.66;}
        }

    @keyframes backgroundScroll2 {
        0% {transform: translateY(-374px) scale(0.8); opacity: 0.66;}
        100% {transform: translateY(0px) scale(0.8); opacity: 0.66;}
        }
      
   /*change properties of the container*/
    .container{
      width:350px;
      margin-top:75px;
      margin-left: auto;
      margin-right:auto;
      background-color:#050044;
      box-shadow: 7px 7px white, 14px 14px red, 21px 21px yellow;}
   /*change properties of the area dedicated for the title*/
    .title{
      text-align: center;
      border-bottom: 1px solid white;
      padding: 10px 0px 10px 0px;
      font-size:18px;
      font-family: "Courier New";
      font-variant: small-caps;
      }
    /*change properties of the area dedicated for links at the bottom*/
      .links{
      text-align: center;
      border-top: 1px solid white;
      padding: 10px 0px 10px 0px;
      font-size:12px;
      font-family: "Courier New";
      font-variant: small-caps;
      }
      /*change font size/style*/
    .text{
      padding:10px;
      font-size: 14px;
      font-family: courier;
      }
      /*change link color*/
    a:link {color:#969431;}
/*dont delete*/
  .credit{
   font-size: 12px;
   position: absolute;
   bottom: 0;
   right: 0;}

 body {
  background-color: black;
  padding: 100px;
}
.animated-gif{
  width: auto;
  height: 30px;
  
}

.glitch {
  position: relative;
  margin: 0 auto;
  color: #fff;
  font-size: 80px;
  font-family: "Exo", sans-serif;
  font-weight: 600;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.01em;
  -webkit-transform: scale3d(1, 1, 1);
          transform: scale3d(1, 1, 1);
}
.glitch::before, .glitch::after {
  content: attr(data-text);
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  overflow: hidden;
  background: black;
  color: white;
  clip: rect(0, 900px, 0, 0);
}
.glitch::before {
  left: 7px;
  text-shadow: 1px 0 green;
  animation: glitch-effect 3s infinite linear alternate-reverse;
}
.glitch::after {
  left: 3px;
  text-shadow: -1px 0 red;
  animation: glitch-effect 2s infinite linear alternate-reverse;
}

@-webkit-keyframes glitch-effect {
  0% {
    clip: rect(44px, 9999px, 14px, 0);
  }
  5% {
    clip: rect(39px, 9999px, 89px, 0);
  }
  10% {
    clip: rect(17px, 9999px, 36px, 0);
  }
  15% {
    clip: rect(13px, 9999px, 62px, 0);
  }
  20% {
    clip: rect(24px, 9999px, 77px, 0);
  }
  25% {
    clip: rect(58px, 9999px, 23px, 0);
  }
  30% {
    clip: rect(67px, 9999px, 49px, 0);
  }
  35% {
    clip: rect(5px, 9999px, 36px, 0);
  }
  40% {
    clip: rect(92px, 9999px, 30px, 0);
  }
  45% {
    clip: rect(3px, 9999px, 3px, 0);
  }
  50% {
    clip: rect(38px, 9999px, 30px, 0);
  }
  55% {
    clip: rect(7px, 9999px, 12px, 0);
  }
  60% {
    clip: rect(37px, 9999px, 93px, 0);
  }
  65% {
    clip: rect(81px, 9999px, 58px, 0);
  }
  70% {
    clip: rect(43px, 9999px, 12px, 0);
  }
  75% {
    clip: rect(71px, 9999px, 73px, 0);
  }
  80% {
    clip: rect(34px, 9999px, 77px, 0);
  }
  85% {
    clip: rect(7px, 9999px, 40px, 0);
  }
  90% {
    clip: rect(48px, 9999px, 67px, 0);
  }
  95% {
    clip: rect(8px, 9999px, 58px, 0);
  }
  100% {
    clip: rect(52px, 9999px, 77px, 0);
  }
}

@keyframes glitch-effect {
  0% {
    clip: rect(44px, 9999px, 14px, 0);
  }
  5% {
    clip: rect(39px, 9999px, 89px, 0);
  }
  10% {
    clip: rect(17px, 9999px, 36px, 0);
  }
  15% {
    clip: rect(13px, 9999px, 62px, 0);
  }
  20% {
    clip: rect(24px, 9999px, 77px, 0);
  }
  25% {
    clip: rect(58px, 9999px, 23px, 0);
  }
  30% {
    clip: rect(67px, 9999px, 49px, 0);
  }
  35% {
    clip: rect(5px, 9999px, 36px, 0);
  }
  40% {
    clip: rect(92px, 9999px, 30px, 0);
  }
  45% {
    clip: rect(3px, 9999px, 3px, 0);
  }
  50% {
    clip: rect(38px, 9999px, 30px, 0);
  }
  55% {
    clip: rect(7px, 9999px, 12px, 0);
  }
  60% {
    clip: rect(37px, 9999px, 93px, 0);
  }
  65% {
    clip: rect(81px, 9999px, 58px, 0);
  }
  70% {
    clip: rect(43px, 9999px, 12px, 0);
  }
  75% {
    clip: rect(71px, 9999px, 73px, 0);
  }
  80% {
    clip: rect(34px, 9999px, 77px, 0);
  }
  85% {
    clip: rect(7px, 9999px, 40px, 0);
  }
  90% {
    clip: rect(48px, 9999px, 67px, 0);
  }
  95% {
    clip: rect(8px, 9999px, 58px, 0);
  }
  100% {
    clip: rect(52px, 9999px, 77px, 0);
  }