html, body {
    background-color: #000000;
    color: #FFFFFF;
    font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
    margin: 0px;
}
header {
    padding: 5px;
    margin-bottom: 10px;
}
a {
    color: #0099FF;
    text-decoration: none;
}
a:hover {
    text-decoration: underline;
}
table, tbody {
    background-color: #111111;
    width: 100%;
    padding: 2px;
    margin: 0px auto;
}
th, td {
    padding: 10px;
}
.history-id {
    width: 1px;
    font-weight: bold;
}
.history-name {
    text-align: left;
}
.name-anchor {
    text-decoration: none;
    color: #0099FF;
}
.name-anchor:hover {
    text-decoration: underline;
}
.history-date {
    text-align: right;
    font-weight: bold;
}
#error-box {
    background-color: #B22222;
    border: 1px solid #F08080;
    text-align: center;
    width: 50%;
    padding: 10px;
    margin: 0px auto;
    margin-bottom: 10px;
    visibility: collapse;
}
#query-box {
    background-color: #111111;
    color: #FFFFFF;
    border: 1px solid #222222;
    font-size: 110%;
    width: 98%;
    height: 40px;
    padding: 10px;
    margin-bottom: 20px;
}
#query-box:focus {
    border: 1px solid #0099FF;
    outline: none;
}
#profile-info, #profile-history {
    margin-bottom: 10px;
    border: 1px solid #222222;
    overflow: auto;
    max-height: 52vh;
}
#container {
    width: 60%;
    margin: 0px auto;
}
@media (max-width: 1080px) {
    #container {
        width: 90%;
    }
}