body {
    margin: 0;
    padding: 12px 0;
    background-color: #3a5f8a;
    background-image:
        linear-gradient(45deg, #34557c 25%, transparent 25%, transparent 75%, #34557c 75%),
        linear-gradient(45deg, #34557c 25%, transparent 25%, transparent 75%, #34557c 75%);
    background-size: 8px 8px;
    background-position: 0 0, 4px 4px;
    font-family: Verdana, Tahoma, Arial, sans-serif;
    font-size: 11px;
    color: #000000;
}

a { color: #0033cc; }
a:visited { color: #663399; }
a:hover { color: #cc0000; background-color: #ffffcc; }

table.page {
    width: 760px;
    margin: 0 auto;
    border: 2px outset #d4d0c8;
    background-color: #ffffff;
    border-collapse: collapse;
}

td.header {
    background: linear-gradient(to right, #0a246a, #3a6ea5 60%, #a6caf0);
    color: #ffffff;
    padding: 0;
    border-bottom: 3px double #000080;
}

.logo {
    font-family: "Courier New", Courier, monospace;
    font-size: 10px;
    line-height: 10px;
    color: #ffff66;
    margin: 8px 12px 0 12px;
    white-space: pre;
    text-shadow: 1px 1px 0 #000000;
}

.tagline {
    font-family: Georgia, "Times New Roman", serif;
    font-style: italic;
    font-size: 13px;
    padding: 2px 12px 8px 12px;
    color: #ffffff;
}

td.ticker {
    background-color: #000000;
    color: #00ff00;
    font-family: "Courier New", Courier, monospace;
    font-size: 12px;
    padding: 2px 0;
    border-bottom: 1px solid #808080;
}

td.menu {
    width: 150px;
    vertical-align: top;
    background-color: #d4d0c8;
    border-right: 2px groove #ffffff;
    padding: 6px;
}

td.content {
    vertical-align: top;
    padding: 10px 14px;
    line-height: 1.5;
}

td.footer {
    background-color: #d4d0c8;
    border-top: 2px groove #ffffff;
    text-align: center;
    padding: 8px;
    font-size: 10px;
    color: #333333;
}

.box {
    border: 1px solid #000080;
    background-color: #ffffff;
    margin-bottom: 10px;
}

.box-title {
    background: linear-gradient(to right, #000080, #1084d0);
    color: #ffffff;
    font-weight: bold;
    padding: 2px 4px;
    font-size: 11px;
}

.box-body {
    padding: 4px;
}

.menu-link {
    display: block;
    padding: 2px;
    text-decoration: none;
    font-weight: bold;
}

.menu-link::before {
    content: "\25BA\00a0";
    color: #000080;
    font-size: 8px;
}

.menu-link:hover {
    text-decoration: underline;
}

h1 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 18px;
    color: #000080;
    border-bottom: 2px solid #000080;
    margin: 0 0 8px 0;
    padding-bottom: 2px;
}

h2 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #ffffff;
    background-color: #336699;
    padding: 2px 6px;
    margin: 16px 0 6px 0;
}

h3 {
    font-size: 12px;
    color: #993300;
    margin: 12px 0 4px 0;
}

pre, code, tt {
    font-family: "Courier New", Courier, monospace;
    font-size: 12px;
}

pre.console {
    background-color: #000000;
    color: #c0c0c0;
    border: 2px inset #808080;
    padding: 6px;
    overflow-x: auto;
    line-height: 1.3;
}

pre.console .ok { color: #16c60c; }
pre.console .dir { color: #3b78ff; }
pre.console .root { color: #e74856; }

code {
    background-color: #eeeeee;
    padding: 0 2px;
}

table.grid {
    border-collapse: collapse;
    width: 100%;
    margin: 4px 0 8px 0;
}

table.grid th {
    background-color: #d4d0c8;
    border: 1px solid #808080;
    padding: 2px 4px;
    text-align: left;
    font-size: 11px;
}

table.grid td {
    border: 1px solid #c0c0c0;
    padding: 2px 4px;
    vertical-align: top;
    font-size: 11px;
}

table.grid tr:nth-child(even) td {
    background-color: #f0f4ff;
}

.news-date {
    font-weight: bold;
    color: #cc6600;
}

.new {
    color: #ff0000;
    font-weight: bold;
    animation: blink 1s steps(1, end) infinite;
}

@keyframes blink {
    50% { visibility: hidden; }
}

.button88 {
    display: inline-block;
    width: 84px;
    height: 27px;
    border: 2px outset #ffffff;
    margin: 2px;
    font-family: "Small Fonts", Tahoma, Verdana, sans-serif;
    font-size: 9px;
    font-weight: bold;
    text-align: center;
    line-height: 13px;
    vertical-align: middle;
    overflow: hidden;
    text-decoration: none;
}

.b-blue { background: linear-gradient(#5b9bd5, #003399); color: #ffffff; }
.b-black { background-color: #000000; color: #00ff00; }
.b-gray { background: linear-gradient(#ffffff, #b0b0b0); color: #000080; }
.b-red { background: linear-gradient(#ff6666, #990000); color: #ffff00; }

.counter {
    display: inline-block;
    background-color: #000000;
    color: #ff3300;
    font-family: "Courier New", Courier, monospace;
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 3px;
    padding: 1px 4px;
    border: 2px inset #808080;
}

.download-button {
    display: inline-block;
    padding: 8px 18px;
    background: linear-gradient(#fff8c0, #ffcc00);
    border: 3px outset #ffcc00;
    color: #000000;
    font-size: 16px;
    font-weight: bold;
    text-decoration: none;
    font-family: Arial, Helvetica, sans-serif;
}

.download-button:hover {
    border-style: inset;
    background: linear-gradient(#ffcc00, #fff8c0);
    color: #000000;
}

.warning {
    border: 2px dashed #cc0000;
    background-color: #fff0f0;
    padding: 6px;
    margin: 8px 0;
}

.note {
    border: 1px solid #999966;
    background-color: #ffffe1;
    padding: 6px;
    margin: 8px 0;
}

.small {
    font-size: 10px;
    color: #555555;
}

hr {
    border: 0;
    border-top: 1px solid #808080;
    border-bottom: 1px solid #ffffff;
}

@media (max-width: 780px) {
    body { padding: 0; }
    table.page, table.page > tbody, table.page > tbody > tr, table.page > tbody > tr > td {
        display: block;
        width: auto;
        box-sizing: border-box;
    }
    table.page { border: 0; }
    td.menu { border-right: 0; border-bottom: 2px groove #ffffff; padding: 6px 16px; }
    td.content { padding: 10px 16px; }
    td.footer { padding: 8px 16px; }
    .logo { font-size: 7px; line-height: 7px; overflow: hidden; max-width: 100%; }
    td.ticker { overflow: hidden; }
    td.ticker marquee { display: block; width: 100%; }
    table.grid { display: block; overflow-x: auto; }
}
