<div class="slideshow">
	<div class="slide-title">
			<h1>Diaporama - {{book.title}}</h1>
	</div>
	<div class="carousel-holder row">
		<carousel>
			<slide ng-repeat="slide in slideshow" active="slide.active">
				<div class="container slide-content">
					<div class="col-md-7 media">
						<img ng-if="slide.details.images" ng-src="{{ slide.details.images }}" style="margin: auto;">
						<audio ng-if="slide.details.audio" ng-src="{{ slide.details.audio }}" style="margin: auto; controls loop"></audio>
						<video ng-if="slide.details.video" ng-src="{{ slide.details.video }}" style="margin: auto;" controls></video>
					</div>
					<div class="col-md-5 caption">
						<div class="user-details">
							<h4>{{slide.title}}</h4>
							<p>{{slide.description}}</p>
							<p>{{slide.comment}}</p>
							<p>
								<em>{{slide.tags.join(', ')}}</em>
							</p>
						</div>
						<hr />
						<div class="details">
							<p>
								<strong>Titre&nbsp;:&nbsp;</strong><small>{{slide.details.title}}</small>
							</p>
							<p>
								<strong>Description&nbsp;:&nbsp;</strong><small>{{slide.details.captionImg}}</small>
							</p>
						</div>
					</div>
				</div>
			</slide> 
		</carousel>
		<ul class="list-unstyled list-inline row insight" >
			<li class="col-md-2 item" ng-repeat="slide in slideshow">
				<div class="img-ctn" ng-click="showSlide($index)">
				    <img class="img img-responsive image" ng-src="{{ slide.details.images }}" />
				    <p>{{ slide.details.title }}</p>
				</div>
			</li>
		</ul>
	</div>
</div>