File: /var/www/html/ccc/v5.2/assets/testimonial-section.php
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css"
integrity="sha384-B4dIYHKNBt8Bc12p+WXckhzcICo0wtJAoU8YZTY5qE0Id1GSseTk6S+L3BlXeVIU" crossorigin="anonymous">
<style>
.owl-dots {
display: flex !important;
justify-content: center !important;
}
.box-area {
border-radius: 3%;
position: relative;
display: block;
background: #fff;
color: #000;
margin: 40px 0;
}
.box-area p {
font-size: 22px;
font-weight: 500;
line-height: 1.75em;
}
.testi-image {
height: 100px !important;
width: 100px !important;
border-radius: 50% !important;
align-items: center !important;
margin-left: 40% !important;
}
.box-area h5 {
font-size: 16px;
font-weight: 700;
color: #0a69ed;
margin-top: 30px;
margin-bottom: 5px;
text-transform: uppercase;
letter-spacing: 1px;
}
.box-area span {
color: #262626;
display: block;
font-size: 13px;
margin: 0 0 10px;
font-weight: 400;
}
.box-area .content {
color: #262626;
font-size: 18px;
font-weight: 500;
line-height: 1.75em;
padding-top: 10%;
padding-bottom: 10%;
}
.box-area .img-area {
width: 90px;
height: 90px;
position: absolute;
top: -40px;
left: 0;
bottom: 0;
margin: 0 auto;
right: 0;
z-index: 1;
border: 3px solid #fff;
border-radius: 50%;
}
.box-span {
padding-bottom: 10%;
}
.box-area .img-area img {
width: 100%;
height: auto;
border-radius: 50%;
}
.socials {
margin-top: 30px;
}
.socials i {
margin: 0 10px;
color: #0a69ed;
font-size: 18px;
}
#testimonial_area .owl-nav {
position: absolute;
top: 50%;
width: 100%;
}
#testimonial_area .owl-prev,
#testimonial_area .owl-next {
width: 40px;
height: 40px;
line-height: 40px;
color: #0a69ed;
border-radius: 50%;
text-align: center;
background: #fff;
position: absolute;
}
#testimonial_area .owl-prev {
left: -60px;
top: -30px;
}
#testimonial_area .owl-next {
right: -60px;
top: -30px;
}
@media only screen and (max-width: 991px) {
.owl-nav {
display: none;
}
}
@media only screen and (max-width: 767px) {
.box-area {
text-align: center;
}
.owl-nav {
display: none;
}
}
</style>
<section style="padding-top:5% !important;"
class="elementor-section elementor-top-section elementor-element elementor-element-1521f1c9 elementor-section-boxed elementor-section-height-default elementor-section-height-default"
data-id="1521f1c9" data-element_type="section"
data-settings="{"background_background":"classic","shape_divider_top":"curve-asymmetrical","shape_divider_top_negative":"yes","shape_divider_bottom":"curve-asymmetrical","shape_divider_bottom_negative":"yes"}">
<div class="elementor-shape elementor-shape-top" data-negative="true">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 100" preserveAspectRatio="none">
<path class="elementor-shape-fill"
d="M615.2,96.7C240.2,97.8,0,18.9,0,0v100h1000V0C1000,19.2,989.8,96,615.2,96.7z" />
</svg>
</div>
<div class="elementor-shape elementor-shape-bottom" data-negative="true">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 100" preserveAspectRatio="none">
<path class="elementor-shape-fill"
d="M615.2,96.7C240.2,97.8,0,18.9,0,0v100h1000V0C1000,19.2,989.8,96,615.2,96.7z" />
</svg>
</div>
<div class="elementor-container elementor-column-gap-default" style="width:1170px !important;">
<div class="elementor-row">
<div class="elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-459f5cf"
data-id="459f5cf" data-element_type="column">
<div class="elementor-column-wrap elementor-element-populated">
<div class="elementor-widget-wrap">
<!-- <div class="elementor-element elementor-element-580e0dc3 elementor-widget elementor-widget-spacer"
data-id="580e0dc3" data-element_type="widget" data-widget_type="spacer.default">
<div class="elementor-widget-container">
<div class="elementor-spacer">
<div class="elementor-spacer-inner"></div>
</div>
</div>
</div> -->
<div class="elementor-element elementor-element-44bf184 elementor-invisible elementor-widget elementor-widget-heading"
data-id="44bf184" data-element_type="widget"
data-settings="{"_animation":"fadeInDown"}"
data-widget_type="heading.default">
<div class="elementor-widget-container">
<h6 class="elementor-heading-title elementor-size-default" style="font-size: 22px !important;
color: #008fd2 !important; font-weight:normal !important;
line-height: 1.2em;">
Testimonials</h6>
</div>
</div>
<div class="elementor-element elementor-element-1a4fb537 elementor-view-default elementor-position-top elementor-invisible elementor-widget elementor-widget-themo-header"
data-id="1a4fb537" data-element_type="widget"
data-settings="{"_animation":"fadeIn"}"
data-widget_type="themo-header.default">
<div class="elementor-widget-container">
<div class="th-header-wrap">
<div class="elementor-icon-box-wrapper ">
<div class="elementor-icon-box-content">
<h2 class="elementor-icon-box-title" style="color:#242763 !important; font-weight: bold !important;
line-height: 1.2em !important;">
“What Clients are saying” </h2>
<p class="elementor-icon-box-description"
style="font-size: 16px !important; line-height: 30px; font-weight:400; color: #5c666a;">
Partnering with customers to deliver the right Salesforce solutions. Our
experience and expertise help you get the most out of your Salesforce
implementation and extend its functionality.</p>
</div>
</div>
</div>
</div>
</div>
<section id="testimonial_area" class="section_padding">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="testmonial_slider_area text-center owl-carousel">
<div class="box-area" style="border-radius: 4%;">
<p class="content" style=" font-size: 18px;
font-weight: 500; paddin-left:10% !important; padding: right 10% !important;
line-height: 1.75em;">
I have worked with CloudCentric Infotech <br>for nearly 5 years and I have appreciated <br> the technical expertise they have brought <br> to my projects. Their knowledge in the <br>area of Salesforce has streamlined our <br>processes and fine-tuned our workflows to <br>improve communication.
</p>
<img style="height: 100px;
width: 100px;
border-radius: 50%;
align-items: center;
margin-left: 40%;" src="images/chad-stabler-75x75.jpg" alt="chad-stabler">
<h5>Chad Stabler
</h5>
<span class="box-span">Tempa Day
</span>
</div>
<div class="box-area" style="border-radius: 4%;">
<p class="content">
As a business with complex IT requirements, <br>we find CCCINFOTECH helpful and on-call <br>24X7. They have often fixed problems late<br> at night as we cannot close our systems until<br> late because of our home workers. Offering <br>great value and advice with many <br>money-saving applications.
</p>
<img style="height: 100px;
width: 100px;
border-radius: 50%;
align-items: center;
margin-left: 40%;" src="images/Harry-75x75.jpg" alt="Harry">
<h5>Harry Casimir
</h5>
<span class="box-span">Co - Founder & CTO, Atilus, LLC
</span>
</div>
<div class="box-area" style="border-radius: 4%;">
<p class="content" style=" font-size: 18px;
font-weight: 500;
line-height: 1.75em;">
Excellent service – CLOUDCENTRIC INFOTECH <br>has provided quality work for my business.<br> CLOUDCENTRIC INFOTECH work has always<br> been professional and completed on schedule. <br>I would be delighted to recommend her <br>services to anyone seeking quality <br> work.
</p>
<img style="height: 100px;
width: 100px;
border-radius: 50%;
align-items: center;
margin-left: 40%;" src="images/katie-connatser-75x75.jpg" alt="katie-connatser">
<h5>Katie Connatser
</h5>
<span class="box-span">Creative Director at Henry & Wallace, LLC
</span>
</div>
<div class="box-area" style="border-radius: 4%;">
<p class="content" style=" font-size: 18px;
font-weight: 500;
line-height: 1.75em;">
As a business with complex IT requirements, <br>we find CLOUDCENTRIC INFOTECH helpful and <br>on-call 24X7. They have often fixed problems <br>late at night as we cannot close our systems <br>until late because of our home workers. <br>Offering great value and advice with many<br> money-saving applications.
</p>
<img style="height: 100px;
width: 100px;
border-radius: 50%;
align-items: center;
margin-left: 40%;" src="images/David-Glettner-75x75.jpg" alt="David-Glettner">
<h5>David Glettner</h5>
<span class="box-span">Designation Goes
Here</span>
</div>
<div class="box-area" style="border-radius: 4%;">
<p class="content" style=" font-size: 18px;
font-weight: 500;
line-height: 1.75em;">
Excellent Service – CLOUDCENTRIC INFOTECH <br>has provided quality work for my business. Their <br> work has always been professional and completed<br> on schedule. I would be delighted to recommend <br>her services to anyone seeking quality <br>work I would be delighted to recommend<br>I would be delighted to recommend.
</p>
<img style="height: 100px;
width: 100px;
border-radius: 50%;
align-items: center;
margin-left: 40%;" src="images/Michael-Glassmaker-75x75.jpg" alt="Michael-Glassmaker">
<h5>Michael Glassmaker
</h5>
<span class="box-span">Designation Goes
Here</span>
</div>
<div class="box-area" style="border-radius: 4%;">
<p class="content" style=" font-size: 18px;
font-weight: 500;
line-height: 1.75em;">
CloudCentric has offered a first-class service,<br> which is a fast, efficient and great <br>value. Nothing is too much trouble and I will<br> continue to not only use them but<br> recommend them too continue to not only<br> use them but continue to not only use them but<br> continue to not only use them but.
</p>
<img style="height: 100px;
width: 100px;
border-radius: 50%;
align-items: center;
margin-left: 40%;" src="images/Laura-Knight-75x75.jpg" alt="Laura-Knight">
<h5>Laura Knight</h5>
<span class="box-span">Designation Goes
Here</span>
</div>
<div class="box-area" style="border-radius: 4%;">
<p class="content" style=" font-size: 18px;
font-weight: 500;
line-height: 1.75em;">
i have an amazing experience working with <br>them.
they are expert in SFDC developement.<br>
I'd prefer to recommend them to anyone. i<br> have an amazing experience working with them.<br>
they are expert in SFDC developement.<br>
I'd prefer to recommend them to anyone.<br>I'd prefer to recommend them to anyone.
</p>
<img style="height: 100px;
width: 100px;
border-radius: 50%;
align-items: center;
margin-left: 40%;" src="images/images.jpeg" alt="Tanmoy-Das">
<h5>Tanmoy Das</h5>
<span class="box-span">Designation Goes
Here</span>
</div>
<!-- END SINGLE TESTIMONIALS -->
</div>
</div>
</div>
</div>
</section>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.2.1/owl.carousel.min.js">
</script>
<script>
$(".testmonial_slider_area").owlCarousel({
autoplay: true,
slideSpeed: 10000,
loop: true,
nav: true,
navText: ['<i class="fa fa-arrow-left"></i>', '<i class="fa fa-arrow-right"></i>'],
margin: 60,
dots: true,
responsive: {
380: {
items: 1
},
797: {
items: 2
}
}
});
</script>
<div class="elementor-element elementor-element-47497d57 elementor-widget elementor-widget-spacer"
data-id="47497d57" data-element_type="widget" data-widget_type="spacer.default">
<div class="elementor-widget-container">
<div class="elementor-spacer">
<div class="elementor-spacer-inner"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script> -->
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.min.js"></script>
<script src="js/owl.carousel.min.js"></script>