body {
  .filter {
    position: relative;

    height: min-content;
    min-width: calculateRem(200);

    margin-right: calculateRem(30);

    border: 1px solid $mid-gray;

    padding-right: calculateRem(20);
    padding-left: calculateRem(20);

    background-color: $light;

    color: $mid-gray;

    @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
      height: calculateRem(30);
    }

    a.dropdown-toggle {
      display: flex;
      flex-flow: row nowrap;
      justify-content: space-between;
      align-items: center;

      color: inherit;

      .name {
        margin-right: calculateRem(15);
      }
    }
    ul.dropdown {
      position: absolute;
      top: 100%;
      left: 0;

      display: block;

      width: 100%;

      margin-top: 0;
      margin-right: 0;
      margin-bottom: 0;
      margin-left: 0;

      z-index: 13;

      border: 1px solid $mid-gray;

      padding: 0;

      background-color: $light;

      list-style-type: none;

      li {
        width: 100%;
        padding-top: calculateRem(5);
        padding-right: calculateRem(10);
        padding-bottom: calculateRem(5);
        padding-left: calculateRem(10);
        list-style: none;
      }
    }
  }
}
