html, body {
  height:100%;

  overflow: hidden;
	font-family: "Lucida Sans", sans-serif;
	color: #535858;
	font-size: 1.0em;
	
}

body {
  display: flex;
  flex-direction: column;
}

.Header, .Footer {
  flex: 0 0 auto;

}

.Content {
  flex: 1 1 auto;
  overflow-y: scroll;

}
img {
   
	max-width: 100%;
	height: auto;

	}
label {
	margin: 0 40px 0 0;
	font-size: 1.1em;
	line-height:1.5em;
display:none;
	 }
	
	#toggle {
		display:none;
}

.menu {
	
margin-left: 15px;
	margin-bottom: 30px;
	margin-top: 30px;
	 border-top: 1px;
	

}

h1 {
    font-size: 1.3em;
	 margin-top: 1em;
	margin-bottom: 1.4 em;
	
	color: #525050;
}

h2 {
    font-size: 1.2em;
	color: #525050;
}
h3 {
    font-size: 1.1em;
	color: #525050;
}


p {
    font-size: 0.9em;

}
/*längs-scroll*/

.text {
display: flex;
align-items: center;
margin-top:15%;
margin-left: 10px;	
overflow-x: auto;
	flex-direction: row;
}

	
	.box {
		
		min-width: 330px;
		min-height:400px;

		margin:3px;
		font-size: 1.1em;
		
		
	}


	.box-text {
		
		min-width: 280px;
	
		margin:3px;
font-size: 1.1em;
		
	}
.box-logo{
display: flex;
justify-content: center;	
	margin-top: 15%;
}
.box-imp{
min-width: 280px;
	
}

.daten-text {

 margin-left: 20px;
	margin-right: 20px;
	margin-top: 20px;


  
  /* for Firefox */
  min-height: 0;
}
/*ende*/

/*Krümel-Navigation*/
   
	.nav  {
	align-self: center; 
		

		}

 a:link {
   	background-color: white;

    list-style-type: none;
	 padding: 5px;
  text-decoration: none;
color: #262727;
margin-left: 15px;
	font-size: 1.0em;
	 
	 
	}

 a:hover, a:focus, a:active
	  {background-color: darkgrey;
		  color: white;
font-size: 1.0em;}
/*ende*/


@media only screen and (max-width: 75em)
	
	{
	body {
  display: flex;
  flex-direction: column-reverse;
		 overflow: auto;
		-webkit-overflow-scrolling: touch;
}


	.text {

		justify-content: center;
		flex-flow: wrap;
	
		
	}
		.daten-text {

 padding:4%;


  
  /* for Firefox */
  min-height: 0;
}
	
		.box {
	width: 40%;
			
			
	}
		.box-imp{
width: 40%;
	
}

		.box-text {
width: 40%;
padding-left: 0.6em;
font-size: 1.0em;}
			
	.box-logo{
	width: 50%;

		align-self: center;
		
	}	

Footer{
		display: flex;
	}

.menu {

	margin-top: 0;
	
	background-color: white;
width:100%;
}


	html {
  
	
    font-family: "Lucida Sans", sans-serif;
	color: #535858;
	font-size:1.0em;
}


	img {
   
	max-width: 100%;
	max-height: auto;
	}

	
	label{ 
		display: block;
	    cursor: pointer;
	padding-left: 20px;
	}
	

	.nav {
		width: 100%;
	display: none;
	}

	a {
    display: block;
   text-decoration: none;
	margin:0;
	float:none;
	overflow: scroll;
		
}
	#toggle:checked + .nav {
		display: block;
}
	
	

	}

@media only screen and (max-width:35.1em)
	
{
	
	body {
  display: flex;
  flex-direction: column-reverse;
		 overflow: auto;
		-webkit-overflow-scrolling: touch;
}

	html {
  
	
    font-family: "Lucida Sans", sans-serif;
	color: #535858;
	font-size:1.0em;
}
	

		
		

	.text {

		justify-content: center;

		
		box-sizing: border-box;
		flex-direction: row;
		flex-flow: wrap;

	}
	
		.box {
width: 90%;
			}
		


	.box-text {
width: 90%;
	padding-left: 0.6em;
		font-size: 0.9em;

	}
	.daten-text {

 padding:4%;


  
  /* for Firefox */
  min-height: 0;
}
	.box-logo{
	width: 100%;

		align-self: center;
		
	}
		.box-imp{
width: 90%;
	
}
	
	Footer{
		display: flex;
	}

.menu {

	margin-top: 0;
	
	background-color: white;
width:100%;
}

	img {
   
	max-width: 100%;
	max-height: auto;
	}
	

	label{ 
		display: block;
	    cursor: pointer;
	padding-left: 5px;
	}

	.nav {
		width: 100%;
	display: none;
	}

	a {
    display: block;
   text-decoration: none;
	margin:0;
	float:none;
	overflow: scroll;
		
}
	#toggle:checked + .nav {
		display: block;
}
	
	

	}