/* ========================================================================
    Main menu + Navbar
=========================================================================== */
nav {
    height: 6.429rem;
}

nav,
nav .dropdown-menu {
    background-color: #384351;
    border: 0;
}

nav .nav-link,
nav .dropdown-menu .dropdown-item {
    color: #ffffff;
}

nav .active.parent .nav-link,
nav .active.nav-link,
nav .nav-link:hover,
nav .dropdown-menu .dropdown-item:hover,
nav .dropdown-menu .dropdown-item:active,
nav .dropdown-menu .dropdown-item.active,
nav .nav-child .nav-item.active a {
    color: orange;
    text-decoration: none;
    background-color: transparent;
}

nav .dropdown .dropdown-menu {
    display: block;
    visibility: hidden;
    opacity: 1;
    transition: .1s ease all;
}

nav .dropdown:hover > .dropdown-menu {
    display: block;
    visibility: visible;
    opacity: 1;
    transition: .1s ease all;
}


/* s========================================================================
    Mobile main menu und X-Animation
=========================================================================== */
@media (max-width: 991.98px) {

    nav {
        height: auto;
    }

    nav.fixed-top {
        position: absolute;
    }


    /* 1. Places the logo in the middle */
    nav .navbar-brand {
        display: block;
        margin-left: auto;
        margin-right: auto;
    }

    /* Turns body scrolling off via js*/
    body.noscroll {
        overflow: hidden;
    }

    /* Changes the color of the navbar */
    body.noscroll nav {
        background-color: #000000;
    }

    /* Calculates the height of the hamburger menu */
    nav .navbar-collapse.show {
        height: calc(100vh - 2.857rem);
    }

    /* 1. Turns scrolling in the hamburger menu on and hide scrollbars */
    nav .navbar-collapse.show {
        overflow-y: auto;
        /* Internet Explorer 10+ */
        -ms-overflow-style: none;
        /* Firefox */
        scrollbar-width: none;
        /* Touch for webkit browser */
        -webkit-overflow-scrolling: touch;
    }

    /* 2. Turns scrolling in the hamburger menu on and hide scrollbars */
    nav .navbar-collapse.show::-webkit-scrollbar {
        /* Safari and Chrome */
        display: none;
    }

    /* Moves the menu down */
    nav .navbar-collapse {
        padding-top: 1.429rem;
        transition: all 0.0s;
    }

    /* Extends the container to the bottom */
    nav .navbar-collapse.show .container {
        padding-bottom: 12.857rem;
    }

    /* 4. Turns the drop-down mobile on */
    nav.navbar .navbar-collapse .dropdown .dropdown-menu {
        display: block;
        visibility: visible;
        opacity: 1;
        transition: none;
        background-color: transparent;
        font-size: 16px;
    }

    /* Hamburger animation */
    nav .navbar-toggler .icon-bar {
        display: block;
        width: 22px;
        height: 2px;
        border-radius: 1px;
        margin: 4px 0 4px 0;
        transition: all 0.2s;
        background: #ffffff;
    }

    nav .navbar-toggler .icon-bar:nth-of-type(1) {
        transform: rotate(45deg);
        transform-origin: 10% 10%;
    }

    nav .navbar-toggler .icon-bar:nth-of-type(2) {
        opacity: 0;
        filter: alpha(opacity=0);
    }

    nav .navbar-toggler .icon-bar:nth-of-type(3) {
        transform: rotate(-45deg);
        transform-origin: 10% 90%;
    }

    nav .navbar-toggler.collapsed .icon-bar:nth-of-type(1) {
        transform: rotate(0);
    }

    nav .navbar-toggler.collapsed .icon-bar:nth-of-type(2) {
        opacity: 1;
        filter: alpha(opacity=100);
    }

    nav .navbar-toggler.collapsed .icon-bar:nth-of-type(3) {
        transform: rotate(0);
    }
}

.navbar-lang {
    z-index: 1090;
}

.navbar-lang .dropdown-menu {
    min-width: 8rem;
    padding: .3rem 0;
}

.navbar-lang .dropdown-item {
    padding: 0.15rem 1.2rem 0.15rem 0.8rem;
}

/* Turns the languages off on small displays */
@media (max-width: 200px) {
    nav .navbar-lang {
        display: none;
    }
}

/* ========================================================================
    Submenu: Ratures and Tips and Tricks
=========================================================================== */
/* Distance between navbar and submenu */
.subnav {
    margin-top: 10rem;
    font-size: 1rem;
    margin-bottom: 50px;
}

/* Responsive Body distance */
@media (max-width: 991px) {
    .subnav {
        margin-top: calc(5.75rem + 3.55vw);
    }
}


.subnav .nav-link {
    padding: .5rem 1.5rem;
    color: #242729;
}

.subnav .nav-link:hover {
    color: orange !important;
}

@media (max-width: 767px) {
    .subnav .nav-link {
        padding: .5rem .75rem;
    }
}

@media (max-width: 499px) {
    .subnav .nav-link {
        padding: .5rem .5rem;
    }
}

.subnav .active .nav-link {
    color: #0085cd !important;
}

.subnav .nav-link img {
    margin-bottom: 0.7143rem;
}

.subnav li.active {
    background-color: #e9eaeb;
    border-radius: .25rem;
}
