{% include 'quarks/_loadCssComponent' with {
    name: '_' ~ component.type
  } only %} 
<section {{ dataComponent }} id="{{ id }}" class="globalBannerImage {{ separation }} bg-{{ index.index0 }}">
	<div class="container py-3 d-flex justify-content-center align-items-center flex-column">
		{% include 'components/_setHeadTitles' %}
		{% set img = component.image[0] ?? null %}
		{% if img %}
			{% if component.itemLink.isEmpty() %}
				<img data-src="{{ img.url() }}" alt="{{ img.title }}" loading="lazy" class="lazyload img-fluid"/>
			{% else %}
				<a {{ component.itemLink.getLinkAttributes() }}>
					<img data-src="{{ img.url() }}" alt="{{ img.title }}" loading="lazy" class="lazyload img-fluid"/>
				</a>
			{% endif %}
		{% endif %}
		{# dd component.itemLink #}
	</div>
</section>