@media (max-width: 991px) {
  .nav-open body .nav-toggle:after {
    background: rgba(0, 0, 0, 0.5);
  }
  .nav-open .nav-sections {
    overflow: hidden;
  }
  .nav-open body header.page-header .nav-sections-item-title,
  .nav-open body header.page-header .nav-sections-item-title.active {
    opacity: 1;
  }
  body header.page-header .nav-sections-item-title,
  body header.page-header .nav-sections-item-title.active {
    padding: .5rem 1rem;
    display: block;
    width: 100%;
    text-align: left;
    height: 52px;
    line-height: 34px;
    background-color: #f9f9f9;
    border-color: #f9f9f9;
    position: fixed;
    top: 0;
    width: 380px;
    z-index: 100;
    opacity: 0;
  }
  body .sw-megamenu.navigation .level0 > .submenu.level0 > .row,
  body .sw-megamenu.navigation .level0 > .submenu.level0 .row {
    margin: 0;
  }
  body header.page-header .nav-sections-item-title[aria-controls="store.menu"] > a:before {
    position: absolute;
    right: 1rem;
    content: '';
    background: url('../images/close-menu.svg');
    display: block;
    width: 20px;
    height: 20px;
    background-size: contain;
    margin: 8px 0;
  }
  a.is-home-link:before {
    content: '';
    background: url('../images/menu-icon.svg');
    display: inline-block;
    width: 20px;
    height: 20px;
    background-size: contain;
    vertical-align: middle;
    margin-right: .5rem;
  }
  body .sw-megamenu.navigation .submenu.level0.opened {
    height: 0;
    visibility: hidden;
  }
  body .sw-megamenu.navigation .level0 > .submenu.level0 {
    height: calc(100vh - 200px);
    visibility: visible;
    left: 100% !important;
    -webkit-transition: left 0.5s ease-in;
    transition: left 0.5s ease-in;
    background: #fff;
    z-index: 9;
    top: 45px !important;
    width: 380px;
    position: absolute;
    overflow: auto;
    overflow-x: hidden;
  }
  body .sw-megamenu.navigation .level0._show-child > .submenu.level0 {
    height: calc(100vh - 200px);
    visibility: visible;
    left: 0 !important;
    right: auto !important;
    background: #fff;
    z-index: 9;
    top: 199px !important;
    width: 380px;
    position: absolute;
  }
  body .sw-megamenu.navigation li.ui-menu-item > a {
    /* position: static; */
    display: inline-block;
    width: calc(100% - 70px);
    vertical-align: middle;
  }
  body .sw-megamenu.navigation li.ui-menu-item._show-child {
    position: static;
  }
  body header.page-header .nav-sections-item-title.active > a,
  body header.page-header .nav-sections-item-title > a {
    color: #798490;
  }
  .navigation .menu-top > a {
    display: block !important;
    width: 100%;
    padding: 12px 1rem;
    font-size: 14px;
  }
  .menu-top {
    width: 100%;
    padding: 0;
    position: absolute;
    top: 52px;
    left: 100%;
    width: 380px;
    background: #fff;
    z-index: 100;
    display: flex;
    flex-direction: column;
    -webkit-transition: left 0.5s ease-in;
    transition: left 0.5s ease-in;
  }
  .slide-left .menu-top {
    -webkit-transition: left 0.5s ease-in;
    transition: left 0.5s ease-in;
    left: 0;
    width: 100%;
    padding: 0;
    position: absolute;
    top: 52px;
    background: #fff;
    z-index: 100;
    display: flex;
    flex-direction: column;
    visibility: visible;
    opacity: 1;
  }
  a.navigation-offcanvas-headline,
  a.button-back {
    font-weight: 700;
  }
  .menu-top > a:last-child:before {
    content: '\f802';
    display: inline;
    font-family: 'porto-icons';
    margin-right: 10px;
    font-size: 16px;
    vertical-align: top;
    color: #aaaaaa;
  }
  .menu-top > a.navigation-offcanvas-headline {
    border-bottom: 1px solid #ddd;
    padding: 20px 1rem 1rem;
  }
  body .navigation .submenu:not(:first-child) ul {
    padding-left: 0;
  }
  body .navigation .level0._show-child {
    border-top: 0;
  }
  .navigation .submenu:not(:first-child) ul > li {
    border-bottom: 1px solid #ddd;
    padding-left: 0px;
  }
  .navigation .level0 .submenu.level0 .level1 > .subchildmenu,
  .navigation .level0 .submenu.level0 .level1 .subchildmenu .level2 > .subchildmenu {
    height: auto;
    visibility: visible;
    -webkit-transition: left 0.5s ease-in;
    transition: left 0.5s ease-in;
    position: absolute;
    opacity: 1;
    left: 100% !important;
    right: auto !important;
    background: #fff;
    width: 380px;
    top: 0;
    height: 100vh;
    z-index: 100;
  }
  .navigation .level0 .submenu.level0 .level1._show-child > .subchildmenu,
  .navigation .level0 .submenu.level0 .level1 .subchildmenu .level2._show-child > .subchildmenu {
    height: auto;
    position: absolute;
    height: 100vh;
    visibility: visible;
    left: 0 !important;
    background: #fff;
    z-index: 10;
    top: 0px !important;
    right: auto !important;
    width: 380px;
    opacity: 1;
  }
  .navigation li.level0 .ui-menu-item > a:before {
    display: none;
  }
  .sw-megamenu.navigation li.ui-menu-item.level1 > .open-children-toggle:before,
  .sw-megamenu.navigation li.ui-menu-item.level2 > .open-children-toggle:before {
    content: '\f801';
    display: inline;
    font-family: 'porto-icons';
    margin-right: 10px;
    font-size: 16px;
    vertical-align: top;
    color: #aaaaaa;
    line-height: 41px;
    margin: 0;
  }
  .navigation._show-child .level0 > .submenu > .row ._show-child.subchildmenu .level1:not(._show-child),
  .navigation._show-child li.level0:not(._show-child) {
    display: none;
  }
  body .sw-megamenu.navigation li.ui-menu-item > .open-children-toggle {
    width: 70px;
    position: relative;
    display: inline-block;
    vertical-align: middle;
    float: right;
    order: 2;
    text-align: right;
    padding-right: 25px;
    position: static;
  }
  body .sw-megamenu.navigation li.ui-menu-item {
    position: static;
    display: flex;
  }
  body .sw-megamenu.navigation li.ui-menu-item > .open-children-toggle:before {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 16px;
    line-height: 41px;
    color: inherit;
    content: '\f801';
    font-family: 'porto-icons';
    vertical-align: middle;
    display: inline-block;
    font-weight: normal;
    overflow: hidden;
    speak: none;
    text-align: center;
    color: #aaaaaa;
  }
  body .navigation .parent .level-top:after {
    display: none;
  }
}
@media (min-width: 992px) {
  .menu-top,
  body header.page-header .nav-sections-item-title,
  body header.page-header .nav-sections-item-title.active {
    display: none;
  }
}
@media (max-width: 479px) {
  body header.page-header .nav-sections-item-title,
  body header.page-header .nav-sections-item-title.active {
    width: calc(100% - 54px);
  }
  body .sw-megamenu.navigation .level0._show-child > .submenu.level0,
  .navigation .level0 .submenu.level0 .level1._show-child > .subchildmenu,
  .navigation .level0 .submenu.level0 .level1 .subchildmenu .level2._show-child > .subchildmenu,
  .navigation .level0 .submenu.level0 .level1._show-child > .subchildmenu,
  .navigation .level0 .submenu.level0 .level1 .subchildmenu .level2._show-child > .subchildmenu,
  .navigation .level0 .submenu.level0 .level1 > .subchildmenu,
  .navigation .level0 .submenu.level0 .level1 .subchildmenu .level2 > .subchildmenu .menu-top {
    width: 100%;
  }
}
