body #shiftnav-toggle-main {
  position: fixed !important;
  top: var(--nav-icon-padding-Y) !important;
  left: var(--nav-icon-padding-X) !important;
  z-index: 9999999;
  width: var(--nav-icon-width) !important;
  height: var(--nav-icon-height) !important;
  padding: 0 !important;
  display: flex;
  justify-content: center;
  border-radius: 100% !important;
}

body #shiftnav-toggle-main:has(~ .shiftnav.shiftnav-open-target) {
  background: white !important;
}
body #shiftnav-toggle-main:has(~ .shiftnav.shiftnav-open-target) .fa-bars {
  color: var(--color-gruen);
}

#shiftnav-toggle-main .shiftnav-main-toggle-content {
  display: none;
}

#shiftnav-toggle-main .shiftnav-toggle-burger {
  margin: 0 !important;
  padding: 0 !important;
}

.shiftnav-open.shiftnav-open-right #shiftnav-toggle-main {
  transform: translateX(0) !important;
}

.shiftnav {
  transition: all 0.5s ease-in-out !important;
  height: 100vh !important;
  padding-bottom: 0 !important;
  padding-top: 0 !important;
}

.shiftnav.shiftnav-open-target {
  top: 0 !important;
  width: 100vw;
}

.shiftnav .shiftnav-inner {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: var(--color-gruen) !important;
  padding-top: 0 !important;
}

.shiftnav .shiftnav-inner::before {
  content: "";
  display: block;
  --my-size: clamp(148px, 18vw, 300px);
  width: var(--my-size);
  height: calc(var(--my-size) * 1.1);
  bottom: 5%;
  right: 5%;
  background-image: url(../img/navigation-bg.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: bottom right;
  position: absolute;
}

.shiftnav .shiftnav-nav #menu-hauptmenue .menu-item a,
.shiftnav
  .shiftnav-nav
  #menu-hauptmenue
  .menu-item.shiftnav-sub-accordion
  .shiftnav-target {
  text-align: center;
  color: var(--color-anthrazit);
  transition: all 0.5s ease-in-out;
  line-height: 2.43;
  font-family: var(--headlinefont);
  font-size: 2.333rem !important;
  font-style: normal;
  font-weight: 400 !important;
}

.shiftnav .shiftnav-nav #menu-hauptmenue .menu-item.current_page_item > a,
.shiftnav
  .shiftnav-nav
  #menu-hauptmenue
  .sub-menu
  .menu-item.current_page_item
  > a {
  color: var(--color-weiss);
}

.shiftnav .shiftnav-nav .shiftnav-submenu-activation {
  display: none !important;
}

.shiftnav .shiftnav-nav #menu-hauptmenue .menu-item a:hover,
.shiftnav
  .shiftnav-nav
  #menu-hauptmenue
  .menu-item.shiftnav-sub-accordion
  .shiftnav-target:hover {
  background-color: transparent !important;
}
.shiftnav .shiftnav-nav #menu-hauptmenue .menu-item a:hover {
  background-color: transparent !important;
}

.shiftnav
  .shiftnav-nav
  #menu-hauptmenue
  .menu-item.shiftnav-sub-accordion
  > .shiftnav-target:hover,
.shiftnav .menu-item.shiftnav-active > .shiftnav-target {
  border-radius: var(--border-radius-10);
  background-color: var(--color-anthrazit) !important;
  color: var(--color-weiss) !important;
}

.shiftnav .shiftnav-sr-close {
  display: none !important;
}

.shiftnav-sub-active {
  background: transparent !important;
}

ul.sub-menu {
  transform: translateY(-100%);
  transition: all 0.5s ease-in-out;
}

ul.sub-menu.shiftnav-sub-active {
  transform: translateY(0);
}

ul.sub-menu a.shiftnav-target {
  padding: 0 !important;
}

#shiftnav-toggle-main-button {
  width: 100%;
}

#shiftnav-toggle-main-button::before {
  content: "";
  background-image: url(../img/burger-icon.svg);
  display: inline-block;
  background-repeat: no-repeat;
  width: 41.25%;
  height: 100%;
  background-position: center;
  transition: all 0.5s ease-in-out;
}

body.shiftnav-open #shiftnav-toggle-main-button::before {
  background-image: url(../img/close-icon.svg);
  background-size: contain;
}

.fa-bars::before {
  display: none;
}

