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

    #hamburger-menu {display:block;}
    
    .hamburger-menu-button {
      width: 40px;
      height: 40px;
      padding: 6px;
      display: block;
      position: absolute;
      margin-top:11px;
      z-index: 1000;
        right:15px;
      box-sizing: content-box;
      text-indent: 100%;
      color: transparent;
      white-space: nowrap;
      cursor: pointer;
      overflow: hidden;
        background:transparent;
    }
    .hamburger-menu-button-open {
      top: 50%;
      margin-top: -1px;
      left: 50%;
      margin-left: -12px;
    }
    .hamburger-menu-button-open, 
    .hamburger-menu-button-open::before, 
    .hamburger-menu-button-open::after {
      position: absolute;
      width: 30px;
      height: 3px;
      background: #005a8c;
      -webkit-transition: all 0.3s;
      transition: all 0.3s;
    }
    .hamburger-menu-button-open::before, 
    .hamburger-menu-button-open::after {
      left: 0;
      content: "";
    }
    .hamburger-menu-button-open::before {
      top: 8px;
    }
    .hamburger-menu-button-open::after {
      bottom: 8px;
    }
    .hamburger-menu-button-close {
      background: transparent;
      -webkit-transform: rotate(180deg);
              transform: rotate(180deg);
    }
    .hamburger-menu-button-close::before {
      -webkit-transform: translateY(-8px) rotate(45deg);
              transform: translateY(-8px) rotate(45deg);
    }
    .hamburger-menu-button-close::after {
      -webkit-transform: translateY(8px) rotate(-45deg);
              transform: translateY(8px) rotate(-45deg);
    }
    .mainnav {
      position: absolute;
      top: 76px;
      left: 0px;
      margin: auto;
      width:100%;
      overflow: hidden;
      padding-right:0px; 
      -webkit-transform: translateX(-110%);
              transform: translateX(-110%);
    -webkit-transition: all 0.5s ease-in-out;
      transition: all 0.5s ease-in-out;
        z-index:999;
        
    }
    
    .mainnav.on {
      -webkit-transform: translateX(0px);
              transform: translateX(0px);  
        
    }
    .mainnav ul {
      -webkit-transform: translateX(-110%);
              transform: translateX(-110%);
      background-color: #009cd8;
      -webkit-transition: all 0.5s ease-in-out;
      transition: all 0.5s ease-in-out;
        z-index:999;
        position:relative;
        width:100%;
    }
    .mainnav.on ul {
      -webkit-transform: translateX(0px);
              transform: translateX(0px);
    }
    .mainnav ul {
        display:table;
    }
    
    .mainnav ul li ul li a {
        padding-left:40px;
    }
    
    .mainnav ul li ul li ul li a {
        padding-left:60px;
    }
    
    .mainnav ul li ul li ul li ul li a {
        padding-left:80px;
    }
    
    .mainnav ul li {
      display:block;
        position:relative;
        border-top: 1px solid rgba(255,255,255,.5);
    }
    
    .mainnav ul li:first-child .mainnav ul li a {
      padding-left:0px;
    }
    .mainnav ul li a {
      padding: 15px;
      display: block;
      background-color: transparent;
      color: #fff;
      text-transform: uppercase;
      -webkit-transition: all 0.2s ease-in-out;
      transition: all 0.2s ease-in-out;
      font-size: 14px;
    }
    .mainnav ul li.active a, .mainnav ul li a:hover {
      background-color: #009cd8;
      color: #fff;
    }  
    .dropdown.hassub a {position:relative;}
    
    
   
    .mainnav ul li.hassub a:after {
        content:"+";
        position:absolute;
        right:0px;
        font-size:0.9rem;
        top:0px;
        padding:15px;
        
    background: rgba(255,255,255,.1);
    border: none!important;
    border-left: 1px solid rgba(255,255,255,.4)!important;
    
    }
    
    .mainnav ul li li a:after {content:"" !important;background:none;border-left:0px;}
    
    .mainnav ul li.hassub li.hassub a:after,
    .mainnav ul li.hassub li.hassub li.hassub a:after {
        content:"+" !important;
        background: rgba(255,255,255,.1);
        border-left: 1px solid rgba(255,255,255,.4)!important;
    }
    
    .mainnav ul li.hassub li a:after,
    .mainnav ul li.hassub li.hassub li a:after,
    .mainnav ul li.hassub li.hassub li.hassub li a:after {content:"" !important;background:none;border-left:0px !important;}
    

}

