<div class="thankyou_footer">
    <div class="thankyou_footer_media">
        <figure class="thankyou_footer_figure">

            <picture class="thankyou_footer_picture">
                <source media="(min-width: 1220px)" srcset="https://images.fastspot.com/generic/1440x810/1" width="1440" height="810">
                <source media="(min-width: 980px)" srcset="https://images.fastspot.com/generic/1220x686/1" width="1220" height="686">
                <source media="(min-width: 740px)" srcset="https://images.fastspot.com/generic/980x735/1" width="980" height="735">
                <source media="(min-width: 500px)" srcset="https://images.fastspot.com/generic/740x740/1" width="740" height="740">
                <img class="thankyou_footer_image" src="//images.fastspot.com/generic/375x500/1" alt="" loading="lazy" width="375" height="500">
            </picture>
        </figure>
    </div>
    <div class="fs-row">
        <div class="fs-cell">
            <div class="thankyou_footer_inner">
                <h2 class="thankyou_footer_title">See You At <span class="large">Paul Smith's College</span> On April 27</h2>
                <div class="thankyou_footer_media_wrapper">
                    <div class="thankyou_footer_media_item">
                        <div class="js-thankyou-video-wrapper thankyou_footer_video" data-index="1" data-background-video='{"display":"background","id":"L6jiezlsbhs","type":"youtube","title":"Paul Smiths","autoplay":false}'>
                            <div class="thankyou_footer_video_iframe_wrap">
                                <div class="thankyou_footer_video_iframe_target js-iframe-target"></div>
                            </div>
                        </div>
                        <figure class="thankyou_footer_media_item_figure">

                            <img class="thankyou_footer_media_item_image" srcset="https://images.fastspot.com/generic/980x552/2 980w, https://images.fastspot.com/generic/740x416/2 740w, https://images.fastspot.com/generic/500x282/2 500w, https://images.fastspot.com/generic/300x169/2 300w" src="https://images.fastspot.com/generic/300x169/2" alt="" loading="lazy" width="300" height="169">
                        </figure>
                        <div class="thankyou_footer_video_controls">

                            <button class="thankyou_footer_video_play_1_button js-thankyou-footer-video-play-1-button">
                                <span class="thankyou_footer_video_play_1_button_inner">
                                    <span class="thankyou_footer_video_play_1_button_label">Play Video</span>
                                    <span class="thankyou_footer_video_play_1_button_icon" aria-hidden="true">

                                        <svg class="icon icon_play">
                                            <use href="/images/icons.svg#play" />
                                        </svg>

                                    </span>
                                </span>
                            </button>

                            <button class="thankyou_footer_video_pause_1_button js-thankyou-footer-video-pause-1-button">
                                <span class="thankyou_footer_video_pause_1_button_inner">
                                    <span class="thankyou_footer_video_pause_1_button_label">Pause Video</span>
                                    <span class="thankyou_footer_video_pause_1_button_icon" aria-hidden="true">

                                        <svg class="icon icon_pause">
                                            <use href="/images/icons.svg#pause" />
                                        </svg>

                                    </span>
                                </span>
                            </button>
                        </div>
                    </div>
                    <div class="thankyou_footer_media_item">
                        <div class="js-thankyou-video-wrapper thankyou_footer_video" data-index="2" data-background-video='{"display":"background","id":"8L2x7aGNmD0","type":"youtube","title":"Paul Smiths","autoplay":false}'>
                            <div class="thankyou_footer_video_iframe_wrap">
                                <div class="thankyou_footer_video_iframe_target js-iframe-target"></div>
                            </div>
                        </div>
                        <figure class="thankyou_footer_media_item_figure">

                            <img class="thankyou_footer_media_item_image" srcset="https://images.fastspot.com/generic/980x552/3 980w, https://images.fastspot.com/generic/740x416/3 740w, https://images.fastspot.com/generic/500x282/3 500w, https://images.fastspot.com/generic/300x169/3 300w" src="https://images.fastspot.com/generic/300x169/3" alt="" loading="lazy" width="300" height="169">
                        </figure>
                        <div class="thankyou_footer_video_controls">

                            <button class="thankyou_footer_video_play_2_button js-thankyou-footer-video-play-2-button">
                                <span class="thankyou_footer_video_play_2_button_inner">
                                    <span class="thankyou_footer_video_play_2_button_label">Play Video</span>
                                    <span class="thankyou_footer_video_play_2_button_icon" aria-hidden="true">

                                        <svg class="icon icon_play">
                                            <use href="/images/icons.svg#play" />
                                        </svg>

                                    </span>
                                </span>
                            </button>

                            <button class="thankyou_footer_video_pause_2_button js-thankyou-footer-video-pause-2-button">
                                <span class="thankyou_footer_video_pause_2_button_inner">
                                    <span class="thankyou_footer_video_pause_2_button_label">Pause Video</span>
                                    <span class="thankyou_footer_video_pause_2_button_icon" aria-hidden="true">

                                        <svg class="icon icon_pause">
                                            <use href="/images/icons.svg#pause" />
                                        </svg>

                                    </span>
                                </span>
                            </button>
                        </div>
                    </div>
                    <div class="thankyou_footer_media_item">
                        <div class="js-thankyou-video-wrapper thankyou_footer_video" data-index="3" data-background-video='{"display":"background","id":"p5YPicvtj5Y","type":"youtube","title":"Paul Smiths","autoplay":false}'>
                            <div class="thankyou_footer_video_iframe_wrap">
                                <div class="thankyou_footer_video_iframe_target js-iframe-target"></div>
                            </div>
                        </div>
                        <figure class="thankyou_footer_media_item_figure">

                            <img class="thankyou_footer_media_item_image" srcset="https://images.fastspot.com/generic/980x552/4 980w, https://images.fastspot.com/generic/740x416/4 740w, https://images.fastspot.com/generic/500x282/4 500w, https://images.fastspot.com/generic/300x169/4 300w" src="https://images.fastspot.com/generic/300x169/4" alt="" loading="lazy" width="300" height="169">
                        </figure>
                        <div class="thankyou_footer_video_controls">

                            <button class="thankyou_footer_video_play_3_button js-thankyou-footer-video-play-3-button">
                                <span class="thankyou_footer_video_play_3_button_inner">
                                    <span class="thankyou_footer_video_play_3_button_label">Play Video</span>
                                    <span class="thankyou_footer_video_play_3_button_icon" aria-hidden="true">

                                        <svg class="icon icon_play">
                                            <use href="/images/icons.svg#play" />
                                        </svg>

                                    </span>
                                </span>
                            </button>

                            <button class="thankyou_footer_video_pause_3_button js-thankyou-footer-video-pause-3-button">
                                <span class="thankyou_footer_video_pause_3_button_inner">
                                    <span class="thankyou_footer_video_pause_3_button_label">Pause Video</span>
                                    <span class="thankyou_footer_video_pause_3_button_icon" aria-hidden="true">

                                        <svg class="icon icon_pause">
                                            <use href="/images/icons.svg#pause" />
                                        </svg>

                                    </span>
                                </span>
                            </button>
                        </div>
                    </div>
                </div>
                <div class="thankyou_footer_social">
                    <div class="thankyou_footer_social_inner">
                        <a href="#" class="thankyou_footer_social_link">
                            <span class="thankyou_footer_social_link_label">facebook</span>
                            <span class="thankyou_footer_social_link_icon">
                                <svg class="icon icon_facebook">
                                    <use href="/images/icons.svg#facebook" />
                                </svg>
                            </span>
                        </a>
                        <a href="#" class="thankyou_footer_social_link">
                            <span class="thankyou_footer_social_link_label">twitter</span>
                            <span class="thankyou_footer_social_link_icon">
                                <svg class="icon icon_twitter">
                                    <use href="/images/icons.svg#twitter" />
                                </svg>
                            </span>
                        </a>
                        <a href="#" class="thankyou_footer_social_link">
                            <span class="thankyou_footer_social_link_label">instagram</span>
                            <span class="thankyou_footer_social_link_icon">
                                <svg class="icon icon_instagram">
                                    <use href="/images/icons.svg#instagram" />
                                </svg>
                            </span>
                        </a>
                        <a href="#" class="thankyou_footer_social_link">
                            <span class="thankyou_footer_social_link_label">youtube</span>
                            <span class="thankyou_footer_social_link_icon">
                                <svg class="icon icon_youtube">
                                    <use href="/images/icons.svg#youtube" />
                                </svg>
                            </span>
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="thankyou_footer">
	<div class="thankyou_footer_media">
		<figure class="thankyou_footer_figure">
			{% include '@partial-picture' with {
				class: 'thankyou_footer',
				image: image,
				alt: '',
				loading: 'lazy',
				default: img.portraitFull.xsml,
				sources: {
					'1220px': img.wide.xlrg,
					'980px': img.wide.lrg,
					'740px': img.full.med,
					'500px': img.square.sml
				}
			} %}
		</figure>
	</div>
	<div class="fs-row">
		<div class="fs-cell">
			<div class="thankyou_footer_inner">
				<h2 class="thankyou_footer_title">{{ subheading }} <span class="large">{{ title }}</span> {{ suffix }}</h2>
				<div class="thankyou_footer_media_wrapper">
					{% for item in media %}
					<div class="thankyou_footer_media_item">
						{% if item.video %}
							{% set video_options = {
								display: "background",
								id: item.video.id,
								type: item.video.type,
								title: item.video.title,
								autoplay: false
							} %}
							<div class="js-thankyou-video-wrapper thankyou_footer_video" data-index="{{ loop.index }}" data-background-video='{{ video_options|json_encode }}'>
								<div class="thankyou_footer_video_iframe_wrap">
									<div class="thankyou_footer_video_iframe_target js-iframe-target"></div>
								</div>
							</div>
						{% endif %}
						<figure class="thankyou_footer_media_item_figure">
							{% include '@partial-image' with {
								class: 'thankyou_footer_media_item',
								alt: '',
								image: item.image,
								loading: 'lazy',
								sources: [
									img.wide.med,
									img.wide.sml,
									img.wide.xsml,
									img.wide.xxsml
								]
							} %}
						</figure>
						{% if item.video %}
							<div class="thankyou_footer_video_controls">
								{% render '@partial-button' with {
									class: 'thankyou_footer_video_play_' ~ loop.index,
									title: 'Play Video',
									icon: 'play',
									js: true
								} %}

								{% render "@partial-button" with {
									class: 'thankyou_footer_video_pause_' ~ loop.index,
									title: 'Pause Video',
									icon: 'pause',
									js: true
								} %}
							</div>
						{% endif %}
					</div>
					{% endfor %}
				</div>
				<div class="thankyou_footer_social">
					<div class="thankyou_footer_social_inner">
						{% for item in social %}
						<a href="#" class="thankyou_footer_social_link">
							<span class="thankyou_footer_social_link_label">{{ item }}</span>
							<span class="thankyou_footer_social_link_icon">{{ icon(item) }}</span>
						</a>
						{% endfor %}
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

No notes defined.