<article class="ecl-card">
  <div class="ecl-card__image" aria-label="card image" role="img"
    style="background-image:url(&#x27;https://inno-ecl.s3.amazonaws.com/media/examples/example-image.jpg&#x27;)"></div>
  <div class="ecl-card__body">
    <div class="ecl-content-block ecl-card__content-block">
      <ul class="ecl-content-block__label-container">
        <li class="ecl-content-block__label-item"><span class="ecl-label ecl-label--highlight">highlighted</span></li>
        <li class="ecl-content-block__label-item"><span class="ecl-label ecl-label--medium">call status: upcoming</span>
        </li>
      </ul>
      <ul class="ecl-content-block__primary-meta-container">
        <li class="ecl-content-block__primary-meta-item">META1</li>
        <li class="ecl-content-block__primary-meta-item">Meta2</li>
      </ul>
      <h1 class="ecl-content-block__title"><a href="/example" class="ecl-link ecl-link--standalone">Better
          regulation</a></h1>
      <div class="ecl-content-block__description">Transparently designing and evaluating evidence-based EU legislation,
        backed by citizens views.</div>
      <ul class="ecl-content-block__secondary-meta-container">
        <li class="ecl-content-block__secondary-meta-item"><svg
            class="ecl-icon ecl-icon--s ecl-content-block__secondary-meta-icon" focusable="false" aria-hidden="true">
            <use xlink:href="/dist/media/icons.96a6ea95.svg#calendar"></use>
          </svg><span class="ecl-content-block__secondary-meta-label">2018/10/22</span></li>
        <li class="ecl-content-block__secondary-meta-item"><svg
            class="ecl-icon ecl-icon--s ecl-content-block__secondary-meta-icon" focusable="false" aria-hidden="true">
            <use xlink:href="/dist/media/icons.96a6ea95.svg#location"></use>
          </svg><span class="ecl-content-block__secondary-meta-label">Luxembourg</span></li>
      </ul>
    </div>
  </div>
</article>

<article class="ecl-card">
  <div class="ecl-card__image" aria-label="card image" role="img"
    style="background-image:url(&#x27;https://inno-ecl.s3.amazonaws.com/media/examples/example-image.jpg&#x27;)"></div>
  <div class="ecl-card__body">
    <div class="ecl-content-block ecl-card__content-block">
      <ul class="ecl-content-block__label-container">
        <li class="ecl-content-block__label-item"><span class="ecl-label ecl-label--highlight">highlighted</span></li>
        <li class="ecl-content-block__label-item"><span class="ecl-label ecl-label--medium">call status: upcoming</span>
        </li>
      </ul>
      <ul class="ecl-content-block__primary-meta-container">
        <li class="ecl-content-block__primary-meta-item">META1</li>
        <li class="ecl-content-block__primary-meta-item">Meta2</li>
      </ul>
      <h1 class="ecl-content-block__title"><a href="/example" class="ecl-link ecl-link--standalone">Better
          regulation</a></h1>
      <div class="ecl-content-block__description">Transparently designing and evaluating evidence-based EU legislation,
        backed by citizens views.</div>
      <ul class="ecl-content-block__secondary-meta-container">
        <li class="ecl-content-block__secondary-meta-item"><svg
            class="ecl-icon ecl-icon--s ecl-content-block__secondary-meta-icon" focusable="false" aria-hidden="true">
            <use xlink:href="/dist/media/icons.96a6ea95.svg#calendar"></use>
          </svg><span class="ecl-content-block__secondary-meta-label">2018/10/22</span></li>
        <li class="ecl-content-block__secondary-meta-item"><svg
            class="ecl-icon ecl-icon--s ecl-content-block__secondary-meta-icon" focusable="false" aria-hidden="true">
            <use xlink:href="/dist/media/icons.96a6ea95.svg#location"></use>
          </svg><span class="ecl-content-block__secondary-meta-label">Luxembourg</span></li>
      </ul>
      <ul class="ecl-content-block__tag-container">
        <li class="ecl-content-block__tag-item"><a href="/example" class="ecl-tag">tag 1</a></li>
        <li class="ecl-content-block__tag-item"><a href="/example" class="ecl-tag">tag 2</a></li>
        <li class="ecl-content-block__tag-item"><a href="/example" class="ecl-tag">tag 3</a></li>
      </ul>
    </div>
  </div>
