:root { --special-color: #D77D0F; --color: #827D79; --bg-color: #F5F6F5; }

body { padding: 0; margin: 0; font-family: Roboto, Tahoma, Geneva, Verdana, sans-serif; font-size: 12pt; color: var(--color); line-height: 2em; }
a, a:hover { text-decoration: none; color: var(--special-color); }
header { text-align: center; }
header .logo { padding: 1em 3em; width: 50%; max-width: 417px; }
header .banner { width: 100%; padding: 0; }
nav { line-height: 2em; max-width: 1024px; margin: 0 auto; font-size: 0.8em; padding: 0 2em 1em; }
nav a { text-transform: uppercase; padding: 0 3em 0 0; color: var(--color); }
nav a.selected { color: var(--special-color); }
article { background-color: var(--bg-color); padding: 0; }
article img { float:left; padding: 1em 0; }
.page { min-height: 15em; max-width: 1024px; margin: 0 auto; padding: 2em; }
.indent p { padding-left: 180px; }
footer { position: fixed; bottom: 0; left: 0; right: 0; background-color: var(--bg-color); border-top: 1px solid #ffffff; }
footer>div { max-width: 1024px; margin: 0 auto; font-size: 0.8em; padding: 1em 2em; }

@media only screen and (max-width: 512px) { 
    article img { float: none; }
    .indent p { padding-left: 0px !important; }
}