<section class="list">
  <div class="list__inner">
    <div class="list__headline">
      <h1 class="headline headline--1">Suche</h1>
    </div>
    <div class="list__form-search">
      <form class="form-search">
        <div class="form-group form-search__form-group"><label class="label u-hidden-visually form-group__label" for="form-group-ca9f">Label</label>
          <div class="form-group__input"><input class="input" id="form-group-ca9f" type="search" /></div>
        </div><button class="button button--primary form-search__button" type="submit"><svg class="icon icon--search button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-4989-title">
            <title id="icon-4989-title">Suchen</title>
            <use xlink:href="#icon-search"></use>
          </svg></button><button class="button button--primary form-search__reset" type="reset"><svg class="icon icon--close button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-5e24-title">
            <title id="icon-5e24-title">Close</title>
            <use xlink:href="#icon-close"></use>
          </svg></button>
      </form>
    </div>
    <div class="list__results">
      <div class="list__results-text">52 Ergebnisse gefunden</div>
      <div class="list__results-sort">
        <div class="sort">
          <div class="sort__dropdown">
            <div class="sort__text">Sortierung nach:
              <span class="sort__active">Relevanz</span></div><button class="sort__button" type="button" aria-expanded="false" aria-controls="sort-b62c-content"><svg class="icon icon--dropdown sort__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-9a6a-title">
                <title id="icon-9a6a-title">Sortierung auswählen</title>
                <use xlink:href="#icon-dropdown"></use>
              </svg></button>
          </div>
          <ul class="sort__list" id="sort-b62c-content">
            <li class="sort__item sort__item--active" aria-current="page">Relevanz<span class="sort__item-label u-hidden-visually">&nbsp;(Ausgewählter Filter)</span></li>
            <li class="sort__item"><a class="sort__link" href="#">Alphabetisch (aufsteigend)</a></li>
            <li class="sort__item"><a class="sort__link" href="#">Alphabetisch (absteigend)</a></li>
            <li class="sort__item"><a class="sort__link" href="#">Filterkriteriumslängengegenstand</a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="list__tab-bar">
      <div class="tab-bar tab-bar--list tab-bar--uninitalized tab-bar--simple">
        <div class="tab-bar__select-wrap"><button class="tab-bar__select" aria-haspopup="true" aria-expanded="false"><span class="u-hidden-visually">Inhalt auswählen</span><span class="tab-bar__select-current" aria-hidden="true">Alle (486)</span><svg class="icon icon--dropdown tab-bar__select-icon" viewBox="0 0 200 200">
              <use xlink:href="#icon-dropdown"></use>
            </svg></button></div>
        <ul class="tab-bar__items" role="tablist">
          <li class="tab-bar__item-wrap" role="presentation"><a class="tab-bar__item tab-bar__item--active" aria-selected="true" id="tab-bar-8556-tab-0" role="tab" href="alle.html">Alle (486)</a></li>
          <li class="tab-bar__item-wrap" role="presentation"><a class="tab-bar__item" id="tab-bar-8556-tab-1" role="tab" href="aktuelles.html">Aktuelles (26)</a></li>
          <li class="tab-bar__item-wrap" role="presentation"><a class="tab-bar__item" id="tab-bar-8556-tab-2" role="tab" href="programme.html">Programme (58)</a></li>
          <li class="tab-bar__item-wrap" role="presentation"><a class="tab-bar__item" id="tab-bar-8556-tab-3" role="tab" href="ausschreibungen.html">Ausschreibungen (12)</a></li>
          <li class="tab-bar__item-wrap" role="presentation"><a class="tab-bar__item" id="tab-bar-8556-tab-4" role="tab" href="downloads.html">Downloads (195)</a></li>
          <li class="tab-bar__item-wrap" role="presentation"><a class="tab-bar__item" id="tab-bar-8556-tab-5" role="tab" href="sonstige.html">Sonstige (195)</a></li>
        </ul>
      </div>
    </div>
    <div class="list__list">
      <div class="list__list-item">
        <article class="list-item">
          <div class="list-item__inner">
            <div class="list-item__image">
              <div class="image loading" style="padding-top: 66.66666666666666%;"><noscript><img class="image__fallback" alt="Teaser Thumb" height="140" src="https://bildermangel.de/210x140/F5F5F5/28281a.png?text=210x140" width="210" /></noscript><img class="image__img js-lazyload" data-src="https://bildermangel.de/210x140/F5F5F5/28281a.png?text=210x140" width="210" height="140" alt="Teaser Thumb" /></div>
            </div>
            <div class="list-item__content">
              <div class="list-item__content-inner">
                <div class="list-item__kicker">Video</div><a class="list-item__headline js-overlay-link" href="#" data-overlay-target="list-item__content-inner">
                  <h2 class="headline headline--5 list-item__headline-text">Das ist eine Headline expedition d und experience</h2>
                </a>
                <div class="list-item__meta"><svg class="icon icon--play" viewBox="0 0 200 200">
                    <use xlink:href="#icon-play"></use>
                  </svg>
                  <div class="text">
                    <p>3:23 Min</p>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </article>
      </div>
      <div class="list__list-item">
        <article class="list-item">
          <div class="list-item__inner">
            <div class="list-item__image">
              <div class="image loading" style="padding-top: 66.66666666666666%;"><noscript><img class="image__fallback" alt="Teaser Thumb" height="140" src="https://bildermangel.de/210x140/F5F5F5/28281a.png?text=210x140" width="210" /></noscript><img class="image__img js-lazyload" data-src="https://bildermangel.de/210x140/F5F5F5/28281a.png?text=210x140" width="210" height="140" alt="Teaser Thumb" /></div>
            </div>
            <div class="list-item__content">
              <div class="list-item__content-inner">
                <div class="list-item__kicker">Bildergalerie</div><a class="list-item__headline js-overlay-link" href="#" data-overlay-target="list-item__content-inner">
                  <h2 class="headline headline--5 list-item__headline-text">Das ist eine Headline expedition d und experience</h2>
                </a>
                <div class="list-item__meta"><svg class="icon icon--gallery" viewBox="0 0 200 200">
                    <use xlink:href="#icon-gallery"></use>
                  </svg>
                  <div class="text">
                    <p>10 Bilder</p>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </article>
      </div>
      <div class="list__list-item">
        <article class="list-item">
          <div class="list-item__inner">
            <div class="list-item__image">
              <div class="image loading" style="padding-top: 66.66666666666666%;"><noscript><img class="image__fallback" alt="Teaser Thumb" height="140" src="https://bildermangel.de/210x140/F5F5F5/28281a.png?text=210x140" width="210" /></noscript><img class="image__img js-lazyload" data-src="https://bildermangel.de/210x140/F5F5F5/28281a.png?text=210x140" width="210" height="140" alt="Teaser Thumb" /></div>
            </div>
            <div class="list-item__content">
              <div class="list-item__content-inner">
                <div class="list-item__kicker">News</div><a class="list-item__headline js-overlay-link" href="#" data-overlay-target="list-item__content-inner">
                  <h2 class="headline headline--5 list-item__headline-text">Das ist eine Headline expedition d und experience</h2>
                </a>
                <div class="list-item__text">
                  <div class="text">
                    <p>Teasertext zum Buch ipsum dolor sit amet, consetetur sadipscing elitr, sed dim nonumy eirmod tempor invidunt</p>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </article>
      </div>
      <div class="list__list-item">
        <article class="list-item">
          <div class="list-item__inner">
            <div class="list-item__content">
              <div class="list-item__content-inner">
                <div class="list-item__kicker">News</div><a class="list-item__headline js-overlay-link" href="#" data-overlay-target="list-item__content-inner">
                  <h2 class="headline headline--5 list-item__headline-text">Das ist eine Headline expedition d und experience</h2>
                </a>
                <div class="list-item__text">
                  <div class="text">
                    <p>Teasertext zum Buch ipsum dolor sit amet, consetetur sadipscing elitr, sed dim nonumy eirmod tempor invidunt</p>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </article>
      </div>
      <div class="list__list-item">
        <article class="list-item list-item--publication">
          <div class="list-item__inner">
            <div class="list-item__content">
              <div class="list-item__content-inner">
                <div class="list-item__kicker">Pressematerial</div><a class="list-item__headline js-overlay-link" href="#" data-overlay-target="list-item__content-inner">
                  <h2 class="headline headline--5 list-item__headline-text">Das ist eine Headline expedition d und experience</h2>
                </a>
              </div>
              <ul class="list-item__links">
                <li class="list-item__link"><a class="icon-link" href="download.pdf" target="_blank" download="download.pdf"><span class="icon-link__icon"><svg class="icon icon--download" viewBox="0 0 200 200">
  <use xlink:href="#icon-download"></use>
</svg></span><span class="icon-link__text">Downloaden <span class="f-small">(PDF, 0.8 MB)</span></span></a></li>
                <li class="list-item__link"><a class="icon-link" href="#"><span class="icon-link__icon"><svg class="icon icon--basket" viewBox="0 0 200 200">
  <use xlink:href="#icon-basket"></use>
</svg></span><span class="icon-link__text">Bestellen</span></a></li>
              </ul>
            </div>
          </div>
        </article>
      </div>
      <div class="list__list-item">
        <article class="list-item list-item--publication">
          <div class="list-item__inner">
            <div class="list-item__image">
              <div class="image loading" style="padding-top: 140%;"><noscript><img class="image__fallback" alt="Teaser Thumb" height="140" src="https://bildermangel.de/100x140/F5F5F5/28281a.png?text=100x140" width="100" /></noscript><img class="image__img js-lazyload" data-src="https://bildermangel.de/100x140/F5F5F5/28281a.png?text=100x140" width="100" height="140" alt="Teaser Thumb" /></div>
            </div>
            <div class="list-item__content">
              <div class="list-item__content-inner">
                <div class="list-item__kicker">Publikation</div><a class="list-item__headline js-overlay-link" href="#" data-overlay-target="list-item__content-inner">
                  <h2 class="headline headline--5 list-item__headline-text">Das ist eine Headline expedition d und experience</h2>
                </a>
                <div class="list-item__text">
                  <div class="text">
                    <p>Teasertext zum Buch ipsum dolor sit amet, consetetur sadipscing elitr, sed dim nonumy eirmod tempor invidunt</p>
                  </div>
                </div>
              </div>
              <ul class="list-item__links">
                <li class="list-item__link"><a class="icon-link" href="download.pdf" target="_blank" download="download.pdf"><span class="icon-link__icon"><svg class="icon icon--download" viewBox="0 0 200 200">
  <use xlink:href="#icon-download"></use>
</svg></span><span class="icon-link__text">Downloaden <span class="f-small">(PDF, 0.8 MB)</span></span></a></li>
                <li class="list-item__link"><a class="icon-link" href="#"><span class="icon-link__icon"><svg class="icon icon--basket" viewBox="0 0 200 200">
  <use xlink:href="#icon-basket"></use>
