/* Google Fonts */
@import url(https://fonts.googleapis.com/css?family=Anonymous+Pro);

/* Global */
html{
  min-height: 100%;
  overflow: hidden;
}
body{
  height: calc(100vh - 8em);
  padding: 4em;
  color: rgba(255,255,255,.75);
  font-family: 'Anonymous Pro', monospace;
  background-color: black;
}
.line-1{
    width: 12em;
    margin: 0 auto;
    border-right: 2px solid rgba(255,255,255,.75);
    font-size: 180%;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    transform: translateY(-50%);
}
.line-2{
    display: block;
    width: 6em;
    margin: 0 auto;
    border-right: 2px solid rgba(255,255,255,.75);
    font-size: 140%;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    transform: translateY(-50%);
}

/* Animation */
.anim-typewriter{
  animation: typewriter 2s steps(19) 1s 1 normal both,
             blinkTextCursor 500ms steps(19);
}
.anim-second-line{
  animation: typewriter 2.5s steps(22) 3s 1 normal both,
             blinkTextCursor 500ms steps(22) infinite normal 2.5s;
}

@keyframes typewriter{
  from{width: 0;}
  to{width: 12em;}
}
@keyframes second-line{
  from{width: 0;}
  to{width: 6em;}
}
@keyframes blinkTextCursor{
  from{border-right-color: rgba(255,255,255,.75);}
  to{border-right-color: transparent;}
}