html, body {
    height: 100%;
}

#banner {
    text-align: center;
    padding: 1em;
}

.container {
    min-height: 100%;
}

@media (min-width: 800px) {
  .container {
    width: 50%; }
}

#content {
    padding-bottom: 4em;
}

#pelican {
    position: absolute;
    bottom: 0;
    width: 85%;
    height: 4em;
}

@media (min-width: 400px) { 
  #pelican {
    width: 100%; }
}

.navbar {
    background-color: #333;
    overflow: hidden;
    margin-bottom: 1em;
}

label {
    font-style: italic;
    color: #9EABB3;
}

/* Style the links inside the navigation bar */
.navbar > a {
    float: left;
    display: block;
    color: #f2f2f2;
    text-align: center;
    padding: 05px 12px;
    text-decoration: none;
    font-size: 15px;
}

/* Change the color of links on hover */
.navbar > a:hover {
    background-color: #ddd;
    color: black;
}

/* Add an active class to highlight the current page */
.active {
    background-color: purple;
    color: white;
}

#pelican, 
#content > header {
    font-size: .9em; 
}

.article-entry {
    margin-top: 1em;
}

.article-entry > div {
    margin: 0 2em 0 1em;
}

.toshow {
    display: none;
}

.article-entry:target > .toshow {
    display: revert;
}

.article-entry:target > .tohide {
    display: none;
}

#content > header > time {
    display: block; 
}

a {
    text-decoration: none;
}

#tags > a {
    text-decoration: underline;
}

blockquote {
    margin: .5em 0 .5em 0;
    padding: 1em;
    background-color: hsl(0,0%,50%,.1);
}

p {
    margin-bottom: 0;
}

figure {
    float: right;
    margin: 5px 0px 0px 10px;
}

img {
    width: 200px;
}