</svg></span><span class="icon-link__text">Bestellen</span></a></li>
              </ul>
            </div>
          </div>
        </article>
      </div>
      <div class="list__list-item">
        <article class="list-item">
          <div class="list-item__inner">
            <div class="list-item__content">
              <div class="list-item__content-inner">
                <div class="list-item__kicker">Veranstaltung</div>
                <div class="list-item__date">
                  <div class="text">
                    <p>01. – 05. September 2020</p>
                  </div>
                </div><a class="list-item__headline js-overlay-link" href="#" data-overlay-target="list-item__content-inner">
                  <h2 class="headline headline--5 list-item__headline-text">Das ist eine Headline</h2>
                </a>
              </div>
            </div>
          </div>
        </article>
      </div>
      <div class="list__list-item">
        <article class="list-item">
          <div class="list-item__inner">
            <div class="list-item__image">
              <div class="image loading" style="padding-top: 66.66666666666666%;"><noscript><img class="image__fallback" alt="Teaser Thumb" height="140" src="https://bildermangel.de/210x140/F5F5F5/28281a.png?text=210x140" width="210" /></noscript><img class="image__img js-lazyload" data-src="https://bildermangel.de/210x140/F5F5F5/28281a.png?text=210x140" width="210" height="140" alt="Teaser Thumb" /></div>
            </div>
            <div class="list-item__content">
              <div class="list-item__content-inner">
                <div class="list-item__kicker">Bildergalerie</div><a class="list-item__headline js-overlay-link" href="#" data-overlay-target="list-item__content-inner">
                  <h2 class="headline headline--5 list-item__headline-text">Das ist eine Headline expedition d und experience</h2>
                </a>
                <div class="list-item__meta"><svg class="icon icon--gallery" viewBox="0 0 200 200">
                    <use xlink:href="#icon-gallery"></use>
                  </svg>
                  <div class="text">
                    <p>10 Bilder</p>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </article>
      </div>
      <div class="list__list-item">
        <article class="list-item">
          <div class="list-item__inner">
            <div class="list-item__content">
              <div class="list-item__content-inner">
                <div class="list-item__kicker">News</div><a class="list-item__headline js-overlay-link" href="#" data-overlay-target="list-item__content-inner">
                  <h2 class="headline headline--5 list-item__headline-text">Das ist eine Headline <mark class="f-highlight">expe</mark>dition d und <mark class="f-highlight">expe</mark>rience</h2>
                </a>
                <div class="list-item__text">
                  <div class="text">
                    <p>Teasertext zum Buch ipsum dolor sit amet, consetetur sadipscing elitr, sed dim nonumy eirmod tempor invidunt</p>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </article>
      </div>
      <div class="list__list-item">
        <article class="list-item">
          <div class="list-item__inner">
            <div class="list-item__content">
              <div class="list-item__content-inner">
                <div class="list-item__kicker">News</div><a class="list-item__headline js-overlay-link" href="#" data-overlay-target="list-item__content-inner">
                  <h2 class="headline headline--5 list-item__headline-text">Das ist eine Headline expedition d und experience</h2>
                </a>
                <div class="list-item__text">
                  <div class="text">
                    <p>Teasertext zum Buch ipsum dolor sit amet, consetetur sadipscing elitr, sed dim nonumy eirmod tempor invidunt</p>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </article>
      </div>
    </div>
    <div class="list__pagination">
      <div class="pagination" aria-label="Seitennavigation">
        <div class="pagination__inner">
          <div class="pagination__prev"><a class="icon-button icon-button--secondary" href="#" rel="prev"><svg class="icon icon--arrow-left icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-46b9-title">
                <title id="icon-46b9-title">List</title>
                <use xlink:href="#icon-arrow-left"></use>
              </svg></a></div>
          <ul class="pagination__list">
            <li class="pagination__item"><a class="pagination__link" href="#"><span class="u-hidden-visually">Seite:</span>1</a></li>
            <li class="pagination__item"><a class="pagination__link" href="#"><span class="u-hidden-visually">Seite:</span>2</a></li>
            <li class="pagination__item pagination__item--current"><a class="pagination__link pagination__link--current" href="#" aria-current="page"><span class="u-hidden-visually">Seite:</span>3</a></li>
            <li class="pagination__item"><a class="pagination__link" href="#"><span class="u-hidden-visually">Seite:</span>4</a></li>
            <li class="pagination__item"><a class="pagination__link" href="#"><span class="u-hidden-visually">Seite:</span>5</a></li>
          </ul>
          <div class="pagination__next"><a class="icon-button icon-button--secondary" href="#" rel="next"><svg class="icon icon--arrow-right icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-262f-title">
                <title id="icon-262f-title">List</title>
                <use xlink:href="#icon-arrow-right"></use>
              </svg></a></div>
        </div>
      </div>
    </div>
  </div>
</section>

{
  "headline": {
    "level": 1,
    "size": 1,
    "text": "Suche\n"
  },
  "pagination": true,
  "results": {
    "text": "52 Ergebnisse gefunden"
  },
  "sort": true,
  "formSearch": true,
  "tabBar": true,
  "items": [
    {
      "use": "list-item--video"
    },
    {
      "use": "list-item--gallery"
    },
    {
      "use": "list-item--image"
    },
    {
      "use": "list-item"
    },
    {
      "use": "list-item--publication",
      "settings": {
        "image": null,
        "text": null,
        "kicker": "Pressematerial"
      }
    },
    {
      "use": "list-item--publication"
    },
    {
      "use": "list-item--event"
    },
    {
      "use": "list-item--gallery"
    },
    {
      "use": "list-item--highlight"
    },
    {
      "use": "list-item"
    }
  ]
}

