/* Uncomment for dropdowns to the left */

/* .horizontal-menu > li ul ul {
  right: 13.75em;
  left: unset;
} 

  .horizontal-menu > li ul {
  right: 0;
  left: unset;
} */

.mm-panels, .mm-panel, .mm-navbar {
  background-color: var(--secondary-color);
}

.mm-listitem {
  line-height: inherit;
}

/* Change mobile menu title */

/* #mm-1 .mm-navbar__title::after {
  content: var(--menu-title);
}

#mm-1 .mm-navbar__title > span {
  display: none;
} */

.responsive-menu-block-wrapper, .block-responsive-menu, .horizontal-menu {
  height: 100%;
}

ul.menu a.is-active {
  color: inherit;
}

.horizontal-menu a {
    text-decoration: none;
    color: inherit;
}

.horizontal-menu .sub-nav {
    background: var(--dropdown-bg);
    color: var(--dropdown-color);
}

.horizontal-menu li.menu-item--expanded > a:after {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f105";
    margin-left: 0.5em;
}

.horizontal-menu > li.menu-item--expanded > a:after {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f078";
    margin-left: 0.5em;
}

.horizontal-menu > li > a {
  background-color: transparent;
  text-decoration: none;
  padding-top: 0.3rem;
  padding-right: 1rem;
  padding-bottom: 0.35rem;
  padding-left: 1rem;
  font-weight: bold;
}

.horizontal-menu > li {
  height: 100%;
  display: inline-flex;
  align-items: center;
}

.horizontal-menu > li:hover {
  background: var(--menu-hover-bg);
  color: var(--menu-hover-color);
}

.horizontal-menu > li.sfHover {
  background: transparent;
  color: var(--primary-color);
}

.horizontal-menu li li {
  list-style: none;
}

.responsive-menu-toggle-icon span.label {
  display: block;
  position: absolute;
  font-size: 17px;
  text-transform: uppercase;
  top: 2px;
  left: 40px;
  color: inherit;
}

.block-responsive-menu-toggle {
  display: inline-flex;
  align-items: center;
}

.responsive-menu-toggle-icon {
  height: 2rem;
  width: 2rem;
}

.responsive-menu-toggle-icon:before,
.responsive-menu-toggle-icon:after,
.responsive-menu-toggle-icon span.icon {
  background: var(--menu-toggler-color);
  content: '';
  display: block;
  width: 20px;
  height: 3px;
  position: absolute;
  top: 0;
  left: 13px;
  border-radius: 2px;
}

.responsive-menu-toggle-icon:before {
  top: 8px;
}

.responsive-menu-toggle-icon span.icon {
  top: 14px;
}

.responsive-menu-toggle-icon:after {
  top: 20px;
}

.responsive-menu-toggle-icon:before,
.responsive-menu-toggle-icon:after,
.responsive-menu-toggle-icon span.icon {
  transition: none 0.4s ease-out 0.1s;
  transition-property: -webkit-transform, top, bottom, left, opacity;
  transition-property: transform, top, bottom, left, opacity;
}

.mm-listitem:after {
  left: 0;
}

.mm-wrapper_opening .responsive-menu-toggle-icon:before,
.mm-wrapper_opening .responsive-menu-toggle-icon:after {
  top: 14px;
}

.mm-wrapper_opening .responsive-menu-toggle-icon span.icon {
  left: -25px;
  opacity: 0;
}

.mm-wrapper_opening .responsive-menu-toggle-icon:before {
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.mm-wrapper_opening .responsive-menu-toggle-icon:after {
  -webkit-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

#mm-blocker {
  background: rgba(0, 0, 0, 0);
}
.mm-wrapper_opening #mm-blocker {
  background: rgba(0, 0, 0, 0.2);
  transition: background 1s ease 0.3s;
}
.mm-wrapper_opening #page {
  border-left: 1px solid #CCC;
}

/* User Menu */

.menu--account .menu, .menu--tools .menu {
  display: grid;
  gap: 0.75rem;
  padding: 0.5rem 0;
}

.menu--account .menu-item--active-trail, .menu--tools .menu-item--active-trail {
  background: #444;
  color: #EEE;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

.menu--account .menu a, .menu--tools .menu a {
  display: block;
  color: #EEE;
  text-decoration: none;
  font-size: 0.875rem;
}

.menu--account .menu a:hover, .menu--tools .menu a:hover {
  color: #FFF;
  text-decoration: underline;
}

.user-menu .contextual, .nav-menu .contextual {
  display: none;
}

.menu--account .menu {
  margin-bottom: 0.5rem;
  padding: 0.5rem 1rem;
  background: var(--primary-color);
  display: inline-block;
}