html {
	box-sizing: border-box;
	font-family: Arial, Helvetica, sans-serif;
}
*, ::before, ::after {
	box-sizing: inherit;
}
body {
	background-color: #fefbd9;
	margin-top: 0;
	margin-left: 0;
	margin-right: 0;
}
header {
	background-image: linear-gradient(#0066ff, #e3eeff);
	border-top: 0.5em solid #ffc237;
	/*background-color: #FFBF00;*/
	padding-left: 0.5em;
	padding-bottom: 0.5em;
}
h1, h2 {
	margin: 0.2em auto;
}
table {
	background-image: linear-gradient(#f0f0f0, #bbbbbb, #f0f0f0);
	/*background-color: #d2d2f6;*/
	/*table-layout: fixed;*/
	text-align:left;
	/*border-collapse: collapse;*/
	width: 100%;
	border: 2px solid #0066ff;
	border-radius: 0.5em;
	box-shadow: 0.1em 0.1em 1em 0.5em #bbbbbb;
}
tr:not(:first-child) > td {
	border-top: 1px solid #ffc237;
}
main {
	text-align: center;
}
.page-wrapper {
	margin: 0 auto;
}
img {
	background-image: linear-gradient(#f0f0f0, #bbbbbb, #f0f0f0);
	border: 2px solid #0066ff;
	border-radius: 0.5em;
	box-shadow: 0.1em 0.1em 1em 0.5em #bbbbbb;
	max-width: 100%;
	height: auto;
	display: block;
	margin: 0 auto 1em !important;
}
nav > ul > li {
	list-style-type: none;
	background-image: linear-gradient(#f0f0f0, #bbbbbb, #f0f0f0);
	/*margin-bottom: 0.5em;*/
	border-top: 0.2em solid #f0f0f0;
	border-bottom: 0.2em solid #f0f0f0;
}
nav > ul > li > a {
	text-decoration: none;
	color: #0066ff;
	font-weight: bold;
}
nav > ul {
	padding-left: 0;
}
.spalte1 {
	width: 15em;
}
.spalte2 {
	width: 7em;
}
.spalte3 {
	/*width: 4em;*/
}
header > nav > ul >li.active {
	border-bottom: 0.2em solid #ffc237;
}
@media (min-width: 60em) {
	header {
		text-align: center;
	}
	nav > ul {
		margin: 0;
		padding: 0;
		overflow: hidden;
		display: inline-block;
		width:100%;
	}
	nav > ul > li {
		float: left;
		/*text-align: left;*/
		/*display: inline;*/
	}
	nav > ul > li > a {
		display: block;
		padding: 0 1em;
		font-size: 1.4em;
	}
	main {
		display: flex;
		/*clear: both;*/
	}
	table {
			/*table-layout: fixed;*/
	}
	.mainleft {
		flex: 0 1 35%;
		padding: 0.2em;
		text-align: center;
	}
	.spalte3 {
		visibility: collapse;
	}
  td + td +td {
		display: none;
	}
	.mainright {
		flex: 0 1 65%;
		padding: 0.2em;
		text-align: center;
	}
	.mainleft > table {
		width: 22em;
		margin: auto;
	}
	.mainright > table, img {
		width: 35em;
		margin: auto;
	}
}
@media (min-width: 80em) {
	table {
			table-layout: fixed;
	}
	.spalte3 {
		visibility: visible;
	}
	.mainleft > table {
		width: 29em;
	}
	.mainright > table, img {
		width: 50em;
	}
	  td + td +td {
		display: block;
	}

}