html, body {
    height:100%;
    margin:0;
} 
#clear {
	float:clear;
}
header {
  position:fixed; 
  top:0px; 
  left:0px;
  width:100%;
  z-index:99;
  min-height:80px;
}
header #background {
  width:100%;
  height:5px;
  line-height:0px;
}  
header #background img{
  width:100%;
  height:5px;
  margin:0;padding:0;
}  
header .wrapper {  
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start; 
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    padding:1% 2%;
}  
header .wrapper img {  
    height:71px; 
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    margin:0;padding:0;
} 
header .wrapper p {   
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto; 
    margin:0;padding:0;
    color:#959595; 
    margin-top:6px;
    margin-left:1%;   
    font-weight:400;
} 
header .wrapper p#info {
    margin:0;padding:0 10px 0 10px;
    color:#fff; 
}   
header .wrapper p span {   
    font-weight:300;
    font-size:0.8em;
}
header .wrapper #menu-mobile { 
    -webkit-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    font-size:3.3em; 
    color:#4e4e4e;
}   
header .wrapper #menu-mobile i { 
    float:right; 
    cursor:pointer; 
} 
#menum {
    display:none;
    position:absolute;
    top:0;
    height:100%;
    width:100%;
    background:url(../images/bg_trans_weiß.png);
    z-index:100;
}   
#menum ul {
    padding:0; 
}  
#menum li {
    list-style:none;
    padding-top:30px;
    text-align:center; 
}    
#menum li a{
    display:inline;
    margin:0 auto;
    text-decoration:none; 
    font-size:1.8em;
    color:#000;
}    
#menum #menum-close{
    position:absolute; 
  	z-index:100;
    top:1%;
    right:2%;
    cursor:pointer; 
    font-size:4em;  
    color:#4e4e4e;
}
header .wrapper nav {
    -webkit-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    display:none;
}  
header .wrapper nav ul {
    width:100%;
    margin:0;padding:0;
}   
header .wrapper nav ul li {
    list-style:none;
    padding-left:3%;  
    float:right;
    display:inline; 
    font-size:1.3em; 
    font-weight:200;  
}     
header .wrapper nav a {
    text-decoration:none;
    color:#1b1b1b; 
}    
header .wrapper nav a:hover {
    color:#bfbfbf; 
}
.infotop #info a {
    text-decoration:none;
    color:#fff; 
}    
.infotop #info a:hover {
    color:#fffaaa; 
}
.infotopwrapper {
	position:absolute; 
	top:100%; 
	left:72%; 
	z-index:90; 
	width:230px; 
	height:28px
}
#infoboxarrow {
	width:84px; 
	height:28px; 
	margin-left:75px;
}
.infotopbox {
	position:absolute; 
	top:100%; 
	left:72%; 
	z-index:89;
	width:230px; 
	height:160px; 
	background-color:#019ed5;
	text-align:center;
}

/* ############# Main Info Fenster ############# */
.maininfo {  
    z-index:90;
    position:absolute;
    bottom:0px;
    width:100%;
    //background:red;
} 
.maininfo #news {  
    background-color:#019ed5;
    padding:0.8% 2% 0.3% 2%; 
}   
.maininfo #news #newsheader {  
    font-size:1em;
    font-weight:400;
    color:#fff;
    padding:0;margin:0; 
}    
.maininfo #news #newsheader img {  
    padding-right:1%;
    display:inline;
    padding-bottom:0;
}     
.maininfo #news #newsheader span {
    vertical-align:top; 
    padding-right:0.5%; 
    line-height:1.5em;
    font-weight:300;   
} 
.maininfo #news #newsheader #news_small { 
  display:inline;
}    
.maininfo #news #newsheader a {  
    //display:none;
    vertical-align:top;
    font-weight:200;  
    line-height:1.5em;
    text-decoration:none; 
    color:#fff;
}     
.maininfo #news #newsheader a:hover { 
}    
footer {
position:relative;
z-index:100;
}
.highfooter, .bottomfooter {         
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-align-content: flex-start;
    -ms-flex-line-pack: start;
    align-content: flex-start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    padding:0 2%;   
    background-color:#4b3e6a; 
    color:#fff;
}  
.highfooter a, .bottomfooter a {  
  text-decoration:none;
  color:#fff;
}    
.highfooter .kontakt, .highfooter .oeffnungszeiten, .highfooter .sitemap, .bottomfooter .kontakt, .bottomfooter .oeffnungszeiten, .bottomfooter .sitemap  {   
    width:30%;
    min-width:200px;
}
.highfooter .footer_flex, .bottomfooter .footer_flex {         
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-align-content: flex-start;
    -ms-flex-line-pack: start;
    align-content: flex-start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;    
    min-width:310px;
} 
.highfooter .footer_flex h4, .bottomfooter .footer_flex h4{  
    width:100%;
    margin-top:15px; 
    margin-bottom:5px;   
    font-size:0.9em;  
}   
.highfooter .footer_flex p, .bottomfooter .footer_flex p{ 
    width:48%;
    padding:0; margin:0;
    padding-bottom:10px;
    font-weight:300; 
    font-size:0.8em; 
    display:block; 
    padding-top:0; 
    padding-bottom:20px;  
    line-height:1.6em;  
    min-width:130px;
}  
.highfooter .footer_flex table, .bottomfooter .footer_flex table{ 
    width:88%;
    padding:0; margin:0;
    padding-bottom:10px;
    font-weight:300; 
    font-size:0.8em; 
    display:block; 
    padding-top:0; 
    padding-bottom:20px;  
    line-height:1.6em;  
    min-width:130px;
}     
.highfooter .kontakt p, .bottomfooter .kontakt p{  
    min-width:280px;      
} 

