body{
  font-family: 'B612', sans-serif; 
  margin: 0px;
  padding: 0px;
}


::-webkit-scrollbar {
  width: 10px;
}


::-webkit-scrollbar-thumb {
  background: lightgray; 
  border-radius: 10px;
}


::-webkit-scrollbar-thumb:hover {
  background: grey; 
}

.glitchWrapper-209Ebg{
  height:30px;
  padding:20px 0;
  -webkit-box-ordinal-group:3;
  -ms-flex-order:2;
  order:2
}
.glitch-1ZnYvx{font-family:B612,sans-serif;
  font-weight:700;
  color:rgba(hsl(240,5.9%,96.7%),.3);
  font-size:30px;
  position:relative;
  display:inline-block
}
.glitch-1ZnYvx:after,.glitch-1ZnYvx:before{
  content:attr(data-text);
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
}
.glitch-1ZnYvx:before{
  left:2px;
  text-shadow:-2px 0 hsl(236,83.3%,92.9%);
  text-shadow:-2px 0 hsl(236,calc(var(--saturation-factor, 1)*83.3%),92.9%);
  clip:rect(24px,550px,90px,0);
  -webkit-animation:glitch-anim-2-3Jj1Wz 4s linear infinite alternate-reverse;
  animation:glitch-anim-2-3Jj1Wz 4s linear infinite alternate-reverse
}
.glitch-1ZnYvx:after{
  left:-2px;
  text-shadow:-2px 0 rgba(hsl(235,85.6%,64.7%),.3);
  text-shadow:-2px 0 rgba(hsl(235,calc(var(--saturation-factor, 1)*85.6%),64.7%),.3);
  clip:rect(85px,550px,140px,0);
  -webkit-animation:glitch-anim-n2MEks 2s linear infinite alternate-reverse;
  animation:glitch-anim-n2MEks 2s linear infinite alternate-reverse
}
@-webkit-keyframes glitch-anim-n2MEks{0%{clip:rect(3px,9999px,86px,0)}6.66666667%{clip:rect(27px,9999px,128px,0)}13.33333333%{clip:rect(35px,9999px,71px,0)}20%{clip:rect(10px,9999px,134px,0)}26.66666667%{clip:rect(23px,9999px,145px,0)}33.33333333%{clip:rect(40px,9999px,80px,0)}40%{clip:rect(33px,9999px,153px,0)}46.66666667%{clip:rect(50px,9999px,84px,0)}53.33333333%{clip:rect(57px,9999px,188px,0)}60%{clip:rect(79px,9999px,65px,0)}66.66666667%{clip:rect(21px,9999px,168px,0)}73.33333333%{clip:rect(62px,9999px,119px,0)}80%{clip:rect(4px,9999px,126px,0)}86.66666667%{clip:rect(10px,9999px,133px,0)}93.33333333%{clip:rect(51px,9999px,196px,0)}to{clip:rect(77px,9999px,73px,0)}}@keyframes glitch-anim-n2MEks{0%{clip:rect(3px,9999px,86px,0)}6.66666667%{clip:rect(27px,9999px,128px,0)}13.33333333%{clip:rect(35px,9999px,71px,0)}20%{clip:rect(10px,9999px,134px,0)}26.66666667%{clip:rect(23px,9999px,145px,0)}33.33333333%{clip:rect(40px,9999px,80px,0)}40%{clip:rect(33px,9999px,153px,0)}46.66666667%{clip:rect(50px,9999px,84px,0)}53.33333333%{clip:rect(57px,9999px,188px,0)}60%{clip:rect(79px,9999px,65px,0)}66.66666667%{clip:rect(21px,9999px,168px,0)}73.33333333%{clip:rect(62px,9999px,119px,0)}80%{clip:rect(4px,9999px,126px,0)}86.66666667%{clip:rect(10px,9999px,133px,0)}93.33333333%{clip:rect(51px,9999px,196px,0)}to{clip:rect(77px,9999px,73px,0)}}@-webkit-keyframes glitch-anim-2-3Jj1Wz{10.52631579%{clip:rect(65px,9999px,200px,0)}15.78947368%{clip:rect(8px,9999px,200px,0)}21.05263158%{clip:rect(51px,9999px,159px,0)}26.31578947%{clip:rect(6px,9999px,82px,0)}31.57894737%{clip:rect(1px,9999px,106px,0)}36.84210526%{clip:rect(17px,9999px,69px,0)}42.10526316%{clip:rect(65px,9999px,144px,0)}47.36842105%{clip:rect(1px,9999px,91px,0)}52.63157895%{clip:rect(18px,9999px,209px,0)}57.89473684%{clip:rect(14px,9999px,175px,0)}63.15789474%{clip:rect(61px,9999px,107px,0)}68.42105263%{clip:rect(73px,9999px,178px,0)}73.68421053%{clip:rect(53px,9999px,207px,0)}78.94736842%{clip:rect(33px,9999px,199px,0)}84.21052632%{clip:rect(73px,9999px,144px,0)}89.47368421%{clip:rect(79px,9999px,163px,0)}94.73684211%{clip:rect(1px,9999px,76px,0)}to{clip:rect(64px,9999px,117px,0)}}@keyframes glitch-anim-2-3Jj1Wz{10.52631579%{clip:rect(65px,9999px,200px,0)}15.78947368%{clip:rect(8px,9999px,200px,0)}21.05263158%{clip:rect(51px,9999px,159px,0)}26.31578947%{clip:rect(6px,9999px,82px,0)}31.57894737%{clip:rect(1px,9999px,106px,0)}36.84210526%{clip:rect(17px,9999px,69px,0)}42.10526316%{clip:rect(65px,9999px,144px,0)}47.36842105%{clip:rect(1px,9999px,91px,0)}52.63157895%{clip:rect(18px,9999px,209px,0)}57.89473684%{clip:rect(14px,9999px,175px,0)}63.15789474%{clip:rect(61px,9999px,107px,0)}68.42105263%{clip:rect(73px,9999px,178px,0)}73.68421053%{clip:rect(53px,9999px,207px,0)}78.94736842%{clip:rect(33px,9999px,199px,0)}84.21052632%{clip:rect(73px,9999px,144px,0)}89.47368421%{clip:rect(79px,9999px,163px,0)}94.73684211%{clip:rect(1px,9999px,76px,0)}to{clip:rect(64px,9999px,117px,0)}}


