/* Flexnav Base Styles */
 .flexnav {
     padding: 0!important;
     -webkit-transition: none;
     -o-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;
     -o-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;
     list-style-type: none;
}
 .flexnav li a {
     position: relative;
     display: block;
     padding: 1.03em;
     z-index: 2;
     color: #000000;
     background: transparent;
     -webkit-transition: color 0.4s ease-in-out;
     -o-transition: color 0.4s ease-in-out;
     transition: color 0.4s ease-in-out;
}
 .flexnav li ul {
     width: 100%;
}
 .flexnav li ul li {
     font-size: 100%;
     position: relative;
     overflow: hidden;
}
 .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;
}

/* wbox variables.less Wert @breakpoint-desktop verwenden */
 @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;
         display: inline-block;
         overflow: visible;
    }
     .flexnav li a {
         border-bottom: none;
         padding: 0.6em 0.38em;
    }
     .flexnav>li:first-child>a{
         padding-left: 0;
    }
     .flexnav>li:last-child>a {
         padding-right: 0;
    }
     .flexnav li > ul {
         position: absolute;
         top: auto;
         left: 0;
    }
     .flexnav li:last-child > ul {
        /* right:0;
         left:initial;
        */
    }
     .flexnav li ul {
         margin-left: -15px;
         min-width: 250px;
    }
     .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: -webkit-calc(100% - 1.03em);
         margin-left: calc(100% - 1.03em);
         top: 0;
    }
     .flexnav li ul li a {
         border-bottom: none;
         font-size:1.2em;
         padding:0.4em 0.7em;
    }
     .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;
    }
     .flexnav > li a[href*="meine-kurse"] {
         display: none;
     }
     .flexnav > li a[href*="bonusvideos"] {
         display: none;
     }
}

 @media (min-width:1200px) and (max-width:1459px) {
     .flexnav li a {
         font-size: 0.85em;
         padding: 0.45em 5px 0.6em 0.4em;
    }
     .flexnav li ul li a {
         padding: 0.4em 0.9em;
         font-size:0.875em;
    }
}

 @media (min-width:1460px){
     .flexnav li a {
         padding: 0.7em 0.4em 0.8em 0.4em;
     }
     .flexnav li ul li a {
         padding: 0.4em 0.9em;
         font-size:0.875em;
    }
}

@media (max-width:1199px) {
    .flexnav li a {
        font-size: 0.82em;
    }
}

/* 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;
    }
}
 */
/* wbox variables.less Wert @breakpoint-mobile verwenden */
 @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;
    }
    /*Zweite Stufe*/
     .flexnav > li > ul > li > a {
         padding-left:-webkit-calc(1.03em + 10px);
         padding-left:calc(1.03em + 10px);
    }
     .flexnav > li > ul > li > ul > li > a {
         padding-left:-webkit-calc(1.03em + 20px);
         padding-left:calc(1.03em + 20px);
    }
     .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);
         transform: rotate(45deg);
         -webkit-transition: -webkit-transform 0.5s;
         transition: -webkit-transform 0.5s;
         -o-transition: transform 0.5s;
         transition: transform 0.5s;
         transition: transform 0.5s, -webkit-transform 0.5s;
    }
     .flexnav .touch-button:before{
         -webkit-transform: translate(11px) rotate(-45deg);
         -ms-transform: translate(10px) rotate(-45deg);
         transform: translate(10px) rotate(-45deg);
    }
     .flexnav .touch-button.active:after{
         -webkit-transform: rotate(-45deg);
         -ms-transform: rotate(-45deg);
         transform: rotate(-45deg);
    }
     .flexnav .touch-button.active:before{
         -webkit-transform: translate(11px) rotate(45deg);
         -ms-transform: translate(10px) 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;
    }
}
 