%pack {
  position: relative;

  &:before {
    width        : 10px;
    height       : 10px;

    border-radius: 50%;

    content      : '';

    position     : absolute;
    top          : 20px;
    left         : 20px;
    z-index      : 1;

    @include media-min(lg) {
      width : 20px;
      height: 20px;
    }

  }
}

[m-pack="basic"] {
  @extend %pack;

  &:before {
    background: $basic;
  }
}

[m-pack="premium"] {
  @extend %pack;

  &:before {
    background: $premium;
  }
}

[m-pack="tailor"] {
  @extend %pack;

  &:before {
    background: $tailor;
  }
}

[m-pack="single"] {
  @extend %pack;

  &:before {
    background: $single;
  }
}