Primer

HTML

<div class="advent-related center-text">

	<div class="inner clearfix">

		<h2>Explore More Extraodinary Advent Stories</h2>

		<div class="large-col-4 previous advent-related__card">
			<h3>Previous Day</h3>
		</div>

		<div class="large-col-4 calendar  advent-related__card">
			<picture>
		        <source media="(min-width: 375px)" srcset="/images/mainsite5/advent/advent-calendar.jpg, /images/mainsite5/advent/advent-calendar@2x.jpg 2x">
		        <img src="/images/mainsite5/advent/door-behind/BehindDoor_1000x1000px_Day.jpg" alt="Advent Calendar" title="Advent Calendar">
	        </picture>
			<h3>View Calendar</h3>
		</div>

		<div class="large-col-4 next  advent-related__card">
			<h3>Next Day</h3>
		</div>

	</div>

</div>

Twig

<div class="advent-related center-text">

	<div class="inner clearfix">

		<h2>Explore More Extraodinary Advent Stories</h2>

		<div class="large-col-4 previous advent-related__card">
			<h3>Previous Day</h3>
		</div>

		<div class="large-col-4 calendar  advent-related__card">
			<picture>
		        <source media="(min-width: 375px)" srcset="/images/mainsite5/advent/advent-calendar.jpg, /images/mainsite5/advent/advent-calendar@2x.jpg 2x">
		        <img src="/images/mainsite5/advent/door-behind/BehindDoor_1000x1000px_Day{{ i }}.jpg" alt="Advent Calendar" title="Advent Calendar">
	        </picture>
			<h3>View Calendar</h3>
		</div>

		<div class="large-col-4 next  advent-related__card">
			<h3>Next Day</h3>
		</div>

	</div>

</div>

{}