MetatroncubeSoftwareSolutions/rapharehap
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: MetatroncubeSoftwareSolutions:559c354e44d4a3fd114b15dd3f785e0c035bacc5
Branches Tags
MetatroncubeSoftwareSolutions:main
MetatroncubeSoftwareSolutions:team
MetatroncubeSoftwareSolutions:test
...
compare: MetatroncubeSoftwareSolutions:d5a1292ff71b6801f260794775333bfb252d8a64
Branches Tags
MetatroncubeSoftwareSolutions:main
MetatroncubeSoftwareSolutions:team
MetatroncubeSoftwareSolutions:test

4 Commits
559c354e44 ... d5a1292ff7

Author SHA1 Message Date
Alaguraj0361
d5a1292ff7 home page services and area of injury section updated in dynamicaly 2025-08-29 18:34:21 +05:30
vidhubk
2f4f8a5a2a Merge branch 'team' of https://git.metatroncube.in/MetatroncubeSoftwareSolutions/rapharehap into team 2025-08-29 17:34:51 +05:30
vidhubk
6b62aafca4 Header Menu - Services, Mobile Menu - all pages 2025-08-29 17:31:01 +05:30
selvi
26c7edaf79 header responsive updated 2025-08-29 17:02:31 +05:30
13 changed files with 293 additions and 233 deletions
Show Stats Expand all files Collapse all files

4
app/etobicoke-treatment-service/[slug]/page.js
View File

@ -19,7 +19,9 @@ export default function ServiceDetailPage({ params }) {
}
return (
<Layout headerStyle={2} footerStyle={1} breadcrumbTitle={service.shortTitle}>
<Layout headerStyle={2} footerStyle={1}
breadcrumbTitle={service.shortTitle}
bannerImage={service.bannerImage}>
<ServiceDetailClient slug={slug} service={service} servicesList={servicesList} />
</Layout>
);

4
app/layout.js
View File

