<!-- Header -->
<header class="header">
  <div class="header__inner">
    <h1 class="headline headline--2"><span class="headline__kicker-line"><span class="headline__kicker">Adminportal<span class="u-hidden-visually">: </span></span>
      </span>Personen suchen</h1>
    <nav class="header__panel" aria-label="Hauptnavigation">
      <button class="header__panel-toggle" id="header-panel-toggle" aria-expanded="false" aria-controls="header-panel" type="button">
        <div class="header__panel-toggle-circle">
          <div class="header__panel-toggle-circle-lines"></div>
        </div>
        <div class="header__panel-toggle-label">Menü</div>
      </button>
      <div class="header__panel-inner" id="header-panel">
        <div class="header__panel-head">
          <div class="header__panel-close">
            <div class="header__panel-toggle-circle">
              <div class="header__panel-toggle-circle-lines"></div>
            </div>
          </div>
          <div class="header__panel-head-buffer"></div>
        </div>
        <form class="header__panel-search" id="globalSearch" action="https://adminportal2.itz.uni-halle.de/search.php" method="post" name="globalSearch" role="search">
          <svg class="icon icon--search header__panel-search-icon" viewBox="0 0 200 200" role="presentation">
            <use xlink:href="#icon-search"></use>
          </svg>
          <label class="header__panel-search-label" for="search-bar-si">Suchbegriff</label><span class="header__panel-search-input-wrap"><input class="header__panel-search-input" id="search-bar-si" placeholder="Suchbegriff eingeben" name="s" type="text" autocomplete="off"/></span>
          <button class="header__panel-search-submit"
            type="submit">Suchen</button>
          <button class="header__panel-search-reset" type="reset">
            <svg class="icon icon--cross" viewBox="0 0 200 200" role="img" aria-labelledby="icon-ed11-title">
              <title id="icon-ed11-title">Suche schließen</title>
              <use xlink:href="#icon-cross"></use>
            </svg>
          </button>
        </form>
        <div class="header__panel-navigation">
          <div class="navigation navigation--level-1">
            <ul class="navigation__items navigation__items--utility">
              <li class="navigation__item">
                <a class="navigation__item-link navigation__move" href="#" id="utility-navigation-8663" aria-controls="utility-menu-d174" aria-expanded="false" aria-haspopup="true"><span class="navigation__text">IDM</span><span class="navigation__item-link-cover"></span>
                  <svg class="icon icon--angle-right navigation__icon" viewBox="0 0 200 200" role="presentation">
                    <use xlink:href="#icon-angle-right"></use>
                  </svg>
                </a>
                <div class="navigation__flyout" role="group" id="utility-menu-d174" aria-hidden="true" aria-labelledby="utility-navigation-8663">
                  <ul class="navigation__submenu navigation__submenu--level-2" data-cols="1">
                    <li class="navigation__submenu-item navigation__submenu-item--back">
                      <button class="navigation__back" type="button" title="Eine Ebene zurück">
                        <svg class="icon icon--angle-left navigation__icon" viewBox="0 0 200 200" role="presentation">
                          <use xlink:href="#icon-angle-left"></use>
                        </svg><span class="navigation__text">zurück</span></button>
                    </li>
                    <li class="navigation__submenu-item navigation__submenu-item--overview">
                      <a class="navigation__submenu-item-link" href="#"><span class="navigation__text"><strong>Übersicht: IDM</strong></span></a>
                    </li>
                    <li class="navigation__submenu-item">
                      <a class="navigation__submenu-item-link" href="#"><span class="navigation__text">Link 1</span></a>
                    </li>
                    <li class="navigation__submenu-item">
                      <a class="navigation__submenu-item-link" href="#"><span class="navigation__text">Link 2</span></a>
                    </li>
                  </ul>
                </div>
              </li>
              <li class="navigation__item">
                <a class="navigation__item-link navigation__move" href="#" id="utility-navigation-2047" aria-controls="utility-menu-2fdd" aria-expanded="false" aria-haspopup="true"><span class="navigation__text">Konto</span><span class="navigation__item-link-cover"></span>
                  <svg class="icon icon--angle-right navigation__icon" viewBox="0 0 200 200" role="presentation">
                    <use xlink:href="#icon-angle-right"></use>
                  </svg>
                </a>
                <div class="navigation__flyout" role="group" id="utility-menu-2fdd" aria-hidden="true" aria-labelledby="utility-navigation-2047">
                  <ul class="navigation__submenu navigation__submenu--level-2" data-cols="1">
                    <li class="navigation__submenu-item navigation__submenu-item--back">
                      <button class="navigation__back" type="button" title="Eine Ebene zurück">
                        <svg class="icon icon--angle-left navigation__icon" viewBox="0 0 200 200" role="presentation">
                          <use xlink:href="#icon-angle-left"></use>
                        </svg><span class="navigation__text">zurück</span></button>
                    </li>
                    <li class="navigation__submenu-item navigation__submenu-item--overview">
                      <a class="navigation__submenu-item-link" href="#"><span class="navigation__text"><strong>Übersicht: Konto</strong></span></a>
                    </li>
                    <li class="navigation__submenu-item">
                      <a class="navigation__submenu-item-link" href="#"><span class="navigation__text">Einstellungen</span></a>
                    </li>
                    <li class="navigation__submenu-item">
                      <a class="navigation__submenu-item-link" href="#"><span class="navigation__text">Profil</span></a>
                    </li>
                    <li class="navigation__submenu-item">
                      <a class="navigation__submenu-item-link" href="#"><span class="navigation__text">Link</span></a>
                    </li>
                  </ul>
                </div>
              </li>
              <li class="navigation__item">
                <a class="navigation__item-link navigation__move" href="#" id="utility-navigation-b866" aria-controls="utility-menu-c568" aria-expanded="false" aria-haspopup="true"><span class="navigation__text">OTRS</span><span class="navigation__item-link-cover"></span>
                  <svg class="icon icon--angle-right navigation__icon" viewBox="0 0 200 200" role="presentation">
                    <use xlink:href="#icon-angle-right"></use>
                  </svg>
                </a>
                <div class="navigation__flyout" role="group" id="utility-menu-c568" aria-hidden="true" aria-labelledby="utility-navigation-b866">
                  <ul class="navigation__submenu navigation__submenu--level-2" data-cols="1">
                    <li class="navigation__submenu-item navigation__submenu-item--back">
                      <button class="navigation__back" type="button" title="Eine Ebene zurück">
                        <svg class="icon icon--angle-left navigation__icon" viewBox="0 0 200 200" role="presentation">
                          <use xlink:href="#icon-angle-left"></use>
                        </svg><span class="navigation__text">zurück</span></button>
                    </li>
                    <li class="navigation__submenu-item navigation__submenu-item--overview">
                      <a class="navigation__submenu-item-link" href="#"><span class="navigation__text"><strong>Übersicht: OTRS</strong></span></a>
                    </li>
                    <li class="navigation__submenu-item">
                      <a class="navigation__submenu-item-link" href="#"><span class="navigation__text">altes OTRS</span></a>
                    </li>
                    <li class="navigation__submenu-item">
                      <a class="navigation__submenu-item-link" href="#"><span class="navigation__text">neues OTRS</span></a>
                    </li>
                  </ul>
                </div>
              </li>
            </ul>
          </div>
        </div>
      </div>
    </nav>
    <div class="header__bar">
      <ul class="header__bar-list">
        <li class="header__bar-item">
          <a class="header__bar-link" href="#">
            <svg class="icon icon--logout header__bar-link-icon" viewBox="0 0 200 200" role="presentation">
              <use xlink:href="#icon-logout"></use>
            </svg><span class="header__bar-label">Logout</span></a>
        </li>
      </ul>
      <form class="header__bar-search" action="https://adminportal2.itz.uni-halle.de/search.php" method="post" name="globalSearch" role="search">
        <svg class="icon icon--search header__bar-search-icon" viewBox="0 0 200 200" role="presentation">
          <use xlink:href="#icon-search"></use>
        </svg>
        <label class="header__bar-search-label" for="search-bar-s">Suchbegriff</label>
        <input class="header__bar-search-input" id="search-bar-s" placeholder="Suchen" name="s" type="text" autocomplete="off" />
        <button class="header__bar-search-submit" type="submit">Suchen</button>
        <button class="header__bar-search-reset" type="reset">
          <svg class="icon icon--cross" viewBox="0 0 200 200" role="img" aria-labelledby="icon-57ee-title">
            <title id="icon-57ee-title">Suche schließen</title>
            <use xlink:href="#icon-cross"></use>
          </svg>
        </button>
      </form>
    </div>
  </div>
</header>

{
  "hasBreadcrumb": true,
  "breadcrumb": {
    "label": "Aktuelle Position",
    "items": [
      {
        "label": "Start",
        "link": "#"
      },
      {
        "label": "Universität",
        "link": "#"
      },
      {
        "label": "Fakultäten",
        "link": "#"
      },
      {
        "label": "Erziehungswissenschaften",
        "link": "#"
      },
      {
        "label": "Institut für Pädagogik",
        "link": "#"
      },
      {
        "label": "Arbeitsbereiche",
        "link": "#"
      },
      {
        "label": "Soziokulturelle Bedingungen von Erziehung und Bildung",
        "link": "#"
      }
    ]
  }
}