responsive updated

src/app/about-us/page.tsx

@@ -37,7 +37,7 @@ export default function Home2() {
                 <WhyChooseTwo />
                 <HistoryTwo />
                 <BrandSection />
-                <TestimonialsSection />
+                <TestimonialsSection className="section-space-bottom" />
                 <ContactSection />
             </main>
             <Footer1 />

src/app/globals.css

@@ -813,6 +813,7 @@ body {
   border-right: 2px solid transparent;
   border-top: none;
   border-bottom: none;
+  align-items: center;
 }
 
 .fo-item:hover .fo-card-top,
@@ -5416,7 +5417,7 @@ body {
   top: 62%;
 }
 
-@media (max-width: 991px) {
+@media (max-width: 767px) {
   .history-two__wrapper {
     border: none;
     padding-bottom: 0;
@@ -5429,7 +5430,7 @@ body {
 
   .history-two__border,
   .history-two__border--left {
-    margin: 25px 0 40px 0 !important;
+    margin: 25px 0 30px 0 !important;
   }
 
   .history-two__content::before,
@@ -7046,6 +7047,12 @@ body {
   /* padding: 80px 0 80px; */
 }
 
+@media (max-width: 1920px) and (min-width: 1440px) {
+  .counselling-solutions {
+    padding-bottom: 90px !important;
+  }
+}
+
 /* .counselling-solutions .sec-title {
   padding-bottom: 20px;
 } */
@@ -8267,25 +8274,26 @@ body {
 }
 
 .projects-one__filter__list button.list-unstyled-item {
-  cursor: pointer;
-  border: none !important;
-  position: relative;
-  display: block;
   background: linear-gradient(90deg, #3779b9 0%, #1a1f2b 50%, #3779b9 100%) !important;
-  color: white !important;
+  background-size: 200% auto !important;
-  transition: all 500ms ease;
-  text-transform: capitalize;
-  padding: 12.5px 25px;
-  font-size: 18px;
-  font-weight: 700;
-  line-height: 25px;
   border-radius: 10px !important;
-  outline: none;
+  color: #fff !important;
+  padding: 15px 30px !important;
+  border: none !important;
+  transition: all 0.5s ease-6ms !important;
+  display: inline-flex !important;
+  align-items: center !important;
+  justify-content: center !important;
+  gap: 8px !important;
+  text-decoration: none !important;
+  background-position: left center !important;
+  font-weight: 700 !important;
+  cursor: pointer;
 }
 
 .projects-one__filter__list button.list-unstyled-item.active,
 .projects-one__filter__list button.list-unstyled-item:hover {
-  background: linear-gradient(90deg, #3779b9 0%, #1a1f2b 50%, #3779b9 100%) !important;
+  /* background: linear-gradient(90deg, #3779b9 0%, #1a1f2b 50%, #3779b9 100%) !important; */
   color: var(--pelocis-white, #fff) !important;
   opacity: 0.85;
 }
@@ -13216,11 +13224,11 @@ body {
 
 @media (max-width: 1200px) {
     
-  .brand-section{
+  /* .brand-section{
 
     padding-top: 90px !important;
 
-  }
+  } */
 
   .home-contact-one .appointment__form__top .sec-title__title{
 
@@ -13258,13 +13266,6 @@ body {
 
 }
 
-.section-space{
-
-  padding-top: 50px !important;
-  padding-bottom: 50px !important;
-
-}
-
 .counselling-solutions__title{
 
   padding-top: 30px;
@@ -13337,3 +13338,16 @@ body {
     }
 
 }
+@media (max-width:1400px) and (min-width:501px) {
+  .contact-area .contact-info-item .content h6 {
+    font-size: 16px !important;
+  }
+}
+@media (max-width: 991px) {
+  .history-two__content--left::before,
+  .history-two__content--left::after,
+  .history-two__content::before,
+  .history-two__content::after {
+    display: none;
+  }
+}

src/components/careers/FaqVideoSection.tsx

@@ -189,7 +189,7 @@ const FaqVideoSection = () => {
                 </div >
             </section >
 
-            <section className="video-three wow fadeInUp" data-wow-delay="200ms">
+            <section className="video-three section-space-bottom wow fadeInUp" data-wow-delay="200ms">
                 <div className="container">
                     <div
                         className="video-three__inner"

src/components/home/home-1/TestimonialsSection.tsx

@@ -4,7 +4,7 @@ import Slider from "react-slick";
 import Link from "next/link";
 import GoogleReviewsBranding from "@/components/common/GoogleReviewsBranding";
 
-const TestimonialsSection = () => {
+const TestimonialsSection = ({ className = "section-space" }: { className?: string }) => {
     const [reviews, setReviews] = useState<any[]>([]);
     const [loading, setLoading] = useState(true);
 
@@ -68,7 +68,7 @@ const TestimonialsSection = () => {
     }
 
     return (
-        <section className="testimonials-two-section fix section-space">
+        <section className={`testimonials-two-section fix ${className}`}>
             <div className="container-fluid g-0">
                 <div className="row g-0">
                     <div className="col-xxl-4 col-xl-4 col-lg-12">

src/components/layout/Footer1.tsx

@@ -50,7 +50,7 @@ const Footer1 = () => {
                                         <img src="/assets/img-app/logo.webp" alt="footer logo" />
                                     </figure>
                                     <p className="mt-20 mb-40">Metatroncube Software Solutions: Where innovation meets execution to elevate your digital presence. Partner with us for bespoke web and app development that powers your business growth.</p>
-                                    <div className="footer-socials">
+                                    <div className="footer-socials mb-20">
                                         <span>
                                             <a href="https://www.facebook.com/metatroncubecanada" target="_blank" rel="noopener noreferrer">
                                                 <i className="fa-brands fa-facebook-f"></i>

src/components/mobile-app-development-service/style-app.css

@@ -19357,7 +19357,7 @@ img {
   }
 
   .homepage1-body .row-bg3 {
-    padding: 20px 5px;
+    padding: 20px 5px !important;
   }
 
   .vl-header-action-item {

src/components/web-development-service/style.css

@@ -19567,7 +19567,7 @@ img {
   }
 
   .homepage1-body .row-bg3 {
-    padding: 20px 5px;
+    padding: 20px 5px !important;
   }
 
   .vl-header-action-item {