*, *:before, *:after {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	}

body {
	/*font-family: font-family:'Open Sans' !important;*/
	/*font-family: Arial;*/
	/*text-transform: uppercase;*/
	/*color: #fff*/	
	padding: 0px;
	background-color: #ededed;
	background-image: linear-gradient(90deg, transparent 50%, rgba(255,255,255,.5) 50%);
	background-size: 10px 10px;
	line-height: 1.5;
	font-family: sans-serif;
	font-size: 16px;
}

a{
	text-decoration:none;
	color:#fff
	}

.brand-color{color:#9e9e9e !important}
.brand-bg{background-color:#9e9e9e !important}
.brand-titleFont{font-family:'Open Sans' !important;font-weight:bold !important}
.brand-subtitleFont{font-family:'Pacifico' !important}

/* Header/Blog Title */
.header {
  padding: 30px;
  text-align: center;
  /*background: white;*/
}

.header h1 {
  font-size: 50px;
}

/* Fake image */
.fakeimg {
  background-color: #aaa;
  width: 100%;
  padding: 20px;
}

/* Real image */
.realimg {
  /*background-color: #aaa; */
  width: 100%;
  height: 200px;
  /* padding: 20px; */
}

/* Add a card effect for articles */
.card {
  /*background-color: white;*/
  padding: 20px;
  margin-top: 20px;
}
.card h2{
  color: #75b02e;
  font-weight:bold;
}

/* The grid: Four equal columns that floats next to each other */
.column {
  float: left;
  width: 25%;
  padding: 10px;
}

/* Style the images inside the grid */
.column img {
  opacity: 0.8; 
  cursor: pointer; 
}

.column img:hover {
  opacity: 1;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

/* The expanding image container */
.container {
  position: relative;
  display: none;
}

/* Expanding image text */
#imgtext {
  position: absolute;
  bottom: 15px;
  left: 15px;
  color: white;
  font-size: 20px;
}

/* Closable button inside the expanded image */
.closebtn {
  position: absolute;
  /*top: 10px;*/
  right: 15px;
  color: white;
  font-size: 35px;
  cursor: pointer;
}

/* Footer */
.footer {
  padding: 20px;
  /*text-align: center;*/
  background: #ddd;
  margin-top: 20px;
}

/* Style the top navigation bar */ 
#nav-menue{ 
	overflow: hidden;
	background-color: #6e6f6f;
	position: -webkit-sticky; /* Safari */ 
	position: sticky;
	top: 0;
}
#nav-menue:after{
	content:"";
	clear:both;
	display:block
	}
#bereichlogo {
    color: white;
    background-color: #75b02e;    
    display: block;
    padding: 0.5em;
    text-decoration: none;
    float: left;  
	width: auto;
}
#steuerung {
	float: right;
}

#steuerung li {
    list-style: none;
    float: left;
}
#steuerung a {
    display: block;
    height: 100%;
    width: 100%;
    /*padding: 0.5em;*/
    text-decoration: none;
    background-color: #6e6f6f;	
	float: left;
	color: #f2f2f2;
	text-align: center;
	/*padding: 14px 16px; */
} 
#steuerung a:hover {
	background-color: #75b02e;
	color: black;
}	
.menue-button {display: none;}
input{
	border:none;
	padding:10px;
	border-radius:20px
	}
nav{float:right;}
nav>ul{float:left;position:relative}	
nav li{list-style:none;float:left}
/* Style the topnav links */
nav li a{padding: 14px 16px;float: left;display: block;color: #f2f2f2;text-align: center;padding: 0.5em;text-decoration: none;}
/* Change color on hover */	
nav li a:hover{background-color: #75b02e;color: black;}



/*			
#warning input { position:absolute; left:-200vw }
#warning label { cursor:pointer; padding:.1em; border:1px solid black}
#warning > div { display:none; position:fixed; left:0; top:0; width:100vw; height:100vh; background-color:rgba(128,128,128,0.5) }
#warning div div { width:10em; font-size:1.5em; border:3px solid black; position:absolute; left:50vw; top:50vh; text-align:center; padding:1em; -webkit-transform: translate(-50%,-50%);-ms-transform: translate(-50%,-50%);transform: translate(-50%,-50%); background-color:white }
#warning input:checked ~ div { display:block }
#warning input:focus ~ div label { border: 2px solid red }
*/		

/* CSS erweitern um MENÜ-Button und entsprechende Steuerung */
/* Menü-Button oben rechts einblenden bei kleiner als 600px */

@media only screen and (max-width:640px) {
	.menue-button {background-color: darkblue;display: block;position: absolute;right: 0;top: 0; /*color: white;*/ padding: 0.5em;cursor: pointer;text-decoration: none;}	
	.menue-button:hover {color: black;background: orange;}
	#steuerung {float: left;width: 100%;display: none;overflow: hidden;background-color: #6e6f6f;position: -webkit-sticky; /* Safari */ position: sticky;top: 0;}
	#steuerung:after{content:"";clear:both;display:block}
	#steuerung li {width: 100%;border-bottom: 2px solid silver;}	
	/* #bereichlogo {width: 100%;} */
}
/* die Magie, um die Steuerung einzublenden (auch auf mobile Devices) */
#nav-menue:target  #steuerung {display: block;}
/* ausblenden des Menü-Buttons zum öffnen - somit wird der zum Schließen sichtbar */
#nav-menue:target .menue-button-beschr-open {display: none;}  


/* dialog { display:block; border:none; position:static; text-align:left; margin:0 } */
			
#info input { position:absolute; left:-200vw;}
#info > label { cursor:pointer; }
#info input ~ label > span:nth-of-type(1) { display:inline }  			/*Schrift einblenden */
#info input ~ label > span:nth-of-type(2) { display:none }				/*Schrift ausblenden */
#info div { display:none; }											/* content ausblenden */
#info input:checked ~ label > span:nth-of-type(1) { display:none }		/*Schrift ausblenden */
#info input:checked ~ label > span:nth-of-type(2) { display:inline }	/*Schrift einblenden */
#info input:checked ~ div { display:block; }						/* content ausblenden */
/* #info input:focus ~ label { border:1px dotted black }
*/

#info{
	text-align:center;
	padding:20px;
	/*display:block*/
	}
#info:after,#info:before{
	content:" ";
	/*display:table;*/
	clear:both
	}


#impressum-holder{
	padding-top: 20px;
	display:-webkit-box;
	display:-webkit-flex;
	display:-ms-flexbox;
	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-box-pack:center;
	-webkit-justify-content:center;
	-ms-flex-pack:center;
	justify-content:center;
	}
	
#impressum-holder #impressum-block{
	/*width:280px;*/
	display:-webkit-box;
	display:-webkit-flex;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-pack:center;
	-webkit-justify-content:center;
	-ms-flex-pack:center;
	justify-content:center;
	-webkit-flex-direction:row;
	-ms-flex-direction:row;
	flex-direction:row;
	background:#f9f9f9;
	box-sizing:border-box;
	margin:0 12px 24px 12px;
	vertical-align:middle;
	font-size:14px;
	
	color:#9e9e9e;
	display:block;
	padding:15px;
	vertical-align:top;
	text-decoration:none;
	text-align:left;
	/*word-break:break-all;*/
	}
	
#impressum-holder #impressum-block a { 
	color: #9e9e9e; /* iPhone erkennt Telefonnummer als Link - FArbe soll die selbe sein */
	}
#impressum-holder #impressum-block h2 { 
	padding-top: 10px;
	}
#impressum-holder #impressum-block h3 { 
	padding-top: 20px;
	padding-bottom: 10px;
	}