body {
    background-color: #000000;
    /* Give things a bit of a margin */
    margin: 10px;
}

a, input, textarea {
    font-size: 30px;
    font-family: Lucida Console, Courier New, sans-serif;
    text-decoration: none;
    margin: 20px 0px 0px 0px;
    padding: 15px 20px;
    /* inline-block respects margins and paddings */
    display: inline-block;
}

a:link, a:visited, input, textarea {
    color: #00ff00;
    background-color: #000000;
    border: 1px solid #00ff00;
}

a:hover, a:active {
    background-color: #00ff00;
    color: #000000;
}

p, #preamble {
    font-family: Lucida Console, Courier New, sans-serif;
    font-size: 28px;
    line-height: 38px;
    color: #00FF00;
    padding: 0 15px;
    margin: 0;
}

#terminal {
    background-color: black;
    font-family: Lucida Console, Courier New, sans-serif;
    font-size: 28px;
    line-height: 38px;
    border: 1px solid #00FF00;
    color: #00FF00;
    padding: 0 15px;
    /* Keep terminal hidden initially for cool animation effects! */
    display: none;
}

#terminal:focus {
    outline: none;
    /* Turn off the border when focused */
    border: none;
    /* To counteract the loss of the 1px border... */
    padding: 1px 15px;
}

#link_wrapper {
    /* Do we want the enter link centered or not? I can't decide */
    /* Left-aligned looks more like an actual computer. */
    /*text-align: center;*/
}

#enter_link, #logout_link {
    /* Override the original anchor tag display to hide it initially*/
    display: none;
}