@charset "utf-8";
*{
	margin:0px;
	padding:0px;
}

@font-face {
    font-family: 'papyrusregular';
    src: url('papyrus-webfont.woff2') format('woff2'),
         url('papyrus-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

body{
	
	font-family:'papyrusregular';
    src: url('papyrus-webfont.woff2') format('woff2'),
         url('papyrus-webfont.woff') format('woff'),
	calibri, arial, sans-serif;
	background-color:#ECC4A0;
	font-size:100%;
	background-image:url(../img/background.png);
	background-attachment:fixed;
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center top;
}

header img{
	width:100%;
	height:100%;
}

.wrapper{
	width:1024px;
	background-color:#fff;
	margin:0px auto;
	padding-bottom:0px;
	background-image:url(../img/backwrapper.png);
	
	
}

nav{
	width:100%;
	
}

nav ul{
	list-style:none;
	float:left;
	width:100%;
	margin-left:10px
}

nav li{
	display:inline-block;
	padding-left:10px;
	padding-right:10px;
	padding-top:5px;
	padding-bottom:5px;
	float:left;
	text-align:center;
	background-color:#fff;
	
}

nav a{
	color:#55A0B3;
	font-size:0.95rem;
	text-decoration:none;
	font-weight:bold;
}

nav li:hover{
	background-color:#55A0B3;
}

nav a:hover{
	color:#fff;
}

main{
	padding-bottom:30px;
	padding-top:50px;
	
	
	
}

main a{
	text-decoration:none;
	color:#F75725;
}

/*Ab hier bearbeiten*/

h2{
	font-size:2rem;
	text-align:center;
	padding-top:50px;
	color:#F75725;
}

h1{
	font-size:2.5rem;
	text-align:center;
	padding-top:20px;
	padding-bottom:20px;
	margin-top:20px;
	color:#55A0B3;
	border-bottom:2px solid #55A0B3; 
	border-top:2px solid #55A0B3;
	
}
	




h3{
	font-size:1.8rem;
	text-align:center;
	padding-top:50px;
	color:#F75725;
}

main p{
	
	font-size:1rem;
	text-align:center;
	padding-top:30px;
	color:#F75725;
	font-weight:bold;
	
}


.steckbrief{
	background-color:rgb(238, 218, 174, 0.2);
	padding:5px;
	margin:20px;
}

.ueber p{
	text-align:left;
}

.present{
	margin:80px 0;
}

.janapresent{
	margin:40px 0;
}

main section{
	margin:5px;
	padding:10px;
	padding-right:0px;
	width:40%;
}

.u-left{
	float:left;
	margin-left:40px;
}

.u-right{
	float:right;
	margin-right:40px;
}

.clearfix{
	clear:both;
}





/*Bis hier bearbeiten*/	


footer{
	width:100%;
	height:100%;
	background-color:#55A0B3;
	margin-bottom:0px;
	border-top:2px solid #55A0B3; 
	padding-top:10px;
}

footer img{
	width:50px;
	height:50px;
	position:center;
display:block;
justify-content:center;
align-items:center;
		position:center;
	margin:10px;
	
}

footer div, footer p{
	font-family:calibri, arial;
	font-size:0.9rem;
	color:#fff;
	justify-content:center;
align-items:center;
}

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

.left{
	float:left;
	margin:20px
}

.center{
	margin:0px auto;
}

.left, .middle,.right{
	width:30%;
	margin:5px;
	float:left;
}





@media (max-width: 1024px){
	
	
	nav ul li{
		width:100%;
		padding:15px 0px;
	}
	
	nav ul{
		display:none;
	}
}

.burgericon, input{
	width:30px;
	height:30px;
	display:none;
	border:2px solid #55A0B3;
	margin:10px;
	padding:10px;
	padding-top:7px;
}
	
.burgericon div{
	width:90%;
	margin: 7px 5%;
	height:3px;
	background-color:#55A0B3;
	}
	
	
	
@media(max-width: 1024px){
	
	.wrapper{
		width:100%
	}
	
	nav{
		padding-top:5px;
	}
	
	.present, .janapresent{
	margin:5px auto;
	
}

nav ul{
	margin-left:0px;
}

.ueber{
margin:5px auto;
padding:0;
position:center;
display:flex;
justify-content:center;
align-items:center;

}
	
	.u-left, .u-right{
		float:none;
		width:95%
	}
	
	.burgericon{
		display:block;
	}
	
	.left{
		float:none;
	}
	
	footer{
		background-color:#55A0B3;
	}
	
	
}

#navigation{
	opacity: 0;
	
}

#navigation:checked~ul{
	display:block
}

#navigation:checked~label .burgericon{
	margin-top:15px;
}

#navigation:checked~label .burgericon div:first-of-type{
	rotation:45deg;
}

#navigation:checked~label .burgericon div:last-child{
	rotation:-45deg;
	margin-top:-10px
}

#navigation:checked~label .burgericon div:nth-child(2){
	display:none;
}