/*body {
    background: #111;
    color: white;
    padding-top: 20px;
    padding-left: 20px;
  }*/
  
  #switch {
    display: none;
  }
  
 
  @keyframes flicker {
    0% {
      opacity: 0.63412;
    }
    5% {
      opacity: 0.20027;
    }
    10% {
      opacity: 0.11523;
    }
    15% {
      opacity: 0.23888;
    }
    20% {
      opacity: 0.80237;
    }
    25% {
      opacity: 0.74502;
    }
    30% {
      opacity: 0.20087;
    }
    35% {
      opacity: 0.98649;
    }
    40% {
      opacity: 0.16142;
    }
    45% {
      opacity: 0.66927;
    }
    50% {
      opacity: 0.54897;
    }
    55% {
      opacity: 0.34082;
    }
    60% {
      opacity: 0.50773;
    }
    65% {
      opacity: 0.38625;
    }
    70% {
      opacity: 0.01623;
    }
    75% {
      opacity: 0.44843;
    }
    80% {
      opacity: 0.4406;
    }
    85% {
      opacity: 0.10559;
    }
    90% {
      opacity: 0.50269;
    }
    95% {
      opacity: 0.86201;
    }
    100% {
      opacity: 0.85415;
    }
  }
  .crtcontainer {
    /*background: #121010;*/
    width: 100%;
    /*height: 600px;
    margin-top: 10px;*/
    position: relative;
    overflow: hidden;
    /*border: 2px solid #666;*/

  }

  .crtcontainer::after {
    content: " ";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: rgba(18, 16, 16, 0.1);
    opacity: 0;
    z-index: 2;
    pointer-events: none;
  }
  .crtcontainer::before {
    content: " ";
    display: block;
    position: absolute;
    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;
  }
  
  #switch:checked ~ .crtcontainer::after {
    animation: flicker 1.45s infinite;
  }
  
  @keyframes turn-on {
    0% {
      transform: scale(1, 0.8) translate3d(0, 0, 0);
      -webkit-filter: brightness(30);
      filter: brightness(30);
      opacity: 1;
    }
    3.5% {
      transform: scale(1, 0.8) translate3d(0, 100%, 0);
    }
    3.6% {
      transform: scale(1, 0.8) translate3d(0, -100%, 0);
      opacity: 1;
    }
    9% {
      transform: scale(1.3, 0.6) translate3d(0, 100%, 0);
      -webkit-filter: brightness(30);
      filter: brightness(30);
      opacity: 0;
    }
    11% {
      transform: scale(1, 1) translate3d(0, 0, 0);
      -webkit-filter: contrast(0) brightness(0);
      filter: contrast(0) brightness(0);
      opacity: 0;
    }
    100% {
      transform: scale(1, 1) translate3d(0, 0, 0);
     /* -webkit-filter: contrast(1) brightness(1.2) saturate(1.3);*/
     /* filter: contrast(1) brightness(1.2) saturate(1.3);*/
      opacity: 1;
    }
  }
  @keyframes turn-off {
    0% {
      transform: scale(1, 1.3) translate3d(0, 0, 0);
      -webkit-filter: brightness(1);
      filter: brightness(1);
      opacity: 1;
    }
    60% {
      transform: scale(1.3, 0.001) translate3d(0, 0, 0);
      -webkit-filter: brightness(10);
      filter: brightness(10);
    }
    100% {
      animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
      transform: scale(0, 0.0001) translate3d(0, 0, 0);
      -webkit-filter: brightness(50);
      filter: brightness(50);
    }
  }
  .screen {
    width: 100%;
    height: 100%;
    border: none;
    
  }

 
  #switch ~ .crtcontainer > .screen {
    animation: turn-off 0.55s cubic-bezier(0.23, 1, 0.32, 1);
    animation-fill-mode: forwards;
  }
  
  #switch:checked ~ .crtcontainer > .screen {
    animation: turn-on 4s linear;
    animation-fill-mode: forwards;
  }
  
  @keyframes overlay-anim {
    0% {
      visibility: hidden;
    }
    20% {
      visibility: hidden;
    }
    21% {
      visibility: visible;
    }
    100% {
      visibility: hidden;
    }
  }
  .overlay {
    color: #00FF00;
    position: absolute;
    top: 20px;
    left: 20px;
    font-size: 60px;
    visibility: hidden;
    pointer-events: none;
  }
  
  #switch:checked ~ .crtcontainer .overlay {
    animation: overlay-anim 5s linear;
    animation-fill-mode: forwards;
  }
  