<!-- Call to Action Visual -->
<div class="js-checkpoint cta_visual theme_sports" data-checkpoint-offset="100" data-checkpoint-intersect="bottom-middle">
    <figure class="cta_visual_figure">

        <picture class="cta_visual_picture">
            <source media="(min-width: 980px)" srcset="https://images.fastspot.com/generic/1440x810/1">
            <source media="(min-width: 740px)" srcset="https://images.fastspot.com/generic/1220x686/1">
            <source media="(min-width: 500px)" srcset="https://images.fastspot.com/generic/980x980/1">
            <img class="cta_visual_image" src="//images.fastspot.com/generic/740x740/1" alt="" loading="lazy" width="740px" height="740px">
        </picture>
    </figure>
    <div class="fs-row">
        <div class="fs-cell">
            <div class="cta_visual_inner">
                <div class="cta_visual_header">
                    <h2 class="cta_visual_title">It’s a beautiful day in the neighborhood.</h2>
                    <div class="cta_visual_meta">
                        <p class="cta_visual_type">Exhibit</p>
                        <p class="cta_visual_location">Sports Museum</p>
                    </div>
                </div>
                <div class="cta_visual_body">
                    <div class="cta_visual_description ">
                        <p>Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Curabitur blandit tempus porttitor. Etiam porta sem malesuada magna mollis euismod. Donec ullamcorper nulla non metus auct.</p>
                    </div>
                </div>
                <div class="cta_visual_action">

                    <a href="#" class="cta_visual_link" aria-label="Link Aria">
                        <span class="cta_visual_link_inner">
                            <span class="cta_visual_link_label">Link Label</span>
                        </span>
                    </a>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- END: Call to Action Visual -->
{#
	{% include '@component-call-to-action-visual' with {
		theme: 'theme',
		image: '1',
		title: 'Title',
		type: 'Type',
		location: 'Location',
		description: 'Description',
		link: {
			url: '#',
			label: 'Link',
			aria: 'aria'
		}
	} %}
#}

<!-- Call to Action Visual -->
<div class="js-checkpoint cta_visual theme_{{ theme }}" data-checkpoint-offset="100" data-checkpoint-intersect="bottom-middle">
	<figure class="cta_visual_figure">
		{% include '@partial-picture' with {
			class: 'cta_visual',
			image: image,
			alt: '',
			loading: 'lazy',
			default: img.square.sml,
			sources: {
				'980px': img.wide.xlrg,
				'740px': img.wide.lrg,
				'500px': img.square.med
			}
		} %}
	</figure>
	<div class="fs-row">
		<div class="fs-cell">
			<div class="cta_visual_inner">
				<div class="cta_visual_header">
					<h2 class="cta_visual_title">{{ title }}</h2>
					<div class="cta_visual_meta">
						<p class="cta_visual_type">{{ type }}</p>
						<p class="cta_visual_location">{{ location }}</p>
					</div>
				</div>
				<div class="cta_visual_body">
					<div class="cta_visual_description ">
						<p>{{ description }}</p>
					</div>
				</div>
				<div class="cta_visual_action">
					{% include '@partial-link' with {
						class: 'cta_visual',
						title: link.label,
						url: link.url,
						aria: link.aria
					} %}
				</div>
			</div>
		</div>
	</div>
</div>
<!-- END: Call to Action Visual -->

No notes defined.