#logo {
  display: block;
  margin: 0 auto;
  width: clamp(min(350px, 90%), 40%, 90vw) !important;
  height: auto;
  margin: -30% auto 0 auto;
  /*border: 1px solid red;*/
  z-index: 9999;
  opacity: 1;
}

.glitch {
  animation: glitch 0.35s steps(1, end) forwards;
  animation-delay: 0.3s;
}

@keyframes glitch {
  0% {
    opacity: 0;
    transform: scale(1.1);
    filter: drop-shadow(-2px 0 red) drop-shadow(2px 0 cyan);
  }
  20% {
    opacity: 1;
    transform: translate(-3px, 2px);
    filter: drop-shadow(-3px 0 red) drop-shadow(3px 0 cyan);
  }
  40% {
    transform: translate(2px, -2px);
    filter: drop-shadow(2px 1px red) drop-shadow(-2px -1px cyan);
  }
  60% {
    transform: translate(0, 0);
    filter: drop-shadow(-1px 0 red) drop-shadow(1px 0 cyan);
  }
  80% {
    opacity: 0.8;
    transform: translate(1px, -1px);
    filter: none;
  }
  100% {
    opacity: 1;
    transform: scale(1);
    filter: none;
  }
}