.slideout-menu {
    @apply .bg-green-dark .fixed .top-0 .right-0 .bottom-0;

    width: 250px;
    height: 100%;
    z-index: 10;

    ul {
        @apply .bg-green-dark .p-0;

        li a {
            @apply .text-white;
        }

        // Indent second level now since first level is shown
        li > ul > li a {
            @apply .pl-8;
        }

        // Indent third level now since first level is shown
        li > ul > li > ul > li a {
            @apply .pl-12;
        }

        // Selected State
        .selected > a {
            @apply .text-yellow;
        }

        a:hover {
            @apply .text-yellow;

            background: transparent;
        }
    }

    // Main Menu within offcanvas
    .offcanvas-main-menu {
        @apply .block;

        ul ul li {
            @apply .bg-green-darker;
        }

        ul li .main-menu-toggle {
            @apply .bg-green-darker .uppercase .text-base .pr-6;

            cursor: pointer;
        }

        // Menu Header top level (MAIN MENU)
        ul ul {
            @apply .border-solid .border-b-4 .border-green-darker;
        }
    }

    h2 {
        @apply .text-white .p-0 .pb-3 .pl-3 .mt-8;
    }
}

.slideout-menu {
    @apply .bg-green-dark .fixed .top-0 .right-0 .bottom-0;

    width: 250px;
    height: 100%;
    z-index: 10;

    ul.main-menu {
        @apply .bg-green-dark .p-0;

        li a {
            @apply .text-white;
        }

        // Indent second level now since first level is shown
        li > ul > li a {
            @apply .pl-8;
        }

        // Indent third level now since first level is shown
        li > ul > li > ul > li a {
            @apply .pl-12;
        }

        // Selected State
        .selected > a {
            @apply .text-yellow;
        }

        a:hover {
            @apply .text-yellow;

            background: transparent;
        }
    }

    // Main Menu within offcanvas
    .offcanvas-main-menu {
        @apply .block;

        ul ul li {
            @apply .bg-green-darker;
        }

        ul li .main-menu-toggle {
            @apply .bg-green-darker .uppercase .text-base .pr-6;

            cursor: pointer;
        }

        // Menu Header top level (MAIN MENU)
        ul ul {
            @apply .border-solid .border-b-4 .border-green-darker;
        }
    }

    h2 {
        @apply .text-white .p-0 .pb-3 .pl-3 .mt-8;
    }
}

Fix style of offcanvas menu when hovering by only applying the style to the menus (so the undermenu list does not get this style).
Fix style of offcanvas menu when hovering by only applying the style to the menus (so the undermenu list does not get this style).
