Fact and figures

<div class="ecl-fact-figures ecl-fact-figures--col-1">
  <div class="ecl-fact-figures__items">
    <div class="ecl-fact-figures__item"><svg class="ecl-icon ecl-icon--m ecl-fact-figures__icon" focusable="false"
        aria-hidden="true">
        <use xlink:href="/dist/media/icons.96a6ea95.svg#infographic"></use>
      </svg>
      <div class="ecl-fact-figures__value">00.0 million</div>
      <div class="ecl-fact-figures__title">Lorem ipsum</div>
      <div class="ecl-fact-figures__description">Nunc eu est nec orci rhoncus venenatis. Donec rutrum lacus eget
        lobortis eleifend. Duis cursus sapien ac felis bibendum, in sagittis turpis porttitor. Aliquam sed mauris et
        orci efficitur mollis. Donec eu dolor in turpis sollicitudin malesuada.</div>
    </div>
  </div>
  <div class="ecl-fact-figures__view-all"><a href="/example"
      class="ecl-link ecl-link--standalone ecl-link--icon ecl-link--icon-after ecl-fact-figures__view-all-link"><span
        class="ecl-link__label">View all metrics</span><svg
        class="ecl-icon ecl-icon--xs ecl-icon--rotate-90 ecl-link__icon" focusable="false" aria-hidden="true">
        <use xlink:href="/dist/media/icons.96a6ea95.svg#corner-arrow"></use>
      </svg></a></div>
</div>

<div class="ecl-fact-figures ecl-fact-figures--col-2">
  <div class="ecl-fact-figures__items">
    <div class="ecl-fact-figures__item"><svg class="ecl-icon ecl-icon--m ecl-fact-figures__icon" focusable="false"
        aria-hidden="true">
        <use xlink:href="/dist/media/icons.96a6ea95.svg#infographic"></use>
      </svg>
      <div class="ecl-fact-figures__value">00.0 million</div>
      <div class="ecl-fact-figures__title">Lorem ipsum</div>
      <div class="ecl-fact-figures__description">Nunc eu est nec orci rhoncus venenatis. Donec rutrum lacus eget
        lobortis eleifend. Duis cursus sapien ac felis bibendum, in sagittis turpis porttitor. Aliquam sed mauris et
        orci efficitur mollis. Donec eu dolor in turpis sollicitudin malesuada.</div>
    </div>
    <div class="ecl-fact-figures__item"><svg class="ecl-icon ecl-icon--m ecl-fact-figures__icon" focusable="false"
        aria-hidden="true">
        <use xlink:href="/dist/media/icons.96a6ea95.svg#spreadsheet"></use>
      </svg>
      <div class="ecl-fact-figures__value">00.0 million</div>
      <div class="ecl-fact-figures__title">Sed hendrerit</div>
      <div class="ecl-fact-figures__description">Turpis varius congue venenatis, erat dui feugiat felis.</div>
    </div>
  </div>
  <div class="ecl-fact-figures__view-all"><a href="/example"
      class="ecl-link ecl-link--standalone ecl-link--icon ecl-link--icon-after ecl-fact-figures__view-all-link"><span
        class="ecl-link__label">View all metrics</span><svg
        class="ecl-icon ecl-icon--xs ecl-icon--rotate-90 ecl-link__icon" focusable="false" aria-hidden="true">
        <use xlink:href="/dist/media/icons.96a6ea95.svg#corner-arrow"></use>
      </svg></a></div>
</div>

