{##########################################}
{#### lichtline GmbH ######################}
{#### it@lichtline.com ####################}
{##########################################}

:root {
        
}

{##########################################}
{#### CSS Code ############################}
{##########################################}

    .navigation-menu-wrapper {
        position: relative;
        display: flex;
    }

    .mobile-menu {
        cursor: pointer;
        position: absolute;
        right: 0;
        display: none;
    }

    .navigation-menu {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: right;
        height: 100%;
        width: 100%;
    }

    .navigation-menu-submenu-wrapper {
        display: none;
        position: absolute;
        /* display: flex; */
        flex-direction: column;
        background-color: white;
        width: max-content;
        left: 0;
        border-top: 2px solid black;
    }

    .navigation-menu-submenu-headline,
    .navigation-menu-submenu-headline:hover,
    .navigation-menu-submenu-headline:active,
    .navigation-menu-submenu-headline:focus {
        font-weight: bold;
    }

    .navigation-menu-submenu-submenu-wrapper {
        display: flex;
        flex-direction: column;
    }

    .navigation-menu-item-wrapper {
        height: 100%;
        position: relative;
        list-style: none;
    }

    .navigation-menu-item-wrapper:hover .navigation-menu-submenu-wrapper,
    .navigation-menu-item-wrapper:active .navigation-menu-submenu-wrapper,
    .navigation-menu-item-wrapper:focus .navigation-menu-submenu-wrapper {
        display: flex;
    }

    .mobile-menu:focus ~ ul.navigation-menu,
    ul.navigation-menu:focus,
    ul.navigation-menu:focus-within,
    ul.navigation-menu:active {
        display: flex !important;
    }

    .mobile-menu.close {
        display: none;
    }

    .menu__link {
        display: flex;
        height: 100%;
        align-items: center;
    }

    .menu__link:hover,
    .menu__link:active,
    .menu__link:focus {
        display: flex;
        height: 100%;
        align-items: center;
        justify-content: center;
    }

    .menu__link.active_node,
    .menu__link.active_branch {
        font-weight: bold;
    }

    .navigation-menu-social-wrapper {
        display: none;
        width: 100%;
    }

    .navigation-menu-social-list {
        position: relative;
        display: flex;
        list-style: none;
        justify-content: space-around;
        padding: 0;
        width: 100%;
    }

    .navigation-menu-lower-content {
        height: 100%;
    }