body {
  background-color: #1f1f1f;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
  margin: 0;
}

.container {
  text-align: center;
}

#typing-text {
  color: white;
  font-size: 3rem;
  font-weight: bold;
  font-family: monospace;
  overflow: hidden;
  white-space: nowrap;
  border-right: 0.15em solid white;
}

#typing-text.erasing {
  animation: erasing 1.5s steps(40, end) forwards;
}

@keyframes typing {
  from { width: 0 }
  to { width: 20ch }
}

@keyframes erasing {
  from { width: 20ch }
  to { width: 0 }
}