.container {
  font-family: SBSansInterface-Regular;
}

.label {
  display: flex;
  align-items: center;
  height: 100%;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 0 20px;
  font-size: 1.041666vw;
  position: relative;
  @media screen and (max-width: 1100px) {
    font-size: 12px;
  }
  @media screen and (min-width: 1680px) {
    font-size: 18px;
  }

  &_active {
    background-color: #ffffff;
  }
  &__text {
    margin-left: 16.6px;
    color: #000000;
    opacity: 0.8;

    &_active {
      font-family: SBSansInterface-Bold;
      color: #000000;
    }
  }
}

.subListItem {
  min-height: 20px;
  height: 3vh;
  align-self: flex-end;
  min-width: calc(35 * var(--xxs-px));
  width: calc(35 * var(--xxs-vw));
  margin-top: .5vw;
  display: flex;
  border-radius: 25px;
  color: var(--main-text-color);
  &:hover {
    background-color: rgba(169, 169, 169, 0.13);
    color: var(--main-text-color);
  }
  &_active {
    background-color: rgba(169, 169, 169, 0.41);
    &:hover {
      background-color: rgba(153, 153, 153, 0.41);
    }
  }
  transition: background-color .5s;
}

@keyframes menu-ease-in {
  0% {
    display: block;
    margin-left: -500px;
    width: 10vw;
  }
  89% {
    width: 10vw;
  }
  100% {
    margin-left: 0;
  }
}