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

*, *:before, *:after {
	-webkit-box-sizing: border-box; /* Safari/Chrome, andere WebKit-Browser */
	-moz-box-sizing: border-box; /* Firefox, andere Gecko-Browser */
	box-sizing: border-box; /* Opera/IE 8+ */
}
/* ----------------------------------------------------------------------------- */

.clearfix:before,
.clearfix:after {
content: " ";
display: table;
}
.clearfix:after {
clear: both;
}
.clearfix {
*zoom: 1;
}

/*clearfix zum sicheren floaten in allen Browsern*/

*, html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, label, fieldset, input, p, blockquote, th, td {
    margin: 0px;
    padding: 0px;
}
body {
	font-size: 100%;
	font-family: Verdana, Arial, Trebuschet MS, sans-serif;
}

/*! Generated by Font Squirrel (https://www.fontsquirrel.com) on August 17, 2017 */



h1 {
	font-size: 1.75em;
	color: #000;
	font-style: italic;
}

h2 {
	font-size: 1.5em;
	color: #669999;
	font-style: italic;
}

h3 {
	font-size: 1.313em;
	color: #669999;
	font-style: italic;
}

h4 {
	font-size: 1.25em;
	color: #669999;
	font-style: italic;
}

h5 {
	font-size: 1.125em;
	color: #669999;
	font-style: italic;
}

p {
	font-size: 0.938em;
	line-height: 1.5em; /*24/16*/
	color: #333333;
	font-family: Verdana, Arial, Trebusche, sans-serif;
}


a {
	color: #669999;
	font-weight: bold;
	text-decoration: none;
	}

.klein {
	font-size: 0.6em; }
img {
	max-width: 100%;
	height: auto;
}

.wrapper {
	 margin: 0 auto;}
	 
.container {
	width: 100%;
	height: 100%;
	margin: 0 auto;
	text-align: left;
	background-color: #fff;
	border: 1px solid #666699;
}


.header {
	margin: 0 auto;
	width: 100%;
	height: 150px;
	padding: 10px;
	text-align: center;
	background-color: #fff;
}                                                                                                                                                     0

.logo {
	width: 30%;
	height: auto;
}
 .titel {
	 width: 100%;
	 height: auto;
	 font-size: 1.25em;
	 color: #669999;
 }

.menue {
	width: auto;
	margin: 0;}

	
.main {
	padding: 10px;
	width: 98%;
	min-heigth: 98%;
	margin: 0 auto;
	background-color: #fff;
}

.mainCcontent {
	margin: 0;
	padding: 10px;
	background-color: fff;}
	
.img-inhalt {
	margin: 5px 0;}

.rechts {
	background-color: #dbe3e8;
	text-align: center;
	padding: 10px;
	}
	
.text-rechts {
	text-align: left;
	padding: 10px 0;
	line-height: 1.0em;
}

.text-rechts p {
	color: #474a4f;}

ul.text {
	list-style-type: none;
} 

ul.text li:before {
    content: '\2022';
    color: #000066;
    padding-right: 0.5em;
}


.footer {
	font-size: 0.75em;
	color: #474a4f;
	padding: 5px;
	text-align: center;
} 



/* ----------------------------------------------------------------------------- *
 *                           750px / 16px/em = 46.875em                          *
 *                     umgestellt auf Mobile first min-width                     *
 * ----------------------------------------------------------------------------- */

@media only screen and (min-width: 46.875em) {

.wrapper {
	margin: 10px auto;}

.container {
	width: 100%;
	heigth: 100%;
	margin: 0 auto 0 auto;
	text-align: left;
	background-color: #fff;
	border: 1px solid #666699;
}
.header {
	margin: 10px auto;
	background-color: #fff;
	width: 100%;
	height: 100px;
}

.logo {
	width: 20%;
	float: left;
}

.titel {
	 width: 80%;
	 float: right;
	 padding: 10px 0;
	 font-size: 1.75em;
	 color: #669999;
 }
 
.main {
	width: 98%;
	min-heigth: 100%;
	background-color: #fff;
	}

.mainContent {
	margin: 0;
	padding: 10px;
	width: 65%;
	float: left;
}

.rechts {
	width: 35%;
	background-color: #ccc;
	text-align: center;
	padding: 10px;
	float: right;
	
}}

/* ----------------------------------------------------------------------------- *
 *                          Styles für Desktops                            *
 *                           1024px / 16px/em = 64em                             *
 * ----------------------------------------------------------------------------- */
@media only screen and (min-width: 64em) {

body {

background: #fff;
}
  
 .wrapper {
	 margin: 20px auto;
	 width: 1024px;
	 }

 .container {
		margin: 0;
		min-height: 100%;
		-webkit-box-shadow: 0px 0px 11px 1px rgba(0,0,0,0.38);
-moz-box-shadow: 0px 0px 11px 1px rgba(0,0,0,0.38);
box-shadow: 0px 0px 11px 1px rgba(0,0,0,0.38);
	 }
.logo {
	width: 20%;
	float: left;
}

.titel {
	 width: 80%;
	 float: right;
	 padding: 10px 0;
	 font-size: 2.0em;
	 letter-spacing: 2px;
	 color: #669999;
 }
 
.flexslider {
	max-height: 800px;} 
 .mainContent {
	margin: 0;
	padding: 10px;
	width: 70%;
	float: left;
}

.rechts {
	width: 30%;
	margin: 68px 0 0 0;
	background-color: #ccc;
	text-align: center;
	padding: 10px;
	float: right;}
}

/* ----------------------------------------------------------------------------- *
 *                          Styles für Desktops                            *
 *                           1024px / 16px/em = 64em                             *
 * ----------------------------------------------------------------------------- */
@media only screen and (min-width: 120em) {
	
	body {
background-color: #fff;}
  
 .wrapper {
	 margin: 20px auto;
	 width: 1400px;}
	 
	.mainContent {
	margin: 0;
	padding: 10px;
	width: 75%;
	float: left;
}

.rechts {
	width: 20%;
	margin: 68px 0 0 0;
	background-color: #ccc;
	text-align: center;
	padding: 10px;
	float: right;}