/* Farben: blau: 53799e rot:a12e13; */

.flexslider {
	z-index:1;
	position:relative;
	width:100%;
	margin:0 auto;
}

.flex-direction-nav a {
	top:50%;
}

.flex-direction-nav .flex-prev {
    left:10px;
    opacity:0;
}

.flex-direction-nav .flex-next {
    right:10px;
    opacity:0;
}

.flex-direction-nav a:before  { 
	font-size: 20px; 
  padding: 0.4em 0.6em 0.4em;
  border-radius: 1em;    
  background: #dddddd;
}

#slider ul li p {
	position:relative;
	z-index:5;
	margin:-30px 0 0 0;
	padding:3px 10px 5px;
	background-color: rgba(255,255,255,0.9);
}

@font-face {
font-family: 'Alexbrush';
  src: url('fonts/alexbrush-regular-webfont.woff2') format('woff2'),
       url('fonts/alexbrush-regular-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
font-family: 'Opensans';
  src: url('fonts/opensans-regular1-webfont.eot');
  src: url('fonts/opensans-regular1-webfont?#iefix') format('embedded-opentype'),
       url('fonts/opensans-regular1-webfont.woff') format('woff'),
       url('fonts/opensans-regular1-webfont.ttf') format('truetype'),
       url('fonts/opensans-regular1-webfont.svg#Opensans') format('svg');
}

@font-face {
font-family: 'OpensansLight';
  src: url('fonts/opensans-light1-webfont.eot');
  src: url('fonts/opensans-light1-webfont?#iefix') format('embedded-opentype'),
       url('fonts/opensans-light1-webfont.woff') format('woff'),
       url('fonts/opensans-light1-webfont.ttf') format('truetype'),
       url('fonts/opensans-light1-webfont.svg#OpensansLight') format('svg');
}

* {
	-webkit-box-sizing: border-box; /* Safari 3.0 - 5.0, Chrome 1 - 9, Android 2.1 - 3.x */
  -moz-box-sizing: border-box;    /* Firefox 1 - 28 */
  box-sizing: border-box;         /* Safari 5.1+, Chrome 10+, Firefox 29+, Opera 7+, IE 8+, Android 4.0+, iOS any */
	margin:0;
	padding:0;
}

html {
	padding: 0 2%;
	background-color:#a5cee2;
	background-image:url(../images/back.jpg);
	background-attachment: fixed;
	background-position:top center;
	background-repeat:no-repeat;
}

body {
  position:relative;
  max-width: 960px;
  margin:0 auto 1500px;
  font-family: Opensans,sans-serif;
	font-size:15px;
	line-height:22px;
  color:#3d5165;
}  

header {
  position:relative;
  background:url(../images/mainheader.png) no-repeat;
  height:132px;
}

header img#logo {
	position:absolute;
	top:30px;
	left:-40px;
	z-index:10;
	width:350px;
}

header #slogan {
	position:absolute;
	bottom:-170px;
	left:50%;
	margin-left:-300px;
	z-index:10;
  width:700px;
  font-family:Alexbrush,sans-serif;
  font-size:60px;
  font-weight:bold;
  line-height:62px;
  color:#ffffff;
}

header #slogan img {
  width:100%;
}

header a#navlink {
	display:none;
  float:right;
  cursor: pointer;
  width: 43px;
  height: 38px;
  background-color: #53799e;
  border-radius:3px;
  margin-top:90px;
}

#navicon { 
	position: relative; 
} 

#navicon::before { 
	content: ""; 
	position: absolute; 
	top:11px; 
	left:11px;
	width:20px; 
	height:3px;
	border-top: 9px double #ffffff; 
	border-bottom: 3px solid #ffffff;
}

#bildoben img {
	width:100%;
	display:block; /* damit bild unten keinen Abstand läßt */
}

main {
  position: relative;
	display:block; /* ohne kann safari nicht abs.pos. und beim IE erbt main keine Breite!!*/
  background-color: rgba(255,255,255,0.80);
  padding:50px 50px 0;
}

article {
  padding:30px 0;
}

section {
  padding:0 0 30px;
}

footer {
  background-color: rgba(254,254,251,1);
  padding:0 50px 30px;
  margin-bottom:30px;
}

nav {
	position:absolute;
	top:145px;
  right:50px;
}

nav ul,
nav ul li {           /* Normalisierung */
  list-style: none; 
  margin: 0; 
  padding: 0;
  border: 0;
}

nav ul li {
	float:left;
}

nav ul li a {
  color:#53799e;
  font-size:15px;
  line-height:15px;
  font-family: Opensans,sans-serif;
  font-weight:bold;
  text-decoration: none;
  padding:4px 0 6px 0;
  border-radius:3px;
	margin:0 0 0 15px;
}

nav ul li a:hover, nav ul a.cur {
  color:#a12e13;
  font-weight:bold;
}

a.mbutton {
  display:block;
  background-color:#53799e;
  color:#ffffff;
  font-size:16px;
  line-height:16px;
  font-family: Opensans,sans-serif;
  font-weight:bold;
  text-align:center;
  text-decoration: none;
  padding:4px 0 6px 0;
  border-radius:3px;
	margin-top:10px;
}

