
.mobile-navigation {
    background:#fff;
    border-top: 1px solid #f6f6f6;
        transition: transform .25s ease, visibility .25s ease;
        width: 100%;
        /*
        height: 100vh;
        */
        visibility: hidden;
        position: fixed;
        z-index: -1;
        transform: translateX(100%);
}

.isOpen .mobile-navigation {
    visibility: visible;
    transform: translateX(0);
    opacity: 1;
}
.mobileNav{
    width: 100%;
    height: 100vh;
    background: var(--blue);
    position: fixed;
    overflow-y: auto;
    z-index:2;
    right:0;
}



.sub-toggle.is-open ul.dropdown-menu {
 display:block !important;
}
   

.mobileNav a.home:hover,
.mobileNav a.branchenloesungen:hover,
.mobileNav a.karriere:hover,
.mobileNav a.world:hover,
.mobileNav a.leistungen:hover,
.mobileNav a.logistikservice:hover,
.mobileNav a.warehousing:hover {
    background: inherit !important;
    color: #000;
}




span.mobilearrow {

    -webkit-transition: all 300ms 0s ease-in-out;
    transition: all 300ms 0s ease-in-out;
}

span.mobilearrow:before {

    -webkit-transition: all 300ms 0s ease-in-out;
        transition: all 300ms 0s ease-in-out;
    content: "";
    padding-top: 0px;
    /* padding-left: 3px; */
    background-image: url(../../Public/Images/lang-arrow-down.svg);
    background-repeat: no-repeat;
    /* background-size: 10px 30px; */
    display: inline-block;
    width: 15px;
    height: 7px;
    margin: 0px 0px 0px 0.55em;
}





.mobileNav .dropdown-menu {
    background:none;
    border:0;
    padding-left:20px;
    padding-bottom:15px !important;
}



.mobileNav #sub_ul5.dropdown-menu {
    background: none;
    border: 0;
    /*padding-left: 0px;*/
    padding-top:15px !important;
    padding-bottom: 15px !important;
    margin-left:-8px !important;
}


.mobileNav span.kundenportal {
    margin: auto;
    margin-right: 1.15em !important;
}
.mobileNav span.partnerportal {
    margin: auto;
    margin-right: 1.15em !important;
}
.mobileNav span.media {
    margin: auto;
    margin-right: 1.15em !important;
}


.mobileNav #topnavmobile {
    font-size:0.875em;
}

.mobileNav .navbar-nav .dropdown-menu-sub {
    display:none;
}


.mobileNav .dropdown-submenu li a span.mobilearrow {
    width: 15px;
    display: inline-block;
    position: absolute;
    right: 5px;
}







.mobileNav .dropdown-menu li a span.level1:before,
.mobileNav .dropdown-menu-sub li a span:before {


    -webkit-transition: all 300ms 0s ease-in-out;
    transition: all 300ms 0s ease-in-out;
    /*
        content: "\f054";
        font-family: "Font Awesome 5 Free";
        */
    content: '';
    /*
    background: url('../../Public/Images/lang-arrow-down.svg') 0 0 no-repeat;
    */
    background-size: contain;
    display: inline-block;
        width: 15px;
        height: 7px;
    
position: absolute;
    left: 10px;
    margin-top: -10px;

-webkit-transform: rotate(270deg);
    transform: rotate(270deg);
 

}

.mobileNav .dropdown-menu li.active a span.level1:before,
.mobileNav .dropdown-menu-sub li.active a span:before {

    /*
    background: url('../../../Resources/Public/Images/chevron-right-red.svg') 0 0 no-repeat;
    */
    background:none ;
}

.mobileNav .dropdown-menu li:hover a span.level1:before,
.mobileNav .dropdown-menu-sub li:hover a span:before {
    /*
    content: "\f078";
    font-family: "Font Awesome 5 Free";
    */

    content: '';
    /*
    background: url('../../../Resources/Public/Images/chevron-right-red.svg') 0 0 no-repeat;
    background-size: contain;
*/
background: none;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}





.mobileNav span.road {
    width: 48px !important;
    height: 40px !important;
    display: block !important;
    background: url(../../../Resources/Public/Images/nav/SO_Icon_Road_WeissRot.svg) 0 0 no-repeat;
    background-size: 35px;
    float: left;
    margin-right: 0;
     margin-top: 0px; 
}




