body {
  --custom-nav-font-family: SiemensSans, SiemensRoman, Helvetica Neue, Segoe UI, Oxygen, Ubuntu, Cantarell, Open Sans, sans-serif;
  --custom-scrollbar-width: 3px;
}

@media screen and (max-width: 1219px) {
  .md-tabbar-search-container .navigation-headline {
    display: none !important;
  }
}

.md-tabbar-search-container .navigation-headline {
  font-family: var(--custom-nav-font-family);
  font-weight: 600;
  font-size: 14px;
  position: absolute;
  top: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  padding-left: calc(16.2rem - 3.7rem);
}

@media screen and (max-width: 600px) {
  .md-tabbar-search-container__search .md-search {
    width: unset;
  }

  .md-tabbar-search-container__search #custom-hamburger-icon {
    position: relative;
    width: 44px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
  }

  .md-tabbar-search-container__search #custom-hamburger-icon:after {
    content: "\E907";
    font-family: "Siemens Web Icons";
    font-size: 24px;
    rotate: 180deg;
  }

  body.scrolled .md-tabbar-search-container__search #custom-hamburger-icon .custom-nav {
    top: 106px;
  }

  .md-tabbar-search-container__search #custom-hamburger-icon .custom-nav {
    position: fixed;
    top: 119px;
    left: 0;
    right: 0;
    display: none;
    bottom: var(--custom-sticky-banner-height);
    overflow-y: auto;
  }

  .md-tabbar-search-container__search #custom-hamburger-icon.selected .custom-nav {
    display: block;
  }

  .md-tabbar-search-container__search #custom-hamburger-icon.selected .custom-nav li {
    height: auto;
    width: 100%;
  }

  .md-tabbar-search-container__search #custom-hamburger-icon.selected .custom-nav li .item-text-wrapper {
    height: var(--custom-nav-sub-menu-item-height);
  }

  .md-tabbar-search-container__search #custom-hamburger-icon.selected .custom-nav li.expanded {
    flex-direction: column;
  }

  .md-tabbar-search-container__search #custom-hamburger-icon.selected .custom-nav li.expanded > .list-container {
    position: relative;
    display: block;
    width: 100%;
    top: auto;
    right: auto;
  }

  .md-tabbar-search-container__search #custom-hamburger-icon .custom-nav li.level-2 > .item-text-wrapper {
    padding-left: 2.2rem;
  }

  .md-tabbar-search-container__search #custom-hamburger-icon .custom-nav ul.level-0 {
    flex-direction: column;
    padding: 0;
  }

  .custom-nav li.has-submenu:not(.level-0) > .item-text-wrapper:before {
    content: "" !important;
  }

  .custom-nav li.has-submenu:not(.level-0) > .item-text-wrapper:after {
    font-family: "Siemens Web Icons";
    content: var(--md-icon-arrow-down);
    position: absolute;
    right: 5px;
    transition: rotate .25s;
  }
}

@media screen and (max-height: 995px) {
  .custom-nav .list-container.level-2 {
    right: calc(var(--custom-nav-item-width) + var(--custom-scrollbar-width));
  }

  /* custom scrollbar layout */
  .custom-nav ::-webkit-scrollbar {
    width: var(--custom-scrollbar-width);
  }

  /* Track */
  .custom-nav ::-webkit-scrollbar-track {
    background: #f1f1f1;
  }

  /* Handle */
  .custom-nav ::-webkit-scrollbar-thumb {
    background: #888;
  }

  /* Handle on hover */
  .custom-nav ::-webkit-scrollbar-thumb:hover {
    background: #555;
  }
  /* scrollbar end */
}

.custom-nav {
  --custom-nav-bg-color: #EBEBEF;
  --custom-nav-bg-color-active: #d9d9df;
  --custom-nav-font-color: #000000;
  --custom-nav-sub-menu-font-color: #000000;
  --custom-nav-sub-menu-bg-color: #ffffff;
  --custom-nav-item-width: 200px;
  --custom-nav-height: 60px;
  --custom-nav-sub-menu-item-height: 53px;
  --custom-nav-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2);

  font-size: 14px;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  font-family: var(--custom-nav-font-family);
}