a.mbutton:hover {
  background-color:#a12e13;
  color:#ffffff;
}

article a {
  color:#53799e;
  font-weight:bold;
  text-decoration: none;
}

article a:hover {
  color:#a12e13;
}

footer a {
  color:#53799e;
  font-weight:bold;
 	text-decoration: none;
 	display:block;
 	padding:10px 0 0;
}

footer a:hover, footer a.cur {
  color:#a12e13;
}

h1 {
  font-family: Alexbrush,sans-serif;
	font-size:40px;
	line-height:42px;
  color:#4b6d8f;
  text-align:center;
  margin-bottom:5px;
}

h2 {
  font-family: Opensans,sans-serif;
	font-size:18px;
	line-height:24px;
 	color:#4b6d8f;
  text-align:center;
  margin-bottom:20px;
}

h3 {
  font-family: Opensans,sans-serif;
	font-size:16px;
	line-height:22px;
 	color:#4b6d8f;
  text-align:center;
  margin:10px 0;
}

h4 {
  font-family: Opensans,sans-serif;
	font-size:16px;
	line-height:22px;
 	color:#4b6d8f;
  margin:0 0 10px;
}

p {
  margin-bottom:15px;
}

article ul {
	margin-left:15px;
}

table.content {
	width:100%;	
	padding:10px 0 0;
}

table {
	width:100%;
	margin:10px 0;
}

table.dicht {
	border-collapse:collapse;
}

td {
	vertical-align:top;
	padding:3px;
}

td.fewo {
	border:1px solid #53799e;
	text-align:centered;
}

table.formular {
	width:100%;
	padding:0;
}

td.formleft, td.formright {
	vertical-align:top;
	padding:0 0 8px 0;
}

td.formleft {
	width:115px;
}

input, textarea, select {
  background-color:#FFFFFF;
  border:none;
	font-size:15px;
	line-height:20px;
  font-family: Opensans,sans-serif;
 	color:#53799e;
 	padding:2px 8px 2px 8px;
 	border:1px solid #53799e;
 	border-radius:3px;
}

input, textarea {
 	width:100%;
}

input.button {
  background-color:#53799e;
  color:#ffffff;
  font-weight:bold;
  border-radius:3px;
}

input.button:hover {
  background-color:#a12e13;
}

input.buttontoggle {    
	width:150px;
  color:#ffffff;
  font-weight:bold;
  border-radius:3px;
}

.inactiv {
	background-color:#cccccc;
}

.activ {
	background-color:#53799e;
	cursor:pointer;
}

input.activ:hover {
  background-color:#a12e13;
}

.smallinput {
	width:100px;
}

.marginright {
	margin-right:4%;
}

.marginbottom {
	margin-bottom:10px;
}
.cols2 {
	float:left;
	width:48%;
}

.cols2 img {
	width:100%;
}

.cols3 {
	float:left;
	width:260px;
  padding-top:20px;
	text-align:center;
}

.cols3 img {
	width:100%;
}

.cols3 img.logos {
	height:110px;
	width:auto;
}

.trenner {
	clear:both;
}

.mapsize {
	width:100%;
	height:300px;
}

.linie {
	height:2px;
	width:40px;
	background-color:#53799e; 
	margin:10px 0 0;
}

div.box {					
	  width:100%;
	  border:1px solid #53799e;
	  margin-top:20px;
}

img.boximg {
	  width:100%;
}

div.boxtext {
	  padding:15px;
		font-size:14px;
	  line-height:21px;
}

div.boxtext a {
	display:block;
}

img.plan {
	width:100%;
}

/* -------------- Responsivity --------------------*/

@media only screen and (max-width: 1020px) {
header img#logo {left:-20px;top:10px;width:300px}
header a#navlink {display:inline-block;}
nav {position:relative;top:0;right:0;width:50%;padding:0;margin:0 auto 100px; display:block;text-align:center;}
nav ul li {float:none;}
nav ul li a {display:block;background-color:#53799e;color:#ffffff;padding:4px 0 6px 0;border-radius:3px;margin:10px 0 0 0;}
nav ul li a:hover, nav ul a.cur {background-color:#a12e13;color:#ffffff;}
}

@media only screen and (max-width: 820px) {
html {padding:0 8px}
.cols3 {float:none;width:400px;margin:0 auto;}
.cols2 {float:none;width:400px;margin:0 auto 10px;}
img.plan {display:none}
}

@media only screen and (max-width: 750px) {
td.contentleft, td.contentright {display:block;}
header #slogan {width:80%;margin-left:-40%;}
}

@media only screen and (max-width: 600px) {
header {height:80px;background-image:none}
header a#navlink {margin-top:20px;}
header img#logo {top:0;width:200px}
header #slogan {top:130px;}
nav {width:100%;}
main {padding:20px;} 
footer {padding:0 10px 30px;} 
.cols3 {width:100%}
.cols2 {width:100%}
}

@media only screen and (max-width: 450px) {
table.formular {width:100%}
td.formleft, td.formright {display:block;}
header #slogan {display:none;}
div.box {border:none}
div.boxtext {padding:0;}
}