Testimonials
Add these testimonial style examples that check off all of the best practices for attracting new customers with help from your happy customers.
Testimonials #1
The template is really nice and offers quite a large set of options. It's beautiful and the coding is done quickly and seamlessly. Thank you!
Maria Muszynska
If you can design one thing you can design everything with Front. Just believe it.
Alex Pottorf
Github
<!-- Testimonials Section -->
<div class="bg-img-hero-bottom" style="background-image: url(../../assets/img/1920x800/img11.jpg);">
<div class="container">
<div class="row justify-content-md-end">
<div class="col-md-6 col-lg-5 col-xl-4 space-top-3 mb-n9">
<!-- Testimonials -->
<div class="card border-0 bg-primary text-white shadow-primary-lg">
<div class="card-body p-7">
<div class="js-slick-carousel u-slick"
data-pagi-classes="text-right u-slick__pagination u-slick__pagination--white mt-2 mb-0">
<!-- Testimonials -->
<div class="js-slide">
<!-- SVG Quote -->
<figure class="mb-4">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="40px" height="40px"
viewBox="0 0 8 8" style="enable-background:new 0 0 8 8;" xml:space="preserve">
<path class="fill-white" d="M3,1.3C2,1.7,1.2,2.7,1.2,3.6c0,0.2,0,0.4,0.1,0.5c0.2-0.2,0.5-0.3,0.9-0.3c0.8,0,1.5,0.6,1.5,1.5c0,0.9-0.7,1.5-1.5,1.5
C1.4,6.9,1,6.6,0.7,6.1C0.4,5.6,0.3,4.9,0.3,4.5c0-1.6,0.8-2.9,2.5-3.7L3,1.3z M7.1,1.3c-1,0.4-1.8,1.4-1.8,2.3
c0,0.2,0,0.4,0.1,0.5c0.2-0.2,0.5-0.3,0.9-0.3c0.8,0,1.5,0.6,1.5,1.5c0,0.9-0.7,1.5-1.5,1.5c-0.7,0-1.1-0.3-1.4-0.8
C4.4,5.6,4.4,4.9,4.4,4.5c0-1.6,0.8-2.9,2.5-3.7L7.1,1.3z"/>
</svg>
</figure>
<!-- End SVG Quote -->
<!-- Text -->
<blockquote class="h6 font-weight-normal text-lh-md mb-4">The template is really nice and offers quite a large set of options. It's beautiful and the coding is done quickly and seamlessly. Thank you!</blockquote>
<!-- End Text -->
<!-- Author -->
<div class="media">
<div class="u-avatar mr-3">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img1.jpg" alt="Image Description">
</div>
<div class="media-body">
<h4 class="h6 mb-0">Maria Muszynska</h4>
<p class="small text-white-70">Google</p>
</div>
</div>
<!-- End Author -->
</div>
<!-- End Testimonials -->
<!-- Testimonials -->
<div class="js-slide">
<!-- SVG Quote -->
<figure class="mb-4">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="40px" height="40px"
viewBox="0 0 8 8" style="enable-background:new 0 0 8 8;" xml:space="preserve">
<path class="fill-white" d="M3,1.3C2,1.7,1.2,2.7,1.2,3.6c0,0.2,0,0.4,0.1,0.5c0.2-0.2,0.5-0.3,0.9-0.3c0.8,0,1.5,0.6,1.5,1.5c0,0.9-0.7,1.5-1.5,1.5
C1.4,6.9,1,6.6,0.7,6.1C0.4,5.6,0.3,4.9,0.3,4.5c0-1.6,0.8-2.9,2.5-3.7L3,1.3z M7.1,1.3c-1,0.4-1.8,1.4-1.8,2.3
c0,0.2,0,0.4,0.1,0.5c0.2-0.2,0.5-0.3,0.9-0.3c0.8,0,1.5,0.6,1.5,1.5c0,0.9-0.7,1.5-1.5,1.5c-0.7,0-1.1-0.3-1.4-0.8
C4.4,5.6,4.4,4.9,4.4,4.5c0-1.6,0.8-2.9,2.5-3.7L7.1,1.3z"/>
</svg>
</figure>
<!-- End SVG Quote -->
<!-- Text -->
<blockquote class="h6 font-weight-normal text-lh-md mb-4">If you can design one thing you can design everything with Front. Just believe it.</blockquote>
<!-- End Text -->
<!-- Author -->
<div class="media">
<div class="u-avatar mr-3">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img3.jpg" alt="Image Description">
</div>
<div class="media-body">
<h4 class="h6 mb-0">Alex Pottorf</h4>
<p class="small text-white-70">Github</p>
</div>
</div>
<!-- End Author -->
</div>
<!-- End Testimonials -->
</div>
</div>
</div>
<!-- End Testimonials -->
</div>
</div>
</div>
</div>
<!-- End Testimonials Section -->
<link rel="stylesheet" href="../../assets/vendor/slick-carousel/slick/slick.css">
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/slick-carousel/slick/slick.js"></script>
<!-- JS Implementing Plugins -->
<script src="../../assets/js/components/hs.slick-carousel.js"></script>
<!-- JS Plugins Init. -->
<script>
$(document).on('ready', function () {
// initialization of slick carousel
$.HSCore.components.HSSlickCarousel.init('.js-slick-carousel');
});
</script>
Testimonials #2
The template is really nice and offers quite a large set of options. It's beautiful and the coding is done quickly and seamlessly. Thank you!
Maria Muszynska
If you can design one thing you can design everything with Front. Just believe it.
Alex Pottorf
Github
<!-- Testimonials Section -->
<div class="bg-img-hero" style="background-image: url(../../assets/img/1920x800/img12.jpg);">
<div class="container">
<div class="row">
<div class="col-md-6 col-lg-5 col-xl-4 space-2">
<!-- Testimonials -->
<div class="card shadow-sm">
<div class="card-body p-7">
<div class="js-slick-carousel u-slick" data-pagi-classes="text-right u-slick__pagination mt-2 mb-0">
<!-- Testimonials -->
<div class="js-slide">
<!-- SVG Quote -->
<figure class="mb-4">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="40px" height="40px"
viewBox="0 0 8 8" style="enable-background:new 0 0 8 8;" xml:space="preserve">
<path class="fill-primary" d="M3,1.3C2,1.7,1.2,2.7,1.2,3.6c0,0.2,0,0.4,0.1,0.5c0.2-0.2,0.5-0.3,0.9-0.3c0.8,0,1.5,0.6,1.5,1.5c0,0.9-0.7,1.5-1.5,1.5
C1.4,6.9,1,6.6,0.7,6.1C0.4,5.6,0.3,4.9,0.3,4.5c0-1.6,0.8-2.9,2.5-3.7L3,1.3z M7.1,1.3c-1,0.4-1.8,1.4-1.8,2.3
c0,0.2,0,0.4,0.1,0.5c0.2-0.2,0.5-0.3,0.9-0.3c0.8,0,1.5,0.6,1.5,1.5c0,0.9-0.7,1.5-1.5,1.5c-0.7,0-1.1-0.3-1.4-0.8
C4.4,5.6,4.4,4.9,4.4,4.5c0-1.6,0.8-2.9,2.5-3.7L7.1,1.3z"/>
</svg>
</figure>
<!-- End SVG Quote -->
<!-- Text -->
<blockquote class="h6 font-weight-normal text-lh-md mb-4">The template is really nice and offers quite a large set of options. It's beautiful and the coding is done quickly and seamlessly. Thank you!</blockquote>
<!-- End Text -->
<!-- Author -->
<div class="media">
<div class="u-avatar mr-3">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img1.jpg" alt="Image Description">
</div>
<div class="media-body">
<h4 class="h6 mb-0">Maria Muszynska</h4>
<p class="small">Google</p>
</div>
</div>
<!-- End Author -->
</div>
<!-- End Testimonials -->
<!-- Testimonials -->
<div class="js-slide">
<!-- SVG Quote -->
<figure class="mb-4">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="40px" height="40px"
viewBox="0 0 8 8" style="enable-background:new 0 0 8 8;" xml:space="preserve">
<path class="fill-primary" d="M3,1.3C2,1.7,1.2,2.7,1.2,3.6c0,0.2,0,0.4,0.1,0.5c0.2-0.2,0.5-0.3,0.9-0.3c0.8,0,1.5,0.6,1.5,1.5c0,0.9-0.7,1.5-1.5,1.5
C1.4,6.9,1,6.6,0.7,6.1C0.4,5.6,0.3,4.9,0.3,4.5c0-1.6,0.8-2.9,2.5-3.7L3,1.3z M7.1,1.3c-1,0.4-1.8,1.4-1.8,2.3
c0,0.2,0,0.4,0.1,0.5c0.2-0.2,0.5-0.3,0.9-0.3c0.8,0,1.5,0.6,1.5,1.5c0,0.9-0.7,1.5-1.5,1.5c-0.7,0-1.1-0.3-1.4-0.8
C4.4,5.6,4.4,4.9,4.4,4.5c0-1.6,0.8-2.9,2.5-3.7L7.1,1.3z"/>
</svg>
</figure>
<!-- End SVG Quote -->
<!-- Text -->
<blockquote class="h6 font-weight-normal text-lh-md mb-4">If you can design one thing you can design everything with Front. Just believe it.</blockquote>
<!-- End Text -->
<!-- Author -->
<div class="media">
<div class="u-avatar mr-3">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img3.jpg" alt="Image Description">
</div>
<div class="media-body">
<h4 class="h6 mb-0">Alex Pottorf</h4>
<p class="small">Github</p>
</div>
</div>
<!-- End Author -->
</div>
<!-- End Testimonials -->
</div>
</div>
</div>
<!-- End Testimonials -->
</div>
</div>
</div>
</div>
<!-- End Testimonials Section -->
<link rel="stylesheet" href="../../assets/vendor/slick-carousel/slick/slick.css">
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/slick-carousel/slick/slick.js"></script>
<!-- JS Implementing Plugins -->
<script src="../../assets/js/components/hs.slick-carousel.js"></script>
<!-- JS Plugins Init. -->
<script>
$(document).on('ready', function () {
// initialization of slick carousel
$.HSCore.components.HSSlickCarousel.init('.js-slick-carousel');
});
</script>
Testimonials #3
James Austin
Slack Inc.
The template is really nice and offers quite a large set of options. Thank you!
Charlotte Moore
Google Inc.
If you can design one thing you can design everything. Just believe it.
<!-- Testimonials -->
<div class="js-slick-carousel u-slick"
data-adaptive-height="true"
data-autoplay="true"
data-speed="5000"
data-vertical="true"
data-vertical-swiping="true">
<div class="js-slide">
<!-- Avatar -->
<div class="card border-0 rounded-top-left-pill rounded-right-pill mb-1">
<div class="card-body py-3 px-4">
<div class="media align-items-center">
<div class="u-avatar mr-3">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img3.jpg" alt="Image Description">
</div>
<div class="media-body">
<h2 class="h6 mb-0">James Austin</h2>
<p class="small mb-0">Slack Inc.</p>
</div>
</div>
</div>
</div>
<!-- End Avatar -->
<!-- Testimonials Content -->
<div class="card border-0 bg-primary text-white rounded-bottom-left-pill rounded-right-pill">
<div class="card-body p-4">
<div class="media">
<!-- SVG Quote -->
<figure class="mr-3">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="40px" height="40px"
viewBox="0 0 8 8" style="enable-background:new 0 0 8 8;" xml:space="preserve">
<path class="fill-warning" d="M3,1.3C2,1.7,1.2,2.7,1.2,3.6c0,0.2,0,0.4,0.1,0.5c0.2-0.2,0.5-0.3,0.9-0.3c0.8,0,1.5,0.6,1.5,1.5c0,0.9-0.7,1.5-1.5,1.5
C1.4,6.9,1,6.6,0.7,6.1C0.4,5.6,0.3,4.9,0.3,4.5c0-1.6,0.8-2.9,2.5-3.7L3,1.3z M7.1,1.3c-1,0.4-1.8,1.4-1.8,2.3
c0,0.2,0,0.4,0.1,0.5c0.2-0.2,0.5-0.3,0.9-0.3c0.8,0,1.5,0.6,1.5,1.5c0,0.9-0.7,1.5-1.5,1.5c-0.7,0-1.1-0.3-1.4-0.8
C4.4,5.6,4.4,4.9,4.4,4.5c0-1.6,0.8-2.9,2.5-3.7L7.1,1.3z"/>
</svg>
</figure>
<!-- End SVG Quote -->
<div class="media-body">
<blockquote class="mb-0">The template is really nice and offers quite a large set of options. Thank you!</blockquote>
</div>
</div>
</div>
</div>
<!-- End Testimonials Content -->
</div>
<div class="js-slide">
<!-- Avatar -->
<div class="card border-0 rounded-top-left-pill rounded-right-pill mb-1">
<div class="card-body py-3 px-4">
<div class="media align-items-center">
<div class="u-avatar mr-3">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img1.jpg" alt="Image Description">
</div>
<div class="media-body">
<h2 class="h6 mb-0">Charlotte Moore</h2>
<p class="small mb-0">Google Inc.</p>
</div>
</div>
</div>
</div>
<!-- End Avatar -->
<!-- Testimonials Content -->
<div class="card border-0 bg-primary text-white rounded-bottom-left-pill rounded-right-pill">
<div class="card-body p-4">
<div class="media">
<!-- SVG Quote -->
<figure class="mr-3">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="40px" height="40px"
viewBox="0 0 8 8" style="enable-background:new 0 0 8 8;" xml:space="preserve">
<path class="fill-warning" d="M3,1.3C2,1.7,1.2,2.7,1.2,3.6c0,0.2,0,0.4,0.1,0.5c0.2-0.2,0.5-0.3,0.9-0.3c0.8,0,1.5,0.6,1.5,1.5c0,0.9-0.7,1.5-1.5,1.5
C1.4,6.9,1,6.6,0.7,6.1C0.4,5.6,0.3,4.9,0.3,4.5c0-1.6,0.8-2.9,2.5-3.7L3,1.3z M7.1,1.3c-1,0.4-1.8,1.4-1.8,2.3
c0,0.2,0,0.4,0.1,0.5c0.2-0.2,0.5-0.3,0.9-0.3c0.8,0,1.5,0.6,1.5,1.5c0,0.9-0.7,1.5-1.5,1.5c-0.7,0-1.1-0.3-1.4-0.8
C4.4,5.6,4.4,4.9,4.4,4.5c0-1.6,0.8-2.9,2.5-3.7L7.1,1.3z"/>
</svg>
</figure>
<!-- End SVG Quote -->
<div class="media-body">
<blockquote class="mb-0">If you can design one thing you can design everything. Just believe it.</blockquote>
</div>
</div>
</div>
</div>
<!-- End Testimonials Content -->
</div>
</div>
<!-- End Testimonials -->
<link rel="stylesheet" href="../../assets/vendor/slick-carousel/slick/slick.css">
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/slick-carousel/slick/slick.js"></script>
<!-- JS Implementing Plugins -->
<script src="../../assets/js/components/hs.slick-carousel.js"></script>
<!-- JS Plugins Init. -->
<script>
$(document).on('ready', function () {
// initialization of slick carousel
$.HSCore.components.HSSlickCarousel.init('.js-slick-carousel');
});
</script>
Testimonials #4
<!-- Testimonials -->
<div class="bg-img-hero" style="background-image: url(../../assets/img/bg-shapes/bg3.png);">
<div class="container space-2">
<!-- SVG Quote -->
<figure class="text-center mb-5 mx-auto">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="40px" height="40px"
viewBox="0 0 8 8" style="enable-background:new 0 0 8 8;" xml:space="preserve">
<path class="fill-primary" d="M3,1.3C2,1.7,1.2,2.7,1.2,3.6c0,0.2,0,0.4,0.1,0.5c0.2-0.2,0.5-0.3,0.9-0.3c0.8,0,1.5,0.6,1.5,1.5c0,0.9-0.7,1.5-1.5,1.5
C1.4,6.9,1,6.6,0.7,6.1C0.4,5.6,0.3,4.9,0.3,4.5c0-1.6,0.8-2.9,2.5-3.7L3,1.3z M7.1,1.3c-1,0.4-1.8,1.4-1.8,2.3
c0,0.2,0,0.4,0.1,0.5c0.2-0.2,0.5-0.3,0.9-0.3c0.8,0,1.5,0.6,1.5,1.5c0,0.9-0.7,1.5-1.5,1.5c-0.7,0-1.1-0.3-1.4-0.8
C4.4,5.6,4.4,4.9,4.4,4.5c0-1.6,0.8-2.9,2.5-3.7L7.1,1.3z"/>
</svg>
</figure>
<!-- End SVG Quote -->
<!-- Testimonials Carousel Main -->
<div id="testimonialsNavMain" class="js-slick-carousel u-slick u-slick--transform-off mb-4"
data-infinite="true"
data-autoplay="true"
data-speed="5000"
data-fade="true"
data-nav-for="#testimonialsNavPagination">
<div class="js-slide">
<!-- Testimonials -->
<div class="w-md-80 w-lg-60 text-center mx-auto">
<blockquote class="h3 mb-5">The template is really nice and offers quite a large set of options. Thank you!</blockquote>
<h4 class="h6 text-muted">Maria Muszynska, Google</h4>
</div>
<!-- End Testimonials -->
</div>
<div class="js-slide">
<!-- Testimonials -->
<div class="w-md-80 w-lg-60 text-center mx-auto">
<blockquote class="h3 mb-5">It's beautiful and the coding is done quickly and seamlessly. Keep it up!</blockquote>
<h4 class="h6 text-muted">James Austin, Slack</h4>
</div>
<!-- End Testimonials -->
</div>
<div class="js-slide">
<!-- Testimonials -->
<div class="w-md-80 w-lg-60 text-center mx-auto">
<blockquote class="h3 mb-5">I love Front! I love the ease of use, I love the fact that I have total creative freedom...</blockquote>
<h4 class="h6 text-muted">Charlotte Moore, Amazon</h4>
</div>
<!-- End Testimonials -->
</div>
</div>
<!-- End Testimonials Carousel Main -->
<!-- Testimonials Carousel Pagination -->
<div id="testimonialsNavPagination" class="js-slick-carousel u-slick u-slick--pagination-modern u-slick--transform-off mx-auto"
data-infinite="true"
data-autoplay="true"
data-speed="5000"
data-focus-on-select="true"
data-center-mode="true"
data-slides-show="3"
data-is-thumbs="true"
data-nav-for="#testimonialsNavMain">
<div class="js-slide">
<div class="u-avatar mx-auto">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img1.jpg" alt="Image Description">
</div>
</div>
<div class="js-slide">
<div class="u-avatar mx-auto">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img3.jpg" alt="Image Description">
</div>
</div>
<div class="js-slide">
<div class="u-avatar mx-auto">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img2.jpg" alt="Image Description">
</div>
</div>
</div>
<!-- End Testimonials Carousel Pagination -->
</div>
</div>
<!-- End Testimonials -->
<link rel="stylesheet" href="../../assets/vendor/slick-carousel/slick/slick.css">
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/slick-carousel/slick/slick.js"></script>
<!-- JS Implementing Plugins -->
<script src="../../assets/js/components/hs.slick-carousel.js"></script>
<!-- JS Plugins Init. -->
<script>
$(document).on('ready', function () {
// initialization of slick carousel
$.HSCore.components.HSSlickCarousel.init('.js-slick-carousel');
});
</script>
Testimonials #5
<div class="gradient-half-primary-v1 space-2">
<!-- SVG Quote -->
<figure class="mb-5 mx-auto">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="40px" height="40px"
viewBox="0 0 8 8" style="enable-background:new 0 0 8 8;" xml:space="preserve">
<path class="fill-white" d="M3,1.3C2,1.7,1.2,2.7,1.2,3.6c0,0.2,0,0.4,0.1,0.5c0.2-0.2,0.5-0.3,0.9-0.3c0.8,0,1.5,0.6,1.5,1.5c0,0.9-0.7,1.5-1.5,1.5
C1.4,6.9,1,6.6,0.7,6.1C0.4,5.6,0.3,4.9,0.3,4.5c0-1.6,0.8-2.9,2.5-3.7L3,1.3z M7.1,1.3c-1,0.4-1.8,1.4-1.8,2.3
c0,0.2,0,0.4,0.1,0.5c0.2-0.2,0.5-0.3,0.9-0.3c0.8,0,1.5,0.6,1.5,1.5c0,0.9-0.7,1.5-1.5,1.5c-0.7,0-1.1-0.3-1.4-0.8
C4.4,5.6,4.4,4.9,4.4,4.5c0-1.6,0.8-2.9,2.5-3.7L7.1,1.3z"/>
</svg>
</figure>
<!-- End SVG Quote -->
<!-- Testimonials Carousel Main -->
<div id="testimonialsNavMainExample1" class="js-slick-carousel u-slick mb-4"
data-infinite="true"
data-autoplay="true"
data-speed="5000"
data-fade="true"
data-nav-for="#testimonialsNavPaginationExample1">
<div class="js-slide">
<!-- Testimonials -->
<div class="w-md-80 w-lg-60 text-center mx-auto">
<blockquote class="h5 text-white font-weight-normal mb-4">The template is really nice and offers quite a large set of options. Thank you!</blockquote>
<h1 class="h6 text-white-70">Maria Muszynska, Google</h1>
</div>
<!-- End Testimonials -->
</div>
<div class="js-slide">
<!-- Testimonials -->
<div class="w-md-80 w-lg-60 text-center mx-auto">
<blockquote class="h5 text-white font-weight-normal mb-4">It's beautiful and the coding is done quickly and seamlessly. Keep it up!</blockquote>
<h2 class="h6 text-white-70">James Austin, Slack</h2>
</div>
<!-- End Testimonials -->
</div>
<div class="js-slide">
<!-- Testimonials -->
<div class="w-md-80 w-lg-60 text-center mx-auto">
<blockquote class="h5 text-white font-weight-normal mb-4">I love Front! I love the ease of use, I love the fact that I have total creative freedom...</blockquote>
<h3 class="h6 text-white-70">Charlotte Moore, Amazon</h3>
</div>
<!-- End Testimonials -->
</div>
</div>
<!-- End Testimonials Carousel Main -->
<!-- Testimonials Carousel Pagination -->
<div id="testimonialsNavPaginationExample1" class="js-slick-carousel u-slick u-slick--transform-off u-slick--pagination-modern mx-auto"
data-infinite="true"
data-autoplay="true"
data-speed="5000"
data-center-mode="true"
data-slides-show="3"
data-is-thumbs="true"
data-focus-on-select="true"
data-nav-for="#testimonialsNavMainExample1">
<div class="js-slide">
<div class="u-avatar mx-auto">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img1.jpg" alt="Image Description">
</div>
</div>
<div class="js-slide">
<div class="u-avatar mx-auto">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img3.jpg" alt="Image Description">
</div>
</div>
<div class="js-slide">
<div class="u-avatar mx-auto">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img2.jpg" alt="Image Description">
</div>
</div>
</div>
<!-- End Testimonials Carousel Pagination -->
</div>
<link rel="stylesheet" href="../../assets/vendor/slick-carousel/slick/slick.css">
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/slick-carousel/slick/slick.js"></script>
<!-- JS Implementing Plugins -->
<script src="../../assets/js/components/hs.slick-carousel.js"></script>
<!-- JS Plugins Init. -->
<script>
$(document).on('ready', function () {
// initialization of slick carousel
$.HSCore.components.HSSlickCarousel.init('.js-slick-carousel');
});
</script>
Testimonials #6
The template is really nice and offers quite a large set of options. It's beautiful and the coding is done quickly and seamlessly. Thank you!
Maria Muszynska
The template is really nice and offers quite a large set of options. It's beautiful and the coding is done quickly and seamlessly. Thank you!
Massalha Shady
Apple
The template is really nice and offers quite a large set of options. It's beautiful and the coding is done quickly and seamlessly. Thank you!
Mark McManus
Microsoft
The template is really nice and offers quite a large set of options. It's beautiful and the coding is done quickly and seamlessly. Thank you!
Alex Pottorf
Github
<!-- Testimonials Section -->
<div class="bg-light">
<div class="container space-2">
<!-- Slick Carousel -->
<div class="js-slick-carousel u-slick u-slick-zoom u-slick--gutters-3"
data-slides-show="3"
data-center-mode="true"
data-autoplay="true"
data-speed="5000"
data-pagi-classes="text-center u-slick__pagination mt-7 mb-0"
data-responsive='[{
"breakpoint": 992,
"settings": {
"slidesToShow": 2
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 1
}
}]'>
<div class="js-slide my-4">
<!-- Testimonials -->
<div class="u-slick-zoom__slide text-center">
<div class="card border-0 shadow-sm">
<div class="card-body p-7">
<p class="mb-0">The template is really nice and offers quite a large set of options. It's beautiful and the coding is done quickly and seamlessly. Thank you!</p>
</div>
</div>
<div class="position-relative z-index-2 mt-n5 mb-3">
<div class="u-avatar mx-auto">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img1.jpg" alt="Image Description">
</div>
</div>
<h4 class="h6 mb-0">Maria Muszynska</h4>
<p class="small">Google</p>
</div>
<!-- End Testimonials -->
</div>
<div class="js-slide my-4">
<!-- Testimonials -->
<div class="u-slick-zoom__slide text-center">
<div class="card border-0 shadow-sm">
<div class="card-body p-7">
<p class="mb-0">The template is really nice and offers quite a large set of options. It's beautiful and the coding is done quickly and seamlessly. Thank you!</p>
</div>
</div>
<div class="position-relative z-index-2 mt-n5 mb-3">
<div class="u-avatar mx-auto">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img2.jpg" alt="Image Description">
</div>
</div>
<h4 class="h6 mb-0">Massalha Shady</h4>
<p class="small">Apple</p>
</div>
<!-- End Testimonials -->
</div>
<div class="js-slide my-4">
<!-- Testimonials -->
<div class="u-slick-zoom__slide text-center">
<div class="card border-0 shadow-sm">
<div class="card-body p-7">
<p class="mb-0">The template is really nice and offers quite a large set of options. It's beautiful and the coding is done quickly and seamlessly. Thank you!</p>
</div>
</div>
<div class="position-relative z-index-2 mt-n5 mb-3">
<div class="u-avatar mx-auto">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img3.jpg" alt="Image Description">
</div>
</div>
<h4 class="h6 mb-0">Mark McManus</h4>
<p class="small">Microsoft</p>
</div>
<!-- End Testimonials -->
</div>
<div class="js-slide my-4">
<!-- Testimonials -->
<div class="u-slick-zoom__slide text-center">
<div class="card border-0 shadow-sm">
<div class="card-body p-7">
<p class="mb-0">The template is really nice and offers quite a large set of options. It's beautiful and the coding is done quickly and seamlessly. Thank you!</p>
</div>
</div>
<div class="position-relative z-index-2 mt-n5 mb-3">
<div class="u-avatar mx-auto">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img4.jpg" alt="Image Description">
</div>
</div>
<h4 class="h6 mb-0">Alex Pottorf</h4>
<p class="small">Github</p>
</div>
<!-- End Testimonials -->
</div>
</div>
<!-- End Slick Carousel -->
</div>
</div>
<!-- End Testimonials Section -->
<link rel="stylesheet" href="../../assets/vendor/slick-carousel/slick/slick.css">
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/slick-carousel/slick/slick.js"></script>
<!-- JS Implementing Plugins -->
<script src="../../assets/js/components/hs.slick-carousel.js"></script>
<!-- JS Plugins Init. -->
<script>
$(document).on('ready', function () {
// initialization of slick carousel
$.HSCore.components.HSSlickCarousel.init('.js-slick-carousel');
});
</script>
Testimonials #7
Satisfied customers on Front
Casy Williams
NERC CIP Consultant
Elon Fisher
Consultant
Linda Spears
Business Analyst
Chris Johnson
Firewall Engineer
<!-- Testimonials -->
<div id="SVGbgElements5" class="svg-preloader position-relative gradient-half-primary-v1">
<div class="container position-relative z-index-2 space-2 space-md-3">
<!-- Title -->
<div class="text-center mb-4">
<!-- SVG Quote -->
<figure class="mx-auto mb-2">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="40px" height="40px"
viewBox="0 0 8 8" style="enable-background:new 0 0 8 8;" xml:space="preserve">
<path class="fill-warning" d="M3,1.3C2,1.7,1.2,2.7,1.2,3.6c0,0.2,0,0.4,0.1,0.5c0.2-0.2,0.5-0.3,0.9-0.3c0.8,0,1.5,0.6,1.5,1.5c0,0.9-0.7,1.5-1.5,1.5
C1.4,6.9,1,6.6,0.7,6.1C0.4,5.6,0.3,4.9,0.3,4.5c0-1.6,0.8-2.9,2.5-3.7L3,1.3z M7.1,1.3c-1,0.4-1.8,1.4-1.8,2.3
c0,0.2,0,0.4,0.1,0.5c0.2-0.2,0.5-0.3,0.9-0.3c0.8,0,1.5,0.6,1.5,1.5c0,0.9-0.7,1.5-1.5,1.5c-0.7,0-1.1-0.3-1.4-0.8
C4.4,5.6,4.4,4.9,4.4,4.5c0-1.6,0.8-2.9,2.5-3.7L7.1,1.3z"/>
</svg>
</figure>
<!-- End SVG Quote -->
<h2 class="text-white font-weight-medium">Satisfied customers on Front</h2>
</div>
<!-- End Title -->
<!-- Slick Carousel - Testimonials Main Nav -->
<div id="testimonialsNavMainExample2" class="js-slick-carousel u-slick text-center w-lg-75 mx-lg-auto mb-7"
data-adaptive-height="true"
data-infinite="true"
data-fade="true"
data-nav-for="#testimonialsNavPaginationExample3">
<div class="js-slide">
<!-- Testimonials -->
<blockquote class="lead text-white-70 text-lh-md">
I followed a link for a job on Front and uploaded my resume. About two hours later, I received an email from an employer looking for someone with my skills. In a week's time and four interviews later I have a fantastic new job! Thanks Front!</blockquote>
<!-- End Testimonials -->
</div>
<div class="js-slide">
<!-- Testimonials -->
<blockquote class="lead text-white-70 text-lh-md">
I had my resume public on Front for only two days and I got flooded with interviews from serious competitive employers that resulted in me choosing between very tempting offers. Don't waste your time. Go Front. It's real!</blockquote>
<!-- End Testimonials -->
</div>
<div class="js-slide">
<!-- Testimonials -->
<blockquote class="lead text-white-70 text-lh-md">
I found my current Job on Front. I applied and got a reply from the company within one day. Hired within the week. No other job site has as many tech jobs as Front.</blockquote>
<!-- End Testimonials -->
</div>
<div class="js-slide">
<!-- Testimonials -->
<blockquote class="lead text-white-70 text-lh-md">
I uploaded my resume on Front and within that week had several emails and calls about opportunities from recruiters. I decided to pursue an opportunity with HP and started working there that same month. Excellent site!</blockquote>
<!-- End Testimonials -->
</div>
</div>
<!-- End Slick Carousel - Testimonials Main Nav -->
<!-- Slick Carousel - Testimonials Pagination Nav -->
<div id="testimonialsNavPaginationExample3" class="js-slick-carousel u-slick u-slick--gutters-3 u-slick--pagination-interactive"
data-infinite="true"
data-slides-show="3"
data-center-mode="true"
data-focus-on-select="true"
data-nav-for="#testimonialsNavMainExample2"
data-responsive='[{
"breakpoint": 1200,
"settings": {
"slidesToShow": 2
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 2
}
}, {
"breakpoint": 554,
"settings": {
"slidesToShow": 1
}
}]'>
<div class="js-slide rounded-pill p-2">
<!-- Authors -->
<div class="media align-items-center">
<div class="u-avatar mr-3">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img1.jpg" alt="Image Description">
</div>
<div class="media-body">
<h4 class="h6 u-slick--pagination-interactive__title mb-0">Casy Williams</h4>
<p class="small u-slick--pagination-interactive__text mb-0">NERC CIP Consultant</p>
</div>
</div>
<!-- End Authors -->
</div>
<div class="js-slide rounded-pill p-2">
<!-- Authors -->
<div class="media align-items-center">
<div class="u-avatar mr-3">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img3.jpg" alt="Image Description">
</div>
<div class="media-body">
<h4 class="h6 u-slick--pagination-interactive__title mb-0">Elon Fisher</h4>
<p class="small u-slick--pagination-interactive__text mb-0">Consultant</p>
</div>
</div>
<!-- End Authors -->
</div>
<div class="js-slide rounded-pill p-2">
<!-- Authors -->
<div class="media align-items-center">
<div class="u-avatar mr-3">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img2.jpg" alt="Image Description">
</div>
<div class="media-body">
<h4 class="h6 u-slick--pagination-interactive__title mb-0">Linda Spears</h4>
<p class="small u-slick--pagination-interactive__text mb-0">Business Analyst</p>
</div>
</div>
<!-- End Authors -->
</div>
<div class="js-slide rounded-pill p-2">
<!-- Authors -->
<div class="media align-items-center">
<div class="u-avatar mr-3">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img4.jpg" alt="Image Description">
</div>
<div class="media-body">
<h4 class="h6 u-slick--pagination-interactive__title mb-0">Chris Johnson</h4>
<p class="small u-slick--pagination-interactive__text mb-0">Firewall Engineer</p>
</div>
</div>
<!-- End Authors -->
</div>
</div>
<!-- End Slick Carousel - Testimonials Pagination Nav -->
</div>
<!-- SVG Background Element -->
<figure class="position-absolute top-0 right-0 w-100 h-100">
<img class="js-svg-injector" src="../../assets/svg/components/bg-elements-5.svg" alt="SVG"
data-parent="#SVGbgElements5">
</figure>
<!-- End SVG Background Element -->
</div>
<!-- End Testimonials -->
<link rel="stylesheet" href="../../assets/vendor/slick-carousel/slick/slick.css">
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/slick-carousel/slick/slick.js"></script>
<script src="../../assets/vendor/svg-injector/dist/svg-injector.min.js"></script>
<!-- JS Implementing Plugins -->
<script src="../../assets/js/components/hs.slick-carousel.js"></script>
<script src="../../assets/js/components/hs.svg-injector.js"></script>
<!-- JS Plugins Init. -->
<script>
$(window).on('load', function () {
// initialization of svg injector module
$.HSCore.components.HSSVGIngector.init('.js-svg-injector');
});
$(document).on('ready', function () {
// initialization of slick carousel
$.HSCore.components.HSSlickCarousel.init('.js-slick-carousel');
});
</script>
Testimonials #8
What Front users say about us.
The template is really nice and offers quite a large set of options. It's beautiful and the coding is done quickly and seamlessly. Thank you!
Maria Muszynska
The template is really nice and offers quite a large set of options. It's beautiful and the coding is done quickly and seamlessly. Thank you!
Massalha Shady
Apple
The template is really nice and offers quite a large set of options. It's beautiful and the coding is done quickly and seamlessly. Thank you!
Mark McManus
Microsoft
The template is really nice and offers quite a large set of options. It's beautiful and the coding is done quickly and seamlessly. Thank you!
Alex Pottorf
Github
<!-- Testimonials Section -->
<div id="SVGdoubleEllipseTopRight" class="svg-preloader position-relative bg-light">
<div class="container space-2 position-relative z-index-2">
<div class="row">
<div class="col-lg-4 mb-7 mb-lg-0">
<div class="pr-lg-4">
<!-- SVG Quote -->
<figure class="mb-3">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="80px" height="80px"
viewBox="0 0 8 8" style="enable-background:new 0 0 8 8;" xml:space="preserve">
<path class="fill-gray-300" d="M3,1.3C2,1.7,1.2,2.7,1.2,3.6c0,0.2,0,0.4,0.1,0.5c0.2-0.2,0.5-0.3,0.9-0.3c0.8,0,1.5,0.6,1.5,1.5c0,0.9-0.7,1.5-1.5,1.5
C1.4,6.9,1,6.6,0.7,6.1C0.4,5.6,0.3,4.9,0.3,4.5c0-1.6,0.8-2.9,2.5-3.7L3,1.3z M7.1,1.3c-1,0.4-1.8,1.4-1.8,2.3
c0,0.2,0,0.4,0.1,0.5c0.2-0.2,0.5-0.3,0.9-0.3c0.8,0,1.5,0.6,1.5,1.5c0,0.9-0.7,1.5-1.5,1.5c-0.7,0-1.1-0.3-1.4-0.8
C4.4,5.6,4.4,4.9,4.4,4.5c0-1.6,0.8-2.9,2.5-3.7L7.1,1.3z"/>
</svg>
</figure>
<!-- End SVG Quote -->
<h2 class="font-weight-normal mb-4">What Front users say about us.</h2>
<!-- Review -->
<div class="d-flex align-items-center">
<ul class="list-inline mr-3 mb-0">
<li class="list-inline-item text-warning">
<span class="fas fa-star"></span>
<span class="fas fa-star"></span>
<span class="fas fa-star"></span>
<span class="fas fa-star"></span>
<span class="fas fa-star"></span>
</li>
</ul>
<span class="text-secondary">Review</span>
</div>
<!-- End Review -->
</div>
</div>
<div class="col-lg-8">
<div class="js-slick-carousel u-slick u-slick--gutters-3"
data-slides-show="2"
data-autoplay="true"
data-speed="5000"
data-infinite="true"
data-center-mode="true"
data-responsive='[{
"breakpoint": 992,
"settings": {
"slidesToShow": 2
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 1
}
}]'>
<div class="js-slide my-4">
<!-- Testimonial -->
<div class="card border-0 shadow-sm mb-4">
<div class="card-body p-6">
<p>The template is really nice and offers quite a large set of options. It's beautiful and the coding is done quickly and seamlessly. Thank you!</p>
</div>
</div>
<div class="media ml-6">
<div class="u-avatar mr-3">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img1.jpg" alt="Image Description">
</div>
<div class="media-body">
<h4 class="h6 mb-0">Maria Muszynska</h4>
<p class="small">Google</p>
</div>
</div>
<!-- End Testimonial -->
</div>
<div class="js-slide my-4">
<!-- Testimonial -->
<div class="card border-0 shadow-sm mb-4">
<div class="card-body p-6">
<p>The template is really nice and offers quite a large set of options. It's beautiful and the coding is done quickly and seamlessly. Thank you!</p>
</div>
</div>
<div class="media ml-6">
<div class="u-avatar mr-3">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img2.jpg" alt="Image Description">
</div>
<div class="media-body">
<h4 class="h6 mb-0">Massalha Shady</h4>
<p class="small">Apple</p>
</div>
</div>
<!-- End Testimonial -->
</div>
<div class="js-slide my-4">
<!-- Testimonial -->
<div class="card border-0 shadow-sm mb-4">
<div class="card-body p-6">
<p>The template is really nice and offers quite a large set of options. It's beautiful and the coding is done quickly and seamlessly. Thank you!</p>
</div>
</div>
<div class="media ml-6">
<div class="u-avatar mr-3">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img3.jpg" alt="Image Description">
</div>
<div class="media-body">
<h4 class="h6 mb-0">Mark McManus</h4>
<p class="small">Microsoft</p>
</div>
</div>
<!-- End Testimonial -->
</div>
<div class="js-slide my-4">
<!-- Testimonial -->
<div class="card border-0 shadow-sm mb-4">
<div class="card-body p-6">
<p>The template is really nice and offers quite a large set of options. It's beautiful and the coding is done quickly and seamlessly. Thank you!</p>
</div>
</div>
<div class="media ml-6">
<div class="u-avatar mr-3">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img4.jpg" alt="Image Description">
</div>
<div class="media-body">
<h4 class="h6 mb-0">Alex Pottorf</h4>
<p class="small">Github</p>
</div>
</div>
<!-- End Testimonial -->
</div>
</div>
</div>
</div>
</div>
<!-- SVG Bottom Right Shapes -->
<div class="position-absolute top-0 right-0 w-75 w-md-60 w-lg-35">
<figure class="ie-double-ellipse-top-right">
<img class="js-svg-injector" src="../../assets/svg/components/double-ellipse-top-right.svg" alt="Image Description"
data-parent="#SVGdoubleEllipseTopRight">
</figure>
</div>
<!-- End SVG Bottom Right Shapes -->
</div>
<!-- End Testimonials Section -->
<link rel="stylesheet" href="../../assets/vendor/slick-carousel/slick/slick.css">
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/slick-carousel/slick/slick.js"></script>
<script src="../../assets/vendor/svg-injector/dist/svg-injector.min.js"></script>
<!-- JS Implementing Plugins -->
<script src="../../assets/js/components/hs.slick-carousel.js"></script>
<script src="../../assets/js/components/hs.svg-injector.js"></script>
<!-- JS Plugins Init. -->
<script>
$(window).on('load', function () {
// initialization of svg injector module
$.HSCore.components.HSSVGIngector.init('.js-svg-injector');
});
$(document).on('ready', function () {
// initialization of slick carousel
$.HSCore.components.HSSlickCarousel.init('.js-slick-carousel');
});
</script>
Testimonials #9
The template is really nice and offers quite a large set of options. It's beautiful and the coding is done quickly and seamlessly. Thank you!
Maria Muszynska
The theme is well designed with modern tools, we had no issue porting it to our own Webpack build.
Massalha Shady
I love Front! I love the ease of use, I love the fact that I have total creative freedom...
Mark McManus
<!-- Testimonials -->
<div class="bg-light">
<div class="container space-2">
<!-- Slick Carousel -->
<div class="js-slick-carousel u-slick u-slick--equal-height u-slick--gutters-3"
data-slides-show="3"
data-autoplay="true"
data-speed="5000"
data-infinite="true"
data-center-mode="true"
data-pagi-classes="d-lg-none text-center u-slick__pagination mt-7 mb-0"
data-responsive='[{
"breakpoint": 992,
"settings": {
"slidesToShow": 2
}
}, {
"breakpoint": 768,
"settings": {
"slidesToShow": 1
}
}]'>
<div class="js-slide card mb-1">
<!-- Testimonial -->
<div class="card-body p-5">
<div class="mb-auto">
<p class="mb-0">The template is really nice and offers quite a large set of options. It's beautiful and the coding is done quickly and seamlessly. Thank you!</p>
</div>
</div>
<div class="card-footer border-0 pt-0 px-5 pb-5">
<div class="media">
<div class="u-avatar mr-3">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img1.jpg" alt="Image Description">
</div>
<div class="media-body">
<h4 class="h6 mb-1">Maria Muszynska</h4>
<ul class="list-inline text-warning small mb-0">
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
</ul>
</div>
</div>
</div>
<!-- End Testimonial -->
</div>
<div class="js-slide card mb-1">
<!-- Testimonial -->
<div class="card-body p-5">
<div class="mb-auto">
<p class="mb-0">The theme is well designed with modern tools, we had no issue porting it to our own Webpack build.</p>
</div>
</div>
<div class="card-footer border-0 pt-0 px-5 pb-5">
<div class="media">
<div class="u-avatar mr-3">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img2.jpg" alt="Image Description">
</div>
<div class="media-body">
<h4 class="h6 mb-1">Massalha Shady</h4>
<ul class="list-inline text-warning small mb-0">
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
</ul>
</div>
</div>
</div>
<!-- End Testimonial -->
</div>
<div class="js-slide card mb-1">
<!-- Testimonial -->
<div class="card-body p-5">
<div class="mb-auto">
<p class="mb-0">I love Front! I love the ease of use, I love the fact that I have total creative freedom...</p>
</div>
</div>
<div class="card-footer border-0 pt-0 px-5 pb-5">
<div class="media">
<div class="u-avatar mr-3">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img3.jpg" alt="Image Description">
</div>
<div class="media-body">
<h4 class="h6 mb-1">Mark McManus</h4>
<ul class="list-inline text-warning small mb-0">
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
</ul>
</div>
</div>
</div>
<!-- End Testimonial -->
</div>
</div>
<!-- End Slick Carousel -->
</div>
</div>
<!-- End Testimonials -->
<link rel="stylesheet" href="../../assets/vendor/slick-carousel/slick/slick.css">
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/slick-carousel/slick/slick.js"></script>
<!-- JS Implementing Plugins -->
<script src="../../assets/js/components/hs.slick-carousel.js"></script>
<!-- JS Plugins Init. -->
<script>
$(document).on('ready', function () {
// initialization of slick carousel
$.HSCore.components.HSSlickCarousel.init('.js-slick-carousel');
});
</script>
Testimonials #10
Maria Muszynska, Google
The template is really nice and offers quite a large set of options. It's beautiful and the coding is done quickly and seamlessly. Thank you!
<!-- Testimonials -->
<div id="SVGirregularShape2Right" class="svg-preloader position-relative gradient-half-info-v1 z-index-2">
<div class="bg-img-hero-bottom" style="background-image: url(../../assets/img/bg-shapes/bg2.png);">
<div class="container space-top-2 space-top-md-3 space-bottom-4">
<!-- Testimonials -->
<div class="text-center">
<div class="mb-4">
<div class="u-avatar mx-auto mb-3">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img1.jpg" alt="Image Description">
</div>
<h4 class="h6 text-white">Maria Muszynska, Google</h4>
</div>
<div class="w-md-80 w-lg-50 text-center mx-md-auto mb-7">
<blockquote class="h3 text-white mb-0">The template is really nice and offers quite a large set of options. It's beautiful and the coding is done quickly and seamlessly. Thank you!</blockquote>
</div>
</div>
<!-- End Testimonials -->
</div>
<!-- SVG Quote -->
<figure class="w-25 position-absolute top-0 right-0 left-0 ml-11">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 8 8" style="enable-background:new 0 0 8 8;" xml:space="preserve">
<path class="fill-white" opacity=".1" d="M3,1.3C2,1.7,1.2,2.7,1.2,3.6c0,0.2,0,0.4,0.1,0.5c0.2-0.2,0.5-0.3,0.9-0.3c0.8,0,1.5,0.6,1.5,1.5c0,0.9-0.7,1.5-1.5,1.5
C1.4,6.9,1,6.6,0.7,6.1C0.4,5.6,0.3,4.9,0.3,4.5c0-1.6,0.8-2.9,2.5-3.7L3,1.3z M7.1,1.3c-1,0.4-1.8,1.4-1.8,2.3
c0,0.2,0,0.4,0.1,0.5c0.2-0.2,0.5-0.3,0.9-0.3c0.8,0,1.5,0.6,1.5,1.5c0,0.9-0.7,1.5-1.5,1.5c-0.7,0-1.1-0.3-1.4-0.8
C4.4,5.6,4.4,4.9,4.4,4.5c0-1.6,0.8-2.9,2.5-3.7L7.1,1.3z"/>
</svg>
</figure>
<!-- End SVG Quote -->
<!-- SVG Shape -->
<div class="position-absolute top-0 right-0 left-0 z-index-n1">
<figure class="ie-irregular-shape-2-right">
<img class="js-svg-injector" src="../../assets/svg/components/irregular-shape-2-right.svg" alt="Image Description"
data-parent="#SVGirregularShape2Right">
</figure>
</div>
<!-- End SVG Shape -->
</div>
</div>
<!-- End Testimonials -->
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/svg-injector/dist/svg-injector.min.js"></script>
<!-- JS Front -->
<script src="../../assets/js/components/hs.svg-injector.js"></script>
<!-- JS Plugins Init. -->
<script>
$(window).on('load', function () {
// initialization of svg injector module
$.HSCore.components.HSSVGIngector.init('.js-svg-injector');
});
</script>
Testimonials #11
I love to have extra money. If I have time I invest by myself, but sometimes you want to have time for your family or friends, especially when you are on holidays. It's sooo great to come back rested, tanned etc and with extra money at your accounts. Good work, guys!
Samantha Wilson
— Durbanville, South Africa
<!-- Testimonials -->
<div class="gradient-half-primary-v1">
<div class="container space-2">
<!-- Avatar -->
<div class="media d-block d-md-flex">
<div class="u-lg-avatar mr-md-7 mb-7 mb-md-0">
<img class="img-fluid rounded-circle" src="../../assets/img/160x160/img2.jpg" alt="Image Description">
</div>
<div class="media-body">
<!-- SVG Quote -->
<figure class="mb-3">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="40px" height="40px"
viewBox="0 0 8 8" style="enable-background:new 0 0 8 8;" xml:space="preserve">
<path class="fill-warning" d="M3,1.3C2,1.7,1.2,2.7,1.2,3.6c0,0.2,0,0.4,0.1,0.5c0.2-0.2,0.5-0.3,0.9-0.3c0.8,0,1.5,0.6,1.5,1.5c0,0.9-0.7,1.5-1.5,1.5
C1.4,6.9,1,6.6,0.7,6.1C0.4,5.6,0.3,4.9,0.3,4.5c0-1.6,0.8-2.9,2.5-3.7L3,1.3z M7.1,1.3c-1,0.4-1.8,1.4-1.8,2.3
c0,0.2,0,0.4,0.1,0.5c0.2-0.2,0.5-0.3,0.9-0.3c0.8,0,1.5,0.6,1.5,1.5c0,0.9-0.7,1.5-1.5,1.5c-0.7,0-1.1-0.3-1.4-0.8
C4.4,5.6,4.4,4.9,4.4,4.5c0-1.6,0.8-2.9,2.5-3.7L7.1,1.3z"/>
</svg>
</figure>
<!-- End SVG Quote -->
<blockquote class="lead text-white mb-4">I love to have extra money. If I have time I invest by myself, but sometimes you want to have time for your family or friends, especially when you are on holidays. It's sooo great to come back rested, tanned etc and with extra money at your accounts. Good work, guys!</blockquote>
<h4 class="h5 text-white">Samantha Wilson</h4>
<span class="d-block text-warning pl-3">— Durbanville, South Africa</span>
</div>
</div>
<!-- End Avatar -->
</div>
</div>
<!-- End Testimonials -->
Testimonials #12
The template is really nice and offers quite a large set of options. It's beautiful and the coding is done quickly and seamlessly. Thank you!
Maria Muszynska
Head of IT department at Google
<!-- Testimonials Section -->
<div class="container space-2">
<!-- SVG Quote -->
<figure class="mx-auto text-center mb-3">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="48px" height="48px"
viewBox="0 0 8 8" style="enable-background:new 0 0 8 8;" xml:space="preserve">
<path class="fill-gray-400" d="M3,1.3C2,1.7,1.2,2.7,1.2,3.6c0,0.2,0,0.4,0.1,0.5c0.2-0.2,0.5-0.3,0.9-0.3c0.8,0,1.5,0.6,1.5,1.5c0,0.9-0.7,1.5-1.5,1.5
C1.4,6.9,1,6.6,0.7,6.1C0.4,5.6,0.3,4.9,0.3,4.5c0-1.6,0.8-2.9,2.5-3.7L3,1.3z M7.1,1.3c-1,0.4-1.8,1.4-1.8,2.3
c0,0.2,0,0.4,0.1,0.5c0.2-0.2,0.5-0.3,0.9-0.3c0.8,0,1.5,0.6,1.5,1.5c0,0.9-0.7,1.5-1.5,1.5c-0.7,0-1.1-0.3-1.4-0.8
C4.4,5.6,4.4,4.9,4.4,4.5c0-1.6,0.8-2.9,2.5-3.7L7.1,1.3z"/>
</svg>
</figure>
<!-- End SVG Quote -->
<!-- Blockquote -->
<div class="w-md-80 w-lg-50 text-center mx-md-auto mb-6">
<blockquote class="lead text-secondary font-weight-normal">The template is really nice and offers quite a large set of options. It's beautiful and the coding is done quickly and seamlessly. Thank you!</blockquote>
</div>
<!-- End Blockquote -->
<!-- Reviewer -->
<div class="d-flex justify-content-center align-items-center w-lg-50 mx-auto">
<div class="u-avatar">
<img class="img-fluid rounded-circle" src="../../assets/img/160x160/img17.png" alt="Image Description">
</div>
<div class="ml-3">
<h4 class="h6 mb-0">Maria Muszynska</h4>
<small class="text-muted">Head of IT department at Google</small>
</div>
</div>
<!-- End Reviewer -->
</div>
<!-- End Testimonials Section -->
Testimonials #13
With Front Pay, you can check out across the web and in apps without having to enter any payment information.
Maria Muszynska
Business ManagerFrom boarding passes to transit and movie tickets, there's pretty much nothing you can't store with Front Pay.
Massalha Shady
CEO at SlackI love Front Pay for cash back, reward points and fraud protection – just like when you're swiping your card.
Mark McManus
Front Pay user
<!-- Testimonials Section -->
<div class="container space-2">
<div class="card-deck d-block d-lg-flex card-lg-gutters-2">
<!-- Testimonials -->
<div class="card bg-transparent border-0">
<div class="card-body p-5">
<ul class="list-inline text-warning small">
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
</ul>
<div class="mb-auto">
<p class="mb-0">With Front Pay, you can check out across the web and in apps without having to enter any payment information.</p>
</div>
</div>
<div class="card-footer border-0 bg-transparent pt-0 px-5 pb-5">
<div class="media">
<div class="u-avatar mr-3">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img2.jpg" alt="Image Description">
</div>
<div class="media-body">
<h4 class="h6 mb-1">Maria Muszynska</h4>
<small class="d-block text-secondary">Business Manager</small>
</div>
</div>
</div>
</div>
<!-- End Testimonials -->
<!-- Testimonials -->
<div class="card border-0 bg-primary text-white shadow-primary-lg">
<div class="card-body p-5">
<ul class="list-inline text-warning small">
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
</ul>
<div class="mb-auto">
<p class="text-white mb-0">From boarding passes to transit and movie tickets, there's pretty much nothing you can't store with Front Pay.</p>
</div>
</div>
<div class="card-footer border-0 bg-primary text-white pt-0 px-5 pb-5">
<div class="media">
<div class="u-avatar mr-3">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img11.jpg" alt="Image Description">
</div>
<div class="media-body">
<h4 class="h6 mb-1">Massalha Shady</h4>
<small class="d-block text-light">CEO at Slack</small>
</div>
</div>
</div>
</div>
<!-- End Testimonials -->
<!-- Testimonials -->
<div class="card bg-transparent border-0">
<div class="card-body p-5">
<ul class="list-inline text-warning small">
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
<li class="list-inline-item mx-0">
<span class="fas fa-star"></span>
</li>
</ul>
<div class="mb-auto">
<p class="mb-0">I love Front Pay for cash back, reward points and fraud protection – just like when you're swiping your card.</p>
</div>
</div>
<div class="card-footer border-0 bg-transparent pt-0 px-5 pb-5">
<div class="media">
<div class="u-avatar mr-3">
<img class="img-fluid rounded-circle" src="../../assets/img/100x100/img4.jpg" alt="Image Description">
</div>
<div class="media-body">
<h4 class="h6 mb-1">Mark McManus</h4>
<small class="d-block text-secondary">Front Pay user</small>
</div>
</div>
</div>
</div>
<!-- End Testimonials -->
</div>
</div>
<!-- End Testimonials Section -->
<!-- JS Implementing Plugins -->
<script src="../../assets/vendor/svg-injector/dist/svg-injector.min.js"></script>
<!-- JS Front -->
<script src="../../assets/js/components/hs.svg-injector.js"></script>
<!-- JS Plugins Init. -->
<script>
$(window).on('load', function () {
// initialization of svg injector module
$.HSCore.components.HSSVGIngector.init('.js-svg-injector');
});
</script>