.start-container {
    height:100%;
    background-color: steelblue; 
    margin-top:0%;
}  
.start-container .info {
    position:absolute;
    top:20%;
    left:2%;
}    
.start-container .info h2{
    font-size:4em;
    font-weight:200;
    line-height:0.1em;
    color:#fff;     
}     
.start-container .info p{
    font-size:1em;
    font-weight:300; 
    color:#fff;     
}

/* ############# MENU-SUB ############# */
#menu_sub {
    display:none;
}  
/* ############## SECTION ############## */ 
.banner {
   position: relative; 
   width: 100%; 
}
.banner img{
   width: 100%;     
   height:auto;
   max-height:220px;
}  
.banner h1 {
    position:absolute;
    top:49%;
    left:2%; 
    font-size:1.7em;
    font-weight:200;
    line-height:0;
    color:#fff;
    margin:0;padding:0;
}   
section {
    position:relative;
    padding:30px 2%;
    font-size:1em;
    line-height:1.3em;
}   
section em {
  font-style:normal;
  color:#019ed5;
}  
section a {
  font-style:normal;
  color:#019ed5;
  text-decoration:none;
}
section p {
    font-size:1em;
    margin-top:0; 
}     
section h1 {
    font-size:1.8em;
    font-weight:300;
    line-height:1.2em;
    color:#3ea9d9;
    margin-top:0; 
    margin-bottom:8px;
}      
section h2 {
    font-size:1.2em;
    font-weight:700;
    color:#505489;
    margin-top:0; 
    margin-bottom:5px;
}    
section h3 {
    font-size:2em;
    line-height:1.1em;
    font-weight:200;
    color:#3ea9d9;
    margin-top:0;
}     
section h4 {
    font-size:1em;
    line-height:1.1em;
    font-weight:400;
    color:#505489;
    margin-top:0;
    margin-bottom:6px;
}    
section h5 { /* gleich h1 */
    font-size:1.8em;
    font-weight:300;
    line-height:1.2em;
    color:#505489;
    margin-top:0; 
    margin-bottom:8px;
}       
section img {
    margin-bottom:15px;
}   
section h3 span {
    display:block;
}    
section ul { 
    padding-left:16px; 
    color:#505489;
}     
section ul li {
    list-style:decimal;
    padding:3px 0;
    margin-left:0;
}   
section ul li ul {
}   
section ul li ul li {
    list-style:disc;
}      
.listnormal {
    margin:0;
}      
.listnormal li {
    list-style:disc;
    padding:3px 0;
    color:#434343;
}  
section.flex{        
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-align-content: flex-start;
    -ms-flex-line-pack: start;
    align-content: flex-start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
} 

section.flex_left{    
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;  
} 
section.col12_big {        
    width:100%;
}   
.flex .flexbox12{        
    width:47%;
}    
.flex .flexbox33{        
    width:100%;
}   
.flex .flexbox13{        
    width:300px;  
    padding-right:20px;
    padding-bottom:20px;
}

/* ################## E-Mail Kontakt ##################### */
section #emailkontakt input, section #emailkontakt textarea {
  width:90%;
  margin-bottom:15px;
} 
section #emailkontakt textarea {
  min-height:150px;
} 
section #emailkontakt label {
  position:absolute;
  left:33%;
  margin-top:-20px;
  font-size:0.8em;
  font-weight:200; 
  color:red;
  width:160px;
  text-align:right;
  z-index:0;
}
section #recheck {
  cursor:pointer;
  color:#019ed5; 
}
/* ################## NEWS ##################### */
/*
#news img {
  padding-bottom:15px;
}  
*/
#news h2 {
  font-weight:700;
  font-size:1.1em;
  margin-bottom:15px;
}
#news .datum {
  font-weight:300;
  color:#505489;
}  
#news .weiter {
  margin-bottom:35px;
} 
#news .morenews {
  display:none;
}  
#news .abschluss {
  height:1px;
  border-top:solid 2px #3fa9d9; 
  border-bottom:solid 2px #3fa9d9;
  margin-bottom:30px;
}
/*
.child {
    background-color:steelblue;
    width:100%;
    height:100%;    
}
*/

