<div class="image-carousel-hero-slide__background">
    {{> @cp-medium-image backgroundResponsiveImage}}
</div>
<div class="image-carousel-hero-slide__inner js-item-inner">
    <div class="grid-container">
        <div class="grid-x grid-padding-x image-carousel-hero-slide__grid">
            <div class="image-carousel-hero__info-container js-info-container">
                <div class="image-carousel-hero__info-text js-info-text">
                    {{#if backgroundResponsiveImage.location}}
                    <p class="image-carousel-hero__location">{{backgroundResponsiveImage.location}}</p>
                    {{/if}}
                    {{#if backgroundResponsiveImage.photoCredit}}
                    <p class="image-carousel-hero__photo-credit">&copy; {{backgroundResponsiveImage.photoCredit}}</p>
                    {{/if}}
                </div>
                <button class="image-carousel-hero__information-icon js-information-icon" aria-label="More information"></button>
            </div>
        </div>
    </div>
</div>