@keyframes dropdownanimate {
  0% {
    max-height: 0;
    opacity: 0;
  }
  98% {
    max-height: 600px;
    opacity: 1;
  }
  100% {
    max-height: 2000px;
    opacity: 1;
  }
}

@keyframes dropdownanimaterev {
  0% {
    max-height: 1200px;
    opacity: 1;
  }
  100% {
    max-height: 0px;
    opacity: 0;
  }
}

.elementor-widget-dtbaker_wp_menu {
  .elementor-editor-element-settings {
    z-index: 600 !important;
  }
}

.stylepress-nav-menu-placeholder {
  display: none;
}

.stylepress-nav-menu {

  .stylepress-nav-wrapper {

    position: relative;
    z-index: 500;

    .stylepress-nav-logo {

    }

    .stylepress-main-navigation {
      clear: both;
      display: block;
      text-align: left;

      .stylepress-menu-toggle {
        &:before {
          content: "\f0c9";
          font-family: FontAwesome;
          line-height: 1em;
          speak: none;
        }
        padding-left: 20px;
        padding-right: 20px;
        line-height: 60px;
        width: 100%;
        text-align: center;
        display: none;
        color: #000;
        cursor: pointer;
        @media (max-width: 768px) {
          display: block;
        }
        .stylepress-mobile-menu {
          margin-left: 10px;
        }
      }
      .stylepress-menu-toggle,
      .stylepress-menu-toggle:active,
      .stylepress-menu-toggle:focus,
      .stylepress-menu-toggle:hover {
        background-color: transparent;
        border: 0;
        outline: 0;
      }

      @media (max-width: 768px) {
        .stylepress-inside-navigation {
          .main-nav > ul {
            > li {
              float: none;
              clear: both;
              display: block !important;
              text-align: left !important;
            }
          }
        }

        &.toggled {
          .stylepress-menu-toggle:before {
            content: "\f00d";
            speak: none;
          }
          .main-nav > ul {
            display: block;
          }
        }
      }

    }

    .stylepress-nav-icon-wrap {
      ul {
        margin: 0;
        padding: 0;
        list-style: none;
        li {
          display: inline-block;
          padding: 5px;
          margin: 0;
        }
      }
    }
  }
}

.stylepress_menu {

  ul {
    list-style: none;
    margin: 0;
    padding-left: 0;
    @media (max-width: 768px) {
      display: none;
    }
    li {
      display: inline-block;
      position: relative;
      a {
        padding-left: 20px;
        padding-right: 20px;
        line-height: 60px;
        display: block;
        box-shadow: none;
        text-decoration: none;
        font-family: inherit;
        &:hover {
        }
      }
      &.menu-item-has-children {
        > a {
          padding-right: 0;
          position: relative;
        }
        .dropdown-menu-toggle {
          padding-right: 20px;
          display: inline-block;
          height: 100%;
          clear: both;
          padding-left: 10px;
          &:before {
            content: "\f107";
            font-family: FontAwesome;
            line-height: 1em;
            speak: none;
          }
        }
      }
      &:hover {
        > a {
        }
        > ul {

          // animation start
          display: block;
          animation-name: dropdownanimate;
          animation-duration: .4s;
          opacity: 1;
          max-height: 2000px;
          // animation end
        }
      }

    }
    ul {
      top: auto;
      display: none;
      float: left;
      position: absolute;
      left: 0;
      z-index: 99999;
      width: 200px;
      text-align: left;

      visibility: hidden;

      // animation start
      box-shadow: 0 5px 5px 0 rgba(0, 0, 0, .03);
      animation-name: dropdownanimaterev;
      animation-duration: .4s;
      max-height: 0;
      // animation end

      li {
        width: 100%;
        a {
          font-size: 0.9em;
          padding: 10px 20px;
          line-height: normal;
        }
        &.menu-item-has-children {
          .dropdown-menu-toggle {
            padding-right: 15px;
            float: right;
            padding-top: 10px;
            padding-bottom: 10px;
            margin-top: -10px;
            &:before {
              content: "\f105" !important;
            }
          }
        }
      }
      ul {
        left: 100%;
        top: 0;
      }
    }
    li.stylepress_megamenu {
      position: initial !important;
      > ul {
        width: 100% !important;
        background: #333333;
        color: #FFF;
        a {
          color: #FFF;
        }
        > li {
          flex: 1;
          width: 33%;
          padding: 10px;
          border-right: 1px solid rgba(255, 255, 255, 0.08);
          > a {
            font-size: 1.3em;
          }
          > ul {
            animation-name: none;
            display: block !important;
            max-height: none;
            position: relative;
            width: auto;
            left: auto;
            top: auto;
            padding: 10px 0;
            box-shadow: none;
          }
        }
      }
      &:hover {
        > ul {
          display: flex !important;
        }
      }
    }
  }
  &:after {
    clear: both;
    display: table;
    content: '';
  }
}

.stylepress-nav-slideouts {
  position: absolute;
  visibility: hidden;
  left: 0;
  right: 0;
  z-index: 499;
  top: 78px;
  @media (max-width: 768px) {
    display: none;
  }

  .stylepress-nav-slideout {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    overflow: hidden;
    z-index: 1;
    box-shadow: 0 5px 5px 0 rgba(0, 0, 0, .03);
    animation-name: dropdownanimaterev;
    animation-duration: .4s;
    max-height: 0;
    &.visible {
      animation-name: dropdownanimate;
      animation-duration: .4s;
      opacity: 1;
      max-height: 2000px;
    }
  }
}

@media (min-width: 768px) {
  .stylepress-nav-menu-placeholder {
    display: block;
    body.dtbaker-elementor-template.elementor-editor-active & {
      display: none;
    }
  }

  .stylepress-nav-menu {
    .stylepress-nav-wrapper {
      width: 100%;
      display: flex;
      justify-content: space-between;
      max-width: 1140px;
      margin: 0 auto;
      > div {
        display: flex;
        align-items: center;
        margin: 0 auto;
      }
    }
  }

  .stylepress_menu {
    ul {
      li {
        &.stylepress_has_navslide {
          > ul {
            // don't display drop downs on desktop, show the navslider instead.
            display: none !important;
          }
        }
      }
    }
  }
}

.stylepress-navigation-loaded {
  .stylepress-nav-slideouts,
  .stylepress_menu ul ul {
    visibility: visible !important;
  }
  .stylepress-nav-menu.fixed {
    position: fixed;
    width: 100%;
    top: 0;
    body.dtbaker-elementor-template.elementor-editor-active & {
      top: auto !important;
      position: relative;
    }
  }
  &.admin-bar .stylepress-nav-menu.fixed {
    top: 32px;
  }
}