Training List Teaser

$list-teaser-training-height: ms(32);

.list-teaser-training {
  @extend %list-teaser;

  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: $list-teaser-training-height;

  &.primary {
    background-color: $list-teaser-training-bg-color-primary;
    background-image: asset-url('bg-images/general/visual-trainings-07.webp');
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
    background-blend-mode: multiply;
  }

  &.secondary {
    background-color: $list-teaser-training-bg-color-secondary;
    background-image: asset-url('bg-images/general/visual-trainings-07.webp');
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
    background-blend-mode: multiply;
  }

  .list-teaser__footer {
    padding-bottom: $spacer-sm;
  }
}

a.list-teaser-training {
  @extend %hover-glow;
}

.list-teaser-training__caption {
  @extend %teaser-caption;

  margin-bottom: $spacer-base;
  color: $list-teaser-training-text-color-primary;
}

.list-teaser-training__headline {
  margin-bottom: $spacer-md;
  font-size: $font-size-lg;
  color: $list-teaser-training-text-color-primary;
}

//
//Breakpoints
//
@media screen and (min-width: $grid-breakpoint-md) {
  .list-teaser-training__headline {
    margin-bottom: $spacer-sm;
    font-size: $font-size-xxl;
  }
}