<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>