<div class="container">
<div class="owl-carousel">
<div class="item">
<div class="user"><img src="https://tolmatol.com/uploads-images/testimonials-carousel/boy.png" alt=""> </div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fuga veritatis officiis labore ullam eaque, error, velit corrupti </p>
<h3>Vishvjeet Patel</h3>
<h4>Location place</h4>
</div>
<div class="item">
<div class="user"><img src="https://tolmatol.com/uploads-images/testimonials-carousel/boy.png" alt=""> </div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fuga veritatis officiis labore ullam eaque, error, velit corrupti </p>
<h3>Manish Semwal</h3>
<h4>Location place</h4>
</div>
<div class="item">
<div class="user"><img src="https://tolmatol.com/uploads-images/testimonials-carousel/girl.png" alt=""> </div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fuga veritatis officiis labore ullam eaque, error, velit corrupti </p>
<h3>Neena</h3>
<h4>Location place</h4>
</div>
<div class="item">
<div class="user"><img src="https://tolmatol.com/uploads-images/testimonials-carousel/boy.png" alt=""> </div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fuga veritatis officiis labore ullam eaque, error, velit corrupti </p>
<h3>User Name</h3>
<h4>Location place</h4>
</div>
<div class="item">
<div class="user"><img src="girl.png" alt=""> </div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fuga veritatis officiis labore ullam eaque, error, velit corrupti </p>
<h3>User Name</h3>
<h4>Location place</h4>
</div>
<div class="item">
<div class="user"><img src="girl.png" alt=""> </div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fuga veritatis officiis labore ullam eaque, error, velit corrupti </p>
<h3>User Name</h3>
<h4>Location place</h4>
</div>
</div>
</div>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.2/animate.min.css">
<link href="https://fonts.googleapis.com/css?family=Poppins:400,700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<style>
body { overflow-x: hidden; }
.full-width { width: 85vw;}
.owl-nav {
display: inline-block;
}
.about-info { margin: 40px 0px;}
.about-info h3 { margin: 0px 0px 40px 0px; font-weight: 700; font-size: 3em;}
.owl-nav button {
background: #f1f1f1 !important;
margin: 0px 5px 0px 0px;
width: 35px;
height: 35px; outline: none;
}
.owl-nav button span {
font-size: 40px;
line-height: 25px;
color: #333;
}
.item {border-radius: 8px;background: #f5f5f5;text-align: center;margin: 40px 0px;position: relative;overflow: hidden;padding: 30px;}
.item img { width: 64px !important; margin: 10px auto 10px auto; }
.item h4 { display: block; margin-bottom: 30px;}
.item:before{
content: '';
position: absolute;
width: 300px;
height: 300px;
background: #868383;
border-radius: 100%;
top: -110px;
right: -89px;
opacity: 0.06;
z-index: 1;
}
.owl-nav button:hover {
background: #85c6f9 !important;
}
.user {
float: left;
width: 80px;
height: 80px;
background: #d2d7da;
border-radius: 80px;
overflow: hidden;
border: solid 4px #fff;
shape-outside: circle();
box-shadow: 0px 0px 5px #7b7b7b;
}
.item h3, .item h4 {
margin: 0;
padding: 0; text-align:left;
}
.item h3 { font-size:18px;}
.item h4 { font-size:16px; color:#333; font-weight:normal;}
</style>