@import '~styles/config';

.usageListItem {
  &__usagePack {
    padding: 0 10px 10px;
    max-width: 200px;

    @media (min-width: $min-tablet) {
      padding: 0 15px;
    }
  }

  &__usagePackTitle {
    font-size: 14px;

    text-decoration: none;
    font-family: $font-heading;
    font-weight: 500;

    transition: color 120ms ease-in;
    hyphens: auto;

    @media (min-width: $min-tablet) {
      @include responsive-font(12, 14);
    }
  }

  &__usagePackSubtitle {
    font-size: 17px;

    font-family: $font-heading;
    font-weight: 700;
    color: $color-dark;

    @media (min-width: $min-tablet) {
      @include responsive-font(15, 17);
      margin-top: 5px;
    }
  }
}