@font-face {
    font-family: 'Go Mono';
    src: url('fonts/GoMono.woff2') format('woff2'),
        url('fonts/GoMono.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
html, body {
  height: 100%;
  margin: 0;
  padding: 0;
  width: 100%;
  background: #181818;
  color: #f7f7f7;
}
body {
  font-family: 'Go Mono','Fira Mono', 'Menlo', 'Consolas', monospace;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100vh;
}
.container {
  text-align: center;
}
.center-text {
  font-size: 3rem;
  letter-spacing: 1px;
}
.link {
  font-size: 2rem;
  letter-spacing: 1px;
  margin-top: 1rem;
}
.link a {
  color: #8ab4f8;
  text-decoration: none;
  padding: 0.25rem 0.5rem;
  font-weight: 500;
  transition: color 0.1s ease-in-out, background-color 0.1s ease-in-out;
  will-change: color, background-color;
}

.link a:hover,
.link a:focus {
  color: #181818 !important;
  background-color: #f7f7f7;
  outline: none;
  transition-delay: 0s; /* Apply immediately */
}

.link a:active {
  color: #e8eaed;
  background-color: #3a3a3a;
}

.link a:visited {
  color: #a6c8ff;
}
#typewriter-heading::after {
  content: '_';
  display: inline-block;
  /* Use the main text color for the cursor */
  color: #f7f7f7;
  /* The animation: name, duration, timing-function, iteration-count */
  animation: blink-caret 0.85s step-end infinite;
}

/* The blinking animation */
@keyframes blink-caret {
  from, to { color: transparent; }
  50% { color: #f7f7f7; }
}