html {
    height: 100%;
}

body {
    margin: 0;
    font-size: .85em;
    font-family: Helvetica, 'Segoe UI', Geneva, Verdana, sans-serif;
    color: #232323;
    background-color: #cccccc;
    background: #cccccc;
    background: linear-gradient(#cccccc, #404040);
}

input {
    width: 200px;
    padding: 5px;
}

header, footer, nav, section {
    display: block;
}

h1 {
    color: #800000;
}

h2, h4 {
    color: #505050;
}

/* unvisited link */
a:link {
    color: #505050;
    text-decoration: none;
}

/* visited link */
a:visited {
    color: #505050;
    text-decoration: none;
}

/* mouse over link */
a:hover {
    color: #800000;
    text-decoration: underline;
}

/* selected link */
a:active {
    color: #0000FF;
    text-decoration: underline;
}

/* Menu layout */
ul.topnav {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #333;
}

ul.topnav li {float: left;}

ul.topnav li a {
    display: block;
    color: white;
    background-color: #404040;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    border-right: 1px solid black;
}

ul.topnav li a:hover:not(.active) {background-color: #333;}

ul.topnav li a.active {background-color: #3C861C;}

ul.topnav li.right {float: right;}

.footer {
    font-size: .8em;
    color:white;
    background-color:#606060;
    text-align:center;
    padding: 3px;
}

.linktable {
    border:1px solid #cccccc; 
    width:100%; 
    padding:0px; 
    text-align:center;
}

.linktablecell {
    border:1px solid #cccccc; 
    text-align:center;
    width:50%;
    padding:2px;
}

@media screen and (max-width: 600px){
    ul.topnav li.right,
    ul.topnav li {float: none;}
}