@ -8,8 +8,8 @@ import "swiper/css/pagination"
import 'swiper/css/free-mode';
import { poppins } from '@/lib/font'
export const metadata = {
title: 'Medimart Template',
description: 'Generated by create next app',
title: 'Best Pain Relief & Physiotherapy - Repharehab Clinic',
description: 'Best pain relief physiotherapy clinic',
}
export default function RootLayout({ children }) {

20
components/layout/Menu.js
View File

@ -3,6 +3,7 @@ import Link from "next/link"
import Rehabilitation from "@/utils/Rehabilitation.utils"
import Accident from "@/utils/Accident.utils"
import { areaOfInjuryData } from "@/utils/AreaOfInjery.utils"
import { servicesList } from "@/utils/Services.utils"
export default function Menu() {
// const router = useRouter()
@ -28,19 +29,18 @@ export default function Menu() {
<li><Link href="/our-team-physiotherapy-etobicoke">Our Team</Link></li>
<li><Link href="/ourapproach-physiotherapy-etobicoke">Our Approach</Link></li>
<li><Link href="/gallery-physiotherapy-etobicoke">Gallery</Link></li>
{/* <li><Link href="/service-details-3">Neurosurgery</Link></li> */}
<li><Link href="/covid-19-updates">Covid-19-Updates</Link></li>
</ul>
</li>
<li className="dropdown"><Link href="/">Services</Link>
<ul>
<li><Link href="/service">Our Services</Link></li>
<li><Link href="/service-details">Cardiology</Link></li>
<li><Link href="/service-details-2">Dental Clinic</Link></li>
<li><Link href="/service-details-3">Neurosurgery</Link></li>
<li><Link href="/service-details-4">Medical</Link></li>
<li><Link href="/service-details-5">Pediatrics</Link></li>
<li><Link href="/service-details-6">Modern Laboratory</Link></li>
{/* ... (similarly for other service items) */}
{servicesList.map(item => (
<li key={item.id}>
<Link href={`/etobicoke-treatment-service/${item.slug}`}>
{item.shortTitle}
</Link>
</li>
))}
</ul>
</li>
{/* <li className="dropdown"><Link href="/">Team</Link>
@ -108,7 +108,7 @@ export default function Menu() {
</li>
{/* Contact */}
<li><Link href="/contact">Contact</Link></li>
<li><Link href="/contact-us">Contact</Link></li>
</ul>
</>

102
components/layout/MobileMenu.js
View File

@ -1,6 +1,11 @@
'use client'
import Link from "next/link";
import { useState } from "react";
import { servicesList } from "@/utils/Services.utils";
import { areaOfInjuryData } from "@/utils/AreaOfInjery.utils"
import Rehabilitation from "@/utils/Rehabilitation.utils"
import Accident from "@/utils/Accident.utils"
export default function MobileMenu({ isSidebar, handleMobileMenu, handleSidebar }) {
const [isActive, setIsActive] = useState({
@ -41,62 +46,111 @@ export default function MobileMenu({ isSidebar, handleMobileMenu, handleSidebar
className="collapse navbar-collapse show clearfix"
id="navbarSupportedContent">
<ul className="navigation clearfix">
<li><Link href="/">Home</Link></li>
<li className={isActive.key == 1 ? "dropdown current" : "dropdown"}>
<Link href="/" >Home</Link>
<Link href="/" >About Us</Link>
<ul style={{ display: `${isActive.key == 1 ? "block" : "none"}` }}>
<li><Link href="/"onClick={handleMobileMenu}>Home Page One</Link></li>
<li><Link href="/index-2" onClick={handleMobileMenu}>Home Page Two</Link></li>
<li><Link href="/index-3" onClick={handleMobileMenu}>Home Page Three</Link></li>
<li><Link href="/onepage" onClick={handleMobileMenu}>One Page Home</Link></li>
<li><Link href="/our-team-physiotherapy-etobicoke" onClick={handleMobileMenu}>Our Team</Link></li>
<li><Link href="/ourapproach-physiotherapy-etobicoke" onClick={handleMobileMenu}>Our Approach</Link></li>
<li><Link href="/gallery-physiotherapy-etobicoke" onClick={handleMobileMenu}>Gallery</Link></li>
</ul>
<div className={isActive.key == 1 ? "dropdown-btn open" : "dropdown-btn"} onClick={() => handleToggle(1)}><span className="fa fa-angle-right" /></div>
</li>
<li><Link href="/about-us">About</Link></li>
{/* <li><Link href="/about-us">About</Link></li> */}
<li className={isActive.key == 2 ? "dropdown current" : "dropdown"}>
<Link href="/#">Services</Link>
<Link href="/etobicoke-treatment-service">Services</Link>
<ul style={{ display: `${isActive.key == 2 ? "block" : "none"}` }}>
<li><Link href="/service" onClick={handleMobileMenu}>Our Services</Link></li>
{/* <li><Link href="/service" onClick={handleMobileMenu}>Our Services</Link></li>
<li><Link href="/service-details" onClick={handleMobileMenu}>Cardioligy</Link></li>
<li><Link href="/service-details-2" onClick={handleMobileMenu}>Dental Clinic</Link></li>
<li><Link href="/service-details-3" onClick={handleMobileMenu}>NeuroSergery</Link></li>
<li><Link href="/service-details-4" onClick={handleMobileMenu}>Medical</Link></li>
<li><Link href="/service-details-5" onClick={handleMobileMenu}>Pediatrics</Link></li>
<li><Link href="/service-details-6" onClick={handleMobileMenu}>Modern Laboratory</Link></li>
<li><Link href="/service-details-6" onClick={handleMobileMenu}>Modern Laboratory</Link></li> */}
{servicesList.map(item => (
<li key={item.id}>
<Link href={`/etobicoke-treatment-service/${item.slug}`}>
{item.shortTitle}
</Link>
</li>
))}
</ul>
<div className={isActive.key == 2 ? "dropdown-btn open" : "dropdown-btn"} onClick={() => handleToggle(2)}><span className="fa fa-angle-right" /></div>
</li>
<li className={isActive.key == 3 ? "dropdown current" : "dropdown"}>
<Link href="/#">Team</Link>
<Link href="/area-of-injury">Area of Injury</Link>
<ul style={{ display: `${isActive.key == 3 ? "block" : "none"}` }}>
<li><Link href="/team" onClick={handleMobileMenu}>Our Team</Link></li>
<li><Link href="/team-details" onClick={handleMobileMenu}>Team Details</Link></li>
{/* <li><Link href="/team" onClick={handleMobileMenu}>Our Team</Link></li>
<li><Link href="/team-details" onClick={handleMobileMenu}>Team Details</Link></li> */}
{areaOfInjuryData.map(item => (
<li key={item.id}>
<Link href={`/area-of-injury/${item.slug}`}>
{item.title}
</Link>
</li>
))}
</ul>
<div className={isActive.key == 3 ? "dropdown-btn open" : "dropdown-btn"} onClick={() => handleToggle(3)}><span className="fa fa-angle-right" /></div>
</li>
<li className={isActive.key == 4 ? "dropdown current" : "dropdown"}>
<Link href="/#">Pages</Link>
<Link href="/rehabilitation">Rehabilitation</Link>
<ul style={{ display: `${isActive.key == 4 ? "block" : "none"}` }}>
<li className={isActive.subMenuKey == 5 ? "dropdown current" : "dropdown"}><Link href="/#">News</Link>
{/* <li className={isActive.subMenuKey == 5 ? "dropdown current" : "dropdown"}><Link href="/#">News</Link>
<ul style={{ display: `${isActive.subMenuKey == 5 ? "block" : "none"}` }}>
<li><Link href="/blog" onClick={handleMobileMenu}>Blog Grid</Link></li>
<li><Link href="/blog-2" onClick={handleMobileMenu}>Blog Sidebar</Link></li>
<li><Link href="/blog-details" onClick={handleMobileMenu}>Blog Details</Link></li>
</ul>
<div className={isActive.subMenuKey == 5 ? "dropdown-btn open" : "dropdown-btn"} onClick={() => handleToggle(4,5)}><span className="fa fa-angle-right" /></div>
</li>
<li><Link href="/tesmonial" onClick={handleMobileMenu}>Tesmonial</Link></li>
<li><Link href="/works" onClick={handleMobileMenu}>How it works</Link></li>
<li><Link href="/chooseus" onClick={handleMobileMenu}>Why Choose Us</Link></li>
<li><Link href="/pricing-table" onClick={handleMobileMenu}>Pricing-Table</Link></li>
<li><Link href="/faq" onClick={handleMobileMenu}>Faq's</Link></li>
<li><Link href="/gallery" onClick={handleMobileMenu}>Gallery</Link></li>
<li><Link href="/appointment" onClick={handleMobileMenu}>Make Appointment</Link></li>
<li><Link href="/error-page" onClick={handleMobileMenu}>Page Not Found</Link></li>
</li> */}
{Rehabilitation.map(item => (
<li key={item.id}>
<Link href={`/rehabilitation/${item.slug}`}>
{item.title}
</Link>
</li>
))}
</ul>
<div className={isActive.key == 4 ? "dropdown-btn open" : "dropdown-btn"} onClick={() => handleToggle(4)}><span className="fa fa-angle-right" /></div>
</li>
<li><Link href="/contact" onClick={handleMobileMenu}>Contact</Link></li>
<li className={isActive.key == 5 ? "dropdown current" : "dropdown"}>
<Link href="/accident">Accident</Link>
<ul style={{ display: `${isActive.key == 5 ? "block" : "none"}` }}>
{/* <li className={isActive.subMenuKey == 5 ? "dropdown current" : "dropdown"}><Link href="/#">News</Link>
<ul style={{ display: `${isActive.subMenuKey == 5 ? "block" : "none"}` }}>
<li><Link href="/blog" onClick={handleMobileMenu}>Blog Grid</Link></li>
<li><Link href="/blog-2" onClick={handleMobileMenu}>Blog Sidebar</Link></li>
<li><Link href="/blog-details" onClick={handleMobileMenu}>Blog Details</Link></li>
</ul>
<div className={isActive.subMenuKey == 5 ? "dropdown-btn open" : "dropdown-btn"} onClick={() => handleToggle(4,5)}><span className="fa fa-angle-right" /></div>
</li> */}
{Rehabilitation.map(item => (
<li key={item.id}>
<Link href={`/rehabilitation/${item.slug}`}>
{item.title}
</Link>
</li>
))}
</ul>
<div className={isActive.key == 5 ? "dropdown-btn open" : "dropdown-btn"} onClick={() => handleToggle(5)}><span className="fa fa-angle-right" /></div>
</li>
<li><Link href="/contact-us" onClick={handleMobileMenu}>Contact</Link></li>
</ul>
</div>
</div>

10
components/layout/header/Header2.js
View File

@ -14,14 +14,17 @@ export default function Header2({ scroll, isMobileMenu, handleMobileMenu, isSide
<div className="top-inner">
<ul className="info-list clearfix">
<li>
<img src="/assets/images/icons/icons-17.png" alt="Phone" style={{ marginRight: "8px" }} />
<img src="/assets/images/icons/call.png" alt="Phone" style={{ marginRight: "8px" }} />
<Link href="tel:647-722-3434">647-722-3434</Link>
</li>
<li>
<img src="/assets/images/icons/icons-19.png" alt="Mail" style={{ marginRight: "8px" }} />
<img src="/assets/images/icons/mail.png" alt="Mail" style={{ marginRight: "8px" }} />
<Link href="mailto:info@rapharehab.ca">info@rapharehab.ca</Link>
</li>
</ul>
<ul className="social-links clearfix">
<li>
<Link href="/why-rapha-physiotherapy-etobicoke">Why Us</Link>
</li>
@ -34,9 +37,6 @@ export default function Header2({ scroll, isMobileMenu, handleMobileMenu, isSide
<li>
<Link href="/payment-insurance">Payment And Insurance</Link>
</li>
</ul>
<ul className="social-links clearfix">
<li><Link href="/"><i className="icon-4"></i></Link></li>
<li><Link href="/"><i className="icon-5"></i></Link></li>
<li><Link href="/"><i className="icon-6"></i></Link></li>

13
components/sections/home/AreaOfInjury.js
View File

@ -1,5 +1,6 @@
import React from 'react';
import Link from "next/link"
import { areaOfInjuryData } from '@/utils/AreaOfInjery.utils';
export default function AreaOfInjury() {
const teamMembers = [
{ name: 'Black Marvin', role: 'Medical Assistant', image: 'assets/images/team/team-1.jpg' },
@ -31,21 +32,21 @@ export default function AreaOfInjury() {
</h3>
</div>
<div className="row clearfix">
{teamMembers.map((member, index) => (
{areaOfInjuryData.slice(0, 8).map((area, index) => (
<div key={index} className="col-lg-3 col-md-6 col-6 team-block">
<div className="team-block-one wow fadeInUp animated" data-wow-delay={`${index * 200}ms`} data-wow-duration="1500ms">
<div className="inner-box">
<div className="image-box">
<figure className="image"><img src={member.image} alt={`${member.name}'s photo`} /></figure>
<ul className="social-links clearfix">
<figure className="image"><img src={area.image} alt={`${area.name}'s photo`} /></figure>
{/* <ul className="social-links clearfix">
<li><Link href="/#"><i className="icon-4"></i></Link></li>
<li><Link href="/#"><i className="icon-5"></i></Link></li>
<li><Link href="/#"><i className="icon-6"></i></Link></li>
<li><Link href="/#"><i className="icon-7"></i></Link></li>
</ul>
</ul> */}
</div>
<div className="lower-content">
<h3><Link href="team-details">{member.name}</Link></h3>
<h3><Link href={`/area-of-injury/${area.slug}`}>{area.title}</Link></h3>
{/* <span className="designation">{member.role}</span> */}
</div>
</div>
@ -54,7 +55,7 @@ export default function AreaOfInjury() {
))}
<div className='col-12 text-center'>
<div className="btn-box">
<Link href="index-2" className="theme-btn btn-one"><span>View All</span></Link>
<Link href="/area-of-injury" className="theme-btn btn-one"><span>View All</span></Link>
</div>
</div>
</div>

67
components/sections/home/MobileServicesSection.js
View File

@ -1,3 +1,4 @@
import { servicesList } from "@/utils/Services.utils"
import Link from "next/link"
@ -11,54 +12,26 @@ export default function MobileServices() {
<h2>We Offer For You Medical & <br />Saving Lives</h2>
</div>
<div className="row clearfix">
<div className="col-lg-3 col-md-6 col-6 feature-block">
<div className="feature-block-one">
<div className="inner-box text-center">
<div className="icon-box"><i className="icon-9"></i></div>
<h3><Link href="/">Qualified Doctor</Link></h3>
<div className="btn-box">
<Link href="index-2" className="theme-btn-2 btn-one"><span>View Services</span></Link>
{
servicesList?.slice(0, 8)?.map((service, index) => {
return (
<div className="col-lg-3 col-md-6 col-6 feature-block" key={index}>
<div className="feature-block-one">
<div className="inner-box text-center">
<div className="icon-box"><i className="icon-9"></i></div>
<h3><Link href="/"> {service?.title?.length > 20
? service.title.slice(0, 20) + "..."
: service.title}</Link></h3>
<div className="btn-box">
<Link href="index-2" className="theme-btn-2 btn-one"><span>View Services</span></Link>
</div>
{/* <p>Lorem ipsum dolor sit amet ctetur adipiscing</p> */}
</div>
</div>
</div>
{/* <p>Lorem ipsum dolor sit amet ctetur adipiscing</p> */}
</div>
</div>
</div>
<div className="col-lg-3 col-md-6 col-6 feature-block">
<div className="feature-block-one">
<div className="inner-box text-center">
<div className="icon-box"><i className="icon-10"></i></div>
<h3><Link href="/">Emergency Help</Link></h3>
<div className="btn-box">
<Link href="index-2" className="theme-btn-2 btn-one"><span>View Services</span></Link>
</div>
{/* <p>Lorem ipsum dolor sit amet ctetur adipiscing</p> */}
</div>
</div>
</div>
<div className="col-lg-3 col-md-6 col-6 feature-block">
<div className="feature-block-one">
<div className="inner-box text-center">
<div className="icon-box"><i className="icon-11"></i></div>
<h3><Link href="/">Modern Equipment</Link></h3>
<div className="btn-box">
<Link href="index-2" className="theme-btn-2 btn-one"><span>View Services</span></Link>
</div>
{/* <p>Lorem ipsum dolor sit amet ctetur adipiscing</p> */}
</div>
</div>
</div>
<div className="col-lg-3 col-md-6 col-6 feature-block">
<div className="feature-block-one">
<div className="inner-box text-center">
<div className="icon-box"><i className="icon-12"></i></div>
<h3><Link href="/">Family Medicine</Link></h3>
<div className="btn-box">
<Link href="index-2" className="theme-btn-2 btn-one"><span>View Services</span></Link>
</div>
{/* <p>Lorem ipsum dolor sit amet ctetur adipiscing</p> */}
</div>
</div>
</div>
)
})
}
<div className='col-12 text-center'>
<div className="btn-box">

115
components/sections/home/ServicesSection.js
View File

@ -1,3 +1,4 @@
import { servicesList } from '@/utils/Services.utils';
import Link from 'next/link';
import React from 'react';
@ -10,93 +11,39 @@ export default function ServicesSection() {
<h2>We Offer For You Medical & <br />Saving Lives</h2>
</div>
<div className="row clearfix">
<div className="col-lg-4 col-md-6 col-sm-12 service-block">
<div className="service-block-one wow fadeInUp animated" data-wow-delay="00ms" data-wow-duration="1500ms">
<div className="inner-box">
<div className="image-box">
<figure className="image"><Link href="service-details-3"><img src="assets/images/service/service-1.jpg" alt="" /></Link></figure>
<div className="icon-box"><i className="icon-15"></i></div>
{
servicesList?.slice(0, 6)?.map((service, index) => {
return (
<div className="col-lg-4 col-md-6 col-sm-12 service-block" key={index}>
<div className="service-block-one wow fadeInUp animated" data-wow-delay="00ms" data-wow-duration="1500ms">
<div className="inner-box">
<div className="image-box">
<figure className="image"><Link href="service-details-3"><img src="assets/images/service/service-1.jpg" alt="" /></Link></figure>
<div className="icon-box"><i className="icon-15"></i></div>
</div>
<div className="lower-content">
<h3>
<Link href={`/etobicoke-treatment-service/${service.slug}`}>
{service?.title?.length > 25
? service.title.slice(0, 25) + "..."
: service.title}
</Link>
</h3>
<p>
{service?.shortDescription?.length > 70
? service.shortDescription.slice(0, 70) + "..."
: service.shortDescription}
</p>
</div>
</div>
</div>
</div>
<div className="lower-content">
<h3><Link href="service-details-3">Neurosurgery</Link></h3>
<p>Amet minim mollit non deserunt ullamco aliqua dolor do amet sint.</p>
</div>
</div>
</div>
</div>
<div className="col-lg-4 col-md-6 col-sm-12 service-block">
<div className="service-block-one wow fadeInUp animated" data-wow-delay="300ms" data-wow-duration="1500ms">
<div className="inner-box">
<div className="image-box">
<figure className="image"><Link href="service-details-6"><img src="assets/images/service/service-2.jpg" alt="" /></Link></figure>
<div className="icon-box"><i className="icon-16"></i></div>
</div>
<div className="lower-content">
<h3><Link href="service-details-6">Modern Laboratory</Link></h3>
<p>Amet minim mollit non deserunt ullamco aliqua dolor do amet sint.</p>
</div>
</div>
</div>
</div>
<div className="col-lg-4 col-md-6 col-sm-12 service-block">
<div className="service-block-one wow fadeInUp animated" data-wow-delay="600ms" data-wow-duration="1500ms">
<div className="inner-box">
<div className="image-box">
<figure className="image"><Link href="service-details"><img src="assets/images/service/service-3.jpg" alt="" /></Link></figure>
<div className="icon-box"><i className="icon-17"></i></div>
</div>
<div className="lower-content">
<h3><Link href="service-details">Experienced Doctors</Link></h3>
<p>Amet minim mollit non deserunt ullamco aliqua dolor do amet sint.</p>
</div>
</div>
</div>
</div>
<div className="col-lg-4 col-md-6 col-sm-12 service-block">
<div className="service-block-one wow fadeInUp animated" data-wow-delay="00ms" data-wow-duration="1500ms">
<div className="inner-box">
<div className="image-box">
<figure className="image"><Link href="service-details-3"><img src="assets/images/service/service-1.jpg" alt="" /></Link></figure>
<div className="icon-box"><i className="icon-15"></i></div>
</div>
<div className="lower-content">
<h3><Link href="service-details-3">Neurosurgery</Link></h3>
<p>Amet minim mollit non deserunt ullamco aliqua dolor do amet sint.</p>
</div>
</div>
</div>
</div>
<div className="col-lg-4 col-md-6 col-sm-12 service-block">
<div className="service-block-one wow fadeInUp animated" data-wow-delay="300ms" data-wow-duration="1500ms">
<div className="inner-box">
<div className="image-box">
<figure className="image"><Link href="service-details-6"><img src="assets/images/service/service-2.jpg" alt="" /></Link></figure>
<div className="icon-box"><i className="icon-16"></i></div>
</div>
<div className="lower-content">
<h3><Link href="service-details-6">Modern Laboratory</Link></h3>
<p>Amet minim mollit non deserunt ullamco aliqua dolor do amet sint.</p>
</div>
</div>
</div>
</div>
<div className="col-lg-4 col-md-6 col-sm-12 service-block">
<div className="service-block-one wow fadeInUp animated" data-wow-delay="600ms" data-wow-duration="1500ms">
<div className="inner-box">
<div className="image-box">
<figure className="image"><Link href="service-details"><img src="assets/images/service/service-3.jpg" alt="" /></Link></figure>
<div className="icon-box"><i className="icon-17"></i></div>
</div>
<div className="lower-content">
<h3><Link href="service-details">Experienced Doctors</Link></h3>
<p>Amet minim mollit non deserunt ullamco aliqua dolor do amet sint.</p>
</div>
</div>
</div>
</div>
)
})
}
<div className='col-12 text-center'>
<div className="btn-box">
<Link href="index-2" className="theme-btn btn-one"><span>View All Services</span></Link>
<Link href="/etobicoke-treatment-service" className="theme-btn btn-one"><span>View All Services</span></Link>
</div>
</div>
</div>

3
public/assets/css/module-css/team.css
View File

@ -102,7 +102,7 @@
.team-block-one .inner-box .lower-content h3{
display: block;
font-size: 20px;
line-height: 36px;
line-height: 30px;
font-weight: 600;
margin-bottom: 5px;
}
@ -327,6 +327,7 @@
.team-block-one .inner-box .lower-content h3{
font-size: 16px;
margin-bottom: 0px;
line-height: 24px;
}
}

188
public/assets/css/style.css
View File

@ -853,92 +853,165 @@ img {
}
/** header-top **/
.header-top{
.header-top {
position: relative;
width: 100%;
background: #bc0000;
padding: 15.5px 0px;
padding: 15.5px 0;
}
.header-top .top-inner{
.header-top .top-inner {
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: nowrap;
gap: 15px;
overflow-x: auto;
}
.header-top .top-inner .info-list li{
position: relative;
.header-top .top-inner .info-list {
display: flex;
align-items: center;
flex-wrap: nowrap;
gap: 30px;
margin: 0;
padding: 0;
list-style: none;
}
.header-top .top-inner .info-list li {
display: flex;
align-items: center;
color: #fff;
gap: 2px;
white-space: nowrap;
}
.header-top .top-inner .info-list li img {
width: 18px;
height: auto;
}
.header-top .top-inner .info-list li a {
display: inline-block;
color: #fff;
padding-left: 28px;
margin-right: 50px;
font-size: 15px;
text-decoration: none;
}
@media only screen and (max-width: 1440px) {
.header-top .top-inner .info-list li{
position: relative;
display: inline-block;
color: #fff;
padding-left: 28px;
margin-right: 25px;
}
@media only screen and (max-width: 500px) {
.header-top .top-inner .info-list li a {
font-size: 12px;
}
}
@media only screen and (max-width: 1024px) {
.header-top .top-inner .info-list li{
position: relative;
display: inline-block;
color: #fff;
padding-left: 28px;
margin-right: 25px;
}
@media only screen and (max-width: 320px) {
.header-top .top-inner .info-list li a {
font-size: 11px;
}
}
.header-top .top-inner .info-list li:last-child{
margin: 0px !important;
}
.header-top .top-inner .info-list li i{
position: absolute;
left: 0px;
top: 6px;
font-size: 18px;
color: #fff;
}
.header-top .top-inner .info-list li a{
display: inline-block;
color: #fff;
}
.header-top .top-inner .info-list li a:hover{
.header-top .top-inner .info-list li a:hover {
color: var(--secondary-color);
}
.header-top .top-inner .social-links li{
position: relative;
.header-top .top-inner .social-links {
display: flex;
align-items: center;
gap: 20px;
flex-wrap: nowrap;
margin: 0;
padding: 0;
list-style: none;
}
.header-top .top-inner .social-links li {
display: inline-block;
float: left;
margin-right: 30px;
}
.header-top .top-inner .social-links li:last-child{
margin: 0px !important;
}
.header-top .top-inner .social-links li a{
.header-top .top-inner .social-links li a {
display: inline-block;
font-size: 16px;
color: #fff;
transition: color 0.3s ease;
}
.header-top .top-inner .social-links li a:hover{
@media only screen and (max-width: 500px) {
.header-top .top-inner .social-links li a {
font-size: 11px;
}
}
@media only screen and (max-width: 320px) {
.header-top .top-inner .social-links li a {
font-size: 9px;
}
}
.header-top .top-inner .social-links li a:hover {
color: var(--secondary-color);
}
@media only screen and (max-width: 1024px) {
.header-top .top-inner {
gap: 10px;
}
.header-top .top-inner .info-list {
gap: 15px;
}
.header-top .top-inner .social-links {
gap: 15px;
}
}
@media only screen and (max-width: 768px) {
.header-top {
padding: 12px 10px;
}
.header-top .top-inner {
flex-direction: column;
align-items: center;
text-align: center;
gap: 8px;
}
.header-top .top-inner .info-list {
justify-content: center;
gap: 20px;
}
.header-top .top-inner .social-links {
justify-content: center;
gap: 20px;
}
}
@media only screen and (max-width: 500px) {
.header-top .top-inner .social-links {
justify-content: center;
gap: 12px;
}
}
@media only screen and (max-width: 320px) {
.header-top .top-inner .social-links {
justify-content: center;
gap: 11px;
}
}
@media only screen and (max-width: 500px) {
.header-top .top-inner .social-links li:nth-last-child(-n+4) {
display: none !important;
}
}
/** header-lower **/
.main-header .outer-box{
@ -2364,6 +2437,15 @@ button.ltr {
padding-right: 100px;
}
@media only screen and (max-width: 1200px) {
.header-style-two .header-top{
position: relative;
padding-left: 25px;
padding-right: 25px;
}
}
.header-style-two .header-lower .outer-container{
position: relative;
padding-left: 100px;

BIN
public/assets/images/icons/call.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 337 B

BIN
public/assets/images/icons/location.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 318 B

BIN
public/assets/images/icons/mail.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 276 B