@charset "utf-8";
/* Einfache fließende Medien
   Hinweis: Für fließende Medien müssen Sie die Attribute 'height' und 'width' des Medium aus dem HTML-Code entfernen
   http://www.alistapart.com/articles/fluid-images/ 
*/
img, object, embed, video {
	max-width: 100%;
}
/* IE 6 unterstützt keine maximale Breite, verwenden Sie daher eine Standardbreite von 100% */
.ie6 img {
	width:100%;
}

/*
	Dreamweaver-Eigenschaften für fließende Raster
	----------------------------------
	dw-num-cols-mobile:		5;
	dw-num-cols-tablet:		12;
	dw-num-cols-desktop:	12;
	dw-gutter-percentage:	25;
	
	Idee durch den Artikel "Responsive Web Design" von Ethan Marcotte 
	http://www.alistapart.com/articles/responsive-web-design
	
	und "Golden Grid System" von Joni Korpi
	http://goldengridsystem.com/
*/

/* Layout für Mobilgeräte: 480 px oder weniger. */
     #heat-cookie,
    #heat-cookie * {
      box-sizing: border-box;
    }

    #heat-cookie {
	display: none;
	position: fixed;
	left: 0px;
	width: 100%;
	height: 60px;
	padding-left: 30px;
	padding-right: 30px;
	line-height: 60px;
	background: #0C3;
	color: #fff;
	text-align:center;
	font-family: Arial, Helvetica, sans-serif;
	padding-top: 0px;
	top: 0px;
    }

    #heat-cookie a {
      color: #fff;
    }

    #heat-cookie #description {
      float: left;
    }

    #heat-cookie #accept {
      float: right;
    }

    #heat-cookie #accept a {
      border: 1px solid #fff;
      padding: 5px 10px;
      text-decoration: none;
    }
#Kopf{
	background-color:#FFF;
	}
.flex-container {
	display: flex;
	width:100%;
}

.flex-item {
	margin: .5em;
	padding: .5em;

}
#bild{

	text-align:center;
	}	
#gruppe{

	text-align:center;
	}
	#footer-cookie,
    #footer-cookie * {
      box-sizing: border-box;
    }

    #footer-cookie {
      display: none;
      position: fixed;
      bottom: 0px;
      left: 0px;
      width: 100%;
      height: 60px;
      padding-left: 30px;
      padding-right: 30px;
      line-height: 60px;
      background: #303030;
      color: #fff;
    }

    #footer-cookie a {
      color: #fff;
    }

    #footer-cookie #description {
      float: left;
    }

    #footer-cookie #accept {
      float: right;
    }

    #footer-cookie #accept a {
      border: 1px solid #fff;
      padding: 5px 10px;
      text-decoration: none;
    }

 
.gridContainer {
	margin-left: auto;
	margin-right: auto;
	width: 87.36%;
	padding-left: 1.82%;
	padding-right: 1.82%;
}
#cookiebanner{
	background-color:#000;
	color:#F00;

	}
#cookiebanner p{
	
		text-align:center;
	}
.block {
	text-align:left;
	}
.textcenter{
	text-align:center;
	
	}
#LayoutDiv1 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;

}


#navi {
	margin-left: 0;
	width: 100%;
	display: block;
}
#navi ul{
	padding: 0px;
	margin: 0px;
	}
	#navi li{
	color:#FFF;
	font-size:14px;
	font-weight:bold;
	display:block;
	list-style:none;
	border:#0C6 solid;
	background-color:#0c6;
	padding-left:5px;
	margin-bottom:3px;
	}
#navi a{
	color:#FFF;
	text-decoration:none;
	}
#navi a:hover{
	color:#030;
	}
#navi2 {
	margin-left: 0;
	width: 100%;
	display: block;
}
#navi2 ul{
	padding: 0px;
	margin: 0px;
	}
	#navi2 li{
	color:#FFF;
	font-size:14px;
	font-weight:bold;
	display:block;
	list-style:none;
	border:#060 solid;
	background-color:#060;
	padding-left:5px;
	margin-bottom:3px;
	}
#navi2 a{
	color:#FFF;
	text-decoration:none;
	}
