html {
	background: #f2f2f2;
	font-family: sans-serif;
}

body {
	margin: 0;
	padding-bottom: 1em;
}

header>.content, main, footer {
	max-width: 100ch;
	margin-left: auto;
	margin-right: auto;
	padding-top: 1em;
	padding-left: 1ch;
	padding-right: 1ch;
}

header {
	width: 100%;
	background-image: linear-gradient(#a7cdf3, #f2f2f2);
}

header>.content {
	margin-bottom: 2em;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.logo {
	flex: 2;
}

nav {
	flex: 1;
	text-align: center;
	align-items: center;
	vertical-align: center;
	margin-left: 4ch;
}

nav>ul {
	display: flex;
	flex-direction: row;
	margin: 0;
	padding: 0;
	width: 100%;
}

nav>ul>li {
	display: flex;
	margin: 0;
	padding: 0;
	vertical-align: middle;
}

nav>ul>li.fb>a, nav>ul>li.fb>a:hover {
	background: 0;
	border: 0;
	padding: 0;
	width: 2ch;
}

nav>ul>li.fb>a>img {
	display: inline-block;
	vertical-align: middle;
	height: 1.5em;
}

nav>ul>li>a, nav>ul>li>b {
	width: 15ch;
	max-width: 100%;
	display: block;
	margin: 0.125em;
	border: 1px solid #315883;
	border-radius: 0.25em;
	padding: 0.125em;
	background: #315883;
	color: #fff;
	text-decoration: none;
	font-weight: bold;
}

nav>ul>li>a.ext {
	background: #fff;
	color: #315883;
}

nav>ul>li>b {
	/*border: 4px solid #9a1a4b;*/
	box-shadow: 0 0 0.5em #9a1a4b;
	text-decoration: underline;
}

nav>ul>li>a:hover, nav>ul>li>b:hover {
	background: #416893;
}

nav>ul>li>a.ext:hover {
	background: #ddd;
}

.logo>img {
	max-width: 100%;
	height: auto;
}

footer {
	clear: both;
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-top: 3em;
	border-top: 1px solid #315883;
}

footer>section {
	margin-top: 1em;
	text-align: center;
}

footer>section#details {
	display: flex;
	flex-direction: row;
	align-items: top;
}

footer>section#details>.detail {
	margin-top: 0;
	margin-left: 2em;
	margin-right: 2em;
}

footer>section#statement {
	text-align: center;
	max-width: 75%;
}

h1, h2, h3, h4, h5, h6 {
	clear: both;
	margin-top: 0.5em;
	margin-bottom: 0.25em;
}

.float-right {
	float: right;
	max-width: 50%;
}

figure img {
	max-width: 100%;
	border-radius: 1em;
}

dl {
	margin-left: 1ch;
}

dt {
	font-weight: bold;
	margin-top: 0.75em;
	margin-bottom: 0.25em;
}

dd>p {
	margin-top: 0.25em;
	margin-bottom: 0.25em;
}

div.address {
	margin-top: 1em;
	margin-bottom: 1em;
}

a.fb>img {
	height: 1.9em;
}

@media screen and (max-width: 80em)
{
	nav {
		margin: 0;
		max-width: 24em;
		width: 90%;
	}
	nav>ul {
		flex-direction: column;
	}
	nav>ul>li>a, nav>ul>li>b, nav>ul>li.fb>a, nav>ul>li.fb>a:hover {
		width: 100%;
	}
	header>.content {
		flex-direction: column;
		align-items: center;
	}
}

@media screen and (max-width: 60em)
{
	body {
		font-size: 1.25em;
	}

	header>.content, main, footer {
		width: 90%;
	}

	.float-right {
		float: none;
		max-width: 100%;
	}

	footer>section#details {
		flex-direction: column;
	}
}