@charset "UTF-8";

.su-card--icon {
  &,
  &-font {
    @include responsive-spacing('padding', 2 null null);
    text-align: center;

    .su-card__contents {
      @include responsive-spacing('padding', 0 null null);
    }

    &.su-card--minimal {
      @include padding(0 null null);
    }

    &.su-card--horizontal {
      text-align: left;

      @include grid-media-only("xs") {
        > img {
          display: none;
        }
      }

      @include grid-media-min("sm") {
        grid-template-columns: 10rem 1fr;
      }

      .su-card__contents {
        @include padding(0 null null);
      }
    }
  }

  img {
    @include margin(null auto);
    max-width: 10rem;

    @include grid-media-only("xs") {
      display: block;
    }
  }

  &-font {
    > span {
      display: block;
      font-size: 5em;
      text-align: center;
    }

    &.su-card--horizontal {
      @include grid-media-only("xs") {
        > span {
          font-size: 3em;
          text-align: left;
        }
      }

    }
  }
}
