body, html {
  background-image: radial-gradient(rgba(1, 1, 1, 0), black 99%), url("/contrast.gif");
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  color: #f4fcde;
  font-family: Luminari;
  font-weight: 600;
}

.cursor{
    position: relative;
    width: 24em;
    margin: 0 auto;
    border-right: 2px solid #f4fcde;
    font-size: 40%;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    transform: translateY(-50%);    
}

.typewriter-animation {
  animation: 
    typewriter 5s steps(50) 1s 1 normal both, 
    blinkingCursor 500ms steps(50) infinite normal;
}
@keyframes typewriter {
  from { width: 0; }
  to { width: 100%; }
}
@keyframes blinkingCursor{
  from { border-right-color: #f4fcde; }
  to { border-right-color: transparent; }
}