/* Menu */
.menu-wrap {
position: fixed;
 z-index: 200;
right:0;
top:80px;
width: 100%;
height: calc(100vh - 80px);
background-color:#fff;
padding: 0px 0px 0px 0px;
transition: opacity .5s ease-in-out;
-moz-transition: opacity .5s ease-in-out;
-webkit-transition: opacity .5s ease-in-out; 
visibility:hidden; 
opacity:0;
 
}

.home .menu-wrap {
   background-color:transparent !important;
   display:none;
}

.projekte .menu-wrap {
  top:150px; 
  height: calc(100vh - 150px);
}


/* Shown menu */
.show-menu .menu-wrap {
  visibility: visible;  
  opacity:1;
  z-index:200;
  transition: opacity .3s ease-in-out;
  -moz-transition: opacity .3s ease-in-out;
  -webkit-transition: opacity .3s ease-in-out; 
}

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


/** HAMBURGER **/
#wrap-open-button {
  position: fixed;
  z-index: 1040;
  padding: 0;
  height: auto;
  color: #005BD7 !important;
  cursor:pointer !important; 
  padding:2px 3px; 
  right:50%;
  top:24px; 
  margin-right:-583px;
}

.home #wrap-open-button {
  position:relative;
}


#open-button {
	position: relative;
	padding: 0;
	color: transparent;
	background: transparent;
	border:none !important;
	float:right;
	margin-left: 12px;
}

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

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

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


.hamburger {
  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-top: 25px;
  width:25px; 
} 

 .hamburger:hover {
   /* opacity: 0.7;*/
}

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

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

 .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
    width: 30px;
    height: 5.5px;
    background-color: #005BD7 !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: -10px; }
 .hamburger-inner::after {
    bottom: -10px; }

.hamburger--spin .hamburger-inner {
  transition-duration: 0.22s;
  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  background-color: #005BD7 !important;}
 .hamburger--spin .hamburger-inner::before {
    transition: top 0.1s 0.25s ease-in, opacity 0.1s ease-in;background-color: #005BD7 !important; }
 .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);background-color: #005BD7 !important; }

/*hover*/
#wrap-open-button:hover .hamburger--spin .hamburger-inner {
background-color: #005BD7 !important;}
#wrap-open-button:hover .hamburger--spin .hamburger-inner::before {
background-color: #005BD7 !important; }
#wrap-open-button:hover .hamburger--spin .hamburger-inner::after {
background-color: #005BD7 !important; }


/*activ*/
.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);background-color: #005BD7 !important; }
  .hamburger--spin.is-active .hamburger-inner::before {
    top: 0;
    opacity: 0;
    transition: top 0.1s ease-out, opacity 0.1s 0.12s ease-out;background-color: #005BD7 !important; }
  .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); background-color: #005BD7 !important;
}


.show-menu #open-button {
	border:transparent !important; 
	background-color:transparent; 
}

#wrap-open-button:hover {
	color: #005BD7 !important;
}

.show-menu #wrap-open-button {
	color: #005BD7 !important;
}

.show-menu:hover #wrap-open-button, .show-menu:hover #wrap-open-button {
	color: #005BD7 !important;
}





/*******************************************************************************/
/* NAVIGTION   Desktop */  
/*******************************************************************************/

.navi {
  /* height:calc(100% - 80px); */
  height:100%; 
}

.projekt .navi {
  /*  height:calc(100% - 150px); */
  height:100%;
}

.home .navi {
  height:100%;
}

.slicknav_menu { display: none; }
#navigation { 
	position: absolute; 
	margin-top:0px;  
	margin-left:0px;  
	background-color:none; 
	z-index:1030; 
	overflow:visible; 
	height:auto;
	width:100%;
  top:12%;
 /*  transform:translateY(-44%);  */
  text-transform:uppercase;
}


#navigation {
  position: absolute; 
  top:initial !important;
  bottom:4%;
  left:-1200px;
}

#menu { padding-left:0px !important; }
#menu ul {margin:0px;padding:0px;list-style-type:none !important;}

#menu li { 
  list-style-type:none;  
  margin-bottom:25px; 
}

#menu li a { 
  font-size:76px;  
  font-weight:600; 
  line-height:100%;
  width:100% !important; 
  display:block;  
  transition: color 0.25s ease; 
}

/*
#menu li[class*="n"] > a {  }
#menu li.n0 > a {  }
*/

#menu a, #menu a:visited {	text-decoration:none; color:#005BD7; }
#menu a:hover { color:#003B8B;  }
#menu a.active, #menu li.active > a, #menu li ul.submenu li a.active { color:#003B8B !important;  } 

.hidemenu #navigation { display:none; }
.showmenu #navigation {	display:block;  }

