.gridless-container {
  padding-right: 1.5em;
  padding-left: 1.5em;
  position: relative;

  @media (min-width: $bp-large) {
    padding-right: 4em;
    padding-left: 4em;
  }
}

.gridless-browse-cards {
  .card {
    box-shadow: 0 1px 10px 0 rgb(0 0 0 / 25%);
  }

  &.card-deck-4-cols {
    @media (min-width: $bp-xxxl) {
      margin-left: -1em;
      margin-right: -1em;
    }

    .card {
      @media (min-width: $bp-large) {
        flex: 0 0 calc(100% / 3 - #{$grid-gutter * 2});
      }

      @media (min-width: $bp-extralarge) {
        flex: 0 0 calc(100% / 4 - #{$grid-gutter * 2});
      }

      @media (min-width: $bp-xxxl) {
        flex: 0 0 calc(100% / 4 - #{1em * 2});
        margin: 0 1em 2em;
      }
    }
  }

  &.card-deck-3-cols .card {
    @media (min-width: $bp-xxxl) {
      flex: 0 0 calc(100% / 3 - #{1em * 2});
      margin: 0 1em 2em;
    }
  }

  .content-card {
    min-height: 0;

    .card-title {
      display: block;
      -webkit-line-clamp: none;
    }

    @media (min-width: $bp-xxxl) {
      .card-img {
        min-height: 20em;
        max-height: 20em;
      }
    }
  }
}