#navi2 a:hover{
	color:#030;
	}
		
	#bodytext{
	color:#000;
	/*text-shadow: black 0.2em 0.2em 0.3em;*/
	margin-top: 0px;
	padding-top: 5px;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 5px;
	margin-left: 0px;
	display: block;
	text-align: center;
	
	background-image:url(../image/hintergrund.jpg);
	background-position: center;
	/*background-size:100% 100%;*/
	min-height: 300px;
	background-color: #333;
}
#bodytext li{
	list-style:none;
	}


a.button:link {
	/*text-decoration:none;
	border:none;
	font-size:9px;*/
	color:#FFF;
	text-decoration:none;
	border-style: outset;
	border-color: #333;	
	background:#666;
	}
a.button:visited{
	/*text-decoration:none;
	border:none;
	font-size:9px;*/
	}
a.button:hover{
	color:#C0C;
	border-style:outset;
	border-color:#666;
	/*text-decoration:none;
	border:none;
	font-size:9px;*/
	}
#aktuelles{
	font-family:Arial, Helvetica, sans-serif;
	font-size:16px;
	font-weight: bold;
	color: #F00;
	}
#bodytext a{
	color:#FFF;
	text-decoration:none;
	border-style: outset;
	border-color: #333;	
	background:#0c6;
	text-decoration:none;
	border:none;
	
	}
#bodytext a:hover{
	color:black;
	border-style:outset;
	border-color:#666;

text-decoration:none;
	border:none;
	
	}
#bodytext h1{
	color:#000;
	/*text-shadow: black 0.2em 0.2em 0.3em;*/
	font-size:16px;
	text-align:center;
	
	}
#bodytext h2{
	color:#000;
	/*text-shadow: black 0.2em 0.2em 0.3em;*/
	font-size:14px;
	text-align:center;
	}
#bodytext h3{
	color:#000;
	/*text-shadow: black 0.2em 0.2em 0.3em;*/
	front-size:12px;
	text-align:center;
	
	}
#bodytext p{
	color:#000;
	font-weight:bold;
	padding-top:5px;
	padding-left:10px;
	padding-right:10px;
	padding-bottom:5px;
	/*background:rgba(255,255,255,.5);
	box-shadow:0 5px 15px rgba(0,0,0,.8);*/
	
	}
#kurs{
	color:#000;
	text-align:left;
	font-weight:bold;
	padding-top:5px;
	padding-left:10px;
	padding-right:10px;
	padding-bottom:5px;
	background:rgba(255,255,255,.5);
	box-shadow:0 5px 15px rgba(0,0,0,.8);
	}

  #footer {
	margin-top:-10px;
	background-color: #0c6;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 12px;
	text-align: center;
}
#footer li {
	
	display: inline;
	margin-top:0px;
	padding-top: 2px;
	padding-right: 5px;
	padding-bottom: 2px;
	padding-left: 5px;
	border-bottom:none;
	border-right:1px #FFF solid;
	border-left:none;
	border-top:none;
	list-style-type: none;
	color: #FFF;
	text-align: center;
}
#footer li:last-child{
	border-right:none;
	}
#footer a{
	font-family: Verdana, Geneva, sans-serif;
	font-size: 12px;
	color: #FFF;
	text-decoration: none;	
	}
#footer a:hover{
	color:#030;
	}
#datenschutz{
	font-size:smaller;
	text-align:left;
	}
#datenschutz a{
	color:#0F0;
	background: transparent;
	text-decoration:underline;
	border-style:none;
	}
#datenschutz a:hover{
	color:#FF0;
	text-decoration:underline;
	border-style:none;
	}

/* Layout für Tablet-PCs: 481 bis 768 px. Erbt Stile vom: Layout für Mobilgeräte. */

@media only screen and (min-width: 520px) {
	


.gridContainer {
	width: 91.45%;
	padding-left: 0.775%;
	padding-right: 0.775%;
}
#LayoutDiv1 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#navi {
	
	margin-top: 2px;
	padding-right: 10px;
	padding-top: 0px;
	padding-bottom: 5px;
	margin-bottom: 0px;
	width: 100%;
	height:100%;
	display: block;
	background-color: #0c6;

}
#navi ul{
	padding: 0px;
	margin: 0px;
	}
#navi li{
	color:#FFF;
	font-size:14px;
	font-weight:bold;
	display: inline;
	border-bottom:none;
	border-left:5px;
	border-right:2px #FFF solid;
	border-left:none;
	border-top:none;
	
	padding-left:5px;
	margin-bottom:3px;
	}
#navi li:last-child{
	border-right:none;
	}
#navi li:first-child{
	padding-left:5px;
	}
