/* Fast Grid Layout */
/* fgl.css			*/
html {
	margin: 0;
	box-sizing: border-box;
	font-size: 16px;
	background: darkorange;
	font-family: "ABeeZee", "Cardana", "Lucida Sans", "Aptos", "Calibri", "Noto Sans", "Verdana", "Droid Sans", "Sans Serif", "Sans-Serif", "Arial", sans-serif;
}
span {
	font-size: 115%;
	font-style: bolder;
	line-height: 1.25em;
} 
.container {
	display: grid;
	grid-gap: 0.25em;
	grid-template-rows: auto 1fr;
	grid-template-areas: 
		'banner'
		'nav'
		'main'
		'footer'
	;
}
@media (min-width: 41em) {
	.container {
		grid-template-areas: 
			'banner banner banner banner'
			'nav main main main'
			'footer footer footer footer'
		;
		grid-template-columns: 200px auto auto auto;
		margin: 0.05em;
}
	footer {
		display: grid;
		grid-template-areas:
			'adresse linklist eh-logo'
			;
		grid-template-columns: 1fr 1fr auto;
		background-color: black;
	}
}
header	{ grid-area: banner; }
nav		{ grid-area: nav; }
main	{ grid-area: main; }
footer	{ grid-area: footer; }
  
body main {
	background-color: ivory;
}
p {
	padding: 0 1%; 
}
body header h1 {
	background-color: black;
	color: white;
	text-shadow: 0.05em -.04em .05em darkorange;
	text-align: center;
	font-size: clamp(4rem, calc(6vw+1rem), 5rem);
	padding: 2em; /* mehr Platz -- OK */
	margin: 0.15em 0.01em;
}
header > nav ul li {
	display: inline;
	list-style: none;
	text-align: center;
}
header > nav ul {
	text-align: center;
	background-color: black;
	margin-right: 0;
}
h1,  h2,  h3,  h4 {
	color: darkorange;
	padding: min(0.25em, 2%); 
}
h1 {
	font-size: 2rem;
}
h2 {
	font-size: 1.5rem;
}
h3 {
	font-size: 1.25rem;
}
h4 {
	font-size: 1.1rem;
}
abbr {
	font-size: 0.8em;
}
ul, ol {
	color: black;
	list-style-type: circle;
}
li::marker {
	color: dimgrey;
}
a:link, a:visited {
	color: darkorange;
	font-style: normal;
	text-decoration: none;
	text-decoration-color: darkorange;
}
a:hover {
	color: white;
	background: black;
	font-style: normal;
	text-decoration: none;
}
img {
	max-width: 100%;
	height: auto;
	aspect-ratio: 16 / 10;
	object-fit: cover;
}
.logo img, .eh-logo img {
	max-width: 100%;
	height: auto;
	aspect-ratio: 24 / 10;
}
nav {
	display: inline;
}
nav ul {
	padding: 0.2% 0 0.3% 0; 
	margin: 0 0.5% 0 0;	
	
}
nav ul li {
	list-style: none;
	margin: 0;
	padding: 0 1% 0 2%; 
}
nav ul li a:link, nav ul li a:visited {
	color: darkorange;
	font-style: normal;
	text-decoration: none;
	padding: 0 1px;
	background-color: black;
	color: white;
}
nav ul li a:hover {
	color: black;
	background: white;
	border-top: 2px solid darkorange;
	border-bottom: 2px solid darkorange;
	border-radius: 5px;
	padding: 0 1px;
}
nav ul.subnav {
	list-style: none;
	margin: 0;
	padding: 0;
	background-color: black;
	border-bottom: 2px solid white;
}
nav ul.subnav li {
	margin-left: 0.75em;
	margin-right: 0.75em;
	padding: 2px;
	border-top: 1px solid white;
}
#dashline, #pause { 
	max-width: 100%; 
	padding-left: 1%;
}

#dashline tr, #dashline th, #pause tr, #pause th {
	border: 1px solid orange;
}
#dashline td, #pause td { 
	border-bottom: 1px dashed orange;
	border-left:  0;
	border-top: 0;
	border-right: 0;
	padding-top: 2px;
}
#pause tr td {
	text-align: center;
}
footer {
	padding: 0.5em 1em;
	margin: 0;
	background-color: black;
}
.container footer h2, footer p, .container footer ul, .container footer ul li {
	
	color: white;
}
.container > footer a:link, .container > footer a:visited {
	color: darkorange;
	font-style: normal;
	text-decoration: none;
}
.container > footer a:hover {
	color: black;
	background: white;
	font-style: normal;
	text-decoration: none;
}
.container footer figure, .container footer figure img {
	padding-top: 0.25em;
}
