
      .typewriter h1 {
        font-family: monospace;/* Web-safe typewriter-like font */
        overflow: hidden;/* Ensures the content is not revealed until the animation */
        border-right: .17em solid pink;/* The typewriter cursor */
        white-space: nowrap;/* Keeps the content on a single line */
        margin: 0 auto;/* Gives that scrolling effect as the typing happens */
        letter-spacing: .15em;/* Adjust as needed */
        animation: typing 3.5s steps(30, end), blinking-cursor .5s step-end infinite;
      }
      /* The typing effect */
      @keyframes typing {
        from {
          width: 0
        }
        to {
          width: 100%
        }
      }
      /* The typewriter cursor effect */
      @keyframes blinking-cursor {
        from,
        to {
          border-color: transparent
        }
        50% {
          border-color: pink;
        }
      }
    