/* News Schrift anpassung, Zeilenumbruch verhindern, Ersatznewstest ausblenden, normalen Text einblenden*/
@media (min-width: 670px) { 
  .maininfo #news #newsheader #news_small {   
      display:none;
  }           
  .maininfo #news #newsheader a{  
      display:inline;  
  }   
} 
@media (min-width: 970px) { 
/* ############# Section 2 Spalten ############# */
  section.col12{
      width:50%;
  }       
  section.col12_big {        
      width:60%;
  }
  /* ############# MENU-SUB ############# */
  #menu_sub {
      position:fixed;
      display:block;
      top:0;
      right:10%;
      z-index:95;
      color:#505489;
      background:url(../images/bg_trans_weiß.png);
      border-radius: 10px;
      padding:10px;     
      padding-left:20px;
  }  
  #menu_sub span {
      font-size:2em;
      font-weight:200;
  } 
  #menu_sub ul {
      margin:0; 
      padding:0;
      padding-top:20px;
  } 
  #menu_sub ul li {
      list-style:none;
  }  
  #menu_sub ul li a {
      text-decoration:none; 
      font-size:1.2em;
      font-weight:300;
      line-height:1.6em;
      color:#434343;
      display:block;      
  }  
  #menu_sub a:hover {
      color:#3ea9d9;      
  }    
  #menu_sub ul li a.active {
      color:#3ea9d9;       
  } 
  .banner h1 {
      position:absolute;
      top:49%;
      left:10%; 
      font-size:4em;
  } 
}  
@media (max-width: 1420px) { 
  .banner h1 {
      font-size:2.4em;
  } 
} 
@media (max-width: 1080px) { 
  .highfooter { 
    display:none;
  } 
  .flex .flexbox12{        
      width:100%;
  }  
} 
/* Abstand Seitenrand aller Elemente vergrößern */
@media (min-width:800px) {        
  header .wrapper {    
      padding:1% 10%;
  }
  #menum #menum-close{
  	display:none;
    right:10%;
   } 
  .maininfo #news {  
      background-color:#019ed5;
      padding:0.8% 10% 0.3% 10%; 
  } 
  .highfooter, .bottomfooter { 
      padding:0 10%; 
  } 
  .start-container .info {
      left:10%;
  } 
  .maininfo #news {  
      padding:0.8% 10% 0.3% 10%; 
  }   
  section {
      padding:30px 10%;
  }      
  .banner h1 {
      left:10%;
  }  
}     
@media (min-width: 1080px) {
  header .wrapper #menu-mobile {
    display:none;
  }
  header .wrapper nav {
      -webkit-flex: 1 1 auto;
      -ms-flex: 1 1 auto;
      flex: 1 1 auto;
      display:block;
      margin-top:18px;
  }  
  .start-container .info {
  }    
  .start-container .info h2{
      font-size:6em;
      font-weight:200;
      line-height:0.1em;
  }     
  .start-container .info p{
      font-size:1.5em;
      font-weight:300; 
  }   
  .maininfo #news #newsheader {  
      font-size:1.3em;
  }     
  .maininfo #news #newsheader span {
      line-height:1.2em;
  }    
  .maininfo #news #newsheader a { 
      line-height:1.2em;
  }   
}   
@media only screen and (max-height: 820px) {     
  .start-container .info h2{
      font-size:3.0em;
      font-weight:200;
      line-height:0.9em;
      margin:0px;
  }     
  .start-container .info p{
      font-size:1em;
      font-weight:300; 
  }	 
	  
} 
@media only screen and (max-width: 400px) {      
  .banner h1 {
    font-size:1.3em;
  }	 
}  
@media only screen and (max-width: 870px) { 
	.infotopwrapper {
		position:absolute; 
		top:100%; 
		left:50%; 
		z-index:90; 
		width:230px; 
		height:28px
	}
	#infoboxarrow {
		width:84px; 
		height:28px; 
		margin-left:75px;
	}
	.infotopbox {
		position:absolute; 
		top:100%; 
		left:50%; 
		z-index:89;
		width:230px; 
		height:160px; 
		background-color:#019ed5;
		text-align:center;
	}   
}
    
@media only screen and (max-width: 500px) {
	.infotopwrapper {
		display:none;
	}
	.infotopbox {
		display:none
	} 
}