ul.nav li:not(.big-menu) .big-menu-wrapper {
  display: none;
}
@media (max-width: 1024px) {
  .big-menu-wrapper {
    display: none;
  }
}
@media (min-width: 1025px) {
  body.with-big-menu #main-header .container {
    position: unset;
  }

  .big-menu-wrapper {
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.5s ease-out;

    position: absolute;
    left: 0;
    top: 100%;
    width: 100%;
    background-color: #d0d0d0;
    z-index: 2;
  }
  ul.nav > li.big-menu {
    position: unset;
    text-transform: inherit !important;
    li {
      line-height: normal !important;
      padding: 0 !important;
    }
  }
  ul.nav > li.big-menu:hover .big-menu-wrapper {
    max-height: 900px;
    overflow: auto;
  }

  .big-menu-content {
    display: flex;
    justify-content: space-between;

    .menu-image {
      max-width: 600px;
      flex: 1;
      img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
      }
    }

    > .sub-menu {
      padding: 25px 32px 20px 32px;
      display: grid;
      align-content: flex-start;
      gap: 34px;
      grid-template-columns: repeat(auto-fit, minmax(min(138px, 100%), 1fr));
      flex: 1;
      max-width: 61%;
      position: relative;
      opacity: 1;

      visibility: visible;
      border: 0 !important;
      background-color: transparent;
      box-shadow: none;
      width: 100%;

      > li {
        > a {
          font-weight: bold !important;
          font-size: 1.15rem;
          margin-bottom: 6px;
          display: block;
          color: #000 !important;
          text-transform: capitalize !important;
          padding: 0 !important;
          border: 0 !important;

          &:after {
            position: absolute;
            visibility: hidden;
          }
        }
      }

      .sub-menu {
        position: static;
        opacity: 1;
        visibility: visible;
        padding: 0;
        border: 0;
        background-color: transparent !important;
        width: auto;
        box-shadow: none;

        a {
          padding: 4px 0 !important;
          transition: all 0.3s ease-in-out;
          text-transform: inherit !important;
          color: inherit !important;
          &:hover {
            color: #34cff8 !important;
            text-decoration: underline;
            text-underline-offset: 3px;
          }
        }
      }
    }
  }
}

@media (min-width: 1280px) {
  .big-menu-content {
    > .sub-menu {
      padding: 45px;
      grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr));

      & .sub-menu {
        a {
          font-size: 1rem;
        }
      }
    }
  }
}

@media (min-width: 1660px) {
  .big-menu-content {
    > .sub-menu {
      max-width: 62.9%;
      grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr));
    }
  }
}