<section class="list">
  <div class="list__inner">
    <div class="list__headline">
      <h2 class="headline headline--1"><span class="f-w-normal">Unsere</span><br />Programme</h2>
    </div>
    <div class="list__form-list-filter">
      <form class="form-list-filter">
        <div class="form-list-filter__fields">
          <div class="form-list-filter__field">
            <div class="form-group">
              <div class="form-group__input"><select class="select" id="form-group-8791" name="bereich" aria-label="Bereich auswählen">
                  <option>Bereich</option>
                  <option>Bereich 1</option>
                  <option>Bereich 2</option>
                  <option>Bereich 3</option>
                </select></div>
            </div>
          </div>
          <div class="form-list-filter__field">
            <div class="form-group">
              <div class="form-group__input"><select class="select" id="form-group-293a" name="thema" aria-label="Thema auswählen">
                  <option>Thema</option>
                  <option>Thema 1</option>
                  <option>Thema 2</option>
                  <option>Thema 3</option>
                </select></div>
            </div>
          </div>
          <div class="form-list-filter__field">
            <div class="form-group">
              <div class="form-group__input"><select class="select" id="form-group-e358" name="typ" aria-label="Typ auswählen">
                  <option>Typ</option>
                  <option>Typ 1</option>
                  <option>Typ 2</option>
                  <option>Typ 3</option>
                </select></div>
            </div>
          </div>
          <div class="form-list-filter__field">
            <div class="form-group">
              <div class="form-group__input"><select class="select" id="form-group-870d" name="zielgruppe" aria-label="Zielgruppe auswählen">
                  <option>Zielgruppe</option>
                  <option>Zielgruppe 1</option>
                  <option>Zielgruppe 2</option>
                  <option>Zielgruppe 3</option>
                </select></div>
            </div>
          </div>
          <div class="form-list-filter__field">
            <div class="form-group">
              <div class="form-group__input"><select class="select" id="form-group-0df8" name="status" aria-label="Status auswählen">
                  <option>Aktuell</option>
                  <option>Abgeschlossen</option>
                  <option>Beide</option>
                </select></div>
            </div>
          </div>
        </div>
        <div class="form-list-filter__action"><button class="button button--primary form-list-filter__button" type="submit"><svg class="icon icon--search button__icon" viewBox="0 0 200 200">
              <use xlink:href="#icon-search"></use>
            </svg><span class="button__text">Filter anwenden</span></button></div>
      </form>
      <div class="list__results">
        <div class="list__results-text">52 Ergebnisse gefunden</div>
        <div class="list__results-sort">
          <div class="sort">
            <div class="sort__dropdown">
              <div class="sort__text">Sortierung nach:
                <span class="sort__active">Relevanz</span></div><button class="sort__button" type="button" aria-expanded="false" aria-controls="sort-a6d6-content"><svg class="icon icon--dropdown sort__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-916a-title">
                  <title id="icon-916a-title">Sortierung auswählen</title>
                  <use xlink:href="#icon-dropdown"></use>
                </svg></button>
            </div>
            <ul class="sort__list" id="sort-a6d6-content">
              <li class="sort__item sort__item--active" aria-current="page">Relevanz<span class="sort__item-label u-hidden-visually">&nbsp;(Ausgewählter Filter)</span></li>
              <li class="sort__item"><a class="sort__link" href="#">Alphabetisch (aufsteigend)</a></li>
              <li class="sort__item"><a class="sort__link" href="#">Alphabetisch (absteigend)</a></li>
              <li class="sort__item"><a class="sort__link" href="#">Filterkriteriumslängengegenstand</a></li>
            </ul>
          </div>
        </div>
        <form class="list__results-numbers" method="post" action="/">
          <div class="sort__dropdown"><label class="sort__text" for="nId-ab5b">Pro Seite:</label><select class="sort__button" id="nId-ab5b" name="numberOfItems">
              <option>10</option>
              <option>20</option>
              <option>50</option>
            </select></div>
        </form>
      </div>
      <div class="list__filter-tag-group">
        <div class="u-hidden-visually" id="filter-tag-group-9496">Ausgewählte Filter:</div>
        <div class="filter-tag-group">
          <ul class="filter-tag-group__items" aria-labelledby="filter-tag-group-9496">
            <li class="filter-tag-group__item"><a class="filter-tag" href="#"><span class="filter-tag__text">Forschung<span class="u-hidden-visually">- Filter löschen</span></span><svg class="icon icon--close filter-tag__icon" viewBox="0 0 200 200">
                  <use xlink:href="#icon-close"></use>
                </svg></a></li>
            <li class="filter-tag-group__item"><a class="filter-tag" href="#"><span class="filter-tag__text">Stipendium<span class="u-hidden-visually">- Filter löschen</span></span><svg class="icon icon--close filter-tag__icon" viewBox="0 0 200 200">
                  <use xlink:href="#icon-close"></use>
                </svg></a></li>
            <li class="filter-tag-group__item"><a class="filter-tag" href="#"><span class="filter-tag__text">ab 2019<span class="u-hidden-visually">- Filter löschen</span></span><svg class="icon icon--close filter-tag__icon" viewBox="0 0 200 200">
                  <use xlink:href="#icon-close"></use>
                </svg></a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="list__section">
      <h2 class="headline headline--3 list__section-headline">Aktuelle Programme</h2>
      <div class="list__list">
        <div class="list__list-item">
          <article class="list-item list-item--tender">
            <div class="list-item__inner">
              <div class="list-item__content">
                <div class="list-item__content-inner"><a class="list-item__headline js-overlay-link" href="#" data-overlay-target="list-item__content-inner">
                    <h2 class="headline headline--5 list-item__headline-text">expedition D</h2>
                  </a>
                  <div class="list-item__text">
                    <div class="text">
                      <p>Forschung · Technologie, Wissenschaft, MINT · Programm · für Schüler*innen</p>
                    </div>
                  </div>
                </div>
              </div>
              <div class="list-item__tender"><svg class="icon icon--stopwatch" viewBox="0 0 200 200">
                  <use xlink:href="#icon-stopwatch"></use>
                </svg>
                <div class="text text--small">
                  <p>Ausschreibung endet bald</p>
                </div>
              </div>
            </div>
            <div class="list-item__quickinfo">
              <div class="quickinfo">
                <div class="quickinfo__button-wrap"><button class="icon-button quickinfo__button" type="button" aria-expanded="false" aria-controls="id-6ba3-content" id="id-6ba3-title"><svg class="icon icon--list icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-f0b6-title">
                      <title id="icon-f0b6-title">Schnellinfo zeigen</title>
                      <use xlink:href="#icon-list"></use>
                    </svg></button></div>
                <article class="quickinfo__panel" id="id-6ba3-content" aria-labelledby="id-6ba3-title">
                  <div class="quickinfo__content" tabindex="-1">
                    <div class="quickinfo__content-inner">
                      <div class="quickinfo__block" id="block-id-3782">
                        <h2 class="headline headline--3">Talent im Land</h2>
                      </div>
                      <div class="quickinfo__block" id="block-id-09f3">
                        <div class="info info--condensed">
                          <p class="info__text"><svg class="icon icon--stopwatch" viewBox="0 0 200 200">
                              <use xlink:href="#icon-stopwatch"></use>
                            </svg>Die Bewerbungsfrist endet am 31.3.2020. <a class="link link--external" href="#" target="_blank" rel="noopener noreferrer">Jetzt informieren und bewerben</a></p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-47b8">
                        <div class="meta-info meta-info--vertical">
                          <dl class="meta-info__list">
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Bereich</dt>
                              <dd class="meta-info__content">Forschung</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Typ</dt>
                              <dd class="meta-info__content">Programm</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Thema</dt>
                              <dd class="meta-info__content">Technologie, Wissenschaft, MINT</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Zielgruppe</dt>
                              <dd class="meta-info__content">Schülerinnen &amp; Schüler</dd>
                            </div>
                          </dl>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-2403">
                        <div class="text">
                          <p><b>Kurzbeschreibung</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-f98c">
                        <div class="text">
                          <p><b>Ziel</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-3133">
                        <div class="text">
                          <p><b>Kurzbeschreibung2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-5859">
                        <div class="text">
                          <p><b>Ziel2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-c017"><a class="button button--primary" href="#"><svg class="icon icon--arrow-right button__icon" viewBox="0 0 200 200">
                            <use xlink:href="#icon-arrow-right"></use>
                          </svg><span class="button__text">Zum Programm</span></a></div><button class="icon-button icon-button--secondary quickinfo__close" type="button"><svg class="icon icon--close icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-e977-title">
                          <title id="icon-e977-title">Schnellinfo schließen</title>
                          <use xlink:href="#icon-close"></use>
                        </svg></button>
                    </div>
                  </div>
                </article>
              </div>
            </div>
          </article>
        </div>
        <div class="list__list-item">
          <article class="list-item list-item--tender">
            <div class="list-item__inner">
              <div class="list-item__content">
                <div class="list-item__content-inner"><a class="list-item__headline js-overlay-link" href="#" data-overlay-target="list-item__content-inner">
                    <h2 class="headline headline--5 list-item__headline-text">Coaching4Future</h2>
                  </a>
                  <div class="list-item__text">
                    <div class="text">
                      <p>Bereich · Thema · Typ · Zielgruppe</p>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="list-item__quickinfo">
              <div class="quickinfo">
                <div class="quickinfo__button-wrap"><button class="icon-button quickinfo__button" type="button" aria-expanded="false" aria-controls="id-1e09-content" id="id-1e09-title"><svg class="icon icon--list icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-f851-title">
                      <title id="icon-f851-title">Schnellinfo zeigen</title>
                      <use xlink:href="#icon-list"></use>
                    </svg></button></div>
                <article class="quickinfo__panel" id="id-1e09-content" aria-labelledby="id-1e09-title">
                  <div class="quickinfo__content" tabindex="-1">
                    <div class="quickinfo__content-inner">
                      <div class="quickinfo__block" id="block-id-4b26">
                        <h2 class="headline headline--3">Talent im Land</h2>
                      </div>
                      <div class="quickinfo__block" id="block-id-f14c">
                        <div class="info info--condensed">
                          <p class="info__text"><svg class="icon icon--stopwatch" viewBox="0 0 200 200">
                              <use xlink:href="#icon-stopwatch"></use>
                            </svg>Die Bewerbungsfrist endet am 31.3.2020. <a class="link link--external" href="#" target="_blank" rel="noopener noreferrer">Jetzt informieren und bewerben</a></p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-006d">
                        <div class="meta-info meta-info--vertical">
                          <dl class="meta-info__list">
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Bereich</dt>
                              <dd class="meta-info__content">Forschung</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Typ</dt>
                              <dd class="meta-info__content">Programm</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Thema</dt>
                              <dd class="meta-info__content">Technologie, Wissenschaft, MINT</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Zielgruppe</dt>
                              <dd class="meta-info__content">Schülerinnen &amp; Schüler</dd>
                            </div>
                          </dl>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-94dc">
                        <div class="text">
                          <p><b>Kurzbeschreibung</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-dc4c">
                        <div class="text">
                          <p><b>Ziel</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-3c17">
                        <div class="text">
                          <p><b>Kurzbeschreibung2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-a748">
                        <div class="text">
                          <p><b>Ziel2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-e58a"><a class="button button--primary" href="#"><svg class="icon icon--arrow-right button__icon" viewBox="0 0 200 200">
                            <use xlink:href="#icon-arrow-right"></use>
                          </svg><span class="button__text">Zum Programm</span></a></div><button class="icon-button icon-button--secondary quickinfo__close" type="button"><svg class="icon icon--close icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-312c-title">
                          <title id="icon-312c-title">Schnellinfo schließen</title>
                          <use xlink:href="#icon-close"></use>
                        </svg></button>
                    </div>
                  </div>
                </article>
              </div>
            </div>
          </article>
        </div>
        <div class="list__list-item">
          <article class="list-item list-item--tender">
            <div class="list-item__inner">
              <div class="list-item__content">
                <div class="list-item__content-inner"><a class="list-item__headline js-overlay-link" href="#" data-overlay-target="list-item__content-inner">
                    <h2 class="headline headline--5 list-item__headline-text">Artur Fischer Erfinderpreis</h2>
                  </a>
                  <div class="list-item__text">
                    <div class="text">
                      <p>Bereich · Thema · Typ · Zielgruppe</p>
                    </div>
                  </div>
                </div>
              </div>
              <div class="list-item__tender"><svg class="icon icon--stopwatch" viewBox="0 0 200 200">
                  <use xlink:href="#icon-stopwatch"></use>
                </svg>
                <div class="text text--small">
                  <p>Ausschreibung endet bald</p>
                </div>
              </div>
            </div>
            <div class="list-item__quickinfo">
              <div class="quickinfo">
                <div class="quickinfo__button-wrap"><button class="icon-button quickinfo__button" type="button" aria-expanded="false" aria-controls="id-ee96-content" id="id-ee96-title"><svg class="icon icon--list icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-4f32-title">
                      <title id="icon-4f32-title">Schnellinfo zeigen</title>
                      <use xlink:href="#icon-list"></use>
                    </svg></button></div>
                <article class="quickinfo__panel" id="id-ee96-content" aria-labelledby="id-ee96-title">
                  <div class="quickinfo__content" tabindex="-1">
                    <div class="quickinfo__content-inner">
                      <div class="quickinfo__block" id="block-id-4b2c">
                        <h2 class="headline headline--3">Talent im Land</h2>
                      </div>
                      <div class="quickinfo__block" id="block-id-3dba">
                        <div class="info info--condensed">
                          <p class="info__text"><svg class="icon icon--stopwatch" viewBox="0 0 200 200">
                              <use xlink:href="#icon-stopwatch"></use>
                            </svg>Die Bewerbungsfrist endet am 31.3.2020. <a class="link link--external" href="#" target="_blank" rel="noopener noreferrer">Jetzt informieren und bewerben</a></p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-780e">
                        <div class="meta-info meta-info--vertical">
                          <dl class="meta-info__list">
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Bereich</dt>
                              <dd class="meta-info__content">Forschung</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Typ</dt>
                              <dd class="meta-info__content">Programm</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Thema</dt>
                              <dd class="meta-info__content">Technologie, Wissenschaft, MINT</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Zielgruppe</dt>
                              <dd class="meta-info__content">Schülerinnen &amp; Schüler</dd>
                            </div>
                          </dl>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-6658">
                        <div class="text">
                          <p><b>Kurzbeschreibung</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-24d8">
                        <div class="text">
                          <p><b>Ziel</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-8a37">
                        <div class="text">
                          <p><b>Kurzbeschreibung2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-b4b1">
                        <div class="text">
                          <p><b>Ziel2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-d8e5"><a class="button button--primary" href="#"><svg class="icon icon--arrow-right button__icon" viewBox="0 0 200 200">
                            <use xlink:href="#icon-arrow-right"></use>
                          </svg><span class="button__text">Zum Programm</span></a></div><button class="icon-button icon-button--secondary quickinfo__close" type="button"><svg class="icon icon--close icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-35c5-title">
                          <title id="icon-35c5-title">Schnellinfo schließen</title>
                          <use xlink:href="#icon-close"></use>
                        </svg></button>
                    </div>
                  </div>
                </article>
              </div>
            </div>
          </article>
        </div>
        <div class="list__list-item">
          <article class="list-item list-item--tender">
            <div class="list-item__inner">
              <div class="list-item__content">
                <div class="list-item__content-inner"><a class="list-item__headline js-overlay-link" href="#" data-overlay-target="list-item__content-inner">
                    <h2 class="headline headline--5 list-item__headline-text">expedition D</h2>
                  </a>
                  <div class="list-item__text">
                    <div class="text">
                      <p>Forschung · Technologie, Wissenschaft, MINT · Programm · für Schüler*innen</p>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="list-item__quickinfo">
              <div class="quickinfo">
                <div class="quickinfo__button-wrap"><button class="icon-button quickinfo__button" type="button" aria-expanded="false" aria-controls="id-c069-content" id="id-c069-title"><svg class="icon icon--list icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-3cd9-title">
                      <title id="icon-3cd9-title">Schnellinfo zeigen</title>
                      <use xlink:href="#icon-list"></use>
                    </svg></button></div>
                <article class="quickinfo__panel" id="id-c069-content" aria-labelledby="id-c069-title">
                  <div class="quickinfo__content" tabindex="-1">
                    <div class="quickinfo__content-inner">
                      <div class="quickinfo__block" id="block-id-8718">
                        <h2 class="headline headline--3">Talent im Land</h2>
                      </div>
                      <div class="quickinfo__block" id="block-id-5352">
                        <div class="info info--condensed">
                          <p class="info__text"><svg class="icon icon--stopwatch" viewBox="0 0 200 200">
                              <use xlink:href="#icon-stopwatch"></use>
                            </svg>Die Bewerbungsfrist endet am 31.3.2020. <a class="link link--external" href="#" target="_blank" rel="noopener noreferrer">Jetzt informieren und bewerben</a></p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-1646">
                        <div class="meta-info meta-info--vertical">
                          <dl class="meta-info__list">
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Bereich</dt>
                              <dd class="meta-info__content">Forschung</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Typ</dt>
                              <dd class="meta-info__content">Programm</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Thema</dt>
                              <dd class="meta-info__content">Technologie, Wissenschaft, MINT</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Zielgruppe</dt>
                              <dd class="meta-info__content">Schülerinnen &amp; Schüler</dd>
                            </div>
                          </dl>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-936e">
                        <div class="text">
                          <p><b>Kurzbeschreibung</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-08c5">
                        <div class="text">
                          <p><b>Ziel</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-642b">
                        <div class="text">
                          <p><b>Kurzbeschreibung2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-7927">
                        <div class="text">
                          <p><b>Ziel2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-fb1b"><a class="button button--primary" href="#"><svg class="icon icon--arrow-right button__icon" viewBox="0 0 200 200">
                            <use xlink:href="#icon-arrow-right"></use>
                          </svg><span class="button__text">Zum Programm</span></a></div><button class="icon-button icon-button--secondary quickinfo__close" type="button"><svg class="icon icon--close icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-e888-title">
                          <title id="icon-e888-title">Schnellinfo schließen</title>
                          <use xlink:href="#icon-close"></use>
                        </svg></button>
                    </div>
                  </div>
                </article>
              </div>
            </div>
          </article>
        </div>
        <div class="list__list-item">
          <article class="list-item list-item--tender">
            <div class="list-item__inner">
              <div class="list-item__content">
                <div class="list-item__content-inner"><a class="list-item__headline js-overlay-link" href="#" data-overlay-target="list-item__content-inner">
                    <h2 class="headline headline--5 list-item__headline-text">Name des Programms</h2>
                  </a>
                  <div class="list-item__text">
                    <div class="text">
                      <p>Bereich · Thema · Typ · Zielgruppe</p>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="list-item__quickinfo">
              <div class="quickinfo">
                <div class="quickinfo__button-wrap"><button class="icon-button quickinfo__button" type="button" aria-expanded="false" aria-controls="id-82bb-content" id="id-82bb-title"><svg class="icon icon--list icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-faf2-title">
                      <title id="icon-faf2-title">Schnellinfo zeigen</title>
                      <use xlink:href="#icon-list"></use>
                    </svg></button></div>
                <article class="quickinfo__panel" id="id-82bb-content" aria-labelledby="id-82bb-title">
                  <div class="quickinfo__content" tabindex="-1">
                    <div class="quickinfo__content-inner">
                      <div class="quickinfo__block" id="block-id-b321">
                        <h2 class="headline headline--3">Talent im Land</h2>
                      </div>
                      <div class="quickinfo__block" id="block-id-c7e2">
                        <div class="info info--condensed">
                          <p class="info__text"><svg class="icon icon--stopwatch" viewBox="0 0 200 200">
                              <use xlink:href="#icon-stopwatch"></use>
                            </svg>Die Bewerbungsfrist endet am 31.3.2020. <a class="link link--external" href="#" target="_blank" rel="noopener noreferrer">Jetzt informieren und bewerben</a></p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-ed65">
                        <div class="meta-info meta-info--vertical">
                          <dl class="meta-info__list">
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Bereich</dt>
                              <dd class="meta-info__content">Forschung</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Typ</dt>
                              <dd class="meta-info__content">Programm</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Thema</dt>
                              <dd class="meta-info__content">Technologie, Wissenschaft, MINT</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Zielgruppe</dt>
                              <dd class="meta-info__content">Schülerinnen &amp; Schüler</dd>
                            </div>
                          </dl>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-3c8b">
                        <div class="text">
                          <p><b>Kurzbeschreibung</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-6264">
                        <div class="text">
                          <p><b>Ziel</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-cfdb">
                        <div class="text">
                          <p><b>Kurzbeschreibung2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-f16a">
                        <div class="text">
                          <p><b>Ziel2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-410c"><a class="button button--primary" href="#"><svg class="icon icon--arrow-right button__icon" viewBox="0 0 200 200">
                            <use xlink:href="#icon-arrow-right"></use>
                          </svg><span class="button__text">Zum Programm</span></a></div><button class="icon-button icon-button--secondary quickinfo__close" type="button"><svg class="icon icon--close icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-66b2-title">
                          <title id="icon-66b2-title">Schnellinfo schließen</title>
                          <use xlink:href="#icon-close"></use>
                        </svg></button>
                    </div>
                  </div>
                </article>
              </div>
            </div>
          </article>
        </div>
        <div class="list__list-item">
          <article class="list-item list-item--tender">
            <div class="list-item__inner">
              <div class="list-item__content">
                <div class="list-item__content-inner"><a class="list-item__headline js-overlay-link" href="#" data-overlay-target="list-item__content-inner">
                    <h2 class="headline headline--5 list-item__headline-text">Name des Programms</h2>
                  </a>
                  <div class="list-item__text">
                    <div class="text">
                      <p>Bereich · Thema · Typ · Zielgruppe</p>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="list-item__quickinfo">
              <div class="quickinfo">
                <div class="quickinfo__button-wrap"><button class="icon-button quickinfo__button" type="button" aria-expanded="false" aria-controls="id-7dfc-content" id="id-7dfc-title"><svg class="icon icon--list icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-16e8-title">
                      <title id="icon-16e8-title">Schnellinfo zeigen</title>
                      <use xlink:href="#icon-list"></use>
                    </svg></button></div>
                <article class="quickinfo__panel" id="id-7dfc-content" aria-labelledby="id-7dfc-title">
                  <div class="quickinfo__content" tabindex="-1">
                    <div class="quickinfo__content-inner">
                      <div class="quickinfo__block" id="block-id-d169">
                        <h2 class="headline headline--3">Talent im Land</h2>
                      </div>
                      <div class="quickinfo__block" id="block-id-408b">
                        <div class="info info--condensed">
                          <p class="info__text"><svg class="icon icon--stopwatch" viewBox="0 0 200 200">
                              <use xlink:href="#icon-stopwatch"></use>
                            </svg>Die Bewerbungsfrist endet am 31.3.2020. <a class="link link--external" href="#" target="_blank" rel="noopener noreferrer">Jetzt informieren und bewerben</a></p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-b1a3">
                        <div class="meta-info meta-info--vertical">
                          <dl class="meta-info__list">
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Bereich</dt>
                              <dd class="meta-info__content">Forschung</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Typ</dt>
                              <dd class="meta-info__content">Programm</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Thema</dt>
                              <dd class="meta-info__content">Technologie, Wissenschaft, MINT</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Zielgruppe</dt>
                              <dd class="meta-info__content">Schülerinnen &amp; Schüler</dd>
                            </div>
                          </dl>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-515e">
                        <div class="text">
                          <p><b>Kurzbeschreibung</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-5279">
                        <div class="text">
                          <p><b>Ziel</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-ef7f">
                        <div class="text">
                          <p><b>Kurzbeschreibung2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-73dc">
                        <div class="text">
                          <p><b>Ziel2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-e208"><a class="button button--primary" href="#"><svg class="icon icon--arrow-right button__icon" viewBox="0 0 200 200">
                            <use xlink:href="#icon-arrow-right"></use>
                          </svg><span class="button__text">Zum Programm</span></a></div><button class="icon-button icon-button--secondary quickinfo__close" type="button"><svg class="icon icon--close icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-1dd9-title">
                          <title id="icon-1dd9-title">Schnellinfo schließen</title>
                          <use xlink:href="#icon-close"></use>
                        </svg></button>
                    </div>
                  </div>
                </article>
              </div>
            </div>
          </article>
        </div>
        <div class="list__list-item">
          <article class="list-item list-item--tender">
            <div class="list-item__inner">
              <div class="list-item__content">
                <div class="list-item__content-inner"><a class="list-item__headline js-overlay-link" href="#" data-overlay-target="list-item__content-inner">
                    <h2 class="headline headline--5 list-item__headline-text">expedition D</h2>
                  </a>
                  <div class="list-item__text">
                    <div class="text">
                      <p>Forschung · Technologie, Wissenschaft, MINT · Programm · für Schüler*innen</p>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="list-item__quickinfo">
              <div class="quickinfo">
                <div class="quickinfo__button-wrap"><button class="icon-button quickinfo__button" type="button" aria-expanded="false" aria-controls="id-54a1-content" id="id-54a1-title"><svg class="icon icon--list icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-c0ac-title">
                      <title id="icon-c0ac-title">Schnellinfo zeigen</title>
                      <use xlink:href="#icon-list"></use>
                    </svg></button></div>
                <article class="quickinfo__panel" id="id-54a1-content" aria-labelledby="id-54a1-title">
                  <div class="quickinfo__content" tabindex="-1">
                    <div class="quickinfo__content-inner">
                      <div class="quickinfo__block" id="block-id-2ebf">
                        <h2 class="headline headline--3">Talent im Land</h2>
                      </div>
                      <div class="quickinfo__block" id="block-id-de02">
                        <div class="info info--condensed">
                          <p class="info__text"><svg class="icon icon--stopwatch" viewBox="0 0 200 200">
                              <use xlink:href="#icon-stopwatch"></use>
                            </svg>Die Bewerbungsfrist endet am 31.3.2020. <a class="link link--external" href="#" target="_blank" rel="noopener noreferrer">Jetzt informieren und bewerben</a></p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-5ba1">
                        <div class="meta-info meta-info--vertical">
                          <dl class="meta-info__list">
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Bereich</dt>
                              <dd class="meta-info__content">Forschung</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Typ</dt>
                              <dd class="meta-info__content">Programm</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Thema</dt>
                              <dd class="meta-info__content">Technologie, Wissenschaft, MINT</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Zielgruppe</dt>
                              <dd class="meta-info__content">Schülerinnen &amp; Schüler</dd>
                            </div>
                          </dl>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-87f4">
                        <div class="text">
                          <p><b>Kurzbeschreibung</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-3b2b">
                        <div class="text">
                          <p><b>Ziel</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-2946">
                        <div class="text">
                          <p><b>Kurzbeschreibung2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-ae4d">
                        <div class="text">
                          <p><b>Ziel2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-ad72"><a class="button button--primary" href="#"><svg class="icon icon--arrow-right button__icon" viewBox="0 0 200 200">
                            <use xlink:href="#icon-arrow-right"></use>
                          </svg><span class="button__text">Zum Programm</span></a></div><button class="icon-button icon-button--secondary quickinfo__close" type="button"><svg class="icon icon--close icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-8372-title">
                          <title id="icon-8372-title">Schnellinfo schließen</title>
                          <use xlink:href="#icon-close"></use>
                        </svg></button>
                    </div>
                  </div>
                </article>
              </div>
            </div>
          </article>
        </div>
        <div class="list__list-item">
          <article class="list-item list-item--tender">
            <div class="list-item__inner">
              <div class="list-item__content">
                <div class="list-item__content-inner"><a class="list-item__headline js-overlay-link" href="#" data-overlay-target="list-item__content-inner">
                    <h2 class="headline headline--5 list-item__headline-text">Coaching4Future</h2>
                  </a>
                  <div class="list-item__text">
                    <div class="text">
                      <p>Bereich · Thema · Typ · Zielgruppe</p>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="list-item__quickinfo">
              <div class="quickinfo">
                <div class="quickinfo__button-wrap"><button class="icon-button quickinfo__button" type="button" aria-expanded="false" aria-controls="id-f664-content" id="id-f664-title"><svg class="icon icon--list icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-2433-title">
                      <title id="icon-2433-title">Schnellinfo zeigen</title>
                      <use xlink:href="#icon-list"></use>
                    </svg></button></div>
                <article class="quickinfo__panel" id="id-f664-content" aria-labelledby="id-f664-title">
                  <div class="quickinfo__content" tabindex="-1">
                    <div class="quickinfo__content-inner">
                      <div class="quickinfo__block" id="block-id-9f7b">
                        <h2 class="headline headline--3">Talent im Land</h2>
                      </div>
                      <div class="quickinfo__block" id="block-id-e365">
                        <div class="info info--condensed">
                          <p class="info__text"><svg class="icon icon--stopwatch" viewBox="0 0 200 200">
                              <use xlink:href="#icon-stopwatch"></use>
                            </svg>Die Bewerbungsfrist endet am 31.3.2020. <a class="link link--external" href="#" target="_blank" rel="noopener noreferrer">Jetzt informieren und bewerben</a></p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-49e3">
                        <div class="meta-info meta-info--vertical">
                          <dl class="meta-info__list">
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Bereich</dt>
                              <dd class="meta-info__content">Forschung</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Typ</dt>
                              <dd class="meta-info__content">Programm</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Thema</dt>
                              <dd class="meta-info__content">Technologie, Wissenschaft, MINT</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Zielgruppe</dt>
                              <dd class="meta-info__content">Schülerinnen &amp; Schüler</dd>
                            </div>
                          </dl>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-c3a3">
                        <div class="text">
                          <p><b>Kurzbeschreibung</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-82ee">
                        <div class="text">
                          <p><b>Ziel</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-7ea8">
                        <div class="text">
                          <p><b>Kurzbeschreibung2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-c64a">
                        <div class="text">
                          <p><b>Ziel2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-a37a"><a class="button button--primary" href="#"><svg class="icon icon--arrow-right button__icon" viewBox="0 0 200 200">
                            <use xlink:href="#icon-arrow-right"></use>
                          </svg><span class="button__text">Zum Programm</span></a></div><button class="icon-button icon-button--secondary quickinfo__close" type="button"><svg class="icon icon--close icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-381b-title">
                          <title id="icon-381b-title">Schnellinfo schließen</title>
                          <use xlink:href="#icon-close"></use>
                        </svg></button>
                    </div>
                  </div>
                </article>
              </div>
            </div>
          </article>
        </div>
        <div class="list__list-item">
          <article class="list-item list-item--tender">
            <div class="list-item__inner">
              <div class="list-item__content">
                <div class="list-item__content-inner"><a class="list-item__headline js-overlay-link" href="#" data-overlay-target="list-item__content-inner">
                    <h2 class="headline headline--5 list-item__headline-text">Artur Fischer Erfinderpreis</h2>
                  </a>
                  <div class="list-item__text">
                    <div class="text">
                      <p>Bereich · Thema · Typ · Zielgruppe</p>
                    </div>
                  </div>
                </div>
              </div>
              <div class="list-item__tender"><svg class="icon icon--stopwatch" viewBox="0 0 200 200">
                  <use xlink:href="#icon-stopwatch"></use>
                </svg>
                <div class="text text--small">
                  <p>Ausschreibung endet bald</p>
                </div>
              </div>
            </div>
            <div class="list-item__quickinfo">
              <div class="quickinfo">
                <div class="quickinfo__button-wrap"><button class="icon-button quickinfo__button" type="button" aria-expanded="false" aria-controls="id-2bb1-content" id="id-2bb1-title"><svg class="icon icon--list icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-2f62-title">
                      <title id="icon-2f62-title">Schnellinfo zeigen</title>
                      <use xlink:href="#icon-list"></use>
                    </svg></button></div>
                <article class="quickinfo__panel" id="id-2bb1-content" aria-labelledby="id-2bb1-title">
                  <div class="quickinfo__content" tabindex="-1">
                    <div class="quickinfo__content-inner">
                      <div class="quickinfo__block" id="block-id-1bd3">
                        <h2 class="headline headline--3">Talent im Land</h2>
                      </div>
                      <div class="quickinfo__block" id="block-id-0f89">
                        <div class="info info--condensed">
                          <p class="info__text"><svg class="icon icon--stopwatch" viewBox="0 0 200 200">
                              <use xlink:href="#icon-stopwatch"></use>
                            </svg>Die Bewerbungsfrist endet am 31.3.2020. <a class="link link--external" href="#" target="_blank" rel="noopener noreferrer">Jetzt informieren und bewerben</a></p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-9ae3">
                        <div class="meta-info meta-info--vertical">
                          <dl class="meta-info__list">
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Bereich</dt>
                              <dd class="meta-info__content">Forschung</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Typ</dt>
                              <dd class="meta-info__content">Programm</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Thema</dt>
                              <dd class="meta-info__content">Technologie, Wissenschaft, MINT</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Zielgruppe</dt>
                              <dd class="meta-info__content">Schülerinnen &amp; Schüler</dd>
                            </div>
                          </dl>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-b02f">
                        <div class="text">
                          <p><b>Kurzbeschreibung</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-5a0a">
                        <div class="text">
                          <p><b>Ziel</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-0e51">
                        <div class="text">
                          <p><b>Kurzbeschreibung2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-2fe3">
                        <div class="text">
                          <p><b>Ziel2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-6ce3"><a class="button button--primary" href="#"><svg class="icon icon--arrow-right button__icon" viewBox="0 0 200 200">
                            <use xlink:href="#icon-arrow-right"></use>
                          </svg><span class="button__text">Zum Programm</span></a></div><button class="icon-button icon-button--secondary quickinfo__close" type="button"><svg class="icon icon--close icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-6b42-title">
                          <title id="icon-6b42-title">Schnellinfo schließen</title>
                          <use xlink:href="#icon-close"></use>
                        </svg></button>
                    </div>
                  </div>
                </article>
              </div>
            </div>
          </article>
        </div>
      </div>
    </div>
    <div class="list__section">
      <h2 class="headline headline--3 list__section-headline">Abgeschlossene Programme</h2>
      <div class="list__list">
        <div class="list__list-item">
          <article class="list-item list-item--tender">
            <div class="list-item__inner">
              <div class="list-item__content">
                <div class="list-item__content-inner"><a class="list-item__headline js-overlay-link" href="#" data-overlay-target="list-item__content-inner">
                    <h2 class="headline headline--5 list-item__headline-text">expedition D</h2>
                  </a>
                  <div class="list-item__text">
                    <div class="text">
                      <p>Forschung · Technologie, Wissenschaft, MINT · Programm · für Schüler*innen · <span class="list-item__text--badge">Abgeschlossen</span></p>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="list-item__quickinfo">
              <div class="quickinfo">
                <div class="quickinfo__button-wrap"><button class="icon-button quickinfo__button" type="button" aria-expanded="false" aria-controls="id-384f-content" id="id-384f-title"><svg class="icon icon--list icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-798a-title">
                      <title id="icon-798a-title">Schnellinfo zeigen</title>
                      <use xlink:href="#icon-list"></use>
                    </svg></button></div>
                <article class="quickinfo__panel" id="id-384f-content" aria-labelledby="id-384f-title">
                  <div class="quickinfo__content" tabindex="-1">
                    <div class="quickinfo__content-inner">
                      <div class="quickinfo__block" id="block-id-a5a4">
                        <h2 class="headline headline--3">Talent im Land</h2>
                      </div>
                      <div class="quickinfo__block" id="block-id-72c9">
                        <div class="meta-info meta-info--vertical">
                          <dl class="meta-info__list">
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Bereich</dt>
                              <dd class="meta-info__content">Forschung</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Typ</dt>
                              <dd class="meta-info__content">Programm</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Thema</dt>
                              <dd class="meta-info__content">Technologie, Wissenschaft, MINT</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Zielgruppe</dt>
                              <dd class="meta-info__content">Schülerinnen &amp; Schüler</dd>
                            </div>
                            <div class="meta-info__item meta-info__item--badge">
                              <dt class="meta-info__label">Status</dt>
                              <dd class="meta-info__content">Abgeschlossen</dd>
                            </div>
                          </dl>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-e0f1">
                        <div class="text">
                          <p><b>Kurzbeschreibung</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-c8db">
                        <div class="text">
                          <p><b>Ziel</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-b368">
                        <div class="text">
                          <p><b>Kurzbeschreibung2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-b801">
                        <div class="text">
                          <p><b>Ziel2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-80df"><a class="button button--primary" href="#"><svg class="icon icon--arrow-right button__icon" viewBox="0 0 200 200">
                            <use xlink:href="#icon-arrow-right"></use>
                          </svg><span class="button__text">Zum Programm</span></a></div><button class="icon-button icon-button--secondary quickinfo__close" type="button"><svg class="icon icon--close icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-3288-title">
                          <title id="icon-3288-title">Schnellinfo schließen</title>
                          <use xlink:href="#icon-close"></use>
                        </svg></button>
                    </div>
                  </div>
                </article>
              </div>
            </div>
          </article>
        </div>
        <div class="list__list-item">
          <article class="list-item list-item--tender">
            <div class="list-item__inner">
              <div class="list-item__content">
                <div class="list-item__content-inner"><a class="list-item__headline js-overlay-link" href="#" data-overlay-target="list-item__content-inner">
                    <h2 class="headline headline--5 list-item__headline-text">Coaching4Future</h2>
                  </a>
                  <div class="list-item__text">
                    <div class="text">
                      <p>Bereich · Thema · Typ · Zielgruppe · <span class="list-item__text--badge">Abgeschlossen</span></p>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="list-item__quickinfo">
              <div class="quickinfo">
                <div class="quickinfo__button-wrap"><button class="icon-button quickinfo__button" type="button" aria-expanded="false" aria-controls="id-73e5-content" id="id-73e5-title"><svg class="icon icon--list icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-ef88-title">
                      <title id="icon-ef88-title">Schnellinfo zeigen</title>
                      <use xlink:href="#icon-list"></use>
                    </svg></button></div>
                <article class="quickinfo__panel" id="id-73e5-content" aria-labelledby="id-73e5-title">
                  <div class="quickinfo__content" tabindex="-1">
                    <div class="quickinfo__content-inner">
                      <div class="quickinfo__block" id="block-id-2043">
                        <h2 class="headline headline--3">Talent im Land</h2>
                      </div>
                      <div class="quickinfo__block" id="block-id-98ce">
                        <div class="meta-info meta-info--vertical">
                          <dl class="meta-info__list">
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Bereich</dt>
                              <dd class="meta-info__content">Forschung</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Typ</dt>
                              <dd class="meta-info__content">Programm</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Thema</dt>
                              <dd class="meta-info__content">Technologie, Wissenschaft, MINT</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Zielgruppe</dt>
                              <dd class="meta-info__content">Schülerinnen &amp; Schüler</dd>
                            </div>
                            <div class="meta-info__item meta-info__item--badge">
                              <dt class="meta-info__label">Status</dt>
                              <dd class="meta-info__content">Abgeschlossen</dd>
                            </div>
                          </dl>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-666a">
                        <div class="text">
                          <p><b>Kurzbeschreibung</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-261a">
                        <div class="text">
                          <p><b>Ziel</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-8722">
                        <div class="text">
                          <p><b>Kurzbeschreibung2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-0085">
                        <div class="text">
                          <p><b>Ziel2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-f0f2"><a class="button button--primary" href="#"><svg class="icon icon--arrow-right button__icon" viewBox="0 0 200 200">
                            <use xlink:href="#icon-arrow-right"></use>
                          </svg><span class="button__text">Zum Programm</span></a></div><button class="icon-button icon-button--secondary quickinfo__close" type="button"><svg class="icon icon--close icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-4325-title">
                          <title id="icon-4325-title">Schnellinfo schließen</title>
                          <use xlink:href="#icon-close"></use>
                        </svg></button>
                    </div>
                  </div>
                </article>
              </div>
            </div>
          </article>
        </div>
        <div class="list__list-item">
          <article class="list-item list-item--tender">
            <div class="list-item__inner">
              <div class="list-item__content">
                <div class="list-item__content-inner"><a class="list-item__headline js-overlay-link" href="#" data-overlay-target="list-item__content-inner">
                    <h2 class="headline headline--5 list-item__headline-text">Artur Fischer Erfinderpreis</h2>
                  </a>
                  <div class="list-item__text">
                    <div class="text">
                      <p>Bereich · Thema · Typ · Zielgruppe · <span class="list-item__text--badge">Abgeschlossen</span></p>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="list-item__quickinfo">
              <div class="quickinfo">
                <div class="quickinfo__button-wrap"><button class="icon-button quickinfo__button" type="button" aria-expanded="false" aria-controls="id-882f-content" id="id-882f-title"><svg class="icon icon--list icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-479f-title">
                      <title id="icon-479f-title">Schnellinfo zeigen</title>
                      <use xlink:href="#icon-list"></use>
                    </svg></button></div>
                <article class="quickinfo__panel" id="id-882f-content" aria-labelledby="id-882f-title">
                  <div class="quickinfo__content" tabindex="-1">
                    <div class="quickinfo__content-inner">
                      <div class="quickinfo__block" id="block-id-628d">
                        <h2 class="headline headline--3">Talent im Land</h2>
                      </div>
                      <div class="quickinfo__block" id="block-id-a529">
                        <div class="meta-info meta-info--vertical">
                          <dl class="meta-info__list">
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Bereich</dt>
                              <dd class="meta-info__content">Forschung</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Typ</dt>
                              <dd class="meta-info__content">Programm</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Thema</dt>
                              <dd class="meta-info__content">Technologie, Wissenschaft, MINT</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Zielgruppe</dt>
                              <dd class="meta-info__content">Schülerinnen &amp; Schüler</dd>
                            </div>
                            <div class="meta-info__item meta-info__item--badge">
                              <dt class="meta-info__label">Status</dt>
                              <dd class="meta-info__content">Abgeschlossen</dd>
                            </div>
                          </dl>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-3abd">
                        <div class="text">
                          <p><b>Kurzbeschreibung</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-da97">
                        <div class="text">
                          <p><b>Ziel</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-03a3">
                        <div class="text">
                          <p><b>Kurzbeschreibung2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-3acf">
                        <div class="text">
                          <p><b>Ziel2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-2d28"><a class="button button--primary" href="#"><svg class="icon icon--arrow-right button__icon" viewBox="0 0 200 200">
                            <use xlink:href="#icon-arrow-right"></use>
                          </svg><span class="button__text">Zum Programm</span></a></div><button class="icon-button icon-button--secondary quickinfo__close" type="button"><svg class="icon icon--close icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-569c-title">
                          <title id="icon-569c-title">Schnellinfo schließen</title>
                          <use xlink:href="#icon-close"></use>
                        </svg></button>
                    </div>
                  </div>
                </article>
              </div>
            </div>
          </article>
        </div>
        <div class="list__list-item">
          <article class="list-item list-item--tender">
            <div class="list-item__inner">
              <div class="list-item__content">
                <div class="list-item__content-inner"><a class="list-item__headline js-overlay-link" href="#" data-overlay-target="list-item__content-inner">
                    <h2 class="headline headline--5 list-item__headline-text">expedition D</h2>
                  </a>
                  <div class="list-item__text">
                    <div class="text">
                      <p>Forschung · Technologie, Wissenschaft, MINT · Programm · für Schüler*innen · <span class="list-item__text--badge">Abgeschlossen</span></p>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="list-item__quickinfo">
              <div class="quickinfo">
                <div class="quickinfo__button-wrap"><button class="icon-button quickinfo__button" type="button" aria-expanded="false" aria-controls="id-45f6-content" id="id-45f6-title"><svg class="icon icon--list icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-6926-title">
                      <title id="icon-6926-title">Schnellinfo zeigen</title>
                      <use xlink:href="#icon-list"></use>
                    </svg></button></div>
                <article class="quickinfo__panel" id="id-45f6-content" aria-labelledby="id-45f6-title">
                  <div class="quickinfo__content" tabindex="-1">
                    <div class="quickinfo__content-inner">
                      <div class="quickinfo__block" id="block-id-0c81">
                        <h2 class="headline headline--3">Talent im Land</h2>
                      </div>
                      <div class="quickinfo__block" id="block-id-68f4">
                        <div class="meta-info meta-info--vertical">
                          <dl class="meta-info__list">
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Bereich</dt>
                              <dd class="meta-info__content">Forschung</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Typ</dt>
                              <dd class="meta-info__content">Programm</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Thema</dt>
                              <dd class="meta-info__content">Technologie, Wissenschaft, MINT</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Zielgruppe</dt>
                              <dd class="meta-info__content">Schülerinnen &amp; Schüler</dd>
                            </div>
                            <div class="meta-info__item meta-info__item--badge">
                              <dt class="meta-info__label">Status</dt>
                              <dd class="meta-info__content">Abgeschlossen</dd>
                            </div>
                          </dl>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-6445">
                        <div class="text">
                          <p><b>Kurzbeschreibung</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-1d66">
                        <div class="text">
                          <p><b>Ziel</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-703d">
                        <div class="text">
                          <p><b>Kurzbeschreibung2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-8fa2">
                        <div class="text">
                          <p><b>Ziel2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-71c5"><a class="button button--primary" href="#"><svg class="icon icon--arrow-right button__icon" viewBox="0 0 200 200">
                            <use xlink:href="#icon-arrow-right"></use>
                          </svg><span class="button__text">Zum Programm</span></a></div><button class="icon-button icon-button--secondary quickinfo__close" type="button"><svg class="icon icon--close icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-7753-title">
                          <title id="icon-7753-title">Schnellinfo schließen</title>
                          <use xlink:href="#icon-close"></use>
                        </svg></button>
                    </div>
                  </div>
                </article>
              </div>
            </div>
          </article>
        </div>
        <div class="list__list-item">
          <article class="list-item list-item--tender">
            <div class="list-item__inner">
              <div class="list-item__content">
                <div class="list-item__content-inner"><a class="list-item__headline js-overlay-link" href="#" data-overlay-target="list-item__content-inner">
                    <h2 class="headline headline--5 list-item__headline-text">Name des Programms</h2>
                  </a>
                  <div class="list-item__text">
                    <div class="text">
                      <p>Bereich · Thema · Typ · Zielgruppe · <span class="list-item__text--badge">Abgeschlossen</span></p>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="list-item__quickinfo">
              <div class="quickinfo">
                <div class="quickinfo__button-wrap"><button class="icon-button quickinfo__button" type="button" aria-expanded="false" aria-controls="id-d3b2-content" id="id-d3b2-title"><svg class="icon icon--list icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-77d6-title">
                      <title id="icon-77d6-title">Schnellinfo zeigen</title>
                      <use xlink:href="#icon-list"></use>
                    </svg></button></div>
                <article class="quickinfo__panel" id="id-d3b2-content" aria-labelledby="id-d3b2-title">
                  <div class="quickinfo__content" tabindex="-1">
                    <div class="quickinfo__content-inner">
                      <div class="quickinfo__block" id="block-id-d707">
                        <h2 class="headline headline--3">Talent im Land</h2>
                      </div>
                      <div class="quickinfo__block" id="block-id-6144">
                        <div class="meta-info meta-info--vertical">
                          <dl class="meta-info__list">
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Bereich</dt>
                              <dd class="meta-info__content">Forschung</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Typ</dt>
                              <dd class="meta-info__content">Programm</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Thema</dt>
                              <dd class="meta-info__content">Technologie, Wissenschaft, MINT</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Zielgruppe</dt>
                              <dd class="meta-info__content">Schülerinnen &amp; Schüler</dd>
                            </div>
                            <div class="meta-info__item meta-info__item--badge">
                              <dt class="meta-info__label">Status</dt>
                              <dd class="meta-info__content">Abgeschlossen</dd>
                            </div>
                          </dl>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-d6a4">
                        <div class="text">
                          <p><b>Kurzbeschreibung</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-15fe">
                        <div class="text">
                          <p><b>Ziel</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-8579">
                        <div class="text">
                          <p><b>Kurzbeschreibung2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-464b">
                        <div class="text">
                          <p><b>Ziel2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-3719"><a class="button button--primary" href="#"><svg class="icon icon--arrow-right button__icon" viewBox="0 0 200 200">
                            <use xlink:href="#icon-arrow-right"></use>
                          </svg><span class="button__text">Zum Programm</span></a></div><button class="icon-button icon-button--secondary quickinfo__close" type="button"><svg class="icon icon--close icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-6ba9-title">
                          <title id="icon-6ba9-title">Schnellinfo schließen</title>
                          <use xlink:href="#icon-close"></use>
                        </svg></button>
                    </div>
                  </div>
                </article>
              </div>
            </div>
          </article>
        </div>
        <div class="list__list-item">
          <article class="list-item list-item--tender">
            <div class="list-item__inner">
              <div class="list-item__content">
                <div class="list-item__content-inner"><a class="list-item__headline js-overlay-link" href="#" data-overlay-target="list-item__content-inner">
                    <h2 class="headline headline--5 list-item__headline-text">Name des Programms</h2>
                  </a>
                  <div class="list-item__text">
                    <div class="text">
                      <p>Bereich · Thema · Typ · Zielgruppe · <span class="list-item__text--badge">Abgeschlossen</span></p>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="list-item__quickinfo">
              <div class="quickinfo">
                <div class="quickinfo__button-wrap"><button class="icon-button quickinfo__button" type="button" aria-expanded="false" aria-controls="id-dd97-content" id="id-dd97-title"><svg class="icon icon--list icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-7685-title">
                      <title id="icon-7685-title">Schnellinfo zeigen</title>
                      <use xlink:href="#icon-list"></use>
                    </svg></button></div>
                <article class="quickinfo__panel" id="id-dd97-content" aria-labelledby="id-dd97-title">
                  <div class="quickinfo__content" tabindex="-1">
                    <div class="quickinfo__content-inner">
                      <div class="quickinfo__block" id="block-id-8f2f">
                        <h2 class="headline headline--3">Talent im Land</h2>
                      </div>
                      <div class="quickinfo__block" id="block-id-ec83">
                        <div class="meta-info meta-info--vertical">
                          <dl class="meta-info__list">
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Bereich</dt>
                              <dd class="meta-info__content">Forschung</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Typ</dt>
                              <dd class="meta-info__content">Programm</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Thema</dt>
                              <dd class="meta-info__content">Technologie, Wissenschaft, MINT</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Zielgruppe</dt>
                              <dd class="meta-info__content">Schülerinnen &amp; Schüler</dd>
                            </div>
                            <div class="meta-info__item meta-info__item--badge">
                              <dt class="meta-info__label">Status</dt>
                              <dd class="meta-info__content">Abgeschlossen</dd>
                            </div>
                          </dl>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-6b94">
                        <div class="text">
                          <p><b>Kurzbeschreibung</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-1656">
                        <div class="text">
                          <p><b>Ziel</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-775a">
                        <div class="text">
                          <p><b>Kurzbeschreibung2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-119d">
                        <div class="text">
                          <p><b>Ziel2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-ef01"><a class="button button--primary" href="#"><svg class="icon icon--arrow-right button__icon" viewBox="0 0 200 200">
                            <use xlink:href="#icon-arrow-right"></use>
                          </svg><span class="button__text">Zum Programm</span></a></div><button class="icon-button icon-button--secondary quickinfo__close" type="button"><svg class="icon icon--close icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-8213-title">
                          <title id="icon-8213-title">Schnellinfo schließen</title>
                          <use xlink:href="#icon-close"></use>
                        </svg></button>
                    </div>
                  </div>
                </article>
              </div>
            </div>
          </article>
        </div>
        <div class="list__list-item">
          <article class="list-item list-item--tender">
            <div class="list-item__inner">
              <div class="list-item__content">
                <div class="list-item__content-inner"><a class="list-item__headline js-overlay-link" href="#" data-overlay-target="list-item__content-inner">
                    <h2 class="headline headline--5 list-item__headline-text">expedition D</h2>
                  </a>
                  <div class="list-item__text">
                    <div class="text">
                      <p>Forschung · Technologie, Wissenschaft, MINT · Programm · für Schüler*innen · <span class="list-item__text--badge">Abgeschlossen</span></p>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="list-item__quickinfo">
              <div class="quickinfo">
                <div class="quickinfo__button-wrap"><button class="icon-button quickinfo__button" type="button" aria-expanded="false" aria-controls="id-e82b-content" id="id-e82b-title"><svg class="icon icon--list icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-6d64-title">
                      <title id="icon-6d64-title">Schnellinfo zeigen</title>
                      <use xlink:href="#icon-list"></use>
                    </svg></button></div>
                <article class="quickinfo__panel" id="id-e82b-content" aria-labelledby="id-e82b-title">
                  <div class="quickinfo__content" tabindex="-1">
                    <div class="quickinfo__content-inner">
                      <div class="quickinfo__block" id="block-id-6d73">
                        <h2 class="headline headline--3">Talent im Land</h2>
                      </div>
                      <div class="quickinfo__block" id="block-id-2109">
                        <div class="meta-info meta-info--vertical">
                          <dl class="meta-info__list">
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Bereich</dt>
                              <dd class="meta-info__content">Forschung</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Typ</dt>
                              <dd class="meta-info__content">Programm</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Thema</dt>
                              <dd class="meta-info__content">Technologie, Wissenschaft, MINT</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Zielgruppe</dt>
                              <dd class="meta-info__content">Schülerinnen &amp; Schüler</dd>
                            </div>
                            <div class="meta-info__item meta-info__item--badge">
                              <dt class="meta-info__label">Status</dt>
                              <dd class="meta-info__content">Abgeschlossen</dd>
                            </div>
                          </dl>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-8003">
                        <div class="text">
                          <p><b>Kurzbeschreibung</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-4f04">
                        <div class="text">
                          <p><b>Ziel</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-ab6b">
                        <div class="text">
                          <p><b>Kurzbeschreibung2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-74ea">
                        <div class="text">
                          <p><b>Ziel2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-6cec"><a class="button button--primary" href="#"><svg class="icon icon--arrow-right button__icon" viewBox="0 0 200 200">
                            <use xlink:href="#icon-arrow-right"></use>
                          </svg><span class="button__text">Zum Programm</span></a></div><button class="icon-button icon-button--secondary quickinfo__close" type="button"><svg class="icon icon--close icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-22dc-title">
                          <title id="icon-22dc-title">Schnellinfo schließen</title>
                          <use xlink:href="#icon-close"></use>
                        </svg></button>
                    </div>
                  </div>
                </article>
              </div>
            </div>
          </article>
        </div>
        <div class="list__list-item">
          <article class="list-item list-item--tender">
            <div class="list-item__inner">
              <div class="list-item__content">
                <div class="list-item__content-inner"><a class="list-item__headline js-overlay-link" href="#" data-overlay-target="list-item__content-inner">
                    <h2 class="headline headline--5 list-item__headline-text">Coaching4Future</h2>
                  </a>
                  <div class="list-item__text">
                    <div class="text">
                      <p>Bereich · Thema · Typ · Zielgruppe · <span class="list-item__text--badge">Abgeschlossen</span></p>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="list-item__quickinfo">
              <div class="quickinfo">
                <div class="quickinfo__button-wrap"><button class="icon-button quickinfo__button" type="button" aria-expanded="false" aria-controls="id-dd79-content" id="id-dd79-title"><svg class="icon icon--list icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-0bff-title">
                      <title id="icon-0bff-title">Schnellinfo zeigen</title>
                      <use xlink:href="#icon-list"></use>
                    </svg></button></div>
                <article class="quickinfo__panel" id="id-dd79-content" aria-labelledby="id-dd79-title">
                  <div class="quickinfo__content" tabindex="-1">
                    <div class="quickinfo__content-inner">
                      <div class="quickinfo__block" id="block-id-2cb4">
                        <h2 class="headline headline--3">Talent im Land</h2>
                      </div>
                      <div class="quickinfo__block" id="block-id-228d">
                        <div class="meta-info meta-info--vertical">
                          <dl class="meta-info__list">
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Bereich</dt>
                              <dd class="meta-info__content">Forschung</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Typ</dt>
                              <dd class="meta-info__content">Programm</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Thema</dt>
                              <dd class="meta-info__content">Technologie, Wissenschaft, MINT</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Zielgruppe</dt>
                              <dd class="meta-info__content">Schülerinnen &amp; Schüler</dd>
                            </div>
                            <div class="meta-info__item meta-info__item--badge">
                              <dt class="meta-info__label">Status</dt>
                              <dd class="meta-info__content">Abgeschlossen</dd>
                            </div>
                          </dl>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-1279">
                        <div class="text">
                          <p><b>Kurzbeschreibung</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-7681">
                        <div class="text">
                          <p><b>Ziel</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-129e">
                        <div class="text">
                          <p><b>Kurzbeschreibung2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-04d5">
                        <div class="text">
                          <p><b>Ziel2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-2151"><a class="button button--primary" href="#"><svg class="icon icon--arrow-right button__icon" viewBox="0 0 200 200">
                            <use xlink:href="#icon-arrow-right"></use>
                          </svg><span class="button__text">Zum Programm</span></a></div><button class="icon-button icon-button--secondary quickinfo__close" type="button"><svg class="icon icon--close icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-bf78-title">
                          <title id="icon-bf78-title">Schnellinfo schließen</title>
                          <use xlink:href="#icon-close"></use>
                        </svg></button>
                    </div>
                  </div>
                </article>
              </div>
            </div>
          </article>
        </div>
        <div class="list__list-item">
          <article class="list-item list-item--tender">
            <div class="list-item__inner">
              <div class="list-item__content">
                <div class="list-item__content-inner"><a class="list-item__headline js-overlay-link" href="#" data-overlay-target="list-item__content-inner">
                    <h2 class="headline headline--5 list-item__headline-text">Artur Fischer Erfinderpreis</h2>
                  </a>
                  <div class="list-item__text">
                    <div class="text">
                      <p>Bereich · Thema · Typ · Zielgruppe · <span class="list-item__text--badge">Abgeschlossen</span></p>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="list-item__quickinfo">
              <div class="quickinfo">
                <div class="quickinfo__button-wrap"><button class="icon-button quickinfo__button" type="button" aria-expanded="false" aria-controls="id-faba-content" id="id-faba-title"><svg class="icon icon--list icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-ddc1-title">
                      <title id="icon-ddc1-title">Schnellinfo zeigen</title>
                      <use xlink:href="#icon-list"></use>
                    </svg></button></div>
                <article class="quickinfo__panel" id="id-faba-content" aria-labelledby="id-faba-title">
                  <div class="quickinfo__content" tabindex="-1">
                    <div class="quickinfo__content-inner">
                      <div class="quickinfo__block" id="block-id-52f1">
                        <h2 class="headline headline--3">Talent im Land</h2>
                      </div>
                      <div class="quickinfo__block" id="block-id-63e3">
                        <div class="meta-info meta-info--vertical">
                          <dl class="meta-info__list">
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Bereich</dt>
                              <dd class="meta-info__content">Forschung</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Typ</dt>
                              <dd class="meta-info__content">Programm</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Thema</dt>
                              <dd class="meta-info__content">Technologie, Wissenschaft, MINT</dd>
                            </div>
                            <div class="meta-info__item">
                              <dt class="meta-info__label">Zielgruppe</dt>
                              <dd class="meta-info__content">Schülerinnen &amp; Schüler</dd>
                            </div>
                            <div class="meta-info__item meta-info__item--badge">
                              <dt class="meta-info__label">Status</dt>
                              <dd class="meta-info__content">Abgeschlossen</dd>
                            </div>
                          </dl>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-47dc">
                        <div class="text">
                          <p><b>Kurzbeschreibung</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-ba46">
                        <div class="text">
                          <p><b>Ziel</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-3297">
                        <div class="text">
                          <p><b>Kurzbeschreibung2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. sed diam nonumy eirmod tempor invidunt ut labore et dolore</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-4d85">
                        <div class="text">
                          <p><b>Ziel2</b> <br />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
                        </div>
                      </div>
                      <div class="quickinfo__block" id="block-id-cf72"><a class="button button--primary" href="#"><svg class="icon icon--arrow-right button__icon" viewBox="0 0 200 200">
                            <use xlink:href="#icon-arrow-right"></use>
                          </svg><span class="button__text">Zum Programm</span></a></div><button class="icon-button icon-button--secondary quickinfo__close" type="button"><svg class="icon icon--close icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-6e6d-title">
                          <title id="icon-6e6d-title">Schnellinfo schließen</title>
                          <use xlink:href="#icon-close"></use>
                        </svg></button>
                    </div>
                  </div>
                </article>
              </div>
            </div>
          </article>
        </div>
      </div>
    </div>
    <div class="list__pagination">
      <div class="pagination" aria-label="Seitennavigation">
        <div class="pagination__inner">
          <div class="pagination__prev"><a class="icon-button icon-button--secondary" href="#" rel="prev"><svg class="icon icon--arrow-left icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-4aab-title">
                <title id="icon-4aab-title">List</title>
                <use xlink:href="#icon-arrow-left"></use>
              </svg></a></div>
          <ul class="pagination__list">
            <li class="pagination__item"><a class="pagination__link" href="#"><span class="u-hidden-visually">Seite:</span>1</a></li>
            <li class="pagination__item"><a class="pagination__link" href="#"><span class="u-hidden-visually">Seite:</span>2</a></li>
            <li class="pagination__item pagination__item--current"><a class="pagination__link pagination__link--current" href="#" aria-current="page"><span class="u-hidden-visually">Seite:</span>3</a></li>
            <li class="pagination__item"><a class="pagination__link" href="#"><span class="u-hidden-visually">Seite:</span>4</a></li>
            <li class="pagination__item"><a class="pagination__link" href="#"><span class="u-hidden-visually">Seite:</span>5</a></li>
          </ul>
          <div class="pagination__next"><a class="icon-button icon-button--secondary" href="#" rel="next"><svg class="icon icon--arrow-right icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-297f-title">
                <title id="icon-297f-title">List</title>
                <use xlink:href="#icon-arrow-right"></use>
              </svg></a></div>
        </div>
      </div>
    </div>
  </div>
