?
ELwebshll2019
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Meta Tags -->
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1, shrink-to-fit=no" name="viewport">
<!-- Author -->
<meta name="author" content="Themes Industry">
<!-- Description -->
<meta name="description" content="MegaOne is a highly creative, modern, visually stunning and Bootstrap responsive multipurpose studio and portfolio HTML5 template with ready home page demos.">
<!-- Page Title -->
<title>Testimonials | MegaOne HTML5 Template</title>
<!-- Favicon -->
<link href="vendor/img/favicon.ico" rel="icon">
<!-- Bundle -->
<link rel="stylesheet" href="vendor/css/bundle.min.css">
<link href="vendor/css/LineIcons.min.css" rel="stylesheet">
<link href="vendor/css/line-awesome.min.css" rel="stylesheet">
<link href="vendor/css/megamenu.css" rel="stylesheet">
<!-- Style Sheet -->
<link href="vendor/css/elements.css" rel="stylesheet">
</head>
<!-- Js Files -->
<script src="vendor/js/bundle.min.js"></script>
<script src="vendor/js/jquery.appear.js"></script>
<body>
<!-- Start Element Heading -->
<section id="elements" class="ui-element bg-light-gray">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="main-title wow fadeIn" data-wow-delay="300ms">
<div class="main-title-opacity-text"> <h1 class="d-flex justify-content-center">Elements </h1> </div>
<h1 class="color-purple heading-tooltip-number position-relative d-inline-block">Elements</h1>
<h2 class="color-black"> Testimonial UI Blocks </h2>
<p class="color-black font-weight-500 text-uppercase">Power up your pages with these elements. Each element comes with a variety of options for your choice.</p>
</div>
</div>
</div>
</div>
</section>
<!-- End Element Heading -->
<!-- Start Header -->
<header class="megamenu mega-elements pt-5">
<nav class="navbar navbar-top-default navbar-expand-lg static-nav transparent-bg fixed-menu">
<div class="container container-width">
<div id="menu" class="collapse navbar-collapse d-none d-lg-block mod-menu">
<ul class="nav navbar-nav mx-auto">
<li class="nav-item"> <a href="elements-info.html" target="_blank" class="nav-link link">Info Blocks</a></li>
<li class="nav-item"> <a href="elements-team.html" target="_blank" class="nav-link link">Team Blocks</a></li>
<li class="nav-item"> <a href="index-elements-portfolio.html" target="_blank" class="nav-link link">Portfolio Blocks</a></li>
<li class="nav-item"> <a href="elements-pricing.html" target="_blank" class="nav-link link">Pricing Blocks</a></li>
<li class="nav-item mega-menu active"> <a href="javascript:void(0)" class="nav-link dropdown-arrow">Others <i class="fas fa-angle-down"></i></a>
<ul class="hide-cursor bg-white text-left">
<li class="p-0">
<ul>
<li> <a class="dropdown-items" target="_blank" href="elements-counter.html">Counter Blocks</a> </li>
<li> <a class="dropdown-items" target="_blank" href="elements-quote.html">Quote Blocks</a> </li>
</ul>
</li>
<li class="p-0">
<ul>
<li> <a class="dropdown-items" target="_blank" href="elements-footer.html">Footer Blocks</a> </li>
<li> <a class="dropdown-items" target="_blank" href="elements-button.html">Button Blocks</a> </li>
</ul>
</li>
<li class="p-0">
<ul>
<li> <a class="dropdown-items active" target="_blank" href="elements-testimonials.html">Testimonial Blocks</a> </li>
<li> <a class="dropdown-items" target="_blank" href="elements-typography.html">Typography Blocks</a> </li>
<li> <a class="dropdown-items" target="_blank" href="elements-blog.html">Blog Blocks</a> </li>
</ul>
</li>
</ul>
</li>
</ul>
</div>
<!-- side menu open button -->
<a class="menu_bars d-inline-block d-lg-none menu-bars-setting" id="sidemenu_toggle">
<div class="menu-lines">
<span></span>
<span></span>
<span></span>
</div>
</a>
</div>
</nav>
<!-- Side Menu -->
<div class="side-menu d-none">
<div class="inner-wrapper nav-icon">
<span class="btn-close link" id="btn_sideNavClose"></span>
<nav class="side-nav w-100">
<div class="position-relative">
<!-- Main Menu -->
<div class="navbar-nav side-main-menu">
<a class="nav-link" href="elements-info.html">Info Blocks</a>
<a class="nav-link" href="elements-team.html">Team Blocks</a>
<a class="nav-link" href="elements-quote.html">Portfolio Blocks</a>
<a class="nav-link" href="elements-quote.html">Pricing Blocks</a>
<a class="nav-link active sidenav-arrow multi-item1" href="javascript:void(0)">Others <i class="fas fa-angle-right"></i></a>
</div>
<!-- Home Section Sub Menu -->
<div class="navbar-nav sub-multi-item1">
<a class="nav-link sidenav-arrow item1" href="javascript:void(0)">Demos 1 <i class="fas fa-arrow-right"></i></a>
<a class="nav-link sidenav-arrow item2" href="javascript:void(0)">Demos 2 <i class="fas fa-arrow-right"></i></a>
<a class="nav-link sidenav-arrow item3" href="javascript:void(0)">Demos 3 <i class="fas fa-arrow-right"></i></a>
<a class="nav-link arrow-back back-main" href="javascript:void(0)"><i class="fas fa-angle-left"></i>Back</a>
</div>
<!-- Home Section Inner Menu -->
<div class="navbar-nav inner-multi-item1 item1">
<a class="nav-link" target="_blank" href="elements-blog.html">Testimonial Blocks</a>
<a class="nav-link" target="_blank" href="elements-counter.html">Typography Blocks</a>
<a class="nav-link" target="_blank" href="elements-button.html">Blog Blocks</a>
<a class="nav-link arrow-back back" href="javascript:void(0)"><i class="fas fa-angle-left"></i>Back</a>
<a class="nav-link arrow-back back-main" href="javascript:void(0)">Back To Main</a>
</div>
<div class="navbar-nav inner-multi-item1 item2">
<a class="nav-link" target="_blank" href="elements-testimonials.html">Footer Blocks</a>
<a class="nav-link" target="_blank" href="elements-footer.html">Button Blocks</a>
<a class="nav-link link arrow-back back" href="javascript:void(0)"><i class="fas fa-angle-left"></i>Back</a>
<a class="nav-link arrow-back back-main" href="javascript:void(0)">Back To Main</a>
</div>
<div class="navbar-nav inner-multi-item1 item3">
<a class="nav-link" target="_blank" href="index-elements-portfolio.html">Counter Blocks</a>
<a class="nav-link" target="_blank" href="elements-typography.html">Quote Blocks</a>
<a class="nav-link arrow-back back" href="javascript:void(0)"><i class="fas fa-angle-left"></i>Back</a>
<a class="nav-link arrow-back back-main" href="javascript:void(0)">Back To Main</a>
</div>
</div>
</nav>
<div class="side-footer text-white w-100">
<ul class="social-icons-simple">
<li class="side-menu-icons animated-wrap pb-0"><a class="animated-element" href="javascript:void(0)"><i class="ti ti-facebook color-white"></i> </a> </li>
<li class="side-menu-icons animated-wrap pb-0"><a class="animated-element" href="javascript:void(0)"><i class="ti ti-instagram color-white"></i> </a> </li>
<li class="side-menu-icons animated-wrap pb-0"><a class="animated-element" href="javascript:void(0)"><i class="ti ti-twitter color-white"></i> </a> </li>
</ul>
<p class="text-white">© 2021 MegaOne. Made With Love by Themesindustry</p>
</div>
</div>
</div>
<a id="close_side_menu" href="javascript:void(0);"></a>
<!-- Side Menu -->
</header>
<!-- End Header -->
<!-- Start ui-block-01 -->
<section id="client" class="testimonial ui-block-01 position-relative parallax">
<div class="bg-overlay"></div>
<div class="container">
<div class="row">
<div class="col-md-12">
<!--Testimonials with background 02-->
<div class="feedback-slides">
<div class="client-thumbnails">
<div>
<div class="item">
<div class="img-fill"><img src="vendor/img/elements-img/testimonial-img/ui-block-01-2-testimonial.jpg" alt="client"></div>
<div class="title">
<h3 class="user-name">John Terry</h3>
<p class="user-designation">New York City</p>
</div>
</div>
<div class="item">
<div class="img-fill"><img src="vendor/img/elements-img/testimonial-img/ui-block-01-1-testimonial.jpg" alt="client"></div>
<div class="title">
<h3 class="user-name">Jessica D Miller</h3>
<p class="user-designation">New York City</p>
</div>
</div>
<div class="item">
<div class="img-fill"><img src="vendor/img/elements-img/testimonial-img/ui-block-01-3-testimonial.jpg" alt="client"></div>
<div class="title">
<h3 class="user-name">David Muller</h3>
<p class="user-designation">New York City</p>
</div>
</div>
<div class="item">
<div class="img-fill"><img src="vendor/img/elements-img/testimonial-img/ui-block-01-4-testimonial.jpg" alt="client"></div>
<div class="title">
<h3 class="user-name">Julia Tracker</h3>
<p class="user-designation">New York City</p>
</div>
</div>
</div>
</div>
<div class="client-feedback">
<div>
<div class="item">
<div class="single-feedback">
<p class="text">“Lorem ipsum dolor sit amet, consectetur adipiscing elit. In gravida eu arcu a pharetra. Cras varius semper pharetra. Pellentesque sed feugiat nisi.”</p>
</div>
</div>
<div class="item">
<div class="single-feedback">
<p class="text">“Lorem ipsum dolor sit amet, consectetur adipiscing elit. In gravida eu arcu a pharetra. Cras varius semper pharetra.”</p>
</div>
</div>
<div class="item">
<div class="single-feedback">
<p class="text">“Lorem ipsum dolor sit amet, consectetur adipiscing elit, incididunt ut labore et dolore magna. Quis ipsum suspendisse ultrices gravida.”</p>
</div>
</div>
<div class="item">
<div class="single-feedback">
<p class="text">“ Lorem ipsum dolor sit amet, consectetur adipiscing elit. In gravida eu arcu a pharetra. Cras varius semper pharetra. Pellentesque sed feugiat nisi. ”</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<link href="vendor/css/slick-theme.css" rel="stylesheet">
<link href="vendor/css/slick.css" rel="stylesheet">
<script src="vendor/js/slick.min.js"></script>
<script src="vendor/js/parallaxie.min.js"></script>
<script>
var $imagesSlider = $(".ui-block-01.testimonial .client-feedback>div"),
$thumbnailsSlider = $(".ui-block-01.testimonial .client-thumbnails>div");
// Images Options
$imagesSlider.slick({
speed: 300,
slidesToShow: 1,
slidesToScroll: 1,
cssEase: 'linear',
fade: true,
dots: true,
arrows:false,
autoplay: false,
draggable: false,
asNavFor: ".client-thumbnails>div",
});
// Thumbnails Options
$thumbnailsSlider.slick({
speed: 300,
slidesToShow: 3,
slidesToScroll: 1,
cssEase: 'linear',
autoplay: true,
arrows:false,
centerMode: true,
draggable: false,
focusOnSelect: true,
asNavFor: ".client-feedback>div",
});
if($(window).width() < 780) {
$('.ui-block-01.testimonial.parallax').addClass("parallax-disable");
} else {
$('.ui-block-01.testimonial.parallax').removeClass("parallax-disable");
// parallax
$(".ui-block-01.testimonial.parallax").parallaxie({
speed: 0.55,
offset: 0,
});
}
</script>
<!-- Cut the script tag including the script and paste it before the body ending tag at the bottom of your html file -->
<!-- End ui-block-01 -->
<hr>
<!-- Start ui-block-02 -->
<section class="our-clients testimonial ui-block-02" id="testimonials">
<div class="container">
<div class="row wow fadeInUp" data-wow-duration="1.5s">
<div class="col-12 text-center">
<div class="heading-area">
<span class="sub-heading mb-2">Lorem ipsum dolor sit amet,</span>
<h4 class="heading main-font">Clients All Over the <span class="d-block"> World Loves Our Work!</span></h4>
</div>
</div>
<div class="testimonial-owl owl-testimonial owl-carousel owl-theme">
<!-- Item-1 -->
<div class="item">
<div class="testimonial-box">
<div class="quote_box">
<i class="fas fa-quote-right quote"></i>
</div>
<p class="info infot_margin text">Proin sagittis elementum odio, sed blandit sapien mattis sed. Mauris ut scelerisque risus. Donec pretium nulla ullamcorper sem maximus, et vulputate sem malesuada.</p>
<div class="testimonial_img">
<img src="vendor/img/elements-img/testimonial-img/ui-block-02-1-testimonial.png" alt="testimonial picture">
</div>
<div class="text1">
<p class="testimonial_name">David Raleway</p>
<p class="info text-red">Businessman</p>
</div>
</div>
</div>
<!-- Item-2 -->
<div class="item">
<div class="testimonial-box">
<div class="quote_box">
<i class="fas fa-quote-right quote"></i>
</div>
<p class="text info infot_margin">Proin sagittis elementum odio, sed blandit sapien mattis sed. Mauris ut scelerisque risus. Donec pretium nulla ullamcorper sem maximus, et vulputate sem malesuada.</p>
<div class="testimonial_img">
<img src="vendor/img/elements-img/testimonial-img/ui-block-02-2-testimonial.png" alt="testimonial picture">
</div>
<div class="text1">
<p class="testimonial_name">Kate Marasisa</p>
<p class="info text-red">Interior Designer</p>
</div>
</div>
</div>
<!-- Item-3 -->
<div class="item">
<div class="testimonial-box">
<div class="quote_box">
<i class="fas fa-quote-right quote"></i>
</div>
<p class="text info infot_margin">Proin sagittis elementum odio, sed blandit sapien mattis sed. Mauris ut scelerisque risus. Donec pretium nulla ullamcorper sem maximus, et vulputate sem malesuada.</p>
<div class="testimonial_img">
<img src="vendor/img/elements-img/testimonial-img/ui-block-02-3-testimonial.png" alt="testimonial picture">
</div>
<div class="text1">
<p class="testimonial_name">Sam Billings</p>
<p class="info text-red">Company Owner</p>
</div>
</div>
</div>
<!-- Item-4 -->
<div class="item">
<div class="testimonial-box">
<div class="quote_box">
<i class="fas fa-quote-right quote"></i>
</div>
<p class="info infot_margin">Proin sagittis elementum odio, sed blandit sapien mattis sed. Mauris ut scelerisque risus. Donec pretium nulla ullamcorper sem maximus, et vulputate sem malesuada.</p>
<div class="testimonial_img">
<img src="vendor/img/elements-img/testimonial-img/ui-block-02-4-testimonial.png" alt="testimonial picture">
</div>
<div class="text1">
<p class="testimonial_name">Daniel Bryan</p>
<p class="info text-red">Designer</p>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<link href="vendor/css/owl.carousel.min.css" rel="stylesheet">
<script src="vendor/js/owl.carousel.min.js"></script>
<script>
var owl5 = $('.ui-block-02.testimonial .owl-testimonial');
owl5.owlCarousel({
items:1,
dots:true,
loop:true,
autoplay: false,
responsiveClass: true,
center:true,
responsive: {
0: {
items: 1,
},
760: {
items: 1,
},
1000: {
items: 3,
}
}
});
</script>
<!-- Cut the script tag including the script and paste it before the body ending tag at the bottom of your html file -->
<!-- End ui-block-02 -->
<hr>
<!-- Start ui-block-03 -->
<section class="section slide6 testimonial-bg ui-block-03 testimonial">
<div class="container">
<div class="row pb-5 heading-row">
<div class="col-12 col-md-7">
<h3 class="main-font text-uppercase"><span class="text-yellow d-block text-uppercase"> Customers </span> <span> love the work i do </span></h3>
<p class="py-2 heading-row alt-font">Please look what my clients say about my exceptional work</p>
</div>
<div class="col-12 col-md-5 text-md-right pt-4 pt-md-0">
<h2 class="m-0 text-yellow main-font">200+</h2>
<p class="alt-font">Clients Worldwide</p>
</div>
</div>
<div class="row pt-3">
<div class="col-12">
<!-- Testimonial Slider -->
<div id="testimonial-carousal" class="testimonial-owl owl-carousel owl-theme">
<!-- Item-1 -->
<div class="item text-center">
<div class="icon-quotes mb-4">
<i class="fas fa-quote-right"></i>
</div>
<div class="description">
<p class="text-grey paragraph">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae egestas mi, vel dapibus diam. Mauris malesuada, nisl non rutrum commodo, sem magna laoreet tellus, eu euismod dolor enim et mi. In at tempor purus. </p>
</div>
<div class="testimonial-img mt-4">
<img src="vendor/img/elements-img/testimonial-img/ui-block-03-1-testimonial.png" alt="">
</div>
<div class="testimonial-tittle mt-3 mb-3">
<h4 class="mb-0 text-yellow main-font font-weight-normal text-uppercase">Sara Jones</h4>
</div>
</div>
<!-- Item-2 -->
<div class="item text-center">
<div class="icon-quotes mb-4">
<i class="fas fa-quote-right"></i>
</div>
<div class="description">
<p class="text-grey paragraph">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae egestas mi, vel dapibus diam. Mauris malesuada, nisl non rutrum commodo, sem magna laoreet tellus, eu euismod dolor enim et mi. In at tempor purus. </p>
</div>
<div class="testimonial-img mt-4">
<img src="vendor/img/elements-img/testimonial-img/ui-block-03-2-testimonial.png" alt="">
</div>
<div class="testimonial-tittle mt-3 mb-3">
<h4 class="mb-0 text-yellow main-font font-weight-normal text-uppercase">Ricky Clark</h4>
</div>
</div>
<!-- Item-3 -->
<div class="item text-center">
<div class="icon-quotes mb-4">
<i class="fas fa-quote-right"></i>
</div>
<div class="description">
<p class="text-grey paragraph">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae egestas mi, vel dapibus diam. Mauris malesuada, nisl non rutrum commodo, sem magna laoreet tellus, eu euismod dolor enim et mi. In at tempor purus. </p>
</div>
<div class="testimonial-img mt-4">
<img src="vendor/img/elements-img/testimonial-img/ui-block-03-3-testimonial.png" alt="">
</div>
<div class="testimonial-tittle mt-3 mb-3">
<h4 class="mb-0 text-yellow main-font font-weight-normal text-uppercase">Johnson Smith</h4>
</div>
</div>
<!-- Item-4 -->
<div class="item text-center">
<div class="icon-quotes mb-4">
<i class="fas fa-quote-right"></i>
</div>
<div class="description">
<p class="text-grey paragraph">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae egestas mi, vel dapibus diam. Mauris malesuada, nisl non rutrum commodo, sem magna laoreet tellus, eu euismod dolor enim et mi. In at tempor purus. </p>
</div>
<div class="testimonial-img mt-4">
<img src="vendor/img/elements-img/testimonial-img/ui-block-03-4-testimonial.png" alt="">
</div>
<div class="testimonial-tittle mt-3 mb-3">
<h4 class="mb-0 text-yellow main-font font-weight-normal text-uppercase">Ellie Joe</h4>
</div>
</div>
<!-- Item-5 -->
<div class="item text-center">
<div class="icon-quotes mb-4">
<i class="fas fa-quote-right"></i>
</div>
<div class="description">
<p class="text-grey paragraph">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae egestas mi, vel dapibus diam. Mauris malesuada, nisl non rutrum commodo, sem magna laoreet tellus, eu euismod dolor enim et mi. In at tempor purus. </p>
</div>
<div class="testimonial-img mt-4">
<img src="vendor/img/elements-img/testimonial-img/ui-block-03-1-testimonial.png" alt="">
</div>
<div class="testimonial-tittle mt-3 mb-3">
<h4 class="mb-0 text-yellow main-font font-weight-normal text-uppercase">Sara Jones</h4>
</div>
</div>
<!-- Item-6 -->
<div class="item text-center">
<div class="icon-quotes mb-4">
<i class="fas fa-quote-right"></i>
</div>
<div class="description">
<p class="text-grey paragraph">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae egestas mi, vel dapibus diam. Mauris malesuada, nisl non rutrum commodo, sem magna laoreet tellus, eu euismod dolor enim et mi. In at tempor purus. </p>
</div>
<div class="testimonial-img mt-4">
<img src="vendor/img/elements-img/testimonial-img/ui-block-03-2-testimonial.png" alt="">
</div>
<div class="testimonial-tittle mt-3 mb-3">
<h4 class="mb-0 text-yellow main-font font-weight-normal text-uppercase">Ricky Clark</h4>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<link href="vendor/css/owl.carousel.min.css" rel="stylesheet">
<script src="vendor/js/owl.carousel.min.js"></script>
<script>
$('.ui-block-03.testimonial #testimonial-carousal').owlCarousel({
loop:true,
margin:120,
nav:false,
dots:true,
autoplay:true,
responsive:{
0:{
items:1
},
600:{
items:1
},
1000:{
items:2
}
}
});
</script>
<!-- Cut the script tag including the script and paste it before the body ending tag at the bottom of your html file -->
<!-- End ui-block-03 -->
<hr>
<!-- Start ui-block-04 -->
<section class="bg-blue testimonial ui-block-04">
<h2 class="d-none">heading</h2>
<div class="container">
<div class="row align-items-center position-relative">
<div class="col-lg-7 col-md-8 col-12 mb-5 m-md-0">
<div class="main-title text-center text-md-left mb-4 wow fadeIn" data-wow-delay="300ms">
<h5 class="text-white"> What people are saying</h5>
<h2 class="text-white ml-0"> our happy <b>customers</b></h2>
</div>
<div class="testimonial-for testimonial-one wow fadeInLeft" data-wow-delay="400ms">
<div class="item testimonial-item">
<div class="testimonial-text">
<div class="quote d-flex justify-content-start mb-4"><i class="fa fa-quote-left"></i></div>
<p class="color-white font-16 font-weight-normal mb-4">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse tincidunt egestas nunc, at pellentesque arcu sollicitudin et. Aliquam hendrerit diam quis ipsum ultricies, quis ultricies arcu suscipit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. </p>
<p class="color-white font-16 font-weight-normal mb-2">Fusce ut diam quis nulla faucibus venenatis. Aliquam mollis arcu et lorem ornare, eu ultrices ante vulputate. </p>
<div class="quote d-flex justify-content-end mb-3"><i class="fa fa-quote-right"></i></div>
<div class="testimonial-post">
<div class="text-content">
<h4 class="color-white text-capitalize mb-1">David P Warrior</h4>
<p class="color-white font-italic mb-2"> October 25, 2019</p>
<div class="rating">
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
</div>
</div>
</div>
</div>
</div>
<div class="item testimonial-item">
<div class="testimonial-text">
<div class="quote d-flex justify-content-start mb-4"><i class="fa fa-quote-left"></i></div>
<p class="color-white font-16 font-weight-normal mb-4">Totam rem aperiam, eaque ipsa quae ab illo inventore veri tatis et quasi archi. Totam rem aperiam, eaque ipsa quae abillo. Totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi archi.</p>
<p class="color-white font-16 font-weight-normal mb-2">Deserunt dolore voluptatem assumenda quae possimus sunt dignissimos tempora officia. Lorem ipsum dolor sit amet consectetur adipisicing dolore.</p>
<div class="quote d-flex justify-content-end mb-3"><i class="fa fa-quote-right"></i></div>
<div class="testimonial-post">
<div class="text-content">
<h4 class="color-white text-capitalize mb-1">Hoxena Williams</h4>
<p class="color-white font-italic mb-2">September 11, 2019</p>
<div class="rating">
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
</div>
</div>
</div>
</div>
</div>
<div class="item testimonial-item">
<div class="testimonial-text">
<div class="quote d-flex justify-content-start mb-4"><i class="fa fa-quote-left"></i></div>
<p class="color-white font-16 font-weight-normal mb-2">Demons trave runt lectores legere lius quod ii legunt saepius clary tyitas Investig ationes demon trave rungt. Investig ationes trave lector ompanies that responsibility in our core business. We work systematically to integrate corporate responsibility in our core business.</p>
<div class="quote d-flex justify-content-end mb-3"><i class="fa fa-quote-right"></i></div>
<div class="testimonial-post">
<div class="text-content">
<h4 class="color-white text-capitalize mb-1">Phil Awazio</h4>
<p class="color-white font-italic mb-2"> February 22, 2019</p>
<div class="rating">
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
</div>
</div>
</div>
</div>
</div>
<div class="item testimonial-item">
<div class="testimonial-text">
<div class="quote d-flex justify-content-start mb-4"><i class="fa fa-quote-left"></i></div>
<p class="color-white font-16 font-weight-normal mb-4">Etiam nec odio vestibulum est mattis effic iturut magna. Pelle ntesque sit am et tellus blandit. Etiam nec odio vestibul. Etiam nec odio vestibulum est mattis effic iturut. </p>
<p class="color-white font-16 font-weight-normal mb-2">Deos et accusamus et iusto odio dignissimos qui blanditiis praesentium voluptatum dele corrupti quos dolores et quas molestias.</p>
<div class="quote d-flex justify-content-end mb-3"><i class="fa fa-quote-right"></i></div>
<div class="testimonial-post">
<div class="text-content">
<h4 class="color-white text-capitalize mb-1">Paul Astin</h4>
<p class="color-white font-italic mb-2"> November 06, 2018</p>
<div class="rating">
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
</div>
</div>
</div>
</div>
</div>
<div class="item testimonial-item">
<div class="testimonial-text">
<div class="quote d-flex justify-content-start mb-4"><i class="fa fa-quote-left"></i></div>
<p class="color-white font-16 font-weight-normal mb-4">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse tincidunt egestas nunc, at pellentesque arcu sollicitudin et. Aliquam hendrerit diam quis ipsum ultricies, quis ultricies arcu suscipit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. </p>
<p class="color-white font-16 font-weight-normal mb-2">Fusce ut diam quis nulla faucibus venenatis. Aliquam mollis arcu et lorem ornare, eu ultrices ante vulputate. </p>
<div class="quote d-flex justify-content-end mb-3"><i class="fa fa-quote-right"></i></div>
<div class="testimonial-post">
<div class="text-content">
<h4 class="color-white text-capitalize mb-1">Trixly Wanders</h4>
<p class="color-white font-italic mb-2"> September 26, 2018</p>
<div class="rating">
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4 offset-lg-1 col-md-4 col-12">
<div class="testimonial-nav testimonial-one mb-0 wow fadeInRight" data-wow-delay="400ms">
<div class="item testimonial-item">
<div class="testimonial-person pt-5 d-flex justify-content-center mx-auto">
<div class="testimonial-post">
<div class="post mb-4 mx-auto"><img src="vendor/img/elements-img/testimonial-img/ui-block-04-1-testimonial.jpg" alt="image"></div>
<div class="text-content text-center">
<h4 class="color-white text-capitalize mb-1">David P Warrior</h4>
<p class="color-white mb-2rem"> Owner, Company</p>
<div class="testimonial-social-icons d-flex justify-content-around">
<a href="javascript:void(0)"><i class="fab fa-facebook-square"></i></a>
<a href="javascript:void(0)"><i class="fab fa-twitter-square"></i></a>
<a href="javascript:void(0)"><i class="fab fa-linkedin"></i></a>
<a href="javascript:void(0)"><i class="fab fa-pinterest-square"></i></a>
<a href="javascript:void(0)"><i class="fab fa-vimeo"></i></a>
</div>
</div>
</div>
</div>
</div>
<div class="item testimonial-item">
<div class="testimonial-person pt-5 d-flex justify-content-center mx-auto">
<div class="testimonial-post">
<div class="post mb-4 mx-auto"><img src="vendor/img/elements-img/testimonial-img/ui-block-04-2-testimonial.jpg" alt="image"></div>
<div class="text-content text-center">
<h4 class="color-white text-capitalize mb-1">Hoxena Williams</h4>
<p class="color-white mb-2rem"> Customer Relations, Tricon</p>
<div class="testimonial-social-icons d-flex justify-content-around">
<a href="javascript:void(0)"><i class="fab fa-facebook-square"></i></a>
<a href="javascript:void(0)"><i class="fab fa-twitter-square"></i></a>
<a href="javascript:void(0)"><i class="fab fa-linkedin"></i></a>
<a href="javascript:void(0)"><i class="fab fa-pinterest-square"></i></a>
<a href="javascript:void(0)"><i class="fab fa-vimeo"></i></a>
</div>
</div>
</div>
</div>
</div>
<div class="item testimonial-item">
<div class="testimonial-person pt-5 d-flex justify-content-center mx-auto">
<div class="testimonial-post">
<div class="post mb-4 mx-auto"><img src="vendor/img/elements-img/testimonial-img/ui-block-04-3-testimonial.jpg" alt="image"></div>
<div class="text-content text-center">
<h4 class="color-white text-capitalize mb-1">Phil Awazio</h4>
<p class="color-white mb-2rem"> HR, P.Force</p>
<div class="testimonial-social-icons d-flex justify-content-around">
<a href="javascript:void(0)"><i class="fab fa-facebook-square"></i></a>
<a href="javascript:void(0)"><i class="fab fa-twitter-square"></i></a>
<a href="javascript:void(0)"><i class="fab fa-linkedin"></i></a>
</div>
</div>
</div>
</div>
</div>
<div class="item testimonial-item">
<div class="testimonial-person pt-5 d-flex justify-content-center mx-auto">
<div class="testimonial-post">
<div class="post mb-4 mx-auto"><img src="vendor/img/elements-img/testimonial-img/ui-block-04-4-testimonial.jpg" alt="image"></div>
<div class="text-content text-center">
<h4 class="color-white text-capitalize mb-1">Paul Astin</h4>
<p class="color-white mb-2rem"> Actor, Entertainment</p>
<div class="testimonial-social-icons d-flex justify-content-around">
<a href="javascript:void(0)"><i class="fab fa-facebook-square"></i></a>
<a href="javascript:void(0)"><i class="fab fa-twitter-square"></i></a>
<a href="javascript:void(0)"><i class="fab fa-linkedin"></i></a>
<a href="javascript:void(0)"><i class="fab fa-pinterest-square"></i></a>
<a href="javascript:void(0)"><i class="fab fa-vimeo"></i></a>
</div>
</div>
</div>
</div>
</div>
<div class="item testimonial-item">
<div class="testimonial-person pt-5 d-flex justify-content-center mx-auto">
<div class="testimonial-post">
<div class="post mb-4 mx-auto"><img src="vendor/img/elements-img/testimonial-img/ui-block-04-5-testimonial.jpg" alt="image"></div>
<div class="text-content text-center">
<h4 class="color-white text-capitalize mb-1">Trixly Wanders</h4>
<p class="color-white mb-2rem"> Athlete, Sports </p>
<div class="testimonial-social-icons d-flex justify-content-around">
<a href="javascript:void(0)"><i class="fab fa-facebook-square"></i></a>
<a href="javascript:void(0)"><i class="fab fa-twitter-square"></i></a>
<a href="javascript:void(0)"><i class="fab fa-linkedin"></i></a>
<a href="javascript:void(0)"><i class="fab fa-pinterest-square"></i></a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<link rel="stylesheet" href="vendor/css/slick.css">
<link rel="stylesheet" href="vendor/css/slick-theme.css">
<!-- Select -->
<link rel="stylesheet" href="vendor/css/select2.min.css">
<script src="vendor/js/select2.min.js"></script>
<script src="vendor/js/jquery.appear.js"></script>
<script src="vendor/js/slick.min.js"></script>
<script>
$('.testimonial-for').slick({
slidesToShow: 1,
slidesToScroll: 1,
arrows: false,
infinite: true,
speed: 500,
fade: true,
cssEase: 'linear',
asNavFor: '.testimonial-nav'
});
$('.testimonial-nav').slick({
slidesToShow: 1,
slidesToScroll: 1,
asNavFor: '.testimonial-for',
dots: true,
arrows: false,
autoplay: true,
autoplaySpeed: 2000
});
</script>
<!-- End ui-block-04 -->
<hr>
<!-- Start ui-block-05 -->
<section class="reviews-sec ui-block-05">
<div class="container">
<div class="row">
<div class="col-12 col-lg-3">
<div class="heading-area">
<h4 class="heading wow slideInLeft">Happy <span> Customers</span></h4>
</div>
</div>
<div class="col-12 col-lg-9">
<div class="image-holder wow slideInRight">
<img src="vendor/img/elements-img/testimonial-img/ui-block-05-main-testimonial.jpg" alt="service-img">
</div>
</div>
</div>
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12">
<div class="reviews-carousel owl-carousel owl-theme">
<!-- Item-1 -->
<div class="item">
<div class="row no-gutters">
<div class="col-lg-3 col-md-12 col-sm-12 name wow fadeInLeft" data-wow-delay="400ms">
<div class="client-img-holder rounded-circle center-block">
<img src="vendor/img/elements-img/testimonial-img/ui-block-05-1-testimonial.jpg" alt="client1">
</div>
<h5>Alex David Williams</h5>
<p>Berlin Town</p>
</div>
<div class="col-lg-9 col-md-12 col-sm-12 wow fadeInLeft" data-wow-delay="400ms">
<div class="icon-holder"><i class="fas fa-quote-left"></i></div>
<p class="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae egestas mi, vel dapibus diam. Mauris malesuada, nisl non rutrum commodo, sem magna laoreet tellus, eu euismod dolor enim et mi. In at tempor purus. </p>
</div>
</div>
</div>
<!-- Item-2 -->
<div class="item">
<div class="row no-gutters">
<div class="col-lg-3 col-md-12 col-sm-12 name">
<div class="client-img-holder rounded-circle center-block">
<img src="vendor/img/elements-img/testimonial-img/ui-block-05-2-testimonial.jpg" alt="client2">
</div>
<h5>Sara David Williams</h5>
<p>Berlin Town</p>
</div>
<div class="col-lg-9 col-md-12 col-sm-12">
<div class="icon-holder"><i class="fas fa-quote-left"></i></div>
<p class="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae egestas mi, vel dapibus diam. Mauris malesuada, nisl non rutrum commodo, sem magna laoreet tellus, eu euismod dolor enim et mi. In at tempor purus. </p>
</div>
</div>
</div>
<!-- Item-3 -->
<div class="item">
<div class="row no-gutters">
<div class="col-lg-3 col-md-12 col-sm-12 name">
<div class="client-img-holder rounded-circle center-block">
<img src="vendor/img/elements-img/testimonial-img/ui-block-05-3-testimonial.jpg" alt="client3">
</div>
<h5>Steve David Williams</h5>
<p>Berlin Town</p>
</div>
<div class="col-lg-9 col-md-12 col-sm-12">
<div class="icon-holder"><i class="fas fa-quote-left"></i></div>
<p class="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae egestas mi, vel dapibus diam. Mauris malesuada, nisl non rutrum commodo, sem magna laoreet tellus, eu euismod dolor enim et mi. In at tempor purus. </p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<link href="vendor/css/owl.carousel.min.css" rel="stylesheet">
<script src="vendor/js/owl.carousel.min.js"></script>
<script>
$('.ui-block-05.reviews-sec .reviews-carousel').owlCarousel({
loop: true,
margin: 30,
autoplay: true,
nav: false,
dots: false,
responsive: {
0: {
items: 1
},
600: {
items: 1
},
1000: {
items: 1
}
}
});
</script>
<!-- Cut the script tag including the script and paste it before the body ending tag at the bottom of your html file -->
<!-- End ui-block-05 -->
<hr>
<!-- Start ui-block-06 -->
<section class="our-testimonial ui-block-06 testimonial">
<div class="parallax page-header testimonial-bg">
<div class="container">
<div class="row">
<div class="col-12 text-center">
<div class="testimonial-content wow fadeInRight" data-wow-delay="300ms">
<span>Quisque tellus risus, adipisci </span>
<h2>Happy Custmers</h2>
</div>
</div>
</div>
</div>
</div>
<div class="container">
<div class="owl-carousel" id="testimonial-slider">
<!--item 1-->
<div class="item testi-box">
<div class="row align-items-center">
<div class="col-lg-4 col-md-12 text-center wow fadeInLeft">
<div class="testimonial-round d-inline-block">
<img src="vendor/img/elements-img/testimonial-img/ui-block-06-2-testimonial.jpg" alt="">
</div>
<h4 class="defaultcolor font-light top15"><a href="#.">John Smith</a></h4>
<p>UPWORK, New York</p>
</div>
<div class="col-lg-6 offset-lg-2 col-md-10 offset-md-1 text-lg-left text-center rating-part wow fadeInRight">
<p class="bottom15 top90">We have a number of different teams within our agency that specialise in different areas of business so you can be sure that you won’t receive a generic service and although we boast a years and years of service.</p>
<span class="d-inline-block test-star">
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
</span>
</div>
</div>
</div>
<!--item 2-->
<div class="item testi-box">
<div class="row align-items-center">
<div class="col-lg-4 col-md-12 text-center wow fadeInLeft">
<div class="testimonial-round d-inline-block">
<img src="vendor/img/elements-img/testimonial-img/ui-block-06-1-testimonial.jpg" alt="">
</div>
<h4 class="defaultcolor font-light top15"><a href="#.">Hayden Wood</a></h4>
<p>FIVERR, Italy</p>
</div>
<div class="col-lg-6 offset-lg-2 col-md-10 offset-md-1 text-lg-left text-center rating-part wow fadeInRight">
<p class="bottom15 top90">Trax’s customer testimonial page is another beauty. Its simple design focuses on videos and standout quotes from customers. This approach is clean, straightforward, text that can be overwhelming and easy to skip.</p>
<span class="d-inline-block test-star">
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="far fa-star"></i>
</span>
</div>
</div>
</div>
<!--item 3-->
<div class="item testi-box">
<div class="row align-items-center">
<div class="col-lg-4 col-md-12 text-center wow fadeInLeft">
<div class="testimonial-round d-inline-block">
<img src="vendor/img/elements-img/testimonial-img/ui-block-06-2-testimonial.jpg" alt="">
</div>
<h4 class="defaultcolor font-light top15"><a href="#.">Kevin Miller</a></h4>
<p>ENVATO, Australia</p>
</div>
<div class="col-lg-6 offset-lg-2 col-md-10 offset-md-1 text-lg-left text-center rating-part wow fadeInRight">
<p class="bottom15 top90">Trax is a company that provides tools to help professional event planning and execution, and their customers are very happy folks! The thing I love about their customer testimonial page provides content formats.</p>
<span class="d-inline-block test-star">
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
</span>
</div>
</div>
</div>
</div>
</div>
</section>
<link href="vendor/css/owl.carousel.min.css" rel="stylesheet">
<script src="vendor/js/owl.carousel.min.js"></script>
<script src="vendor/js/parallaxie.min.js"></script>
<script>
$(".ui-block-06.testimonial #testimonial-slider").owlCarousel({
items: 1,
autoplay: false,
autoplayHoverPause: true,
mouseDrag: false,
loop: true,
margin: 30,
animateIn: "fadeIn",
animateOut: "fadeOut",
dots: false,
nav: true,
navText: ["<i class='fas fa-angle-left'></i>", "<i class='fas fa-angle-right'></i>"],
responsive: {
980: {
items: 1,
},
600: {
items: 1,
},
320: {
items: 1,
},
}
});
if($(window).width() < 780) {
$('.ui-block-06.testimonial .parallax').addClass("parallax-disable");
} else {
$('.ui-block-06.testimonial .parallax').removeClass("parallax-disable");
// parallax
$(".parallax").parallaxie({
speed: 0.55,
offset: -250,
});
}
</script>
<!-- Cut the script tag including the script and paste it before the body ending tag at the bottom of your html file -->
<!-- End ui-block-06 -->
<hr>
<!-- Start ui-block-07 -->
<section class="testimonial-section ui-block-07">
<div class="container">
<div class="row no-gutters">
<div class="col-lg-6 col-md-12 col-sm-12 wow fadeInLeft" data-wow-delay="400ms">
<h2>happy <br>customers</h2>
<p>Lorem ipsum is simply dummy text of the printing and<br> typesetting. Lorem Ipsum has been the industry’s<br>standard dummy.</p>
</div>
<div class="col-lg-6 col-md-12 col-sm-12">
<div class=" text-center testimonial-carousel owl-carousel owl-themes active">
<!-- Item-1 -->
<div class="item">
<div class="testimonials">
<div class="quote">
<i class="fas fa-quote-right"></i>
</div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae egestas mi, vel dapibus diam. Mauris malesuada, nisl non rutrum commodo.
</p>
<div class="testimonial-image">
<img src="vendor/img/elements-img/testimonial-img/ui-block-07-1-testimonial.png" alt="image">
</div>
<h5>Sara Williams</h5>
</div>
</div>
<!-- Item-2 -->
<div class="item active">
<div class="testimonials">
<div class="quote">
<i class="fas fa-quote-right"></i>
</div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae egestas mi, vel dapibus diam. Mauris malesuada, nisl non rutrum commodo.
</p>
<div class="testimonial-image">
<img src="vendor/img/elements-img/testimonial-img/ui-block-07-2-testimonial.png" alt="image">
</div>
<h5>Sara Williams</h5>
</div>
</div>
<!-- Item-3 -->
<div class="item">
<div class="testimonials">
<div class="quote">
<i class="fas fa-quote-right"></i>
</div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae egestas mi, vel dapibus diam. Mauris malesuada, nisl non rutrum commodo.
</p>
<div class="testimonial-image">
<img src="vendor/img/elements-img/testimonial-img/ui-block-07-1-testimonial.png" alt="image">
</div>
<h5>Sara Williams</h5>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<link href="vendor/css/owl.carousel.min.css" rel="stylesheet">
<script src="vendor/js/owl.carousel.min.js"></script>
<script>
$('.ui-block-07.testimonial-section .testimonial-carousel').owlCarousel({
loop: true,
margin: 30,
autoplay: true,
nav: false,
dots: false,
responsive: {
0: {
items: 1
},
600: {
items: 1
},
1000: {
items: 1
}
}
});
</script>
<!-- Cut the script tag including the script and paste it before the body ending tag at the bottom of your html file -->
<!-- End ui-block-07 -->
<hr>
<!-- Start ui-block-08 -->
<section class="testimonial-sec ui-block-08 position-relative">
<div class="container">
<div class="testimonial-area">
<div class="row">
<div class="col-12 col-md-8 offset-md-2 col-lg-6 offset-lg-0 order-2 order-lg-1">
<div class="testimonial-carousel wow fadeInRight">
<div class="testimonial-box owl-carousel owl-theme">
<div class="item text-center">
<div class="icon-holder">
<i class="fas fa-quote-right"></i>
</div>
<p class="text">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae egestas mi, vel dapibus diam. Mauris malesuada, nisl non rutrum commodo, sem magna laoreet tellus, eu euismod dolor enim et mi. In at tempor purus.
</p>
<div class="img-holder">
<img src="vendor/img/elements-img/testimonial-img/ui-block-08-1-testimonial.jpg" alt="image">
</div>
<h4 class="user-name">Sara Williams</h4>
</div>
<div class="item text-center">
<div class="icon-holder">
<i class="fas fa-quote-right"></i>
</div>
<p class="text">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae egestas mi, vel dapibus diam. Mauris malesuada, nisl non rutrum commodo, sem magna laoreet tellus, eu euismod dolor enim et mi. In at tempor purus.
</p>
<div class="img-holder">
<img src="vendor/img/elements-img/testimonial-img/ui-block-08-1-testimonial.jpg" alt="image">
</div>
<h4 class="user-name">Julia Miltese</h4>
</div>
</div>
</div>
</div>
<div class="col-12 col-md-10 offset-md-1 col-lg-5 offset-lg-0 order-1 order-lg-2 offset-lg-1 d-flex justify-content-center align-items-center text-center text-lg-left">
<div class="testimonial-details wow fadeInLeft">
<h4 class="heading">Happy <span>Customers</span></h4>
<p class="text">
Lorem ipsum is simply dummy text of the printing and typesetting. Lorem Ipsum has been the industry’s standard dummy.
</p>
</div>
</div>
</div>
</div>
</div>
</section>
<link href="vendor/css/owl.carousel.min.css" rel="stylesheet">
<script src="vendor/js/owl.carousel.min.js"></script>
<script>
$('.ui-block-08.testimonial-sec .testimonial-box').owlCarousel({
loop: true,
margin: 20,
slideSpeed: 5000,
slideTransition: 'linear',
nav: false,
dots: false,
autoplay: true,
autoplayTimeout: 8000,
autoplayHoverPause: true,
responsive: {
0: {
items: 1
},
600: {
items: 1
},
1000: {
items: 1
},
}
});
</script>
<!-- Cut the script tag including the script and paste it before the body ending tag at the bottom of your html file -->
<!-- End ui-block-08 -->
<hr>
<!-- Start ui-block-09 -->
<section class="testimonial-sec ui-block-09 position-relative" id="testimonial-sec">
<!-- Upper Svg -->
<svg class="separator__svg" id="testimonial-header-svg" width="100%" viewBox="0 0 100 100" preserveAspectRatio="none" fill="#fff" version="1.1" xmlns="http://www.w3.org/2000/svg">
<path d="M 100 100 V 10 L 0 100"/>
<path d="M 30 73 L 100 18 V 10 Z" fill="#fff" stroke-width="0"/>
</svg>
<div class="container">
<div class="testimonial-area">
<div class="row">
<div class="col-12">
<div class="testimonial-title text-center">
<span class="sub-heading">Proud moment for us</span>
<h1 class="heading">Customers love our work <span class="d-block">We are delighted!</span></h1>
</div>
</div>
</div>
<div class="row">
<div class="col-12">
<div class="testimonial-carousel">
<div class="testimonial-box owl-carousel owl-theme">
<!-- Item-1 -->
<div class="item text-center wow fadeInUp">
<div class="icon-holder">
<i class="fas fa-quote-right"></i>
</div>
<p class="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae egestas mi, vel dapibus diam. Mauris malesuada, nisl non rutrum commodo, sem magna laoreet tellus, eu euismod dolor enim et mi. In at tempor purus.</p>
<div class="img-holder"><img src="vendor/img/elements-img/testimonial-img/ui-block-09-1-testimonial.jpg" alt="Reviews"></div>
<h4 class="user-name">Sara Williams</h4>
</div>
<!-- Item-2 -->
<div class="item text-center wow fadeInUp" data-wow-delay=".3s">
<div class="icon-holder">
<i class="fas fa-quote-right"></i>
</div>
<p class="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae egestas mi, vel dapibus diam. Mauris malesuada, nisl non rutrum commodo, sem magna laoreet tellus, eu euismod dolor enim et mi. In at tempor purus.</p>
<div class="img-holder"><img src="vendor/img/elements-img/testimonial-img/ui-block-09-2-testimonial.jpg" alt="Reviews"></div>
<h4 class="user-name">Jack Williams</h4>
</div>
<!-- Item-3 -->
<div class="item text-center wow fadeInUp" data-wow-delay=".3s">
<div class="icon-holder">
<i class="fas fa-quote-right"></i>
</div>
<p class="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae egestas mi, vel dapibus diam. Mauris malesuada, nisl non rutrum commodo, sem magna laoreet tellus, eu euismod dolor enim et mi. In at tempor purus.</p>
<div class="img-holder"><img src="vendor/img/elements-img/testimonial-img/ui-block-09-3-testimonial.jpg" alt="Reviews"></div>
<h4 class="user-name">Jessica Briany</h4>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Lower Svg -->
<svg class="separator__svg" id="testimonial-foot-svg" width="100%" viewBox="0 0 100 100" preserveAspectRatio="none" fill="#fff" version="1.1" xmlns="http://www.w3.org/2000/svg">
<path d="M 100 100 V 10 L 0 100"/>
<path d="M 30 73 L 100 18 V 10 Z" fill="#fff" stroke-width="0"/>
</svg>
</section>
<link href="vendor/css/owl.carousel.min.css" rel="stylesheet">
<script src="vendor/js/owl.carousel.min.js"></script>
<script>
$('.ui-block-09.testimonial-sec .testimonial-box').owlCarousel({
loop: true,
margin: 20,
slideSpeed: 5000,
slideTransition: 'linear',
nav: false,
dots: false,
autoplay: true,
autoplayTimeout: 8000,
autoplayHoverPause: true,
responsive: {
0: {
items: 1
},
600: {
items: 1
},
1000: {
items: 2
},
}
});
</script>
<!-- Cut the script tag including the script and paste it before the body ending tag at the bottom of your html file -->
<!-- End ui-block-09 -->
<hr>
<!-- Start ui-block-10 -->
<section class="testimonial-section ui-block-10">
<div class="container">
<div class="row no-gutters">
<div class="col-lg-4 col-md-12 col-sm-12 wow fadeInLeft" data-wow-delay="400ms" >
<div class="testimonial-text">
<h2 class="heading">happy <br>customers</h2>
<i class="fas fa-quote-right"></i>
</div>
</div>
<div class="col-lg-8 col-md-12 col-sm-12 wow fadeInRight" data-wow-delay="400ms">
<div class="testimonial-img">
<img src="vendor/img/elements-img/testimonial-img/ui-block-10-1-testimonial.jpg" alt="img">
</div>
</div>
</div>
<!-- Row-2 -->
<div class="row no-gutters">
<div class="col-lg-12 col-md-12 col-sm-12">
<div class="testimonial-carousel owl-carousel owl-themes active">
<!-- Item-1 -->
<div class="item">
<div class="row no-gutters">
<div class="col-lg-4 col-md-12 col-sm-12 name wow fadeInLeft" data-wow-delay="400ms">
<h5>Sara Williams</h5>
<p>Newyork City</p>
</div>
<div class="col-lg-8 col-md-12 col-sm-12 wow fadeInLeft" data-wow-delay="400ms">
<p class="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae egestas mi, vel dapibus diam. Mauris malesuada, nisl non rutrum commodo, sem magna laoreet tellus, eu euismod dolor enim et mi. In at tempor purus. </p>
</div>
</div>
</div>
<!-- Item-2 -->
<div class="item">
<div class="row no-gutters">
<div class="col-lg-4 col-md-12 col-sm-12 name">
<h5>Sara Williams</h5>
<p>Newyork City</p>
</div>
<div class="col-lg-8 col-md-12 col-sm-12">
<p class="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae egestas mi, vel dapibus diam. Mauris malesuada, nisl non rutrum commodo, sem magna laoreet tellus, eu euismod dolor enim et mi. In at tempor purus. </p>
</div>
</div>
</div>
<!-- Item-3 -->
<div class="item">
<div class="row no-gutters">
<div class="col-lg-4 col-md-12 col-sm-12 name">
<h5>Sara Williams</h5>
<p>Newyork City</p>
</div>
<div class="col-lg-8 col-md-12 col-sm-12">
<p class="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae egestas mi, vel dapibus diam. Mauris malesuada, nisl non rutrum commodo, sem magna laoreet tellus, eu euismod dolor enim et mi. In at tempor purus. </p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<link href="vendor/css/owl.carousel.min.css" rel="stylesheet">
<script src="vendor/js/owl.carousel.min.js"></script>
<script>
$('.ui-block-10.testimonial-section .testimonial-carousel').owlCarousel({
loop: true,
margin: 30,
autoplay: true,
nav: false,
dots: false,
responsive: {
0: {
items: 1
},
600: {
items: 1
},
1000: {
items: 1
}
}
});
</script>
<!-- Cut the script tag including the script and paste it before the body ending tag at the bottom of your html file -->
<!-- End ui-block-10 -->
<hr>
<!-- Start ui-block-11 -->
<section class="parallax bg-img testimonial-sec ui-block-11">
<div class="container">
<div class="row">
<div class="col-lg-6 offset-lg-6 wow fadeInRight">
<div class="owl-carousel owl-theme testimonial-two">
<div class="testimonial-item">
<p class="testimonial-para"> Curabitur mollis bibendum luctus. Duis suscipit vitae dui sed suscipit. Vestibulum auctor nunc vitae diam eleifend, in maximus metus sollicitudin. Quisque vitae sodales lectus. Nam porttitor justo sed mi finibus, vel tristique risus faucibus. </p>
<div class="testimonial-post">
<a href="javascript:void(0)" class="post"><img src="vendor/img/elements-img/testimonial-img/ui-block-11-1-testimonial.jpg" alt="image"></a>
<div class="text-content">
<h5>Janey Williams</h5>
<p class="mb-0">Sales Executive </p>
<div class="rating">
<i class="lni-star-filled"></i>
<i class="lni-star-filled"></i>
<i class="lni-star-filled"></i>
<i class="lni-star-filled"></i>
<i class="lni-star-filled"></i>
</div>
</div>
</div>
</div>
<div class="testimonial-item">
<p class="testimonial-para"> Curabitur mollis bibendum luctus. Duis suscipit vitae dui sed suscipit. Vestibulum auctor nunc vitae diam eleifend, in maximus metus sollicitudin. Quisque vitae sodales lectus. Nam porttitor justo sed mi finibus, vel tristique risus faucibus. </p>
<div class="testimonial-post">
<a href="javascript:void(0)" class="post"><img src="vendor/img/elements-img/testimonial-img/ui-block-11-2-testimonial.jpg" alt="image"></a>
<div class="text-content">
<h5>Glen Jarret</h5>
<p class="m-0">HR Manager </p>
<div class="rating">
<i class="lni-star-filled"></i>
<i class="lni-star-filled"></i>
<i class="lni-star-filled"></i>
<i class="lni-star-filled"></i>
<i class="lni-star-filled"></i>
</div>
</div>
</div>
</div>
<div class="testimonial-item">
<p class="color-black testimonial-para mb-15px"> Curabitur mollis bibendum luctus. Duis suscipit vitae dui sed suscipit. Vestibulum auctor nunc vitae diam eleifend, in maximus metus sollicitudin. Quisque vitae sodales lectus. Nam porttitor justo sed mi finibus, vel tristique risus faucibus. </p>
<div class="testimonial-post">
<a href="javascript:void(0)" class="post"><img src="vendor/img/elements-img/testimonial-img/ui-block-11-3-testimonial.jpg" alt="image"></a>
<div class="text-content">
<h5>Kate Lawrence</h5>
<p class="m-0"> Photographer </p>
<div class="rating">
<i class="lni-star-filled"></i>
<i class="lni-star-filled"></i>
<i class="lni-star-filled"></i>
<i class="lni-star-filled"></i>
<i class="lni-star-filled"></i>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<link href="vendor/css/owl.carousel.min.css" rel="stylesheet">
<script src="vendor/js/owl.carousel.min.js"></script>
<script src="vendor/js/parallaxie.min.js"></script>
<script>
$('.ui-block-11.testimonial-sec .testimonial-two').owlCarousel({
loop: true,
smartSpeed: 500,
responsiveClass: true,
nav:false,
dots:false,
autoplay: true,
autoplayHoverPause: true,
autoplayTimeout: 3000,
responsive: {
0: {
items: 1,
margin: 30,
},
480: {
items: 1,
margin: 30,
},
992: {
items: 1,
margin: 30,
}
}
});
if ($(window).width() > 992) {
$(".parallax").parallaxie({
speed: 0.55,
offset: 0,
});
}
</script>
<!-- Cut the script tag including the script and paste it before the body ending tag at the bottom of your html file -->
<!-- End ui-block-11 -->
<hr>
<!-- Start ui-block-12 -->
<section class="testimonial-sec ui-block-12">
<div class="container">
<div class="row">
<div class="col-12 text-center testimonial-heading">
<span class="sub-heading">Join the event</span>
<h4 class="large-heading">Our Friends Reviews</h4>
<span class="fly-line"></span>
</div>
</div>
<div class="testimonial-card owl-carousel owl-theme">
<div class="item text-center">
<div class="testimonial-review">
<div class="image-holder">
<img src="vendor/img/elements-img/testimonial-img/ui-block-12-1-testimonial.jpg" alt="testimonial-img">
</div>
<div class="client-info media-body">
<h5 class="client-name mt-0">- MARK ALAN -</h5>
<p class="client-designation">Groomsmen</p>
</div>
<div class="review-detail">
<p class="text-des">Lorem ipsum is simply dummy text of the printing and type setting. Lorem Ipsum has been the industry’s is dummy. Lorem ipsum is simply dummy text of the printing and typesetting. Lorem Ipsum has been the industry’s standard dummy.</p>
<ul class="test-review">
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
</ul>
</div>
</div>
</div>
<div class="item text-center">
<div class="testimonial-review">
<div class="image-holder">
<img src="vendor/img/elements-img/testimonial-img/ui-block-12-2-testimonial.jpg" alt="testimonial-img">
</div>
<div class="client-info media-body">
<h5 class="client-name mt-0">- KAM ROSE-</h5>
<p class="client-designation">Bridesmaid</p>
</div>
<div class="review-detail">
<p class="text-des">Lorem ipsum is simply dummy text of the printing and type setting. Lorem Ipsum has been the industry’s is dummy. Lorem ipsum is simply dummy text of the printing and typesetting. Lorem Ipsum has been the industry’s standard dummy.</p>
<ul class="test-review">
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
</ul>
</div>
</div>
</div>
<div class="item text-center">
<div class="testimonial-review">
<div class="image-holder">
<img src="vendor/img/elements-img/testimonial-img/ui-block-12-3-testimonial.jpg" alt="testimonial-img">
</div>
<div class="client-info media-body">
<h5 class="client-name mt-0">- JOE MARTIN -</h5>
<p class="client-designation">Groomsmen</p>
</div>
<div class="review-detail">
<p class="text-des">Lorem ipsum is simply dummy text of the printing and type setting. Lorem Ipsum has been the industry’s is dummy. Lorem ipsum is simply dummy text of the printing and typesetting. Lorem Ipsum has been the industry’s standard dummy.</p>
<ul class="test-review">
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
</ul>
</div>
</div>
</div>
<div class="item text-center">
<div class="testimonial-review">
<div class="image-holder">
<img src="vendor/img/elements-img/testimonial-img/ui-block-12-4-testimonial.jpg" alt="testimonial-img">
</div>
<div class="client-info media-body">
<h5 class="client-name mt-0">- SARA WILLIAM -</h5>
<p class="client-designation">Bridesmaid</p>
</div>
<div class="review-detail">
<p class="text-des">Lorem ipsum is simply dummy text of the printing and type setting. Lorem Ipsum has been the industry’s is dummy. Lorem ipsum is simply dummy text of the printing and typesetting. Lorem Ipsum has been the industry’s standard dummy.</p>
<ul class="test-review">
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</section>
<link href="vendor/css/owl.carousel.min.css" rel="stylesheet">
<script src="vendor/js/owl.carousel.min.js"></script>
<script>
$('.ui-block-12.testimonial-sec .testimonial-card').owlCarousel({
loop: true,
margin: 20,
slideSpeed: 5000,
slideTransition: 'linear',
nav: false,
dots: false,
autoplay: true,
autoplayTimeout: 40000,
autoplayHoverPause: true,
responsive: {
0: {
items: 1,
dots: false
},
600: {
items: 1
},
1000: {
items: 1
},
}
});
</script>
<!-- Cut the script tag including the script and paste it before the body ending tag at the bottom of your html file -->
<!-- End ui-block-12 -->
<hr>
<!-- Start ui-block-13 -->
<section class="parallax-img parallax testimonial-sec ui-block-13">
<div class="container">
<div class="row">
<div class="col-12 col-lg-6 offset-lg-3 my-3">
<!-- Testimonial Slider -->
<div id="testimonial-carousal-2" class="owl-carousel owl-theme testimonial-owl text-center wow fadeIn" data-wow-delay="300ms">
<!-- Item-1 -->
<div class="item">
<div class="icon-quotes mb-4">
<i class="fas fa-quote-right"></i>
</div>
<div class="description">
<p class="text-white paragraph">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae egestas mi, vel dapibus diam. Mauris malesuada, nisl non rutrum commodo, sem magna laoreet tellus, eu euismod dolor enim et mi. In at tempor purus. </p>
</div>
<div class="testimonial-img mt-4">
<img src="vendor/img/elements-img/testimonial-img/ui-block-13-1-testimonial.jpg" alt="student img">
</div>
<div class="testimonial-tittle mt-3 mb-3">
<h3 class="mb-0 text-white alt-font font-weight-normal font-24">Sara Jones</h3>
</div>
</div>
<!-- Item-2-->
<div class="item">
<div class="icon-quotes mb-4">
<i class="fas fa-quote-right"></i>
</div>
<div class="description">
<p class="text-white paragraph">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae egestas mi, vel dapibus diam. Mauris malesuada, nisl non rutrum commodo, sem magna laoreet tellus, eu euismod dolor enim et mi. In at tempor purus. </p>
</div>
<div class="testimonial-img mt-4">
<img src="vendor/img/elements-img/testimonial-img/ui-block-13-2-testimonial.jpg" alt="student img">
</div>
<div class="testimonial-tittle mt-3 mb-3">
<h3 class="mb-0 text-white alt-font font-weight-normal font-24">Trixly Wanders</h3>
</div>
</div>
<!-- Item-3 -->
<div class="item">
<div class="icon-quotes mb-4">
<i class="fas fa-quote-right"></i>
</div>
<div class="description">
<p class="text-white paragraph">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae egestas mi, vel dapibus diam. Mauris malesuada, nisl non rutrum commodo, sem magna laoreet tellus, eu euismod dolor enim et mi. In at tempor purus. </p>
</div>
<div class="testimonial-img mt-4">
<img src="vendor/img/elements-img/testimonial-img/ui-block-13-3-testimonial.jpg" alt="student img">
</div>
<div class="testimonial-tittle mt-3 mb-3">
<h3 class="mb-0 text-white alt-font font-weight-normal font-24">Steve Austin</h3>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<link href="vendor/css/owl.carousel.min.css" rel="stylesheet">
<script src="vendor/js/owl.carousel.min.js"></script>
<script src="vendor/js/parallaxie.min.js"></script>
<script>
$('.ui-block-13.testimonial-sec #testimonial-carousal-2').owlCarousel({
loop:true,
margin:10,
nav:false,
dots:false,
autoplay:true,
responsive:{
0:{
items:1
},
600:{
items:1
},
1000:{
items:1
}
}
});
if ($(window).width() > 992) {
$(".ui-block-13.testimonial-sec.parallax").parallaxie({
speed: 0.55,
offset: 0,
});
}
</script>
<!-- Cut the script tag including the script and paste it before the body ending tag at the bottom of your html file -->
<!-- End ui-block-13 -->
<hr>
<!-- Start ui-block-14 -->
<section class="client-sec ui-block-14">
<div class="container">
<div class="row d-flex align-content-lg-center min-height-100vh">
<!-- Features Box-->
<div class="col-lg-4 pr-lg-5 p-0">
<div class="heading-area">
<h6 class="sub-title main-color">What Client Says About us</h6>
<h2 class="title">Our Clients & Reviews</h2>
<p class="paragraph">There are many variations of passages of Lorem Ipsum available, but the majority.</p>
</div>
<div id="client-nav"></div>
</div>
<!-- Client Area-->
<div class="col-lg-8">
<div id="owl-client" class="owl-carousel owl-theme">
<!--Items-->
<div class="client-box">
<i class="lni-quotation q-icon"></i>
<p>There are many variations of passages of Lorem Ipsum availa ble, but the majority There are many variations of passages of Lorem Ipsum availa ble.</p>
<div class="client-img">
<img src="vendor/img/elements-img/testimonial-img/ui-block-14-1-testimonial.png" alt="client">
</div>
<h5 class="client-name mb-0">Harley Klien</h5>
<span class="client-designation">CEO, Abacus Inc</span>
</div>
<!--Items-->
<div class="client-box">
<i class="lni-quotation q-icon"></i>
<p>There are many variations of passages of Lorem Ipsum availa ble, but the majority There are many variations of passages of Lorem Ipsum availa ble.</p>
<div class="client-img">
<img src="vendor/img/elements-img/testimonial-img/ui-block-14-2-testimonial.png" alt="client">
</div>
<h5 class="client-name mb-0">David Jhon</h5>
<span class="client-designation">Marketing Lead</span>
</div>
<!--Items-->
<div class="client-box">
<i class="lni-quotation q-icon"></i>
<p>There are many variations of passages of Lorem Ipsum availa ble, but the majority There are many variations of passages of Lorem Ipsum availa ble.</p>
<div class="client-img">
<img src="vendor/img/elements-img/testimonial-img/ui-block-14-3-testimonial.png" alt="client">
</div>
<h5 class="client-name mb-0">Jhon Walkin</h5>
<span class="client-designation">General Manager</span>
</div>
</div>
</div>
<!--Partner Slider-->
<div class="owl-carousel partners-slider">
<div class="logo-item"> <img alt="client-logo" src="vendor/img/elements-img/testimonial-img/ui-block-14-1-partner-testimonial.png"></div>
<div class="logo-item"> <img alt="client-logo" src="vendor/img/elements-img/testimonial-img/ui-block-14-2-partner-testimonial.png"></div>
<div class="logo-item"> <img alt="client-logo" src="vendor/img/elements-img/testimonial-img/ui-block-14-3-partner-testimonial.png"></div>
<div class="logo-item"> <img alt="client-logo" src="vendor/img/elements-img/testimonial-img/ui-block-14-4-partner-testimonial.png"></div>
</div>
</div>
</div>
</section>
<link href="vendor/css/owl.carousel.min.css" rel="stylesheet">
<script src="vendor/js/owl.carousel.min.js"></script>
<script>
$(".ui-block-14.client-sec #owl-client").owlCarousel({
items: 1,
margin:10,
loop: true,
dots: false,
nav: true,
navContainer: "#client-nav",
responsive: {
991: {
items: 2,
},
600: {
items: 1,
},
320: {
items: 1,
},
}
});
$('.ui-block-14.client-sec .partners-slider').owlCarousel({
items: 5,
autoplay: 1500,
smartSpeed: 1500,
autoplayHoverPause: true,
slideBy: 1,
loop: true,
margin: 30,
dots: false,
nav: false,
responsive: {
1200: {
items: 5,
},
768: {
items: 3,
},
480: {
items: 2,
},
320: {
items: 1,
},
}
});
</script>
<!-- Cut the script tag including the script and paste it before the body ending tag at the bottom of your html file -->
<!-- End ui-block-14 -->
<hr>
<!-- Start ui-block-15 -->
<section class="bg-testimonial parallax testimonial-sec ui-block-15">
<div class="container">
<div class="row">
<div class="test">
<div class="testimonial-title"><h2 class="text-white">Happy Customer</h2></div>
<div class="testimonial-subtitle"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus in velit dolor.
Vivamus gravida, neque nec interdum cursus, erat ligula.</p></div>
</div>
</div>
<div class="row">
<div id="testimonial_slider" class="owl-carousel">
<!--testimonial item-->
<div class="testimonial-item item">
<i class="fa fa-quote-left testimonial-icon gradient-text1"></i>
<p class="mb-4">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus in velit dolor.
Vivamus gravida, neque nec interdum cursus, erat ligula porta nibh.
</p>
<!--Image-->
<div class="testimonial-image">
<img src="vendor/img/elements-img/testimonial-img/ui-block-15-1-testimonial.png" alt="image">
</div>
<h5 class="font-weight-500 main-font pink">David Gover</h5>
<span class="destination main-font">Newyork, USA</span>
</div>
<!--testimonial item-->
<div class="testimonial-item item">
<i class="fa fa-quote-left testimonial-icon gradient-text1"></i>
<p class="mb-4">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus in velit dolor.
Vivamus gravida, neque nec interdum cursus, erat ligula porta nibh.
</p>
<!--Image-->
<div class="testimonial-image">
<img src="vendor/img/elements-img/testimonial-img/ui-block-15-2-testimonial.png" alt="image">
</div>
<h5 class="font-weight-500 main-font pink">Jessica Briany</h5>
<span class="destination main-font">Florida, USA</span>
</div>
<!--testimonial item-->
<div class="testimonial-item item">
<i class="fa fa-quote-left testimonial-icon gradient-text1"></i>
<p class="mb-4">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus in velit dolor.
Vivamus gravida, neque nec interdum cursus, erat ligula porta nibh.
</p>
<!--Image-->
<div class="testimonial-image">
<img src="vendor/img/elements-img/testimonial-img/ui-block-15-3-testimonial.png" alt="image">
</div>
<h5 class="font-weight-500 main-font pink">Albert Joseph</h5>
<span class="destination main-font">London, USA</span>
</div>
<!--testimonial item-->
<div class="testimonial-item item">
<i class="fa fa-quote-right testimonial-icon gradient-text1"></i>
<p class="mb-4">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus in velit dolor.
Vivamus gravida, neque nec interdum cursus, erat ligula porta nibh.
</p>
<!--Image-->
<div class="testimonial-image">
<img src="vendor/img/elements-img/testimonial-img/ui-block-15-1-testimonial.png" alt="image">
</div>
<h5 class="font-weight-500 main-font pink">David Gover</h5>
<span class="destination main-font">Newyork, USA</span>
</div>
<!--testimonial item-->
<div class="testimonial-item item">
<i class="fa fa-quote-right testimonial-icon gradient-text1"></i>
<p class="mb-4">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus in velit dolor.
Vivamus gravida, neque nec interdum cursus, erat ligula porta nibh.
</p>
<!--Image-->
<div class="testimonial-image">
<img src="vendor/img/elements-img/testimonial-img/ui-block-15-2-testimonial.png" alt="image">
</div>
<h5 class="font-weight-500 main-font pink">David Gover</h5>
<span class="destination main-font">Newyork, USA</span>
</div>
<!--testimonial item-->
<div class="testimonial-item item">
<i class="fa fa-quote-right testimonial-icon gradient-text1"></i>
<p class="mb-4">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus in velit dolor.
Vivamus gravida, neque nec interdum cursus, erat ligula porta nibh.
</p>
<!--Image-->
<div class="testimonial-image">
<img src="vendor/img/elements-img/testimonial-img/ui-block-15-3-testimonial.png" alt="image">
</div>
<h5 class="font-weight-500 main-font pink">David Gover</h5>
<span class="destination main-font">Newyork, USA</span>
</div>
</div>
</div>
</div>
</section>
<link href="vendor/css/owl.carousel.min.css" rel="stylesheet">
<script src="vendor/js/owl.carousel.min.js"></script>
<script src="vendor/js/parallaxie.min.js"></script>
<script>
$(".ui-block-15.testimonial-sec #testimonial_slider").owlCarousel({
items: 1,
dots: true,
nav: false,
responsive:{
992:{
items:3
},
768:{
items:2
},
600:{
items:1
}
}
});
if ($(window).width() > 992) {
$(".ui-block-15.testimonial-sec.parallax").parallaxie({
speed: 0.55,
offset: 0,
});
}
</script>
<!-- Cut the script tag including the script and paste it before the body ending tag at the bottom of your html file -->
<!-- End ui-block-15 -->
<hr>
<!-- Start ui-block-16 -->
<section class="testimonial-sec ui-block-16">
<div class="container">
<!--Heading-->
<div class="row">
<div class="col-12 col-md-10 col-lg-8 offset-md-1 offset-lg-2 text-center wow fadeIn" style="visibility: visible; animation-name: fadeIn;">
<div class="heading-area d-inline-block">
<h6 class="sub-title main-color">Our valuable customer </h6>
<h2 class="title">testimonial</h2>
<p class="paragraph">There are many variations of passages of Lorem Ipsum available be the majority have suffered alteration in some form, by injected humour or randomised words.
</div>
</div>
</div>
<!--Heading-->
<div class="row">
<div class="col-md-12">
<div id="ui-block-16-testimonial-slider" class="owl-carousel owl-theme wow fadeIn">
<div class="testimonial">
<div class="pic">
<img src="vendor/img/elements-img/testimonial-img/ui-block-16-1-testimonial.jpg" alt="image">
</div>
<p class="description">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Architecto commodi dolorum earum fugiat, fugit hic id, ipsum laborum minus nostrum numquam perspiciatis saepe velit.
</p>
<div class="testimonial-profile">
<h3 class="title">Kristina-</h3>
<span class="post">Customer</span>
</div>
</div>
<div class="testimonial">
<div class="pic">
<img src="vendor/img/elements-img/testimonial-img/ui-block-16-2-testimonial.jpg" alt="image">
</div>
<p class="description">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Architecto commodi dolorum earum fugiat, fugit hic id, ipsum laborum minus nostrum numquam perspiciatis saepe velit.
</p>
<div class="testimonial-profile">
<h3 class="title">williamson-</h3>
<span class="post">Customer</span>
</div>
</div>
<div class="testimonial">
<div class="pic">
<img src="vendor/img/elements-img/testimonial-img/ui-block-16-3-testimonial.jpg" alt="image">
</div>
<p class="description">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Architecto commodi dolorum earum fugiat, fugit hic id, ipsum laborum minus nostrum numquam perspiciatis saepe velit.
</p>
<div class="testimonial-profile">
<h3 class="title">Steve Thomas-</h3>
<span class="post">Customer</span>
</div>
</div>
<div class="testimonial">
<div class="pic">
<img src="vendor/img/elements-img/testimonial-img/ui-block-16-4-testimonial.jpg" alt="image">
</div>
<p class="description">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Architecto commodi dolorum earum fugiat, fugit hic id, ipsum laborum minus nostrum numquam perspiciatis saepe velit.
</p>
<div class="testimonial-profile">
<h3 class="title">Alan Mark-</h3>
<span class="post">Customer</span>
</div>
</div>
<div class="testimonial">
<div class="pic">
<img src="vendor/img/elements-img/testimonial-img/ui-block-16-1-testimonial.jpg" alt="image">
</div>
<p class="description">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Architecto commodi dolorum earum fugiat, fugit hic id, ipsum laborum minus nostrum numquam perspiciatis saepe velit.
</p>
<div class="testimonial-profile">
<h3 class="title">Steve Thomas-</h3>
<span class="post">Trainer</span>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<link href="vendor/css/owl.carousel.min.css" rel="stylesheet">
<script src="vendor/js/owl.carousel.min.js"></script>
<script>
$(".ui-block-16.testimonial-sec #ui-block-16-testimonial-slider").owlCarousel({
items: 2,
autoplay: 1500,
smartSpeed: 1500,
autoplayHoverPause: true,
slideBy: 1,
loop: true,
margin: 0,
dots: true,
nav: false,
responsive: {
1200: {
items: 2,
},
768: {
items: 2,
},
480: {
items: 1,
autoplay:false,
},
320: {
items: 1,
autoplay:false,
},
}
});
</script>
<!-- Cut the script tag including the script and paste it before the body ending tag at the bottom of your html file -->
<!-- End ui-block-16 -->
<hr>
<!-- Start ui-block-17 -->
<section class="testimonial-sec parallax ui-block-17" style="background-image: url('vendor/img/elements-img/testimonial-img/ui-block-17-bg-testimonial.jpg')">
<div class="overlay-dark"></div>
<div class="container">
<div class="row">
<div class="col-12 text-center">
<div class="heading-details">
<h4 class="heading"><i class="las la-braille"></i>Client <strong>Reviews</strong><i class="las la-braille"></i></h4>
</div>
</div>
</div>
<div class="ui-block-17-testimonial-carousel owl-carousel owl-theme">
<div class="item text-center">
<div class="testimonial-review">
<div class="review-detail">
<p class="text-des">Lorem ipsum is simply dummy text of the printing and type setting. Lorem Ipsum has been the industry’s is dummy. Lorem ipsum is simply dummy text of the printing and typesetting. Lorem Ipsum has been the industry’s standard dummy.</p>
<ul class="test-review">
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
</ul>
</div>
<div class="client-info media-body">
<h5 class="client-name mt-0">- JOE MARTIN -</h5>
<p class="client-designation">Dr - Health B.</p>
</div>
</div>
</div>
<div class="item text-center">
<div class="testimonial-review">
<div class="review-detail">
<p class="text-des">Lorem ipsum is simply dummy text of the printing and type setting. Lorem Ipsum has been the industry’s is dummy. Lorem ipsum is simply dummy text of the printing and typesetting. Lorem Ipsum has been the industry’s standard dummy.</p>
<ul class="test-review">
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
</ul>
</div>
<div class="client-info media-body">
<h5 class="client-name mt-0">- JOE MARTIN -</h5>
<p class="client-designation">Dr - Health B.</p>
</div>
</div>
</div>
</div>
<a id="customPrevBtn" class="test-btn"><i class="fas fa-angle-left"></i> </a>
<a id="customNextBtn" class="test-btn"><i class="fas fa-angle-right"></i></a>
</div>
</section>
<link href="vendor/css/owl.carousel.min.css" rel="stylesheet">
<script src="vendor/js/owl.carousel.min.js"></script>
<script src="vendor/js/parallaxie.min.js"></script>
<script>
$('.ui-block-17.testimonial-sec .ui-block-17-testimonial-carousel').owlCarousel({
loop: true,
smartSpeed: 800,
responsiveClass: true,
nav:true,
dots:false,
autoplay: true,
margin:0,
autoplayHoverPause: true,
responsive: {
0: {
items: 1,
},
480: {
items: 1,
},
992: {
items: 1,
}
}
});
$('.ui-block-17.testimonial-sec #customNextBtn').click(function() {
var owl = $('.ui-block-17.testimonial-sec .ui-block-17-testimonial-carousel');
owl.owlCarousel();
owl.trigger('next.owl.carousel');
});
$('.ui-block-17.testimonial-sec #customPrevBtn').click(function() {
var owl = $('.ui-block-17.testimonial-sec .ui-block-17-testimonial-carousel');
owl.owlCarousel();
owl.trigger('prev.owl.carousel', [300]);
});
if($(window).width() < 780) {
$('.ui-block-17.testimonial-sec.parallax').addClass("parallax-disable");
} else {
$('.ui-block-17.testimonial-sec.parallax').removeClass("parallax-disable");
// parallax
$(".ui-block-17.testimonial-sec.parallax").parallaxie({
speed: 0.55,
offset: -100,
});
}
</script>
<!-- Cut the script tag including the script and paste it before the body ending tag at the bottom of your html file -->
<!-- End ui-block-17 -->
<hr>
<!-- Start ui-block-18 -->
<section class="reviews ui-block-18">
<div class="container">
<div class="row align-items-center">
<!-- Image -->
<div class="col-12 col-md-6 wow fadeInLeft order-2 order-md-1 pt-5 pt-md-0" data-wow-duration="1s" data-wow-delay=".5s">
<div class="reviews-img">
<img src="vendor/img/elements-img/testimonial-img/ui-block-18-bg-testimonial.png" alt="Testimonial">
</div>
</div>
<!-- Content -->
<div class="col-12 col-md-6 wow fadeInRight order-1 order-md-2" data-wow-duration="1s" data-wow-delay=".5s">
<div class="heading-area text-center">
<div class="mb-4"><img src="vendor/img/elements-img/testimonial-img/ui-block-18-border-testimonial.png" alt="About-line"></div>
<h2 class="title main-font text-main my-4">Coffee Lovers</h2>
</div>
<div class="testimonial-carousel">
<div class="testimonial-box owl-carousel owl-theme">
<!-- Item-1 -->
<div class="item text-center animate-fade">
<div class="icon-holder"><i class="fas fa-quote-right"></i></div>
<p class="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae egestas mi, vel dapibus diam. Mauris malesuada, nisl non rutrum commodo.</p>
<div class="img-holder"><img src="vendor/img/elements-img/testimonial-img/ui-block-18-1-testimonial.jpg" alt="Image"></div>
<h4 class="user-name">Sara Williams</h4>
</div>
<!-- Item-2 -->
<div class="item text-center animate-fade">
<div class="icon-holder"><i class="fas fa-quote-right"></i></div>
<p class="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae egestas mi, vel dapibus diam. Mauris malesuada, nisl non rutrum commodo.</p>
<div class="img-holder"><img src="vendor/img/elements-img/testimonial-img/ui-block-18-2-testimonial.jpg" alt="Image"></div>
<h4 class="user-name">Steve Smith</h4>
</div>
<!-- Item-3 -->
<div class="item text-center animate-fade">
<div class="icon-holder"><i class="fas fa-quote-right"></i></div>
<p class="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae egestas mi, vel dapibus diam. Mauris malesuada, nisl non rutrum commodo.</p>
<div class="img-holder"><img src="vendor/img/elements-img/testimonial-img/ui-block-18-3-testimonial.jpg" alt="Image"></div>
<h4 class="user-name">Mandy Rose</h4>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<link href="vendor/css/owl.carousel.min.css" rel="stylesheet">
<script src="vendor/js/owl.carousel.min.js"></script>
<script>
$('.ui-block-18.reviews .testimonial-box').owlCarousel({
loop: true,
margin: 20,
slideSpeed: 2000,
slideTransition: 'linear',
nav: false,
dots: false,
autoplay: true,
autoplayTimeout: 5000,
autoplayHoverPause: true,
responsive: {
0: {
items: 1
},
600: {
items: 1
},
1000: {
items: 1
},
}
});
</script>
<!-- Cut the script tag including the script and paste it before the body ending tag at the bottom of your html file -->
<!-- End ui-block-18 -->
<hr>
<!-- Start ui-block-19 -->
<section class="reviews ui-block-19">
<div class="container expand-container">
<div class="row main-heading">
<div class="col-12 main-heading text-center">
<h2 class="main-font">Best in Business<span class="d-block text-blue">Happy Customers</span></h2>
</div>
</div>
<!-- Testimonial Slider -->
<div id="ui-block-19-testimonial-carousal" class="owl-carousel owl-theme testimonial-owl text-center row-padding">
<!-- Item-1 -->
<div class="item">
<div class="icon-quotes mb-4">
<i class="fas fa-quote-left"></i>
</div>
<div class="description">
<p class="text-white paragraph">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc mauris arcu.</p>
</div>
<div class="testimonial-img mt-4">
<img src="vendor/img/elements-img/testimonial-img/ui-block-19-1-testimonial.png" alt="student img">
</div>
<div class="testimonial-tittle mt-3 mb-3">
<h3 class="mb-0 text-red alt-font">David Miller</h3>
</div>
</div>
<!-- Item-2 -->
<div class="item">
<div class="icon-quotes mb-4">
<i class="fas fa-quote-left"></i>
</div>
<div class="description">
<p class="text-white paragraph">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
</div>
<div class="testimonial-img mt-4">
<img src="vendor/img/elements-img/testimonial-img/ui-block-19-2-testimonial.png" alt="student img">
</div>
<div class="testimonial-tittle mt-3 mb-3">
<h3 class="mb-0 text-blue alt-font">Alex Jackson</h3>
</div>
</div>
<!-- Item-3 -->
<div class="item">
<div class="icon-quotes mb-4">
<i class="fas fa-quote-left"></i>
</div>
<div class="description">
<p class="text-white paragraph">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc mauris arcu.</p>
</div>
<div class="testimonial-img mt-4">
<img src="vendor/img/elements-img/testimonial-img/ui-block-19-3-testimonial.png" alt="student img">
</div>
<div class="testimonial-tittle mt-3 mb-3">
<h3 class="mb-0 text-red alt-font">Mark Anthony</h3>
</div>
</div>
<!-- Item-4 -->
<div class="item">
<div class="icon-quotes mb-4">
<i class="fas fa-quote-left"></i>
</div>
<div class="description">
<p class="text-white paragraph">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
</div>
<div class="testimonial-img mt-4">
<img src="vendor/img/elements-img/testimonial-img/ui-block-19-4-testimonial.png" alt="student img">
</div>
<div class="testimonial-tittle mt-3 mb-3">
<h3 class="mb-0 text-blue alt-font">Kelly Smith</h3>
</div>
</div>
</div>
</div>
</section>
<link href="vendor/css/owl.carousel.min.css" rel="stylesheet">
<script src="vendor/js/owl.carousel.min.js"></script>
<script>
$('.ui-block-19.reviews #ui-block-19-testimonial-carousal').owlCarousel({
loop:true,
margin:20,
nav:false,
dots:false,
autoplay:true,
responsive:{
0:{
items:1
},
600:{
items:2
},
1000:{
items:3
}
}
});
</script>
<!-- Cut the script tag including the script and paste it before the body ending tag at the bottom of your html file -->
<!-- End ui-block-19 -->
<hr>
<!-- Start ui-block-20 -->
<section class="testimonial-sec ui-block-20">
<div class="container">
<div class="row">
<div class="col-12 text-center testimonial-heading">
<span class="sub-heading">Join the event</span>
<h4 class="large-heading">Event Reviews</h4>
<span class="fly-line"></span>
</div>
</div>
<div class="ui-block-20-testimonial-card owl-carousel owl-theme">
<div class="item text-center">
<div class="testimonial-review">
<div class="image-holder">
<img src="vendor/img/elements-img/testimonial-img/ui-block-20-1-testimonial.jpg" alt="testimonial-img">
</div>
<div class="client-info media-body">
<h5 class="client-name mt-0">- JOE MARTIN -</h5>
<p class="client-designation">Senior Developer</p>
</div>
<div class="review-detail">
<p class="text-des">Lorem ipsum is simply dummy text of the printing and type setting. Lorem Ipsum has been the industry’s is dummy. Lorem ipsum is simply dummy text of the printing and typesetting. Lorem Ipsum has been the industry’s standard dummy.</p>
<ul class="test-review">
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
</ul>
</div>
</div>
</div>
<div class="item text-center">
<div class="testimonial-review">
<div class="image-holder">
<img src="vendor/img/elements-img/testimonial-img/ui-block-20-2-testimonial.jpg" alt="testimonial-img">
</div>
<div class="client-info media-body">
<h5 class="client-name mt-0">- JOE MARTIN -</h5>
<p class="client-designation">Senior Developer</p>
</div>
<div class="review-detail">
<p class="text-des">Lorem ipsum is simply dummy text of the printing and type setting. Lorem Ipsum has been the industry’s is dummy. Lorem ipsum is simply dummy text of the printing and typesetting. Lorem Ipsum has been the industry’s standard dummy.</p>
<ul class="test-review">
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
</ul>
</div>
</div>
</div>
<div class="item text-center">
<div class="testimonial-review">
<div class="image-holder">
<img src="vendor/img/elements-img/testimonial-img/ui-block-20-3-testimonial.jpg" alt="testimonial-img">
</div>
<div class="client-info media-body">
<h5 class="client-name mt-0">- JOE MARTIN -</h5>
<p class="client-designation">Senior Developer</p>
</div>
<div class="review-detail">
<p class="text-des">Lorem ipsum is simply dummy text of the printing and type setting. Lorem Ipsum has been the industry’s is dummy. Lorem ipsum is simply dummy text of the printing and typesetting. Lorem Ipsum has been the industry’s standard dummy.</p>
<ul class="test-review">
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
<li><a href="#"><i class="las la-star"></i></a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</section>
<link href="vendor/css/owl.carousel.min.css" rel="stylesheet">
<script src="vendor/js/owl.carousel.min.js"></script>
<script>
$('.ui-block-20.testimonial-sec .ui-block-20-testimonial-card').owlCarousel({
loop: true,
margin: 20,
slideSpeed: 5000,
slideTransition: 'linear',
nav: false,
dots: true,
autoplay: true,
autoplayTimeout: 40000,
autoplayHoverPause: true,
responsive: {
0: {
items: 1,
dots: false
},
600: {
items: 1
},
1000: {
items: 1
},
}
});
</script>
<!-- Cut the script tag including the script and paste it before the body ending tag at the bottom of your html file -->
<!-- End ui-block-20 -->
<hr>
<!-- Start ui-block-21 -->
<section class="gradient-bg1 text-center ui-block-21 reviews" id="clients">
<div class="container">
<!--Row-->
<div class="row">
<div class="col-md-12">
<div class="heading-area mx-570 mb-5">
<h2 class="title text-white m-0">Some <span class="js-rotating">great, ideal</span> words from
our clients</h2>
</div>
</div>
</div>
<!--Row-->
<div class="row">
<div class="col-md-12">
<div class="owl-carousel wow zoomIn" id="testimonial-slider-new">
<div class="item">
<p class="para">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse tincidunt
egestas nunc, at pellentesque arcu sollicitudin et. Aliquam hendrerit diam quis ipsum
ultricies, quis ultricies arcu suscipit. Lorem ipsum dolor sit amet, consectetur adipiscing
elit. Fusce ut diam quis nulla faucibus venenatis. </p>
<h5 class="name gradient-text1">David Villas</h5>
<span class="designation">Designer, Company Name</span>
<ul class="ratings list-unstyled">
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
</ul>
</div>
<div class="item">
<p class="para">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse tincidunt
egestas nunc, at pellentesque arcu sollicitudin et. Aliquam hendrerit diam quis ipsum
ultricies, quis ultricies arcu suscipit. Lorem ipsum dolor sit amet, consectetur adipiscing
elit. Fusce ut diam quis nulla faucibus venenatis. </p>
<h5 class="name gradient-text1">David Villas</h5>
<span class="designation">Designer, Company Name</span>
<ul class="ratings list-unstyled">
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
</ul>
</div>
<div class="item">
<p class="para">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse tincidunt
egestas nunc, at pellentesque arcu sollicitudin et. Aliquam hendrerit diam quis ipsum
ultricies, quis ultricies arcu suscipit. Lorem ipsum dolor sit amet, consectetur adipiscing
elit. Fusce ut diam quis nulla faucibus venenatis. </p>
<h5 class="name gradient-text1">David Villas</h5>
<span class="designation">Designer, Company Name</span>
<ul class="ratings list-unstyled">
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
</ul>
</div>
<div class="item">
<p class="para">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse tincidunt
egestas nunc, at pellentesque arcu sollicitudin et. Aliquam hendrerit diam quis ipsum
ultricies, quis ultricies arcu suscipit. Lorem ipsum dolor sit amet, consectetur adipiscing
elit. Fusce ut diam quis nulla faucibus venenatis. </p>
<h5 class="name gradient-text1">David Villas</h5>
<span class="designation">Designer, Company Name</span>
<ul class="ratings list-unstyled">
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
</ul>
</div>
<div class="item">
<p class="para">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse tincidunt
egestas nunc, at pellentesque arcu sollicitudin et. Aliquam hendrerit diam quis ipsum
ultricies, quis ultricies arcu suscipit. Lorem ipsum dolor sit amet, consectetur adipiscing
elit. Fusce ut diam quis nulla faucibus venenatis. </p>
<h5 class="name gradient-text1">David Villas</h5>
<span class="designation">Designer, Company Name</span>
<ul class="ratings list-unstyled">
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
</ul>
</div>
<div class="item">
<p class="para">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse tincidunt
egestas nunc, at pellentesque arcu sollicitudin et. Aliquam hendrerit diam quis ipsum
ultricies, quis ultricies arcu suscipit. Lorem ipsum dolor sit amet, consectetur adipiscing
elit. Fusce ut diam quis nulla faucibus venenatis. </p>
<h5 class="name gradient-text1">David Villas</h5>
<span class="designation">Designer, Company Name</span>
<ul class="ratings list-unstyled">
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
</ul>
</div>
<div class="item">
<p class="para">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse tincidunt
egestas nunc, at pellentesque arcu sollicitudin et. Aliquam hendrerit diam quis ipsum
ultricies, quis ultricies arcu suscipit. Lorem ipsum dolor sit amet, consectetur adipiscing
elit. Fusce ut diam quis nulla faucibus venenatis. </p>
<h5 class="name gradient-text1">David Villas</h5>
<span class="designation">Designer, Company Name</span>
<ul class="ratings list-unstyled">
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
</ul>
</div>
<div class="item">
<p class="para">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse tincidunt
egestas nunc, at pellentesque arcu sollicitudin et. Aliquam hendrerit diam quis ipsum
ultricies, quis ultricies arcu suscipit. Lorem ipsum dolor sit amet, consectetur adipiscing
elit. Fusce ut diam quis nulla faucibus venenatis. </p>
<h5 class="name gradient-text1">David Villas</h5>
<span class="designation">Designer, Company Name</span>
<ul class="ratings list-unstyled">
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
<li><i aria-hidden="true" class="fas fa-star"></i></li>
</ul>
</div>
</div>
</div>
</div>
<!--Testimonial Thumbs-->
<div class="owl-dots" id="testimonials-avatar">
<!--data-position[top,right,bottom,left]-->
<button class="owl-dot active" data-position="22%,auto,auto,5%">
<img alt="image" src="vendor/img/elements-img/testimonial-img/ui-block-21-1-testimonial.png"></button>
<button class="owl-dot active" data-position="30%,auto,auto,16%">
<img alt="image" src="vendor/img/elements-img/testimonial-img/ui-block-21-2-testimonial.png"></button>
<button class="owl-dot active" data-position="auto,auto,38%,7%">
<img alt="image" src="vendor/img/elements-img/testimonial-img/ui-block-21-3-testimonial.png"></button>
<button class="owl-dot active" data-position="auto,auto,23%,18%">
<img alt="image" src="vendor/img/elements-img/testimonial-img/ui-block-21-4-testimonial.png"></button>
<!--data-position[top,right,bottom,left]-->
<button class="owl-dot active" data-position="20%,19%,auto,auto">
<img alt="image" src="vendor/img/elements-img/testimonial-img/ui-block-21-5-testimonial.png"></button>
<button class="owl-dot active" data-position="28%,6%,auto,auto">
<img alt="image" src="vendor/img/elements-img/testimonial-img/ui-block-21-6-testimonial.png"></button>
<button class="owl-dot active" data-position="40%,15%,auto,auto">
<img alt="image" src="vendor/img/elements-img/testimonial-img/ui-block-21-4-testimonial.png"></button>
<button class="owl-dot active" data-position="auto,21%,22%,auto">
<img alt="image" src="vendor/img/elements-img/testimonial-img/ui-block-21-2-testimonial.png"></button>
</div>
</div>
</section>
<link href="vendor/css/owl.carousel.min.css" rel="stylesheet">
<script src="vendor/js/owl.carousel.min.js"></script>
<script src="vendor/js/morphext.min.js"></script>
<script>
$(".ui-block-21.reviews #testimonial-slider-new").owlCarousel({
items: 1,
loop: true,
nav: false,
autoplay: false,
dots: true,
dotsContainer: "#testimonials-avatar",
autoplayTimeout: 6000,
responsive: {
1280: {
items: 1,
},
600: {
items: 1,
},
320: {
items: 1,
},
}
});
$('[data-position]').each(function () {
var position = $(this).data('position').split(',')
$(this).css({top: position[0], right: position[1], bottom: position[2], left: position[3]})
});
if ($(".js-rotating").length) {
$(".js-rotating").Morphext({
// The [in] animation type. Refer to Animate.css for a list of available animations.
animation: "flipInX",
// An array of phrases to rotate are created based on this separator. Change it if you wish to separate the phrases differently (e.g. So Simple | Very Doge | Much Wow | Such Cool).
separator: ",",
// The delay between the changing of each phrase in milliseconds.
speed: 3000,
complete: function () {
// Called after the entrance animation is executed.
}
});
}
</script>
<!-- Cut the script tag including the script and paste it before the body ending tag at the bottom of your html file -->
<!-- End ui-block-21 -->
<hr>
<!-- Start ui-block-22 -->
<div id="client-sec" class="client-sec parallax-slide ui-block-22">
<div class="client-sec-overlay"></div>
<div class="clients owl-carousel owl-theme no-gutters wow zoomIn" data-wow-duration="1.5s">
<!-- Item 1 -->
<div class="item client-container">
<div class="row no-gutters client-img-overlay text-center">
<div class="col-10 offset-1 col-lg-6 offset-lg-3">
<span class="client-symbol-qoute"><i class="fas fa-quote-left text-left"></i></span>
<p class="client-text">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut posuere nisi est, sed ullamcorper nibh volutpat at. In rutrum, metus ut posuere gravida, tellus lacus faucibus lectus, sed cursus eros ligula non odio. Suspendisse volutpat sagittis sapien. Curabitur quis malesuada ipsum.
</p>
</div>
</div>
<div class="client-img-holder rounded-circle center-block">
<img src="vendor/img/elements-img/testimonial-img/ui-block-22-1-testimonial.png" class="rounded-circle" alt="client1">
</div>
<div class="client-detail col-12 text-center">
<h4 class="client-name">Ellizabeth Taylor</h4>
<p class="client-des">Amazon</p>
<div class="clients-social position-relative">
<ul class="slider-social client-s-media ">
<li><a class="facebook_bg_hvr2" href="javascript:void(0);"><i class="fab fa-facebook-f"></i> </a></li>
<li><a class="twitter_bg_hvr2" href="javascript:void(0);"><i class="fab fa-twitter"></i> </a></li>
<li><a class="linkdin_bg_hvr2" href="javascript:void(0);"><i class="fab fa-linkedin-in"></i> </a></li>
</ul>
</div>
</div>
</div>
<!-- Item 2 -->
<div class="item client-container">
<div class="row no-gutters client-img-overlay text-center">
<div class="col-10 offset-1 col-lg-6 offset-lg-3 wow zoomIn" data-wow-duration="2s">
<span class="client-symbol-qoute"><i class="fas fa-quote-left text-left"></i></span>
<p class="client-text">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut posuere nisi est, sed ullamcorper nibh volutpat at. In rutrum, metus ut posuere gravida, tellus lacus faucibus lectus, sed cursus eros ligula non odio. Suspendisse volutpat sagittis sapien. Curabitur quis malesuada ipsum.
</p>
</div>
</div>
<div class="client-img-holder rounded-circle center-block">
<img src="vendor/img/elements-img/testimonial-img/ui-block-22-2-testimonial.png" class="rounded-circle" alt="client1">
</div>
<div class="client-detail col-12 text-center">
<h4 class="client-name">Steve Smith</h4>
<p class="client-des">Amazon</p>
<div class="clients-social position-relative">
<ul class="slider-social client-s-media ">
<li><a class="facebook_bg_hvr2" href="javascript:void(0);"><i class="fab fa-facebook-f"></i> </a></li>
<li><a class="twitter_bg_hvr2" href="javascript:void(0);"><i class="fab fa-twitter"></i> </a></li>
<li><a class="linkdin_bg_hvr2" href="javascript:void(0);"><i class="fab fa-linkedin-in"></i> </a></li>
</ul>
</div>
</div>
</div>
<!-- Item 3 -->
<div class="item client-container">
<div class="row no-gutters client-img-overlay text-center">
<div class="col-10 offset-1 col-lg-6 offset-lg-3 wow zoomIn" data-wow-duration="2s">
<span class="client-symbol-qoute"><i class="fas fa-quote-left text-left"></i></span>
<p class="client-text">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut posuere nisi est, sed ullamcorper nibh volutpat at. In rutrum, metus ut posuere gravida, tellus lacus faucibus lectus, sed cursus eros ligula non odio. Suspendisse volutpat sagittis sapien. Curabitur quis malesuada ipsum.
</p>
</div>
</div>
<div class="client-img-holder rounded-circle center-block">
<img src="vendor/img/elements-img/testimonial-img/ui-block-22-3-testimonial.png" class="rounded-circle" alt="client1">
</div>
<div class="client-detail col-12 text-center">
<h4 class="client-name">Ellizabeth Taylor</h4>
<p class="client-des">Amazon</p>
<div class="clients-social position-relative">
<ul class="slider-social client-s-media">
<li><a class="facebook_bg_hvr2" href="javascript:void(0);"><i class="fab fa-facebook-f"></i> </a></li>
<li><a class="twitter_bg_hvr2" href="javascript:void(0);"><i class="fab fa-twitter"></i> </a></li>
<li><a class="linkdin_bg_hvr2" href="javascript:void(0);"><i class="fab fa-linkedin-in"></i> </a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
<link href="vendor/css/owl.carousel.min.css" rel="stylesheet">
<script src="vendor/js/owl.carousel.min.js"></script>
<script>
$('.ui-block-22.client-sec .clients').owlCarousel({
loop:true,
margin:0,
slideSpeed: 5000,
slideTransition:'linear',
nav:false,
dots:false,
autoplay:true,
autoplayTimeout:5000,
autoplayHoverPause:false,
responsive:{
0:{
items:1
},
600:{
items:1
},
1000:{
items:1
},
}
});
</script>
<!-- Cut the script tag including the script and paste it before the body ending tag at the bottom of your html file -->
<!-- End ui-block-22 -->
<hr>
<!-- Start ui-block-23 -->
<section class="client-sec bg-dark-black py-0 ui-block-29">
<div class="client-sec-overlay"></div>
<div class="clients owl-carousel owl-theme no-gutters">
<div class="item client-container position-relative">
<div class="main-container">
<div class="row no-gutters client-img-overlay text-center">
<div class="col-12 wow zoomIn" data-wow-duration="2s">
<span class="client-symbol-qoute"><i class="fas fa-quote-left text-left"></i></span>
<p class="client-text ml-auto mr-auto">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut posuere nisi est, sed ullamcorper nibh volutpat at. In rutrum, metus ut posuere gravida, tellus lacus faucibus lectus, sed cursus eros ligula non odio. Suspendisse volutpat sagittis sapien. Curabitur quis malesuada ipsum.
</p>
</div>
</div>
<div class="client-img-holder rounded-circle center-block">
<img src="vendor/img/elements-img/testimonial-img/ui-block-23-1-testimonial.png" class="rounded-circle" alt="client1">
</div>
<div class="client-detail col-12 text-center">
<h4 class="client-name">Ellizabeth Taylor</h4>
<p class="client-des">Amazon</p>
<ul class="slider-social client-s-media ">
<li><a href="javascript:void(0);"><i class="fab fa-facebook-f"></i> </a></li>
<li><a href="javascript:void(0);"><i class="fab fa-twitter"></i> </a></li>
<li><a href="javascript:void(0);"><i class="fab fa-linkedin-in"></i> </a></li>
</ul>
</div>
</div>
</div>
<div class="item client-container position-relative">
<div class="main-container">
<div class="row no-gutters client-img-overlay text-center">
<div class="col-12 wow zoomIn" data-wow-duration="2s">
<span class="client-symbol-qoute"><i class="fas fa-quote-left text-left"></i></span>
<p class="client-text ml-auto mr-auto">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut posuere nisi est, sed ullamcorper nibh volutpat at. In rutrum, metus ut posuere gravida, tellus lacus faucibus lectus, sed cursus eros ligula non odio. Suspendisse volutpat sagittis sapien. Curabitur quis malesuada ipsum.
</p>
</div>
</div>
<div class="client-img-holder rounded-circle center-block">
<img src="vendor/img/elements-img/testimonial-img/ui-block-23-2-testimonial.png" class="rounded-circle" alt="client1">
</div>
<div class="client-detail col-12 text-center">
<h4 class="client-name">Ellizabeth John</h4>
<p class="client-des">Amazon</p>
<ul class="slider-social client-s-media ">
<li><a href="javascript:void(0);"><i class="fab fa-facebook-f"></i> </a></li>
<li><a href="javascript:void(0);"><i class="fab fa-twitter"></i> </a></li>
<li><a href="javascript:void(0);"><i class="fab fa-linkedin-in"></i> </a></li>
</ul>
</div>
</div>
</div>
<div class="item client-container position-relative">
<div class="main-container">
<div class="row no-gutters client-img-overlay text-center">
<div class="col-12 wow zoomIn" data-wow-duration="2s">
<span class="client-symbol-qoute"><i class="fas fa-quote-left text-left"></i></span>
<p class="client-text ml-auto mr-auto">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut posuere nisi est, sed ullamcorper nibh volutpat at. In rutrum, metus ut posuere gravida, tellus lacus faucibus lectus, sed cursus eros ligula non odio. Suspendisse volutpat sagittis sapien. Curabitur quis malesuada ipsum.
</p>
</div>
</div>
<div class="client-img-holder rounded-circle center-block">
<img src="vendor/img/elements-img/testimonial-img/ui-block-23-3-testimonial.png" class="rounded-circle" alt="client1">
</div>
<div class="client-detail col-12 text-center">
<h4 class="client-name">Mike Green</h4>
<p class="client-des">Amazon</p>
<ul class="slider-social client-s-media ">
<li><a href="javascript:void(0);"><i class="fab fa-facebook-f"></i> </a></li>
<li><a href="javascript:void(0);"><i class="fab fa-twitter"></i> </a></li>
<li><a href="javascript:void(0);"><i class="fab fa-linkedin-in"></i> </a></li>
</ul>
</div>
</div>
</div>
</div>
</section>
<link rel="stylesheet" href="vendor/css/owl.carousel.min.css">
<script src="vendor/js/owl.carousel.min.js"></script>
<script>
$('.ui-block-29 .clients').owlCarousel({
loop:true,
margin:0,
slideSpeed: 5000,
slideTransition:'linear',
nav:false,
dots:false,
autoplay:false,
autoplayTimeout:8000,
autoplayHoverPause:true,
responsive:{
0:{
items:1
},
600:{
items:1
},
1000:{
items:1
},
}
});
</script>
<!-- Cut the script tag including the script and paste it before the body ending tag at the bottom of your html file -->
<!-- End ui-block-23 -->
<script src="vendor/js/megamenu.js"></script>
<script>
$ = jQuery.noConflict();
jQuery(window).on("load", function () {
"use strict";
$('.side-menu').removeClass('d-none');
});
jQuery(function ($) {
"use strict";
var $window = $(window);
var windowsize = $(window).width();
$(".scroll").on("click", function(event){
event.preventDefault();
$('html,body').animate({
scrollTop: $(this.hash).offset().top - 40}, 1100);
});
if ($("#sidemenu_toggle").length) {
$("#sidemenu_toggle").on("click", function () {
$(".pushwrap").toggleClass("active");
$(".side-menu").addClass("side-menu-active"), $("#close_side_menu").fadeIn(700)
}), $("#close_side_menu").on("click", function () {
$(".side-menu").removeClass("side-menu-active"), $(this).fadeOut(200), $(".pushwrap").removeClass("active")
}), $(".side-nav .navbar-nav .nav-link").on("click", function () {
$(".side-menu").removeClass("side-menu-active"), $("#close_side_menu").fadeOut(200), $(".pushwrap").removeClass("active")
}), $("#btn_sideNavClose").on("click", function () {
$(".side-menu").removeClass("side-menu-active"), $("#close_side_menu").fadeOut(200), $(".pushwrap").removeClass("active")
})
}
});
</script>
</body>
</html>