HTML-Prototype von TUM Campus Heilbronn

<div class="page">
  <main class="page__content">
    <!-- Grid/ Element container-->
    <div class="frame frame-type-container frame-space-before-none frame--full frame--background frame--blue-dark-301" id="c000002">
      <!-- Grid/ Element container-->
      <div class="frame frame-type-frame frame--default" id="c">
        <!-- Grid/ Element header-->
        <header class="frame__header">
          <h2>Teaser - in 50-50 grid</h2>
        </header>
        <div class="flex">
          <div class="flex__md-6">
            <!-- Grid/ Element container-->
            <div class="frame frame-type-frame frame--small" id="c">
              <div class="c-teaser-container">
                <div class="c-teaser">
                  <!-- Grid/ Element header-->
                  <header class="frame__header">
                    <h4>Innovationen für Mittelstands und der Weltmarktführer</h4>
                  </header><a class="btn btn--primary btn--large" href="#">Mehr erfahren</a>
                  <div class="c-teaser__image"><img src="https://placeholder2.in2code.de/images/work/1/1080/1080" alt="Innovationen für Mittelstands und der Weltmarktführer"/></div>
                </div>
                <div class="c-teaser">
                  <!-- Grid/ Element header-->
                  <header class="frame__header">
                    <h4>Exzellente Lehre</h4>
                  </header><a class="btn btn--primary btn--large" href="#">Mehr erfahren</a>
                  <div class="c-teaser__image"><img src="https://placeholder2.in2code.de/images/work/3/1080/1080" alt="Exzellente Lehre"/></div>
                </div>
              </div>
            </div>
          </div>
          <div class="flex__md-6">
            <!-- Grid/ Element container-->
            <div class="frame frame-type-frame frame--small" id="c">
              <div class="c-teaser-cards">
                <div class="c-teaser">
                  <!-- Grid/ Element header-->
                  <header class="frame__header">
                    <h4>Regionale Verantwortung</h4>
                  </header><a class="btn btn--primary btn--large" href="#">Mehr erfahren</a>
                  <div class="c-teaser__image"><img src="https://placeholder2.in2code.de/images/work/4/1080/1080" alt="Regionale Verantwortung"/></div>
                </div>
                <div class="c-teaser">
                  <!-- Grid/ Element header-->
                  <header class="frame__header">
                    <h4>Continuing Education und Lifelong Learning</h4>
                  </header><a class="btn btn--primary btn--large" href="#">Mehr erfahren</a>
                  <div class="c-teaser__image"><img src="https://placeholder2.in2code.de/images/work/5/1080/1080" alt="Continuing Education und Lifelong Learning"/></div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </main>
</div>