@font-face {
	src: url('../fonts/HTxpL2g2KjCFj4x8WI6AnIHxHKGn8xY.woff2');
	font-family: 'my-font';
}

html, body {
	width: 100%;
	height: 100%;
	font-family: 'sans-serif';
	margin: 0 auto;
}

/* Typing effect container */
.typing-effect {
  font-family: 'Courier New', Courier, monospace;
  font-size: 24px;
  white-space: pre-wrap; /* Preserves line breaks */
  overflow: hidden; /* Hides overflowing text */
  display: inline-block; /* Prevents the block from breaking */
  border-right: 2px solid black; /* Cursor effect */
  animation: typing 5s steps(100) 1s 1 normal both, blink 0.5s step-end infinite;
}

/* Typing animation */
@keyframes typing {
  from {
    width: 0;
  }
  to {
    width: 100%; /* Ensures full text is typed */
  }
}

/* Blinking cursor animation */
@keyframes blink {
  from, to {
    border-color: transparent;
  }
  50% {
    border-color: black;
  }
}