h2 {
	text-align: center;
}

div.blog-post {
	display: none;
}

div.blog-comments {
	background-color: #e8eded;
	padding: 1rem;
	border-radius: 1rem;
	clear: both;
}

p.comments-heading {
	font-weight: bold;
}

p.comment-from {
	font-weight: bold;
	padding: 0;
	margin: 0;
	text-transform: uppercase;
}

p.comment-date {
	font-weight: bold;
	text-transform: uppercase;
}

p.comment-from .label, p.comment-date .label {
	font-size: smaller;
}

div.image-banner, div.image-left, div.image-right {
	background-color: #e8eded;
	border: 1px solid #9faaaa;
	padding: 0.25rem;
	font-size: smaller;
	text-align: center;
	border-radius: 0.5rem;
}

div.image-banner {
	width: 100%;
	margin-bottom: 0.5rem;
	clear: both;
}

div.image-left {
	float: left;
	width: 50%;
	max-width: calc(300px + 0.5rem);
	margin-right: 0.5rem;
	margin-bottom: 0.5rem;
	clear: left;
}

div.image-right {
	float: right;
	width: 50%;
	max-width: calc(300px + 0.5rem);
	margin-left: 0.5rem;
	margin-bottom: 0.5rem;
	clear: right;
}

div.image-banner img, div.image-left img, div.image-right img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 0.25rem;
}

p.centre-quote {
	text-align: center;
	font-style: italic;
}

div#year-selector {
	padding-bottom: 1rem;
	display: flex;
    align-items: baseline; /* vertical */
    justify-content: center; /* horizontal */
}

div#year-selector a {
	display: inline-block;
	font-weight: bold;
	text-decoration: none;
	color: #10549b;
	padding-left: 0.5rem;
	padding-right: 0.5rem;
	width: calc(4ch + 1rem);
}

a#year-current {
	font-size: 36pt;
	opacity: 100%;
	background-color: #b4e9fa;
	border-radius: 0.5rem;
}

a#year-minus-1, a#year-plus-1 {
	font-size: 30pt;
	opacity: 80%;
}

a#year-minus-2, a#year-plus-2 {
	font-size: 24pt;
	opacity: 60%;
}

a#year-minus-3, a#year-plus-3 {
	font-size: 18pt;
	opacity: 40%;
}