body {
	background-color: #fffafa;
	display: grid;
	font-family: sans-serif;
	font-size: 14px;
	grid-template-columns: 1fr minmax(0, 1200px) 1fr;
	grid-template-rows: auto 1fr auto;
	height: 100vh;
	line-height: 1.4;
	margin: 0;
}

body > header,
body > footer,
body > main {
	box-sizing: border-box;
	padding: 7px;
}

body > header,
body > footer {
	background-color: #000000;
	color: #aaaaaa;
	height: 100%;
	text-align: center;
	width: 100%;
}

body > header {
	grid-area: 1 / 1 / 2 / 4;
}

body > main {
	grid-area: 2 / 2 / 3 / 3;
}

body > footer {
	grid-area: 3 / 1 / 4 / 4;
}


body > header a,
body > footer a {
	color: #cccccc;
}

body > header a:hover,
body > header a:active,
body > footer a:hover,
body > footer a:active {
	color: #ffffff;
}

body > footer img {
	border-radius: 50%;
}

nav {
	text-transform: uppercase;
}

nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

nav li {
	display: inline;
}

nav a {
	padding: 0 7px;
	white-space: nowrap;
}

body > header p ,
body > footer p {
	margin: 0;
}

a {
	color: #3388ff;
	text-decoration: none;
}

a:hover,
a:active {
	color: #006aff;
}

figure {
	background-position: center;
	background-size: cover;
	margin: 0;
}

header,
main,
footer {
	padding: 0;
}

main > article > header {
	text-align: center;
}

header figure::before {
	background-image: linear-gradient(0turn, #fffafa, #fffafa00 15% 85%, #fffafa);
	content: "";
	display: block;
	height: 50vh;
	margin-bottom: -50vh;
	position: relative;
}

header img {
	object-fit: cover;
	height: 50vh;
	max-height: 1200px;
	width: 100%;
}

header p {
	font-style: italic;
}

article article,
footer article {
	border: 1px;
	border-style: outset;
	box-shadow: 2px 2px 2px #7f7f7f;
	display: grid;
	grid-template-columns: auto 1fr;
	margin: 7px 0px;
	padding: 7px;
	transition: transform .1s;
}

article article:hover,
footer article:hover {
	transform: scale(1.02);
}

article article figure,
footer article figure {
	align-self: center;
	grid-area: 1 / 1 / 2 / 2;
	line-height: 0;
	margin: 0 7px 0 0;
}

article article figure::before,
footer article figure::before {
	background-image: radial-gradient(circle closest-side at 50% 50%, #fffafa00 85%, #fffafa 100%);
	content: "";
	display: block;
	height: 100px;
	margin-bottom: -100px;
	position: relative;
}

article article img,
footer article img {
	height: 100px;
	object-fit: cover;
	width: 100px;
}

article article header,
footer article header {
	align-self: center;
	grid-area: 1 / 2 / 2 / 3;
}

article article header h2,
footer article header h2 {
	color: #3388ff;
	margin-top: 0;
}

article article header p,
footer article header p {
	margin-bottom: 0;
}

article article div,
footer article div {
	grid-area: 2 / 1 / 3 / 3;
}

article > a {
	color: inherit;
}

p img {
	max-width: 100%;
}

.panel_16x9 {
	overflow: hidden;
	padding-top: 56.25%;
	position: relative;
}

iframe {
	border: 0;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}

pre,
.overflow_wrapper {
	background-color: #ffffff;
	overflow: auto;
}

.filtered_immediate {
	max-height: 0;
	overflow: hidden;
}

input:checked + .filtered_immediate {
	max-height: inherit;
	overflow: inherit;
}

label {
	font-style: italic;
}