/* nav
--------------------------------------------------------------------------------------- */
@media only screen and (min-width: 1230px) { 
    .dropDownMenu a {
        color: #4d4d4d;  
        font-size:1.1rem;
        font-weight:300;
        position:relative;  
    }
    
    #main .dropDownMenu a, .dropDownMenu a:link, .dropDownMenu a:visited, .dropDownMenu a:active {
        color: #4d4d4d;
    }
    
    .dropDownMenu,
    .dropDownMenu ul {
        list-style: none;
        margin:40px 0px 0px 0px;
        padding: 0;
        float:right;
    }
    .dropDownMenu li {
        position: relative;
        margin-bottom:30px;
    }
    .fixed .dropDownMenu li {margin-bottom:10px;}
    .dropDownMenu li li, .fixed .dropDownMenu li li {
        margin-bottom:0px;
    }
    .dropDownMenu li:first-child {margin-left:20px;}
    .dropDownMenu li li:first-child {margin-left:0px;}
    .dropDownMenu a {
        padding:10px 13px 10px 13px;
        display: block;
        text-decoration: none;
        letter-spacing:0; 
    }
    
    .dropDownMenu li.termine a {
        color:#4d4d4d;
        background-color:#f6c900;
    }
    
    .dropDownMenu li.active a,
    .dropDownMenu li.active li li.active a,
    .dropDownMenu li.active li.active li.active li.active a,
    .dropDownMenu li.active li.active li.active li a:hover {color:#199cd8;}
    .dropDownMenu li.active li.active li.active li a {color:#4d4d4d;}
    
    .fixed .dropDownMenu, .fixed .dropDownMenu ul {margin:10px 0px 0px;}
    .fixed .dropDownMenu a {padding: 10px 13px;}
    .fixed .dropDownMenu > li > ul li a {padding:10px 10px;}
    
    /*SPECS*/
    .dropDownMenu ul {
        margin:0px 0px 0px 0px;
        border-top:2px solid #199cd8;  
        padding-top:20px;
    }
   #ham-navigation .dropDownMenu ul .spc ul { border:none; box-shadow:none; padding-top:0px; float:left; }
   #ham-navigation .dropDownMenu ul .spc ul a { color:#4d4d4d!important; font-weight:normal!important; font-size: 0.9rem !important; line-height: 20px;  padding: 4px 15px !important; border-bottom: 0; }

    .fixed .dropDownMenu ul {margin:0px;}
    .dropDownMenu>li.dropdown {
        position: static;
    }
    
    .dropDownMenu>li>ul>li.dropdown>ul {
        text-align: left;
        display: contents !important;
        position: relative;
        left: auto;
        top: auto;
        z-index: 9999999;
        background-color: #fff;
        margin-top: 0;
    }
    
    .dropDownMenu>li>ul>li.dropdown {
        width: 25%;
        display: inline-block;
        vertical-align: top;
        min-height: 265px;
        padding-bottom: 0;
        float:left;
    }
    
    .dropDownMenu>li:nth-child(3)>ul>li.dropdown {
        min-height: 260px;    
    }
    
    a.dropdown-toggle.active {color:#199cd8;}
    
    ul.nav li li li.dropdown.has-children:after {
        content: "\f105";
        position: absolute;
        color: #aaa;
        right: 0px;
        top: 5px;
        font-weight: 900;
        font-family: 'Font Awesome 5 Free';
        display:block;
    }

    .nav li.dropdown ul li a, .nav li.active .dropdown-menu li a, .nav li .dropdown-menu li a {
        border-bottom:0px;
        font-weight: 300;
        color: #009bd8;
        line-height:24px;
        padding: 5px 15px!important;
        font-size:1rem !important;
    }
    
    .dropDownMenu>li>ul>li.dropdown>ul>li a {
        font-weight: 300;
        font-size: 0.9rem !important;
        line-height: 20px;
        padding: 4px 15px !important;
        border-bottom: 0;
        color: #4d4d4d;
    }
    
    /*SPC*/
    .mainnav .spc {
        width:25%;
        display:table;
        float:left;
        vertical-align:top;
        position:relative; 
        text-indent:-999em;      
    }

    .mainnav .spc li {text-indent:0px;color:#fff;}
    #main .nav > li > a.active {color:#009bd8 !important;}
    li.dropdown:last-child ul {
        margin-left:auto;
    }
    
    .nav .spc li a:hover {color:#f6c900 !important;}

    /*.mainnav .dropDownMenu li .spc li a:hover {
        color:#f6c900;
    }*/
    
    ul.nav li li.dropdown.has-children, ul.nav li li {
        position: relative;
        display: table;
    }
    
    .mainnnav .dropDownMenu li .spc li a {
        font-weight: 700;
        border-bottom: 0;
        color: #009bd8;
        padding:5px 15px !important;
        font-size:18px !important;
         width:265px;
    }
 
      /* hover 2 und 3 Ebene */

      .mainnav .dropDownMenu  li li li a:hover  {
        color:#009bd8;
      }
     /* aktive rand unten bei 2 Ebene entfernen */
       .mainnav .spc:after { background-color:transparent !important; }
    
   
    /* Level 1 Drop Down */
    .dropDownMenu > li {
        display: inline-block;
        vertical-align: top;  
    }

    /* Level 2 */
    .dropDownMenu ul {
        box-shadow: 2px 2px 15px 0 rgba(0,0,0, 0.5);
        background-color:#fff; 
    }
    .dropDownMenu li li {}
    .dropDownMenu > li > ul {
        text-align: left;
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        width: calc(100% - 15px);
        z-index: 999999;
        padding:20px 5px;
        background-color:#fff;
    }
    
    .dropDownMenu > li > ul > ul {padding:0px;padding-top:0px;}
    
    .dropDownMenu > li > ul li a {transition:none;text-transform:none;padding:10px 20px;margin:0px;color:#4d4d4d;font-weight:300;font-size:0.8rem;}
    .dropDownMenu > li > ul li:last-child a {border-bottom:0px;}
    .dropDownMenu > li > ul li:hover a, .dropDownMenu > li > ul li.active a  {}
    
   
    .dropDownMenu li:hover > a {
        color:#199cd8;
    }
    
    .dropDownMenu li li:hover > a {
        /*background-color:rgba(0, 0, 0, .09);*/
        color:#f6c900;
    }
    
    .nav li.dropdown ul li a:hover, .nav li.active .dropdown-menu li a:hover, .nav li .dropdown-menu li a:hover {color:#009bd8;}
    
    .nav li.dropdown ul li li a:hover, .nav li.active .dropdown-menu li li a:hover, .nav li .dropdown-menu li li a:hover,
    .dropDownMenu>li>ul>li.dropdown>ul>li a:hover {
        color:#009bd8;
    }
    
    .dropDownMenu li.active li a, .dropDownMenu li.active li a.active, .dropDownMenu li.active a:hover, .dropDownMenu li.active:hover a {background-image:none;}
    
    .dropDownMenu li li,
    .dropDownMenu li li a,
    .dropDownMenu li.active li a {background-color:#fff; } 
    
    
    .dropDownMenu ul li:last-child a:before {
        display:none;
    } 

    .dropDownMenu ul li:last-child a:hover:before {
        display:none;
    }
    
    .dropDownMenu li li.active a, .dropDownMenu li li a:hover {background-color:#fff;color:#199cd8;}

    /* Level 3 */
.dropDownMenu > li > ul > li > ul {
    text-align: left;
    display: none;
    position: absolute;
    left: 285px;
    top: 0;
    z-index: 9999999; 
    background-color:#fff;
    width: 280px;
    padding-top:0px;
    margin-top:0px;  
}
  
/* Level 4 */
.dropDownMenu > li > ul > li > ul > li >ul {
    text-align: left;
    display: none;
    position: absolute;
    left: 285px;
    top: 0;
    z-index: 9999999; 
    background-color:#fff;
    width: 280px;
    margin-top:0px; 
    padding-top:0px;
}  
  

.dropDownMenu > li > ul > li > ul:before {display:none;}

.nav li.dropdown ul li a, .nav li.active .dropdown-menu li a, .nav li .dropdown-menu li a {display:block;width:100%;font-weight:600;}
    
    .fixed .dropDownMenu li.active a {
        background-position: center bottom 10px; 
    }
}

