service images updated

This commit is contained in:
Selvi 2025-08-14 20:23:04 +05:30
commit beaa22e4b7
40 changed files with 227 additions and 313 deletions

View File

@ -251,7 +251,6 @@ const Campaign = [
sImgS: sImgS7, sImgS: sImgS7,
description: "We help reunite you with your spouse, children, and parents in the U.S. quickly and safely.", description: "We help reunite you with your spouse, children, and parents in the U.S. quickly and safely.",
category: "Family", category: "Family",
sImgS: sImgS2,
cSimg: cSimg3, cSimg: cSimg3,
descriptiondetail: ` descriptiondetail: `
<p>Reuniting with family members in the United States is one of the most meaningful and emotional aspects of immigration law. For many, the ability to bring a spouse, children, parents, or siblings to live together in the US represents not just a legal milestone, but a deeply personal achievement that shapes the future of entire families. Our legal team is dedicated to helping US citizens and lawful permanent residents navigate the complex and often lengthy family immigration process with clarity and confidence. We assist with preparing and filing family-based petitions, such as Form I-130, managing consular processing, and pursuing adjustment of status applications. We also handle challenging cases that involve inadmissibility waivers, prior visa denials, or documentation complications, ensuring that every step of the process is handled with precision and care. Whether its bringing a spouse from overseas, reuniting with children, or securing visas for elderly parents, our mission is to bridge distances and make family unity a reality.</p> <p>Reuniting with family members in the United States is one of the most meaningful and emotional aspects of immigration law. For many, the ability to bring a spouse, children, parents, or siblings to live together in the US represents not just a legal milestone, but a deeply personal achievement that shapes the future of entire families. Our legal team is dedicated to helping US citizens and lawful permanent residents navigate the complex and often lengthy family immigration process with clarity and confidence. We assist with preparing and filing family-based petitions, such as Form I-130, managing consular processing, and pursuing adjustment of status applications. We also handle challenging cases that involve inadmissibility waivers, prior visa denials, or documentation complications, ensuring that every step of the process is handled with precision and care. Whether its bringing a spouse from overseas, reuniting with children, or securing visas for elderly parents, our mission is to bridge distances and make family unity a reality.</p>

View File

@ -26,6 +26,11 @@ import develop1 from '/public/images/service/develop/img-1.jpg'
import develop2 from '/public/images/service/develop/img-2.jpg' import develop2 from '/public/images/service/develop/img-2.jpg'
import develop3 from '/public/images/service/develop/img-3.jpg' import develop3 from '/public/images/service/develop/img-3.jpg'
import iconImg1 from '/public/images/home/banner/icons/family-immigration.webp'
import iconImg2 from '/public/images/home/banner/icons/employment-visa.webp'
import iconImg3 from '/public/images/home/banner/icons/deportation-defense.webp'
import iconImg4 from '/public/images/home/banner/icons/citizenship-services.webp'
@ -37,7 +42,7 @@ const Services = [
slug: 'family-immigration', slug: 'family-immigration',
description: 'Reunite with loved ones via green cards, fiancé visas, and petitions from filing to processing.', description: 'Reunite with loved ones via green cards, fiancé visas, and petitions from filing to processing.',
des3: 'One way to categorize the activities is in terms of the professionals area of expertise such as competitive analysis, corporate strategy the activities', des3: 'One way to categorize the activities is in terms of the professionals area of expertise such as competitive analysis, corporate strategy the activities',
icon: 'flaticon-credit', iconImg: iconImg1,
ssImg1: sSingleimg1, ssImg1: sSingleimg1,
ssImg2: sSingleimg2, ssImg2: sSingleimg2,
}, },
@ -49,7 +54,7 @@ const Services = [
description: 'Build your U.S. career with H-1B, L-1, O-1, EB visas, expert support for professionals, investors.', description: 'Build your U.S. career with H-1B, L-1, O-1, EB visas, expert support for professionals, investors.',
des2: 'Lacus, etiam sed est eu tempus need Temer diam congue laoret .', des2: 'Lacus, etiam sed est eu tempus need Temer diam congue laoret .',
des3: 'One way to categorize the activities is in terms of the professionals area of expertise such as competitive analysis, corporate strategy the activities', des3: 'One way to categorize the activities is in terms of the professionals area of expertise such as competitive analysis, corporate strategy the activities',
icon: 'flaticon-job', iconImg: iconImg2,
ssImg1: sSingleimg1, ssImg1: sSingleimg1,
ssImg2: sSingleimg2, ssImg2: sSingleimg2,
}, },
@ -61,7 +66,7 @@ const Services = [
description: 'Protect your stay with removal cancellation, asylum claims, and strong representation.', description: 'Protect your stay with removal cancellation, asylum claims, and strong representation.',
des2: 'Lacus, etiam sed est eu tempus need Temer diam congue laoret .', des2: 'Lacus, etiam sed est eu tempus need Temer diam congue laoret .',
des3: 'One way to categorize the activities is in terms of the professionals area of expertise such as competitive analysis, corporate strategy the activities', des3: 'One way to categorize the activities is in terms of the professionals area of expertise such as competitive analysis, corporate strategy the activities',
icon: 'flaticon-team-work', iconImg: iconImg3,
ssImg1: sSingleimg1, ssImg1: sSingleimg1,
ssImg2: sSingleimg2, ssImg2: sSingleimg2,
}, },
@ -73,7 +78,7 @@ const Services = [
description: 'Achieve citizenship with naturalization help, test, and guidance on residency requirements.', description: 'Achieve citizenship with naturalization help, test, and guidance on residency requirements.',
des2: 'Lacus, etiam sed est eu tempus need Temer diam congue laoret .', des2: 'Lacus, etiam sed est eu tempus need Temer diam congue laoret .',
des3: 'One way to categorize the activities is in terms of the professionals area of expertise such as competitive analysis, corporate strategy the activities', des3: 'One way to categorize the activities is in terms of the professionals area of expertise such as competitive analysis, corporate strategy the activities',
icon: 'flaticon-bus', iconImg: iconImg4,
ssImg1: sSingleimg1, ssImg1: sSingleimg1,
ssImg2: sSingleimg2, ssImg2: sSingleimg2,
}, },

