<script src="../js/jquery-1.9.1.js"></script>

	<style>
	/*----- General Formating -----	
		body, html {
			font-family: 'Source Sans Pro', sans-serif;
			font-size: 0.95em;		
			margin: 0;
			padding: 0;
			height: 100%;
			width: 100%;
		}
		a:active, a:focus {outline: none;}
		main {
			margin: 3em 1em;
			line-height: 180%;
		}*/	
		
		.wrapper-nav {
			margin: 0 auto;
			width: 100%;
			max-width: 62.1875rem;
			position: relative;
		}
		
		@media screen and (max-width: 991px) {
			.wrapper-nav {
				margin: 0 auto;
				width: 100%;
				max-width: 48rem;
				position: relative;
			}		
		}
	/*------------------------------*/		

	/*----- Logo 	
		.brand {
			float: left;
			padding: 0.5em 1em 0 0.5em;
		}
	/*----------------*/


	/*----- Menu -----*/	
		nav {
			margin: 0 auto;
			width: 100%;
			/*height: 11em;*/
			text-align: right !important;
			position: relative;
			/*background: rgba(255, 255, 255, 1.0);*/
			/*border-bottom: 1px solid white;*/
			-webkit-transition: all 0.8s ease;
			-moz-transition: all 0.8s ease;
			-o-transition: all 0.8s ease;
			transition: all 0.8s ease;
		}	
		nav ul {
			margin: 0;
			padding: 1.5em 0 0 0;	
			height: 100vh;
		}
		nav ul li {			
			list-style: none;
			margin: 0;
			display: inline;
		}
		nav ul li a {
			color: #ffffff;
			position: relative;
			padding: 0 0 0.5em 0;
			display: inline-block;
			text-decoration: none;
			text-transform: uppercase;
		}
		nav ul.menu li a:hover {
			color: #03405f;
			border-bottom: 0.1875rem solid #03405f;
		}
		
		nav ul.menu li a.active {
			color: #03405f;
			border-bottom: 0.1875rem solid #03405f;
		}	
		
		@media screen and (max-width: 767px) {	
			
		nav ul.menu li a:hover {
			color: #000000;
			font-weight: bold;
			font-size: 	0.95rem;
			border-bottom: 0 solid #03405f;
		}	
			
		nav ul.menu li a.active {
			color: #000000;
			font-weight: bold;
			font-size: 	0.95rem;
			border-bottom: 0 solid #03405f;
		}
			
			}
		
			
	/*----------------*/
	
	
	/*----- Media Queries -----*/
		@media screen and (min-width: 768px) {
			nav ul.menu {
				max-height: 1.25rem;
			}			
			a#nav-m, a.close {
				display: none;
			}
			nav ul li {
				margin: 0 1.875rem 0 0;
			}			
		}


		@media screen and (max-width: 767px) {	
			/*Formatierung Mobiles Menue*/				
			nav ul {
				top: 0rem !important;
				position: absolute;
				background: #6691c6;
				width: 85vw;
				height: 100vh;
				left: -110%;
				opacity: 0.87;
				list-style-type:none;
				margin: 0;
				padding: 0;				
				transition:all .6s ease;
				-webkit-transition:all .6s ease;
				z-index: 99999;
			}
			nav ul li{
				display: block;
				text-align: left;
				padding: 0em 1.9em;
				border-bottom: 0.0625rem solid #000;
				opacity: 1.9;
			}	
			nav ul li a {
				color: #ffffff;
				padding: 1em 0;
				font-weight: 500;
				font-size: 	0.95rem;			
			}
			nav ul.menu li a:hover {
				border-bottom: 0;
			}			

			/*Hamburger-Icon*/
			a#nav-m img, a.close img {
				width: 40px;
				height: auto;
				margin-right: 15px;
			}			
			nav > .close,
			a#nav-m:target {
				display: none;
			}

			a:target ~ ul,
			a:target ~ .close {
				display: inline-block;
			}
			
			a:target ~ .close {
				position: absolute;
				margin-left: -3.4375rem;
			}		

			a:target ~ ul {
				left: -0.625rem;
			}
		}
	/*--------------------------------------*/		
	</style>