made a data js

huncholaneauthored 2 years ago

parent 95eb448commit e0db4734024f969bf09a00a646399248f1d224bbBrowse files

6 files changed, +966 -602

+40-0components/data/teamData.js

		@@ -0,0 +1,40 @@
	1	+export default siteData = {
	2	+ team: [
	3	+ {
	4	+ img: "/assets/img/team/h2_team_img01.jpg",
	5	+ linkedIn: "#",
	6	+ twitter: "#",
	7	+ facebook: "#",
	8	+ instagram: "#",
	9	+ name: "Shaun Lake",
	10	+ position: "Founder",
	11	+ },
	12	+ {
	13	+ img: "/assets/img/team/h2_team_img02.jpg",
	14	+ linkedIn: "#",
	15	+ twitter: "#",
	16	+ facebook: "#",
	17	+ instagram: "#",
	18	+ name: "Zack Stevens",
	19	+ position: "Co-Founder",
	20	+ },
	21	+ {
	22	+ img: "/assets/img/team/h2_team_img03.jpg",
	23	+ linkedIn: "#",
	24	+ twitter: "#",
	25	+ facebook: "#",
	26	+ instagram: "#",
	27	+ name: "Software Developer",
	28	+ position: "CEO",
	29	+ },
	30	+ {
	31	+ img: "/assets/img/team/h2_team_img04.jpg",
	32	+ linkedIn: "#",
	33	+ twitter: "#",
	34	+ facebook: "#",
	35	+ instagram: "#",
	36	+ name: "Xander Andre",
	37	+ position: "Marketing Manager",
	38	+ },
	39	+ ],
	40	+};

+84-51components/sections/About1.js

		@@ -1,56 +1,89 @@
1		-import Link from "next/link"
	1	+import Link from "next/link";
2	2
3	3	export default function About1() {
4		- return (
5		- <>
6		- <section className="about-area pb-120">
7		- <div className="container">
8		- <div className="row align-items-center">
9		- <div className="col-xl-7 col-lg-6 order-0 order-lg-2">
10		- <div className="about-img-wrap">
11		- <img src="/assets/img/images/about_img01.jpg" alt="" className="wow fadeInRight" data-wow-delay=".4s" />
12		- <img src="/assets/img/images/about_img02.jpg" alt="" className="wow fadeInRight" data-wow-delay=".2s" />
13		- <div className="about-experiences-wrap">
14		- <div className="experiences-item">
15		- <div className="icon">
16		- <img src="/assets/img/icon/about_icon01.svg" alt="" />
17		- </div>
18		- <div className="content">
19		- <h6 className="title">We have more than 10 years of experiences</h6>
20		- </div>
21		- </div>
22		- <div className="experiences-item">
23		- <div className="icon">
24		- <img src="/assets/img/icon/about_icon02.svg" alt="" />
25		- </div>
26		- <div className="content">
27		- <h6 className="title">We use professional and experienced person</h6>
28		- </div>
29		- </div>
30		- </div>
31		- </div>
32		- </div>
33		- <div className="col-xl-5 col-lg-6">
34		- <div className="about-content">
35		- <div className="section-title mb-25 tg-heading-subheading animation-style3">
36		- <span className="sub-title tg-element-title">About Our Company</span>
37		- <h2 className="title tg-element-title">We’re Committed to Roofing Excellence</h2>
38		- </div>
39		- <p>There are many variations of passages of Lorem Ipsum available, but the majori have suffered alteration in some form, by injected humour, or randomised word which don't look even slightly believable.</p>
40		- <div className="about-list">
41		- <ul className="list-wrap">
42		- <li><i className="fas fa-check" />32k Partners have worked us.</li>
43		- <li><i className="fas fa-check" />Professional and experienced human resources.</li>
44		- <li><i className="fas fa-check" />Provide the best roof services</li>
45		- </ul>
46		- </div>
47		- <Link href="/about" className="btn">Learn More</Link>
48		- </div>
49		- </div>
	4	+ return (
	5	+ <>
	6	+ <section className="about-area pb-120">
	7	+ <div className="container">
	8	+ <div className="row align-items-center">
	9	+ <div className="col-xl-7 col-lg-6 order-0 order-lg-2">
	10	+ <div className="about-img-wrap">
	11	+ <img
	12	+ src="/assets/img/images/about_img01.jpg"
	13	+ alt=""
	14	+ className="wow fadeInRight"
	15	+ data-wow-delay=".4s"
	16	+ />
	17	+ <img
	18	+ src="/assets/img/images/about_img02.jpg"
	19	+ alt=""
	20	+ className="wow fadeInRight"
	21	+ data-wow-delay=".2s"
	22	+ />
	23	+ <div className="about-experiences-wrap">
	24	+ <div className="experiences-item">
	25	+ <div className="icon">
	26	+ <img src="/assets/img/icon/about_icon01.svg" alt="" />
50	27	</div>
	28	+ <div className="content">
	29	+ <h6 className="title">
	30	+ We have more than 30 years of experiences
	31	+ </h6>
	32	+ </div>
	33	+ </div>
	34	+ <div className="experiences-item">
	35	+ <div className="icon">
	36	+ <img src="/assets/img/icon/about_icon02.svg" alt="" />
	37	+ </div>
	38	+ <div className="content">
	39	+ <h6 className="title">
	40	+ We use professional and experienced person
	41	+ </h6>
	42	+ </div>
	43	+ </div>
51	44	</div>
52		- </section>
53		-
54		- </>
55		- )
	45	+ </div>
	46	+ </div>
	47	+ <div className="col-xl-5 col-lg-6">
	48	+ <div className="about-content">
	49	+ <div className="section-title mb-25 tg-heading-subheading animation-style3">
	50	+ <span className="sub-title tg-element-title">
	51	+ About Our Company
	52	+ </span>
	53	+ <h2 className="title tg-element-title">
	54	+ We’re Committed to Roofing Excellence
	55	+ </h2>
	56	+ </div>
	57	+ <p>
	58	+ There are many variations of passages of Lorem Ipsum
	59	+ available, but the majori have suffered alteration in some
	60	+ form, by injected humour, or randomised word which don't look
	61	+ even slightly believable.
	62	+ </p>
	63	+ <div className="about-list">
	64	+ <ul className="list-wrap">
	65	+ <li>
	66	+ <i className="fas fa-check" />
	67	+ 32k Partners have worked us.
	68	+ </li>
	69	+ <li>
	70	+ <i className="fas fa-check" />
	71	+ Professional and experienced human resources.
	72	+ </li>
	73	+ <li>
	74	+ <i className="fas fa-check" />
	75	+ Provide the best roof services
	76	+ </li>
	77	+ </ul>
	78	+ </div>
	79	+ <Link href="/about" className="btn">
	80	+ Learn More
	81	+ </Link>
	82	+ </div>
	83	+ </div>
	84	+ </div>
	85	+ </div>
	86	+ </section>
	87	+ </>
	88	+ );
56	89	}

+74-75components/sections/Counter1.js

		@@ -1,82 +1,81 @@
1		-import { useEffect, useState } from 'react'
2		-import CountUp from "../elements/CountUp"
	1	+import { useEffect, useState } from "react";
	2	+import CountUp from "../elements/CountUp";
