<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<div class="card col-md-6 mt-5 mb-5 my-0 mx-auto">
<div id="carouselExampleControls" class="carousel slide" data-ride="carousel" data-interval="100000">
<div class="w-100 carousel-inner" role="listbox">
<div class="carousel-item active">
<div class="carousel-caption">
<div class="row">
<div class="col-sm-3">
<img src="http://via.placeholder.com/200x200" alt="" class="rounded-circle img-fluid"/>
</div>
<div class="col-sm-9">
<h3>Gives me hope</h3>
<small>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</small>
<small class="smallest mute">- Yayo Dudemous</small>
</div>
</div>
</div>
</div>
<div class="carousel-item">
<div class="carousel-caption">
<div class="row">
<div class="col-sm-3">
<img src="http://via.placeholder.com/200x200" alt="" class="rounded-circle img-fluid">
</div>
<div class="col-sm-9">
<h3>You will love it.</h3>
<small>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</small>
<small class="smallest mute">- Yayo Dudemous</small>
</div>
</div>
</div>
</div>
<div class="carousel-item">
<div class="carousel-caption">
<div class="row">
<div class="col-sm-3">
<img src="http://via.placeholder.com/200x200" alt="" class="rounded-circle img-fluid">
</div>
<div class="col-sm-9">
<h3>Velvet pouch!</h3>
<small>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</small>
<small class="smallest mute">- Yayo Dudemous</small>
</div>
</div>
</div>
</div>
</div>
<div class="float-right navi">
<a class="" href="#carouselExampleControls" role="button" data-slide="prev">
<span class="carousel-control-prev-icon ico" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="" href="#carouselExampleControls" role="button" data-slide="next">
<span class="carousel-control-next-icon ico" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div>
</div>