<div class="ecl-fact-figures ecl-fact-figures--col-3">
  <div class="ecl-fact-figures__items">
    <div class="ecl-fact-figures__item"><svg class="ecl-icon ecl-icon--m ecl-fact-figures__icon" focusable="false"
        aria-hidden="true">
        <use xlink:href="/dist/media/icons.96a6ea95.svg#infographic"></use>
      </svg>
      <div class="ecl-fact-figures__value">00.0 million</div>
      <div class="ecl-fact-figures__title">Lorem ipsum</div>
      <div class="ecl-fact-figures__description">Nunc eu est nec orci rhoncus venenatis. Donec rutrum lacus eget
        lobortis eleifend. Duis cursus sapien ac felis bibendum, in sagittis turpis porttitor. Aliquam sed mauris et
        orci efficitur mollis. Donec eu dolor in turpis sollicitudin malesuada.</div>
    </div>
    <div class="ecl-fact-figures__item"><svg class="ecl-icon ecl-icon--m ecl-fact-figures__icon" focusable="false"
        aria-hidden="true">
        <use xlink:href="/dist/media/icons.96a6ea95.svg#spreadsheet"></use>
      </svg>
      <div class="ecl-fact-figures__value">00.0 million</div>
      <div class="ecl-fact-figures__title">Sed hendrerit</div>
      <div class="ecl-fact-figures__description">Turpis varius congue venenatis, erat dui feugiat felis.</div>
    </div>
    <div class="ecl-fact-figures__item"><svg class="ecl-icon ecl-icon--m ecl-fact-figures__icon" focusable="false"
        aria-hidden="true">
        <use xlink:href="/dist/media/icons.96a6ea95.svg#growth"></use>
      </svg>
      <div class="ecl-fact-figures__value">00.0 million</div>
      <div class="ecl-fact-figures__title">Donec suscipit interdum augue, ac dapibus eros finibus a.</div>
      <div class="ecl-fact-figures__description">Cras vestibulum efficitur mi, quis porta tellus rutrum ut. Quisque at
        pulvinar sem.</div>
    </div>
    <div class="ecl-fact-figures__item"><svg class="ecl-icon ecl-icon--m ecl-fact-figures__icon" focusable="false"
        aria-hidden="true">
        <use xlink:href="/dist/media/icons.96a6ea95.svg#digital"></use>
      </svg>
      <div class="ecl-fact-figures__value">00.0 million</div>
      <div class="ecl-fact-figures__title">Aenean dapibus</div>
      <div class="ecl-fact-figures__description">Aliquam lacinia diam eu sem malesuada, in interdum ante bibendum.</div>
    </div>
    <div class="ecl-fact-figures__item"><svg class="ecl-icon ecl-icon--m ecl-fact-figures__icon" focusable="false"
        aria-hidden="true">
        <use xlink:href="/dist/media/icons.96a6ea95.svg#regulation"></use>
      </svg>
      <div class="ecl-fact-figures__value">00.0 million</div>
      <div class="ecl-fact-figures__title">Lorem ipsum</div>
      <div class="ecl-fact-figures__description">Nunc condimentum sapien ut nibh finibus suscipit vitae at justo. Morbi
        quis odio faucibus, commodo tortor id, elementum libero.</div>
    </div>
    <div class="ecl-fact-figures__item"><svg class="ecl-icon ecl-icon--m ecl-fact-figures__icon" focusable="false"
        aria-hidden="true">
        <use xlink:href="/dist/media/icons.96a6ea95.svg#image"></use>
      </svg>
      <div class="ecl-fact-figures__value">00.0 million</div>
      <div class="ecl-fact-figures__title">Sed hendrerit</div>
      <div class="ecl-fact-figures__description">Turpis varius congue venenatis, erat dui feugiat felis.</div>
    </div>
  </div>
  <div class="ecl-fact-figures__view-all"><a href="/example"
      class="ecl-link ecl-link--standalone ecl-link--icon ecl-link--icon-after ecl-fact-figures__view-all-link"><span
        class="ecl-link__label">View all metrics</span><svg
        class="ecl-icon ecl-icon--xs ecl-icon--rotate-90 ecl-link__icon" focusable="false" aria-hidden="true">
        <use xlink:href="/dist/media/icons.96a6ea95.svg#corner-arrow"></use>
      </svg></a></div>
</div>