3	3	export default function Counter1() {
4		- const [inViewport, setInViewport] = useState(false)
	4	+ const [inViewport, setInViewport] = useState(false);
5	5
6		- const handleScroll = () => {
7		- const elements = document.getElementsByClassName('count')
8		- if (elements.length > 0) {
9		- const element = elements[0]
10		- const rect = element.getBoundingClientRect()
11		- const isInViewport = rect.top >= 0 && rect.bottom <= window.innerHeight
12		- if (isInViewport && !inViewport) {
13		- setInViewport(true)
14		- }
15		- }
	6	+ const handleScroll = () => {
	7	+ const elements = document.getElementsByClassName("count");
	8	+ if (elements.length > 0) {
	9	+ const element = elements[0];
	10	+ const rect = element.getBoundingClientRect();
	11	+ const isInViewport = rect.top >= 0 && rect.bottom <= window.innerHeight;
	12	+ if (isInViewport && !inViewport) {
	13	+ setInViewport(true);
	14	+ }
16	15	}
	16	+ };
17	17
18		- useEffect(() => {
19		- window.addEventListener('scroll', handleScroll)
20		- return () => {
21		- window.removeEventListener('scroll', handleScroll)
22		- }
23		- }, [])
24		- return (
25		- <>
26		- <div className="counter-area pb-120">
27		- <div className="container">
28		- <div className="counter-inner wow fadeInUp" data-wow-delay=".2s">
29		- <div className="row">
30		- <div className="col-lg-3 col-sm-6">
31		- <div className="counter-item">
32		- <div className="counter-icon">
33		- <img src="/assets/img/icon/counter_icon01.svg" alt="" />
34		- </div>
35		- <div className="counter-content">
36		- {inViewport && <CountUp end={1500} duration={10} />}
37		- <p>Project Complete</p>
38		- </div>
39		- </div>
40		- </div>
41		- <div className="col-lg-3 col-sm-6">
42		- <div className="counter-item">
43		- <div className="counter-icon">
44		- <img src="/assets/img/icon/counter_icon02.svg" alt="" />
45		- </div>
46		- <div className="counter-content">
47		- <span className="count" />
48		- {inViewport && <CountUp end={8562} duration={10} />}
49		- <p>Satisfied Clients</p>
50		- </div>
51		- </div>
52		- </div>
53		- <div className="col-lg-3 col-sm-6">
54		- <div className="counter-item">
55		- <div className="counter-icon">
56		- <img src="/assets/img/icon/counter_icon03.svg" alt="" />
57		- </div>
58		- <div className="counter-content">
59		- {inViewport && <CountUp end={450} duration={10} />}
60		- <p>Experienced Staff</p>
61		- </div>
62		- </div>
63		- </div>
64		- <div className="col-lg-3 col-sm-6">
65		- <div className="counter-item">
66		- <div className="counter-icon">
67		- <img src="/assets/img/icon/counter_icon04.svg" alt="" />
68		- </div>
69		- <div className="counter-content">
70		- {inViewport && <CountUp end={38} duration={10} />}
71		- <p>Awards Win</p>
72		- </div>
73		- </div>
74		- </div>
75		- </div>
76		- </div>
	18	+ useEffect(() => {
	19	+ window.addEventListener("scroll", handleScroll);
	20	+ return () => {
	21	+ window.removeEventListener("scroll", handleScroll);
	22	+ };
	23	+ }, []);
	24	+ return (
	25	+ <>
	26	+ <div className="counter-area pb-120">
	27	+ <div className="container">
	28	+ <div className="counter-inner wow fadeInUp" data-wow-delay=".2s">
	29	+ <div className="row">
	30	+ <div className="col-lg-3 col-sm-6">
	31	+ <div className="counter-item">
	32	+ <div className="counter-icon">
	33	+ <img src="/assets/img/icon/counter_icon01.svg" alt="" />
	34	+ </div>
	35	+ <div className="counter-content">
	36	+ {inViewport && <CountUp end={1500} duration={10} />}
	37	+ <p>Projects Complete</p>
	38	+ </div>
77	39	</div>
	40	+ </div>
	41	+ <div className="col-lg-3 col-sm-6">
	42	+ <div className="counter-item">
	43	+ <div className="counter-icon">
	44	+ <img src="/assets/img/icon/counter_icon02.svg" alt="" />
	45	+ </div>
	46	+ <div className="counter-content">
	47	+ <span className="count" />
	48	+ {inViewport && <CountUp end={8562} duration={10} />}
	49	+ <p>Satisfied Clients</p>
	50	+ </div>
	51	+ </div>
	52	+ </div>
	53	+ <div className="col-lg-3 col-sm-6">
	54	+ <div className="counter-item">
	55	+ <div className="counter-icon">
	56	+ <img src="/assets/img/icon/counter_icon03.svg" alt="" />
	57	+ </div>
	58	+ <div className="counter-content">
	59	+ {inViewport && <CountUp end={450} duration={10} />}
	60	+ <p>Experienced Staff</p>
	61	+ </div>
	62	+ </div>
	63	+ </div>
	64	+ <div className="col-lg-3 col-sm-6">
	65	+ <div className="counter-item">
	66	+ <div className="counter-icon">
	67	+ <img src="/assets/img/icon/counter_icon04.svg" alt="" />
	68	+ </div>
	69	+ <div className="counter-content">
	70	+ {inViewport && <CountUp end={38} duration={10} />}
	71	+ <p>Awards Won</p>
	72	+ </div>
	73	+ </div>
	74	+ </div>
78	75	</div>
79		-
80		- </>
81		- )
	76	+ </div>
	77	+ </div>
	78	+ </div>
	79	+ </>
	80	+ );
82	81	}

+174-96components/sections/Team2.js

		@@ -1,100 +1,178 @@
1		-import Link from "next/link"
2		-
	1	+import Link from "next/link";
3	2
4	3	export default function Team2() {
5		- return (
6		- <>
7		- <section className="team-area-two pt-115 pb-90">
8		- <div className="container">
9		- <div className="row justify-content-center">
10		- <div className="col-lg-10">
11		- <div className="section-title text-center mb-60">
12		- <span className="sub-title">Our Creative Team</span>
13		- <h2 className="title">Our Professional Team</h2>
14		- </div>
15		- </div>
16		- </div>
17		- <div className="row justify-content-center">
18		- <div className="col-xl-3 col-lg-4 col-md-6 col-sm-8">
19		- <div className="team-item-two">
20		- <div className="team-thumb-two">
21		- <Link href="/team-details"><img src="/assets/img/team/h2_team_img01.jpg" alt="" /></Link>
22		- <div className="team-social-two">
23		- <ul className="list-wrap">
24		- <li><Link href="#"><i className="fab fa-facebook-f" /></Link></li>
25		- <li><Link href="#"><i className="fab fa-linkedin-in" /></Link></li>
26		- <li><Link href="#"><i className="fab fa-twitter" /></Link></li>
27		- <li><Link href="#"><i className="fab fa-instagram" /></Link></li>
28		- </ul>
29		- </div>
30		- </div>
31		- <div className="team-content-two">
32		- <h2 className="title"><Link href="/team-details">Robert C. Simmons</Link></h2>
33		- <span>Roof Engineer</span>
34		- </div>
35		- </div>
36		- </div>
37		- <div className="col-xl-3 col-lg-4 col-md-6 col-sm-8">
38		- <div className="team-item-two">
39		- <div className="team-thumb-two">
40		- <Link href="/team-details"><img src="/assets/img/team/h2_team_img02.jpg" alt="" /></Link>
41		- <div className="team-social-two">
42		- <ul className="list-wrap">
43		- <li><Link href="#"><i className="fab fa-facebook-f" /></Link></li>
44		- <li><Link href="#"><i className="fab fa-linkedin-in" /></Link></li>
45		- <li><Link href="#"><i className="fab fa-twitter" /></Link></li>
46		- <li><Link href="#"><i className="fab fa-instagram" /></Link></li>
47		- </ul>
48		- </div>
49		- </div>
50		- <div className="team-content-two">
51		- <h2 className="title"><Link href="/team-details">Christopher Jhon</Link></h2>
52		- <span>Roof Engineer</span>
53		- </div>
54		- </div>
55		- </div>
56		- <div className="col-xl-3 col-lg-4 col-md-6 col-sm-8">
57		- <div className="team-item-two">
58		- <div className="team-thumb-two">
59		- <Link href="/team-details"><img src="/assets/img/team/h2_team_img03.jpg" alt="" /></Link>
60		- <div className="team-social-two">
61		- <ul className="list-wrap">
62		- <li><Link href="#"><i className="fab fa-facebook-f" /></Link></li>
63		- <li><Link href="#"><i className="fab fa-linkedin-in" /></Link></li>
64		- <li><Link href="#"><i className="fab fa-twitter" /></Link></li>
65		- <li><Link href="#"><i className="fab fa-instagram" /></Link></li>
66		- </ul>
67		- </div>
68		- </div>
69		- <div className="team-content-two">
70		- <h2 className="title"><Link href="/team-details">Karikoka Ahli</Link></h2>
71		- <span>Roof Engineer</span>
72		- </div>
73		- </div>
74		- </div>
75		- <div className="col-xl-3 col-lg-4 col-md-6 col-sm-8">
76		- <div className="team-item-two">
77		- <div className="team-thumb-two">
78		- <Link href="/team-details"><img src="/assets/img/team/h2_team_img04.jpg" alt="" /></Link>
79		- <div className="team-social-two">
80		- <ul className="list-wrap">
81		- <li><Link href="#"><i className="fab fa-facebook-f" /></Link></li>
82		- <li><Link href="#"><i className="fab fa-linkedin-in" /></Link></li>
83		- <li><Link href="#"><i className="fab fa-twitter" /></Link></li>
84		- <li><Link href="#"><i className="fab fa-instagram" /></Link></li>
85		- </ul>
86		- </div>
87		- </div>
88		- <div className="team-content-two">
89		- <h2 className="title"><Link href="/team-details">Dickerson MH</Link></h2>
90		- <span>Roof Engineer</span>
91		- </div>
92		- </div>
93		- </div>
94		- </div>
	4	+ return (
	5	+ <>
	6	+ <section className="team-area-two pt-115 pb-90">
	7	+ <div className="container">
	8	+ <div className="row justify-content-center">
	9	+ <div className="col-lg-10">
	10	+ <div className="section-title text-center mb-60">
	11	+ <span className="sub-title">Our Creative Team</span>
	12	+ <h2 className="title">Our Professional Team</h2>
	13	+ </div>
	14	+ </div>
	15	+ </div>
	16	+ <div className="row justify-content-center">
	17	+ <div className="col-xl-3 col-lg-4 col-md-6 col-sm-8">
	18	+ <div className="team-item-two">
	19	+ <div className="team-thumb-two">
	20	+ <Link href="/team-details">
	21	+ <img src="/assets/img/team/h2_team_img01.jpg" alt="" />
	22	+ </Link>
	23	+ <div className="team-social-two">
	24	+ <ul className="list-wrap">
	25	+ <li>
	26	+ <Link href="#">
	27	+ <i className="fab fa-facebook-f" />
	28	+ </Link>
	29	+ </li>
	30	+ <li>
	31	+ <Link href="#">
	32	+ <i className="fab fa-linkedin-in" />
	33	+ </Link>
	34	+ </li>
	35	+ <li>
	36	+ <Link href="#">
	37	+ <i className="fab fa-twitter" />
	38	+ </Link>
	39	+ </li>
	40	+ <li>
	41	+ <Link href="#">
	42	+ <i className="fab fa-instagram" />
	43	+ </Link>
	44	+ </li>
	45	+ </ul>
	46	+ </div>
95	47	</div>
96		- </section>
97		-
98		- </>
99		- )
	48	+ <div className="team-content-two">
	49	+ <h2 className="title">
	50	+ <Link href="/team-details">Shaun Lake</Link>
	51	+ </h2>
	52	+ <span>Founder</span>
	53	+ </div>
	54	+ </div>
	55	+ </div>
	56	+ <div className="col-xl-3 col-lg-4 col-md-6 col-sm-8">
	57	+ <div className="team-item-two">
	58	+ <div className="team-thumb-two">
	59	+ <Link href="/team-details">
	60	+ <img src="/assets/img/team/h2_team_img02.jpg" alt="" />
	61	+ </Link>
	62	+ <div className="team-social-two">
	63	+ <ul className="list-wrap">
	64	+ <li>
	65	+ <Link href="#">
	66	+ <i className="fab fa-facebook-f" />
	67	+ </Link>
	68	+ </li>
	69	+ <li>
	70	+ <Link href="#">
	71	+ <i className="fab fa-linkedin-in" />
	72	+ </Link>
	73	+ </li>
	74	+ <li>
	75	+ <Link href="#">
	76	+ <i className="fab fa-twitter" />
	77	+ </Link>
	78	+ </li>
	79	+ <li>
	80	+ <Link href="#">
	81	+ <i className="fab fa-instagram" />
	82	+ </Link>
	83	+ </li>
	84	+ </ul>
	85	+ </div>
	86	+ </div>
	87	+ <div className="team-content-two">
	88	+ <h2 className="title">
	89	+ <Link href="/team-details">Zack Stevens</Link>
	90	+ </h2>
	91	+ <span>Co-Founder</span>
	92	+ </div>
	93	+ </div>
	94	+ </div>
	95	+ <div className="col-xl-3 col-lg-4 col-md-6 col-sm-8">
	96	+ <div className="team-item-two">
	97	+ <div className="team-thumb-two">
	98	+ <Link href="/team-details">
	99	+ <img src="/assets/img/team/h2_team_img03.jpg" alt="" />
	100	+ </Link>
	101	+ <div className="team-social-two">
	102	+ <ul className="list-wrap">
	103	+ <li>
	104	+ <Link href="#">
	105	+ <i className="fab fa-facebook-f" />
	106	+ </Link>
	107	+ </li>
	108	+ <li>
	109	+ <Link href="#">
	110	+ <i className="fab fa-linkedin-in" />
	111	+ </Link>
	112	+ </li>
	113	+ <li>
	114	+ <Link href="#">
	115	+ <i className="fab fa-twitter" />
	116	+ </Link>
	117	+ </li>
	118	+ <li>
	119	+ <Link href="#">
	120	+ <i className="fab fa-instagram" />
	121	+ </Link>
	122	+ </li>
	123	+ </ul>
	124	+ </div>
	125	+ </div>
	126	+ <div className="team-content-two">
	127	+ <h2 className="title">
	128	+ <Link href="/team-details">Karikoka Ahli</Link>
	129	+ </h2>
	130	+ <span>Roof Engineer</span>
	131	+ </div>
	132	+ </div>
	133	+ </div>
	134	+ <div className="col-xl-3 col-lg-4 col-md-6 col-sm-8">
	135	+ <div className="team-item-two">
	136	+ <div className="team-thumb-two">
	137	+ <Link href="/team-details">
	138	+ <img src="/assets/img/team/h2_team_img04.jpg" alt="" />
	139	+ </Link>
	140	+ <div className="team-social-two">
	141	+ <ul className="list-wrap">
	142	+ <li>
	143	+ <Link href="#">
	144	+ <i className="fab fa-facebook-f" />
	145	+ </Link>
	146	+ </li>
	147	+ <li>
	148	+ <Link href="#">
	149	+ <i className="fab fa-linkedin-in" />
	150	+ </Link>
	151	+ </li>
	152	+ <li>
	153	+ <Link href="#">
	154	+ <i className="fab fa-twitter" />
	155	+ </Link>
	156	+ </li>
	157	+ <li>
	158	+ <Link href="#">
	159	+ <i className="fab fa-instagram" />
	160	+ </Link>
	161	+ </li>
	162	+ </ul>
	163	+ </div>
	164	+ </div>
	165	+ <div className="team-content-two">
	166	+ <h2 className="title">
	167	+ <Link href="/team-details">Dickerson MH</Link>
	168	+ </h2>
	169	+ <span>Roof Engineer</span>
	170	+ </div>
	171	+ </div>
	172	+ </div>
	173	+ </div>
	174	+ </div>
	175	+ </section>
	176	+ </>
	177	+ );
100	178	}

+7-0components/siteData.js

		@@ -0,0 +1,7 @@
	1	+export default siteData = {
	2	+ team: [
	3	+ {
	4	+ img: "/",
	5	+ },
	6	+ ],
	7	+};

+587-380pages/about.js

		@@ -1,396 +1,603 @@
1		-import VideoPopup from "@/components/elements/VideoPopup"
2		-import Layout from "@/components/layout/Layout"
3		-import Brand3 from "@/components/sections/Brand3"
4		-import Link from "next/link"
5		-import Slider from "react-slick"
	1	+import VideoPopup from "@/components/elements/VideoPopup";
	2	+import Layout from "@/components/layout/Layout";
	3	+import Brand3 from "@/components/sections/Brand3";
	4	+import Link from "next/link";
	5	+import Slider from "react-slick";
6	6	const settings = {
7		- dots: true,
8		- autoplay: true,
9		- arrows: false,
10		- infinite: true,
11		- speed: 500,
12		- slidesToShow: 1,
13		- slidesToScroll: 1,
14		-}
	7	+ dots: true,
	8	+ autoplay: true,
	9	+ arrows: false,
	10	+ infinite: true,
	11	+ speed: 500,
	12	+ slidesToShow: 1,
	13	+ slidesToScroll: 1,
	14	+};