.submenu { margin:22px 0px 22px 35px !important; }
.submenu li a {  font-size:40px !important; font-weight:600 !important; text-transform:none !important; }
.submenu li { margin-bottom: 18px !important; }




/* Homepage */
.home #navigation {
  position: absolute; 
  top:initial !important;
  bottom:2%;
  left:-500px;
}

.home #menu li {  
  margin-bottom: 18px !important;
  opacity:1;
  animation-name:none !important;
 }

.home #menu li a { font-size:72px;  line-height:100%; }
.home .submenu { display:none; }




/* Page Menu 2nd Level */
.projekte #navigation {
 bottom:5%; 
}

#pagemenu {
  position:absolute;
  bottom:5px;
  left:15px;
}

#pagemenu ul, #pagemenu ul li {
  margin-left:0px !important;
  list-style: none !important; 
  display:inline-block;
  padding:0;
}

#pagemenu ul li a {
  display:block;
  width:100%;
  height:100%; 
  padding:5px 10px;
  border-top:1px solid #005BD7;
  border-bottom:1px solid #005BD7;
  border-left:1px solid #005BD7;

  background-color:#fff; 
  text-decoration:none !important;
   transition: all .25s ease-in-out;
  -moz-transition: all .25s ease-in-out;
  -webkit-transition: all .25s ease-in-out; 
}

#pagemenu ul li:last-child a {
  border-right:1px solid #005BD7;
}

#pagemenu ul li a:hover {
   background-color:#005BD7;
   color:#fff;
} 

#pagemenu ul li a.is-checked {
   background-color:#005BD7;
   color:#fff;
} 

.show-menu #pagemenu {
  display:none;
}

@media screen and (max-width: 767px) { 
  #wrap-header {
    /* background-color: #f7d9b2; */
  }

  #pagemenu ul li a {
    padding:4px 8px;
    font-size:15px !important;
  }
}


@media screen and (max-width: 680px) { 
    
 #pagemenu {
  bottom: -15px;
  }

  #pagemenu ul li {
    float:left;
  }

  #pagemenu ul li:nth-child(5) {
    clear:left;
  }

  #pagemenu ul li:nth-child(4) a {
     border-right:1px solid #005BD7;
  }

  #pagemenu ul li:nth-child(5) a,
  #pagemenu ul li:nth-child(6) a,
  #pagemenu ul li:nth-child(7) a {
    border-top:0px !important;
  }
}



@media screen and (max-width: 500px) { 
  #pagemenu ul li a {
    padding:3px 6px;
    font-size:14px !important;
  }
}


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






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

*******************************************************************/
@media screen and (max-height: 880px) { 
  #menu li > a { font-size:54px; }
  .home #menu li a { font-size:54px;  }
  #menu li { margin-bottom: 20px; } 

}


@media screen and (max-height: 780px) {
.home #menu li,  #menu li  {  
    margin-bottom: 15px;
  }
}

@media screen and (max-height: 680px) {
.home #menu li,  #menu li  {  
    margin-bottom: 14px;
  }

}



@media screen and (max-width: 1820px) { 
    #menu li > a { font-size:66px; }
  .home #menu li a { font-size:66px;  }
}


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


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

  #wrap-open-button {
    right:20px;
    top:24px; 
    margin-right:0px;
    transform:none;
  }

  .menu-wrap {
   /*  padding: 110px 0px 0px 0px; */
  }

  #menu li > a { font-size:62px; }
  .home #menu li a { font-size:62px;  }
}


@media screen and (max-width: 1200px) { 
  #menu li > a { font-size:54px; }
  .home #menu li a { font-size:54px;  }
  #menu li { margin-bottom: 22px; } 
}


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

  #wrap-open-button {
    top:24px;
    padding: 1px 2px 3px 5px !important;
  }

  .menu-wrap {
     height: calc(100% - 80px);
     padding: 0px 0px 0px 0px;
   }

  .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
    /* height: 4px; */
  }

  #slidemenu .container {
    padding-left:0px !important;
    padding-right:0px !important;
  }

}



@media screen and (max-width: 680px) { 
  #menu li > a { font-size:48px; }
  .home #menu li a { font-size:48px; }
  #menu li { margin-bottom: 15px
}



@media screen and (max-width: 576px) { 
  #navigation { 
    bottom:12%;
  }

  .home #navigation {
    bottom:12%;
  }

}



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

.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
    width: 27px;
    height: 4.2px;
 }
.hamburger-inner::before {
    top: -8px;
     }
.hamburger-inner::after {
    bottom: -8px; 
  }
 
}




@media screen and (max-width: 480px) { 
   #menu li > a { font-size:44px; }
  .home #menu li a { font-size:44px;  }

}


/* end */
/*******************************************************************************/