</section>

{
  "headline": {
    "level": 2,
    "size": 1,
    "text": "#[span.f-w-normal Unsere]#[br]Programme\n"
  },
  "pagination": true,
  "results": {
    "text": "52 Ergebnisse gefunden"
  },
  "sort": true,
  "formListFilter": {
    "fields": [
      {
        "name": "bereich",
        "use": "select",
        "settings": {
          "attr": {
            "aria-label": "Bereich auswählen"
          },
          "hasPleaseSelectOption": null,
          "options": [
            "Bereich",
            "Bereich 1",
            "Bereich 2",
            "Bereich 3"
          ]
        }
      },
      {
        "name": "thema",
        "use": "select",
        "settings": {
          "attr": {
            "aria-label": "Thema auswählen"
          },
          "hasPleaseSelectOption": null,
          "options": [
            "Thema",
            "Thema 1",
            "Thema 2",
            "Thema 3"
          ]
        }
      },
      {
        "name": "typ",
        "use": "select",
        "settings": {
          "attr": {
            "aria-label": "Typ auswählen"
          },
          "hasPleaseSelectOption": null,
          "options": [
            "Typ",
            "Typ 1",
            "Typ 2",
            "Typ 3"
          ]
        }
      },
      {
        "name": "zielgruppe",
        "use": "select",
        "settings": {
          "attr": {
            "aria-label": "Zielgruppe auswählen"
          },
          "hasPleaseSelectOption": null,
          "options": [
            "Zielgruppe",
            "Zielgruppe 1",
            "Zielgruppe 2",
            "Zielgruppe 3"
          ]
        }
      },
      {
        "name": "status",
        "use": "select",
        "settings": {
          "attr": {
            "aria-label": "Status auswählen"
          },
          "hasPleaseSelectOption": null,
          "options": [
            "Aktuell",
            "Abgeschlossen",
            "Beide"
          ]
        }
      }
    ],
    "button": {
      "link": null,
      "type": "submit",
      "text": "Filter anwenden",
      "icon": "search"
    }
  },
  "numberOfItems": true,
  "filterTag": {
    "items": [
      {
        "link": "#",
        "text": "Forschung"
      },
      {
        "link": "#",
        "text": "Stipendium"
      },
      {
        "link": "#",
        "text": "ab 2019"
      }
    ]
  },
  "items": null,
  "sections": [
    {
      "headline": {
        "text": "Aktuelle Programme",
        "level": 2,
        "size": 3
      },
      "items": [
        {
          "use": "list-item--quickinfo",
          "settings": {
            "kicker": null,
            "headline": {
              "text": "expedition D"
            },
            "text": {
              "content": [
                "p Forschung · Technologie, Wissenschaft, MINT · Programm · für Schüler*innen\n"
              ]
            }
          }
        },
        {
          "use": "list-item--quickinfo",
          "settings": {
            "kicker": null,
            "headline": {
              "text": "Coaching4Future"
            },
            "text": {
              "content": [
                "p Bereich · Thema · Typ · Zielgruppe\n"
              ]
            },
            "tender": null
          }
        },
        {
          "use": "list-item--quickinfo",
          "settings": {
            "kicker": null,
            "headline": {
              "text": "Artur Fischer Erfinderpreis"
            },
            "text": {
              "content": [
                "p Bereich · Thema · Typ · Zielgruppe\n"
              ]
            }
          }
        },
        {
          "use": "list-item--quickinfo",
          "settings": {
            "kicker": null,
            "headline": {
              "text": "expedition D"
            },
            "text": {
              "content": [
                "p Forschung · Technologie, Wissenschaft, MINT · Programm · für Schüler*innen\n"
              ]
            },
            "tender": null
          }
        },
        {
          "use": "list-item--quickinfo",
          "settings": {
            "kicker": null,
            "headline": {
              "text": "Name des Programms"
            },
            "text": {
              "content": [
                "p Bereich · Thema · Typ · Zielgruppe\n"
              ]
            },
            "tender": null
          }
        },
        {
          "use": "list-item--quickinfo",
          "settings": {
            "kicker": null,
            "headline": {
              "text": "Name des Programms"
            },
            "text": {
              "content": [
                "p Bereich · Thema · Typ · Zielgruppe\n"
              ]
            },
            "tender": null
          }
        },
        {
          "use": "list-item--quickinfo",
          "settings": {
            "kicker": null,
            "headline": {
              "text": "expedition D"
            },
            "text": {
              "content": [
                "p Forschung · Technologie, Wissenschaft, MINT · Programm · für Schüler*innen\n"
              ]
            },
            "tender": null
          }
        },
        {
          "use": "list-item--quickinfo",
          "settings": {
            "kicker": null,
            "headline": {
              "text": "Coaching4Future"
            },
            "text": {
              "content": [
                "p Bereich · Thema · Typ · Zielgruppe\n"
              ]
            },
            "tender": null
          }
        },
        {
          "use": "list-item--quickinfo",
          "settings": {
            "kicker": null,
            "headline": {
              "text": "Artur Fischer Erfinderpreis"
            },
            "text": {
              "content": [
                "p Bereich · Thema · Typ · Zielgruppe\n"
              ]
            }
          }
        }
      ]
    },
    {
      "headline": {
        "text": "Abgeschlossene Programme",
        "level": 2,
        "size": 3
      },
      "items": [
        {
          "use": "list-item--finished",
          "settings": {
            "type": "tender",
            "kicker": null,
            "headline": {
              "text": "expedition D"
            },
            "text": {
              "content": [
                "p Forschung · Technologie, Wissenschaft, MINT · Programm · für Schüler*innen · Abgeschlossen\n"
              ]
            }
          }
        },
        {
          "use": "list-item--finished",
          "settings": {
            "type": "tender",
            "kicker": null,
            "headline": {
              "text": "Coaching4Future"
            },
            "text": {
              "content": [
                "p Bereich · Thema · Typ · Zielgruppe · Abgeschlossen\n"
              ]
            },
            "tender": null
          }
        },
        {
          "use": "list-item--finished",
          "settings": {
            "type": "tender",
            "kicker": null,
            "headline": {
              "text": "Artur Fischer Erfinderpreis"
            },
            "text": {
              "content": [
                "p Bereich · Thema · Typ · Zielgruppe · Abgeschlossen\n"
              ]
            }
          }
        },
        {
          "use": "list-item--finished",
          "settings": {
            "type": "tender",
            "kicker": null,
            "headline": {
              "text": "expedition D"
            },
            "text": {
              "content": [
                "p Forschung · Technologie, Wissenschaft, MINT · Programm · für Schüler*innen · Abgeschlossen\n"
              ]
            },
            "tender": null
          }
        },
        {
          "use": "list-item--finished",
          "settings": {
            "type": "tender",
            "kicker": null,
            "headline": {
              "text": "Name des Programms"
            },
            "text": {
              "content": [
                "p Bereich · Thema · Typ · Zielgruppe · Abgeschlossen\n"
              ]
            },
            "tender": null
          }
        },
        {
          "use": "list-item--finished",
          "settings": {
            "type": "tender",
            "kicker": null,
            "headline": {
              "text": "Name des Programms"
            },
            "text": {
              "content": [
                "p Bereich · Thema · Typ · Zielgruppe · Abgeschlossen\n"
              ]
            },
            "tender": null
          }
        },
        {
          "use": "list-item--finished",
          "settings": {
            "type": "tender",
            "kicker": null,
            "headline": {
              "text": "expedition D"
            },
            "text": {
              "content": [
                "p Forschung · Technologie, Wissenschaft, MINT · Programm · für Schüler*innen · Abgeschlossen\n"
              ]
            },
            "tender": null
          }
        },
        {
          "use": "list-item--finished",
          "settings": {
            "type": "tender",
            "kicker": null,
            "headline": {
              "text": "Coaching4Future"
            },
            "text": {
              "content": [
                "p Bereich · Thema · Typ · Zielgruppe · Abgeschlossen\n"
              ]
            }
          }
        },
        {
          "use": "list-item--finished",
          "settings": {
            "type": "tender",
            "kicker": null,
            "headline": {
              "text": "Artur Fischer Erfinderpreis"
            },
            "text": {
              "content": [
                "p Bereich · Thema · Typ · Zielgruppe · Abgeschlossen\n"
              ]
            }
          }
        }
      ]
    }
  ]
}