/* @override 
	http://dev.feldenkrais-aschaffenburg.de/tools/flexnav/flexnav.css
	http://dev.plankontor-hamburg.de.46-4-31-73.db-testseiten.de/tools/flexnav/flexnav.css
	http://dev.dab-ev.org.176-9-17-75.unter.construction/tools/flexnav/flexnav.css */

/* Flexnav Base Styles */

.flexnav {
	overflow: hidden;
	margin: 0 auto;
	padding: 0;
	width: 100%;
	max-height: 0;
	margin-top: 0px;
	margin-bottom: 0px;
	z-index: 999;
}

.flexnav.opacity {
	opacity: 0;
}

.flexnav.flexnav-show {
	max-height: 2000px;
	opacity: 1;
	-webkit-transition: all .5s ease-in-out;
	-moz-transition: all .5s ease-in-out;
	-ms-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out;
}

.flexnav.one-page {
	position: fixed;
	top: 50px;
	right: 5%;
	max-width: 200px;
}

.flexnav li {
	padding: 0;
	position: relative;
	overflow: hidden;
	background: none;
}

.flexnav li.level1 {
	font-weight: 600 !important;
	line-height: 110%;
	font-size: 18px;
	border-top: none;
}



.flexnav li.level2 {
	position: relative;
	font-weight: 400;
	line-height: 120%;
	font-size: 16px;
	margin-bottom: 0;
	background: #fff;
	opacity: 0.9;
}


.flexnav li a {
	position: relative;
	display: block;
/*	padding:10px 20px 15px 0;*/
	z-index: 2;
/*	overflow: hidden;*/
	color: #444;
	background: none;
	border-bottom: none;
	
}

.flexnav li a:hover {
	color: #c5c5c5;
	
}

.flexnav li.level1 a {
/*	padding: 15px 30px 15px 0;*/
}




.flexnav li.active ul li.active a {
	color: #c5c5c5;
	
}

.flexnav li.active a, .flexnav li.active a:hover {
	color: #c5c5c5;
}

.flexnav li.active ul li a {
	color: #444;
	
}



.flexnav li ul {
	font-weight: 400;
	padding-left: 0;
	padding-bottom: 0px;
	opacity: 1;
	z-index: 9999;
	
}

.flexnav li ul li {
	position: relative !important;
	overflow: hidden;
}

.flexnav li ul.flexnav-show li {
	overflow: visible;
}


.flexnav li ul li a {
	display: block;
/*	padding: 10px 20px;*/
}

.flexnav .touch-button {
	position: absolute;
	z-index: 999;
	top: 0;
	right: 0;
	width: 50px;
	height: 42px;
/*	background: #669eb4;*/
	text-align: center;
}

.flexnav i.navicon:hover  {
	color: #fff;
	}

.flexnav .touch-button .navicon {
	position: relative;
	top: .85em;
	font-size: 12px;
	font-style: normal;
	color: #fff;
}

.menu-button {
	width: 50px;
	height: 50px;
	text-align: center;
	position: relative;
	display: block;
	padding: 1em;
	background: #0179b2;
	color: #fff;
	cursor: pointer;
	border-bottom: none;
	margin: 0 0 0 15px;
	padding:12px

}

.menu-button:hover {
	background-color: #0179b2;
	background: #8fdaff;
}

span.glyphicon.glyphicon-align-justify {
	font-size: 24px;
}

.menu-button .touch-button {
	display: none;
}

.menu-button .touch-button .navicon {
	font-size: 14px;
	position: relative;
	top: 0.8em;
	color: #004261;
}

/* @group submenu */

/*.submenu {
background: #fff;
margin: 0;
padding: 0;
	
}

#subnav {
	padding: 0;
	margin: 0;
	height: auto;
}

#subnav ul {
width: 100%;
margin: 0;
	
}

#subnav li {
clear: both;
	font-size: 18px;
	margin-bottom: 15px;
	line-height: 100%;
	margin: 0;
	padding: 0;

}
#subnav li:last-child {
border-right: none !important;
}

#subnav li a {
	display: block;
	background: #fff;
	padding: 9px;
	border: none;
	color: #444;
}

#subnav li a:hover, #subnav li.active a {
		color: #c5c5c5;
	
}

#mobilnav {
	display: none !important;
}*/


/* @end */

@media all and (max-width: 768px) {


#topnav {
position: relative;
padding: 0 10px;
	height:90px !important;
	border-bottom:none !important;
}

#mobilnav {
	paddin-top:10px;
	width: 100%;
}

	.flexnav {
	position:relative;
		width: 98%;
		margin: 0 auto;
		background:#fff;		
	}
	
	.flexnav li {
		margin:0;
		padding:0;
		min-height:50px;
		border-bottom:2px solid #fff;
	}
	
	.flexnav li:last-child {
		border-bottom:none;
	}
	
.flexnav li a {
	padding: 15px;
	background:#0087c9;
}
	
	.flexnav li.level2 a {
		padding-left: 60px;
		line-height: 160% !important;
	}
	

	
	.flexnav li ul {
	
/*		display: block !important;*/
		position: relative;
		padding-top: 0;
		padding-bottom: 0;
		border-top: 2px solid #fff;
		
	}
	
	.flexnav li.level1.active ul.lev2 {
	display:block !important;
	}
	
	.flexnav li.level1.active ul li a {
	background:#0087c9;
	color:#444;
	padding-left: 30px;
	}
	
	.flexnav li.level1.active a, .flexnav li.level1 a:hover,  .flexnav li.level2.active a, .flexnav li.level1.active ul li:active a {
		display: block;
		color: #fff;
		background:#026899;
	}
	
	.flexnav li.level1.active ul li a:hover {
		background:#42bffd;
		color:#444;
	}
	
	
	.flexnav li.level1.item-with-ul {
		padding-right: 0px;
	}
	

	
