@media (min-width: 1024px) {
  .desktop-nav {
    position: relative
  }

  .desktop-nav__content.content-wrapper {
    align-items: center;
    display: flex;
    flex-direction: row;
    justify-content: space-between
  }

  .desktop-nav .desktop-nav__content .desktop-nav__list {
    list-style: none;
    margin: 0;
    padding: 0
  }

  .desktop-nav .desktop-nav__list {
    display: flex;
    text-transform: uppercase
  }

  .desktop-nav .desktop-nav__list>li {
    display: flex
  }

  .desktop-nav .desktop-nav__list>li>a.desktop-nav__item {
    color: #333;
    font-size: 16px;
    padding: 17px 22px;
    text-decoration: none
  }

  .desktop-nav .desktop-nav__list>li:hover>a.desktop-nav__item {
    background: #383838;
    color: #ffc425
  }

  .desktop-nav .desktop-nav__more {
    background: #393939;
    -webkit-box-shadow: 3px 0 7px rgba(0,0,0,.1);
    box-shadow: 3px 0 7px rgba(0,0,0,.1);
    display: none;
    left: 0;
    position: absolute;
    right: 0;
    top: 100%;
    z-index: 1
  }

  .desktop-nav .desktop-nav__list>li:hover .desktop-nav__more {
    display: block
  }

  .desktop-nav .desktop-nav__more__container {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    );margin: 30px auto
  }

  .desktop-nav .desktop-nav__section:first-child {
    padding-left: 0;
  }
  .desktop-nav .desktop-nav__section:last-child {
    padding-right: 0;
    border: 0;
  }
  .desktop-nav .desktop-nav__section {
    padding-inline: 20px;border-right: 2px solid #414141;
  }

  .desktop-nav .desktop-nav__section.promotion+.desktop-nav .desktop-nav__section {
    padding-left: 20px
  }

  .desktop-nav .desktop-nav__section+.desktop-nav .desktop-nav__section {
    border-left: 2px solid #414141;
    padding-left: 20px
  }

  .desktop-nav .desktop-nav__section.promotion .desktop-nav__promotion__link {
    background-color: #fff;
    display: flex;
    text-align: center;
    flex-direction: column;
  }

  .desktop-nav .desktop-nav__section.promotion .desktop-nav__promotion__link:hover {
    text-decoration: none
  }

  .desktop-nav a.desktop-nav__section__title:hover {
    color: #ffc425
  }

  .desktop-nav .desktop-nav__section__list+.desktop-nav__section__title {
    margin-top: 30px
  }

  .desktop-nav .desktop-nav__section__title {
    color: #fff;
    display: block;
    font-size: 16px;
    line-height: 1;
    margin: 2px 0 16px
  }

  .desktop-nav .desktop-nav__section.promotion img {
    max-width: 100%;
    height: auto;
  }

  .desktop-nav .desktop-nav__section.promotion .desktop-nav__promotion__info {
    padding: 12px 20px
  }

  .desktop-nav .desktop-nav__section.promotion .desktop-nav__promotion__heading {
    font-family: var(--principal-font);
    font-size: 15px;
    line-height: 1.1;
    text-transform: uppercase
  }

  .desktop-nav .desktop-nav__section.promotion .desktop-nav__promotion__subheading {
    color: inherit;
    font-family: var(--secondary-font);
    font-size: 13px;
    line-height: 1.1;
    margin-top: 6px;
    text-transform: none
  }

  .desktop-nav .desktop-nav__section__list a {
    color: #cecac8;
    display: block;
    font-size: 14px;
    line-height: 1.2;
    margin-bottom: 16px;
    white-space: normal
  }

  .desktop-nav .desktop-nav__section__list a:focus,.desktop-nav .desktop-nav__section__list a:hover {
    color: #ffc425
  }

  .mobile-nav{
    display:none
  }
}

