#menutoggle {
    display: none;
}

#cssmenu {
    position: absolute;
    bottom: 0;
    right: 80px;
    left: 0;
    background: #00529e;
    z-index: 999;
}

    #cssmenu ul, #cssmenu li {
        list-style: none;
        padding: 0;
        margin: 0;
        position: relative;
        box-sizing: border-box;
    }

    #cssmenu a:first-child {
        text-decoration: none;
        color: #FFF;
        font-size: 12px;
        padding: 10px;
        display: block;
        background-color: #00529e;
        box-sizing: border-box;
    }

        #cssmenu a:first-child:hover {
            font-weight: bold;
        }

.has-sub li {
    border: 1px solid #84ccf8;
}

    .has-sub li:not(:last-of-type) {
        border-bottom: none;
    }

.has-sub ul {
    display: none;
    position: absolute !important;
    width: 200px;
    top: 100%;
    left: 0;
    z-index:2;
}

.has-sub:hover, .has-sub:active {
    border-right: none;
}

    .has-sub:hover > ul, .has-sub:active > ul {
        display: block;
    }

.navilevel0::after {
    content: "";
    clear: both;
    display: block;
    height: 0;
}

.navilevel0 > li {
    float: left;
    width: 110px;
    text-align: center;
}

.navilevel1 .has-sub ul {
    top: -1px;
    left: 100%;
}

.navilevel1 .has-sub > a:first-child:after {
    content: "";
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-left: 9px solid #fff;
    position: absolute;
    top: 7px;
    right: 5px;
}

.navilevel2 li:first-child {
    border-left: none;
}

@media (max-width: 768px) {
    #menutoggle {
        cursor: pointer;
        float: right;
        margin-right: 5vw;
        max-height: 33px;
        position: relative;
        display: inline-block;
        z-index: 1000;
    }

        #menutoggle::after {
            color: #00529e;
            content: "\2261";
            font-size: 50px;
            line-height: .7;
        }

    .open #menutoggle::after {
        content: "\d7";
        color: #fff;
    }

    .subtoggle {
        position: absolute;
        right: 0;
        top: 0;
        bottom: 0;
        width: calc(5vw + 29px);
        border-left: 5vw solid transparent;
    }

        .subtoggle::after {
            content: "";
            position: absolute;
            left: 0;
            top: 9px;
            border: 15px solid transparent;
            border-bottom: none;
            border-top-color: #FFF;
        }

    .open > .subtoggle::after {
        border-bottom: 15px solid #FFF;
        border-top: none;
    }

    #cssmenu {
        background: none;
        bottom: auto;
        right: 0;
        left: -5.6%;
        width: 112%;
    }

        #cssmenu.open {
            background: #00529e;
        }

            #cssmenu.open .navilevel0 {
                display: block;
            }

        #cssmenu li {
            width: 100%;
            border-top: rgba(0, 0, 0, 0.4) 2px solid;
        }

        #cssmenu a:first-child {
            background-color: transparent;
        }

    .has-sub li {
        border-left: none;
        border-right: none;
        border-bottom: none;
    }

    .has-sub > ul {
        margin-left: 18px !important;
        display: none !important;
        width: calc(100% - 18px);
        position: relative !important;
        background-color: rgba(255, 255, 255, 0.06);
    }

    .has-sub.open > ul {
        display: block !important;
    }

    .navilevel0 {
        background-color: #164581;
        margin-top: 33px;
        display: none;
    }

        .navilevel0 > li:last-child {
            border-bottom: rgba(0, 0, 0, 0.4) 2px solid;
        }

    .navilevel1 .has-sub ul {
        left: 0;
        top: 0;
    }

    .navilevel1 .has-sub a:first-child:after {
        border: none;
    }
}