/* News Teaser Compact: 4 News nebeneinander, kompaktere Kacheln (ca. halbe Hoehe des News Teasers).
   Gilt nur fuer das Element "News Teaser Compact" (Klasse .news-teaser-compact).
   Abstaende des Originals: 30px (Kachel-Rand, Text), 60px (Bild seitlich), Bild in voller Breite. */

.news-teaser.news-teaser-compact {
  padding-bottom: 45px;
}

.news-teaser.news-teaser-compact h3 {
  padding-top: 30px;
}

@media screen and (min-width: 901px) {
  .news-teaser.news-teaser-compact .article-wrap {
    grid-template-columns: 50% 50%;
  }
}

@media screen and (min-width: 1401px) {
  .news-teaser.news-teaser-compact .article-wrap {
    grid-template-columns: 25% 25% 25% 25%;
  }
}

.news-teaser.news-teaser-compact .article-wrap .article,
.news-teaser.news-teaser-compact .article-wrap .article:is(:first-child, :nth-child(2), :last-child) {
  grid-column: auto;
  justify-self: stretch;
  width: auto;
  margin: 15px;
}

/* Bild: wird immer komplett und unverzerrt gezeigt, nur verkleinert (maximale Hoehe statt Breite 100%) */
.news-teaser.news-teaser-compact .article-wrap .article .thumbnail {
  padding: 10px 15px 0;
}

.news-teaser.news-teaser-compact .article-wrap .article .thumbnail .media {
  display: flex;
  justify-content: center;
}

.news-teaser.news-teaser-compact .article-wrap .article .thumbnail .media img {
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 286px;
  object-fit: contain;
}

@media screen and (min-width: 901px) {
  .news-teaser.news-teaser-compact .article-wrap .article .thumbnail .media img {
    max-height: 234px;
  }
}

.news-teaser.news-teaser-compact .article-wrap .article .information {
  padding: 0 30px 6px 10px;
}

/* Text (Datum, Ueberschrift, Auszug) eng zusammengerueckt, damit mehr Platz fuer das Bild bleibt */
.news-teaser.news-teaser-compact .article-wrap .article .information .text {
  padding: 6px 10px;
}

.news-teaser.news-teaser-compact .article-wrap .article .information .text h5,
.news-teaser.news-teaser-compact .article-wrap .article .information .text h4 {
  margin: 0;
}

.news-teaser.news-teaser-compact .article-wrap .article .information .text h4 {
  font-size: 20px;
  line-height: 1.2;
  margin-top: 2px;
}

/* Ueberschrift: max. 2 Zeilen */
.news-teaser.news-teaser-compact .article-wrap .article .information .text h4 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Textauszug (unterste Textzeile) ausgeblenden */
.news-teaser.news-teaser-compact .article-wrap .article .information .text p,
.news-teaser.news-teaser-compact .article-wrap .article .information .text p:first-of-type {
  display: none;
}

.news-teaser.news-teaser-compact .article-wrap .article .icon {
  bottom: 10px;
}