.rainbow {
      
      color:#313131;

      -webkit-animation:colorchange 20s infinite alternate;
      
      
    }

    @-webkit-keyframes colorchange {
      0% {
        
        color: blue;
      }
      
      10% {
        
        color: #8e44ad;
      }
      
      20% {
        
        color: #1abc9c;
      }
      
      30% {
        
        color: #d35400;
      }
      
      40% {
        
        color: blue;
      }
      
      50% {
        
        color: #34495e;
      }
      
      60% {
        
        color: blue;
      }
      
      70% {
        
        color: #2980b9;
      }
      80% {
     
        color: #f1c40f;
      }
      
      90% {
     
        color: #2980b9;
      }
      
      100% {
        
        color: pink;
      }
    }

.block20{
  width: 100%;
  height: 20vh;

}
.block40{
  width: 100%;
  height: 40vh;

}
.block50{
  width: 100%;
  height: 50vh;

}
.block75{
  width: 100%;
  height: 75vh;

}
.block100{
  width: 100%;
  height: 100vh;

}
.hidden{
  animation: none 1s;
  display: none;
}


.profile{
  border-radius: 150px;
  background: none;
  box-shadow: inset 8px 8px 16px #5a5a5a,
              inset -8px -8px 16px #ffffff;
  height: 30vh;
  z-index: 0;
  width:30vh;
}

cc{
  text-align: center;
  border-radius: 200px;
  padding:5px 10px 5px 10px;
  background-attachment: scroll;
  background-position: 0% 0%;
  background-color: rgba(0, 0, 0, 0.527);
  color: white;
  position: fixed;
  bottom: 5px;
  right:5px
}

.rectangle{
  position: absolute;
  height: 20vh;
  width: 1500px;
  background-color: #005FE7;
  rotate: -45deg;
  animation: swing1 10s linear infinite ;
  
}
@keyframes swing1{
    0%{
      transform: rotate(-5deg);
    }
    50%{
      transform: rotate(5deg)
    }
    100%{
      transform: rotate(-5deg);
    }
  }

@keyframes appear {
  from {opacity:0}
  to {opacity:1}
}
@keyframes disappear {
  from {opacity:1}
  to {opacity:0;}
}

h2{
  font-size: 5rem;
}
.section{
  padding: 0px
}

#real{
  background-color: #1f1f1f;
}
