<!--
AVAILABLE COLORS:
.cart-visual-default
.cart-visual-success
.cart-visual-danger
.cart-visual-warning
.cart-visual-info
-->
<section>
<div class="cart-visual cart-visual-default">
<svg id="cart-visual-svg-1" height="0" width="100%" preserveAspectRatio="none" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 1096 131.25" style="height: 140px;" xml:space="preserve">
<path d="M782,49.418c-58.667-24.667-118.602-46-249.334-46s-159.43,36.157-209.333,62.207C259.04,99.186,0,131.25,0,131.25h1096C1096,131.25,840.667,74.085,782,49.418z"></path>
</svg>
<svg id="cart-visual-svg-2" height="0" width="100%" preserveAspectRatio="none" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 1133.338 144.499" style="height: 195px;" xml:space="preserve">
<path d="M948.868,144.499H0V72.249c26.67-9.407,66.707-19.582,119.535-19.582c133.999,0,227.999,39.333,332.665,39.333c80,0,142.667-36.666,174.667-52.666S716.201,0,804.201,0s144.667,20,144.667,20c44.173,10.997,122.713,47.543,184.47,78.215v46.284H948.868z"></path>
</svg>
<div class="container">
<div class="row">
<div class="col-6 col-md-3 mt--30 pb-150">
<div class="cart-visual-pin"><div class="cart-visual-pin-ball"> </div></div>
<div class="pl-20 pr-20">
<h2><i class="countTo" data-speed="1600">6000</i>+</h2>
<p class="fw--300">Happy Returning Customers</p>
<a href="#" class="marker-more">More +</a>
</div>
</div>
<div class="col-6 col-md-3 mt-80">
<div class="cart-visual-pin"><div class="cart-visual-pin-ball"> </div></div>
<div class="pl-20 pr-20">
<h2><i class="countTo" data-speed="1300">100</i>%</h2>
<p class="fw--300">Money back gurantee</p>
<a href="#" class="marker-more">More +</a>
</div>
</div>
<div class="col-6 col-md-3 mt-60">
<div class="cart-visual-pin"><div class="cart-visual-pin-ball"> </div></div>
<div class="pl-20 pr-20">
<h2><i class="countTo" data-speed="900">235</i>%</h2>
<p class="fw--300">Average customer growth</p>
<a href="#" class="marker-more">More +</a>
</div>
</div>
<div class="col-6 col-md-3 mt-0">
<div class="cart-visual-pin"><div class="cart-visual-pin-ball"> </div></div>
<div class="pl-20 pr-20">
<h2><i class="countTo" data-speed="2000">250000</i></h2>
<p class="fw--300">Work hours saved last 12 months</p>
<a href="#" class="marker-more">More +</a>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="section-video section-xlg">
<div class="overlay dark-6"><!-- dark overlay [1 to 9 opacity] --></div>
<div class="section-container-video">
<video poster="demo_files/images/video/back.jpg" preload="auto" loop autoplay muted>
<source src='demo_files/images/video/back.webm' type='video/webm' />
<source src='demo_files/images/video/back.mp4' type='video/mp4' />
</video>
</div>
<div class="container">
<div class="text-center">
<h3 class="m-0">HTML5 VIDEO SECTION</h3>
<p class="font-lato fw-300 lead mt-0">We can't solve problems by using the same kind of thinking we used when we created them.</p>
</div>
<div class="text-center mt-100">
<!-- Counter -->
<div class="piechart" data-color="#ffffff" data-trackcolor="rgba(255,255,255,0.2)" data-size="150" data-percent="87" data-width="2" data-animate="1700">
<span class="fs-30">
<span class="countTo" data-speed="2000">87</span>
%</span>
</div>
<!-- Counter -->
<div class="piechart" data-color="#ffffff" data-trackcolor="rgba(255,255,255,0.2)" data-size="150" data-percent="66" data-width="2" data-animate="1700">
<span class="fs-30">
<span class="countTo" data-speed="2000">66</span>
%</span>
</div>
<!-- Counter -->
<div class="piechart" data-color="#ffffff" data-trackcolor="rgba(255,255,255,0.2)" data-size="150" data-percent="97" data-width="2" data-animate="1700">
<span class="fs-30">
<span class="countTo" data-speed="2000">97</span>
%</span>
</div>
<!-- Counter -->
<div class="piechart" data-color="#ffffff" data-trackcolor="rgba(255,255,255,0.2)" data-size="150" data-percent="76" data-width="2" data-animate="1700">
<span class="fs-30">
<span class="countTo" data-speed="2000">76</span>
%</span>
</div>
</div>
</div>
</section>