/* Menu */

.menu-wrap {
	display:none;
	position: fixed;
	z-index: 900;
	left:0;
	top:0;
	width: 100%;
	height: 100%;
	background: #000; 
	padding: 2.5em 1.5em 0;
	-webkit-transform: translate3d(-100%,0,0);
	transform: translate3d(-100%,0,0);
	
	-webkit-transition: -webkit-transform 0.3s;
	transition: transform 0.3s;
	-webkit-transition-timing-function: cubic-bezier(0.7,0,0.3,1);
	transition-timing-function: cubic-bezier(0.7,0,0.3,1);
}

/*
.menu-wrap {
	position: fixed;
	z-index: 1001;
	right: 0;
	top: 0;
	width: 50%;
	height: 100%;
	background: #ffffff; 
	padding: 2.5em 1.5em 0;
	-webkit-transform: translate3d(100%,0,0);
	transform: translate3d(100%,0,0);
	-webkit-transition: -webkit-transform 0.4s;
	transition: transform 0.4s;
	-webkit-transition-timing-function: cubic-bezier(0.7,0,0.3,1);
	transition-timing-function: cubic-bezier(0.7,0,0.3,1);
}*/


.menu-wrap.hidemenu { visibility:hidden; }
.menu-wrap.showmenu  { visibility: visible !important; }
.navi {	height: 100%; }



/* Shown menu */
.show-menu .menu-wrap {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
	-webkit-transition: -webkit-transform 0.4s;
	transition: transform 0.4s;
	-webkit-transition-timing-function: cubic-bezier(0.7,0,0.3,1);
	transition-timing-function: cubic-bezier(0.7,0,0.3,1);
}



.show-menu .icon-list,
.show-menu .icon-list a {
	-webkit-transform: none !important;
	transform: none !important;
}



/** HAMBURGER **/
#open-button {
	display:none; 
	position: fixed;
	z-index: 1002;
	padding: 0;
	width: 1.4em;
	height: 1.6em;
	font-size: 1.5em;
	color: transparent;
	background: transparent;
	left:10px;
	top:13px !important; 
	border:none !important; 
}

#wrap-hamburger {
	width:auto;
	max-width:auto;
	height:auto; 
}

#openmenu {
	display:block !important;
	cursor:pointer; 
	height:auto; 
}

#hamburger img {
	width:100%;
	height:auto; 
}

.hamburger {
  padding: 6px 6px 0px 0px;
/*  display: inline-block;*/
  cursor: pointer;
  transition-property: opacity, filter;
  transition-duration: 0.15s;
  transition-timing-function: linear;
  font: inherit;
  text-transform: none;
  background-color: transparent;
  border: 0;
  margin: 0;
  overflow: visible;
 outline:none !important;
/*margin-left:-60px; */
}
  .hamburger:hover {
   /* opacity: 0.7;*/
}

.hamburger-box {
  width: 30px;
  height: 26px;
  display: inline-block;
  position: relative; }

.hamburger-inner {
  display: block;
  top: 50%;
  margin-top: -2px; }

  .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
    width: 26px;
    height: 6px;
    background-color: #fff !important;
    border-radius: 0px;
    position: absolute;
    transition-property: transform;
    transition-duration: 0.15s;
    transition-timing-function: ease; }
  .hamburger-inner::before, .hamburger-inner::after {
    content: "";
    display: block; }
  .hamburger-inner::before {
    top: -9px; }
  .hamburger-inner::after {
    bottom: -9px; }


.hamburger--spin .hamburger-inner {
  transition-duration: 0.22s;
  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  .hamburger--spin .hamburger-inner::before {
    transition: top 0.1s 0.25s ease-in, opacity 0.1s ease-in; }
  .hamburger--spin .hamburger-inner::after {
    transition: bottom 0.1s 0.25s ease-in, transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

.hamburger--spin.is-active .hamburger-inner {
  transform: rotate(225deg);
  transition-delay: 0.12s;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  .hamburger--spin.is-active .hamburger-inner::before {
    top: 0;
    opacity: 0;
    transition: top 0.1s ease-out, opacity 0.1s 0.12s ease-out; }
  .hamburger--spin.is-active .hamburger-inner::after {
    bottom: 0;
    transform: rotate(-90deg);
    transition: bottom 0.1s ease-out, transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1); 
}

.hamburger--spin.is-active .hamburger-inner,.hamburger--spin.is-active .hamburger-inner::before,.hamburger--spin.is-active .hamburger-inner::after {
    background-color: #fff !important;
 }

.show-menu #open-button {
	/*border:3px solid #fff !important; */
	background-color:transparent; 
}

.show-menu .hamburger-inner, .show-menu  .hamburger-inner::before, .show-menu  .hamburger-inner::after {
    background-color: #fff !important;
 }

#open-button, .hamburger, #open-button:hover, .hamburger:hover, #open-button:visited, .hamburger:visited {
	outline:none !important; 
}