</article>

<article class="ecl-card">
  <div class="ecl-card__image" aria-label="card image" role="img"
    style="background-image:url(&#x27;https://inno-ecl.s3.amazonaws.com/media/examples/example-image.jpg&#x27;)"></div>
  <div class="ecl-card__body">
    <div class="ecl-content-block ecl-card__content-block">
      <ul class="ecl-content-block__label-container">
        <li class="ecl-content-block__label-item"><span class="ecl-label ecl-label--highlight">highlighted</span></li>
        <li class="ecl-content-block__label-item"><span class="ecl-label ecl-label--medium">call status: upcoming</span>
        </li>
      </ul>
      <ul class="ecl-content-block__primary-meta-container">
        <li class="ecl-content-block__primary-meta-item">META1</li>
        <li class="ecl-content-block__primary-meta-item">Meta2</li>
      </ul>
      <h1 class="ecl-content-block__title"><a href="/example" class="ecl-link ecl-link--standalone">Better
          regulation</a></h1>
      <div class="ecl-content-block__description">Transparently designing and evaluating evidence-based EU legislation,
        backed by citizens views.</div>
      <ul class="ecl-content-block__secondary-meta-container">
        <li class="ecl-content-block__secondary-meta-item"><svg
            class="ecl-icon ecl-icon--s ecl-content-block__secondary-meta-icon" focusable="false" aria-hidden="true">
            <use xlink:href="/dist/media/icons.96a6ea95.svg#calendar"></use>
          </svg><span class="ecl-content-block__secondary-meta-label">2018/10/22</span></li>
        <li class="ecl-content-block__secondary-meta-item"><svg
            class="ecl-icon ecl-icon--s ecl-content-block__secondary-meta-icon" focusable="false" aria-hidden="true">
            <use xlink:href="/dist/media/icons.96a6ea95.svg#location"></use>
          </svg><span class="ecl-content-block__secondary-meta-label">Luxembourg</span></li>
      </ul>
      <div class="ecl-content-block__list-container">
        <dl class="ecl-description-list ecl-content-block__list">
          <dt class="ecl-description-list__term">Standard text</dt>
          <dd class="ecl-description-list__definition">Lorem ipsum dolor sit amet, <a href="/example"
              class="ecl-link">consectetur adipiscing elit</a>. Suspendisse ut sapien condimentum, aliquet turpis sit
            amet, finibus purus. Donec porttitor iaculis felis ut dapibus. Sed blandit, massa ac suscipit facilisis</dd>
          <dt class="ecl-description-list__term">Standalone links</dt>
          <dd class="ecl-description-list__definition ecl-description-list__definition--link"><a href="/example"
              class="ecl-link ecl-link--icon ecl-link--icon-before ecl-description-list__definition-item"><svg
                class="ecl-icon ecl-icon--s ecl-link__icon" focusable="false" aria-hidden="true">
                <use xlink:href="/dist/media/icons.96a6ea95.svg#copy"></use>
              </svg><span class="ecl-link__label">Lorem ipsum dolor sit amet</span></a><a href="/example"
              class="ecl-link ecl-link--icon ecl-link--icon-before ecl-description-list__definition-item"><svg
                class="ecl-icon ecl-icon--s ecl-link__icon" focusable="false" aria-hidden="true">
                <use xlink:href="/dist/media/icons.96a6ea95.svg#download"></use>
              </svg><span class="ecl-link__label">Lorem ipsum dolor sit amet</span></a></dd>
          <dt class="ecl-description-list__term">Links inline</dt>
          <dd class="ecl-description-list__definition ecl-description-list__definition--inline"><a href="/example"
              class="ecl-link ecl-description-list__definition-item">Lorem ipsum dolor sit amet</a><a href="/example"
              class="ecl-link ecl-description-list__definition-item">Lorem ipsum dolor sit amet</a></dd>
          <dt class="ecl-description-list__term">Taxonomy list</dt>
          <dd class="ecl-description-list__definition ecl-description-list__definition--taxonomy"><span
              class="ecl-description-list__definition-item">Taxonomy item 1</span><span
              class="ecl-description-list__definition-item">Taxonomy item 2</span><span
              class="ecl-description-list__definition-item">Taxonomy item 3</span></dd>
        </dl>
      </div>
    </div>
  </div>
</article>