BoSLOO/GroundControl/frontend/src/index.css

@import url('https://fonts.googleapis.com/css?family=Major+Mono+Display');

body {
    font: 18px "Courier New", monospace;
    background-color: black;
    background-image: radial-gradient(at bottom right, rgb(30 30 30), black);
    height: 100vh;
    overflow: hidden;
    color: #02d300;
    text-shadow: 0 0 6px #73ff71;
}

body::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    height: 99vh;
    background: repeating-linear-gradient( 0deg, rgb(0 0 0 / 0.15), rgb(0 0 0 / 0.15) 3px, transparent 2px, transparent 6px);
    pointer-events: none;
}

::selection{
    background: #793d71;
    text-shadow: none;
}

.power-on-container {
    height: 90vh;
    align-items:center;
    justify-items:center;
    text-align: center;
}

.power-on-box {
    position:relative;
    justify-self:center;   
    margin-top: 20vh;
}

#start-text{
    font-size: 30px;
    border:double;
    padding:2em 6em;
}

.console {
    padding-top: 15vh;
    height: 70vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.logo {
    white-space: pre-wrap;
}

.fail-text {
    color: #d82222;
    text-shadow: 0 0 6px #ff1111;
}

.terminal-window{
    width: 65%;
    height: 100%;
    overflow: auto;
    flex-grow: 1;
    display: flex;
    flex-direction: column-reverse;
}

.active-line{
    outline: none;
    width: 2em;
    resize:horizontal;
}

.blink-text {
    animation: blinker 1s step-start infinite;
}

.typed-line{
    display: inline;
}

.terminal-line th{
    text-align: right;
    vertical-align: top;
    padding-right: 0.2em;
    width: 4em;
}

.terminal-line td{
    text-align: left;
}

@keyframes blinker {
    50% {
        opacity: 0;
    }
}