/*******************************************************************************/
/* NAVIGTION   Mobile Menu */  
/*******************************************************************************/

.slicknav_menu { display: none; }
#navigation { 
	/*position: absolute; */
	margin-top:90px;  
	margin-left:0px;  
	background-color:none; 
	z-index:1500; 
	overflow:hidden; 
	height:auto;
	width:100%;
}

#mmenu { float:left; margin-top:16px;  padding-left:0px !important; width:100%; }

#mmenu li {
	background:transparent;
	position:relative;
	display:block;
	white-space:nowrap;
	/*border-bottom:1px solid #333; */
	margin-bottom:20px; 
}

#mmenu li:first-child {
	border-top:1px solid #333;
}

#mmenu a {
	background:transparent;
	line-height:38px;
	padding:0px 0px 0px 0px;
	text-decoration:none !important;
	display:block;
	height:auto;
	width:auto;
	font-family: 'Open Sans', sans-serif;
	font-size: 30px;
	font-weight:400;
	letter-spacing:1px; 
	color:#fff;
	text-align:center;
	text-transform:normal;
}

#mmenu a:hover { /*color:#CC9900 !important;*/ font-weight: 700; }
#mmenu a.active { /*color:#CC9900 !important; */ font-weight: 700; }


#mmenu li.act > a { /*color:#CC9900 !important;*/ font-weight: 700; }
#mmenu li.act li a { /*color:#CC9900;*/ font-weight: 700; } 

#mmenu li.n0 {display:none; }
/*#mmenu ul {margin:0px;padding:0px;list-style-type:none !important;}
#mmenu li { margin-bottom:40px; list-style-type:none;  }
#mmenu li[class*="n"] a { font-size:26px; font-weight:800;   }
#mmenu li[class*="n"] > a { padding-bottom:10px !important; display:inline-block; }*/
/*#mmenu li:last-child  { display:none  }*/



ul.submenu ul { position:relative;   list-style-type: none;   text-decoration: none;  list-style-image: none;  margin-top:0px !important;}

ul.submenu li {   
padding:0px; 
position:relative;
text-overflow: ellipsis;
white-space: nowrap;
margin-bottom:0px !important; 
}
 
ul.submenu a { 
display: block; 
text-align:left;  
text-transform:none;
height:100%;
width:100%;
padding:0px 5px 6px 0px !important;
line-height:120% !important;
color:#fff;
font-size:22px !important; 
font-weight:500 !important;
}

ul.submenu > li { padding-bottom:0px !important; } 
ul.submenu ul {position: absolute; display:none;top:28px; z-index:150 !important; width:auto; padding-right:30px !important; }

/*#mmenu a, #mmenu a:visited {	text-decoration:none; color:#fff; }
#mmenu a:hover { color:#000;  }
#mmenu a.active, #mmenu li.active > a { color:#000;  } */

.n0 { /*display:none !important;*/}


#mobile-language {
	width:100%;
	overflow:hidden;
	position:relative; 
	height:40px; 
	margin-top:20px; 
}

#mobile-language .sprachwahl {
	width:auto;
	position:absolute;
	left:50%;
	top:0;
	transform:translate(-50%, 0);
}


/* end nav */
/* ############################################################################################*/








/*******************************************************************************/
/* MEDIA QUERIES & MOBILE SETTINGS  */  
/*******************************************************************************/

@media screen and (max-width: 1080px), screen and (max-height: 650px) { 
	#open-button, .menu-wrap {
		display:block; 
		/*top:0px !important;
		margin-top:0px !important; */
	}

}


@media screen and (max-width: 767px) { 
	
	#mmenu .col-sm-6 {
		width:100% !important; 
		float:left !important; 
	}
	
	ul.submenu li {
	 white-space:normal !important; 
	}
	
}


@media screen and (max-width: 640px) { 
	.menu-wrap {
		width: 100%;
	}

}


@media screen and (max-width: 600px) { 

	#open-button {
			/*right:5px;*/
	}
		
	#mmenu li[class*="n"] a { font-size:22px; }
	#mmenu li { /*margin-bottom: 30px;*/ }
	ul.submenu a { font-size: 20px !important; }
	ul.submenu > li { margin-bottom: 6px !important; }
	#navigation { margin-top: 20px;	}

}


@media screen and (max-width: 520px), screen and (max-height: 650px) { 

	#mmenu .col-sm-6 {
		width:100% !important; 
		float:none !important; 
	}
	.menu-wrap {
	overflow-y:auto;
	overflow-x:hidden; 
	max-height: 100%;
	}

	#navigation { margin-top: 5px !important;	}
	
		/*.n0 { display:block !important;}*/
}




@media screen and (max-width: 505px) { 

	.hamburger {
		padding: 6px 6px 0px 6px !important;
	}

}