@keyframes flicker {
  0% {
    opacity: 0.34273;
  }

  5% {
    opacity: 0.82922;
  }

  10% {
    opacity: 0.48955;
  }

  15% {
    opacity: 0.05999;
  }

  20% {
    opacity: 0.68087;
  }

  25% {
    opacity: 0.30076;
  }

  30% {
    opacity: 0.12696;
  }

  35% {
    opacity: 0.36467;
  }

  40% {
    opacity: 0.90076;
  }

  45% {
    opacity: 0.58;
  }

  50% {
    opacity: 0.67229;
  }

  55% {
    opacity: 0.95168;
  }

  60% {
    opacity: 0.056;
  }

  65% {
    opacity: 0.67508;
  }

  70% {
    opacity: 0.59241;
  }

  75% {
    opacity: 0.03175;
  }

  80% {
    opacity: 0.07103;
  }

  85% {
    opacity: 0.93978;
  }

  90% {
    opacity: 0.6368;
  }

  95% {
    opacity: 0.13387;
  }

  100% {
    opacity: 0.86986;
  }
}

.container {
  background: #121010;
  width: 100%;
  height: 100%;
  min-height: 100%;
  margin-top: 10px;
}

.container::after {
  content: " ";
  display: block;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background: rgba(18, 16, 16, 0.1);
  opacity: 0;
  z-index: 2;
  pointer-events: none;
}

.container::before {
  content: " ";
  display: block;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%), linear-gradient(90deg, rgba(255, 0, 0, 0.06), rgba(0, 255, 0, 0.02), rgba(0, 0, 255, 0.06));
  z-index: 2;
  background-size: 100% 2px, 3px 100%;
  pointer-events: none;
}

.container::after {
  animation: flicker 0.15s infinite;
}

.screen {
  width: 100%;
  height: 100%;
  border: none;
}

@keyframes overlay-anim {
  0% {
    visibility: hidden;
  }

  20% {
    visibility: hidden;
  }

  21% {
    visibility: visible;
  }

  100% {
    visibility: hidden;
  }
}

.container .overlay {
  animation: overlay-anim 5s linear;
  animation-fill-mode: forwards;
}