/* Allgemein */
body { margin: 0; font-family: Helvetica, Arial, sans-serif; padding: 0; }

/* Kopfteil */
.kopf { width: 100%; height: 170px; background-color: #FFFFFF; margin-bottom: 20px; color: #FFFFFF; font-size: 1em; text-align: center; margin-top: 20px; }
.kopf a:link { color: #9c9e9f; text-decoration: none; }
.kopf a:visited { color: #9c9e9f; text-decoration: none; }
.kopf a:active { color: #9c9e9f; text-decoration: underline; }
.kopf a:hover { color: #9c9e9f; text-decoration: underline; }
.kopfinhalt { max-width: 1100px; margin-right: auto; margin-left: auto; height: 50px; }
.kopf1 { width:30%; height:90px; float:left; padding-top: 0px; font-weight: bold; vertical-align: middle; }
.kopf1 img { height: 170px; }
.kopf2 { width:70%; height:auto; float:left; padding-top: 0px; font-weight: bold; vertical-align: middle; }
.kopf3 { width:5%; height:auto; float:left; padding-top: 0px; vertical-align: middle; }
.kopf4 { width:25%; height:auto; float:left; padding-top: 0px; text-align: right; vertical-align: middle; }
.kopf h2 { font-size: 2.5em; color: #557CB3; font-style: oblique; margin-top: 60px; font-variant: small-caps; margin-bottom: 0px; }

@media screen and (max-width : 1000px){
.kopf { visibility: hidden; height: 0px; overflow: hidden; }
}

/* Menü */
.menuebg { width: 100%; background-color: #557CB3; position: inherit; height: 60px; margin-bottom: 60px; }
.menue { max-width: 1100px; height: 60px; margin-right: auto; margin-left: auto; margin-bottom: 15px; font-size: 1.1em; text-align: center; color: #333333; background-color: #557CB3; }
.menue a:link { color: #ffffff; text-decoration: none; padding: 5px; }
.menue a:visited { color: #ffffff; text-decoration: none; }
.menue a:active { color: #557CB3; background-color: #ffffff; }
.menue a:hover { color: #557CB3; background-color: #ffffff; }
.menue1 { width:300px; background-color: white; height:49px; float:left; padding-top: 10px; text-align: center; }
.menue1 img { height: 40px; width: auto; }
.menue2 { width: 100%; height:auto; text-align: center; padding-top: 20px; }
.menue_mobil { visibility: hidden; height: 0px; }

@media screen and (max-width : 1000px){
.menue { visibility: hidden; height: 0px; margin-bottom: 0px; margin-top: 0px; overflow: hidden; }
.menue_mobil { visibility: visible; height: auto; font-size: 1.4em; text-align: center; color: #D9ECFA; margin-bottom: 15px; margin-top: 5px; }
.menuebg { visibility: hidden; height: 0px; margin-bottom: 0px; margin-top: 0px; overflow: hidden; }
    
/*Strip the ul of padding and list styling*/
#show-menu { width: auto; height: auto; }
nav ul {
	list-style-type:none;
	margin:0;
	padding:0;
	position: static;
	display: none;
}

/*Create a horizontal list with spacing*/
nav li {
	display:inline-block;
	float: left;
	margin-right: 1px;
	margin-bottom: 1px;
}

/*Style for menu links*/
nav li a {
	display:block;
	min-width:140px;
	height: 70px;
	text-align: center;
	line-height: 70px;
	font-size: 1em;
	color: white;
	background: #557CB3;
	text-decoration: none;
}

/*Hover state for top level links*/
nav li:hover a {
	background: #D9ECFA;
	color: #557CB3;	
}

/*Style for dropdown links*/
nav li:hover ul a {
	background: #D9ECFA;
	color: #557CB3;
	height: 70px;
	line-height: 70px;
}

/*Hover state for dropdown links*/
nav li:hover ul a:hover {
	background: #D9ECFA;
	color: #557CB3;
}

/*Hide dropdown links until they are needed*/
nav li ul {
	display: none;
}

/*Make dropdown links vertical*/
nav li ul li {
	display: block;
	float: none;
}

/*Prevent text wrapping*/
nav li ul li a {
	width: auto;
	min-width: 100px;
	padding: 0 20px;
}

/*Display the dropdown on hover*/
nav ul li a:hover + .submenu, .submenu:hover { display: block; }

/*Style 'show menu' label button and hide it by default*/
.show-menu {
	font-size: 1.0em;
	text-decoration: none;
	color: darkslateblue;
	background: white;
	text-align: center;
	padding: 15px 0;
	display: none;
}

.show-menu img { width: 90%; }

/*Hide checkbox*/
nav input[type=checkbox]{
    display: none;
}

/*Show menu when invisible checkbox is checked*/
nav input[type=checkbox]:checked ~ #menu{
    display: block;
}

nav ul li, li a {
		width: 100%;
	}
.show-menu { margin-bottom: 1px; display:block; }
nav label { background-color: white; }
}

/* Hauptbild-Bereich */
.bildbereich { position: inherit; width: 100%; height: auto; margin-bottom: 20px; border-style: none; }
.bild { max-width: 1100px; margin-right: auto; margin-left: auto; }
.bild img { width: 100%; }
.gallery { max-width: 1240px; margin-right: auto; margin-left: auto; text-align: center; }
.gallery img { width: 300px; padding-right: 30px; padding-bottom: 30px; }

@media screen and (max-width : 1000px){
.bildbereich { height: auto; }
}

/* Hauptteil */
.mitte:before, .mitte:after { content: ""; display: table; }
.mitte:after { clear: both; }
.mitte { color: #404040; font-size: 1em; clear: both; *zoom: 1; margin-right: auto; margin-left: auto; max-width: 1100px; padding-right: 16px; padding-left: 16px; margin-bottom: 20px; line-height: 140%; }
.mitte a:link { color: #BEBEBE; text-decoration: underline; }
.mitte a:visited { color: #BEBEBE; text-decoration: underline; }
.mitte a:active { color: #557CB3; text-decoration: underline; }
.mitte a:hover { color: #557CB3; text-decoration: underline; }
.mitte h1 { color: #557CB3; text-align: center; }
.mitte h2 { color: #557CB3; text-align: center; }
.mitte h3 { color: #557CB3; text-align: center; }
.mitte h4 { color: #557CB3; }
.mitte input { width: 60%; padding: 12px 20px; margin: 8px 0; box-sizing: border-box; }
.mitte textarea { width: 60%; height: 200px; padding: 12px 20px; margin: 8px 0; box-sizing: border-box; }
.mitte1 { color: #404040; font-size: 1em; width:100%; height:auto; float:left; }
.mitte2 { color: #404040; text-align: left; width:100%; height:100%; float:left; }
.summary-table-first-col { padding: 10px; font-weight: bold; vertical-align: top; }
.mitte legend { font-size: 1.2em; font-weight: bold; }
.mitte td { vertical-align: top; padding: 10px; }
.mitte table { margin-bottom: 20px; }

@media screen and (max-width : 1024px){
.mitte h2 { font-size: 1.7em; }
.mitte h3 { font-size: 1.2em; }
}

@media screen and (max-width : 1000px){
.mitte { width: 96%; padding-right: 0px; padding-left: 0px; font-size: 0.9em; }
.mitte1 { width: 100%; }
.mitte2 { width: 100%; }
.mitte input { width: 96%; }
.mitte textarea { width: 96%; }
.mitte h2 { font-size: 1.4em; }
.mitte h3 { font-size: 1.1em; }
}

/* Fussteil */
.footer_bg { width: 100%; height: 150px; background-color: #D9ECFA; position: inherit;  }
.footer { max-width: 1100px; width: 96%; margin-right: auto; margin-left: auto; color: #557CB3; font-size: 1em; }
.footer a:link { color: #557CB3; text-decoration: none; }
.footer a:visited { color: #557CB3; text-decoration: none; }
.footer a:active { color: #557CB3; text-decoration: underline; }
.footer a:hover { color: #557CB3; text-decoration: underline; }
.footer1 { width:60%; height:auto; float:left; padding-top: 20px; padding-bottom: 20px; background-color: #D9ECFA; text-align: center; }
.footer1 img { height: 80px; padding-left: 30px; padding-right: 30px; }
.footer2 { width:35%; height:auto; float:left; padding-top: 25px; padding-bottom: 20px; background-color: #D9ECFA; font-size: 1em; text-align: center; }
.footer3 { width:5%; height:auto; float:left; padding-top: 20px; padding-bottom: 20px; background-color: #D9ECFA; text-align: right; }
.footer3 img { padding: 1px; }

@media screen and (max-width : 1000px){
.footer { width: 100%; font-size: 0.8em; }
.footer1 { width: 100%; text-align: center; padding-bottom: 5px; padding-top: 15px; }
.footer2 { width: 100%; text-align: center; padding-bottom: 5px; padding-top: 5px; line-height: 180%; }
.footer3 { width: 100%; text-align: center; padding-top: 5px; }
}