<div class="calendar calendar--list">
  <div class="calendar__filter">
    <div class="calendar__filter__inner"><button class="calendar__filter__close" type="button"><svg class="icon icon--close" viewBox="0 0 200 200">
          <use xlink:href="#icon-close"></use>
        </svg></button>
      <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">
                <div class="filter"><button class="filter__toggle" type="button" aria-expanded="false">Ort</button>
                  <div class="filter__items">
                    <div class="filter__item"><label class="checkbox" for="checkbox-dc2a"><input class="checkbox__input" type="checkbox" id="checkbox-dc2a" name="checkbox-dc2a" /><span class="checkbox__indicator"><svg class="icon icon--check checkbox__indicator-icon" viewBox="0 0 200 200">
  <use xlink:href="#icon-check"></use>
</svg></span><span class="checkbox__label">Ort 1</span></label></div>
                    <div class="filter__item"><label class="checkbox" for="checkbox-fd0f"><input class="checkbox__input" type="checkbox" id="checkbox-fd0f" name="checkbox-fd0f" /><span class="checkbox__indicator"><svg class="icon icon--check checkbox__indicator-icon" viewBox="0 0 200 200">
  <use xlink:href="#icon-check"></use>
</svg></span><span class="checkbox__label">Ort 2</span></label></div>
                    <div class="filter__item"><label class="checkbox" for="checkbox-e23f"><input class="checkbox__input" type="checkbox" id="checkbox-e23f" name="checkbox-e23f" /><span class="checkbox__indicator"><svg class="icon icon--check checkbox__indicator-icon" viewBox="0 0 200 200">
  <use xlink:href="#icon-check"></use>
</svg></span><span class="checkbox__label">Ort 3</span></label></div>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="form-list-filter__field">
            <div class="form-group">
              <div class="form-group__input">
                <div class="filter"><button class="filter__toggle" type="button" aria-expanded="false">Art</button>
                  <div class="filter__items">
                    <div class="filter__item"><label class="checkbox" for="checkbox-f593"><input class="checkbox__input" type="checkbox" id="checkbox-f593" name="checkbox-f593" /><span class="checkbox__indicator"><svg class="icon icon--check checkbox__indicator-icon" viewBox="0 0 200 200">
  <use xlink:href="#icon-check"></use>
</svg></span><span class="checkbox__label">Art 1</span></label></div>
                    <div class="filter__item"><label class="checkbox" for="checkbox-b9c3"><input class="checkbox__input" type="checkbox" id="checkbox-b9c3" name="checkbox-b9c3" /><span class="checkbox__indicator"><svg class="icon icon--check checkbox__indicator-icon" viewBox="0 0 200 200">
  <use xlink:href="#icon-check"></use>
</svg></span><span class="checkbox__label">Art 2 with a verylongnamenameartname</span></label></div>
                    <div class="filter__item"><label class="checkbox" for="checkbox-264f"><input class="checkbox__input" type="checkbox" id="checkbox-264f" name="checkbox-264f" /><span class="checkbox__indicator"><svg class="icon icon--check checkbox__indicator-icon" viewBox="0 0 200 200">
  <use xlink:href="#icon-check"></use>
</svg></span><span class="checkbox__label">Art 3</span></label></div>
                    <div class="filter__item"><label class="checkbox" for="checkbox-ba68"><input class="checkbox__input" type="checkbox" id="checkbox-ba68" name="checkbox-ba68" /><span class="checkbox__indicator"><svg class="icon icon--check checkbox__indicator-icon" viewBox="0 0 200 200">
  <use xlink:href="#icon-check"></use>
</svg></span><span class="checkbox__label">Art 4</span></label></div>
                    <div class="filter__item"><label class="checkbox" for="checkbox-48c7"><input class="checkbox__input" type="checkbox" id="checkbox-48c7" name="checkbox-48c7" /><span class="checkbox__indicator"><svg class="icon icon--check checkbox__indicator-icon" viewBox="0 0 200 200">
  <use xlink:href="#icon-check"></use>
</svg></span><span class="checkbox__label">Art 5 with a verylong&shy;namenameartname</span></label></div>
                    <div class="filter__item"><label class="checkbox" for="checkbox-f2aa"><input class="checkbox__input" type="checkbox" id="checkbox-f2aa" name="checkbox-f2aa" /><span class="checkbox__indicator"><svg class="icon icon--check checkbox__indicator-icon" viewBox="0 0 200 200">
  <use xlink:href="#icon-check"></use>
