:root {
  /* neon color */
  --text-color: red;
  --border-color: rgb(2, 194, 2);
}

h1 {
  font-family: sans-serif;
  font-size: 100px;
  font-weight: 100;
  color: rgb(255, 0, 0);
  padding: 35px;
  border: 5px solid rgb(2, 194, 2);
  border-radius: 25px;
  animation: flicker 1.5s infinite alternate;
  width: 450px;
  margin: 10px auto;
}

h1::-moz-selection {
  background-color: var(--border-color);
  color: var(--text-color);
}

h1::selection {
  background-color: var(--border-color);
  color: var(--text-color);
}

/* flickers neon lights */
@keyframes flicker {
  0%, 19%, 21%, 23%, 25%, 54%, 56%, 100% {
    text-shadow: 0px 1px /*right*/ 10px  rgb(255, 0, 0), 1px 1px 5px /*intensity*/ rgb(255, 0, 0), 1px/*left*/
     1px 2px var(--text-color), 0 0 100px var(--text-color), 0 0 100px var(--text-color), 0 0 100px var(--text-color), 0 0 100px var(--text-color);

    /* NEON BOX */
    box-shadow: 0 0 5px rgb(2, 194, 2), inset 0 0 5px rgb(2, 194, 2), 0 0 50px var(--border-color), inset 0 0 50px var(--border-color), 0 0 50px var(--border-color), inset 0 0 50px var(--border-color);
  }
  20%, 24%, 55% {
    text-shadow: none;
    box-shadow: none;
  }
}