:root {
    --head-bg-color: #222;
    --head-fg-color: #fff;
    --head-ln-color: #3cf;
}

html, body {
    height: 100%;
    min-height: 100%;
    width: 100%;
}

body {
    margin: 0;
    display: grid;
    grid-template-areas: "header" "content" "footer";
    grid-template-rows: auto 1fr auto;
    grid-template-columns: 100%;
    font-family: "Roboto", "Lucida Grande", "DejaVu Sans", "Bitstream Vera Sans", Verdana, Arial, sans-serif;
}

section#header {
    grid-area: header;
}

section#content {
    grid-area: content;
}

section#footer {
    grid-area: footer;
}


section#header, section#footer {
    background-color: var(--head-bg-color);
    color: var(--head-fg-color);
}

section#header a, section#footer a {
    color: var(--head-ln-color);
    text-decoration: none;
}

div.body {
    width: 1024px;
    margin: 1.5em auto;
}