</svg></span><span class="checkbox__label">Art 6</span></label></div>
                    <div class="filter__item"><label class="checkbox" for="checkbox-9ee9"><input class="checkbox__input" type="checkbox" id="checkbox-9ee9" name="checkbox-9ee9" /><span class="checkbox__indicator"><svg class="icon icon--check checkbox__indicator-icon" viewBox="0 0 200 200">
  <use xlink:href="#icon-check"></use>
</svg></span><span class="checkbox__label">Art 7</span></label></div>
                    <div class="filter__item"><label class="checkbox" for="checkbox-b74e"><input class="checkbox__input" type="checkbox" id="checkbox-b74e" name="checkbox-b74e" /><span class="checkbox__indicator"><svg class="icon icon--check checkbox__indicator-icon" viewBox="0 0 200 200">
  <use xlink:href="#icon-check"></use>
</svg></span><span class="checkbox__label">Art 8 with a verylongnamenameartname</span></label></div>
                    <div class="filter__item"><label class="checkbox" for="checkbox-13ba"><input class="checkbox__input" type="checkbox" id="checkbox-13ba" name="checkbox-13ba" /><span class="checkbox__indicator"><svg class="icon icon--check checkbox__indicator-icon" viewBox="0 0 200 200">
  <use xlink:href="#icon-check"></use>
</svg></span><span class="checkbox__label">Art 9</span></label></div>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="form-list-filter__field">
            <div class="form-group">
              <div class="form-group__input">
                <div class="filter"><button class="filter__toggle" type="button" aria-expanded="false">Veranstalter</button>
                  <div class="filter__items">
                    <div class="filter__item"><label class="checkbox" for="checkbox-09b4"><input class="checkbox__input" type="checkbox" id="checkbox-09b4" name="checkbox-09b4" /><span class="checkbox__indicator"><svg class="icon icon--check checkbox__indicator-icon" viewBox="0 0 200 200">
  <use xlink:href="#icon-check"></use>
</svg></span><span class="checkbox__label">Veranstalter 1</span></label></div>
                    <div class="filter__item"><label class="checkbox" for="checkbox-cdd4"><input class="checkbox__input" type="checkbox" id="checkbox-cdd4" name="checkbox-cdd4" /><span class="checkbox__indicator"><svg class="icon icon--check checkbox__indicator-icon" viewBox="0 0 200 200">
  <use xlink:href="#icon-check"></use>
</svg></span><span class="checkbox__label">Veranstalter 2</span></label></div>
                    <div class="filter__item"><label class="checkbox" for="checkbox-855b"><input class="checkbox__input" type="checkbox" id="checkbox-855b" name="checkbox-855b" /><span class="checkbox__indicator"><svg class="icon icon--check checkbox__indicator-icon" viewBox="0 0 200 200">
  <use xlink:href="#icon-check"></use>
