:root {
  --color-purple: #820ebd;
  --color-yellow: #c2fe0c;
  --color-blue:   #1A4FFF;
}

.bg {
  background-color: #000;
}

.bg-color {
  background-color: var(--color-blue);
}

.b-color {
  border-color: var(--color-blue) !important;
}

.color {
  color: var(--color-blue) !important;
}

.y-color {
  color: var(--color-yellow) !important;
}

.vw-2 {
  width: 2vw;
  max-width: 2dvw
}

.vh-100 {
  height: 100vh;
  max-height: 100dvh
}

.fade {
  opacity: 0.2;
  animation: fadeAnimation 10s infinite alternate;
}

@keyframes fadeAnimation {
  from {
    opacity: 0.2;
  }

  to {
    opacity: 0.4;
  }
}

.glow {
  filter: drop-shadow(0px 0px 30px var(--color-blue));
  animation: glowAnimation 10s infinite alternate;
}

@keyframes glowAnimation {
  from {
    filter: drop-shadow(0px 0px 30px var(--color-blue));
  }

  to {
    filter: drop-shadow(0px 0px 50px var(--color-blue));
  }
}


.glitch {
  animation: glitchAnimation 2s infinite;
}

@keyframes glitchAnimation {
  0%, 19%, 21%, 23%, 25%, 54%, 56%, 100% {
    opacity: 0.4;
    transform: none;
  }
  20%, 22%, 24%, 55% {
    opacity: 0.2;
    transform: translate(1px, -1px) scale(1.05);
  }
}