@charset "utf-8";
/* CSS Document */

.clicked{
	font-weight: 800;
	color: #8CC491;
}
#navigation{
	position:fixed;
	top:0;
	right:0;
	z-index:1;
}
nav ul li{
	text-align: center;
	line-height: 0px;
	font-family:  'Flamenco';
	font-weight: 800;
	letter-spacing: 2px;
	display:block;
}
nav ul li a:active,nav ul li a:hover{
	color:#004c61;
	font-weight: 800;
}
nav ul li a{
	color:#004c61;
	text-decoration: none;
}
label {
  	cursor: pointer;
	position: absolute;
	right: 0;
	background-image:url("adl_bilder/button.png");
	background-repeat:no-repeat;
    background-position: 50% 50%;
	border-radius: 70px 0px 70px 70px;
	moz-border-radius: 120px;
	webkit-border-radius: 120px;
	background-color: #fff;
	-webkit-box-shadow: 1px 1px 2px 0px rgba(50,50,50,0.3),1px 1px 3px 3px rgba(50,50,50,0.2);
	-moz-box-shadow: 1px 1px 2px 0px rgba(50,50,50,0.3),1px 1px 3px 3px rgba(50,50,50,0.2);
	box-shadow: 1px 1px 2px 0px rgba(50,50,50,0.3),1px 1px 3px 3px rgba(50,50,50,0.2);  
	position: fixed;
	border: 1.7px solid #004c61;
	background-color: rgba(255, 255, 255, 1);
}
[type="checkbox"]:checked ~ ul {
	display: block;
	position: absolute;
	background-color: #fff;
	width: 100%;
	height: auto;
	right: 20px;
	opacity: 1;
	visibility: visible;
	-webkit-transition: opacity 0.3s;
    -moz-transition: opacity 0.3s;
    -ms-transition: opacity 0.3s;
    -o-transition: opacity 0.3s;
    transition: opacity 0.3s;
	margin: 80px 0 0 0;
	padding: 0 5% 0 5%;
	border-radius: 50px 50px 50px 50px;
	moz-border-radius: 100px;
	webkit-border-radius: 100px;
	border: 1.7px solid #004c61;
}
nav hr{
 height:1px ;  border:none; color:#004c61; background-color:#004c61; width:80%; text-align:center; margin: 0 auto;
}
@media (min-width: 700px) and (max-width: 10000px) {
#header{
 height: 100px;
}

label {
	width: 90px;
  	height: 90px;
	background-size: 70px auto;
}			  
nav ul {
	height: 0;
	line-height: 0;
	overflow: hidden;
	list-style: none;
	visibility: hidden;
	opacity: 0;
	position:absolute;
	-webkit-transition: opacity 0.1s;
    -moz-transition: opacity 0.1s;
    -ms-transition: opacity 0.1s;
    -o-transition: opacity 0.1s;
    transition: opacity 0.1s;
}	
#navigation{
	width: 250px;
}

[type="checkbox"]:checked ~ ul {
	margin: 110px 0 0 0;
	padding: 0 5% 0 5%;
}
nav ul {
	visibility: hidden;
	opacity: 0;
	position:absolute;
	-webkit-transition: opacity 0.3s;
    -moz-transition: opacity 0.3s;
    -ms-transition: opacity 0.3s;
    -o-transition: opacity 0.3s;
    transition: opacity 0.3s;
	-webkit-box-shadow: 1px 3px 4px 0px rgba(74,64,39,0.2),1px 1px 0px 0px rgba(152,134,86,0.1);
	-moz-box-shadow: 1px 3px 4px 0px rgba(174,64,39,0.1),1px 1px 0px 0px rgba(152,134,86,0.1);
	box-shadow: 1px 3px 4px 0px rgba(74,64,39,0.2),1px 1px 0px 0px rgba(152,134,86,0.1);	
	text-align: justify;
margin: 80px 0 0 0;
	padding: 0 5% 0 5%;
	border-radius: 20px;
	moz-border-radius: 100px;
	webkit-border-radius: 100px;
}		
nav ul li{
	margin: 30px 0px;
	font-size: 26px;
}
}
@media (min-width: 100px) and (max-width: 699px) {
#header{
 height: 50px;
}
label {
	width: 60px;
  	height: 60px;
	background-size: 50px auto;
}			  
nav ul {
	height: 0;
	line-height: 0;
	overflow: hidden;
	list-style: none;
	visibility: hidden;
	opacity: 0;
	position:absolute;
	-webkit-transition: opacity 0.1s;
    -moz-transition: opacity 0.1s;
    -ms-transition: opacity 0.1s;
    -o-transition: opacity 0.1s;
    transition: opacity 0.1s;
}	
#navigation{
	width: 200px;	
}
[type="checkbox"]:checked ~ ul {
	margin: 70px 0 0 0;
}
nav ul {
	visibility: hidden;
	opacity: 0;
	position:absolute;
	-webkit-transition: opacity 0.3s;
    -moz-transition: opacity 0.3s;
    -ms-transition: opacity 0.3s;
    -o-transition: opacity 0.3s;
    transition: opacity 0.3s;
	-webkit-box-shadow: 1px 3px 4px 0px rgba(74,64,39,0.2),1px 1px 0px 0px rgba(152,134,86,0.1);
	-moz-box-shadow: 1px 3px 4px 0px rgba(174,64,39,0.1),1px 1px 0px 0px rgba(152,134,86,0.1);
	box-shadow: 1px 3px 4px 0px rgba(74,64,39,0.2),1px 1px 0px 0px rgba(152,134,86,0.1);	
	text-align: justify;
}		
nav ul li{
	margin: 30px 0px;
	font-size: 23px;

}
}