header {
	padding:0 0 1em 0;
	border-bottom:1px solid maroon;
}
header li {
	display:inline-block;
}
header li a {
	text-decoration:none;
	color:#4C5656;
	padding: 0 15px 0 15px;
}
header li a:hover {
	border:solid thin black;
}
header li a:visited {
	color:black;
}
header h1 {
text-align: center;
color:maroon;

}
footer {
	 border-top:1px solid maroon;
	padding:1em;
}

footer li {
	list-style:none;
}

footer li a {
	color:black;
	padding:.5em;
	text-decoration: none;
}
footer li a:hover {
	border:solid thin black;
}
footer li a:visited {
	color:black;
}
/*img {float:left;}*/

/* PAGE
*/
html {
	background: #FFF;
}
body {
	font-family: Helvetica, Arial, sans-serif;
	line-height: 1.618;
	margin: auto;
	max-width: 53em;
	padding: 1em;
	position: relative;
}
body a,
body a:visited {
	color:#232b2b;
}
main {
	padding:2em 0 2em 0;
}
blockquote, dl, fieldset, figure, hr, ol, p, pre, table, ul, ._notes {
	margin: 1.618em auto;
}
dt {
  background-image: linear-gradient(90deg, #4c5656 70%, whitesmoke);
	padding: 3px 0 6px 15px;
	margin:0.3em;
	border-radius:5px;
}
dt b {
	color: whitesmoke;
}
.mouse-form {
  background-color:whitesmoke;
}
.mouse li {
	color: #000028;
	margin: 3px;
	padding: 9px;
	overflow: scroll;
}
.mouse li:hover span{
	background-color:#ddd1a4;
}
details[open] {
	border: 1px solid #4c5656;
	padding:7px;
	box-shadow: 0 0 7px 1px grey;

}
details summary {
	padding:0 0 7px 9px;
	background-color:#A8D8E9;
}
details {
	padding:0 0 15px 0;
}
._blogavi {
	border:1px solid maroon;
	border-radius:5px;
	padding:1em;
	margin:1px 1px 2em;
	background-image:linear-gradient(180deg, white 80%,  #D2B48C 20%);
	box-shadow: 1px 3px 7px 2px #D2B48C;
}
._blogavi ul {
	display:flex;
	flex-flow:row wrap;
  justify-content:center;
}
._blogavi :link {
	text-decoration:none;
}
._blogavi li {
	list-style:none;
	border-radius:3px;
	margin:0.5em;
	display:inline-block;
	padding:0.9em;
	border:1px solid maroon;
  color:black;
	background-color:#fff8dc;
}
._blogavi li:hover {
  background-color:#D2B48C;
}
b {
  color:#4c5656;
}

/* QUOTATIONS
*/
blockquote {
	border-left:15px double #4c5656;
	padding: 0 0 15px 5px;
	box-shadow:1px 1px 5px 1px;
}

blockquote footer {
	font-size: smaller;
	margin: .618em auto;
}

[value="x"]:checked + label {
color: white; 
background-color: green; 
padding: 0.2em;}

[value=""]:checked +  label {
color: white; 
background-color: red; 
padding: 0.2em;}

[value="x"]:checked + label:after {
content:" ?? ... Tada! Richtig!"}

[value=""]:checked +  label:after {
content:" ... Das ist nicht korrekt."}

[value="a"]:checked + label {
color: red; 
font-size: 3em;}

[value="a"]:checked + label:after {
content:"..Klick nicht auf alles was du siehst!"}

[value="b"]:checked + label {
color: #000028; 
font-size: 2em;}

[value="b"]:checked + label:after {
content:"Super. du hast das K�stchen gefunden ?"}

/* HEADINGS AND SEPARATORS
*/

._subhead {
	display: block;
	font-size: large;
	font-weight: normal;
}
h1, 
h2,
h1 ._subhead, 
h2 ._subhead,
h3 {
	line-height: 1.414;
  color:#4c5656;
}
h3, h3 ._subhead {
	font-size: medium;
}
header h1, header h2, header h3 {
	margin-bottom: 0;
}
header p {
	margin-top: .2em;
}
hr {
	border: none;
	border-top: thin solid #4c5656;
	margin: 1em auto;
}
hr._h2 {
	border-color: #4c5656;
}
hr._h3 {
	border-color: #4c5656;
}


/* LINKS AND HINTS
*/
sup a {
	line-height: 0;
	text-decoration: none;
}
span[title] {
	border-bottom:thin dotted black;
	cursor:help;
}


/* PREFORMATED TEXT AND CODE
*/
pre, code {
	font-family: monospace,monospace;
}


/* FIGURES AND CAPTIONS
*/
figure {
	display: block;
}

video {
width: 100%;
height:auto;
}

figure > img, figure > *:first-child img, figure > svg {
	border: none;
	display: block;
	height: auto;
	margin: 0 auto;
	max-width: 100%;
}
figcaption {
	margin-left: auto;
	margin-right: auto;
	margin-top: .3em;
	text-align: center;
	width: 89%;
  color:#000028;
}


/* MATH LABELS
*/
._label {
	align-items: center;
	display: flex;
	height: 100%;
	position: absolute;
	right: 0;
	text-align: right;
	top: 0;
}


/* TABLES
*/
table {
	border-collapse: collapse;
}
table td, table th {
	border: thin black;
	border-style: solid none none solid;
	padding: .3em .5em;
	text-align: left;
}
table td:first-child, table th:first-child {
	border-left: none;
}
table tr:first-child td, table tr:first-child th {
	border-top: none;
}


/* MULTIPLE CHOICE
*/
fieldset {
	border: none;
	margin: 1em 0;
	padding: 0;
}
legend {
	padding: 0 0 1em;
}
legend, fieldset {
	display:block;
	max-width:100%;
	white-space:normal;
}


/* FOOTNOTES
*/
._notes {
	font-size: smaller;
}
._notes hr {
	border-color: gray;
	margin: 2.718em 0 0;
	max-width: 6em;
}
._notes hr + * {
	margin-top: .3em;
}