</svg></span><span class="checkbox__label">Veranstalter 3</span></label></div>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="form-list-filter__field">
            <div class="form-group">
              <div class="form-group__input">
                <div class="filter"><button class="filter__toggle" type="button" aria-expanded="false">Datum</button>
                  <div class="filter__items">
                    <div class="filter__item">
                      <div class="filter__item__period">
                        <div class="period">
                          <div class="period__row">
                            <div class="period__label">Von:</div>
                            <div class="period__input"><input class="input" id="start_date_created" type="date" /></div>
                          </div>
                          <div class="period__row">
                            <div class="period__label">Bis:</div>
                            <div class="period__input"><input class="input" id="end_date_created" type="date" /></div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </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="calendar__filter-tag-group">
        <div class="filter-tag-group">
          <ul class="filter-tag-group__items" aria-labelledby="filter-tag-group-13d2">
            <li class="filter-tag-group__item"><a class="filter-tag" href="#"><span class="filter-tag__text">Lesung<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">Theater<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>
  <nav class="calendar__nav"><button class="calendar__open-filter" type="button"><svg class="icon icon--filter" viewBox="0 0 200 200">
        <use xlink:href="#icon-filter"></use>
      </svg><span class="calendar__open-filter__badge">2</span></button></nav>
  <div class="calendar__days">
    <div class="calendar__day">
      <div class="calendar__day__inner">
        <div class="calendar__day__meta">
          <div class="calendar__day__meta__text"><span class="calendar__day__meta__text__day"></span><span class="calendar__day__meta__text__date">22.08. -<span class="calendar__day__meta__text__hyphen">-</span></span><span class="calendar__day__meta__text__date-second">11.10.24</span></div>
        </div>
        <div class="calendar__day__main">
          <div class="calendar__day__list">
            <div class="calendar__day__list__item">
              <div class="calendar-banner">
                <div class="calendar-banner__main">
                  <div class="calendar-banner__info">
                    <div class="calendar-banner__info__item"><svg class="icon icon--grid-event" viewBox="0 0 200 200">
                        <use xlink:href="#icon-grid-event"></use>
                      </svg><span class="calendar-banner__info__text">Messe Stuttgart</span></div>
                    <div class="calendar-banner__info__item"><svg class="icon icon--location" viewBox="0 0 200 200">
                        <use xlink:href="#icon-location"></use>
                      </svg><span class="calendar-banner__info__text">Stuttgart</span></div>
                  </div><a class="calendar-banner__a" href="#">
                    <div class="calendar-banner__headline">
                      <h4 class="headline headline--5">Hand in Hand – das Unterstützungs- und Vernetzungsangebot im Gesunden Boot</h4>
                    </div>
                  </a>
                </div>
                <div class="calendar-banner__button"><a class="icon-button icon-button--secondary js-overlay-link" href="#" data-overlay-target="calendar-banner"><svg class="icon icon--arrow-right icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-a9eb-title">
                      <title id="icon-a9eb-title">List</title>
                      <use xlink:href="#icon-arrow-right"></use>
                    </svg></a></div>
              </div>
            </div>
            <div class="calendar__day__list__item">
              <div class="calendar-banner">
                <div class="calendar-banner__main">
                  <div class="calendar-banner__info">
                    <div class="calendar-banner__info__item"><svg class="icon icon--grid-event" viewBox="0 0 200 200">
                        <use xlink:href="#icon-grid-event"></use>
                      </svg><span class="calendar-banner__info__text">Tage der offenen Tür</span></div>
                    <div class="calendar-banner__info__item"><svg class="icon icon--location" viewBox="0 0 200 200">
                        <use xlink:href="#icon-location"></use>
                      </svg><span class="calendar-banner__info__text">Stuttgart</span></div>
                  </div><a class="calendar-banner__a" href="#">
                    <div class="calendar-banner__headline">
                      <h4 class="headline headline--5">Kindergarten Basis Fortbildung</h4>
                    </div>
                  </a>
                </div>
                <div class="calendar-banner__button"><a class="icon-button icon-button--secondary js-overlay-link" href="#" data-overlay-target="calendar-banner"><svg class="icon icon--arrow-right icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-ca61-title">
                      <title id="icon-ca61-title">List</title>
                      <use xlink:href="#icon-arrow-right"></use>
                    </svg></a></div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="calendar__day">
      <div class="calendar__day__inner">
        <div class="calendar__day__meta">
          <div class="calendar__day__meta__text"><span class="calendar__day__meta__text__day"></span><span class="calendar__day__meta__text__date">12.11. -<span class="calendar__day__meta__text__hyphen">-</span></span><span class="calendar__day__meta__text__date-second">11.12.24</span></div>
        </div>
        <div class="calendar__day__main">
          <div class="calendar__day__list">
            <div class="calendar__day__list__item">
              <div class="calendar-banner">
                <div class="calendar-banner__main">
                  <div class="calendar-banner__info">
                    <div class="calendar-banner__info__item"><svg class="icon icon--grid-event" viewBox="0 0 200 200">
                        <use xlink:href="#icon-grid-event"></use>
                      </svg><span class="calendar-banner__info__text">Schnupperstudium</span></div>
                    <div class="calendar-banner__info__item"><svg class="icon icon--location" viewBox="0 0 200 200">
                        <use xlink:href="#icon-location"></use>
                      </svg><span class="calendar-banner__info__text">Stuttgart</span></div>
                  </div><a class="calendar-banner__a" href="#">
                    <div class="calendar-banner__headline">
                      <h4 class="headline headline--5">Grundschule Basis Fortbildung</h4>
                    </div>
                  </a>
                </div>
                <div class="calendar-banner__button"><a class="icon-button icon-button--secondary js-overlay-link" href="#" data-overlay-target="calendar-banner"><svg class="icon icon--arrow-right icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-2919-title">
                      <title id="icon-2919-title">List</title>
                      <use xlink:href="#icon-arrow-right"></use>
                    </svg></a></div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="calendar__day">
      <div class="calendar__day__inner">
        <div class="calendar__day__meta">
          <div class="calendar__day__meta__text"><span class="calendar__day__meta__text__day"></span><span class="calendar__day__meta__text__date">30.09.<span class="calendar__day__meta__text__hyphen">-</span></span><span class="calendar__day__meta__text__date-second">31.09.</span></div>
        </div>
        <div class="calendar__day__main">
          <div class="calendar__day__list">
            <div class="calendar__day__list__item">
              <div class="calendar-banner">
                <div class="calendar-banner__main">
                  <div class="calendar-banner__info">
                    <div class="calendar-banner__info__item"><svg class="icon icon--grid-event" viewBox="0 0 200 200">
                        <use xlink:href="#icon-grid-event"></use>
                      </svg><span class="calendar-banner__info__text">Messe Stuttgart</span></div>
                    <div class="calendar-banner__info__item"><svg class="icon icon--location" viewBox="0 0 200 200">
                        <use xlink:href="#icon-location"></use>
                      </svg><span class="calendar-banner__info__text">Stuttgart</span></div>
                  </div><a class="calendar-banner__a" href="#">
                    <div class="calendar-banner__headline">
                      <h4 class="headline headline--5">U3 Basis Fortbildung</h4>
                    </div>
                  </a>
                </div>
                <div class="calendar-banner__button"><a class="icon-button icon-button--secondary js-overlay-link" href="#" data-overlay-target="calendar-banner"><svg class="icon icon--arrow-right icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-b726-title">
                      <title id="icon-b726-title">List</title>
                      <use xlink:href="#icon-arrow-right"></use>
                    </svg></a></div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="calendar__day">
      <div class="calendar__day__inner">
        <div class="calendar__day__meta">
          <div class="calendar__day__meta__text"><span class="calendar__day__meta__text__day"></span><span class="calendar__day__meta__text__date">28.09<span class="calendar__day__meta__text__hyphen">-</span></span><span class="calendar__day__meta__text__date-second">30.09.</span></div>
        </div>
        <div class="calendar__day__main">
          <div class="calendar__day__list">
            <div class="calendar__day__list__item">
              <div class="calendar-banner">
                <div class="calendar-banner__main">
                  <div class="calendar-banner__info">
                    <div class="calendar-banner__info__item"><svg class="icon icon--grid-event" viewBox="0 0 200 200">
                        <use xlink:href="#icon-grid-event"></use>
                      </svg><span class="calendar-banner__info__text">Messe Stuttgart</span></div>
                    <div class="calendar-banner__info__item"><svg class="icon icon--location" viewBox="0 0 200 200">
                        <use xlink:href="#icon-location"></use>
                      </svg><span class="calendar-banner__info__text">Stuttgart</span></div>
                  </div><a class="calendar-banner__a" href="#">
                    <div class="calendar-banner__headline">
                      <h4 class="headline headline--5">Hand in Hand – das Unterstützungs- und Vernetzungsangebot im Gesunden Boot</h4>
                    </div>
                  </a>
                </div>
                <div class="calendar-banner__button"><a class="icon-button icon-button--secondary js-overlay-link" href="#" data-overlay-target="calendar-banner"><svg class="icon icon--arrow-right icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-04c3-title">
                      <title id="icon-04c3-title">List</title>
                      <use xlink:href="#icon-arrow-right"></use>
                    </svg></a></div>
              </div>
            </div>
            <div class="calendar__day__list__item">
              <div class="calendar-banner">
                <div class="calendar-banner__main">
                  <div class="calendar-banner__info">
                    <div class="calendar-banner__info__item"><svg class="icon icon--grid-event" viewBox="0 0 200 200">
                        <use xlink:href="#icon-grid-event"></use>
                      </svg><span class="calendar-banner__info__text">Messe Stuttgart</span></div>
                    <div class="calendar-banner__info__item"><svg class="icon icon--location" viewBox="0 0 200 200">
                        <use xlink:href="#icon-location"></use>
                      </svg><span class="calendar-banner__info__text">Stuttgart</span></div>
                  </div><a class="calendar-banner__a" href="#">
                    <div class="calendar-banner__headline">
                      <h4 class="headline headline--5">Kindergarten Basis Fortbildung</h4>
                    </div>
                  </a>
                </div>
                <div class="calendar-banner__button"><a class="icon-button icon-button--secondary js-overlay-link" href="#" data-overlay-target="calendar-banner"><svg class="icon icon--arrow-right icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-cf72-title">
                      <title id="icon-cf72-title">List</title>
                      <use xlink:href="#icon-arrow-right"></use>
                    </svg></a></div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="calendar__day">
      <div class="calendar__day__inner">
        <div class="calendar__day__meta">
          <div class="calendar__day__meta__text"><span class="calendar__day__meta__text__day"></span><span class="calendar__day__meta__text__date">29.09<span class="calendar__day__meta__text__hyphen">-</span></span><span class="calendar__day__meta__text__date-second">30.09.</span></div>
        </div>
        <div class="calendar__day__main">
          <div class="calendar__day__list">
            <div class="calendar__day__list__item">
              <div class="calendar-banner">
                <div class="calendar-banner__main">
                  <div class="calendar-banner__info">
                    <div class="calendar-banner__info__item"><svg class="icon icon--grid-event" viewBox="0 0 200 200">
                        <use xlink:href="#icon-grid-event"></use>
                      </svg><span class="calendar-banner__info__text">Messe Stuttgart</span></div>
                    <div class="calendar-banner__info__item"><svg class="icon icon--location" viewBox="0 0 200 200">
                        <use xlink:href="#icon-location"></use>
                      </svg><span class="calendar-banner__info__text">Stuttgart</span></div>
                  </div><a class="calendar-banner__a" href="#">
                    <div class="calendar-banner__headline">
                      <h4 class="headline headline--5">Grundschule Basis Fortbildung</h4>
                    </div>
                  </a>
                </div>
                <div class="calendar-banner__button"><a class="icon-button icon-button--secondary js-overlay-link" href="#" data-overlay-target="calendar-banner"><svg class="icon icon--arrow-right icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-502d-title">
                      <title id="icon-502d-title">List</title>
                      <use xlink:href="#icon-arrow-right"></use>
                    </svg></a></div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="calendar__day">
      <div class="calendar__day__inner">
        <div class="calendar__day__meta">
          <div class="calendar__day__meta__text"><span class="calendar__day__meta__text__day"></span><span class="calendar__day__meta__text__date">30.09.<span class="calendar__day__meta__text__hyphen">-</span></span><span class="calendar__day__meta__text__date-second">31.09.</span></div>
        </div>
        <div class="calendar__day__main">
          <div class="calendar__day__list">
            <div class="calendar__day__list__item">
              <div class="calendar-banner">
                <div class="calendar-banner__main">
                  <div class="calendar-banner__info">
                    <div class="calendar-banner__info__item"><svg class="icon icon--grid-event" viewBox="0 0 200 200">
                        <use xlink:href="#icon-grid-event"></use>
                      </svg><span class="calendar-banner__info__text">Messe Stuttgart</span></div>
                    <div class="calendar-banner__info__item"><svg class="icon icon--location" viewBox="0 0 200 200">
                        <use xlink:href="#icon-location"></use>
                      </svg><span class="calendar-banner__info__text">Stuttgart</span></div>
                  </div><a class="calendar-banner__a" href="#">
                    <div class="calendar-banner__headline">
                      <h4 class="headline headline--5">U3 Basis Fortbildung</h4>
                    </div>
                  </a>
                </div>
                <div class="calendar-banner__button"><a class="icon-button icon-button--secondary js-overlay-link" href="#" data-overlay-target="calendar-banner"><svg class="icon icon--arrow-right icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-69db-title">
                      <title id="icon-69db-title">List</title>
                      <use xlink:href="#icon-arrow-right"></use>
                    </svg></a></div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="calendar__day">
      <div class="calendar__year">
        <h2 class="headline headline--2">2023</h2>
      </div>
    </div>
    <div class="calendar__day">
      <div class="calendar__day__inner">
        <div class="calendar__day__meta">
          <div class="calendar__day__meta__text"><span class="calendar__day__meta__text__day"></span><span class="calendar__day__meta__text__date">03.01.<span class="calendar__day__meta__text__hyphen">-</span></span><span class="calendar__day__meta__text__date-second">05.01.</span></div>
        </div>
        <div class="calendar__day__main">
          <div class="calendar__day__list">
            <div class="calendar__day__list__item">
              <div class="calendar-banner">
                <div class="calendar-banner__main">
                  <div class="calendar-banner__info">
                    <div class="calendar-banner__info__item"><svg class="icon icon--grid-event" viewBox="0 0 200 200">
                        <use xlink:href="#icon-grid-event"></use>
                      </svg><span class="calendar-banner__info__text">Messe Stuttgart</span></div>
                    <div class="calendar-banner__info__item"><svg class="icon icon--location" viewBox="0 0 200 200">
                        <use xlink:href="#icon-location"></use>
                      </svg><span class="calendar-banner__info__text">Stuttgart</span></div>
                  </div><a class="calendar-banner__a" href="#">
                    <div class="calendar-banner__headline">
                      <h4 class="headline headline--5">Hand in Hand – das Unterstützungs- und Vernetzungsangebot im Gesunden Boot</h4>
                    </div>
                  </a>
                </div>
                <div class="calendar-banner__button"><a class="icon-button icon-button--secondary js-overlay-link" href="#" data-overlay-target="calendar-banner"><svg class="icon icon--arrow-right icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-9296-title">
                      <title id="icon-9296-title">List</title>
                      <use xlink:href="#icon-arrow-right"></use>
                    </svg></a></div>
              </div>
            </div>
            <div class="calendar__day__list__item">
              <div class="calendar-banner">
                <div class="calendar-banner__main">
                  <div class="calendar-banner__info">
                    <div class="calendar-banner__info__item"><svg class="icon icon--grid-event" viewBox="0 0 200 200">
                        <use xlink:href="#icon-grid-event"></use>
                      </svg><span class="calendar-banner__info__text">Messe Stuttgart</span></div>
                    <div class="calendar-banner__info__item"><svg class="icon icon--location" viewBox="0 0 200 200">
                        <use xlink:href="#icon-location"></use>
                      </svg><span class="calendar-banner__info__text">Stuttgart</span></div>
                  </div><a class="calendar-banner__a" href="#">
                    <div class="calendar-banner__headline">
                      <h4 class="headline headline--5">Kindergarten Basis Fortbildung</h4>
                    </div>
                  </a>
                </div>
                <div class="calendar-banner__button"><a class="icon-button icon-button--secondary js-overlay-link" href="#" data-overlay-target="calendar-banner"><svg class="icon icon--arrow-right icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-3f78-title">
                      <title id="icon-3f78-title">List</title>
                      <use xlink:href="#icon-arrow-right"></use>
                    </svg></a></div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="calendar__day">
      <div class="calendar__day__inner">
        <div class="calendar__day__meta">
          <div class="calendar__day__meta__text"><span class="calendar__day__meta__text__day"></span><span class="calendar__day__meta__text__date">28.01<span class="calendar__day__meta__text__hyphen">-</span></span><span class="calendar__day__meta__text__date-second">29.01.</span></div>
        </div>
        <div class="calendar__day__main">
          <div class="calendar__day__list">
            <div class="calendar__day__list__item">
              <div class="calendar-banner">
                <div class="calendar-banner__main">
                  <div class="calendar-banner__info">
                    <div class="calendar-banner__info__item"><svg class="icon icon--grid-event" viewBox="0 0 200 200">
                        <use xlink:href="#icon-grid-event"></use>
                      </svg><span class="calendar-banner__info__text">Messe Stuttgart</span></div>
                    <div class="calendar-banner__info__item"><svg class="icon icon--location" viewBox="0 0 200 200">
                        <use xlink:href="#icon-location"></use>
                      </svg><span class="calendar-banner__info__text">Stuttgart</span></div>
                  </div><a class="calendar-banner__a" href="#">
                    <div class="calendar-banner__headline">
                      <h4 class="headline headline--5">Grundschule Basis Fortbildung</h4>
                    </div>
                  </a>
                </div>
                <div class="calendar-banner__button"><a class="icon-button icon-button--secondary js-overlay-link" href="#" data-overlay-target="calendar-banner"><svg class="icon icon--arrow-right icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-171b-title">
                      <title id="icon-171b-title">List</title>
                      <use xlink:href="#icon-arrow-right"></use>
                    </svg></a></div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="calendar__day">
      <div class="calendar__day__inner">
        <div class="calendar__day__meta">
          <div class="calendar__day__meta__text"><span class="calendar__day__meta__text__day"></span><span class="calendar__day__meta__text__date">05.02<span class="calendar__day__meta__text__hyphen">-</span></span><span class="calendar__day__meta__text__date-second">08.02</span></div>
        </div>
        <div class="calendar__day__main">
          <div class="calendar__day__list">
            <div class="calendar__day__list__item">
              <div class="calendar-banner">
                <div class="calendar-banner__main">
                  <div class="calendar-banner__info">
                    <div class="calendar-banner__info__item"><svg class="icon icon--grid-event" viewBox="0 0 200 200">
                        <use xlink:href="#icon-grid-event"></use>
                      </svg><span class="calendar-banner__info__text">Messe Stuttgart</span></div>
                    <div class="calendar-banner__info__item"><svg class="icon icon--location" viewBox="0 0 200 200">
                        <use xlink:href="#icon-location"></use>
                      </svg><span class="calendar-banner__info__text">Stuttgart</span></div>
                  </div><a class="calendar-banner__a" href="#">
                    <div class="calendar-banner__headline">
                      <h4 class="headline headline--5">U3 Basis Fortbildung</h4>
                    </div>
                  </a>
                </div>
                <div class="calendar-banner__button"><a class="icon-button icon-button--secondary js-overlay-link" href="#" data-overlay-target="calendar-banner"><svg class="icon icon--arrow-right icon-button__icon" viewBox="0 0 200 200" role="img" aria-labelledby="icon-626e-title">
                      <title id="icon-626e-title">List</title>
                      <use xlink:href="#icon-arrow-right"></use>
                    </svg></a></div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="calendar__days__loadmore-button"><button class="button button--primary" type="button"><span class="button__text">Mehr laden</span></button></div>
  </div>
