<div ng-show="dataReady && slides.length > 0">
    <div style="position:relative">
        <div id='carousel-outer' set-container-dimensions-carousel="">
            <div id="carousel-hero" class='carousel-hero-holderSearch' ng-style="styleRail()">
                <div class='carousel-hero-railSearch' ng-style="styleRail()">
                    <div class='carousel-hero-itemSearch slide-animation-carousel carousel-cover'
                         direction="{{direction}}"
                         currentIndex="{{currentIndex}}"
                         ng-repeat="slide in slides"
                         ng-hide="!isCurrentSlideIndex($index)"
                         ng-click="redirectTo(slide.path)"
                         ng-style="slide.image 
                         ? styleBackground((slide.image | stripImageSrc), 801) 
                         : styleBackground((slide.pictureThumbnailUrl | stripImageSrc), 801)"
                         style="cursor:pointer;">

                        <div ng-style="style()" ng-if="::(!slide.image)" class="carousel-hero no-image-slide"></div>
                        <div class='carousel-hero-text'>
                            <div class='carousel-hero-text-inner'>
                                <div class='carousel-hero-text-title'>
                                    <a href='{{::slide.path}}' ng-bind="slide.title"></a>
                                </div>
                                <div class='carousel-hero-text-body'>
                                    <a href='{{::slide.path}}' ng-if="::(!slide.summary)">{{::slide.content | htmlToPlainText}} </a>
                                    <a href='{{::slide.path}}' ng-if="::slide.summary">{{::slide.summary | htmlToPlainText}}</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div id='carousel-list' class='carousel-list-holder' style="height:294px; display:block;">
                <ul class='carousel-list-railSearch'>
                    <li class='carousel-list-item' ng-repeat="slide in ::slides" style="height:147px;">
                        <a href='{{::slide.path}}' ng-if="slide.image || slide.pictureThumbnailUrl">
                            <img ng-src="{{slide.image ? (slide.image | stripImageSrc) : (slide.pictureThumbnailUrl | stripImageSrc)}}?width=201" />
                        </a>
                        <div class='carousel-item-text'>
                            <div class='carousel-item-text-inner'>
                                <div class='carousel-item-text-title'>
                                    <a href='{{::slide.path}}' ng-bind="slide.title"></a>
                                </div>
                            </div>
                        </div>
                    </li>
                    <li class='carousel-list-item' ng-repeat="slide in ::slides" style="height:147px;">
                        <a href='{{::slide.path}}' ng-if="slide.image || slide.pictureThumbnailUrl">
                            <img ng-src="{{slide.image ? (slide.image | stripImageSrc) : (slide.pictureThumbnailUrl | stripImageSrc)}}?width=201" />
                        </a>
                        <div class='carousel-item-text'>
                            <div class='carousel-item-text-inner'>

                                <div class='carousel-item-text-title'>

                                    <a href='{{::slide.path}}' ng-bind="slide.title"></a>
                                </div>
                            </div>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>
<div wizdom365-spinner="" loading="!dataReady"></div>