{% import "macros/images" as imageMacros %}

{% for person in block.people %}

	<section class="mb-24 last:mb-0">
		<div class="relative">

			<div class="relative lg:flex lg:items-start">
				<div class="flex-shrink-0 hidden w-48 overflow-hidden rounded-full lg:block">
					{% if person.peopleProfileImage|default %}
						{{ imageMacros.imagerSrcset(
							person.peopleProfileImage[0],
							'peopleThumb'
						) }}
					{% endif %}
				</div>

				<div class="relative lg:ml-12">
					<div class="mb-4">
						<h3 class="font-medium text-blue-700 type-lg">{{ person.title }}</h3>
						{% if person.peoplePosition|default %}
							<div class="mt-1 font-medium leading-snug tracking-widest text-gray-700 uppercase type-sm">{{ person.peoplePosition }}</div>
						{% endif %}
					</div>
					<div class="text-gray-800 rich-text">
						{{ person.peopleShortBiography|default }}
					</div>
				</div>
			</div>
		</div>
	</section>

{% endfor %}