/* Schriftgröße */
html { font-size: 2.5em;}

@media only screen and (min-device-width: 481px) {
  /* For general iPad layouts */
/*	html { font-size: 18px;}*/
}

body { 
	background-image:none;
	background-color: #73a3ca;
	padding: 0px;
	font-family: Calibri, Helvetica, Arial, sans-serif;
	margin: 0px;
}

nav {
	position: sticky;
	top: 1em;
	display: block;
	background-color: #e1721b;
	margin: 1em;
	border-radius: 1em;
	padding: 1em;
	text-align: center;
}

nav a {
	text-decoration: none;
	color: white;
	font-weight: bold;
}

main { 
	margin: 1em;
	padding: 1em;
	background-color: white;
}
h1, h2, h3, h4, h5, h6 { text-align: center; }

header { 
	margin: 0px;
	z-index: 10;
	background-color: #73a3ca;
}

img.sdgIcon, img.sdgTier {
	width: 80%; /* 393 - 2*10 - 2*15 = 343 */
	margin: 0px auto 0px auto;
	display: block;
}

.foldedIn, .foldedOut {
	border: 1px solid #73a3ca;
	border-radius: 1em;
	padding: .5em;
}

.foldedIn {
	background-color: #73a3ca;
	color: white;
}
.foldedIn:before { content:'\25B6  '; }

.foldedOut {
	background-color: white;
	color: #73a3ca;
}
.foldedOut:before { content:'\25BD  '; }

.foldingArea {
	height: 0;
	overflow: hidden;
	transition: height .5s;
	margin: 0px;
}

.foldingArea.open {
	height: auto;
}

a.external, .footer a.external, a.external:hover, .footer a.external:hover {
	padding-right: 0px;
	background-image: none;
}

.antworten {
	padding: 0px;
}
.antworten li {
	display: block;
	background-color: #e1721b;
	margin: 1em;
	border-radius: 1em;
	padding: 1em;
	text-align: center;
	color: white;
	font-size: 120%;
}

.explanation {
	display: none;
}
#evaluation {
	color: #a00;
}
input[type=number] {
	font-size: .8em;
	margin-right: 1em;
}
button {
	font-size: .8em;
	background-color: #73a3ca;
	color: white;
	border-radius: 1em;
	border-width: 0px;
	padding: .3em .8em;
}

.stationen {border-collapse:collapse;}
.stationen th { background-color: #73a3ca; color: white; padding: .1em .2em; }
.stationen td { padding: .1em .2em; text-align: center; }
.stationen tr:nth-child(odd) td { background-color: #eee;  }
.stationen a { text-decoration: none;  color: #009; }

.loesungFalsch { display: none; color: #a00; text-align: center; }
.loesungRichtig { display: none; color: #0a0; text-align: center; }

footer {
	padding-top: 0px;
	text-align: center;
}
footer p, footer a { font-size: 1em;}
.mobileOnly { display: block; }

footer a { text-decoration: none; color: #ccc; padding: .2em .4em; border-radius: .5em; }
footer a:hover { background-color: #83b3da; color: white; }

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait) {
  /* For portrait layouts only */
}

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) {
  /* For landscape layouts only */
}