@charset "utf-8";
/* CSS Document */

html {

	overflow-x: auto;
	overflow-y: scroll;
	visibility: visible;
	scrollbar-color: #4df #cef;			/*für Firefox*/
	scrollbar-3d-light-color: #2ff;
	scrollbar-arrow-color: #007;			/*Pfeile IE*/
	scrollbar-base-color: #4df;
	scrollbar-dark-shadow-color: #007;
	scrollbar-face-color: #4df;			/*Scrollbalken IE*/
	scrollbar-highlight-color: #cef;		/*Scrollgrund IE*/
	scrollbar-shadow-color: #cef;			/*Rand Balken IE*/
}
::-webkit-scrollbar {
	background-color: #cef;		/*Scrollleiste gesamt Chrome*/
}
::-webkit-scrollbar-button {
	background-color: #cef;		/*Scrollbuttons Chrome*/
}
::-webkit-scrollbar-track {
	background-color: #cef;		/*Scrollgrund Chrome*/
}
::-webkit-scrollbar-thumb {
	background-color: #4df;		/*Scrollbalken Chrome*/
}

body {
	background-color: #ddf8ff;
	font-family: "Arial", "Helvetica", "FreeSans", sans-serif;
	font-size: 1rem;
	line-height: 1.3rem;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-align: left;
	text-transform: none;
	text-decoration: none;
	color: #1a0;
	position: relative;
	float: left;
	clear: none;
	margin: 0px;
	padding: 0px;
	left: 0px;
	top: 0px;
	z-index: 1;
	height: 100%;
	width: 100%;
}

/* 1-3-spaltig*/
@media screen and (max-width: 47rem) {
	#inhalt {
		width: 20rem;
		left: calc((100% - 21rem) / 2);
	}
	.flexblock {
		display: flex;
		flex-wrap: wrap;
		justify-content:center;
		box-sizing: border-box;
	}
	.start {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		flex-direction: row;
		justify-content: center;
		box-sizing: border-box;
	}
}
	
/* ab 3-spaltig*/
@media screen and (min-width: 47rem) {
	#inhalt {
		width: calc(100% - 5rem);
		left: 2rem;
	}
	.flexblock {
		display: flex;
		flex-wrap: wrap;
		flex-direction: row;
		justify-content: center;
		box-sizing: border-box;
	}
	.start {
		width: 100%;
		max-width: 32rem;
		display: flex;
		flex-wrap: wrap;
		flex-direction: row;
		justify-content: center;
		box-sizing: border-box;
	}
}

#inhalt {
	position: relative;
	float: left;
	clear: none;
	text-align: center;
	align-content: center;
	overflow: visible;
	margin-bottom: 3rem;
	margin-top: 1rem;
	padding-bottom: 1rem;
	padding-right: 1rem;
	padding-top: 0px;
	top: 0px;
	height: 100%;
	z-index: 2;
}

#logo {
	position: relative;
	text-align: center;
	margin-left: 1rem;
	height: auto;
	min-width: 15.0rem;
	width: calc(100% - 1rem);
	max-width: 31rem;
	z-index: 7;
}

.flexblock {
	margin-bottom: 3rem;
	top: 0px;
	height: auto;
	width: auto;
	z-index: 3;
}

.start {
	background-color:#aadd11;
	border-radius: 0.31rem;
	text-align: center;
	margin-left: 1rem;
	margin-bottom: 1rem;
	padding: 1rem;
	box-shadow: -0.2rem 0.2rem 1.3rem #0bb8;
	z-index: 4;
}

h1,
h2,
h3 {
	font-family: Segoe Print, Bradley Hand, Verdana, Geneva, sans-serif;
	text-align: center;
	font-style: italic;
	font-weight: bold;
	font-variant: normal;
	text-transform: none;
	text-decoration: none;
}
h1 {
	font-size: 3.1rem;
	line-height: 2.7rem;
	color: #fd0;
	text-shadow: 0 0 0.3rem #fe0;
}
h2 {
	font-size: 1.9rem;
	line-height: 2.3rem;
	color: #3c0;
	text-shadow: -0.05rem 0.1rem 0.2rem #5c0;
	height: 4.6rem;
}
.start h2 {
	color: #fea;
	text-shadow: 0 0 0.3rem #f80;
}

.start a {
	position: relative;
	float: left;
	display: block;
	height: 100%;
	width: 100%;
}
.start a, 
.start a:visited {
	color: #370;
}
.start a:hover, 
.start a:active, 
.start a:focus {
	color: #b0d;
}

a, 
a:visited, 
a:hover, 
a:active, 
a:focus {
	text-decoration: none;
}
a, 
a:visited {
	color: #5c0;
}
a:hover, 
a:active, 
a:focus {
	color: #b0d;
}
a:hover h2, 
a:active h2, 
a:focus h2 {
	color: #fff;
	text-shadow: 0 0 0.3rem #05c;
}
.absatz {
	min-height: 8rem;
}

.keyvis {
	display: flex;
	align-self: flex-end;
	width: 100%;
	margin-bottom: 1rem;
}
.linkcont {
	position: relative;
	float: left;
	clear: both;
	height: 2.7rem;
	margin-bottom: 1rem;
	width: 100%;
}
.link {
	position: relative;
	float: left;
	clear: both;
	display: block;
}
.linkcont img {
	position: relative;
	float: left;
	clear: left;
}
.beschr {
	position: relative;
	float: left;
	clear: none;
	text-align: left;
	margin-left: 1rem;
	height: 100%;
	width: calc(100% - 4rem);
}

.left {
	float: left;
	text-align: left;
}
.bold {
	font-weight: bold;
	line-height: 1.3rem;
}
.small {
	font-size: 80%;
	line-height: 100%;
}

