{% extends "layout.html" %}
{% block page %}
{% include 'masterhead.html' %}
{% include 'about.html' %}
<!-- Projects-->
<section class="projects-section bg-light" id="projects">
	<div class="container px-4 px-lg-5">
		{% for project in this.children %}
			{% set image = project.attachments.images.first() %}
			<div class="row gx-0 mb-5 mb-md-0 justify-content-center">
				<div class="col-lg-6"><img class="img-fluid" src="{{ image|url }}" alt="project image" /></div>
				<div class="col-lg-6 {% if not project.type %} order-lg-first {% endif %} ">
					<div class="bg-black text-center h-100 project">
						<div class="d-flex h-100">
							<div class="my-4 my-lg-auto w-100 text-center">
								<h2 class="text-white mb-5">{{ project.title }}</h2>
								<a href="{{ project|url }}" class="btn btn-primary"><i class="fa fa-search" aria-hidden="true"></i> {{ _("Details") }}</a>
							</div>
						</div>
					</div>
				</div>
			</div>
		{% endfor %}
	</div>
</section>
{% endblock %}