</div>

{
  "filterCloseIcon": "close",
  "filterOpenIcon": "filter",
  "filterOpenBadge": "2",
  "loadmoreButton": {
    "text": "Mehr laden",
    "link": null
  },
  "tabs": null,
  "filterTag": {
    "items": [
      {
        "link": "#",
        "text": "Lesung"
      },
      {
        "link": "#",
        "text": "Theater"
      }
    ]
  },
  "list": true,
  "formListFilter": {
    "fields": [
      {
        "name": "Ort",
        "use": "filter",
        "settings": {
          "title": "Ort",
          "items": [
            {
              "checkbox": {
                "text": "Ort 1"
              }
            },
            {
              "checkbox": {
                "text": "Ort 2"
              }
            },
            {
              "checkbox": {
                "text": "Ort 3"
              }
            }
          ]
        }
      },
      {
        "name": "Art",
        "use": "filter",
        "settings": {
          "title": "Art",
          "items": [
            {
              "checkbox": {
                "text": "Art 1"
              }
            },
            {
              "checkbox": {
                "text": "Art 2 with a verylongnamenameartname"
              }
            },
            {
              "checkbox": {
                "text": "Art 3"
              }
            },
            {
              "checkbox": {
                "text": "Art 4"
              }
            },
            {
              "checkbox": {
                "text": "Art 5 with a verylong­namenameartname"
              }
            },
            {
              "checkbox": {
                "text": "Art 6"
              }
            },
            {
              "checkbox": {
                "text": "Art 7"
              }
            },
            {
              "checkbox": {
                "text": "Art 8 with a verylongnamenameartname"
              }
            },
            {
              "checkbox": {
                "text": "Art 9"
              }
            }
          ]
        }
      },
      {
        "name": "Veranstalter",
        "use": "filter",
        "settings": {
          "title": "Veranstalter",
          "items": [
            {
              "checkbox": {
                "text": "Veranstalter 1"
              }
            },
            {
              "checkbox": {
                "text": "Veranstalter 2"
              }
            },
            {
              "checkbox": {
                "text": "Veranstalter 3"
              }
            }
          ]
        }
      },
      {
        "name": "Datum",
        "use": "filter--date-redux"
      }
    ]
  },
  "views": null,
  "items": [
    {
      "meta": {
        "day": null,
        "date": "22.08. -",
        "dateSecond": "11.10.24"
      },
      "items": [
        {
          "use": "calendar-banner",
          "settings": {
            "icon": null,
            "linkOverlayTarget": "calendar-banner",
            "headline": {
              "size": 5,
              "text": "Hand in Hand – das Unterstützungs- und Vernetzungsangebot im Gesunden Boot"
            },
            "text": null,
            "info": [
              {
                "icon": "grid-event",
                "text": "Messe Stuttgart"
              },
              {
                "icon": "location",
                "text": "Stuttgart"
              }
            ]
          }
        },
        {
          "use": "calendar-banner",
          "settings": {
            "icon": null,
            "linkOverlayTarget": "calendar-banner",
            "headline": {
              "size": 5,
              "text": "Kindergarten Basis Fortbildung"
            },
            "text": null,
            "info": [
              {
                "icon": "grid-event",
                "text": "Tage der offenen Tür"
              },
              {
                "icon": "location",
                "text": "Stuttgart"
              }
            ]
          }
        }
      ]
    },
    {
      "meta": {
        "day": null,
        "date": "12.11. -",
        "dateSecond": "11.12.24"
      },
      "items": [
        {
          "use": "calendar-banner",
          "settings": {
            "icon": null,
            "linkOverlayTarget": "calendar-banner",
            "headline": {
              "size": 5,
              "text": "Grundschule Basis Fortbildung"
            },
            "text": null,
            "info": [
              {
                "icon": "grid-event",
                "text": "Schnupperstudium"
              },
              {
                "icon": "location",
                "text": "Stuttgart"
              }
            ]
          }
        }
      ]
    },
    {
      "meta": {
        "day": null,
        "date": "30.09.",
        "dateSecond": "31.09."
      },
      "items": [
        {
          "use": "calendar-banner",
          "settings": {
            "icon": null,
            "linkOverlayTarget": "calendar-banner",
            "headline": {
              "size": 5,
              "text": "U3 Basis Fortbildung"
            },
            "text": null,
            "info": [
              {
                "icon": "grid-event",
                "text": "Messe Stuttgart"
              },
              {
                "icon": "location",
                "text": "Stuttgart"
              }
            ]
          }
        }
      ]
    },
    {
      "meta": {
        "day": null,
        "date": "28.09",
        "dateSecond": "30.09."
      },
      "items": [
        {
          "use": "calendar-banner",
          "settings": {
            "icon": null,
            "linkOverlayTarget": "calendar-banner",
            "headline": {
              "size": 5,
              "text": "Hand in Hand – das Unterstützungs- und Vernetzungsangebot im Gesunden Boot"
            },
            "text": null,
            "info": [
              {
                "icon": "grid-event",
                "text": "Messe Stuttgart"
              },
              {
                "icon": "location",
                "text": "Stuttgart"
              }
            ]
          }
        },
        {
          "use": "calendar-banner",
          "settings": {
            "icon": null,
            "linkOverlayTarget": "calendar-banner",
            "headline": {
              "size": 5,
              "text": "Kindergarten Basis Fortbildung"
            },
            "text": null,
            "info": [
              {
                "icon": "grid-event",
                "text": "Messe Stuttgart"
              },
              {
                "icon": "location",
                "text": "Stuttgart"
              }
            ]
          }
        }
      ]
    },
    {
      "meta": {
        "day": null,
        "date": "29.09",
        "dateSecond": "30.09."
      },
      "items": [
        {
          "use": "calendar-banner",
          "settings": {
            "icon": null,
            "linkOverlayTarget": "calendar-banner",
            "headline": {
              "size": 5,
              "text": "Grundschule Basis Fortbildung"
            },
            "text": null,
            "info": [
              {
                "icon": "grid-event",
                "text": "Messe Stuttgart"
              },
              {
                "icon": "location",
                "text": "Stuttgart"
              }
            ]
          }
        }
      ]
    },
    {
      "meta": {
        "day": null,
        "date": "30.09.",
        "dateSecond": "31.09."
      },
      "items": [
        {
          "use": "calendar-banner",
          "settings": {
            "icon": null,
            "linkOverlayTarget": "calendar-banner",
            "headline": {
              "size": 5,
              "text": "U3 Basis Fortbildung"
            },
            "text": null,
            "info": [
              {
                "icon": "grid-event",
                "text": "Messe Stuttgart"
              },
              {
                "icon": "location",
                "text": "Stuttgart"
              }
            ]
          }
        }
      ]
    },
    {
      "year": 2023
    },
    {
      "meta": {
        "day": null,
        "date": "03.01.",
        "dateSecond": "05.01."
      },
      "items": [
        {
          "use": "calendar-banner",
          "settings": {
            "icon": null,
            "linkOverlayTarget": "calendar-banner",
            "headline": {
              "size": 5,
              "text": "Hand in Hand – das Unterstützungs- und Vernetzungsangebot im Gesunden Boot"
            },
            "text": null,
            "info": [
              {
                "icon": "grid-event",
                "text": "Messe Stuttgart"
              },
              {
                "icon": "location",
                "text": "Stuttgart"
              }
            ]
          }
        },
        {
          "use": "calendar-banner",
          "settings": {
            "icon": null,
            "linkOverlayTarget": "calendar-banner",
            "headline": {
              "size": 5,
              "text": "Kindergarten Basis Fortbildung"
            },
            "text": null,
            "info": [
              {
                "icon": "grid-event",
                "text": "Messe Stuttgart"
              },
              {
                "icon": "location",
                "text": "Stuttgart"
              }
            ]
          }
        }
      ]
    },
    {
      "meta": {
        "day": null,
        "date": "28.01",
        "dateSecond": "29.01."
      },
      "items": [
        {
          "use": "calendar-banner",
          "settings": {
            "icon": null,
            "linkOverlayTarget": "calendar-banner",
            "headline": {
              "size": 5,
              "text": "Grundschule Basis Fortbildung"
            },
            "text": null,
            "info": [
              {
                "icon": "grid-event",
                "text": "Messe Stuttgart"
              },
              {
                "icon": "location",
                "text": "Stuttgart"
              }
            ]
          }
        }
      ]
    },
    {
      "meta": {
        "day": null,
        "date": "05.02",
        "dateSecond": "08.02"
      },
      "items": [
        {
          "use": "calendar-banner",
          "settings": {
            "icon": null,
            "linkOverlayTarget": "calendar-banner",
            "headline": {
              "size": 5,
              "text": "U3 Basis Fortbildung"
            },
            "text": null,
            "info": [
              {
                "icon": "grid-event",
                "text": "Messe Stuttgart"
              },
              {
                "icon": "location",
                "text": "Stuttgart"
              }
            ]
          }
        }
      ]
    }
  ]
}