body {background: #060; max-width: 72em; padding: 1ex 5em}

h2, h3, h4 {text-align: center}
a:link, a:visited {color: #900}

a.shy {color: black; text-decoration: none}
a.shy:hover {text-decoration: underline}

table, th, td {
    border: 1px solid gray; border-collapse: collapse;
}
table.noborder, table.noborder td {border: none}
td {padding: 1mm 2mm}
abbr {/* border-bottom: 1px dotted black; */ cursor: help}

.header, .main {
    background: white;
    padding: 5px .5em; 
    border: 5px solid #900;
    min-width: 36em;
}
.container { 
    max-width: 68em;
    margin: 0px auto;
}
.header h2, .header h3, .header h4 {font-weight: normal; margin: 0pt}
.header h2 { font-variant: small-caps; margin-bottom: 4pt}
.header {text-align: center}
.menu-left {float: left}
.menu-right {float: right}
.menu-left, .menu-right {
    line-height: 140%;
    padding: 3pt 2pt;
    font-size: 13pt;
}
.menu-left + .menu-left {padding-left: 1ex}
.menu-main {text-align: center; padding: 5pt; font-size: 13pt}
.menu-main > a {padding: 3pt}
.menu-main > span > a {padding: 3pt}
.menu-main > span > span {padding: 3pt}
.footer {min-width: 36em; text-align: center; font-size: smaller}

@media (max-width: 1024px) {
    body {padding: 1ex 1.5em}        
}

@media (max-width: 700px) {
    body {padding: 1px}
    .header, .main {min-width: 20em}
    .main {padding: 2px}
    .xtra, #logo {display: none}
    #title {left: 0 !important}
    td {padding: 1mm 1mm}
}

@media print {
    .header, .footer, .noprint {display: none}
    .main {border: none}
    body {padding: 1mm}
    a:link, a:visited {text-decoration: none; color: black}
    .container {max-width: none}
}