.custom-nav .list-container {
  position: absolute;
  top: 0;
  right: 0;
}

.custom-nav .list-container.level-0 {
  position: relative;
}

.custom-nav .list-container.level-1 {
  top: var(--custom-nav-height);
}

.custom-nav li.level-0.expanded > .item-text-wrapper:before,
.md-header__option .md-select .md-select__inner:after {
  content: "";
  background: #ffffff;
  height: 12px;
  width: 12px;
  position: absolute;
  transform: translateX(-50%) rotate(45deg);
  z-index: 0;
}

.md-header__option .md-select .md-select__inner:after {
  top: -6px;
  right: 30px;
}

.custom-nav li.level-0.expanded > .item-text-wrapper:before {
  bottom: -8px;
  right: 0;
  left: 0;
  margin: auto;
}

.custom-nav .list-container.level-2 {
  right: var(--custom-nav-item-width);
}

.custom-nav ul:not(.level-0) {
  list-style: none;
  margin: 0;
  padding: 0;
  background-color: var(--custom-nav-sub-menu-bg-color);
  box-shadow: var(--custom-nav-box-shadow);
  max-height: calc(100vh - 200px);
  overflow-y: auto;
}

.custom-nav li {
  background-color: transparent;
  margin: 0;
  width: var(--custom-nav-item-width);
  display: flex;
  align-items: center;
  cursor: pointer;
  color: var(--custom-nav-sub-menu-font-color);
  font-weight: 400;
  z-index: 1;
}

.custom-nav li .item-text-wrapper {
  height: var(--custom-nav-sub-menu-item-height);
  position: relative;
}

.custom-nav li.has-submenu:not(.level-0) > .item-text-wrapper:before,
.custom-nav li.level-0.has-submenu > .item-text-wrapper:after {
  font-family: "Siemens Web Icons";
  content: "\E901";
  position: absolute;
  left: 5px;
  transition: rotate .25s;
}

.custom-nav li.level-0.has-submenu > .item-text-wrapper:after {
  right: 5px;
  left: unset;
}

.custom-nav li.has-submenu.expanded > .item-text-wrapper:after {
  rotate: 180deg;
}

.custom-nav li.level-1.has-submenu > .item-text-wrapper:before {
  rotate: 90deg;
}

.custom-nav li.level-1.has-submenu.expanded > .item-text-wrapper:before {
  rotate: 270deg;
}

.custom-nav li:hover,
.custom-nav li.selected,
.custom-nav li:active,
.custom-nav li.active {
  background-color: var(--custom-nav-bg-color-active);
}

.custom-nav li .item-text-wrapper {
  width: 100%;
  padding: 0.4rem 1.2rem;
  display: flex;
  align-items: center;
}

.custom-nav li .item-text-wrapper:focus {
  background-color: var(--custom-nav-bg-color-active);
}

.custom-nav li a.item-text-wrapper[target="_blank"]:after {
  font-family: 'Siemens Web Icons';
  content: '\E91D';
  display: flex;
  align-items: center;
  position: absolute;
  right: 10px;
}

.custom-nav ul.level-0 li.level-0 {
  height: var(--custom-nav-height);
  font-weight: 600;
  color: var(--custom-nav-font-color);
  width: auto;
}

.custom-nav ul.level-0 li.level-0 > .item-text-wrapper {
  padding: 0.2rem 1.2rem 0.2rem 0.6rem;
}

.custom-nav ul.level-0 li.level-0:active, .custom-nav ul.level-0 li.level-0.selected {
  background-color: inherit;
}

.custom-nav > .list-container.expanded > ul {
  display: block;
}

.custom-nav > .list-container > ul.level-0 {
  background-color: var(--custom-nav-bg-color);
  display: flex !important;
  box-shadow: none;
  margin: 0;
}

.custom-nav li.collapsed > .list-container {
  display: none;
}