.mobileNav span.warehousing {
    width: 48px !important;
    height: 40px !important;
    display: block !important;
    background: url(../../../Resources/Public/Images/nav/SO_Icon_Warehousing_WeissRot.svg) 0 0 no-repeat;
    background-size: 35px;
    float: left;
    margin-right: 0;
    margin-top: 0px;
}


.mobileNav span.logistikservice {
    width: 48px !important;
    height: 40px !important;
    display: block !important;
    background: url(../../../Resources/Public/Images/nav/SO_Icon_LogisticServices_WeissRot.svg) 0 0 no-repeat;
    background-size: 35px;
    float: left;
    margin-right: 0;
    margin-top: 0px;
}






.mobileNav .dropdown-item:focus,
.mobileNav .dropdown-item:active {
    color: var(--bs-dropdown-link-active-color);
    text-decoration: none;
    background-color: transparent !important;
}


.mobileNav .dropdown-item.active,
.mobileNav .dropdown-item:active {
    color: var(--bs-dropdown-link-active-color);
    text-decoration: none;
    background-color: transparent !important;
}


span.mobilearrow:before {

    -webkit-transition: all 300ms 0s ease-in-out;
        transition: all 300ms 0s ease-in-out;
    content: "";
    padding-top: 0px;
    /* padding-left: 3px; */
    background-image: url(../../Public/Images/lang-arrow-down.svg);
    background-repeat: no-repeat;
    /* background-size: 10px 30px; */
    display: inline-block;
    width: 15px;
    height: 7px;
    margin: 0px 0px 0px 0.55em;
}


.is-open span.mobilearrow:before {

-webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}













@media (min-width: 768px) {


    /*
               .navbar-hidden .small-header-navigation__container {
                    height: calc(100% - 45px);
                }
    */
span.mobilearrow:before {

    -webkit-transition: all 300ms 0s ease-in-out;
        transition: all 300ms 0s ease-in-out;
    content: "";
    padding-top: 0px;
    /* padding-left: 3px; */
    background-image: url(../../Public/Images/lang-arrow-down.svg);
    background-repeat: no-repeat;
    /* background-size: 10px 30px; */
    display: inline-block;
    width: 15px;
    height: 7px;
    margin: 0px 0px 0px 0.55em;
}


 
    .mobile-navigation:before {
        content: "";
        position: absolute;
        display: block;
        width: 200vw;
        height: 100vh;
        right: 0;
        top: 0;
        background-color: #000;
        opacity: 0;
        transition: opacity .2s ease;
    }

    .isOpen .mobile-navigation:before {
        background-color: rgba(0,0,0,0.2); 
        opacity: 1;
    }

    .mobileNav {
        max-width: 450px;
        margin-left: auto;
    }
}



@media (min-width: 1200px) {
   .mobile-navigation  .align-items-xl-end {
        align-items: inherit !important;
    }
}




@media (min-width: 1240px) {
    .isOpen .mobile-navigation {
        display:none;
    }
            span.sub-toggle {
            display: none !important;
        }

}





@media (min-width: 960px) {


    /*
               .navbar-hidden .small-header-navigation__container {
                    height: calc(100% - 45px);
                }
    */
    span.mobilearrow:before {

        -webkit-transition: all 300ms 0s ease-in-out;
            transition: all 300ms 0s ease-in-out;
        content: "";
        padding-top: 0px;
        /* padding-left: 3px; */
        background-image: url(../../Public/Images/lang-arrow-down.svg) !important;
        background-repeat: no-repeat;
        /* background-size: 10px 30px; */
        display: inline-block;
        width: 15px;
        height: 7px;
        margin: 0px 0px 0px 0.55em;
    }

}

/*
@media (min-width: 992px) {
    .navbar-expand-lg .navbar-toggler {
        display: block;
    }

    .navbar-expand-lg .navbar-collapse {
        display: none !important;
        flex-basis: auto;
    }


}


@media (min-width: 1400px) {
    .navbar-expand-lg .navbar-toggler {
        display: none;
    }
    .navbar-expand-lg .navbar-collapse {
        display: flex !important;
        flex-basis: auto;
    }
}
    */