51 lines
2.4 KiB
JavaScript
51 lines
2.4 KiB
JavaScript
import ProgressCircle from "@/components/common/CircularProgress";
|
|
import React from "react";
|
|
|
|
export default function Facts8() {
|
|
return (
|
|
<section id="snippet-7" className="wrapper !bg-[#ffffff]">
|
|
<div className="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20">
|
|
<div className="flex flex-wrap mx-[-15px] items-center !mt-[-40px]">
|
|
<div className="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full text-center lg:text-left xl:text-left !mt-[40px]">
|
|
<h2 className="!text-[0.8rem] !tracking-[0.02rem] uppercase !text-[#aab0bc] !mb-3 !leading-[1.35]">
|
|
Save Time and Money
|
|
</h2>
|
|
<h3 className="!text-[calc(1.325rem_+_0.9vw)] font-bold !leading-[1.25] xl:!text-[2rem] !mb-0 xl:!pr-10 xxl:!pr-20">
|
|
Save your time and money by choosing our
|
|
<span className="!relative z-[2] after:content-[''] after:absolute after:z-[-1] after:block after:bg-no-repeat after:bg-bottom after:bottom-[-0.1em] after:w-[110%] after:h-[0.3em] after:-translate-x-2/4 after:left-2/4 style-2 yellow">
|
|
professional
|
|
</span>
|
|
team.
|
|
</h3>
|
|
</div>
|
|
{/* /column */}
|
|
<div className="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[40px]">
|
|
<div className="flex flex-wrap mx-[-15px] !mt-[-30px] !text-center">
|
|
<div className="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
|
<div className="progressbar semi-circle fuchsia relative w-[8.5rem] h-[4.25rem] m-[0_auto_1rem]">
|
|
<ProgressCircle max={95} />
|
|
</div>
|
|
<h4 className="!mb-0">Customer Satisfaction</h4>
|
|
</div>
|
|
{/* /column */}
|
|
<div className="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
|
|
<div className="progressbar semi-circle orange relative w-[8.5rem] h-[4.25rem] m-[0_auto_1rem]">
|
|
<ProgressCircle max={80} />
|
|
</div>
|
|
<h4 className="!mb-0">Increased Revenue</h4>
|
|
</div>
|
|
{/* /column */}
|
|
</div>
|
|
{/* /.row */}
|
|
</div>
|
|
{/* /column */}
|
|
</div>
|
|
{/* /.row */}
|
|
</div>
|
|
{/* /.container */}
|
|
|
|
{/* /.container */}
|
|
</section>
|
|
);
|
|
}
|