<button ng-show="editMode" class="editWebpartButton btn btn-primary" ng-click="editWebpart()" type="button" style="margin-bottom: 40px;">
	<span class="glyphicon glyphicon-cog"></span><span class="editWebpartButtonText">{{"Settings" | translate}}</span>
</button>
<div style="width:100%;">

	<div ng-show="dataReady && slides.length > 0">
		<div style="position:relative">
			<div id='carousel-outer' set-container-dimensions-carousel-new-design="" class="carousel-margin">
				<div id="carousel-hero" class='carousel-hero-holderSearch wizdom-fullview-left wizdom-fullview-right' ng-style="styleRail()">
					<div class='carousel-hero-railSearch' ng-style="styleRail()">
						<div class='carousel-hero-itemSearch slide-animation-carousel-new-design carousel-cover'
                             direction="{{direction}}"
							 ng-repeat="slide in slides"
							 ng-hide="!isCurrentSlideIndex($index)"
							 ng-click="redirectTo(slide.path)"
							 ng-mouseover="stopAnimation()"
							 ng-mouseleave="startAnimation()"
							 ng-swipe-left="nextSlide(true)"
							 ng-swipe-right="prevSlide(true)"
							 ng-style="styleBackground((slide.image | 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-new-design'>
								<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 class="carousel-controls-newdesign">
							<ul>
								<li class="icon-dot-white-dims" ng-class="{'icon-dot-white':isCurrentSlideIndex($index), 'icon-dot-transparent':!isCurrentSlideIndex($index)}" ng-repeat="slide3 in slides" ng-click="setCurrentSlideIndex($index);">
								</li>
							</ul>
						</div>

					</div>
				</div>
				<div id="button-previous" class="icon-arrow-left icon-arrow-left-dims" ng-click="prevSlide(true)" style="color:white" />
				<div id="button-next" class="icon-arrow-right icon-arrow-right-dims" ng-click="nextSlide(true)" />
			</div>
		</div>
	</div>
	<div wizdom365-spinner="" loading="!dataReady"></div>
</div>