#navi a{
	color:#FFF;
	text-decoration:none;
	}
#navi a:hover{
	color:#030;
	}



	#bodytext h1{
	font-size: 18px;
	color: #000;
	}
	#bodytext h2{
	font-size: 16px;
	color: #000;	
	}
	#bodytext h3{
	front-size: 14px;
	text-align: center;
	color: #000;
	}
#bodytext{
margin-top:0px;
/*text-shadow: black 0.2em 0.2em 0.3em;*/
	padding-top:3px;
	font-size:14px;
	margin-left: 0;
	display: block;
	text-align:center;
	min-height:450px;
	background-color:#333;
}
}

/* Desktoplayout: 769 bis maximal 1232 px.  Erbt Stile von: den Layouts für Mobilgeräte und Tablet-PCs. */

@media only screen and (min-width: 769px) {
.gridContainer {
	width: 88.5%;
	max-width: 1232px;
	padding-left: 0.75%;
	padding-right: 0.75%;
	margin: auto;
}
#LayoutDiv1 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#navi{
	margin-right: 10px;
	background-color: #0c6;
	text-align: left;
	font-family: Verdana, Geneva, sans-serif;
	color:#FFF;
	font-size: 18px;
	
	}
	#navi li{
	color:#FFF;
	font-size:14px;
	font-weight:bold;
	display: inline;
	border-bottom:none;
	border-right:2px #FFF solid;
	border-left:none;
	border-top:none;
	}
#navi a:link{
	
	color:#FFF;
	text-decoration:none;
	font-family:Verdana, Geneva, sans-serif;
	font-size:14px;

	}
 a:visited{
	color:#999;
	text-decoration:none;
	font-family:Verdana, Geneva, sans-serif;
	font-size:14px;

	}
 a:hoover{
	color:#333;
	text-decoration:none;
	font-family:Verdana, Geneva, sans-serif;
	font-size:14px;

	}
 a:active{
	color:#333;
	text-decoration:none;
	font-family:Verdana, Geneva, sans-serif;
	font-size:14px;

	}
#navi li:last-child{
	border-right:none;
	padding-right:5px;
	}
#navi2{
	margin-right: 10px;
	background-color:#060;
	text-align: left;
	font-family: Verdana, Geneva, sans-serif;
	color: #fff;
	font-size: 18px;
	
	}
	#navi2 li{
	color:#FFF;
	font-size:14px;
	font-weight:bold;
	display: inline;
	border-bottom:none;
	border-right:2px #FFF solid;
	border-left:none;
	border-top:none;
	}
#navi2 a:link{
	color:#fff;
	text-decoration:none;
	font-family:Verdana, Geneva, sans-serif;
	font-size:14px;

	}
 a:visited{
	color:#999;
	text-decoration:none;
	font-family:Verdana, Geneva, sans-serif;
	font-size:14px;

	}
 a:hoover{
	color:#333;
	text-decoration:none;
	font-family:Verdana, Geneva, sans-serif;
	font-size:14px;

	}
a:active{
	color:#333;
	text-decoration:none;
	font-family:Verdana, Geneva, sans-serif;
	font-size:14px;

	}
#navi2 li:last-child{
	border-right: none;
	padding-right: 5px;
	text-align: right;
	}
		
	
	#bodytext h1{
	font-size: 20pt;
	color: #000;
	}
		#bodytext h2{
	font-size: 18px;
	color: #000;	
	}
	#bodytext h3{
	front-size: 16px;
	text-align: center;
	color: #000000;
	}
	#bodytext p{
		font-size:14;
		}
#bodytext{
	magin-top: 0px;
	text-align: center;
	font-size: 16px;
	/*text-shadow: black 0.2em 0.2em 0.3em;*/
	
	/*background-image:url(../image/chalkboard-517818_1920.jpg);*/
	background-position: center;
	background-size: 100% 100%;
	min-height: 500px;
	background-color: #333;
	font-family: sans-serif;
}

}
   @media (max-width: 1200px) {
      #footer-cookie {
        padding-top: 30px;
        padding-bottom: 30px;
        line-height: inherit;
        height: auto;
      }

      #footer-cookie #description {
        width: 100%;
      }

      #footer-cookie #accept {
        width: 100%;
        margin-top: 15px;
      }

      #footer-cookie #accept a {
        width: 100%;
        display: block;
        text-align: center;
      }
    }