@font-face {
	font-family: "DINdong";
	src: url('font/DINdong.woff');
}

*, *::before, *::after {
  box-sizing: border-box;
}
* {
  margin: 0;
}
body {
	font-family: Courier New, monospace;
	max-width: 1600px;
	margin: 0 auto;
}
img, picture, video, canvas, svg {
	display: block;
	max-width: 100%;
}
input, button, textarea, select {
	font: inherit;
}
h1, h2, h3, h4, h5, h6 {
	overflow-wrap: break-word;
	margin: 18px;
	padding: 0;
	font-family: 'DINdong', Georgia, serif;
}
h1, h2, h3, h4, h5, h6 { 
	font-weight: normal;
}
h1 { font-size: 3rem; }
h2 { font-size: 3rem; }
h3 { font-size: 2rem; }
h4 { font-size: 1.5rem; }

p, ul, ol, dl {
	line-height:1.5;
	overflow-wrap: break-word;
	margin: 18px 36px;
}

ul, ol, dl {
	padding-left: 18px;
}

.container {
	display:flex;
    flex-wrap:wrap;
    margin:auto;
}

nav {
	flex: 1 1 25%;
	padding: 18px;
}

.sticky {
	position: sticky;
	top: 36px;
	text-align: center;
}

nav a {
	display: block;
	padding: 15px;
	border-top: 1px solid black;
	font-size: 1.5rem;
	text-decoration: none;
	color: black;
}
nav a:first-child {
	padding: 0;
	border-top: 0;
}

a:hover, a:focus {
	background-color: lightcyan;
	text-decoration: none;
}

main { flex: 1 1 75%; padding: 18px 0; }

footer { text-align: center; }

.imgwrap { line-height: 0; column-count: 2; column-gap: 0px; }  
.imgwrap img { width: 100% !important; height: auto !important; }