@media (max-width: 1024px) {

  #toggle-mobile-menu:before {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDE5Ij48ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHN0cm9rZT0iIzQ5NEE1MiIgc3Ryb2tlLXdpZHRoPSIzIj48cmVjdCB3aWR0aD0iMjEiIGhlaWdodD0iMSIgeD0iMS41IiB5PSIxLjUiIHJ4PSIuNSIvPjxyZWN0IHdpZHRoPSIyMSIgaGVpZ2h0PSIxIiB4PSIxLjUiIHk9IjkuNSIgcng9Ii41Ii8+PHJlY3Qgd2lkdGg9IjIxIiBoZWlnaHQ9IjEiIHg9IjEuNSIgeT0iMTcuNSIgcng9Ii41Ii8+PC9nPjwvc3ZnPg==);
    content: "";
    text-indent: 110%;
    display: block;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDE5Ij48ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHN0cm9rZT0iIzQ5NEE1MiIgc3Ryb2tlLXdpZHRoPSIzIj48cmVjdCB3aWR0aD0iMjEiIGhlaWdodD0iMSIgeD0iMS41IiB5PSIxLjUiIHJ4PSIuNSIvPjxyZWN0IHdpZHRoPSIyMSIgaGVpZ2h0PSIxIiB4PSIxLjUiIHk9IjkuNSIgcng9Ii41Ii8+PHJlY3Qgd2lkdGg9IjIxIiBoZWlnaHQ9IjEiIHg9IjEuNSIgeT0iMTcuNSIgcng9Ii41Ii8+PC9nPjwvc3ZnPg==);
    background-size: cover;
    height: 25px;
    width: 25px;
  }

  #toggle-mobile-menu {
    background: #2e2e2e;
    padding: 8px;
  }
  .desktop-nav{
    display:none
  }

  .mobile-nav[active] {
    background: #2e2e2e;
    bottom: 0;
    font-size: 16px;
    left: 0;
    overflow: auto;
    position: fixed;
    right: 0;
    top: 41px;
    z-index: 11
  }

  .mobile-nav:not([active]) {
    display:none;
  }

  .mobile-nav a {
    color: #fff
  }

  .nav-mobile-lists {
    line-height: 1.667;
    margin: 0;
    padding: 0;
    text-transform: uppercase
  }

  .nav-mobile-lists li {
    border-top: 1px solid #444;
    list-style: none;
    position: relative
  }

  .nav-mobile-lists li:first-child {
    border-top: 0
  }

  .grid-menu-mobile:not([active]) .nav-mobile-children {
    display: none
  }

  .grid-menu-mobile {
    display: grid;
    grid-template-columns: 1fr .15fr;
    grid-template-rows: auto 1fr
  }

  .grid-menu-mobile.has-children {
    border-bottom: 1px solid #444
  }

  .grid-menu-mobile .nav-mobile__link {
    grid-area: 1/1/2/2
  }

  .grid-menu-mobile .nav-mobile__indicator {
    grid-area: 1/2/2/3
  }

  .grid-menu-mobile .nav-mobile-children {
    grid-area: 2/1/3/3
  }

  .nav-mobile__link {
    display: block;
    padding: 7px 20px;
    width: 100%
  }

  .nav-mobile__indicator {
    align-items: center;
    background: transparent;
    border: none;
    border-left: 1px solid #444;
    border-radius: 0;
    display: inline-flex;
    height: 100%;
    justify-content: center;
    padding: unset;
    width: 100%
  }
  .nav-mobile__indicator:hover,
  .nav-mobile__indicator:focus {
    background: transparent;
    border: none;
    border-left: 1px solid #444;
    border-radius: 0;
  }
  .nav-mobile-children {
    background-color: #393939
  }

  .nav-mobile__indicator span {
    display: block;
    height: 12px;
    position: relative;
    width: 12px
  }

  .nav-mobile__indicator span:before {
    background-color: #fff;
    content: "";
    height: 12px;
    left: 5px;
    position: absolute;
    top: 0;
    width: 2px
  }

  .grid-menu-mobile[active]>.nav-mobile__indicator span:before {
    opacity: 0
  }

  .nav-mobile__indicator span:after {
    background-color: #fff;
    content: "";
    height: 2px;
    left: 0;
    position: absolute;
    top: 5px;
    width: 12px
  }

  .nav-mobile-children {
    border-top: 1px solid #444;
    padding: 0;
    position: relative
  }

  .nav-mobile-children .nav-mobile__link {
    padding-left: 40px
  }

  .has-children .nav-mobile-children .nav-mobile__link {
    padding-left: 60px
  }

}