15	15
16	16	export default function About() {
17		-
18		- return (
19		- <>
20		- <Layout breadcrumbTitle="About Us">
21		-
22		- <section className="about-area inner-about-area pt-120 pb-120">
23		- <div className="container">
24		- <div className="row align-items-center">
25		- <div className="col-xl-7 col-lg-6 order-0 order-lg-2">
26		- <div className="about-img-wrap">
27		- <img src="/assets/img/images/about_img01.jpg" alt="" className="wow fadeInRight" data-wow-delay=".4s" />
28		- <img src="/assets/img/images/about_img02.jpg" alt="" className="wow fadeInRight" data-wow-delay=".2s" />
29		- <div className="about-experiences-wrap">
30		- <div className="experiences-item">
31		- <div className="icon">
32		- <img src="/assets/img/icon/about_icon01.svg" alt="" />
33		- </div>
34		- <div className="content">
35		- <h6 className="title">We have more than 10 years of experiences</h6>
36		- </div>
37		- </div>
38		- <div className="experiences-item">
39		- <div className="icon">
40		- <img src="/assets/img/icon/about_icon02.svg" alt="" />
41		- </div>
42		- <div className="content">
43		- <h6 className="title">We use professional and experienced person</h6>
44		- </div>
45		- </div>
46		- </div>
47		- </div>
48		- </div>
49		- <div className="col-xl-5 col-lg-6">
50		- <div className="about-content">
51		- <div className="section-title mb-25">
52		- <span className="sub-title">About Our Company</span>
53		- <h2 className="title">We’re Committed to Roofing Excellence</h2>
54		- </div>
55		- <p>There are many variations of passages of Lorem Ipsum available, but the majori have suffered
56		- alteration in some form, by injected humour, or randomised word which don't look even slightly
57		- believable.</p>
58		- <div className="about-list">
59		- <ul className="list-wrap">
60		- <li><i className="fas fa-check" />32k Partners have worked us.</li>
61		- <li><i className="fas fa-check" />Professional and experienced human resources.</li>
62		- <li><i className="fas fa-check" />Provide the best roof services</li>
63		- </ul>
64		- </div>
65		- <Link href="/about" className="btn">Learn More</Link>
66		- </div>
67		- </div>
68		- </div>
	17	+ return (
	18	+ <>
	19	+ <Layout breadcrumbTitle="About Us">
	20	+ <section className="about-area inner-about-area pt-120 pb-120">
	21	+ <div className="container">
	22	+ <div className="row align-items-center">
	23	+ <div className="col-xl-7 col-lg-6 order-0 order-lg-2">
	24	+ <div className="about-img-wrap">
	25	+ <img
	26	+ src="/assets/img/images/about_img01.jpg"
	27	+ alt=""
	28	+ className="wow fadeInRight"
	29	+ data-wow-delay=".4s"
	30	+ />
	31	+ <img
	32	+ src="/assets/img/images/about_img02.jpg"
	33	+ alt=""
	34	+ className="wow fadeInRight"
	35	+ data-wow-delay=".2s"
	36	+ />
	37	+ <div className="about-experiences-wrap">
	38	+ <div className="experiences-item">
	39	+ <div className="icon">
	40	+ <img src="/assets/img/icon/about_icon01.svg" alt="" />
	41	+ </div>
	42	+ <div className="content">
	43	+ <h6 className="title">
	44	+ We have more than 10 years of experiences
	45	+ </h6>
	46	+ </div>
69	47	</div>
70		- </section>
71		- {/* about-area-end */}
72		- {/* work-area */}
73		- <section className="work-area">
74		- <div className="container">
75		- <div className="row justify-content-center">
76		- <div className="col-lg-8">
77		- <div className="section-title text-center mb-50">
78		- <span className="sub-title">Working Plan</span>
79		- <h2 className="title">Roof Plan Working Process</h2>
80		- </div>
81		- </div>
	48	+ <div className="experiences-item">
	49	+ <div className="icon">
	50	+ <img src="/assets/img/icon/about_icon02.svg" alt="" />
	51	+ </div>
	52	+ <div className="content">
	53	+ <h6 className="title">
	54	+ We use professional and experienced person
	55	+ </h6>
	56	+ </div>
	57	+ </div>
	58	+ </div>
	59	+ </div>
	60	+ </div>
	61	+ <div className="col-xl-5 col-lg-6">
	62	+ <div className="about-content">
	63	+ <div className="section-title mb-25">
	64	+ <span className="sub-title">About Our Company</span>
	65	+ <h2 className="title">
	66	+ We’re Committed to Roofing Excellence
	67	+ </h2>
	68	+ </div>
	69	+ <p>
	70	+ There are many variations of passages of Lorem Ipsum
	71	+ available, but the majori have suffered alteration in some
	72	+ form, by injected humour, or randomised word which don't
	73	+ look even slightly believable.
	74	+ </p>
	75	+ <div className="about-list">
	76	+ <ul className="list-wrap">
	77	+ <li>
	78	+ <i className="fas fa-check" />
	79	+ 32k Partners have worked us.
	80	+ </li>
	81	+ <li>
	82	+ <i className="fas fa-check" />
	83	+ Professional and experienced human resources.
	84	+ </li>
	85	+ <li>
	86	+ <i className="fas fa-check" />
	87	+ Provide the best roof services
	88	+ </li>
	89	+ </ul>
	90	+ </div>
	91	+ <Link href="/about" className="btn">
	92	+ Learn More
	93	+ </Link>
	94	+ </div>
	95	+ </div>
	96	+ </div>
	97	+ </div>
	98	+ </section>
	99	+ {/* about-area-end */}
	100	+ {/* work-area */}
	101	+ <section className="work-area">
	102	+ <div className="container">
	103	+ <div className="row justify-content-center">
	104	+ <div className="col-lg-8">
	105	+ <div className="section-title text-center mb-50">
	106	+ <span className="sub-title">Working Plan</span>
	107	+ <h2 className="title">Roof Plan Working Process</h2>
	108	+ </div>
	109	+ </div>
	110	+ </div>
	111	+ <div className="row">
	112	+ <div className="col-xl-3 col-md-6">
	113	+ <div className="work-item">
	114	+ <div className="work-thumb">
	115	+ <img src="/assets/img/images/work_img01.png" alt="" />
	116	+ <h4 className="number">01</h4>
	117	+ </div>
	118	+ <div className="work-content">
	119	+ <h2 className="title">Plan for Roofing</h2>
	120	+ <p>
	121	+ Suffered alteration in some a form, by injected humour, or
	122	+ randomised word
	123	+ </p>
	124	+ </div>
	125	+ </div>
	126	+ </div>
	127	+ <div className="col-xl-3 col-md-6">
	128	+ <div className="work-item">
	129	+ <div className="work-thumb">
	130	+ <img src="/assets/img/images/work_img02.png" alt="" />
	131	+ <h4 className="number">02</h4>
	132	+ </div>
	133	+ <div className="work-content">
	134	+ <h2 className="title">Schedule Estimate</h2>
	135	+ <p>
	136	+ Suffered alteration in some a form, by injected humour, or
	137	+ randomised word
	138	+ </p>
	139	+ </div>
	140	+ </div>
	141	+ </div>
	142	+ <div className="col-xl-3 col-md-6">
	143	+ <div className="work-item">
	144	+ <div className="work-thumb">
	145	+ <img src="/assets/img/images/work_img03.png" alt="" />
	146	+ <h4 className="number">03</h4>
	147	+ </div>
	148	+ <div className="work-content">
	149	+ <h2 className="title">Install New Roof</h2>
	150	+ <p>
	151	+ Suffered alteration in some a form, by injected humour, or
	152	+ randomised word
	153	+ </p>
	154	+ </div>
	155	+ </div>
	156	+ </div>
	157	+ <div className="col-xl-3 col-md-6">
	158	+ <div className="work-item">
	159	+ <div className="work-thumb">
	160	+ <img src="/assets/img/images/work_img04.png" alt="" />
	161	+ <h4 className="number">04</h4>
	162	+ </div>
	163	+ <div className="work-content">
	164	+ <h2 className="title">Enjoy Roofing</h2>
	165	+ <p>
	166	+ Suffered alteration in some a form, by injected humour, or
	167	+ randomised word
	168	+ </p>
	169	+ </div>
	170	+ </div>
	171	+ </div>
	172	+ </div>
	173	+ </div>
	174	+ </section>
	175	+ {/* work-area-end */}
	176	+ {/* history-area */}
	177	+ <section className="history-area pt-120 pb-120">
	178	+ <div className="container">
	179	+ <div className="row align-items-center">
	180	+ <div className="col-lg-6">
	181	+ <div className="history-img-wrap">
	182	+ <ul className="list-wrap">
	183	+ <li>
	184	+ <img src="/assets/img/images/history_img01.jpg" alt="" />
	185	+ </li>
	186	+ <li>
	187	+ <img src="/assets/img/images/history_img02.jpg" alt="" />
	188	+ <VideoPopup />
	189	+ </li>
	190	+ <li>
	191	+ <img src="/assets/img/images/history_img03.jpg" alt="" />
	192	+ </li>
	193	+ </ul>
	194	+ </div>
	195	+ </div>
	196	+ <div className="col-lg-6">
	197	+ <div className="history-content">
	198	+ <div className="section-title mb-20">
	199	+ <span className="sub-title">Our Roofing History</span>
	200	+ <h2 className="title">
	201	+ Our Roofing Legacy: Over 30 Years of Excellence
	202	+ </h2>
	203	+ </div>
	204	+ <p>
	205	+ For more than three decades, Shaun Lake has been at the
	206	+ forefront of the roofing industry, building a reputation for
	207	+ exceptional quality and reliability. Starting as a small,
	208	+ local business in Kansas City, MO, Shaun's dedication to
	209	+ craftsmanship and customer satisfaction has driven the
	210	+ company’s growth and success. Today, Shaun Lake Roofing is
	211	+ known for its expertise, innovative solutions, and
	212	+ unwavering commitment to excellence, serving clients both
	213	+ locally and beyond. Our rich history is a testament to our
	214	+ enduring values and the trust we've earned from countless
	215	+ satisfied customers.
	216	+ </p>
	217	+ <div className="history-list">
	218	+ <ul className="list-wrap">
	219	+ <li>
	220	+ <i className="fas fa-check-circle" />
	221	+ Technology management
	222	+ </li>
	223	+ <li>
	224	+ <i className="fas fa-check-circle" />
	225	+ Roofing Solutions
	226	+ </li>
	227	+ <li>
	228	+ <i className="fas fa-check-circle" />
	229	+ Modern Worker Working here
	230	+ </li>
	231	+ <li>
	232	+ <i className="fas fa-check-circle" />
	233	+ Quick Response
	234	+ </li>
	235	+ </ul>
	236	+ </div>
	237	+ </div>
	238	+ </div>
	239	+ </div>
	240	+ </div>
	241	+ </section>
	242	+ {/* history-area-end */}
	243	+ {/* area-bg */}
	244	+ <div
	245	+ className="area-bg-five"
	246	+ data-background="/assets/img/bg/area_bg05.jpg"
	247	+ >
	248	+ {/* team-area */}
	249	+ <section className="inner-team-area pb-90">
	250	+ <div className="container">
	251	+ <div className="row justify-content-center">
	252	+ <div className="col-lg-8">
	253	+ <div className="section-title text-center mb-60">
	254	+ <span className="sub-title">Professional Team</span>
	255	+ <h2 className="title">Professional Team Member</h2>
	256	+ </div>
	257	+ </div>
	258	+ </div>
	259	+ <div className="row justify-content-center">
	260	+ <div className="col-xl-3 col-lg-4 col-md-6 col-sm-10">
	261	+ <div className="team-item">
	262	+ <div className="team-thumb">
	263	+ <Link href="/team-details">
	264	+ <img src="/assets/img/team/team_img01.jpg" alt="" />
	265	+ </Link>
	266	+ <div className="team-social">
	267	+ <ul className="list-wrap">
	268	+ <li>
	269	+ <Link href="#">
	270	+ <i className="fab fa-facebook-f" />
	271	+ </Link>
	272	+ </li>
	273	+ <li>
	274	+ <Link href="#">
	275	+ <i className="fab fa-linkedin-in" />
	276	+ </Link>
	277	+ </li>
	278	+ <li>
	279	+ <Link href="#">
	280	+ <i className="fab fa-twitter" />
	281	+ </Link>
	282	+ </li>
	283	+ <li>
	284	+ <Link href="#">
	285	+ <i className="fab fa-instagram" />
	286	+ </Link>
	287	+ </li>
	288	+ </ul>
	289	+ </div>
	290	+ </div>
	291	+ <div className="team-content">
	292	+ <h2 className="title">
	293	+ <Link href="/team-details">Robert C. Simmons</Link>
	294	+ </h2>
	295	+ <span>Roof Engineer</span>
	296	+ </div>
	297	+ </div>
	298	+ </div>
	299	+ <div className="col-xl-3 col-lg-4 col-md-6 col-sm-10">
	300	+ <div className="team-item">
	301	+ <div className="team-thumb">
	302	+ <Link href="/team-details">
	303	+ <img src="/assets/img/team/team_img02.jpg" alt="" />
	304	+ </Link>
	305	+ <div className="team-social">
	306	+ <ul className="list-wrap">
	307	+ <li>
	308	+ <Link href="#">
	309	+ <i className="fab fa-facebook-f" />
	310	+ </Link>
	311	+ </li>
	312	+ <li>
	313	+ <Link href="#">
	314	+ <i className="fab fa-linkedin-in" />
	315	+ </Link>
	316	+ </li>
	317	+ <li>
	318	+ <Link href="#">
	319	+ <i className="fab fa-twitter" />
	320	+ </Link>
	321	+ </li>
	322	+ <li>
	323	+ <Link href="#">
	324	+ <i className="fab fa-instagram" />
	325	+ </Link>
	326	+ </li>
	327	+ </ul>
	328	+ </div>
	329	+ </div>
	330	+ <div className="team-content">
	331	+ <h2 className="title">
	332	+ <Link href="/team-details">Christopher Jhon</Link>
	333	+ </h2>
	334	+ <span>Roof Engineer</span>
	335	+ </div>
	336	+ </div>
	337	+ </div>
	338	+ <div className="col-xl-3 col-lg-4 col-md-6 col-sm-10">
	339	+ <div className="team-item">
	340	+ <div className="team-thumb">
	341	+ <Link href="/team-details">
	342	+ <img src="/assets/img/team/team_img03.jpg" alt="" />
	343	+ </Link>
	344	+ <div className="team-social">
	345	+ <ul className="list-wrap">
	346	+ <li>
	347	+ <Link href="#">
	348	+ <i className="fab fa-facebook-f" />
	349	+ </Link>
	350	+ </li>
	351	+ <li>
	352	+ <Link href="#">
	353	+ <i className="fab fa-linkedin-in" />
	354	+ </Link>
	355	+ </li>
	356	+ <li>
	357	+ <Link href="#">
	358	+ <i className="fab fa-twitter" />
	359	+ </Link>
	360	+ </li>
	361	+ <li>
	362	+ <Link href="#">
	363	+ <i className="fab fa-instagram" />
	364	+ </Link>
	365	+ </li>
	366	+ </ul>
	367	+ </div>
	368	+ </div>
	369	+ <div className="team-content">
	370	+ <h2 className="title">
	371	+ <Link href="/team-details">Karikoka Ahli</Link>
	372	+ </h2>
	373	+ <span>Roof Engineer</span>
	374	+ </div>
	375	+ </div>
	376	+ </div>
	377	+ <div className="col-xl-3 col-lg-4 col-md-6 col-sm-10">
	378	+ <div className="team-item">
	379	+ <div className="team-thumb">
	380	+ <Link href="/team-details">
	381	+ <img src="/assets/img/team/team_img04.jpg" alt="" />
	382	+ </Link>
	383	+ <div className="team-social">
	384	+ <ul className="list-wrap">
	385	+ <li>
	386	+ <Link href="#">
	387	+ <i className="fab fa-facebook-f" />
	388	+ </Link>
	389	+ </li>
	390	+ <li>
	391	+ <Link href="#">
	392	+ <i className="fab fa-linkedin-in" />
	393	+ </Link>
	394	+ </li>
	395	+ <li>
	396	+ <Link href="#">
	397	+ <i className="fab fa-twitter" />
	398	+ </Link>
	399	+ </li>
	400	+ <li>
	401	+ <Link href="#">
	402	+ <i className="fab fa-instagram" />
	403	+ </Link>
	404	+ </li>
	405	+ </ul>
	406	+ </div>
	407	+ </div>
	408	+ <div className="team-content">
	409	+ <h2 className="title">
	410	+ <Link href="/team-details">Dickerson MH</Link>
	411	+ </h2>
	412	+ <span>Roof Engineer</span>
	413	+ </div>
	414	+ </div>
	415	+ </div>
	416	+ </div>
	417	+ </div>
	418	+ </section>
	419	+ {/* team-area-end */}
	420	+ {/* testimonial-area */}
	421	+ <section className="inner-testimonial-area parallax pb-120 position-relative">
	422	+ <div className="container">
	423	+ <div className="row justify-content-center">
	424	+ <div className="col-xl-6">
	425	+ <div className="section-title text-center mb-50">
	426	+ <span className="sub-title">Our Testimonial</span>
	427	+ <h2 className="title">What Our Client Feedback</h2>
	428	+ </div>
	429	+ </div>
	430	+ </div>
	431	+ <div className="row justify-content-center">
	432	+ <div className="col-lg-10">
	433	+ <div className="testimonial-inner">
	434	+ <Slider {...settings} className="testimonial-active-two">
	435	+ <div className="testimonial-item-two">
	436	+ <div className="testimonial-avatar-two">
	437	+ <img
	438	+ src="/assets/img/images/h2_testi_avatar01.png"
	439	+ alt=""
	440	+ />
82	441	</div>
83		- <div className="row">
84		- <div className="col-xl-3 col-md-6">
85		- <div className="work-item">
86		- <div className="work-thumb">
87		- <img src="/assets/img/images/work_img01.png" alt="" />
88		- <h4 className="number">01</h4>
89		- </div>
90		- <div className="work-content">
91		- <h2 className="title">Plan for Roofing</h2>
92		- <p>Suffered alteration in some a form, by injected humour, or randomised word</p>
93		- </div>
94		- </div>
95		- </div>
96		- <div className="col-xl-3 col-md-6">
97		- <div className="work-item">
98		- <div className="work-thumb">
99		- <img src="/assets/img/images/work_img02.png" alt="" />
100		- <h4 className="number">02</h4>
101		- </div>
102		- <div className="work-content">
103		- <h2 className="title">Schedule Estimate</h2>
104		- <p>Suffered alteration in some a form, by injected humour, or randomised word</p>
105		- </div>
106		- </div>
	442	+ <div className="testimonial-content-two">
	443	+ <div className="content-top">
	444	+ <div className="icon">
	445	+ <i className="fas fa-quote-left" />
107	446	</div>
108		- <div className="col-xl-3 col-md-6">
109		- <div className="work-item">
110		- <div className="work-thumb">
111		- <img src="/assets/img/images/work_img03.png" alt="" />
112		- <h4 className="number">03</h4>
113		- </div>
114		- <div className="work-content">
115		- <h2 className="title">Install New Roof</h2>
116		- <p>Suffered alteration in some a form, by injected humour, or randomised word</p>
117		- </div>
118		- </div>
119		- </div>
120		- <div className="col-xl-3 col-md-6">
121		- <div className="work-item">
122		- <div className="work-thumb">
123		- <img src="/assets/img/images/work_img04.png" alt="" />
124		- <h4 className="number">04</h4>
125		- </div>
126		- <div className="work-content">
127		- <h2 className="title">Enjoy Roofing</h2>
128		- <p>Suffered alteration in some a form, by injected humour, or randomised word</p>
129		- </div>
130		- </div>
	447	+ <div className="rating">
	448	+ <i className="fas fa-star" />
	449	+ <i className="fas fa-star" />
	450	+ <i className="fas fa-star" />
	451	+ <i className="fas fa-star" />
	452	+ <i className="fas fa-star" />
131	453	</div>
	454	+ </div>
	455	+ <p>
	456	+ There are many varation of paissages of Lorem as the
	457	+ Ipum available but our majority have sufferied
	458	+ alterations in some form, by our by injected hsumour
	459	+ randomised worids which don't looks even slightly
	460	+ there as believable. If you going to use a passage
	461	+ of Lorem Ipsum.
	462	+ </p>
	463	+ <div className="content-bottom">
	464	+ <h4 className="title">Darrell Steward</h4>
	465	+ <span>Roofing Expert</span>
	466	+ </div>
132	467	</div>
133		- </div>
134		- </section>
135		- {/* work-area-end */}
136		- {/* history-area */}
137		- <section className="history-area pt-120 pb-120">
138		- <div className="container">
139		- <div className="row align-items-center">
140		- <div className="col-lg-6">
141		- <div className="history-img-wrap">
142		- <ul className="list-wrap">
143		- <li>
144		- <img src="/assets/img/images/history_img01.jpg" alt="" />
145		- </li>
146		- <li>
147		- <img src="/assets/img/images/history_img02.jpg" alt="" />
148		- <VideoPopup />
149		- </li>
150		- <li>
151		- <img src="/assets/img/images/history_img03.jpg" alt="" />
152		- </li>
153		- </ul>
154		- </div>
155		- </div>
156		- <div className="col-lg-6">
157		- <div className="history-content">
158		- <div className="section-title mb-20">
159		- <span className="sub-title">Our Roofing History</span>
160		- <h2 className="title">Roofing when an unknown printer took to make type book</h2>
161		- </div>
162		- <p>There are many variations of passages of Lorem Ipsum available, but the majori our as have suffered alteration in some form, by injected humour, or randomised word which don't look even slightly believable.</p>
163		- <div className="history-list">
164		- <ul className="list-wrap">
165		- <li><i className="fas fa-check-circle" />Technology management</li>
166		- <li><i className="fas fa-check-circle" />Roofing Solutions</li>
167		- <li><i className="fas fa-check-circle" />Modern Worker Working here</li>
168		- <li><i className="fas fa-check-circle" />Quick Response</li>
169		- </ul>
170		- </div>
171		- </div>
172		- </div>
	468	+ </div>
	469	+ <div className="testimonial-item-two">
	470	+ <div className="testimonial-avatar-two">
	471	+ <img
	472	+ src="/assets/img/images/h2_testi_avatar02.png"
	473	+ alt=""
	474	+ />
173	475	</div>
174		- </div>
175		- </section>
176		- {/* history-area-end */}
177		- {/* area-bg */}
178		- <div className="area-bg-five" data-background="/assets/img/bg/area_bg05.jpg">
179		- {/* team-area */}
180		- <section className="inner-team-area pb-90">
181		- <div className="container">
182		- <div className="row justify-content-center">
183		- <div className="col-lg-8">
184		- <div className="section-title text-center mb-60">
185		- <span className="sub-title">Professional Team</span>
186		- <h2 className="title">Professional Team Member</h2>
187		- </div>
188		- </div>
	476	+ <div className="testimonial-content-two">
	477	+ <div className="content-top">
	478	+ <div className="icon">
	479	+ <i className="fas fa-quote-left" />
189	480	</div>
190		- <div className="row justify-content-center">
191		- <div className="col-xl-3 col-lg-4 col-md-6 col-sm-10">
192		- <div className="team-item">
193		- <div className="team-thumb">
194		- <Link href="/team-details"><img src="/assets/img/team/team_img01.jpg" alt="" /></Link>
195		- <div className="team-social">
196		- <ul className="list-wrap">
197		- <li><Link href="#"><i className="fab fa-facebook-f" /></Link></li>
198		- <li><Link href="#"><i className="fab fa-linkedin-in" /></Link></li>
199		- <li><Link href="#"><i className="fab fa-twitter" /></Link></li>
200		- <li><Link href="#"><i className="fab fa-instagram" /></Link></li>
201		- </ul>
202		- </div>
203		- </div>
204		- <div className="team-content">
205		- <h2 className="title"><Link href="/team-details">Robert C. Simmons</Link></h2>
206		- <span>Roof Engineer</span>
207		- </div>
208		- </div>
209		- </div>
210		- <div className="col-xl-3 col-lg-4 col-md-6 col-sm-10">
211		- <div className="team-item">
212		- <div className="team-thumb">
213		- <Link href="/team-details"><img src="/assets/img/team/team_img02.jpg" alt="" /></Link>
214		- <div className="team-social">
215		- <ul className="list-wrap">
216		- <li><Link href="#"><i className="fab fa-facebook-f" /></Link></li>
217		- <li><Link href="#"><i className="fab fa-linkedin-in" /></Link></li>
218		- <li><Link href="#"><i className="fab fa-twitter" /></Link></li>
219		- <li><Link href="#"><i className="fab fa-instagram" /></Link></li>
220		- </ul>
221		- </div>
222		- </div>
223		- <div className="team-content">
224		- <h2 className="title"><Link href="/team-details">Christopher Jhon</Link></h2>
225		- <span>Roof Engineer</span>
226		- </div>
227		- </div>
228		- </div>
229		- <div className="col-xl-3 col-lg-4 col-md-6 col-sm-10">
230		- <div className="team-item">
231		- <div className="team-thumb">
232		- <Link href="/team-details"><img src="/assets/img/team/team_img03.jpg" alt="" /></Link>
233		- <div className="team-social">
234		- <ul className="list-wrap">
235		- <li><Link href="#"><i className="fab fa-facebook-f" /></Link></li>
236		- <li><Link href="#"><i className="fab fa-linkedin-in" /></Link></li>
237		- <li><Link href="#"><i className="fab fa-twitter" /></Link></li>
238		- <li><Link href="#"><i className="fab fa-instagram" /></Link></li>
239		- </ul>
240		- </div>
241		- </div>
242		- <div className="team-content">
243		- <h2 className="title"><Link href="/team-details">Karikoka Ahli</Link></h2>
244		- <span>Roof Engineer</span>
245		- </div>
246		- </div>
247		- </div>
248		- <div className="col-xl-3 col-lg-4 col-md-6 col-sm-10">
249		- <div className="team-item">
250		- <div className="team-thumb">
251		- <Link href="/team-details"><img src="/assets/img/team/team_img04.jpg" alt="" /></Link>
252		- <div className="team-social">
253		- <ul className="list-wrap">
254		- <li><Link href="#"><i className="fab fa-facebook-f" /></Link></li>
255		- <li><Link href="#"><i className="fab fa-linkedin-in" /></Link></li>
256		- <li><Link href="#"><i className="fab fa-twitter" /></Link></li>
257		- <li><Link href="#"><i className="fab fa-instagram" /></Link></li>
258		- </ul>
259		- </div>
260		- </div>
261		- <div className="team-content">
262		- <h2 className="title"><Link href="/team-details">Dickerson MH</Link></h2>
263		- <span>Roof Engineer</span>
264		- </div>
265		- </div>
266		- </div>
	481	+ <div className="rating">
	482	+ <i className="fas fa-star" />
	483	+ <i className="fas fa-star" />
	484	+ <i className="fas fa-star" />
	485	+ <i className="fas fa-star" />
	486	+ <i className="fas fa-star" />
267	487	</div>
	488	+ </div>
	489	+ <p>
	490	+ Lorem Ipsum are many varation of paissages of Lorem
	491	+ as the Ipum available but our majority have
	492	+ sufferied alterations in some form, by our by
	493	+ injected hsumour randomised worids which don't looks
	494	+ even slightly there as believable. If you going to
	495	+ use a passage of Lorem Ipsum.
	496	+ </p>
	497	+ <div className="content-bottom">
	498	+ <h4 className="title">Robert C. Simmons</h4>
	499	+ <span>Roofing Expert</span>
	500	+ </div>
268	501	</div>
269		- </section>
270		- {/* team-area-end */}
271		- {/* testimonial-area */}
272		- <section className="inner-testimonial-area parallax pb-120 position-relative">
273		- <div className="container">
274		- <div className="row justify-content-center">
275		- <div className="col-xl-6">
276		- <div className="section-title text-center mb-50">
277		- <span className="sub-title">Our Testimonial</span>
278		- <h2 className="title">What Our Client Feedback</h2>
279		- </div>
280		- </div>
281		- </div>
282		- <div className="row justify-content-center">
283		- <div className="col-lg-10">
284		- <div className="testimonial-inner">
285		- <Slider {...settings} className="testimonial-active-two">
286		- <div className="testimonial-item-two">
287		- <div className="testimonial-avatar-two">
288		- <img src="/assets/img/images/h2_testi_avatar01.png" alt="" />
289		- </div>
290		- <div className="testimonial-content-two">
291		- <div className="content-top">
292		- <div className="icon">
293		- <i className="fas fa-quote-left" />
294		- </div>
295		- <div className="rating">
296		- <i className="fas fa-star" />
297		- <i className="fas fa-star" />
298		- <i className="fas fa-star" />
299		- <i className="fas fa-star" />
300		- <i className="fas fa-star" />
301		- </div>
302		- </div>
303		- <p>There are many varation of paissages of Lorem as the Ipum available but our majority have sufferied alterations in some form, by our by injected hsumour randomised worids which don't looks even slightly there as believable. If you going to use a passage of Lorem Ipsum.</p>
304		- <div className="content-bottom">
305		- <h4 className="title">Darrell Steward</h4>
306		- <span>Roofing Expert</span>
307		- </div>
308		- </div>
309		- </div>
310		- <div className="testimonial-item-two">
311		- <div className="testimonial-avatar-two">
312		- <img src="/assets/img/images/h2_testi_avatar02.png" alt="" />
313		- </div>
314		- <div className="testimonial-content-two">
315		- <div className="content-top">
316		- <div className="icon">
317		- <i className="fas fa-quote-left" />
318		- </div>
319		- <div className="rating">
320		- <i className="fas fa-star" />
321		- <i className="fas fa-star" />
322		- <i className="fas fa-star" />
323		- <i className="fas fa-star" />
324		- <i className="fas fa-star" />
325		- </div>
326		- </div>
327		- <p>Lorem Ipsum are many varation of paissages of Lorem as the Ipum available but our majority have sufferied alterations in some form, by our by injected hsumour randomised worids which don't looks even slightly there as believable. If you going to use a passage of Lorem Ipsum.</p>
328		- <div className="content-bottom">
329		- <h4 className="title">Robert C. Simmons</h4>
330		- <span>Roofing Expert</span>
331		- </div>
332		- </div>
333		- </div>
334		- <div className="testimonial-item-two">
335		- <div className="testimonial-avatar-two">
336		- <img src="/assets/img/images/h2_testi_avatar03.png" alt="" />
337		- </div>
338		- <div className="testimonial-content-two">
339		- <div className="content-top">
340		- <div className="icon">
341		- <i className="fas fa-quote-left" />
342		- </div>
343		- <div className="rating">
344		- <i className="fas fa-star" />
345		- <i className="fas fa-star" />
346		- <i className="fas fa-star" />
347		- <i className="fas fa-star" />
348		- <i className="fas fa-star" />
349		- </div>
350		- </div>
351		- <p>Lorem Ipsum are many varation of paissages of Lorem as the Ipum available but our majority have sufferied alterations in some form, by our by injected hsumour randomised worids which don't looks even slightly there as believable. If you going to use a passage of Lorem Ipsum.</p>
352		- <div className="content-bottom">
353		- <h4 className="title">Karikoka Ahli</h4>
354		- <span>Executive Manager</span>
355		- </div>
356		- </div>
357		- </div>
358		- </Slider>
359		- </div>
360		- </div>
	502	+ </div>
	503	+ <div className="testimonial-item-two">
	504	+ <div className="testimonial-avatar-two">
	505	+ <img
	506	+ src="/assets/img/images/h2_testi_avatar03.png"
	507	+ alt=""
	508	+ />
	509	+ </div>
	510	+ <div className="testimonial-content-two">
	511	+ <div className="content-top">
	512	+ <div className="icon">
	513	+ <i className="fas fa-quote-left" />
361	514	</div>
362		- <div className="testimonial-avatar-wrap">
363		- <ul className="list-wrap">
364		- <li>
365		- <img src="/assets/img/images/h4_testi_avatar01.png" className="layer" data-depth="0.1" alt="" />
366		- </li>
367		- <li>
368		- <img src="/assets/img/images/h4_testi_avatar02.png" className="layer" data-depth="0.2" alt="" />
369		- </li>
370		- <li>
371		- <img src="/assets/img/images/h4_testi_avatar03.png" className="layer" data-depth="0.05" alt="" />
372		- </li>
373		- <li>
374		- <img src="/assets/img/images/h4_testi_avatar03.png" className="layer" data-depth="0.2" alt="" />
375		- </li>
376		- <li>
377		- <img src="/assets/img/images/h4_testi_avatar02.png" className="layer" data-depth="0.05" alt="" />
378		- </li>
379		- <li>
380		- <img src="/assets/img/images/h4_testi_avatar01.png" className="layer" data-depth="0.1" alt="" />
381		- </li>
382		- </ul>
	515	+ <div className="rating">
	516	+ <i className="fas fa-star" />
	517	+ <i className="fas fa-star" />
	518	+ <i className="fas fa-star" />
	519	+ <i className="fas fa-star" />
	520	+ <i className="fas fa-star" />
383	521	</div>
	522	+ </div>
	523	+ <p>
	524	+ Lorem Ipsum are many varation of paissages of Lorem
	525	+ as the Ipum available but our majority have
	526	+ sufferied alterations in some form, by our by
	527	+ injected hsumour randomised worids which don't looks
	528	+ even slightly there as believable. If you going to
	529	+ use a passage of Lorem Ipsum.
	530	+ </p>
	531	+ <div className="content-bottom">
	532	+ <h4 className="title">Karikoka Ahli</h4>
	533	+ <span>Executive Manager</span>
	534	+ </div>
384	535	</div>
385		- </section>
386		- {/* testimonial-area-end */}
	536	+ </div>
	537	+ </Slider>
	538	+ </div>
387	539	</div>
388		- {/* area-bg-end */}
389		- {/* brand-area */}
390		- <Brand3 />
391		-
392		-
393		- </Layout>
394		- </>
395		- )
396		-}
	540	+ </div>
	541	+ <div className="testimonial-avatar-wrap">
	542	+ <ul className="list-wrap">
	543	+ <li>
	544	+ <img
	545	+ src="/assets/img/images/h4_testi_avatar01.png"
	546	+ className="layer"
	547	+ data-depth="0.1"
	548	+ alt=""
	549	+ />
	550	+ </li>
	551	+ <li>
	552	+ <img
	553	+ src="/assets/img/images/h4_testi_avatar02.png"
	554	+ className="layer"
	555	+ data-depth="0.2"
	556	+ alt=""
	557	+ />
	558	+ </li>
	559	+ <li>
	560	+ <img
	561	+ src="/assets/img/images/h4_testi_avatar03.png"
	562	+ className="layer"
	563	+ data-depth="0.05"
	564	+ alt=""
	565	+ />
	566	+ </li>
	567	+ <li>
	568	+ <img
	569	+ src="/assets/img/images/h4_testi_avatar03.png"
	570	+ className="layer"
	571	+ data-depth="0.2"
	572	+ alt=""
	573	+ />
	574	+ </li>
	575	+ <li>
	576	+ <img
	577	+ src="/assets/img/images/h4_testi_avatar02.png"
	578	+ className="layer"
	579	+ data-depth="0.05"
	580	+ alt=""
	581	+ />
	582	+ </li>
	583	+ <li>
	584	+ <img
	585	+ src="/assets/img/images/h4_testi_avatar01.png"
	586	+ className="layer"
	587	+ data-depth="0.1"
	588	+ alt=""
	589	+ />
	590	+ </li>
	591	+ </ul>
	592	+ </div>
	593	+ </div>
	594	+ </section>
	595	+ {/* testimonial-area-end */}
	596	+ </div>
	597	+ {/* area-bg-end */}
	598	+ {/* brand-area */}
	599	+ <Brand3 />
	600	+ </Layout>
	601	+ </>
	602	+ );
	603	+}