*{margin:0;padding:0}
html{height:100%;background:#323a45}
body{min-height:100%;height:100%;color:#ececec;font-family:'Roboto Mono',Courier}
main{width:100%;height:100%;text-align:center;font-size:6vh;line-height:6vh;font-weight:400;font-style:normal}
header{z-index:99;overflow:auto;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}
header p{margin:5vh}
header i{font-size:20vh}
header aside{font-size:2vh;line-height:3vh;color:#888}
.blink{animation-name:animation_blink;animation-timing-function:ease-in;animation-duration:1s;animation-iteration-count:infinite}
@keyframes animation_blink {
0%{opacity:1}
50%{opacity:.1}
100%{opacity:1}
}
.type{overflow:hidden;word-wrap:break-word;white-space:nowrap;animation:animation_type 1.5s steps(9) forwards}
@keyframes animation_type {
from{width:0}
to{width:9ch}
}
@media only screen and (min-width:480px) {
main{font-size:10vh;line-height:10vh}
header i{font-size:25vh}
header aside{font-size:2.5vh;line-height:3.5vh;color:#888}
header p{margin-top:7vh}
}