Teaser Grid

TIP

Combination of teasers in a 2x2 grid.

.c-teaser-grid > .c-teaser-grid__row

Example

Studenten

1. Stex2. Stex

PhiP

MediCheckLabXpert3. Stex

PTA

MediCheckLabXpert

Apotheker

MediCheckLabXpert

<div class="c-teaser-grid">
  <div class="c-teaser-grid__row">
    <div class="c-teaser -home -student m-r-s">
      <a href="/studenten/" class="c-teaser__link -student c-link -icon-right -icon-arrow">
        <span class="c-teaser__link__text">Studenten</span>
      </a>
      <a href="/studenten/" class="h-clickable-area"></a>
      <div class="h-flex h-flex-row">
        <a href="/kommentar/" class="c-pill">1. Stex</a>
        <a href="/trainer-web/" class="c-pill">2. Stex</a>
      </div>
    </div>
    <div class="c-teaser -home -phip">
      <a href="/praktikanten/" class="c-teaser__link -phip c-link -icon-right -icon-arrow">
        <span class="c-teaser__link__text">PhiP</span>
      </a>
      <a href="/praktikanten/" class="h-clickable-area"></a>
      <div class="h-flex h-flex-row">
        <a href="/medicheck/" class="c-pill">MediCheck</a>
        <a href="/apotheker/labor-plus/intro/" class="c-pill">LabXpert</a>
        <a href="/trainer-3stex-web/" class="c-pill">3. Stex</a>
      </div>
    </div>
  </div>
  <div class="c-teaser-grid__row">
    <div class="c-teaser -home -pta m-r-s">
      <a href="/pta/" class="c-teaser__link -pta c-link -icon-right -icon-arrow">
        <span class="c-teaser__link__text">PTA</span>
      </a>
      <a href="/pta/" class="h-clickable-area"></a>
      <div class="h-flex h-flex-row">
        <a href="/medicheck/" class="c-pill">MediCheck</a>
        <a href="/apotheker/labor-plus/intro/" class="c-pill">LabXpert</a>
      </div>
    </div>
    <div class="c-teaser -home -apothecary">
      <a href="/apotheker/" class="c-teaser__link -apothecary c-link -icon-right -icon-arrow">
        <span class="c-teaser__link__text">Apotheker</span>
      </a>
      <a href="/apotheker/" class="h-clickable-area"></a>
      <div class="h-flex h-flex-row">
        <a href="/medicheck/" class="c-pill">MediCheck</a>
        <a href="/apotheker/labor-plus/intro/" class="c-pill">LabXpert</a>
      </div>
    </div>
  </div>
</div>