/* reponsive */

@media (max-width: 576px) {
  .shiftnav-nav {
    margin-left: 20px !important;
  }

  #shiftnav-toggle-main-button {
    justify-content: center;
    align-items: center;
    display: flex;
  }

  #shiftnav-toggle-main-button::before {
    background-image: url(../img/burger-icon-mobile.svg);
    background-size: contain;
  }

  .shiftnav.shiftnav-shiftnav-main {
    max-width: unset !important;
  }

  .shiftnav .shiftnav-inner {
    justify-content: left;
  }

  .shiftnav .shiftnav-nav #menu-hauptmenue .menu-item a,
  .shiftnav
    .shiftnav-nav
    #menu-hauptmenue
    .menu-item.shiftnav-sub-accordion
    .shiftnav-target {
    text-align: left;
    font-size: 22px !important;
  }

  .shiftnav .shiftnav-inner::before {
    right: -3%;
  }
}

/* ---------------------------------- NAVIGATION ALTE STYLES ---------------------------*/

#shiftnav-toggle-main,
#shiftnav-toggle-main.large {
  background: #88bc2f !important;
  color: #fff !important;
  width: 230px !important;
  font-size: 40px !important;
  top: 30px !important;
  padding-top: 0px !important;
  padding-left: 0 !important;
  position: absolute !important;
  right: 35px !important;
  height: 90px !important;
  border-radius: 0 !important;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

#shiftnav-toggle-main.small {
  position: fixed !important;
  height: 80px !important;
  font-size: 20px !important;
  padding-top: 15px !important;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

.navbar {
  display: none !important;
}

.shiftnav .shiftnav-menu-title {
  display: none !important;
}

.shiftnav-inner {
  background: #ebeae9 !important;
  padding-top: 100px !important;
}

#shiftnav-toggle-main .shiftnav-main-toggle-content {
  padding: 20px 80px 20px 30px !important;
}

.ubermenu-bound .ubermenu-submenu-type-mega {
  min-width: 100% !important;
  background: #fff !important;
  padding: 10px 0 !important;
}

.ubermenu-main .ubermenu-item-level-0 > .ubermenu-target:hover {
  background: #88bc2f !important;
}

.ubermenu-main
  .ubermenu-item-level-0.ubermenu-current-menu-item
  > .ubermenu-target,
.ubermenu-main
  .ubermenu-item-level-0.ubermenu-current-menu-parent
  > .ubermenu-target,
.ubermenu-main
  .ubermenu-item-level-0.ubermenu-current-menu-ancestor
  > .ubermenu-target {
  color: #a48b7c;
  background: none !important;
}

.ubermenu-sub-indicators .ubermenu-has-submenu-drop > .ubermenu-target:after {
  opacity: 0.3;
  font-size: 13px !important;
  right: 30px !important;
  margin-top: -2px !important;
}

.shiftnav .shiftnav-submenu-activation i.fa {
  color: #9d7f7b !important;
  opacity: 0.35 !important;
}

.shiftnav .shiftnav-menu li .shiftnav-target {
  color: #725830;
  display: block !important;
  font-size: 23px !important;
  cursor: pointer !important;
  font-weight: 500 !important;
  line-height: 150% !important;
  text-transform: none !important;
  text-shadow: none !important;
}
.shiftnav .shiftnav-menu li .shiftnav-target:hover {
  background: #a48b7c !important;
  color: #fff !important;
}

.shiftnav .shiftnav-menu .sub-menu li .shiftnav-target:hover {
  background: #a48b7c !important;
  color: #fff !important;
}

.shiftnav
  ul.shiftnav-menu
  > li.shiftnav-sub-accordion.current-menu-ancestor
  .shiftnav-submenu-activation
  i.fa {
  color: #fff !important;
}

.shiftnav
  ul.shiftnav-menu
  > li.shiftnav-sub-accordion.current-menu-ancestor
  > .shiftnav-target,
.shiftnav
  ul.shiftnav-menu
  > li.shiftnav-sub-shift.current-menu-ancestor
  > .shiftnav-target {
  color: #fff !important;
}

.shiftnav li.menu-item .shiftnav-submenu-activation {
  right: 20px !important;
}

.shiftnav li.menu-item.shiftnav-sub-accordion.shiftnav-active > ul.sub-menu {
  padding: 10px 0 !important;
}

.shiftnav:after {
  display: none !important;
}