.flexnav ul.lev2 li.level2.active a {
	background-color:#8fdaff;
	color:#fff;
	padding-left: 30px;
}	

.touch-button {
/*height: 52px !important;*/
color: #fff;
	
}

#mobilnav ul.flexnav.with-js.opacity.sm-screen.flexnav-show li.level1.position2.active.item-with-ul span.touch-button i.navicon {
	color:#fff;
}
}

@media all and (min-width: 769px) {


	.flexnav {
/*	margin: 0 15px;*/
	padding:0;
		overflow: visible;
		display: -webkit-box;
		display: -moz-box;
		display: -webkit-flex;
		display: -ms-flexbox;
		display: flex;
		-ms-flex-pack: justify;
		-webkit-justify-content: space-between;
		justify-content: space-between;
		-webkit-flex-flow: row nowrap;
		-moz-flex-flow: row nowrap;
		-ms-flex-flow: row nowrap;
		flex-flow: row nowrap;
	}
	
	.flexnav.opacity {
		opacity: 1;
	}
	
	.flexnav.one-page {
		top: 0;
		right: auto;
		max-width: 1080px;
	}
	
	.flexnav li {
		position: relative;
		list-style: none;
		float: left;
		display: block;
		background: none;
		overflow: visible;
	}
	
	.flexnav li.level1 {
		font-weight: 400;
		line-height: 110%;
		border-top: none;
		margin-bottom: 0;
/*		margin-top: 10px;*/
	}
	
	.flexnav li.level2 {
		position: relative;
		font-weight: 400;
		line-height: 120%;
		margin: 0;
		padding: 0;
		border-top: none;
		border-bottom:2px solid #feca2f;
			}
	
	.flexnav li a {
/*		position: relative;*/
		display: block;
		z-index: 2;
		overflow: hidden;
		color: #004261;
		background: none;
	    border-bottom: none;
	}
	
	.flexnav li.level1 a {
		padding:10px 15px 16px 15px;
	}
	
	.flexnav li.level1.active a {
		border-bottom:5px solid #c5c5c5;
	}
	
	.flexnav li.level1.active ul li a {
		border-bottom:none;
	} 
	
	.flexnav li.level2 a {
		padding: 10px 0 10px 15px!important;
		border-bottom: none;

	}
	
	
	.flexnav li.level2 a:hover {
		color: #c5c5c5;
		border-bottom:none;
	}
	
	.flexnav li > ul {
		position: absolute;
		top: auto;
		left: 0;
/*		box-shadow: 0px 8px 8px #444;*/
		border-top: none;
/*margin-top: -5px;*/
padding-top:0px;	

	}
	
	.flexnav li.active > ul {
	margin-top:-5px;
	}
	
	
	.flexnav li > ul li {
		width: 100%;
	}
	
	.flexnav li ul li > ul {
		margin-left: 100%;
		top: 0;
	}
		
	.flexnav li ul.open {
		padding-bottom: 20px;
/*		display: block;*/
		opacity: 1;
		visibility: visible;
		z-index: 1;
	}
	
	.flexnav li ul.open li {
		overflow: visible;
		max-height: 100px;
	}
	
	.flexnav li ul.open ul.open {
		margin-left: 100%;
		top: 0;
	}
	
	.flexnav li ul {
			width: 200px;
	
	}	
	
	.menu-button {
		display: none;
	}
		
	#kopf #nav li.level1 {
		margin-top: 10px;
		padding: 0;
	  -webkit-flex: initial;
		-moz-flex: initial;
		-ms-flex: initial;
		flex: initial;
		list-style-type: none;
	}
}


@media all and (min-width:769px) and (max-width:1199px) {

/*	.flexnav li.level1 {
		font-size: 20px;
	}
	
	.flexnav li.level2 {
		font-size: 18px;
	}*/
	
ul.flexnav li.item-with-ul {
	padding-right: 30px !important;
}


.touch-button {
	height:40px !important;
}



}

@media all and (min-width: 1025px) {

	.touch-button {
		display: none !important;
	}
	
	.flexnav li.item-with-ul {
		padding-right: 0 !important;
	}
	
	.flexnav li.level1 {
	font-size:20px;
/*		padding: 7px 15px !important;*/
	}
	
	.flexnav li.level1 a {
	}
	
/*	.flexnav li ul {
			width: 150%;
			width: 260px;
		
	}*/		

}

@media all and (max-width: 999px) {

.flexnav li.level2 {
	font-size:15px !important;
}

.flexnav li a {
		padding-bottom:20px !important;
}

	}
	
@media all and (min-width:769px) and (max-width:999px) {

.flexnav li.level1 {
	font-size:16px;
	margin-top:3px
}

.flexnav li.level2 {
	font-size:14px
}


/*	#subnav li {
		font-size: 14px;
		}
	#subnav li a {
		padding: 7px 6px;
	}*/
}


