{% extends '@nucleus/partials/particle.html.twig' %}

{% block particle %}

	{% if particle.title %}<h2 class="g-title">{{ particle.title|raw }}</h2>{% endif %}

	<div class="g-contact {{ particle.class|e }}">
		{% set contactmap %}
			{% for map in particle.maps %}
			<div class="g-contact-map" style="background: url('{{ url(map.img)|e }}') no-repeat; min-height: {{ map.height|e }}">
				{% if map.overlay %}
				<div class="g-contact-map-overlay"></div>
				{% endif %}
				{% if map.marker %}
				<div class="g-contact-map-marker" style="top: {{ map.top|e }};left: {{ map.left|e }}">
					<i class="{{ map.icon|e }}"></i>
				</div>
				{% endif %}
			</div>
			{% endfor %}
		{% endset %}
		
		{% if particle.mapposition == 'top' %}
			{{ contactmap }}
		{% endif %}
		
		{% for contactitem in particle.contactitems %}
		<div class="g-contact-item">
			{% if contactitem.icon %}<div class="g-contact-icon"><span class="{{ contactitem.icon }}"></span></div>{% endif %}
			{% if contactitem.label %}<div class="g-contact-label">{{ contactitem.label|raw }}</div>{% endif %}
			{% if contactitem.text %}<div class="g-contact-text">{{ contactitem.text|raw }}</div>{% endif %}
		</div>
		{% endfor %}
		
		{% if particle.mapposition == 'bottom' %}
			{{ contactmap }}
		{% endif %}
	</div>

{% endblock %}