Brand Cards Carousel: Standard Cards Gray Theme

HTML
View
Context
Info
Notes


        <div role="region" class="carousel brand-cards-carousel brand-cards-carousel--gray  padding-top-xxl padding-bottom-xxl" data-module="brandCardsCarousel" data-sitecore-recommendation="" data-nba-instruction="">
    <div class="grid-container">
        <div class="grid-x grid-margin-x">
            <div class="cell">
                <div class="brand-cards-carousel__text-content">
                    <h2 class="brand-cards-carousel__title">More places to discover</h2>
                    <p class="brand-cards-carousel__subtitle">One amazing island. Six unique regions. Mix and match for your perfect holiday.</p>
                </div>
                <div class="carousel__slider brand-cards-carousel__slider grid-x js-brand-cards-carousel-slider">
                    <div class="carousel__slide brand-cards-carousel__slide cell spacer-md">
                        <div data-module="card" class="card-standard js-card-standard js-card-generic     ">
                            <button class="like-button js-like-button like-button--default" role="button" aria-label="Save this article">
                                <span class="like-button__text"></span>
                                <span class="like-button__wave"></span>
                            </button>
                            <template class="js-small-image-template">
                                <div class="card-standard__small-image-container js-small-image-container">
                                    <figure class="image js-image  js-small-image" data-module="imagelazy" data-is-small-image="">
                                        <img class="image__lowres js-image-lazyload" data-object-fit data-src="https://hctimediadev.blob.core.windows.net/hctimediadev/TestPages/PlaceHolderImages/e6ac3aff3a07489691bb6c983ba20810.jpg?w&#x3D;50" alt="">
                                        <picture class="image__container">
                                            <source media="(max-width: 767px)" class="js-small-image" type="image/jpeg" data-srcset="https://hctimediadev.blob.core.windows.net/hctimediadev/TestPages/PlaceHolderImages/e6ac3aff3a07489691bb6c983ba20810.jpg?w&#x3D;639" />
                                            <source media="(min-width: 768px) and (max-width:1023px)" class="js-medium-image" type="image/jpeg" data-srcset="https://hctimediadev.blob.core.windows.net/hctimediadev/TestPages/PlaceHolderImages/e6ac3aff3a07489691bb6c983ba20810.jpg?w&#x3D;1900" />
                                            <source media="(min-width: 1024px) and (max-width:1319px)" class="js-semilarge-image" type="image/jpeg" data-srcset="https://hctimediadev.blob.core.windows.net/hctimediadev/TestPages/PlaceHolderImages/e6ac3aff3a07489691bb6c983ba20810.jpg?w&#x3D;1900" />
                                            <source media="(min-width: 1320px)" class="js-large-image" type="image/jpeg" data-srcset="https://hctimediadev.blob.core.windows.net/hctimediadev/TestPages/PlaceHolderImages/e6ac3aff3a07489691bb6c983ba20810.jpg?w&#x3D;1900" />
                                            <img class="js-image-lazyload js-fallback-image" data-object-fit data-src="" alt="">
                                        </picture>
                                    </figure>
                                </div>
                            </template>
                            <a href="#" class="card-standard__anchor js-link card-standard__anchor--has-page-type" aria-label="Gardens in Ireland have a magic edge">
                                <div class="card-standard__image-container js-image-container">
                                    <figure class="image js-image  " data-module="imagelazy" data-is-small-image="">
                                        <img class="image__lowres js-image-lazyload" data-object-fit data-src="https://hctimediadev.blob.core.windows.net/hctimediadev/TestPages/PlaceHolderImages/e6ac3aff3a07489691bb6c983ba20810.jpg?w&#x3D;50" alt="">
                                        <picture class="image__container">
                                            <source media="(max-width: 767px)" class="js-small-image" type="image/jpeg" data-srcset="https://hctimediadev.blob.core.windows.net/hctimediadev/TestPages/PlaceHolderImages/e6ac3aff3a07489691bb6c983ba20810.jpg?w&#x3D;639" />
                                            <source media="(min-width: 768px) and (max-width:1023px)" class="js-medium-image" type="image/jpeg" data-srcset="https://hctimediadev.blob.core.windows.net/hctimediadev/TestPages/PlaceHolderImages/e6ac3aff3a07489691bb6c983ba20810.jpg?w&#x3D;1900" />
                                            <source media="(min-width: 1024px) and (max-width:1319px)" class="js-semilarge-image" type="image/jpeg" data-srcset="https://hctimediadev.blob.core.windows.net/hctimediadev/TestPages/PlaceHolderImages/e6ac3aff3a07489691bb6c983ba20810.jpg?w&#x3D;1900" />
                                            <source media="(min-width: 1320px)" class="js-large-image" type="image/jpeg" data-srcset="https://hctimediadev.blob.core.windows.net/hctimediadev/TestPages/PlaceHolderImages/e6ac3aff3a07489691bb6c983ba20810.jpg?w&#x3D;1900" />
                                            <img class="js-image-lazyload js-fallback-image" data-object-fit data-src="" alt="">
                                        </picture>
                                    </figure>
                                </div>
                                <div class="card-standard__inner">
                                    <div class="card-standard__details">
                                        <time class="card-standard__read-time js-readtime" datetime="">4 min read</time>
                                        <h3 class="card-standard__title js-title">Gardens in Ireland have a magic edge</h3>
                                        <p class="card-standard__subtitle js-subtitle">Vestibulum aliquet lobortis malesuada. Etiam sed eros ac ex vehicula tincidunt.</p>
                                        <p class="card-standard__page-type js-page-type">Generic</p>
                                    </div>
                                </div>
                            </a>
                        </div>
                    </div>
                    <div class="carousel__slide brand-cards-carousel__slide cell spacer-md">
                        <div data-module="card" class="card-standard js-card-standard js-card-generic    has-location ">
                            <template class="js-small-image-template">
                                <div class="card-standard__small-image-container js-small-image-container">
                                    <figure class="image js-image  js-small-image" data-module="imagelazy" data-is-small-image="">
                                        <img class="image__lowres js-image-lazyload" data-object-fit data-src="https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;50&amp;q&#x3D;10" alt="">
                                        <picture class="image__container">
                                            <source media="(max-width: 767px)" class="js-small-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;800&amp;q&#x3D;80" />
                                            <source media="(min-width: 768px) and (max-width:1023px)" class="js-medium-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <source media="(min-width: 1024px) and (max-width:1319px)" class="js-semilarge-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <source media="(min-width: 1320px)" class="js-large-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <img class="js-image-lazyload js-fallback-image" data-object-fit data-src="" alt="">
                                        </picture>
                                    </figure>
                                </div>
                            </template>
                            <a href="#" class="card-standard__anchor js-link card-standard__anchor--has-page-type" aria-label="Gardens in Ireland have a magic edge">
                                <div class="card-standard__image-container js-image-container">
                                    <figure class="image js-image  " data-module="imagelazy" data-is-small-image="">
                                        <img class="image__lowres js-image-lazyload" data-object-fit data-src="https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;50&amp;q&#x3D;10" alt="">
                                        <picture class="image__container">
                                            <source media="(max-width: 767px)" class="js-small-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;800&amp;q&#x3D;80" />
                                            <source media="(min-width: 768px) and (max-width:1023px)" class="js-medium-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <source media="(min-width: 1024px) and (max-width:1319px)" class="js-semilarge-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <source media="(min-width: 1320px)" class="js-large-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <img class="js-image-lazyload js-fallback-image" data-object-fit data-src="" alt="">
                                        </picture>
                                    </figure>
                                </div>
                                <div class="card-standard__inner">
                                    <div class="card-standard__details">
                                        <div class="card-standard__trip-idea-info card-standard__trip-idea-info--hiking">
                                            3 days 118 miles
                                        </div>
                                        <time class="card-standard__read-time js-readtime" datetime="">4 min read</time>
                                        <h3 class="card-standard__title js-title">Gardens in Ireland have a magic edge</h3>
                                        <p class="card-standard__location js-location-name">Belfast</p>
                                        <p class="card-standard__page-type js-page-type">TripIdea</p>
                                    </div>
                                </div>
                            </a>
                        </div>
                    </div>
                    <div class="carousel__slide brand-cards-carousel__slide cell spacer-md">
                        <div data-module="card" class="card-standard js-card-standard js-card-generic    has-location ">
                            <button class="like-button js-like-button like-button--default" role="button" aria-label="Save this article">
                                <span class="like-button__text"></span>
                                <span class="like-button__wave"></span>
                            </button>
                            <template class="js-small-image-template">
                                <div class="card-standard__small-image-container js-small-image-container">
                                    <figure class="image js-image  js-small-image" data-module="imagelazy" data-is-small-image="">
                                        <img class="image__lowres js-image-lazyload" data-object-fit data-src="https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;50&amp;q&#x3D;10" alt="">
                                        <picture class="image__container">
                                            <source media="(max-width: 767px)" class="js-small-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;800&amp;q&#x3D;80" />
                                            <source media="(min-width: 768px) and (max-width:1023px)" class="js-medium-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <source media="(min-width: 1024px) and (max-width:1319px)" class="js-semilarge-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <source media="(min-width: 1320px)" class="js-large-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <img class="js-image-lazyload js-fallback-image" data-object-fit data-src="" alt="">
                                        </picture>
                                    </figure>
                                </div>
                            </template>
                            <a href="#" class="card-standard__anchor js-link card-standard__anchor--has-page-type" aria-label="Generic headline for character limits">
                                <div class="card-standard__image-container js-image-container">
                                    <figure class="image js-image  " data-module="imagelazy" data-is-small-image="">
                                        <img class="image__lowres js-image-lazyload" data-object-fit data-src="https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;50&amp;q&#x3D;10" alt="">
                                        <picture class="image__container">
                                            <source media="(max-width: 767px)" class="js-small-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;800&amp;q&#x3D;80" />
                                            <source media="(min-width: 768px) and (max-width:1023px)" class="js-medium-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <source media="(min-width: 1024px) and (max-width:1319px)" class="js-semilarge-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <source media="(min-width: 1320px)" class="js-large-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <img class="js-image-lazyload js-fallback-image" data-object-fit data-src="" alt="">
                                        </picture>
                                    </figure>
                                </div>
                                <div class="card-standard__inner">
                                    <div class="card-standard__details">
                                        <time class="card-standard__read-time js-readtime" datetime="">14 - 18 March</time>
                                        <h3 class="card-standard__title js-title">Generic headline for character limits</h3>
                                        <p class="card-standard__subtitle js-subtitle">Nulla varius eget diam a volutpat. In neque enim, aliquet ac eleifend vitae, tincidunt vel elit.</p>
                                        <p class="card-standard__location js-location-name">Dublin</p>
                                        <p class="card-standard__page-type js-page-type">LongForm</p>
                                    </div>
                                </div>
                            </a>
                        </div>
                    </div>
                    <div class="carousel__slide brand-cards-carousel__slide cell spacer-md">
                        <div data-module="card" class="card-standard js-card-standard js-card-generic    has-location ">
                            <button class="like-button js-like-button like-button--default" role="button" aria-label="Save this article">
                                <span class="like-button__text"></span>
                                <span class="like-button__wave"></span>
                            </button>
                            <template class="js-small-image-template">
                                <div class="card-standard__small-image-container js-small-image-container">
                                    <figure class="image js-image  js-small-image" data-module="imagelazy" data-is-small-image="">
                                        <img class="image__lowres js-image-lazyload" data-object-fit data-src="https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;50&amp;q&#x3D;10" alt="">
                                        <picture class="image__container">
                                            <source media="(max-width: 767px)" class="js-small-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;800&amp;q&#x3D;80" />
                                            <source media="(min-width: 768px) and (max-width:1023px)" class="js-medium-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <source media="(min-width: 1024px) and (max-width:1319px)" class="js-semilarge-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <source media="(min-width: 1320px)" class="js-large-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <img class="js-image-lazyload js-fallback-image" data-object-fit data-src="" alt="">
                                        </picture>
                                    </figure>
                                </div>
                            </template>
                            <div class="card-standard__anchor--has-page-type">
                                <div class="card-standard__image-container js-image-container">
                                    <figure class="image js-image  " data-module="imagelazy" data-is-small-image="">
                                        <img class="image__lowres js-image-lazyload" data-object-fit data-src="https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;50&amp;q&#x3D;10" alt="">
                                        <picture class="image__container">
                                            <source media="(max-width: 767px)" class="js-small-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;800&amp;q&#x3D;80" />
                                            <source media="(min-width: 768px) and (max-width:1023px)" class="js-medium-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <source media="(min-width: 1024px) and (max-width:1319px)" class="js-semilarge-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <source media="(min-width: 1320px)" class="js-large-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <img class="js-image-lazyload js-fallback-image" data-object-fit data-src="" alt="">
                                        </picture>
                                    </figure>
                                </div>
                                <div class="card-standard__inner">
                                    <div class="card-standard__details">
                                        <time class="card-standard__read-time js-readtime" datetime="">14 - 18 March</time>
                                        <h3 class="card-standard__title js-title">Generic headline for character limits</h3>
                                        <p class="card-standard__location js-location-name">Dublin</p>
                                        <a href="#" class="card-standard__link card-standard__details-link card-standard__link--bold js-details-link" aria-label="View details">View details</a>
                                        <p class="card-standard__page-type js-page-type">ShortForm</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="carousel__slide brand-cards-carousel__slide cell spacer-md">
                        <div data-module="card" class="card-standard js-card-standard js-card-generic     ">
                            <button class="like-button js-like-button like-button--default" role="button" aria-label="Save this article">
                                <span class="like-button__text"></span>
                                <span class="like-button__wave"></span>
                            </button>
                            <template class="js-small-image-template">
                                <div class="card-standard__small-image-container js-small-image-container">
                                    <figure class="image js-image  js-small-image" data-module="imagelazy" data-is-small-image="">
                                        <img class="image__lowres js-image-lazyload" data-object-fit data-src="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;50&amp;q&#x3D;10" alt="">
                                        <picture class="image__container">
                                            <source media="(max-width: 767px)" class="js-small-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;800&amp;q&#x3D;80" />
                                            <source media="(min-width: 768px) and (max-width:1023px)" class="js-medium-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <source media="(min-width: 1024px) and (max-width:1319px)" class="js-semilarge-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <source media="(min-width: 1320px)" class="js-large-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <img class="js-image-lazyload js-fallback-image" data-object-fit data-src="" alt="">
                                        </picture>
                                    </figure>
                                </div>
                            </template>
                            <a href="#" class="card-standard__anchor js-link card-standard__anchor--has-page-type" aria-label="Gardens in Ireland have a magic edge">
                                <div class="card-standard__image-container js-image-container">
                                    <figure class="image js-image  " data-module="imagelazy" data-is-small-image="">
                                        <img class="image__lowres js-image-lazyload" data-object-fit data-src="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;50&amp;q&#x3D;10" alt="">
                                        <picture class="image__container">
                                            <source media="(max-width: 767px)" class="js-small-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;800&amp;q&#x3D;80" />
                                            <source media="(min-width: 768px) and (max-width:1023px)" class="js-medium-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <source media="(min-width: 1024px) and (max-width:1319px)" class="js-semilarge-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <source media="(min-width: 1320px)" class="js-large-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <img class="js-image-lazyload js-fallback-image" data-object-fit data-src="" alt="">
                                        </picture>
                                    </figure>
                                </div>
                                <div class="card-standard__inner">
                                    <div class="card-standard__details">
                                        <time class="card-standard__read-time js-readtime" datetime="">4 min read</time>
                                        <h3 class="card-standard__title js-title">Gardens in Ireland have a magic edge</h3>
                                        <p class="card-standard__subtitle js-subtitle">Vestibulum aliquet lobortis malesuada. Etiam sed eros ac ex vehicula tincidunt.</p>
                                        <p class="card-standard__page-type js-page-type">Collection</p>
                                    </div>
                                </div>
                            </a>
                        </div>
                    </div>
                    <div class="carousel__slide brand-cards-carousel__slide cell spacer-md">
                    </div>
                    <div class="carousel__slide brand-cards-carousel__slide cell spacer-md">
                        <div class="card-featured card-featured--campaign js-card-generic" data-module="card">
                            <a href="#" target="_blank" rel="noopener" alt="Visit The West Coast" class="card-featured__anchor js-link" aria-label="Explore the Wild Atlantic Way">
                                <button class="like-button js-like-button like-button--default" role="button" aria-label="Like - Save this article">
                                    <span class="like-button__text">Like</span>
                                    <span class="like-button__wave"></span>
                                </button>
                                <figure class="image js-image  " data-module="imagelazy" data-is-small-image="">
                                    <img class="image__lowres js-image-lazyload" data-object-fit data-src="https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;50&amp;q&#x3D;10" alt="Alt Text">
                                    <picture class="image__container">
                                        <source media="(max-width: 767px)" class="js-small-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;800&amp;q&#x3D;80" />
                                        <source media="(min-width: 768px) and (max-width:1023px)" class="js-medium-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                        <source media="(min-width: 1024px) and (max-width:1319px)" class="js-semilarge-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                        <source media="(min-width: 1320px)" class="js-large-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                        <img class="js-image-lazyload js-fallback-image" data-object-fit data-src="" alt="Alt Text">
                                    </picture>
                                </figure>
                                <div class="video " data-module="video" data-autoplay="true" data-hide-controls="true" data-loop="true" data-muted="">
                                    <template class="js-small-video-template">
                                        <div class="js-video-container video__container" data-poster-url="https://via.placeholder.com/1600x900.png">
                                            <video class="video__player js-video-player" autoplay muted playsinline loop poster="https://via.placeholder.com/1600x900.png">
                                                <source src="/media/campaign-card/GreenButtonCard.mp4" type="video/mp4" />
                                                <source src="/media/campaign-card/GreenButtonCard.mp4" type="video/mp4" />
                                                <track label="English" kind="subtitles" srclang="en" src="/media/porthole-tabber/porthole_experience-brand-hero_IAE_V2-en.vtt" />
                                                <track label="German" kind="subtitles" srclang="de" src="/media/porthole-tabber/porthole_experience-brand-hero_IAE_V2-de.vtt" />
                                            </video>
                                        </div>
                                    </template>
                                    <template class="js-medium-video-template">
                                        <div class="js-video-container video__container" data-poster-url="https://via.placeholder.com/1600x900.png">
                                            <video class="video__player js-video-player" autoplay muted playsinline loop poster="https://via.placeholder.com/1600x900.png">
                                                <source src="/media/campaign-card/GreenButtonCard.mp4" type="video/mp4" />
                                                <track label="English" kind="subtitles" srclang="en" src="/media/porthole-tabber/porthole_experience-brand-hero_IAE_V2-en.vtt" />
                                                <track label="German" kind="subtitles" srclang="de" src="/media/porthole-tabber/porthole_experience-brand-hero_IAE_V2-de.vtt" />
                                            </video>
                                        </div>
                                    </template>
                                    <div class="js-video-container video__container"></div>
                                </div>
                                <p class="card-featured__campaign-tag js-page-type">Push The Green Button</p>
                                <div class="card-featured__overlay">
                                    <h2 class="card-featured__title js-title">Explore the Wild Atlantic Way</h2>
                                    <p class="card-featured__location js-location-name">Dublin</p>
                                    <div class="hashtags  " data-module="hashtags">
                                        <ul>
                                            <li><span class="hashtags__link js-hashtag-link" data-tag-name="wildAtlandticWay" aria-label="#WildAtlanticWay" onclick="window.location='#wildAtlanticWay'" onkeydown="if(event.keyCode === 13) window.location.href='#wildAtlanticWay'" role="button" tabindex="0">#WildAtlanticWay</span></li>
                                        </ul>
                                    </div>
                                </div>
                            </a>
                        </div>
                    </div>
                    <div class="carousel__slide brand-cards-carousel__slide cell spacer-md">
                        <div data-module="card" class="card-standard js-card-standard js-card-generic    has-location has-tags">
                            <template class="js-small-image-template">
                                <div class="card-standard__small-image-container js-small-image-container">
                                    <figure class="image js-image  js-small-image" data-module="imagelazy" data-is-small-image="">
                                        <img class="image__lowres js-image-lazyload" data-object-fit data-src="https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;50&amp;q&#x3D;10" alt="">
                                        <picture class="image__container">
                                            <source media="(max-width: 767px)" class="js-small-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;800&amp;q&#x3D;80" />
                                            <source media="(min-width: 768px) and (max-width:1023px)" class="js-medium-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <source media="(min-width: 1024px) and (max-width:1319px)" class="js-semilarge-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <source media="(min-width: 1320px)" class="js-large-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <img class="js-image-lazyload js-fallback-image" data-object-fit data-src="https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" alt="">
                                        </picture>
                                    </figure>
                                </div>
                            </template>
                            <a href="#" class="card-standard__anchor js-link " aria-label="Gorgeous gardens of Irelands Ancient East">
                                <div class="card-standard__image-container js-image-container">
                                    <figure class="image js-image  " data-module="imagelazy" data-is-small-image="">
                                        <img class="image__lowres js-image-lazyload" data-object-fit data-src="https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;50&amp;q&#x3D;10" alt="">
                                        <picture class="image__container">
                                            <source media="(max-width: 767px)" class="js-small-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;800&amp;q&#x3D;80" />
                                            <source media="(min-width: 768px) and (max-width:1023px)" class="js-medium-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <source media="(min-width: 1024px) and (max-width:1319px)" class="js-semilarge-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <source media="(min-width: 1320px)" class="js-large-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <img class="js-image-lazyload js-fallback-image" data-object-fit data-src="https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" alt="">
                                        </picture>
                                    </figure>
                                </div>
                                <div class="card-standard__inner">
                                    <div class="card-standard__details">
                                        <h3 class="card-standard__title js-title">Gorgeous gardens of Irelands Ancient East</h3>
                                        <p class="card-standard__location js-location-name">Belfast</p>
                                        <div class="hashtags  " data-module="hashtags">
                                            <ul>
                                                <li><span class="hashtags__link js-hashtag-link" aria-label="#Citybreak" role="button" tabindex="0">#Citybreak</span></li>
                                                <li><span class="hashtags__link js-hashtag-link" aria-label="#Adventure" role="button" tabindex="0">#Adventure</span></li>
                                                <li><span class="hashtags__link js-hashtag-link" aria-label="#Surfing" role="button" tabindex="0">#Surfing</span></li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                            </a>
                        </div>
                    </div>
                    <div class="carousel__slide brand-cards-carousel__slide cell spacer-md">
                        <div data-module="card" class="card-standard js-card-standard js-card-generic    has-location card-standard--destination ">
                            <button class="like-button js-like-button like-button--default" role="button" aria-label="Save this article">
                                <span class="like-button__text"></span>
                                <span class="like-button__wave"></span>
                            </button>
                            <template class="js-small-image-template">
                                <div class="card-standard__small-image-container js-small-image-container">
                                    <figure class="image js-image  js-small-image" data-module="imagelazy" data-is-small-image="">
                                        <img class="image__lowres js-image-lazyload" data-object-fit data-src="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;50&amp;q&#x3D;10" alt="">
                                        <picture class="image__container">
                                            <source media="(max-width: 767px)" class="js-small-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;800&amp;q&#x3D;80" />
                                            <source media="(min-width: 768px) and (max-width:1023px)" class="js-medium-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <source media="(min-width: 1024px) and (max-width:1319px)" class="js-semilarge-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <source media="(min-width: 1320px)" class="js-large-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <img class="js-image-lazyload js-fallback-image" data-object-fit data-src="" alt="">
                                        </picture>
                                    </figure>
                                </div>
                            </template>
                            <a href="#" class="card-standard__anchor js-link card-standard__anchor--has-page-type" aria-label="Gardens in Ireland have a magic edge">
                                <div class="card-standard__image-container js-image-container">
                                    <figure class="image js-image  " data-module="imagelazy" data-is-small-image="">
                                        <img class="image__lowres js-image-lazyload" data-object-fit data-src="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;50&amp;q&#x3D;10" alt="">
                                        <picture class="image__container">
                                            <source media="(max-width: 767px)" class="js-small-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;800&amp;q&#x3D;80" />
                                            <source media="(min-width: 768px) and (max-width:1023px)" class="js-medium-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <source media="(min-width: 1024px) and (max-width:1319px)" class="js-semilarge-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <source media="(min-width: 1320px)" class="js-large-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <img class="js-image-lazyload js-fallback-image" data-object-fit data-src="" alt="">
                                        </picture>
                                    </figure>
                                </div>
                                <div class="card-standard__inner">
                                    <div class="card-standard__details">
                                        <h3 class="card-standard__title js-title">Gardens in Ireland have a magic edge</h3>
                                        <p class="card-standard__subtitle js-subtitle">Progressively supply state of the art partnerships with 24/7 e-services. Interactively incentivize.</p>
                                        <p class="card-standard__location js-location-name">Dublin</p>
                                        <p class="card-standard__page-type js-page-type">Destination</p>
                                    </div>
                                </div>
                            </a>
                        </div>
                    </div>
                    <div class="carousel__slide brand-cards-carousel__slide cell spacer-md">
                        <div data-module="card" class="card-standard js-card-standard js-card-generic    has-location has-tags" data-card-id=1235 data-longitude="-7.13721" data-latitude="52.26538">
                            <div class="location-marker js-location-marker" data-module="locationMarker" data-longitude="-7.13721" data-latitude="52.26538">
                                <div class="location-marker__text">
                                    <span class="location-marker__text-description js-marker-description"></span>
                                    <span class="location-marker__distance js-marker-distance"></span>
                                </div>
                            </div>
                            <button class="like-button js-like-button like-button--default" role="button" aria-label="Save this article">
                                <span class="like-button__text"></span>
                                <span class="like-button__wave"></span>
                            </button>
                            <template class="js-small-image-template">
                                <div class="card-standard__small-image-container js-small-image-container">
                                    <figure class="image js-image  js-small-image" data-module="imagelazy" data-is-small-image="">
                                        <img class="image__lowres js-image-lazyload" data-object-fit data-src="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;50&amp;q&#x3D;10" alt="">
                                        <picture class="image__container">
                                            <source media="(max-width: 767px)" class="js-small-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;800&amp;q&#x3D;80" />
                                            <source media="(min-width: 768px) and (max-width:1023px)" class="js-medium-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <source media="(min-width: 1024px) and (max-width:1319px)" class="js-semilarge-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <source media="(min-width: 1320px)" class="js-large-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <img class="js-image-lazyload js-fallback-image" data-object-fit data-src="" alt="">
                                        </picture>
                                    </figure>
                                </div>
                            </template>
                            <a href="#" class="card-standard__anchor js-link card-standard__anchor--has-page-type" aria-label="Competition example">
                                <div class="card-standard__image-container js-image-container">
                                    <figure class="image js-image  " data-module="imagelazy" data-is-small-image="">
                                        <img class="image__lowres js-image-lazyload" data-object-fit data-src="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;50&amp;q&#x3D;10" alt="">
                                        <picture class="image__container">
                                            <source media="(max-width: 767px)" class="js-small-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;800&amp;q&#x3D;80" />
                                            <source media="(min-width: 768px) and (max-width:1023px)" class="js-medium-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <source media="(min-width: 1024px) and (max-width:1319px)" class="js-semilarge-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <source media="(min-width: 1320px)" class="js-large-image" type="image/jpeg" data-srcset="https://images.unsplash.com/photo-1551819561-c69621886139?ixlib&#x3D;rb-1.2.1&amp;ixid&#x3D;eyJhcHBfaWQiOjEyMDd9&amp;auto&#x3D;format&amp;fit&#x3D;crop&amp;w&#x3D;1600&amp;q&#x3D;80" />
                                            <img class="js-image-lazyload js-fallback-image" data-object-fit data-src="" alt="">
                                        </picture>
                                    </figure>
                                </div>
                                <div class="card-standard__inner">
                                    <div class="card-standard__details">
                                        <h3 class="card-standard__title js-title">Competition example</h3>
                                        <p class="card-standard__subtitle js-subtitle">Progressively supply state of the art partnerships with 24/7 e-services. Interactively incentivize.</p>
                                        <p class="card-standard__closes-text">Closes 31 December 2020</p>
                                        <p class="card-standard__location js-location-name">Dublin</p>
                                        <div class="hashtags  " data-module="hashtags">
                                            <ul>
                                                <li><span class="hashtags__link js-hashtag-link" data-tag-name="citybreak" aria-label="#Citybreak" role="button" tabindex="0">#Citybreak</span></li>
                                                <li><span class="hashtags__link js-hashtag-link" data-tag-name="adventure" aria-label="#Adventure" role="button" tabindex="0">#Adventure</span></li>
                                                <li><span class="hashtags__link js-hashtag-link" data-tag-name="surfing" aria-label="#Surfing" role="button" tabindex="0">#Surfing</span></li>
                                            </ul>
                                        </div>
                                        <p class="card-standard__page-type js-page-type">Competition</p>
                                    </div>
                                </div>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>


        <div role="region" class="carousel brand-cards-carousel {{#if theme}}brand-cards-carousel--{{theme}} {{else}}brand-cards-carousel--white{{/if}} {{#if paddingTop}}{{paddingTop}}{{/if}} {{#if paddingBottom}}{{paddingBottom}}{{/if}}" data-module="brandCardsCarousel" data-sitecore-recommendation="{{sitecoreRecommendation}}" data-nba-instruction="{{nbaInstruction}}" >
    <div class="grid-container">
        <div class="grid-x grid-margin-x">
            <div class="cell">
                <div class="brand-cards-carousel__text-content">
                    {{#if title}}<h2 class="brand-cards-carousel__title">{{{title}}}</h2>{{/if}}
                    {{#if subtitle}}<p class="brand-cards-carousel__subtitle">{{{subtitle}}}</p>{{/if}}
                </div>
                <div class="carousel__slider brand-cards-carousel__slider grid-x js-brand-cards-carousel-slider">
                    {{#each cards}}
                        <div class="carousel__slide brand-cards-carousel__slide cell spacer-md">
                            {{#if ../featured }}
                            {{> @cp-card-featured }}
                            {{else}}
                            {{> @cp-card-standard }}
                            {{/if}}
                        </div>
                    {{/each}}
                </div>
            </div>
        </div>
    </div>
</div>


            {
  "title": "More places to discover",
  "subtitle": "One amazing island. Six unique regions. Mix and match for your perfect holiday.",
  "theme": "gray",
  "paddingBottom": "padding-bottom-xxl",
  "paddingTop": "padding-top-xxl",
  "cards": [
    {
      "webAppMode": true,
      "likeText": "Like",
      "responsiveImage": {
        "altText": "Alt Text",
        "lowResolutionUrl": "https://hctimediadev.blob.core.windows.net/hctimediadev/TestPages/PlaceHolderImages/e6ac3aff3a07489691bb6c983ba20810.jpg?w=50",
        "sources": [
          {
            "type": "image/jpeg",
            "largeUrl": "https://hctimediadev.blob.core.windows.net/hctimediadev/TestPages/PlaceHolderImages/e6ac3aff3a07489691bb6c983ba20810.jpg?w=1900",
            "smallUrl": "https://hctimediadev.blob.core.windows.net/hctimediadev/TestPages/PlaceHolderImages/e6ac3aff3a07489691bb6c983ba20810.jpg?w=639"
          }
        ]
      },
      "cardType": "Generic",
      "pageType": "Generic",
      "title": "Gardens in Ireland have a magic edge",
      "subtitle": "Vestibulum aliquet lobortis malesuada. Etiam sed eros ac ex vehicula tincidunt.",
      "timeSpan": {
        "text": "4 min read"
      },
      "link": {
        "text": "",
        "url": "#"
      }
    },
    {
      "cardType": "TripIdea",
      "responsiveImage": {
        "dominantColour": "#938C7D",
        "altText": "Alt Text",
        "lowResolutionUrl": "https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=50&q=10",
        "sources": [
          {
            "type": "image/jpeg",
            "largeUrl": "https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1600&q=80",
            "smallUrl": "https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=800&q=80"
          }
        ]
      },
      "pageType": "TripIdea",
      "title": "Gardens in Ireland have a magic edge",
      "subtitle": "",
      "timeSpan": {
        "text": "4 min read"
      },
      "locationName": "Belfast",
      "tripInfo": {
        "travelMethod": "hiking",
        "text": "3 days 118 miles"
      }
    },
    {
      "webAppMode": true,
      "likeText": "Like",
      "responsiveImage": {
        "altText": "Alt Text",
        "lowResolutionUrl": "https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=50&q=10",
        "sources": [
          {
            "type": "image/jpeg",
            "largeUrl": "https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1600&q=80",
            "smallUrl": "https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=800&q=80"
          }
        ]
      },
      "cardType": "LongForm",
      "pageType": "LongForm",
      "title": "Generic headline for character limits",
      "subtitle": "Nulla varius eget diam a volutpat. In neque enim, aliquet ac eleifend vitae, tincidunt vel elit.",
      "locationName": "Dublin",
      "timeSpan": {
        "text": "14 - 18 March"
      },
      "link": {
        "text": "",
        "url": "#"
      }
    },
    {
      "webAppMode": true,
      "likeText": "Like",
      "responsiveImage": {
        "altText": "Alt Text",
        "lowResolutionUrl": "https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=50&q=10",
        "sources": [
          {
            "type": "image/jpeg",
            "largeUrl": "https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1600&q=80",
            "smallUrl": "https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=800&q=80"
          }
        ]
      },
      "cardType": "ShortForm",
      "pageType": "ShortForm",
      "title": "Generic headline for character limits",
      "locationName": "Dublin",
      "timeSpan": {
        "text": "14 - 18 March"
      },
      "link": {
        "text": "Visit event website",
        "url": "#",
        "isExternal": true,
        "target": "_blank"
      },
      "detailsLink": {
        "text": "View details",
        "url": "#"
      }
    },
    {
      "webAppMode": true,
      "likeText": "Like",
      "responsiveImage": {
        "altText": "Alt Text",
        "lowResolutionUrl": "https://images.unsplash.com/photo-1551819561-c69621886139?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=50&q=10",
        "sources": [
          {
            "type": "image/jpeg",
            "largeUrl": "https://images.unsplash.com/photo-1551819561-c69621886139?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1600&q=80",
            "smallUrl": "https://images.unsplash.com/photo-1551819561-c69621886139?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=800&q=80"
          }
        ]
      },
      "cardType": "Collection",
      "pageType": "Collection",
      "title": "Gardens in Ireland have a magic edge",
      "subtitle": "Vestibulum aliquet lobortis malesuada. Etiam sed eros ac ex vehicula tincidunt.",
      "timeSpan": {
        "text": "4 min read"
      },
      "link": {
        "text": "",
        "url": "#"
      }
    },
    {
      "cardType": "Offer",
      "responsiveImage": {
        "dominantColour": "#938C7D",
        "altText": "Alt Text",
        "lowResolutionUrl": "https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=50&q=10",
        "sources": [
          {
            "type": "image/jpeg",
            "largeUrl": "https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1600&q=80",
            "smallUrl": "https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=800&q=80"
          }
        ],
        "fallbackImageUrl": "https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1600&q=80"
      },
      "pageType": "Article",
      "title": "Gorgeous gardens of Irelands Ancient East",
      "subtitle": "",
      "locationName": "Belfast",
      "offer": {
        "title": "Save £100",
        "currency": "€",
        "amount": 169,
        "beforeText": "From",
        "afterText": "pps",
        "category": "Accommodation"
      },
      "tags": {
        "isLarge": false,
        "hasBackground": true,
        "hashtags": [
          {
            "text": "#Citybreak",
            "url": "#citybreak",
            "ariaLabel": "Aria Label"
          },
          {
            "text": "#Adventure",
            "url": "#adventure",
            "ariaLabel": "Aria Label"
          },
          {
            "text": "#Surfing",
            "url": "#surfing",
            "ariaLabel": "Aria Label"
          }
        ]
      }
    },
    {
      "cardType": "Campaign",
      "webAppMode": true,
      "likeText": "Like",
      "responsiveImage": {
        "altText": "Alt Text",
        "lowResolutionUrl": "https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=50&q=10",
        "sources": [
          {
            "type": "image/jpeg",
            "largeUrl": "https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1600&q=80",
            "smallUrl": "https://images.unsplash.com/photo-1549918864-48ac978761a4?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=800&q=80"
          }
        ]
      },
      "fullVideo": {
        "isYouTube": false,
        "video": {
          "videoUrls": [
            {
              "type": "video/mp4",
              "url": "/media/campaign-card/GreenButtonCard.mp4"
            }
          ],
          "mobileVideoUrls": [
            {
              "type": "video/mp4",
              "url": "/media/campaign-card/GreenButtonCard.mp4"
            },
            {
              "type": "video/mp4",
              "url": "/media/campaign-card/GreenButtonCard.mp4"
            }
          ],
          "posterUrl": "https://via.placeholder.com/1600x900.png",
          "captions": [
            {
              "language": "English",
              "languageCode": "en",
              "url": "/media/porthole-tabber/porthole_experience-brand-hero_IAE_V2-en.vtt"
            },
            {
              "language": "German",
              "languageCode": "de",
              "url": "/media/porthole-tabber/porthole_experience-brand-hero_IAE_V2-de.vtt"
            }
          ]
        }
      },
      "campaignTag": "Push The Green Button",
      "title": "Explore the Wild Atlantic Way",
      "locationName": "Dublin",
      "link": {
        "text": "Visit The West Coast",
        "url": "#",
        "target": "_blank"
      },
      "tags": {
        "isLarge": false,
        "hasBackground": true,
        "hashtags": [
          {
            "text": "#WildAtlanticWay",
            "url": "#wildAtlanticWay",
            "openOnClick": true,
            "tagName": "wildAtlandticWay"
          }
        ]
      }
    },
    {
      "cardType": "MyIreland",
      "responsiveImage": {
        "dominantColour": "#938C7D",
        "altText": "Alt Text",
        "lowResolutionUrl": "https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=50&q=10",
        "sources": [
          {
            "type": "image/jpeg",
            "largeUrl": "https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1600&q=80",
            "smallUrl": "https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=800&q=80"
          }
        ],
        "fallbackImageUrl": "https://images.unsplash.com/photo-1528108058346-0457fb78ab00?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1600&q=80"
      },
      "pageType": "",
      "title": "Gorgeous gardens of Irelands Ancient East",
      "subtitle": "",
      "locationName": "Belfast",
      "tags": {
        "isLarge": false,
        "hashtags": [
          {
            "text": "#Citybreak",
            "url": "#citybreak",
            "ariaLabel": "Aria Label"
          },
          {
            "text": "#Adventure",
            "url": "#adventure",
            "ariaLabel": "Aria Label"
          },
          {
            "text": "#Surfing",
            "url": "#surfing",
            "ariaLabel": "Aria Label"
          }
        ]
      }
    },
    {
      "webAppMode": true,
      "likeText": "Like",
      "responsiveImage": {
        "altText": "Alt Text",
        "lowResolutionUrl": "https://images.unsplash.com/photo-1551819561-c69621886139?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=50&q=10",
        "sources": [
          {
            "type": "image/jpeg",
            "largeUrl": "https://images.unsplash.com/photo-1551819561-c69621886139?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1600&q=80",
            "smallUrl": "https://images.unsplash.com/photo-1551819561-c69621886139?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=800&q=80"
          }
        ]
      },
      "cardType": "Destination",
      "pageType": "Destination",
      "title": "Gardens in Ireland have a magic edge",
      "subtitle": "Progressively supply state of the art partnerships with 24/7 e-services. Interactively incentivize.",
      "locationName": "Dublin",
      "timeSpan": {
        "text": ""
      },
      "link": {
        "text": "",
        "url": "#"
      }
    },
    {
      "responsiveImage": {
        "altText": "Alt Text",
        "lowResolutionUrl": "https://images.unsplash.com/photo-1551819561-c69621886139?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=50&q=10",
        "sources": [
          {
            "type": "image/jpeg",
            "largeUrl": "https://images.unsplash.com/photo-1551819561-c69621886139?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1600&q=80",
            "smallUrl": "https://images.unsplash.com/photo-1551819561-c69621886139?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=800&q=80"
          }
        ]
      },
      "feedType": "Card",
      "webAppMode": true,
      "likeText": "Like",
      "cardId": 1235,
      "location": {
        "longitude": -7.13721,
        "latitude": 52.26538
      },
      "cardType": "Competition",
      "pageType": "Competition",
      "title": "Competition example",
      "subtitle": "Progressively supply state of the art partnerships with 24/7 e-services. Interactively incentivize.",
      "locationName": "Dublin",
      "link": {
        "text": "Open",
        "url": "#"
      },
      "closesText": "Closes 31 December 2020",
      "tags": {
        "isLarge": false,
        "hashtags": [
          {
            "text": "#Citybreak",
            "url": "#citybreak",
            "tagName": "citybreak"
          },
          {
            "text": "#Adventure",
            "url": "#adventure",
            "tagName": "adventure"
          },
          {
            "text": "#Surfing",
            "url": "#surfing",
            "tagName": "surfing"
          }
        ]
      }
    }
  ]
}

Handle: @cp-brand-cards-carousel--standard-cards---gray-theme
Variants (4): Default , Standard Cards Gray Theme , Featured Cards White Theme , Featured Cards Green Theme
Preview:
- With layout
- Component only
Filesystem Path: src\patterns\03-components\collections\cp-brand-cards-carousel.hbs
References (2): @cp-card-featured, @cp-card-standard

There are no notes for this item.

Brand Cards Carousel: Standard Cards Gray Theme

Hero

Media

Site Furniture

Text

Quote

Brand Cards Carousel

Card Collection

Card Collection with Quote

Card Carousel

Featured Carousel

Image Carousel

Editorial Map & Card Grid

Featured Trip Ideas Card Carousel

Hashtags

Highlight List

Icon Cards

Location Access

Offer Cards Carousel

Offset Tout Collection

Porthole Tabber

Tabbed Content

Collage Hero

404 Hero

Experience Brand

Standard

Video

Homepage

Shared Board Hero

Themed Page Hero Video

Media Collage

Video

Image

Rich Media Atom

Thematic Callout

FAB

Navigation

Featured Highlight Item

Key Information Block

Responsive Table

Quote

Richtext

Campaign Tout

Credibility Tout

Large Image Tout

Standard Tout

Seasonal Container

Geolocated Container

Travel To

Hero

Datepicker

Social Share

Immersive Weather Tabs