@model SitefinityWebApp.Mvc.Models.CarouselBannerWidgetModel
<div class="main-carousel-parent">
    <div class="main-carousel js-main-carousel">

        @foreach (var item in Model.CarouselBannerItems)
        {
            var darkClass = item.IsDark ? "dark-banner" : "";
            <div class="slider @darkClass full-width-caption">
                <div class="item">
                    <a href="@item.CTALink">
                        <img class="visible-desktop" src="@item.ImageUrl" alt="banner" />
                        <img class="visible-non-desktop" src="@item.PortraitImageUrl" alt="banner" />

                        <div class="container caption" data-aos="fade-right" data-aos-duration="1500">
                            <h5>@item.Header</h5>
                            @if (!string.IsNullOrWhiteSpace(item.Title))
                            {
                                <h1>@item.Title</h1>
                            }
                            @if (!string.IsNullOrWhiteSpace(item.Description))
                            {
                                <p>@item.Description</p>
                            }
                        </div>
                    </a>
                </div>
            </div>
        }
    </div>
    <div class="container carousel-actions js-carousel-actions" data-aos="fade-down" data-aos-duration="1500">
        <div class="row">
            <div class="btn-group">
                @foreach (var item in Model.FeatureMenuItems)
                {
                    <div class="btn-plus">
                        <a href="@item.URL">@item.Title</a>
                    </div>
                }
            </div>

        </div>
    </div>


</div>