body {
    background-color: black;
    overflow: auto;
}

pre {
    font-family: "Consolas", "Andale Mono WT", "Andale Mono", "Lucida Console",
        "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono",
        "Liberation Mono", "Nimbus Mono L", "Monaco", "Courier New", Courier,
        monospace;
    font-size: 0.75vw;

    /*position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);*/
}

a {
    font-size: 12px;
    color: #b366b3;
}

p {
    font-family: "Consolas", "Andale Mono WT", "Andale Mono", "Lucida Console",
        "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono",
        "Liberation Mono", "Nimbus Mono L", "Monaco", "Courier New", Courier,
        monospace;
    color: #e6cce6;
}

.grid-container {
    display: grid;
    grid-template-columns: [hline1] 1% [hline2] auto [hline3] 1% [hline4];
    grid-template-rows: [vline1] 1% [vline2] auto [vline3] 1% [vline4];
}

.grid-item {
    text-align: center;
}

.left {
    grid-column-start: 1;
    grid-column-end: 2;
    grid-row-start: 2;
    grid-row-end: 3;
}

.center {
    grid-column-start: 2;
    grid-column-end: 3;
    align-self: center;
    /*position: relative;*/
}

.right {
    grid-column-start: 3;
    grid-column-end: 4;
    grid-row-start: 2;
    grid-row-end: 3;
}

.ascii {
    position: absolute;
    top: 50;
    left: 50;
    bottom: 0;
    z-index: -1;
    margin: auto;
    color: #800080;
}

.asciiShadow {
    text-shadow: -40px 65px #b366b3, -80px 130px #800080, -120px 195px #4d004d, -160px 260px #1a001a;
    color: #e6cce6;
    position: relative;
    z-index: -1;
    padding-left: 160px;
}

.asciiMenu {
    color: #e6cce6;
    position: absolute;
    top: 50;
    left: 50;
    bottom: 0;
    z-index: 0;
    margin: auto;
}