<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<div class="container-fluid p-0">
<div id="Slider" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#Slider" data-slide-to="0" class=""></li>
<li data-target="#Slider" data-slide-to="1" class=""></li>
<li data-target="#Slider" data-slide-to="2" class="active"></li>
</ol>
<div class="carousel-inner">
<div class="carousel-item">
<img class="d-block w-100" alt="First slide [800x400]"
src="http://via.placeholder.com/800x400"
data-holder-rendered="true">
<div class="carousel-caption d-none d-md-block">
<span class="capTitle mb-5">Remarkably Crisp and Clear</span>
<p>Nulla vitae elit libero, a pharetra augue mollis interdum.</p>
<button class="btn px-4 py-1"> Learn more </button>
</div>
</div>
<div class="carousel-item active carousel-item-left">
<img class="d-block w-100" alt="First slide [800x400]" src="http://via.placeholder.com/800x400" data-holder-rendered="true">
<div class="carousel-caption d-none d-md-block">
<span class="capTitle mb-5">Remarkably Crisp and Clear</span>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
<button class="btn px-4 py-1"> Learn more </button>
</div>
</div>
<div class="carousel-item carousel-item-next carousel-item-left">
<img class="d-block w-100" alt="First slide [800x400]" src="http://via.placeholder.com/800x400" data-holder-rendered="true">
<div class="carousel-caption d-none d-md-block">
<span class="capTitle mb-5">Remarkably Crisp and Clear</span>