View File

@ -5,6 +5,7 @@ import "slick-carousel/slick/slick-theme.css";
import Link from 'next/link' import Link from 'next/link'
import SectionTitle from "../SectionTitle/SectionTitle"; import SectionTitle from "../SectionTitle/SectionTitle";
import Services from '../../api/service' import Services from '../../api/service'
import Image from "next/image";
const settings = { const settings = {
@ -74,8 +75,14 @@ const Features = (props) => {
<div className="grid" key={srv}> <div className="grid" key={srv}>
<div className="wpo-service-item"> <div className="wpo-service-item">
<div className="wpo-service-text"> <div className="wpo-service-text">
<div className="service-icon">
<i className={`fi ${service.icon}`}></i> <div className="service-icon">
<Image
src={service.iconImg}
alt={service.sTitle}
width={50}
height={50}
/>
</div> </div>
{/* <h2><Link onClick={ClickHandler} href={'/service-single/[slug]'} as={`/service-single/${service.slug}`}>{service.sTitle}</Link></h2> */} {/* <h2><Link onClick={ClickHandler} href={'/service-single/[slug]'} as={`/service-single/${service.slug}`}>{service.sTitle}</Link></h2> */}
<h2 className="text-white">{service.sTitle}</h2> <h2 className="text-white">{service.sTitle}</h2>

View File

@ -1,12 +1,12 @@
import React from 'react' import React from 'react'
import VideoModal from '../ModalVideo/VideoModal'; import VideoModal from '../ModalVideo/VideoModal';
import fImg from '/public/images/funfact3.jpg' import videoImg from '/public/images/home/video.webp'
import Image from 'next/image'; import Image from 'next/image';
const FunFactVideo = (props) => { const FunFactVideo = (props) => {
return ( return (
<div className="funfact-video mt-0"> <div className="funfact-video mt-0">
<Image src={fImg} alt="" /> <Image src={videoImg} alt="" />
<VideoModal /> <VideoModal />
</div> </div>
) )

View File

@ -79,7 +79,11 @@ const ServiceSection = (props) => {
<div className="features-dot"> <div className="features-dot">
<div className="dots"></div> <div className="dots"></div>
</div> </div>
<i className={feature.icon}></i> <img
src={feature.img.src}
alt={`${feature.title} icon`}
className="feature-img"
/>
</div> </div>
<div className="feature-text"> <div className="feature-text">
{/* <h2> {/* <h2>

View File

@ -10,7 +10,7 @@ import thumb1 from '/public/images/testimonial/thumb1.png'
import thumb2 from '/public/images/testimonial/thumb2.png' import thumb2 from '/public/images/testimonial/thumb2.png'
import thumb3 from '/public/images/testimonial/thumb3.png' import thumb3 from '/public/images/testimonial/thumb3.png'
import Image from 'next/image'; import Image from 'next/image';
import testimonialImage from '/public/images/about.png' import testiImage from '/public/images/home/quotes.webp'
@ -58,7 +58,7 @@ const Testimonial = (props) => {
<div className="left-slide"> <div className="left-slide">
<div className="testimonial-img"> <div className="testimonial-img">
<Image src={testimonialImage} alt="" /> <Image src={testiImage} alt="" />
</div> </div>
</div> </div>

View File

@ -11,7 +11,7 @@ const About = (props) => {
<div className="row align-items-center"> <div className="row align-items-center">
<div className="col-lg-6 col-md-12 col-12 order-2 order-lg-1"> <div className="col-lg-6 col-md-12 col-12 order-2 order-lg-1">
<div className="wpo-about-img"> <div className="wpo-about-img">
<Image src={props.abimg} alt="" /> <Image src={props.introImg} alt="" />
<div className="wpo-about-img-text"> <div className="wpo-about-img-text">
<h4>1998</h4> <h4>1998</h4>

View File

@ -22,18 +22,18 @@ const Hero = () => {
<div className="hero-wrapper"> <div className="hero-wrapper">
<Slider {...settings}> <Slider {...settings}>
<div className="hero-slide"> <div className="hero-slide">
<div className="slide-inner slide-bg-image" style={{ backgroundImage: `url(${'images/slider/slide-1.jpg'})` }}> <div className="slide-inner slide-bg-image" style={{ backgroundImage: `url(${'images/home/banner/banner-1.webp'})` }}>
<div className="container-fluid"> <div className="container-fluid">
<div className="slide-content"> <div className="slide-content">
<div data-swiper-parallax="300" className="slide-title"> <div data-swiper-parallax="300" className="slide-title">
<h2>Wisdom. Freedom. Hope.</h2> <h2>Family Immigration Assistance</h2>
</div> </div>
<div data-swiper-parallax="400" className="slide-text"> <div data-swiper-parallax="400" className="slide-text">
<p>We can taking small steps and making small changes.</p> <p>Reuniting loved ones, one case at a time.</p>
</div> </div>
<div className="clearfix"></div> <div className="clearfix"></div>
<div className="slide-btns"> <div className="slide-btns">
<Link href="/about" className="theme-btn">Join The Campaign</Link> <Link href="/about" className="theme-btn">View More</Link>
</div> </div>
</div> </div>
</div> </div>
@ -41,54 +41,54 @@ const Hero = () => {
</div> </div>
<div className="hero-slide"> <div className="hero-slide">
<div className="slide-inner slide-bg-image" style={{ backgroundImage: `url(${'images/slider/slide-2.jpg'})` }}> <div className="slide-inner slide-bg-image" style={{ backgroundImage: `url(${'images/home/banner/banner-2.webp'})` }}>
<div className="container-fluid"> <div className="container-fluid">
<div className="slide-content"> <div className="slide-content">
<div data-swiper-parallax="300" className="slide-title"> <div data-swiper-parallax="300" className="slide-title">
<h2>Wisdom. Freedom. Hope.</h2> <h2>Employment & Work Visa Solutions</h2>
</div> </div>
<div data-swiper-parallax="400" className="slide-text"> <div data-swiper-parallax="400" className="slide-text">
<p>We can taking small steps and making small changes.</p> <p>Your career deserves a global gateway.</p>
</div> </div>
<div className="clearfix"></div> <div className="clearfix"></div>
<div className="slide-btns"> <div className="slide-btns">
<Link href="/about" className="theme-btn">Join The Campaign</Link> <Link href="/our-approach" className="theme-btn">View More</Link>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div className="hero-slide"> <div className="hero-slide">
<div className="slide-inner slide-bg-image" style={{ backgroundImage: `url(${'images/slider/slide-3.jpg'})` }}> <div className="slide-inner slide-bg-image" style={{ backgroundImage: `url(${'images/home/banner/banner-3.webp'})` }}>
<div className="container-fluid"> <div className="container-fluid">
<div className="slide-content"> <div className="slide-content">
<div data-swiper-parallax="300" className="slide-title"> <div data-swiper-parallax="300" className="slide-title">
<h2>Wisdom. Freedom. Hope.</h2> <h2>Investor & Business Immigration</h2>
</div> </div>
<div data-swiper-parallax="400" className="slide-text"> <div data-swiper-parallax="400" className="slide-text">
<p>We can taking small steps and making small changes.</p> <p>Building futures through business opportunities.</p>
</div> </div>
<div className="clearfix"></div> <div className="clearfix"></div>
<div className="slide-btns"> <div className="slide-btns">
<Link href="/about" className="theme-btn">Join The Campaign</Link> <Link href="/services" className="theme-btn">View More</Link>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div className="hero-slide"> <div className="hero-slide">
<div className="slide-inner slide-bg-image" style={{ backgroundImage: `url(${'images/slider/slide-4.jpg'})` }}> <div className="slide-inner slide-bg-image" style={{ backgroundImage: `url(${'images/home/banner/banner-4.webp'})` }}>
<div className="container-fluid"> <div className="container-fluid">
<div className="slide-content"> <div className="slide-content">
<div data-swiper-parallax="300" className="slide-title"> <div data-swiper-parallax="300" className="slide-title">
<h2>Wisdom. Freedom. Hope.</h2> <h2>Deportation Defense & Legal Representation</h2>
</div> </div>
<div data-swiper-parallax="400" className="slide-text"> <div data-swiper-parallax="400" className="slide-text">
<p>We can taking small steps and making small changes.</p> <p>Fighting for your right to stay.</p>
</div> </div>
<div className="clearfix"></div> <div className="clearfix"></div>
<div className="slide-btns"> <div className="slide-btns">
<Link href="/about" className="theme-btn">Join The Campaign</Link> <Link href="/contact" className="theme-btn">View More</Link>
</div> </div>
</div> </div>
</div> </div>

View File

@ -13,7 +13,7 @@ import BlogSection from '../components/BlogSection/BlogSection';
import InstagramSection from '../components/InstagramSection/InstagramSection'; import InstagramSection from '../components/InstagramSection/InstagramSection';
import Donors from '../components/Donors/Donors'; import Donors from '../components/Donors/Donors';
import PartnerSection from '../components/PartnerSection/PartnerSection'; import PartnerSection from '../components/PartnerSection/PartnerSection';
import abimg from '/public/images/about.jpg' import introImg from '/public/images/home/expert-immigration-guidance.webp'
import FunFactVideo from '../components/FunFactVideo/FunFactVideo'; import FunFactVideo from '../components/FunFactVideo/FunFactVideo';
import Footer from '../components/footer/Footer'; import Footer from '../components/footer/Footer';
import Scrollbar from '../components/scrollbar/scrollbar'; import Scrollbar from '../components/scrollbar/scrollbar';
@ -24,7 +24,7 @@ const HomePage = () => {
<Navbar hclass={'wpo-site-header-s1'} topbarNone={'topbar-none'} Logo={'/images/logo.svg'} /> <Navbar hclass={'wpo-site-header-s1'} topbarNone={'topbar-none'} Logo={'/images/logo.svg'} />
<Hero /> <Hero />
<Features sClass={'wpo-service-section-s2'} /> <Features sClass={'wpo-service-section-s2'} />
<About abimg={abimg} abClass={'wpo-about-section-s2'}/> <About introImg={introImg} abClass={'wpo-about-section-s2'}/>
<ServiceSection /> <ServiceSection />
<FunFact fnTpClass={'funfact-wrap-sec'} fnClass={'wpo-fun-fact-section-s3'} /> <FunFact fnTpClass={'funfact-wrap-sec'} fnClass={'wpo-fun-fact-section-s3'} />
<ServiceSectionS2 /> <ServiceSectionS2 />

Binary file not shown.

After

Width:  |  Height:  |  Size: 92 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 86 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 75 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 79 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 28 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 130 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 40 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 36 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 38 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 41 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 32 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 29 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 28 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 26 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 27 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 42 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 51 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 34 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 33 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 23 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 42 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 48 KiB

View File

@ -1,309 +1,205 @@
/*====================================== /*======================================
6. Home-style-3 6. Home-style-3
=======================================*/ =======================================*/
/* 6.1 wpo-features-s2 */ /* 6.1 wpo-features-s2 */
.wpo-features-s2 { .wpo-features-s2 {
.features-wrap { .features-wrap {
.feature-item { .feature-item {
padding: 44px 50px; padding: 44px 50px;
background: #d73a3e3d; background: rgba(215, 58, 62, 0.24); // #d73a3e3d
// box-shadow: 0px 2px 10px rgba(0, 18, 52, 0.15); border-radius: 20px;
border-radius: 20px; text-align: center;
text-align: center;
@media(max-width:1199px) { @media (max-width: 1199px) {
padding: 44px 30px; padding: 44px 30px;
} }
@media(max-width:991px) { @media (max-width: 991px) {
margin-bottom: 30px; margin-bottom: 30px;
} }
.icon { .icon {
width: 130px; width: 130px;
height: 130px; height: 130px;
line-height: 130px; border: 1px solid $theme-primary-color;
border: 1px solid $theme-primary-color; margin: auto;
margin: auto;
border-radius: 50%;
margin-bottom: 30px;
position: relative;
.fi {
&:before {
font-size: 60px;
background: $theme-primary-color-gradient;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
}
}
.feature-text {
h2 {
font-weight: 450;
font-size: 30px;
line-height: 38px;
text-align: center;
a {
color: $dark-gray;
&:hover {
color: $theme-primary-color;
}
}
}
p {
margin-bottom: 0;
}
}
}
}
.features-dot {
width: 100%;
height: 100%;
left: 56%;
top: 8%;
}
.icon i.fi {
position: absolute;
left: 32px;
top: 0;
}
.dots {
width: 15px;
height: 15px;
background: $theme-primary-color-gradient;
border-radius: 50%; border-radius: 50%;
left: 25px; margin-bottom: 30px;
top: 0;
position: relative; position: relative;
// Flexbox center for image
display: flex;
align-items: center;
justify-content: center;
background-color: #fff; // optional keeps circle filled
.feature-img {
width: 60px; // adjust as needed
height: 60px;
object-fit: contain;
display: block;
}
}
.feature-text {
h2 {
font-weight: 450;
font-size: 30px;
line-height: 38px;
text-align: center;
a {
color: $dark-gray;
text-decoration: none;
&:hover {
color: $theme-primary-color;
}
}
}
p {
margin-bottom: 0;
}
}
} }
}
.features-content h2 { .features-dot {
font-size: 22px; position: absolute;
font-weight: 600; top: 0;
margin-bottom: 15px; left: 0;
margin-top: 10px; width: 100%; // same size as icon
} height: 100%;
transform-origin: center center; // rotate around center
.features-dot:nth-child(1) {
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-animation: features-dot_1 2s infinite linear;
-moz-animation: features-dot_1 2s infinite linear;
-o-animation: features-dot_1 2s infinite linear;
animation: features-dot_1 2s infinite linear;
-webkit-animation-play-state: paused;
-moz-animation-play-state: paused;
-o-animation-play-state: paused;
animation-play-state: paused;
}
.feature-item .features-wrapper:hover .features-dot:nth-child(1) {
-webkit-animation-play-state: running;
-moz-animation-play-state: running;
-o-animation-play-state: running;
animation-play-state: running;
}
@-webkit-keyframes features-dot_1 {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-moz-keyframes features-dot_1 {
0% {
-moz-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-moz-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-o-keyframes features-dot_1 {
0% {
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes features-dot_1 {
0% {
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes features-dot_2 {
0% {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
100% {
-webkit-transform: rotate(540deg);
transform: rotate(540deg);
}
}
@-moz-keyframes features-dot_2 {
0% {
-moz-transform: rotate(180deg);
transform: rotate(180deg);
}
100% {
-moz-transform: rotate(540deg);
transform: rotate(540deg);
}
}
@-o-keyframes features-dot_2 {
0% {
-o-transform: rotate(180deg);
transform: rotate(180deg);
}
100% {
-o-transform: rotate(540deg);
transform: rotate(540deg);
}
}
@keyframes features-dot_2 {
0% {
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);
}
100% {
-webkit-transform: rotate(540deg);
-moz-transform: rotate(540deg);
-o-transform: rotate(540deg);
transform: rotate(540deg);
}
}
} }
.dots {
width: 15px;
height: 15px;
background: $theme-primary-color-gradient;
border-radius: 50%;
left: 25px;
top: 0;
position: relative;
}
.features-content {
h2 {
font-size: 22px;
font-weight: 600;
margin-bottom: 15px;
margin-top: 10px;
}
}
.features-dot:nth-child(1) {
transform: rotate(0deg);
animation: features-dot_1 2s infinite linear;
animation-play-state: paused;
}
.feature-item .features-wrapper:hover .features-dot:nth-child(1) {
animation-play-state: running;
}
@keyframes features-dot_1 {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
@keyframes features-dot_2 {
0% {
transform: rotate(180deg);
}
100% {
transform: rotate(540deg);
}
}
}
/* 6.2 wpo-about-section-s3 */ /* 6.2 wpo-about-section-s3 */
.wpo-about-section-s3 { .wpo-about-section-s3 {
@media(max-width:991px) { @media (max-width: 991px) {
padding-top: 70px; padding-top: 70px;
}
@media (max-width: 575px) {
padding-top: 50px;
}
.wpo-about-wrap {
.wpo-about-img {
padding: 0;
border: 0;
margin-left: -80px;
@media (max-width: 991px) {
margin-left: 0;
}
.wpo-about-img-text {
display: none;
}
} }
@media(max-width:575px) { .wpo-about-text {
padding-top: 50px; @media (max-width: 991px) {
} margin-top: 30px;
}
.wpo-about-wrap {
.wpo-about-img {
padding: 0;
border: 0;
margin-left: -80px;
@media(max-width:991px) {
margin-left: 0;
}
.wpo-about-img-text{
display: none;
}
}
.wpo-about-text {
@media(max-width:991px) {
margin-top: 30px;
}
}
} }
}
} }
/* 6.3 wpo-fun-fact-section-s3 */ /* 6.3 wpo-fun-fact-section-s3 */
.funfact-wrap-sec {
.funfact-wrap-sec{ .funfact-video {
.funfact-video{ display: none;
display: none; }
}
} }
.wpo-fun-fact-section-s3 { .wpo-fun-fact-section-s3 {
padding-bottom: 0; padding-bottom: 0;
background: linear-gradient(90deg, #c12026 11.32%, #c12026 95.28%); background: linear-gradient(90deg, #c12026 11.32%, #c12026 95.28%);
position: relative;
&:before { &:before {
position: absolute; position: absolute;
left: 0; left: 0;
top: 0; top: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
content: ""; content: "";
background: url(/images/particale.png) no-repeat center center; background: url(/images/particale.png) no-repeat center center;
background-size: cover; background-size: cover;
} }
.wpo-fun-fact-wrap { .wpo-fun-fact-wrap {
.wpo-fun-fact-grids { .wpo-fun-fact-grids {
padding: 80px 0 70px; padding: 80px 0 70px;
@media(max-width:1199px){ @media (max-width: 1199px) {
padding: 50px 0 40px; padding: 50px 0 40px;
} }
.grid+.grid:before {
background: $white; .grid + .grid:before {
} background: $white;
} }
} }
}
} }
/* 6.4 wpo-campaign-area-s3 */ /* 6.4 wpo-campaign-area-s3 */
.wpo-campaign-area-s3 { .wpo-campaign-area-s3 {
margin: 0; margin: 0;
.shape-left,
.shape-right { .shape-left,
display: none; .shape-right {
} display: none;
} }
}

View File

@ -26,24 +26,27 @@ import develop1 from '/public/images/service/develop/img-1.jpg'
import develop2 from '/public/images/service/develop/img-2.jpg' import develop2 from '/public/images/service/develop/img-2.jpg'
import develop3 from '/public/images/service/develop/img-3.jpg' import develop3 from '/public/images/service/develop/img-3.jpg'
import iconImg1 from '/public/images/home/icons/strategic-planning.webp'
import iconImg2 from '/public/images/home/icons/expert-preparation.webp'
import iconImg3 from '/public/images/home/icons/ongoing-support.webp'
export const featuresData = [ export const featuresData = [
{ {
icon: "fi flaticon-charity", img: iconImg1,
title: "Strategic Planning", title: "Strategic Planning",
link: "/team", link: "/team",
description: description:
"We create custom legal strategies based on immigration law, policy changes, and your needs." "We create custom legal strategies based on immigration law, policy changes, and your needs."
}, },
{ {
icon: "fi flaticon-conference-1", img: iconImg2,
title: "Expert Preparation", title: "Expert Preparation",
link: "/campaign", link: "/campaign",
description: description:
"Careful document preparation, evidence gathering, and filing to boost your application success." "Careful document preparation, evidence gathering, and filing to boost your application success."
}, },
{ {
icon: "fi flaticon-community", img: iconImg3,
title: "Ongoing Support", title: "Ongoing Support",
link: "/volunteer", link: "/volunteer",
description: description:
@ -51,7 +54,6 @@ export const featuresData = [
} }
]; ];
export const TabServices = [ export const TabServices = [
{ {
sTitle: "Reunite With Loved Ones", sTitle: "Reunite With Loved Ones",
@ -257,4 +259,5 @@ export const MissionVision = [
ssImg1: sSingleimg1, ssImg1: sSingleimg1,
ssImg2: sSingleimg2, ssImg2: sSingleimg2,
}, },
] ]