@import 'https://fonts.googleapis.com/css2?family=Roboto+Mono&display=swap';
body{
    background:#000;
    color:#dcdcdc;
    font-family:roboto mono,monospace
}
.overlay{
    pointer-events:none;
    position:fixed;
    left:0;
    top:0;
    width:100%;
    height:100%;
    background:#000;
    opacity:1
}
.overlay.hidden{
    opacity:0;
    transition:linear .25s
}
.center{
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%)
}
.main{
    text-align:center
}
.controls{
    position:absolute;
    bottom:10px;
    left:50%;
    transform:translateX(-50%)
}
.controls a{
    color: #dcdcdc;
    text-decoration:none
}
.modal{
    position:absolute;
    width:500px;
    top:-500px;
    min-height:200px;
    visibility:hidden;
    left:50%;
    border:1px solid #dcdcdc;
    background:#000;
    transform:translate(-50%,-50%)
}

[class~=cmd-art] {
    text-align: center;
}

[class~=cmd-art] {
    white-space: pre;
}

[class~=cmd-art],[class~=cmd-input] {
    display: inline-block;
}

[class~=cmd-art] {
    background: -webkit-linear-gradient(transparent,transparent),url("https://media4.giphy.com/media/YRcXl6VfNhCorklI0R/giphy.gif");
}

[class~=cmd-art] {
    background: -o-linear-gradient(transparent,transparent);
}

[class~=cmd-art] {
    -webkit-text-fill-color: transparent;
}

[class~=cmd-art] {
    -webkit-background-clip: text;
}

[class~=cmd-art]:hover {
    cursor: pointer;
}