.navigation-menu--is-desktop ul:before,
.navigation-menu--is-desktop ul:after {
    content: " ";
    display: table;
}

.navigation-menu--is-desktop ul:after {
    clear: both;
}

.navigation-menu--is-mobile ul,
.navigation-menu--is-desktop ul {
    margin: 0;
    padding: 0;
}

.navigation-menu--is-mobile li,
.navigation-menu--is-desktop li {
    list-style: none;
}

.navigation-menu--is-mobile a,
.navigation-menu--is-desktop a {
    display: block;
}

.navigation-menu--is-mobile ul {
    display: none;
}

.navigation-menu--is-mobile li {
    position: relative;
}

.navigation-menu--is-mobile li span {
    position: absolute;
    right: 0;
    top: 0;
    display: block;
    cursor: pointer;
}

.navigation-menu--is-mobile .navigation-menu__mobile-toggle {
    cursor: pointer;
    display: block;
    min-height: 17px;
    position: relative;
}

.navigation-menu--is-mobile .navigation-menu__mobile-toggle.btn-align-right:before {
    left: auto;
    right: 0;
}

.navigation-menu--is-mobile .navigation-menu__mobile-toggle:before {
    background: url("icons.svg") no-repeat left center;
    display: block;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 17px;
}

.navigation-menu--is-mobile .navigation-menu__mobile-toggle[data-icon="arrow"]:before {
    background-position: -34px 0;
}

.navigation-menu--is-mobile.child-menu-open .navigation-menu__mobile-toggle[data-icon="hamburger"]:before {
    background-position: -17px 0;
}

.navigation-menu--is-mobile.child-menu-open .navigation-menu__mobile-toggle[data-icon="arrow"]:before {
    background-position: -51px 0;
}

.navigation-menu--is-mobile.child-menu-open>ul,
.navigation-menu--is-mobile .child-menu-open>ul {
    display: block;
}

.navigation-menu--is-desktop ul ul {
    display: none;
}

.navigation-menu--is-desktop>ul>li {
    float: left;
}

.navigation-menu--is-desktop ul li {
    position: relative;
}

.navigation-menu--is-desktop ul ul {
    position: absolute;
    left: 0;
    width: 140px;
}

.navigation-menu--is-desktop ul ul ul {
    left: 140px;
    top: 0;
}

.navigation-menu--is-desktop ul li:hover>ul {
    display: block;
    z-index: 5;
}

.navigation-menu--is-desktop .navigation-menu__mobile-toggle,
.navigation-menu--is-desktop span {
    display: none;
}

#main-nav {
    font-size: 1.5rem;
}

#main-nav a {
    color: inherit;
    text-decoration: none;
}

#main-nav.navigation-menu--is-desktop a {
    padding: .25em 1em;
}

#main-nav .navigation-menu__mobile-toggle {
    margin: 1em;
}

#main-nav.navigation-menu--is-mobile li a,
#main-nav.navigation-menu--is-mobile li span {
    padding: .25em 1em;
}

#main-nav.navigation-menu--is-mobile li {
    background: #eee;
    border-top: 1px solid #ddd;
}

#main-nav.navigation-menu--is-mobile li li {
    background: #d8d8d8;
    border-top: 1px solid #ccc;
}

#main-nav.navigation-menu--is-mobile li li li {
    background: #cacaca;
    border-top: 1px solid #bbb;
}

#main-nav.navigation-menu--is-desktop li {
    background: #fff;
}

#main-nav.navigation-menu--is-desktop li:hover {
    background: #eee;
}

#main-nav.navigation-menu--is-desktop ul ul {
    width: 200px;
}

#main-nav.navigation-menu--is-desktop ul ul ul {
    left: 200px;
}