<div class="ecl-fact-figures ecl-fact-figures--col-4">
  <div class="ecl-fact-figures__items">
    <div class="ecl-fact-figures__item"><svg class="ecl-icon ecl-icon--m ecl-fact-figures__icon" focusable="false"
        aria-hidden="true">
        <use xlink:href="/dist/media/icons.96a6ea95.svg#infographic"></use>
      </svg>
      <div class="ecl-fact-figures__value">00.0 million</div>
      <div class="ecl-fact-figures__title">Lorem ipsum</div>
      <div class="ecl-fact-figures__description">Nunc eu est nec orci rhoncus venenatis. Donec rutrum lacus eget
        lobortis eleifend. Duis cursus sapien ac felis bibendum, in sagittis turpis porttitor. Aliquam sed mauris et
        orci efficitur mollis. Donec eu dolor in turpis sollicitudin malesuada.</div>
    </div>
    <div class="ecl-fact-figures__item"><svg class="ecl-icon ecl-icon--m ecl-fact-figures__icon" focusable="false"
        aria-hidden="true">
        <use xlink:href="/dist/media/icons.96a6ea95.svg#spreadsheet"></use>
      </svg>
      <div class="ecl-fact-figures__value">00.0 million</div>
      <div class="ecl-fact-figures__title">Sed hendrerit</div>
      <div class="ecl-fact-figures__description">Turpis varius congue venenatis, erat dui feugiat felis.</div>
    </div>
    <div class="ecl-fact-figures__item"><svg class="ecl-icon ecl-icon--m ecl-fact-figures__icon" focusable="false"
        aria-hidden="true">
        <use xlink:href="/dist/media/icons.96a6ea95.svg#growth"></use>
      </svg>
      <div class="ecl-fact-figures__value">00.0 million</div>
      <div class="ecl-fact-figures__title">Donec suscipit interdum augue, ac dapibus eros finibus a.</div>
      <div class="ecl-fact-figures__description">Cras vestibulum efficitur mi, quis porta tellus rutrum ut. Quisque at
        pulvinar sem.</div>
    </div>
    <div class="ecl-fact-figures__item"><svg class="ecl-icon ecl-icon--m ecl-fact-figures__icon" focusable="false"
        aria-hidden="true">
        <use xlink:href="/dist/media/icons.96a6ea95.svg#digital"></use>
      </svg>
      <div class="ecl-fact-figures__value">00.0 million</div>
      <div class="ecl-fact-figures__title">Aenean dapibus</div>
      <div class="ecl-fact-figures__description">Aliquam lacinia diam eu sem malesuada, in interdum ante bibendum.</div>
    </div>
    <div class="ecl-fact-figures__item"><svg class="ecl-icon ecl-icon--m ecl-fact-figures__icon" focusable="false"
        aria-hidden="true">
        <use xlink:href="/dist/media/icons.96a6ea95.svg#regulation"></use>
      </svg>
      <div class="ecl-fact-figures__value">00.0 million</div>
      <div class="ecl-fact-figures__title">Lorem ipsum</div>
      <div class="ecl-fact-figures__description">Nunc condimentum sapien ut nibh finibus suscipit vitae at justo. Morbi
        quis odio faucibus, commodo tortor id, elementum libero.</div>
    </div>
    <div class="ecl-fact-figures__item"><svg class="ecl-icon ecl-icon--m ecl-fact-figures__icon" focusable="false"
        aria-hidden="true">
        <use xlink:href="/dist/media/icons.96a6ea95.svg#image"></use>
      </svg>
      <div class="ecl-fact-figures__value">00.0 million</div>
      <div class="ecl-fact-figures__title">Sed hendrerit</div>
      <div class="ecl-fact-figures__description">Turpis varius congue venenatis, erat dui feugiat felis.</div>
    </div>
    <div class="ecl-fact-figures__item"><svg class="ecl-icon ecl-icon--m ecl-fact-figures__icon" focusable="false"
        aria-hidden="true">
        <use xlink:href="/dist/media/icons.96a6ea95.svg#global"></use>
      </svg>
      <div class="ecl-fact-figures__value">00.0 million</div>
      <div class="ecl-fact-figures__title">Donec suscipit interdum augue, ac dapibus eros finibus a.</div>
      <div class="ecl-fact-figures__description">Cras vestibulum efficitur mi, quis porta tellus rutrum ut. Quisque at
        pulvinar sem.</div>
    </div>
    <div class="ecl-fact-figures__item"><svg class="ecl-icon ecl-icon--m ecl-fact-figures__icon" focusable="false"
        aria-hidden="true">
        <use xlink:href="/dist/media/icons.96a6ea95.svg#video"></use>
      </svg>
      <div class="ecl-fact-figures__value">00.0 million</div>
      <div class="ecl-fact-figures__title">Aenean dapibus</div>
      <div class="ecl-fact-figures__description">Aliquam lacinia diam eu sem malesuada, in interdum ante bibendum.</div>
    </div>
  </div>
  <div class="ecl-fact-figures__view-all"><a href="/example"
      class="ecl-link ecl-link--standalone ecl-link--icon ecl-link--icon-after ecl-fact-figures__view-all-link"><span
        class="ecl-link__label">View all metrics</span><svg
        class="ecl-icon ecl-icon--xs ecl-icon--rotate-90 ecl-link__icon" focusable="false" aria-hidden="true">
        <use xlink:href="/dist/media/icons.96a6ea95.svg#corner-arrow"></use>
      </svg></a></div>
</div>