HTML-Prototype von TUM Campus Heilbronn

<div class="c-imagemap" style="--image-url: url('/Images/campus.png')">
  <div class="c-imagemap-wrapper"><img src="/Images/campus.png" width="2544" height="1664" alt="Lageplan des TUM Campus Heilbronn"/>
    <div class="c-imagemap__item" style="--x: 5.06%; --y: 80.34%"><a class="btn btn--primary btn--large" href="#">Campusführung</a></div>
    <div class="c-imagemap__item" style="--x: 68.06%; --y: 24.34%">
      <div class="c-imagemap__poi"><span class="c-imagemap__poi-text">Point of Interest</span>
        <button class="c-imagemap__poi-marker" type="button" aria-label="Point of Interest: {name}"></button>
      </div>
    </div>
    <div class="c-imagemap__item" style="--x: 30.00%; --y: 35.00%"><span class="c-imagemap__label">Campus Mitte</span></div>
    <div class="c-imagemap__item" style="--x: 5.00%; --y: 14.00%">
      <div class="c-imagemap__thumbnail-wrap">
        <button class="c-imagemap__thumbnail-toggle" type="button" aria-expanded="false" aria-controls="thumbnail-1" aria-label="Show Image: Closeup Image of Building"></button>
        <div class="c-imagemap__thumbnail" id="thumbnail-1" hidden="hidden"><img src="https://placeholder2.in2code.de/images/university/3/300/250" width="300" height="250" alt="Closeup Image of Building"/></div>
      </div>
    </div>
  </div>
</div>