body {
  background-color: black;
  color: white;
}
a {
  text-align: end
}
p {
  font-family: 'Courier New', Courier, monospace;
  width: 0;
  margin-right: 5px;
  overflow: hidden;
  border-right: 2px solid transparent;
  white-space: nowrap;
  cursor: default;
}



.typingEffect__line1 {
  color: lightcoral;
  animation: typing 2.9s steps(20) 1s forwards;
}

.typingEffect__line2 {
  color: cyan;
  animation: typing 2.9s steps(20) 2s forwards;
}

.typingEffect__line2b {
  color: cyan;
  animation: typing 2.9s steps(20) 2.4s forwards;
}

.typingEffect__line3 {
  color: lightgreen;
  animation: typing 2.9s steps(10) 2.8s forwards;
}

.typingEffect__line4 {
  animation: typing 2.9s steps(10) 4s forwards;
}

.typingEffect__line5 {
  color: limegreen;
  animation: typing 2.9s steps(10) 6s forwards;
}

.typingEffect__line6 {
  animation: typing 2.9s steps(17) 8s forwards;
}

.typingEffect__line7 {
  color: limegreen;
  animation: typing 2.9s steps(17) 10s forwards;
}

.typingEffect__lineEND {
  font-family: 'Courier New', Courier, monospace;
  width: 0;
  margin-right: 5px;
  overflow: hidden;
  border-right: 2px solid transparent;
  white-space: nowrap;
  color: royalblue;
  animation: typing 1.5s steps(17) 11s forwards;
}
  
@keyframes typing {
  from { width: 0 }
  to { width: 100% }
}