/* Flexnav Base Styles */
 .flexnav {
     margin: 0;
     padding: 0;
     -webkit-transition: none;
     -moz-transition: none;
     -ms-transition: none;
     transition: none;
     -webkit-transform-style: preserve-3d;
     overflow: hidden;
     margin: 0 auto;
     width: 100%;
     max-height: 0;
}
 .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 {
     font-size: 100%;
     position: relative;
     overflow: hidden;
}
 .flexnav li a {
     position: relative;
     display: block;
     padding: 1.03em;
     z-index: 2;
     color: #ffffff;
     transition: color 0.4s ease-in-out;
}
 .flexnav li a.nav-path-selected, .flexnav li a.nav-selected {
	 font-weight: 700;
     color: #ffffff;
 }
  .flexnav li a:hover {
     color: #3c78af;
 }
 .flexnav li ul {
     width: 100%;
	 padding: 0;
	 display: none;
}
 .flexnav li ul a {
     color: #333;
 }
  
 .flexnav li ul li {
     font-size: 100%;
     position: relative;
     overflow: hidden;
	 box-shadow: 1.1px 1.7px 20px rgba(0, 0, 0, 0.24);
}
 .flexnav li ul.flexnav-show li {
     overflow: visible;
}
 .flexnav .touch-button {
     position: absolute;
     z-index: 999;
     top: 0;
     right: 0;
     width: 50px;
     height: 57px;
     display: inline-block;
     background: #acaca1;
     background: rgba(0, 0, 0, 0.075);
     text-align: center;
}
 .flexnav .touch-button:hover {
     cursor: pointer;
}
 .flexnav .touch-button .navicon {
     visibility: hidden;
}
 .menu-button {
     position: relative;
     background: #a6a6a2;
     cursor: pointer;
}
 .menu-button.one-page {
     position: fixed;
     top: 0;
     right: 5%;
     padding-right: 45px;
}
/* .menu-button .touch-button {
     background: transparent;
     position: absolute;
     z-index: 999;
     top: 0;
     right: 0;
     width: 50px;
     height: 50px;
     display: inline-block;
     text-align: center;
}
 */
 .menu-button .touch-button .navicon {
     font-size: 16px;
     position: relative;
     top: 1em;
     color: #333333;
}
 @media all and (min-width: 768px) {
     body.one-page {
         padding-top: 70px;
    }
     .flexnav {
         overflow: visible;
    }
     .flexnav.opacity {
         opacity: 1;
    }
     .flexnav.one-page {
         top: 0;
         right: auto;
         max-width: 1080px;
    }
     .flexnav li {
         position: relative;
         width: auto;
         list-style: none;
         float: left;
         display: block;
         overflow: visible;
    }
     .flexnav li a {
         border-bottom: none;
         padding: 0 0 0 22px;
         font-size: 26px;
    }
    .flexnav>li:first-child > a{
        padding-left: 0;
    }
    .flexnav>li:last-child > a { 
        padding-right: 0;
     }
     .flexnav li > ul {
         position: absolute;
         top: 0;
		 padding-top: 47px;
         left: 0;
    }
	.flexnav li li:first-child a {
		padding-top: 20px;
	}
	.flexnav li li:last-child a {
		padding-bottom: 20px;
	}
     .flexnav li:last-child > ul {
/*         right:0;
         left:initial;*/
     }
     .flexnav li ul  {
        margin-left: 2px;
        min-width: 220px;
    }
     .flexnav li > ul li {
         width: 100%;
         overflow: visible;
    }
     .flexnav li:last-child > ul li > ul {
         right:100%;
         left: initial;
     }
     .flexnav li ul li > ul {
         margin-left: calc(100% - 1.03em);
         top: 0;
    }
     .flexnav li ul li a {
         border-bottom: none;
         font-size: 20px;
         padding: 8px 16px;
    }
     .flexnav li ul.open {
         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;
    }
     .menu-button, .flexnav .touch-button {
         display: none;
    }
}
@media (max-width:1200px){
     .flexnav li a {
		 font-size: 22px;
    }
}
@media (max-width:992px){
     .flexnav li a {
		 font-size: 18px;
    }
}
@media (max-width:992px) and (min-width:768px) {
	.flexnav li > ul {
		padding-top: 30px;
	}
	.flexnav li ul li a {
		border-bottom: none;
		font-size: 16px;
		padding: 4px 16px;
	}
}
@media (min-width:1200px){
}

/* no break mainnav > tablet
 tablet landscape styling*/
/*
@media (min-width: 768px) and (max-width: 991px) {
    .flexnav li a {
        padding: 0.4em 0.4em 0.4em 0.4em;
        font-size: 0.8em;   
    }
    .flexnav li ul li a {
         padding: 0.4em 0.4em;
    }

}
*/

 @media all and (max-width:767px){
     .flexnav {
        position: absolute;
        background: #ffffff;
     }
     .flexnav li ul {
         margin-left: 0;
         padding-left: 0;
     }
     
     .flexnav li a {
         border-bottom: 1px solid #999999;
         padding: 0.9em;
         font-size:1.1em;
		 color: #333;
    }
    /*Zweite Stufe*/
     .flexnav > li > ul > li > a {
         padding-left:calc(1.03em + 10px);
    }
     .flexnav > li > ul > li > ul > li > a {
         padding-left:calc(1.03em + 20px);
    }
	 .flexnav li a.nav-path-selected, .flexnav li a.nav-selected {
		 color: #036;
	 }
     
    .flexnav .touch-button:after,
    .flexnav .touch-button:before{
        width: 15px;
        height: 2px;
        background-color: #333333;
        position: absolute;
        top: 50%;
        left: 13px;  
        content: '';
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        transform: rotate(45deg);
        -webkit-transition: -webkit-transform 0.5s;
        -o-transition: transform 0.5s;
        transition: transform 0.5s;    
    }
    .flexnav .touch-button:before{
        -webkit-transform: translate(11px) rotate(-45deg);
        -ms-transform: translate(11px) rotate(-45deg);
        -o-transform: translate(11px) rotate(-45deg);
        transform: translate(10px) rotate(-45deg);    
    }
    .flexnav  .touch-button.active:after{
        -webkit-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        transform: rotate(-45deg);  
    }
    .flexnav  .touch-button.active:before{
        -webkit-transform: translate(11px) rotate(45deg);
        -ms-transform: translate(11px) rotate(45deg);
        -o-transform: translate(11px) rotate(45deg);
        transform: translate(10px) rotate(45deg);
    } 
}

/* Flexnav Fix for MS Edge and Windows Phone */
 @media screen (-ms-high-contrast: active) and (-ms-high-contrast: none) {
     .flexnav li a {
         overflow:hidden;
    }
}