.#{$prefix}menu {
  display: flex;
  border: 1px solid $border-color;
  background: $menu-color;
  flex-flow: row wrap;

  &-title {
    font-size: 14px;
    line-height: 16px;
    font-weight: normal;
    margin: 8px 0 8px 8px;
  }

  &-often,
  &-high {
    width: 100%;
    display: flex;
    flex-flow: row wrap;
  }

  &-link {
    display: flex;
    margin: 8px;

    & g {
      transition: fill 0.5s;
    }

    &:hover g {
      fill: $blue;
    }

    &-disable {
      cursor: no-drop;

      & g,
      &:hover g {
        fill: $disable;
      }
    }

    &-active g,
    &-active:hover g,
    &:active g {
      fill: $blue;
    }

    &-font {
      text-decoration: none;
    }

    &-righttop {
      position: absolute;
      right: 0;
      top: 0;
    }
  }

  &-area {
    display: flex;
    border-right: 1px solid $border-color;
    margin: 8px 0;

    &:last-child {
      border-right: none;
    }
  }
}