<div class="page-header">
  <nav class="page-navigation" role="navigation">
    <div class="container-fluid" style="padding-bottom: 15px;">
      <!--Code above: visualization helper-->

      <nav id="breadcrumb" class="breadcrumb" role="navigation" aria-label="breadcrumbs">
        <span class="element-invisible sr-only">You are here:</span>
        <ol class="breadcrumb__segments-wrapper">
          <li class="breadcrumb__segment">
            <span itemprop="title">
              <a href="#" class="breadcrumb__link">Home</a>
            </span>
          </li>
          <li class="breadcrumb__segment">
            <span itemprop="title">
              <a href="#" class="breadcrumb__link">Business, Economy, Euro</a>
            </span>
          </li>
          <li class="breadcrumb__segment">
            <span itemprop="title">
              <a href="#" class="breadcrumb__link">Economic and fiscal policy coordination</a>
            </span>
          </li>
          <li class="breadcrumb__segment">
            <span itemprop="title">
              <a href="#" class="breadcrumb__link">EU Economic governance: monitoring, prevention, correction</a>
            </span>
          </li>
          <li class="breadcrumb__segment">
            <span itemprop="title">
              <a href="#" class="breadcrumb__link">Stability and Growth Pact</a>
            </span>
          </li>
          <li class="breadcrumb__segment">
            <span class="breadcrumb__text" itemprop="title">Applying the rules of the stability and growth pact</span>
          </li>
        </ol>
      </nav>

      <!--Code below: visualization helper-->
    </div>
  </nav>
</div>