/* Reset and Base Styles */

* {

  margin: 0;

  padding: 0;

  box-sizing: border-box;

}



body {

  font-family: Arial, sans-serif;

  line-height: 1.6;

  /* background-color: #f4f4f4; */

  background-color: #ffffff;

  color: #333;

  overflow-x: hidden !important;

}



/* ***************************************************** DROPDOWN CODE********************************************************************************** */

/* Custom CSS for dropdown functionality */



.nav-links li {

  position: relative; /* Needed for positioning the dropdown */

}



.nav-links li:last-child {

  margin-right: 0; /* Remove extra margin on the last item */

}



.nav-links a {

  display: block;

  text-decoration: none;

  color: #ffffff; /* From your existing CSS */

  font-size: 17px; /* From your existing CSS */

  font-weight: 500; /* Medium weight from Poppins, or use your specific value */

  border-radius: 0.5rem; /* For general button-like appearance */

  transition: background-color 0.3s ease;

}



/* Dropdown specific styles */

.dropdown-menu {

  display: none; /* Hidden by default */

  position: absolute;

  top: 100%; /* Changed from 140% */

  margin-top: 0px;

  background-color: #fff;

  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);

  list-style: none;

  padding: 0.5rem 0;

  margin: 0;

  min-width: 160px; /* Adjust as needed */

  z-index: 100; /* Ensure it appears above other content */

  border-radius: 0.5rem;

  margin-top: 5px;

  color: #000;

}



.dropdown-menu li {

  width: 100%; /* Ensure dropdown items take full width */

  margin-right: 0; /* Override any parent li margin */

  color: #000000 !important;

  /* background-color: wheat; */

  text-align: start;

}



.dropdown-menu li a {

  color: black !important;

  background-color: white !important;

}



.dropdown-menu a {

  padding: 0.5rem 1rem;

  color: black; /* Darker text for dropdown items */

  white-space: nowrap; /* Prevent text wrapping */

  font-size: 16px; /* Slightly smaller for dropdown items */

  font-weight: normal; /* Normal weight for dropdown items */

  border-radius: 0; /* No rounded corners for internal dropdown links */

}



.dropdown-menu a:hover {

  /* background-color: #f0f0f0; */

  background-color: #0096ff !important;

  color: white !important;

}



/* Show dropdown on hover */

.nav-links li:hover .dropdown-menu {

  display: block;

  color: #000000 !important;

}

/* *************************************************************************************************************************************** */



/*Temporary Hide*/



@media (min-width: 768px) {

  .tablet-service-slider-section {

    display: none !important;

  }

}

@media (max-width: 767px) {

  .property-slider-section,

  .final-service-slider-section,

  .slider-heading-section-container,

  .tablet-service-slider-section {

    display: none;

  }

}



/* ////////////////////////////////////////////////////////  TOP BANNER //////////////////////////////////////////////////////////////////////*/

/* Top Banner */

.top-banner {

  background-color: #0096ff;

  color: #fff;

  padding: 20px 180px;

  display: flex;

  justify-content: space-between;

  align-items: center;

  flex-wrap: wrap;

}

.contact-info span {

  font-family: "Poppins", sans-serif !important;

  font-size: 17px !important;

  margin-right: 25px !important;

}



/* .social-icons {

  border: 1px solid red;

  margin-left: 15rem;

} */



.social-icons a {

  margin-left: 10px;

  /* border: 1px solid red; */

}



.social-icons img {

  width: 25px;

  height: 25px;

}



/* Responsive adjustments for Top Banner */



/* ==============================================

  Responsive CSS for Top Banner

  - Add this code to your existing CSS file.

  ============================================== */



/* --- Tablet Devices (e.g., iPads) --- */

@media (max-width: 1024px) and (min-width: 499px) {

  .top-banner {

    /* Reduce side padding for smaller screens */

    padding: 20px 50px;

    /* Allow items to wrap and center them if they do */

    justify-content: center;

    gap: 15px; /* Add some space between items when they wrap */

    /* border: 1px solid red; */

    align-items: center !important;

  }



  .contact-info span {

    font-size: 12px !important;

  }

  .contact-info {

    display: flex;

    gap: 5px !important;

    text-align: center;

    /* border: 1px solid blue; */

    justify-self: center !important;

    width: 100%;

    justify-content: center;

  }

}



/* --- Mobile Devices (e.g., iPhones) --- */

@media (max-width: 500px) {

  .top-banner {

    /* Stack items vertically */

    flex-direction: column;

    padding: 15px 20px;

    gap: 0px;

    align-items: center !important;

  }



  .contact-info {

    /* Arrange contact details vertically */

    display: flex;

    flex-direction: column;

    align-items: center;

    gap: 0px;

    text-align: center;

    justify-content: center !important;

    width: 100%;

  }



  .contact-info span {

    /* Remove the right margin for a clean vertical stack */

    margin-right: 0 !important;

    font-size: 14px !important; /* Slightly smaller font for mobile */

  }



  .social-icons {

    /* Ensure social icons have some space at the top */

    margin-top: 5px;

  }



  .social-icons a {

    margin: 0 8px; /* Adjust horizontal spacing */

  }



  /*Commented out for now by Muzaffar*/

  /* .navbar .logo img {

    margin-left: 50px;

  } */

}



/*Top Banner : Mobile Responsive */

/*Large Mobile*/

@media (max-width: 767px) {

  .top-banner .contact-info {

    display: none;

  }

  /*Commented out for now by Muzaffar*/

  /* .navbar .menu-toggle {

    margin-top: -50% !important;

  } */



  /*Commented out for now by Muzaffar*/

  /* .top-banner .social-icons {

    margin-left: -8rem;

  } */

  nav.navbar {

    background: transparent;

  }

  .navbar {

    justify-content: center;

  }

  /*Commented out for now by Muzaffar*/

  /* .navbar .logo img {

    width: 279px !important;

  } */

}



/*Commented out for now by Muzaffar*/

/* @media (max-width: 424px) {

  .navbar .menu-toggle {

    margin-top: -55% !important;

  }

} */



/*Commented out for now by Muzaffar*/

/*Medium Mobile*/

/* @media (max-width: 375px) {

  .navbar .logo img {

    width: 200px !important;

  }

} */



/*Small Mobile*/

@media (max-width: 350px) {

  /*Commented out for now by Muzaffar*/

  /* .navbar .logo img {

    width: 190px !important;

    margin-left: 35px !important;

  } */



  /*Commented out for now by Muzaffar*/

  /* .navbar .menu-toggle {

    margin-top: -65% !important;

  } */

  /* .top-banner .social-icons {

    margin-left: -70px;

  } */

}



/*Muzaffar has added this code*/



/* Styles for the dropdown icon */

.dropdown-arrow {

  display: none; /* Hidden by default on desktop */

  width: 16px; /* Size of the icon */

  height: 16px;

  margin-left: 8px; /* Space between text and icon */

  transition: transform 0.3s ease; /* Smooth rotation */

}



@media (min-width: 767px) {

  .mobile-navbar-line {

    display: none;

  }

  .new-nav-links {

    display: none !important;

  }

}



@media (max-width: 767px) {

  /* /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

  /* Show dropdown arrow icon on mobile */

  .dropdown-arrow {

    display: inline-block; /* Show on mobile */

    color: #ffffff; /* Icon color for mobile */

  }

  /* Dropdown Stylying For Mobile Devices*/

  /* This class will be added/removed by JavaScript to show the main mobile menu */



  .nav-links.show {

    display: flex;

  }



  .nav-links li {

    margin-right: 0 !important;

    width: 100%;

    text-align: center;

    padding-bottom: 0;

  }



  .nav-links li a {

    padding: 0.8rem 1rem;

    color: #ffffff;

  }



  /* Dropdown specific styles for mobile */

  .nav-links li .dropdown-menu {

    position: static; /* Flows naturally within the list */

    display: none; /* Hidden by default, toggled by JS */

    width: 100%;

    box-shadow: none;

    background-color: rgba(255, 255, 255, 0.1);

    border-top: 1px solid rgba(255, 255, 255, 0.2);

    border-radius: 0;

    padding: 0.5rem 0;

  }



  /* This class will be toggled by JavaScript on the parent LI to show the dropdown */

  .nav-links li.dropdown-active .dropdown-menu {

    display: block; /* Show dropdown when parent LI has 'dropdown-active' class */

  }



  /* Rotate the dropdown arrow when active */

  .nav-links li.dropdown-active .dropdown-arrow {

    transform: rotate(180deg);

  }



  .dropdown-menu a {

    color: #ffffff;

    padding-left: 2rem; /* Indent mobile dropdown items */

    text-align: left;

  }

  .dropdown-menu a:hover {

    background-color: rgba(255, 255, 255, 0.3);

  }



  /* This class will be toggled by JavaScript on the parent LI to show the dropdown */

  .nav-links.mobile-menu-active li {

    display: block; /* Show Mobile Menu  */

  }

  .nav-links li.dropdown-active-2 .dropdown-menu {

    display: none !important;

  }



  ul.dropdown-menu li a {

    text-align: center;

    font-size: 18px !important;

  }



  /* ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

  ul.nav-links.active {

    /* border: 1px solid yellow; */

    padding: 50px 0px !important;

    height: auto;

  }



  /*Mobile Hamburger Styling*/

  .menu-toggle {

    display: none !important;

    /* margin-top: -420px !important;

    margin-left: 90% !important; */

  }



  /*Mobile Navbar Styling*/

  /* .navbar {

    border: 1px solid red;

  } */

  .navbar .logo {

    /* border: 1px solid blue; */

    width: 100%;

    height: 18vh !important;

  }

  .navbar .logo img {

    width: 60% !important;

    height: 100% !important;

    object-fit: contain;

    /* border: 1px solid green; */

  }



  /*Mobile Top Hero Banner Styling*/

  .banner-content {

    /* border: 1px solid yellow; */

    width: 80% !important;

    margin-left: 10% !important;

    top: 10% !important;

    margin-top: 12rem;

    padding-bottom: 2rem;

  }

  .hero-banner {

    /* height: 120vh !important; */

    height: auto !important;

    max-height: 1300px !important;

    padding-bottom: 20px !important;

  }



  /*Main Title Heading Styling for Mobile Device*/

  .hero-banner-main-title {

    /* border: 1px solid green; */

    margin-top: 10px !important;

  }

  .navbar-line {

    display: none;

  }

  /*Navbar Line Styling for Mobile Devices*/

  .mobile-navbar-line {

    border-bottom: 1px solid #ffffff;

    width: 85%;

    margin-left: 10% !important;

  }



  /* Hide the desktop "Contact Us" button */

  .navbar .contact-button {

    display: none;

  }



  /*Call Now Button Working for Mobile Devices*/

  .hero-banner-button-and-phone-number {

    /* border: 1px solid red; */

    width: 100% !important;

  }

  .hero-banner-button-and-phone-number .call-now-button {

    /* border: 5px solid green; */

    width: 180px !important;

  }

  .hero-banner-button-and-phone-number

    .contact-button

    .call-now-button

    .button-text {

    /* border: 1px solid brown; */

    font-size: 18px !important;

    width: 100% !important;

    text-align: center;

    margin-right: auto;

  }

  .hero-banner-button-and-phone-number

    .contact-button

    .call-now-button

    .arrow-icon {

    padding-right: 0px !important;

    margin-right: 0px !important;

    width: 30px;

    /* border: 1px solid red; */

  }

  .hero-banner-contact-number {

    /* border: 5px solid orange; */

    font-size: 18px !important;

  }



  .column.right-column {

    text-align: left;

  }

  .left-column,

  .right-column {

    /* border: 1px solid brown; */

    width: 100% !important;

    gap: 15px;

  }

  .left-column {

    padding-top: 0px !important;

  }

  .right-column {

    padding-top: 0px !important;

    margin-top: -60px;

  }

  .left-column h2,

  .left-column p,

  .right-column h2,

  .right-column p {

    font-size: 1rem !important;

  }

  .three-column-section {

    flex-direction: column;

    align-items: center;

    gap: 20px;

    /* border: 1px solid red; */

    padding: 0px 20px !important;

    margin: 0px !important;

  }

  .contact-us-input,

  .contact-us-textarea {

    /* border: 1px solid blue; */

    width: 100% !important;

  }

  .about-us-content {

    /* border: 1px solid red; */

    padding: 0px !important;

    top: -8% !important;

  }



  /*Blog Page Styling for Mobile Devices*/

  .unique-blog-container {

    /* border: 1px solid brown; */

    width: 100% !important;

  }

  /* .unique-blog-card {

    max-width: 45%;

  } */



  .EICR-blog-main-section .EICR-blog-container {

    /* border: 3px solid; */

    width: 100% !important;

  }

  .hero-banner-main-title.about-us-main-title-div.epc-page-main-title-heading {

    margin-top: 60px !important;

  }



  /*Footer styling For Mobile Devices*/

  .footer-container {

    width: 90% !important;

    padding: 0px !important;

    padding-left: 0px !important;

    /* border: 1px solid blueviolet; */

  }

  .footer-column {

    min-width: 100px !important;

  }

  .footer-container .footer-column-1-for-mobile-devices {

    /* border: 1px solid yellow; */

    width: 20% !important;

    min-width: 200px !important;

    text-align: center;

  }

  .footer-column.footer-column-2,

  .footer-column.footer-column-3,

  .footer-column.footer-column-4 {

    display: flex;

    flex-direction: column;

    padding: 0px !important;

    /* border: 1px solid blue; */

    width: 70% !important;

    min-width: 200px !important;

    text-align: center;

  }



  .footer-social-icons {

    margin-top: 0px !important;

  }

  .footer-bottom {

    flex-direction: column;

  }

  .footer-bottom-right {

    display: flex;

    flex-direction: column;

    gap: 3px;

    text-align: center;

  }

  .footer-bottom {

    flex-direction: column;

    gap: 20px;

  }

  .footer-column.footer-column-1.footer-column-1-for-mobile-devices

    .footer-logo {

    width: 60% !important;

  }

  .top-banner {

    /* border: 1px solid yellow; */

    flex-direction: row !important;

  }



  .top-menu-toggle-for-mobile-devices {

    display: flex !important;

    flex-direction: column !important;

    cursor: pointer !important;

    /* border: 1px solid red !important; */

    position: relative;

    z-index: 1000;

  }



  .top-menu-toggle-for-mobile-devices span {

    width: 25px !important;

    height: 3px !important;

    background-color: white;

    margin: 4px 0 !important;

    transition: transform 0.3s ease, opacity 0.2s ease !important;

  }

}

/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */



/* ////////////////////////////////////////////////////////  NAVBAR & HERO BANNER ////////////////////////////////////////////////////////////////////*/

/* Navbar */

.navbar {

  /*background-color: rgba(255, 255, 255, 0.9);*/ /*Semi-transparent white */

  padding: 40px 180px;

  display: flex;

  justify-content: space-between;

  align-items: center;

  /* box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); */

  /* position: sticky; */

  top: 0;

  /* z-index: 1000;  */

  width: 100%;

  margin-top: -23em;

  /* border: 1px solid red; */

}



.logo img {

  height: 60px;

}



.nav-links {

  list-style: none;

  display: flex;

  gap: 20px;

}



.nav-links li {

  /* border: 1px solid red; */

  margin-right: 40px !important;

}



.nav-links li a {

  text-decoration: none;

  color: #ffffff;

  font-family: "Poppins", sans-serif !important;

  font-size: 17px !important;

  font-weight: medium !important;

}



/* Navbar Contact Us Button */

/* Contact Us Button */

.contact-us-button {

  display: inline-flex;

  align-items: center;

  background-color: #0096ff;

  color: #fff;

  text-decoration: none;

  padding: 0px 30px;

  /* border-radius: 5px; */

  font-family: "Poppins", sans-serif;

  font-weight: 500;

  font-size: 16px;

  transition: background-color 0.3s ease;

  height: 70px !important;

}



.button-text {

  margin-right: 18px;

  font-family: "Poppins", sans-serif !important;

  font-size: 24px !important;

  font-weight: bold !important;

}



.pipe {

  margin-right: 20px;

  width: 1px !important;

  font-size: 55px; /* Increased font size for taller pipe */

  /*line-height: 1;*/ /* Prevents extra vertical spacing */

  transform: scaleX(0.1);

  display: inline-flex;

  align-items: center; /* Vertically centers the pipe */

}



.arrow-icon {

  /* border: 1px solid red; */

  padding-top: 5px;

}

.arrow-icon img {

  height: 25px;

  width: 20px;

}

.contact-us-button:hover {

  background-color: #0056b3;

}



/* Responsive Styles */

@media (max-width: 768px) {

  .contact-us-button {

    padding: 8px 16px;

    font-size: 14px;

  }



  .pipe {

    font-size: 20px; /* Slightly smaller for tablets */

  }



  .arrow-icon {

    font-size: 16px;

  }

  .navbar .logo img {

    width: 200px;

  }

}



@media (max-width: 480px) {

  .contact-us-button {

    padding: 6px 12px;

    font-size: 12px;

  }



  .pipe {

    font-size: 18px; /* Smaller for mobile */

  }



  .arrow-icon {

    font-size: 14px;

  }

}



.navbar-line {

  border-bottom: 1px solid #ffffff;

  width: 78%;

}



.menu-toggle {

  display: none;

  flex-direction: column;

  cursor: pointer;

}



.menu-toggle span {

  width: 25px;

  height: 3px;

  background-color: #333;

  margin: 4px 0;

}



/* Call Now Button */

.call-now-button {

  display: inline-flex;

  align-items: center;

  background-color: #0096ff;

  color: #fff;

  text-decoration: none;

  padding: 0px 25px;

  /* border-radius: 5px; */

  font-family: "Poppins", sans-serif;

  font-weight: 500;

  font-size: 16px;

  transition: background-color 0.3s ease;

  height: 65px !important;

}



/* Responsive Styles */

@media (max-width: 768px) {

  .call-now-button {

    padding: 8px 16px;

    font-size: 14px;

  }

}



@media (max-width: 480px) {

  .call-now-button {

    padding: 6px 12px;

    font-size: 12px;

  }

}



/*Hero Banner Contact Number*/

.hero-banner-contact-number {

  /* border: 1px solid yellow; */

  text-align: center;

  padding-top: 12px !important;

  font-family: "Poppins", sans-serif !important;

  /* font-size: 20px !important; */

}



/* Hero Banner */

.hero-banner {

  background-image: url("/images/man-woman-analysing-clipboard.png"); /* Replace with your image path */

  background-size: cover;

  background-position: center;

  height: 900px; /* Adjust height as needed */

  display: flex;

  justify-content: center;

  align-items: center;

  text-align: center;

  color: #fff;

  position: relative;

  flex-direction: column;

}



.banner-content {

  position: relative;

  z-index: 10; /* Ensures content is above overlay */

  /* border: 1px solid yellow; */

  text-align: left; /* Aligns text to the left */

  margin-left: 180px; /* Adds spacing from the left edge */

  align-self: flex-start; /* Aligns the content box to the left in the flex container */

  top: 10%;

  width: 40%;

}



.banner-content h1 {

  font-size: 2.5rem;

  margin-bottom: 1rem;

}



.banner-content p {

  font-size: 16px;

  margin-bottom: 1.5rem;

  font-family: "Poppins", sans-serif !important;

}



.banner-button {

  background-color: #007bff;

  color: #fff;

  padding: 12px 24px;

  text-decoration: none;

  border-radius: 5px;

  font-weight: bold;

}



.banner-button:hover {

  background-color: #0056b3;

}



.hero-banner-button-and-phone-number {

  /* border: 1px solid green; */

  display: flex;

  flex-wrap: wrap;

  flex-direction: row;

  gap: 25px;

}

.hero-banner-main-title h1 {

  line-height: 35px;

  font-size: 45px !important;

  font-family: "Poppins", sans-serif !important;

}



/* Responsive Code of Navbar & Hero Banner */

/* =========================================== */

/* Tablet Devices (e.g., iPads, smaller laptops) */

/* =========================================== */

@media (max-width: 1024px) {

  .about-us-navbar {

    margin-top: 0px !important;

  }

  /*Commented out for now by Muzaffar*/

  /* .hero-banner-button-and-phone-number {

    flex-direction: row !important;

    gap: 30px !important;

  } */



  /*Commented out for now by Muzaffar*/

  /* .hero-banner {

    height: 700px !important;

  } */

  .navbar {

    padding: 30px 50px;

    margin-top: 0; /* Resetting fragile margin for better control */

    position: absolute; /* Positioning relative to the banner */

    top: 0;

    left: 0;

    right: 0;

    background-color: rgba(

      0,

      0,

      0,

      0.2

    ); /* Slight background for readability */

  }



  /*Commented out for now by Muzaffar*/

  /* .banner-content {

    width: 70%;

    margin-left: 50px;

    top: 5%;

    text-align: left;

  } */



  .hero-banner-main-title h1 {

    font-size: 38px !important;

  }

}



/* =========================================== */

/* Mobile Devices (e.g., iPhones, Android phones) */

/* =========================================== */

@media (max-width: 768px) {

  .about-us-page-hero-banner .about-us-main-title-div h1 {

    font-size: 40px !important;

  }



  /*Commented out for now by Muzaffar*/

  /* .hero-banner-button-and-phone-number {

    flex-direction: row !important;

    gap: 30px !important;

  } */

  .about-us-navbar {

    margin-top: 0px !important;

  }

  /* --- Navbar & Hamburger Menu --- */

  .navbar {

    padding: 20px 25px;

    background-color: rgba(0, 0, 0, 0.4); /* Darker background on mobile */

  }



  .nav-links {

    /* Hide the links by default on mobile */

    display: none;



    /* Styling for the revealed mobile menu */

    position: fixed;

    top: 0;

    left: 0;

    width: 100%;

    height: 50vh;

    background-color: #001f3f; /* Using a solid dark blue for the menu */

    flex-direction: column;

    justify-content: center;

    align-items: center;

    gap: 30px;

    transition: transform 0.3s ease-in-out;

    transform: translateX(-100%); /* Start off-screen */

  }



  .nav-links.active {

    /* This class will be toggled by JavaScript to show the menu */

    display: flex;

    transform: translateX(0);

    z-index: 100;

  }



  .nav-links li {

    margin-right: 0 !important;

  }



  .nav-links li a {

    font-size: 22px !important; /* Larger font for easier tapping */

  }



  /* Show and style the hamburger menu icon */

  .menu-toggle {

    display: flex; /* Show the hamburger */

    flex-direction: column;

    z-index: 101; /* Ensure it's above the mobile menu */

  }



  .menu-toggle span {

    background-color: #ffffff; /* White bars for the icon */

  }



  /*Commented out for now by Muzaffar*/

  /* Hide the line under the navbar on mobile */

  /* .navbar-line {

    display: none;

  } */



  /*Commented out for now by Muzaffar*/

  /* --- Hero Banner Content --- */

  /* .hero-banner {

     Adjust height for mobile

    height: 800px !important;



    Shift background image to show more of the people

    background-position: 60% center; 

  } */



  /*Commented out for now by Muzaffar*/

  /* .banner-content {

    display: flex;

    flex-direction: column;

    align-items: center;

    width: 90%;

    margin: 0 auto; 

    position: static; 

    text-align: center; 

    padding-top: 150px; 

  } */



  .hero-banner-main-title h1 {

    font-size: 23px !important;

    line-height: 1.3;

  }



  /*Commented out for now by Muzaffar*/

  /* .banner-content p {

    font-size: 14px;

  } */

  .contact-button a span.pipe {

    font-size: 40px;

  }

}



/* =========================================== */

/* Small Mobile Devices */

/* =========================================== */

@media (max-width: 500px) {

  .about-us-page-hero-banner {

    height: 500px !important;

  }



  /*Commented out for now by Muzaffar*/

  /* .hero-banner-button-and-phone-number {

    align-items: center !important;

    gap: 20px !important;

  } */



  /*Commented out for now by Muzaffar*/

  /* .hero-banner-button-and-phone-number .contact-button .button-text,

  .hero-banner-button-and-phone-number .hero-banner-contact-number {

    font-size: 15px !important;

  } */



  /*Commented out for now by Muzaffar*/

  /* .hero-banner-button-and-phone-number .pipe {

    size: 60px !important;

    margin-right: 0px !important;

  } */



  /*Commented out for now by Muzaffar*/

  /* .hero-banner-button-and-phone-number .arrow-icon img {

    width: 20px;

    height: 20px;

    margin-left: 5px;

    margin-top: 4px;

  } */



  /*Commented out for now by Muzaffar*/

  /* .hero-banner-button-and-phone-number .call-now-button {

    border: 1px solid red;

    width: 150px !important;

  } */



  /*Commented out for now by Muzaffar*/

  /* .hero-banner-button-and-phone-number .contact-button a {

    width: 155px !important;

    padding-left: 20px !important;

  } */



  /*Commented out for now by Muzaffar*/

  /* .contact-button a.call-now-button {

    width: 160px !important;

  } */

  .navbar ul.nav-links.active li {

    margin-left: 10px !important;

    /* border: 1px solid red; */

  }

  .navbar .logo img {

    width: 160px;

  }

}



/*Large Mobile Responsive*/

@media (max-width: 767px) {

  /*Commented out for now by Muzaffar*/

  /* .navbar-line {

    margin-top: -70px !important;

    width: 85%;

    display: block;

  } */

  .hero-banner-main-title h1 {

    text-align: left;

  }



  /*Commented out for now by Muzaffar*/

  /* .banner-content p {

    text-align: left !important;

  } */



  /*Commented out for now by Muzaffar*/

  /* .banner-content p {

    padding: 0px 10px;

    font-size: 16px;

  } */



  .hero-banner-main-title {

    width: 100%;

    padding: 0px 10px;

  }



  /*Commented out for now by Muzaffar*/

  /* .banner-content {

    border: 1px solid red;

    padding: 20px 0px;

  } */



  /*Commented out for now by Muzaffar*/

  /* .hero-banner-button-and-phone-number .contact-button a {

    height: 50px !important;

    width: 170px !important;

  } */



  /*Commented out for now by Muzaffar*/

  /* .banner-content

    .hero-banner-button-and-phone-number

    .contact-button

    a.call-now-button

    span.button-text {

    font-size: 17px !important;

  } */



  /*Commented out for now by Muzaffar*/

  /* .banner-content

    .hero-banner-button-and-phone-number

    .hero-banner-contact-number {

    font-size: 17px !important;

  } */

  /*Commented out for now by Muzaffar*/

  /* .hero-banner-button-and-phone-number {

    width: 95%;

  } */



  /*Commented out for now by Muzaffar*/

  /* .navbar-line {

    margin-top: 20px !important;

  } */



  /*Commented out for now by Muzaffar*/

  /* .banner-content {

    padding-top: 5rem !important;

  } */

  .about-us-page-hero-banner .about-us-main-title-div h1 {

    font-size: 25px !important;

    line-height: 35px;

  }

}



/*Medium Mobile Responsive*/

@media (max-width: 375px) {

  /*Commented out for now by Muzaffar*/

  /* .banner-content {

    padding-top: 20px;

  } */



  /*Commented out for now by Muzaffar*/

  /* .hero-banner-button-and-phone-number .contact-button a {

    height: 50px !important;

    width: 170px !important;

  } */



  /*Commented out for now by Muzaffar*/

  /* .banner-content

    .hero-banner-button-and-phone-number

    .contact-button

    a.call-now-button

    span.button-text {

    font-size: 17px !important;

  } */



  /*Commented out for now by Muzaffar*/

  /* .banner-content

    .hero-banner-button-and-phone-number

    .hero-banner-contact-number {

    font-size: 17px !important;

  } */



  /*Commented out for now by Muzaffar*/

  /* .navbar-line {

    margin-top: 0px !important;

  } */

  ul.nav-links.active li a {

    margin-right: 10px;

    /* border: 1px solid orange; */

  }



  /*Commented out for now by Muzaffar*/

  /* .navbar-line {

    margin-top: 50px !important;

  } */



  /*Commented out for now by Muzaffar*/

  /* .banner-content {

    padding-top: 5rem !important;

  } */

}



/* Small Mobile Device Responsive*/

@media (max-width: 320px) {

  /*Commented out for now by Muzaffar*/

  /* .hero-banner-main-title {

    margin-top: 0rem !important;

  } */



  /*Commented out for now by Muzaffar*/

  /* .navbar-line {

    margin-top: 6rem !important;

  } */

  .hero-banner-main-title h1 {

    font-size: 20px !important;

  }

  /*Commented out for now by Muzaffar*/

  /* .banner-content p {

    font-size: 14px !important;

    line-height: 27px !important;

  } */

  ul.nav-links.active li a {

    margin-right: 10px;

  }

  /*Commented out for now by Muzaffar*/

  /* .navbar-line {

    margin-top: 60px !important;

  } */



  /*Commented out for now by Muzaffar*/

  /* .banner-content {

    padding-top: 1rem !important;

  } */

}

/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */



/* ////////////////////////////////////////////////////////  IMAGE TEXT SECTION ///////////////////////////////////////////////////////////////*/



/* Image Text Section */

.image-text-section {

  background-color: #fff;

  /* border: 1px solid red; */

  padding: 100px 10px;

}

.text-container h2 {

  font-family: "Poppins", sans-serif !important;

  font-size: 40px !important;

  color: #000000 !important;

}



.text-container p {

  font-family: "Poppins", sans-serif !important;

  font-size: 16px !important;

  color: #000000 !important;

  line-height: 25px !important;

}

.section-container {

  display: flex;

  align-items: center;

  justify-content: space-between;

  max-width: 1300px;

  margin: 0 auto;

  gap: 35px;

  /* border: 1px solid blue; */

}



.image-container {

  flex: 1;

}



.image-container img {

  width: 100%;

  height: auto;

  border-radius: 8px;

  object-fit: cover;

}



.text-container {

  flex: 1;

  text-align: left;

  /* border: 1px solid green; */

}



.text-container h2 {

  font-family: "Poppins", sans-serif;

  font-weight: 700;

  font-size: 2rem;

  color: #333;

  margin-bottom: 15px;

}



.text-container p {

  font-family: "Poppins", sans-serif;

  font-weight: 400;

  font-size: 1rem;

  color: #666;

  margin-bottom: 20px;

}



/* Text Image Section Button */

.text-image-button {

  display: inline-flex;

  align-items: center;

  background-color: #0096ff;

  color: #fff;

  text-decoration: none;

  padding: 0px 30px;

  /* border-radius: 5px; */

  font-family: "Poppins", sans-serif;

  font-weight: 500;

  font-size: 16px;

  transition: background-color 0.3s ease;

  height: 70px !important;

}



/* Responsive Styles */

@media (max-width: 768px) {

  .text-image-button {

    padding: 8px 16px;

    font-size: 14px;

  }

}



@media (max-width: 480px) {

  .text-image-button {

    padding: 6px 12px;

    font-size: 12px;

  }

}



/* Responsive Styles */

@media (max-width: 768px) {

  .text-image-button {

    padding: 8px 16px;

    font-size: 14px;

  }

}



@media (max-width: 480px) {

  .text-image-button {

    padding: 6px 12px;

    font-size: 12px;

  }

}



/* Responsive Styles */

@media (max-width: 768px) {

  .section-container {

    flex-direction: column;

    gap: 20px;

  }



  .image-container,

  .text-container {

    flex: none;

    width: 100%;

  }



  .text-container h2 {

    font-size: 1.5rem;

  }



  .text-container p {

    font-size: 0.9rem;

  }



  .section-button {

    padding: 10px 20px;

    font-size: 0.9rem;

  }

}



@media (max-width: 480px) {

  .image-text-section {

    padding: 20px 10px;

  }



  .text-container h2 {

    font-size: 1.2rem;

  }



  .text-container p {

    font-size: 0.8rem;

  }



  .section-button {

    padding: 8px 16px;

    font-size: 0.8rem;

  }

}



/* Responsive Styles */

@media (max-width: 768px) {

  /* Top Banner */

  .top-banner {

    flex-direction: column;

    align-items: flex-start;

  }



  .contact-info span {

    margin-bottom: 5px;

  }



  .social-icons {

    margin-top: 10px;

  }



  /* Navbar */

  .navbar {

    flex-wrap: wrap;

  }



  .nav-links {

    display: none;

    flex-direction: column;

    width: 100%;

    text-align: center;

  }



  .nav-links.active {

    display: flex;

  }



  .menu-toggle {

    display: flex;

  }



  /*Commented out for now by Muzaffar*/

  /* Hero Banner */

  /* .hero-banner {

    height: 400px;

  } */



  /*Commented out for now by Muzaffar*/

  /* .banner-content h1 {

    font-size: 1.8rem;

  }



  .banner-content p {

    font-size: 1rem;

  } */



  .banner-button {

    padding: 10px 20px;

  }

}



/* Main Content (Optional) */

main {

  padding: 20px;

  text-align: center;

}



/* What We offer Section Main Heading */

.home-page-offer-main-heading {

  display: flex;

  flex-wrap: wrap;

  justify-content: center;

  background-color: #ffffff;

  padding-bottom: 40px !important;

}



.home-page-offer-main-heading h1 {

  color: #000000;

  font-family: "Poppins", sans-serif;

  font-weight: bold;

  font-size: 35px;

}



/* Tablet : Responsive Adjustment for Image Text Section*/

@media (max-width: 1024px) and (min-width: 768px) {

  .section-container {

    margin: 0px 30px;

  }

  section.image-text-section {

    padding: 30px 0px;

  }

  .image-text-section .section-container .image-container img {

    height: 500px;

  }

}



/* Mobile : Responsive Adjustment for Image Text Section*/

@media (max-width: 767px) {

  .section-container {

    margin: 0px 30px;

  }

  section.image-text-section {

    padding: 30px 0px;

  }

  .image-text-section .section-container .text-container h2 {

    font-size: 22px !important;

  }

  .image-text-section .section-container .text-container p {

    font-size: 15px !important;

  }

  .image-text-section .section-container .text-container .contact-button a {

    padding: 0px;

    padding-left: 18px !important;

    justify-content: center;

    width: 170px;

    height: 60px !important;

  }

  .image-text-section

    .section-container

    .text-container

    .contact-button

    a

    span.button-text {

    font-size: 14px !important;

    margin-right: 7px !important;

  }



  .image-text-section

    .section-container

    .text-container

    .contact-button

    a

    span.pipe {

    margin-right: 10px;

  }



  .image-text-section

    .section-container

    .text-container

    .contact-button

    a

    span.arrow-icon

    img {

    width: 18px !important;

    height: 18px !important;

    margin-top: 5px;

  }

}



/*Large Mobile Responsive*/

@media (max-width: 767px) {

  .image-text-section

    .section-container

    .text-container

    .contact-button

    a.text-image-button {

    height: 50px !important;

    width: 180px !important;

  }



  .image-text-section

    .section-container

    .text-container

    .contact-button

    a.text-image-button

    span.button-text {

    font-size: 17px !important;

  }

  .image-text-section .section-container .text-container h2 {

    font-size: 25px !important;

  }



  .image-text-section .section-container .text-container p {

    font-size: 16px !important;

  }

  section.home-page-offer-main-heading h1 {

    font-size: 26px;

  }



  section.es-main-services-wrapper {

    /* border: 1px solid red; */

    padding: 0px 30px !important;

    margin-top: -25px !important;

  }

  .es-service-box-first h2 {

    font-size: 16px !important;

  }

  .es-service-box-first p {

    font-size: 15px !important;

  }

  .es-service-box-first h2 {

    margin-top: -27px !important;

  }

}



/*Medium Mobile Responsive*/

@media (max-width: 375px) {

  .image-text-section .section-container .text-container h2 {

    font-size: 20px !important;

  }



  .image-text-section .section-container .text-container p {

    font-size: 15px !important;

  }

  section.es-main-services-wrapper {

    /* border: 1px solid red; */

    padding: 0px 30px !important;

    margin-top: -25px !important;

  }

  .es-service-box-first h2 {

    font-size: 14px !important;

  }

  .es-service-box-first p {

    font-size: 13px !important;

  }

  .es-service-box-first h2 {

    margin-top: -27px !important;

  }

  .es-service-box h2 {

    font-size: 16px !important;

  }

  .es-service-box p {

    font-size: 15px !important;

  }

  .es-service-box-first-medium-para {

    /* border: 1px solid red; */

    font-size: 12px !important;

  }

}



/* Small Mobile Device Responsive*/

@media (max-width: 320px) {

  .image-text-section .section-container .text-container h2 {

    font-size: 19px !important;

  }



  .image-text-section .section-container .text-container p {

    font-size: 13px !important;

  }



  section.es-main-services-wrapper {

    /* border: 1px solid red; */

    padding: 0px 30px !important;

    margin-top: -25px !important;

  }

  .es-service-box-first h2 {

    font-size: 14px !important;

  }

  .es-service-box-first p {

    font-size: 13px !important;

  }

  .es-service-box-first h2 {

    margin-top: -27px !important;

  }

  .es-service-box h2 {

    font-size: 14px !important;

  }

  .es-service-box p {

    font-size: 13px !important;

  }

  .es-service-box-first-medium-para {

    /* border: 1px solid red; */

    font-size: 10px !important;

  }

}



/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */



/* ////////////////////////////////////////////////////////  WHAT WE OFFER BOXES SECTION ////////////////////////////////////////////////////////*/

.es-main-services-wrapper {

  padding: 10px;

  max-width: 1400px; /* Maximum width for the entire section */

  margin: 0 auto; /* Center the container on the page */

  background-color: #ffffff; /* White background for the section */

  display: flex; /* Enable flexbox for inner boxes */

  flex-wrap: wrap; /* Allow boxes to wrap to the next line */

  justify-content: center; /* Center boxes horizontally */

  gap: 30px; /* Space between boxes */

  align-items: stretch; /* Ensures boxes have equal height in their row */

  padding-top: 20px; /* Top padding for the section */

  padding-bottom: 20px; /* Bottom padding for the section */

}



/* Styling for individual service boxes */

.es-service-box {

  flex: 1 1 380px; /* Base flex item: allows shrinking, grows, min-width 300px */

  max-width: 430px; /* Maximum width for each box to fit 3 in a row */

  background-color: white; /* White background for the box content */

  color: #000000; /* Black text color */

  padding: 80px 30px; /* Vertical and horizontal padding inside the box */

  height: 310px; /* Fixed height for consistency */

  text-align: center; /* Center align text inside the box */

  border-right: 5px solid #0096ff; /* Right border with blue color */

  border-bottom: 5px solid #0096ff; /* Bottom border with blue color */

  border-radius: 30px; /* Rounded corners for the box */

  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3); /* Subtle shadow for depth */

  display: flex; /* Use flexbox for content inside the box */

  flex-direction: column; /* Stack content vertically */

  justify-content: center; /* Vertically center content if needed */

  align-items: center; /* Horizontally center content */

}



/* Specific padding adjustment for the first box */

.es-service-box-first {

  padding-top: 110px !important; /* Override padding-top for the first box */

}



/* Heading (h2) styling within the service boxes */

.es-service-box h2 {

  font-family: "Poppins", sans-serif; /* Poppins font */

  font-weight: 600; /* SemiBold weight */

  font-size: 18px; /* Font size for headings */

  margin-bottom: 10px; /* Space below the heading */

  line-height: 1.3; /* Improve readability for multi-line headings */

}



/* Paragraph (p) styling within the service boxes */

.es-service-box p {

  font-family: "Poppins", sans-serif; /* Poppins font */

  font-weight: 400; /* Regular weight */

  font-size: 16px; /* Font size for paragraphs */

}



/* --- Responsive Adjustments --- */



/* On screens up to 900px wide, boxes adjust to display two per row */

@media (max-width: 900px) {

  .es-service-box {

    flex: 1 1 45%; /* Two boxes per row (approx 45% each to allow for gap) */

    max-width: none; /* Remove max-width constraint, let flex handle it */

  }

}



/* On screens up to 600px wide, boxes stack one per row */

@media (max-width: 600px) {

  .es-service-box {

    flex: 1 1 100%; /* One box per row */

  }

}



/* Tablet : Responsive Adjustment for What We Offer Box Section*/

@media (max-width: 1024px) and (min-width: 767px) {

  .es-service-box.es-service-box-five {

    max-width: 380px;

  }

  section.es-main-services-wrapper {

    padding: 0px 30px;

  }

  .es-service-box h2 {

    font-size: 18px;

  }

  .es-service-box p {

    font-size: 14px;

  }

  .es-service-box-first h2 {

    margin-top: -18px;

  }

  .es-service-box-first h2 {

    font-size: 17px;

  }

  .es-service-box-first p {

    font-size: 13px;

  }

}

/* Mobile : Responsive Adjustment for What We Offer Box Section*/



/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */



/* ////////////////////////////////////////////////////////  Landlord Certificates Glasgow SECTION ////////////////////////////////////////////////////////*/



/*Step # 9*/

/* Why Choose Landlord Certificates Glasgow? Section Main Heading */

.home-page-certificate-glasgow-main-heading {

  display: flex;

  flex-wrap: wrap;

  justify-content: center;

  background-color: #ffffff;

  padding-bottom: 50px !important;

  padding-top: 30px !important;

}



.home-page-certificate-glasgow-main-heading h1 {

  color: #000000;

  font-family: "Poppins", sans-serif;

  font-weight: bold;

  font-size: 35px;

}



/*Step # 10*/

/* Three Column Section */

.three-column-section {

  display: flex;

  flex-wrap: wrap;

  justify-content: space-between;

  gap: 30px;

  max-width: 1300px;

  margin: 0 auto;

  /* border: 1px solid #007bff; */

}



/* Column Styling */

.column {

  flex: 1 1 300px; /* Minimum width of 300px, grows equally */

  max-width: 380px; /* Maximum width for consistency */

  text-align: left;

}



/* Middle Column Image */

.middle-column img {

  width: 100%;

  height: auto;

  border-radius: 10px;

  object-fit: cover;

}



/* Text Styling */

.column h2 {

  font-family: "Poppins", sans-serif;

  font-weight: 600; /* SemiBold */

  font-size: 18px;

  color: #000000;

  margin-bottom: 15px;

}



.column p {

  font-family: "Poppins", sans-serif;

  font-weight: 400; /* Regular */

  font-size: 16px;

  color: #000000;

  line-height: 25px;

}



.left-column,

.right-column {

  /* border: 1px solid red; */

  display: flex;

  flex-direction: column;

  justify-content: space-around;

  padding: 50px 0px;

  max-width: 420px !important;

}

.left-column {

  text-align: left;

}

.right-column {

  text-align: right;

}



/* Responsive Adjustments */

@media (max-width: 900px) {

  /*Commented out for now by Muzaffar*/

  /* .three-column-section {

    flex-direction: column;

    align-items: center;

    gap: 20px;

    padding: 20px 10px;

  } */



  .column {

    flex: 1 1 100%; /* Full width on medium screens */

    max-width: 600px; /* Limit width for readability */

  }

}



@media (max-width: 600px) {

  .column h2 {

    font-size: 18px; /* Slightly smaller heading */

  }



  .column p {

    font-size: 16px; /* Slightly smaller text */

    line-height: 26px; /* Adjusted line height */

  }

}



/* Hassle-Free Compliance Section */

.hassle-free-section {

  padding: 40px 20px;

  max-width: 1200px;

  margin: 0 auto;

  background-color: #ffffff; /* Optional: white background for consistency */

}



/* Content Container */

.hassle-free-content {

  text-align: center;

  max-width: 600px; /* Limits content width for readability */

  margin: 0 auto;

}



/* Heading Styling */

.hassle-free-content h3 {

  font-family: "Poppins", sans-serif;

  font-weight: 600; /* SemiBold */

  font-size: 18px;

  color: #000000;

  margin-bottom: 15px;

}



/* Paragraph Styling */

.hassle-free-content p {

  font-family: "Poppins", sans-serif;

  font-weight: 400; /* Regular */

  font-size: 15px;

  color: #000000;

  line-height: 1.6; /* Improves readability */

}



/* Landlord Certification Section */

.landlord-certification-section {

  padding: 40px 20px;

  /* max-width: 1200px; */

  width: 100%;

  margin: 0 auto;

  background-color: #e6f5ff; /* Optional: background for consistency */

  /* border: 1px solid red; */

}



/* Content Container */

.landlord-certification-content {

  text-align: center;

  max-width: 1000px; /* Limits content width for readability */

  margin: 0 auto;

  /* border: 1px solid blue;   */

}



/* Heading Styling */

.landlord-certification-content h3 {

  font-family: "Poppins", sans-serif;

  font-weight: 600; /* SemiBold */

  font-size: 32px;

  color: #000000;

  margin-bottom: 15px;

  max-width: 690px !important;

  display: flex;

  flex-direction: column;

  justify-self: center;

  line-height: 40px;

}



/* Paragraph Styling */

.landlord-certification-content p {

  font-family: "Poppins", sans-serif;

  font-weight: 400; /* Regular */

  font-size: 14px;

  color: #000000;

  line-height: 1.6; /* Improves readability */

}



/* Responsive Adjustments */

@media (max-width: 768px) {

  .landlord-certification-section {

    padding: 30px 15px; /* Reduced padding for tablets */

  }



  .landlord-certification-content h3 {

    font-size: 18px; /* Slightly smaller heading */

  }



  .landlord-certification-content p {

    font-size: 16px; /* Slightly smaller text */

  }

}



@media (max-width: 480px) {

  .landlord-certification-section {

    padding: 20px 10px; /* Further reduced padding for mobile */

  }



  .landlord-certification-content h3 {

    font-size: 16px; /* Smaller heading for small screens */

  }



  .landlord-certification-content p {

    font-size: 14px; /* Smaller text for small screens */

  }

}



/*Large Mobile Responsive*/

@media (max-width: 767px) {

  section.home-page-certificate-glasgow-main-heading h1 {

    font-size: 26px;

    text-align: center;

  }

  section.home-page-certificate-glasgow-main-heading h1 {

    font-size: 26px;

    text-align: center;

  }



  .column.middle-column {

    order: -3 !important;

  }



  /*Commented out for now by Muzaffar*/

  /* .column.right-column {

    text-align: left;

    padding: 0px 30px;

    margin-top: 4px;

  } */

  .column.middle-column img {

    height: 450px;

    margin-top: -35px;

  }

  /*Commented out for now by Muzaffar*/

  /* .column.left-column {

    padding: 0px 30px;

  } */

}



/*Medium Mobile Responsive*/

@media (max-width: 375px) {

  .column.middle-column img {

    height: 400px;

    margin-top: -35px;

  }

}



/* Small Mobile Device Responsive*/

@media (max-width: 320px) {

  section.home-page-certificate-glasgow-main-heading h1 {

    font-size: 19px;

    text-align: center;

  }



  .column.middle-column {

    order: -3 !important;

  }

  /*Commented out for now by Muzaffar*/

  /* .column.right-column {

    text-align: left;

    padding: 0px 30px;

    margin-top: 4px;

  } */

  .column.middle-column img {

    height: 300px;

    margin-top: -35px;

  }



  /*Commented out for now by Muzaffar*/

  /* .column.left-column {

    padding: 0px 30px;

  } */



  /*Commented out for now by Muzaffar*/

  /* .column.left-column h2 {

    font-size: 18px !important;

  } */



  /*Commented out for now by Muzaffar*/

  /* .column.right-column h2 {

    font-size: 18px !important;

  } */

  /*Commented out for now by Muzaffar*/

  /* .column.left-column p,

  .column.right-column p {

    font-size: 14px !important;

  } */



  /*Commented out for now by Muzaffar*/

  /* .column.left-column,

  .column.right-column {

    gap: 15px !important;

  } */

}



/* ////////////////////////////////////////////////////////  hassle-free-content SECTION ////////////////////////////////////////////////////////*/

/*Large Mobile Responsive*/

@media (max-width: 767px) {

  .hassle-free-content {

    margin-top: -30px;

  }

}

/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */



/* ////////////////////////////////////////////////////////  FIRST HOME PAGE SLIDER SECTION ////////////////////////////////////////////////////////*/



/* Property Slider Section */

.property-slider-section {

  padding: 40px 20px;

  width: 100%;

  margin: 0 auto;

  background-color: #e6f5ff;

}



/* Slider Container */

.property-slider-container {

  position: relative;

  overflow: hidden;

}



/* Hide Radio Inputs */

.property-slider-container input[type="radio"] {

  display: none;

}



/* Slides */

.property-slides {

  display: flex;

  width: 500%; /* 5 slides */

  transition: transform 0.5s ease-in-out;

}



.property-slide {

  flex: 0 0 20%; /* Each slide takes 20% of the width */

  display: flex;

  justify-content: center;

  gap: 30px;

  padding: 20px;

}



/* Card Styling */

.property-card {

  flex: 1 1 300px;

  max-width: 450px;

  height: 550px;

  position: relative;

  border-radius: 20px;

  background-size: cover;

  background-position: center;

  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);

}



/* Content Overlay */

.property-card-content {

  position: absolute;

  bottom: 20px;

  left: 20px;

  right: 20px;

  padding: 15px;

  border-radius: 8px;

}



/* Text Styling */

.property-card-content h3 {

  font-family: "Poppins", sans-serif;

  font-weight: 600;

  font-size: 22px;

  color: #ffffff;

  margin-bottom: 10px;

}



.property-card-content p {

  font-family: "Poppins", sans-serif;

  font-weight: 400;

  font-size: 15px;

  color: #ffffff;

  margin-bottom: 15px;

}



/* Button Styling */

.property-slider-button {

  display: inline-block;

  background-color: #0096ff;

  color: #ffffff;

  text-decoration: none;

  padding: 10px 20px;

  border-radius: 5px;

  font-family: "Poppins", sans-serif;

  font-weight: 500;

  font-size: 16px;

  transition: background-color 0.3s ease;

}



.property-slider-button:hover {

  background-color: #0077cc;

}



/* Slide Transitions */

#property-slide-1:checked ~ .property-slides {

  transform: translateX(0);

}

#property-slide-2:checked ~ .property-slides {

  transform: translateX(-20%);

}

#property-slide-3:checked ~ .property-slides {

  transform: translateX(-40%);

}

#property-slide-4:checked ~ .property-slides {

  transform: translateX(-60%);

}

#property-slide-5:checked ~ .property-slides {

  transform: translateX(-80%);

}



/* Navigation Controls (Dots and Arrows) */

.property-slider-nav {

  display: flex;

  justify-content: center;

  align-items: center;

  gap: 15px;

  padding-top: 20px;

  position: relative;

}



.property-arrow {

  position: relative; /* Changed from absolute to align with dots */

  transform: translateY(0); /* Removed vertical centering */

  cursor: pointer;

  transition: opacity 0.3s ease;

  z-index: 10;

  display: flex;

  align-items: center;

  justify-content: center;

  background: none;

  border: none;

  padding: 5px;

  border-radius: 50%;

}



.property-prev {

  margin-right: -5px; /* Space between prev arrow and dots */

  order: -1; /* Ensure prev arrow appears before dots */

}



.property-next {

  margin-left: -5px; /* Space between dots and next arrow */

  order: 1; /* Ensure next arrow appears after dots */

}



.property-arrow:hover {

  opacity: 0.8;

  background-color: rgba(0, 123, 255, 0.1);

}



.arrow-icon {

  width: 37px;

  height: 37px;

}



/* Pagination Dots */

.property-slider-dots {

  display: flex;

  gap: 8px;

}



.property-dot {

  display: inline-block;

  width: 12px;

  height: 12px;

  background-color: #007bff;

  opacity: 0.5;

  border-radius: 50%;

  cursor: pointer;

  transition: opacity 0.3s ease, background-color 0.3s ease, transform 0.3s ease;

}



.property-dot:hover {

  opacity: 0.8;

}



#property-slide-1:checked

  ~ .property-slider-nav

  .property-slider-dots

  #property-dot-1,

#property-slide-2:checked

  ~ .property-slider-nav

  .property-slider-dots

  #property-dot-2,

#property-slide-3:checked

  ~ .property-slider-nav

  .property-slider-dots

  #property-dot-3,

#property-slide-4:checked

  ~ .property-slider-nav

  .property-slider-dots

  #property-dot-4,

#property-slide-5:checked

  ~ .property-slider-nav

  .property-slider-dots

  #property-dot-5 {

  opacity: 1;

  background-color: #007bff;

  transform: scale(1.2);

}



/* Responsive Adjustments */

@media (max-width: 1000px) {

  .property-slide {

    flex-direction: column;

    align-items: center;

  }



  .property-card {

    max-width: 500px;

    height: 350px;

  }



  .property-arrow .arrow-icon {

    width: 20px;

    height: 20px;

  }



  .property-prev {

    margin-right: 15px; /* Reduced spacing for smaller screens */

  }



  .property-next {

    margin-left: 15px; /* Reduced spacing for smaller screens */

  }

}



@media (max-width: 600px) {

  .property-slider-section {

    padding: 20px 10px;

  }



  .property-card {

    height: 300px;

  }



  .property-card-content h3 {

    font-size: 18px;

  }



  .property-card-content p {

    font-size: 14px;

  }



  .property-slider-button {

    padding: 8px 16px;

    font-size: 14px;

  }



  .property-dot {

    width: 8px;

    height: 8px;

  }



  .property-slider-nav {

    gap: 10px;

  }



  .property-arrow .arrow-icon {

    width: 18px;

    height: 18px;

  }



  .property-prev {

    margin-right: 10px; /* Further reduced for mobile */

  }



  .property-next {

    margin-left: 10px; /* Further reduced for mobile */

  }

}



/* Contact Us Button for Slider Pagination */

.slider-pagination-button {

  display: inline-flex;

  align-items: center;

  color: #fff;

  text-decoration: none;

  padding: 0px 30px;

  font-family: "Poppins", sans-serif;

  font-weight: 500;

  font-size: 16px;

  transition: background-color 0.3s ease;

  height: 70px !important;

  background-color: #007bff;

}



.button-text {

  margin-right: 18px;

  font-family: "Poppins", sans-serif !important;

  font-size: 24px !important;

  font-weight: bold !important;

}



.slider-pagination-pipe {

  margin-right: 20px;

  width: 1px !important;

  font-size: 55px;

  transform: scaleX(0.1);

  display: inline-flex;

  align-items: center;

}



.slider-pagination-arrow-icon {

  font-size: 18px;

}



.slider-pagination-button:hover {

  background-color: #0056b3;

}



/* Responsive Styles for Button */

@media (max-width: 768px) {

  .slider-pagination-button {

    padding: 8px 16px;

    font-size: 14px;

  }



  .slider-pagination-pipe {

    font-size: 20px;

  }



  .slider-pagination-arrow-icon {

    font-size: 16px;

  }

}



@media (max-width: 480px) {

  .slider-pagination-button {

    padding: 6px 12px;

    font-size: 12px;

  }



  .slider-pagination-pipe {

    font-size: 18px;

  }



  .slider-pagination-arrow-icon {

    font-size: 14px;

  }

}



/* Large Mobile Responsive */

@media (max-width: 767px) {

  .property-card {

    width: 350px;

  }

}

/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */



/* **************************************************** First Slider Styling For Mobile & Tablet Devices************************************** */



/* Mobile Slider Section */

.mobile-property-slider-section {

  padding: 20px 10px;

  width: 100%;

  margin: 0 auto;

  background-color: #e6f5ff;

  display: none;

}



/* (max-width: 599px) */

@media (max-width: 767px) {

  .mobile-property-slider-section {

    display: block; /* Show mobile slider */

  }

}



/* Common Slider Container */

.property-slider-container,

.tablet-property-slider-container,

.mobile-property-slider-container {

  position: relative;

  overflow: hidden;

}



/* Hide Radio Inputs */

.property-slider-container input[type="radio"],

.tablet-property-slider-container input[type="radio"],

.mobile-property-slider-container input[type="radio"] {

  display: none;

}



/* Slides */

.property-slides {

  display: flex;

  width: 500%; /* 5 slides */

  transition: transform 0.5s ease-in-out;

}



.tablet-property-slides {

  display: flex;

  width: 800%; /* 8 slides */

  transition: transform 0.5s ease-in-out;

}



.mobile-property-slides {

  display: flex;

  width: 1500%; /* 15 slides */

  transition: transform 0.5s ease-in-out;

}



/* Slide Layout */

.property-slide,

.tablet-property-slide,

.mobile-property-slide {

  display: flex;

  justify-content: center;

  gap: 20px;

  padding: 20px;

}



.property-slide {

  flex: 0 0 20%; /* 5 slides */

}



.tablet-property-slide {

  flex: 0 0 12.5%; /* 8 slides */

}



.mobile-property-slide {

  flex: 0 0 6.6667%; /* 15 slides */

}



/* Card Styling */

.property-card,

.tablet-property-card,

.mobile-property-card {

  flex: 1 1 300px;

  max-width: 450px;

  height: 550px;

  position: relative;

  border-radius: 20px;

  background-size: cover;

  background-position: center;

  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);

}



/* Content Overlay */

.property-card-content,

.tablet-property-card-content,

.mobile-property-card-content {

  position: absolute;

  bottom: 20px;

  left: 20px;

  right: 20px;

  padding: 15px;

  border-radius: 8px;

}



/* Text Styling */

.property-card-content h3,

.tablet-property-card-content h3,

.mobile-property-card-content h3 {

  font-family: "Poppins", sans-serif;

  font-weight: 600;

  font-size: 22px;

  color: #ffffff;

  margin-bottom: 10px;

}



.property-card-content p,

.tablet-property-card-content p,

.mobile-property-card-content p {

  font-family: "Poppins", sans-serif;

  font-weight: 400;

  font-size: 15px;

  color: #ffffff;

  margin-bottom: 15px;

}



/* Button Styling */

.property-slider-button,

.tablet-slider-pagination-button,

.mobile-slider-pagination-button {

  display: inline-flex;

  align-items: center;

  color: #fff;

  text-decoration: none;

  padding: 0 30px;

  font-family: "Poppins", sans-serif;

  font-weight: 500;

  font-size: 16px;

  transition: background-color 0.3s ease;

  height: 70px;

  background-color: #007bff;

}



.property-slider-button:hover,

.tablet-slider-pagination-button:hover,

.mobile-slider-pagination-button:hover {

  background-color: #0056b3;

}



.button-text,

.tablet-button-text,

.mobile-button-text {

  margin-right: 18px;

  font-family: "Poppins", sans-serif;

  font-size: 24px;

  font-weight: bold;

}



.slider-pagination-pipe,

.tablet-slider-pagination-pipe,

.mobile-slider-pagination-pipe {

  margin-right: 20px;

  width: 1px;

  font-size: 55px;

  transform: scaleX(0.1);

  display: inline-flex;

  align-items: center;

}



.slider-pagination-arrow-icon,

.tablet-slider-pagination-arrow-icon,

.mobile-slider-pagination-arrow-icon {

  font-size: 18px;

}



/* Slide Transitions */

#property-slide-1:checked ~ .property-slides {

  transform: translateX(0);

}

#property-slide-2:checked ~ .property-slides {

  transform: translateX(-20%);

}

#property-slide-3:checked ~ .property-slides {

  transform: translateX(-40%);

}

#property-slide-4:checked ~ .property-slides {

  transform: translateX(-60%);

}

#property-slide-5:checked ~ .property-slides {

  transform: translateX(-80%);

}



#tablet-slide-1:checked ~ .tablet-property-slides {

  transform: translateX(0);

}

#tablet-slide-2:checked ~ .tablet-property-slides {

  transform: translateX(-12.5%);

}

#tablet-slide-3:checked ~ .tablet-property-slides {

  transform: translateX(-25%);

}

#tablet-slide-4:checked ~ .tablet-property-slides {

  transform: translateX(-37.5%);

}

#tablet-slide-5:checked ~ .tablet-property-slides {

  transform: translateX(-50%);

}

#tablet-slide-6:checked ~ .tablet-property-slides {

  transform: translateX(-62.5%);

}

#tablet-slide-7:checked ~ .tablet-property-slides {

  transform: translateX(-75%);

}

#tablet-slide-8:checked ~ .tablet-property-slides {

  transform: translateX(-87.5%);

}



#mobile-slide-1:checked ~ .mobile-property-slides {

  transform: translateX(0);

}

#mobile-slide-2:checked ~ .mobile-property-slides {

  transform: translateX(-6.6667%);

}

#mobile-slide-3:checked ~ .mobile-property-slides {

  transform: translateX(-13.3333%);

}

#mobile-slide-4:checked ~ .mobile-property-slides {

  transform: translateX(-20%);

}

#mobile-slide-5:checked ~ .mobile-property-slides {

  transform: translateX(-26.6667%);

}

#mobile-slide-6:checked ~ .mobile-property-slides {

  transform: translateX(-33.3333%);

}

#mobile-slide-7:checked ~ .mobile-property-slides {

  transform: translateX(-40%);

}

#mobile-slide-8:checked ~ .mobile-property-slides {

  transform: translateX(-46.6667%);

}

#mobile-slide-9:checked ~ .mobile-property-slides {

  transform: translateX(-53.3333%);

}

#mobile-slide-10:checked ~ .mobile-property-slides {

  transform: translateX(-60%);

}

#mobile-slide-11:checked ~ .mobile-property-slides {

  transform: translateX(-66.6667%);

}

#mobile-slide-12:checked ~ .mobile-property-slides {

  transform: translateX(-73.3333%);

}

#mobile-slide-13:checked ~ .mobile-property-slides {

  transform: translateX(-80%);

}

#mobile-slide-14:checked ~ .mobile-property-slides {

  transform: translateX(-86.6667%);

}

#mobile-slide-15:checked ~ .mobile-property-slides {

  transform: translateX(-93.3333%);

}



/* Navigation Controls (Dots and Arrows) */

.property-slider-nav,

.tablet-property-slider-nav,

.mobile-property-slider-nav {

  display: flex;

  justify-content: center;

  align-items: center;

  gap: 15px;

  padding-top: 20px;

  position: relative;

}



.property-arrow,

.tablet-property-arrow,

.mobile-property-arrow {

  position: relative;

  transform: translateY(0);

  cursor: pointer;

  transition: opacity 0.3s ease;

  z-index: 10;

  display: flex;

  align-items: center;

  justify-content: center;

  background: none;

  border: none;

  padding: 5px;

  border-radius: 50%;

}



.property-prev,

.tablet-property-prev,

.mobile-property-prev {

  margin-right: 20px;

  order: -1;

}



.property-next,

.tablet-property-next,

.mobile-property-next {

  margin-left: 20px;

  order: 1;

}



.property-arrow:hover,

.tablet-property-arrow:hover,

.mobile-property-arrow:hover {

  opacity: 0.8;

  background-color: rgba(0, 123, 255, 0.1);

}



.arrow-icon,

.tablet-arrow-icon,

.mobile-arrow-icon {

  width: 37px;

  height: 37px;

}



/* Pagination Dots */

.property-slider-dots,

.tablet-property-slider-dots,

.mobile-property-slider-dots {

  display: flex;

  gap: 8px;

}



.property-dot,

.tablet-property-dot,

.mobile-property-dot {

  display: inline-block;

  width: 12px;

  height: 12px;

  background-color: #007bff;

  opacity: 0.5;

  border-radius: 50%;

  cursor: pointer;

  transition: opacity 0.3s ease, background-color 0.3s ease, transform 0.3s ease;

}



.property-dot:hover,

.tablet-property-dot:hover,

.mobile-property-dot:hover {

  opacity: 0.8;

}



#property-slide-1:checked

  ~ .property-slider-nav

  .property-slider-dots

  #property-dot-1,

#property-slide-2:checked

  ~ .property-slider-nav

  .property-slider-dots

  #property-dot-2,

#property-slide-3:checked

  ~ .property-slider-nav

  .property-slider-dots

  #property-dot-3,

#property-slide-4:checked

  ~ .property-slider-nav

  .property-slider-dots

  #property-dot-4,

#property-slide-5:checked

  ~ .property-slider-nav

  .property-slider-dots

  #property-dot-5,

#tablet-slide-1:checked

  ~ .tablet-property-slider-nav

  .tablet-property-slider-dots

  #tablet-property-dot-1,

#tablet-slide-2:checked

  ~ .tablet-property-slider-nav

  .tablet-property-slider-dots

  #tablet-property-dot-2,

#tablet-slide-3:checked

  ~ .tablet-property-slider-nav

  .tablet-property-slider-dots

  #tablet-property-dot-3,

#tablet-slide-4:checked

  ~ .tablet-property-slider-nav

  .tablet-property-slider-dots

  #tablet-property-dot-4,

#tablet-slide-5:checked

  ~ .tablet-property-slider-nav

  .tablet-property-slider-dots

  #tablet-property-dot-5,

#tablet-slide-6:checked

  ~ .tablet-property-slider-nav

  .tablet-property-slider-dots

  #tablet-property-dot-6,

#tablet-slide-7:checked

  ~ .tablet-property-slider-nav

  .tablet-property-slider-dots

  #tablet-property-dot-7,

#tablet-slide-8:checked

  ~ .tablet-property-slider-nav

  .tablet-property-slider-dots

  #tablet-property-dot-8,

#mobile-slide-1:checked

  ~ .mobile-property-slider-nav

  .mobile-property-slider-dots

  #mobile-property-dot-1,

#mobile-slide-2:checked

  ~ .mobile-property-slider-nav

  .mobile-property-slider-dots

  #mobile-property-dot-2,

#mobile-slide-3:checked

  ~ .mobile-property-slider-nav

  .mobile-property-slider-dots

  #mobile-property-dot-3,

#mobile-slide-4:checked

  ~ .mobile-property-slider-nav

  .mobile-property-slider-dots

  #mobile-property-dot-4,

#mobile-slide-5:checked

  ~ .mobile-property-slider-nav

  .mobile-property-slider-dots

  #mobile-property-dot-5,

#mobile-slide-6:checked

  ~ .mobile-property-slider-nav

  .mobile-property-slider-dots

  #mobile-property-dot-6,

#mobile-slide-7:checked

  ~ .mobile-property-slider-nav

  .mobile-property-slider-dots

  #mobile-property-dot-7,

#mobile-slide-8:checked

  ~ .mobile-property-slider-nav

  .mobile-property-slider-dots

  #mobile-property-dot-8,

#mobile-slide-9:checked

  ~ .mobile-property-slider-nav

  .mobile-property-slider-dots

  #mobile-property-dot-9,

#mobile-slide-10:checked

  ~ .mobile-property-slider-nav

  .mobile-property-slider-dots

  #mobile-property-dot-10,

#mobile-slide-11:checked

  ~ .mobile-property-slider-nav

  .mobile-property-slider-dots

  #mobile-property-dot-11,

#mobile-slide-12:checked

  ~ .mobile-property-slider-nav

  .mobile-property-slider-dots

  #mobile-property-dot-12,

#mobile-slide-13:checked

  ~ .mobile-property-slider-nav

  .mobile-property-slider-dots

  #mobile-property-dot-13,

#mobile-slide-14:checked

  ~ .mobile-property-slider-nav

  .mobile-property-slider-dots

  #mobile-property-dot-14,

#mobile-slide-15:checked

  ~ .mobile-property-slider-nav

  .mobile-property-slider-dots

  #mobile-property-dot-15 {

  opacity: 1;

  background-color: #007bff;

  transform: scale(1.2);

}



/* Responsive Adjustments */

@media (min-width: 600px) and (max-width: 999px) {

  .tablet-property-slide {

    flex-direction: row;

    justify-content: center;

    gap: 15px;

  }



  .tablet-property-card {

    max-width: 350px;

    height: 350px;

  }



  .tablet-property-card-content h3 {

    font-size: 18px;

  }



  .tablet-property-card-content p {

    font-size: 14px;

  }



  .tablet-slider-pagination-button {

    padding: 8px 16px;

    font-size: 14px;

  }



  .tablet-button-text {

    font-size: 20px;

  }



  .tablet-slider-pagination-pipe {

    font-size: 20px;

  }



  .tablet-slider-pagination-arrow-icon {

    font-size: 16px;

  }



  .tablet-property-dot {

    width: 8px;

    height: 8px;

  }



  .tablet-property-slider-nav {

    gap: 10px;

  }



  .tablet-property-arrow .tablet-arrow-icon {

    width: 20px;

    height: 20px;

  }



  .tablet-property-prev {

    margin-right: 15px;

  }



  .tablet-property-next {

    margin-left: 15px;

  }

}



@media (max-width: 599px) {

  .mobile-property-slide {

    flex-direction: column;

    align-items: center;

  }



  .mobile-property-card {

    width: 350px;

    height: 300px;

  }



  .mobile-property-card-content h3 {

    font-size: 18px;

  }



  .mobile-property-card-content p {

    font-size: 14px;

  }



  .mobile-slider-pagination-button {

    padding: 6px 12px;

    font-size: 12px;

  }



  .mobile-button-text {

    font-size: 18px;

  }



  .mobile-slider-pagination-pipe {

    font-size: 18px;

  }



  .mobile-slider-pagination-arrow-icon {

    font-size: 14px;

  }



  .mobile-property-dot {

    width: 8px;

    height: 8px;

  }



  .mobile-property-slider-nav {

    gap: 10px;

  }



  .mobile-property-arrow .mobile-arrow-icon {

    width: 18px;

    height: 18px;

  }



  .mobile-property-prev {

    margin-right: 10px;

  }



  .mobile-property-next {

    margin-left: 10px;

  }

}



/* ******************************************************************************************************************************************** */



/*Main Frequent Question Answers Heading*/

.faq-section-container {

  display: flex;

  justify-content: center;

  align-items: center;

  padding: 0px 20px;

  padding-top: 40px;

  text-align: center;

}



.unique-faq-heading {

  font-family: "Poppins", sans-serif;

  font-size: 40px;

  font-weight: 600; /* SemiBold */

  color: #000000;

  margin: 0;

  word-break: break-word;

}



/* Responsive scaling */

@media (max-width: 768px) {

  .unique-faq-heading {

    font-size: 32px;

  }

}



@media (max-width: 480px) {

  .unique-faq-heading {

    font-size: 26px;

  }

}



/* Frequent Question Answers Styling */

.custom-faq-section {

  max-width: 1400px;

  margin: auto;

  padding: 20px;

  font-family: Arial, sans-serif;

  /* border: 1px solid red; */

}



.custom-faq-item {

  border-bottom: 1px solid #ccc;

  padding: 20px 40px;

  box-shadow: 1px 2px 8px rgba(0, 0, 0, 0.2);

  margin-bottom: 1.3rem;

  border-radius: 10px;

  /* border: 1px solid blue; */

}



.custom-faq-question {

  display: flex;

  justify-content: space-between;

  align-items: center;

  cursor: pointer;

  font-weight: bold;

  font-size: 1.1rem;

  /* border: 1px solid teal; */

  font-family: "Poppins", sans-serif;

  font-weight: 600;

  font-size: 18px;

  color: #000000;

}



.custom-faq-answer {

  display: none;

  padding-top: 10px;

  font-size: 1rem;

  /* border: 1px solid #0056b3; */

  font-family: "Poppins", sans-serif;

  font-size: 16px;

  color: #000000;

}



.custom-faq-icon {

  font-size: 1.2rem;

  transition: transform 0.3s ease;

}



.custom-faq-item.active .custom-faq-answer {

  display: block;

}



.custom-faq-item.active .custom-faq-icon {

  transform: rotate(180deg);

}

@media (max-width: 600px) {

  .custom-faq-question {

    font-size: 1rem;

  }



  .custom-faq-answer {

    font-size: 0.95rem;

  }

}



/* ////////////////////////////////////////////////////////  HOME PAGE SECOND BANNER SECTION ////////////////////////////////////////////////////////*/



/*Home Page Banner*/

.custom-banner-section {

  background-image: url("your-image-path.jpg"); /* Replace with your image path */

  background-size: cover;

  background-position: center;

  height: 451px;

  position: relative;

  display: flex;

  align-items: center;

  justify-content: center;

  text-align: center;

}



.custom-banner-overlay {

  /* Optional dark overlay for contrast */

  /* background-color: rgba(0, 0, 0, 0.4);  */

  width: 100%;

  height: 90%;

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  padding: 0 20px;

  background: url("/images/booking-banner.png");

  object-fit: cover;

}



.custom-banner-heading {

  font-family: "Poppins", sans-serif;

  font-size: 40px;

  font-weight: 600;

  color: #ffffff;

  margin-bottom: 16px;

}



.custom-banner-paragraph {

  font-family: "Poppins", sans-serif;

  font-size: 20px;

  font-weight: 400;

  color: #ffffff;

  margin-bottom: 24px;

  max-width: 1200px;

  line-height: 50px;

}



/*Custom Contact Us Button For Banner*/

.banner-contact-us-button {

  display: inline-flex;

  align-items: center;

  background-color: #ff5900;

  color: #fff;

  text-decoration: none;

  padding: 0px 30px;

  /* border-radius: 5px; */

  font-family: "Poppins", sans-serif;

  font-weight: 500;

  font-size: 16px;

  transition: background-color 0.3s ease;

  height: 70px !important;

}



.banner-contact-us-button-text {

  margin-right: 18px;

  font-family: "Poppins", sans-serif !important;

  font-size: 24px !important;

  font-weight: bold !important;

}



.banner-contact-us-pipe {

  margin-right: 20px;

  width: 1px !important;

  font-size: 55px; /* Increased font size for taller pipe */

  /*line-height: 1;*/ /* Prevents extra vertical spacing */

  transform: scaleX(0.1);

  display: inline-flex;

  align-items: center; /* Vertically centers the pipe */

}



.banner-contact-us-arrow-icon {

  font-size: 18px;

}



.banner-contact-us-button:hover {

  background-color: #0056b3;

}



/* Responsive Styles */

@media (max-width: 768px) {

  .banner-contact-us-button {

    padding: 8px 16px;

    font-size: 14px;

  }



  .banner-contact-us-pipe {

    font-size: 20px; /* Slightly smaller for tablets */

  }



  .banner-contact-us-arrow-icon {

    font-size: 16px;

  }

}



@media (max-width: 480px) {

  .banner-contact-us-button {

    padding: 6px 12px;

    font-size: 12px;

  }



  .banner-contact-us-pipe {

    font-size: 18px; /* Smaller for mobile */

  }



  .banner-contact-us-arrow-icon {

    font-size: 14px;

  }

}



/* Responsive adjustments */

@media (max-width: 768px) {

  .custom-banner-heading {

    font-size: 32px;

  }

  .custom-banner-paragraph {

    font-size: 18px;

  }

}



@media (max-width: 480px) {

  .custom-banner-heading {

    font-size: 26px;

  }

  .custom-banner-paragraph {

    font-size: 16px;

  }

}



/*Large Mobile Responsive*/

@media (max-width: 767px) {

  h1.custom-banner-heading {

    font-size: 26px;

  }



  p.custom-banner-paragraph {

    line-height: 27px;

  }

  .custom-banner-overlay {

    padding: 0 40px !important;

    height: 100%;

  }

  .second-banner-contact-us-btn a {

    height: 50px !important;

  }

  .second-banner-contact-us-btn a .banner-contact-us-button-text {

    font-size: 20px !important;

  }

  .second-banner-contact-us-btn a .banner-contact-us-pipe {

    font-size: 38px;

  }

  .second-banner-contact-us-btn a .banner-contact-us-arrow-icon {

    margin-top: 8px;

    margin-left: -10px;

  }

}



/*Medium Mobile Responsive*/

@media (max-width: 375px) {

  .custom-banner-overlay {

    height: 110%;

  }

}



/* Small Mobile Device Responsive*/

@media (max-width: 320px) {

  .custom-banner-overlay {

    height: 110%;

    padding: 0 20px !important;

  }

  h1.custom-banner-heading {

    font-size: 23px;

  }

}



/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */



/* ////////////////////////////////////////////////////////  HOME PAGE SLIDER # 2 SECTION ////////////////////////////////////////////////////////*/



/*Home Page Slider # 2*/

section.unique-slider-section {

  width: 100%;

  padding: 50px 20px;

}



.unique-slider-container {

  max-width: 1400px;

  margin: auto;

  position: relative;

  /* border: 1px solid green; */

}



.unique-slider-wrapper {

  display: flex;

  transition: transform 0.5s ease-in-out;

  /* border: 1px solid blue; */

  padding-top: 3rem;

}



.unique-slider-page {

  min-width: 100%;

  display: flex;

  justify-content: space-around;

  align-items: stretch;

}



.unique-slider-card {

  height: 428px;

  width: 445px;

  background-color: #ffffff;

  border-radius: 15px;

  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);

  padding-top: 80px;

  text-align: center;

  position: relative;

  flex-shrink: 0;

  /* border: 1px solid red; */

}



.unique-slider-card img.circular-img {

  width: 115px;

  height: 115px;

  object-fit: cover;

  border-radius: 50%;

  position: absolute;

  /* top: -57.5px; */

  top: -50.5px;

  left: 50%;

  transform: translateX(-50%);

  border: 4px solid #fff;

  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);

  /* border: 1px solid brown; */

}



.unique-slider-card h3 {

  font-size: 20px;

  font-weight: 600;

  margin-bottom: 10px;

  color: #000000;

}



.unique-slider-card p {

  font-size: 18px;

  font-style: italic;

  color: #444444;

  padding: 0 20px;

}



.custom-slider-navigation {

  margin-top: 30px;

  display: flex;

  justify-content: center;

  align-items: center;

  gap: 30px;

}



.custom-prev,

.custom-next {

  /* background-color: #000000; */

  background-color: white;

  border: none;

  padding: 10px 18px;

  font-size: 18px;

  cursor: pointer;

  border-radius: 50%;

  width: 80px;

  display: flex;

  justify-content: center;

  /* border: 1px solid red; */

}



.custom-slider-dots {

  display: flex;

  justify-content: center;

  align-items: center;

  gap: 12px;

  /* border: 1px solid brown; */

}



.custom-slider-dots .dot {

  width: 16px;

  height: 16px;

  background-color: #bbb;

  border-radius: 50%;

  cursor: pointer;

  transition: background-color 0.3s ease;

}



.custom-slider-dots .active-dot {

  background-color: #0096ff;

}



/* Clip only on the X‐axis (prevent horizontal overflow) */

/* Allow everything on the Y‐axis (so circles can extend above/below) */

section.unique-slider-section {

  /* hide only horizontal spill, allow vertical peek */

  overflow-x: hidden !important;

  overflow-y: visible !important;

}



.unique-slider-container {

  overflow-x: hidden !important;

  overflow-y: visible !important;

}



/* Your wrapper can remain fully visible vertically */

.unique-slider-wrapper {

  overflow: visible !important;

}



/* Stack the cards and images above other content */

.unique-slider-card {

  position: relative;

  z-index: 1;

}



.unique-slider-card img.circular-img {

  z-index: 2;

}



/*Home Page Slider # 2 Heading*/

.slider-heading-section-container {

  display: flex;

  justify-content: center;

  align-items: center;

  padding: 0px 20px;

  padding-top: 40px;

  text-align: center;

}



.unique-slider-2-heading {

  font-family: "Poppins", sans-serif;

  font-size: 40px;

  font-weight: 600; /* SemiBold */

  color: #000000;

  margin: 0;

  word-break: break-word;

}



/* Responsive scaling */

@media (max-width: 1200px) {

  /* For screens up to 1200px, transition to a single-card view */

  .unique-slider-page {

    /* Ensure cards remain horizontal within the page */

    flex-direction: row;

    /* Prevent cards from wrapping to the next line */

    flex-wrap: nowrap;

    /* Hide any content that overflows horizontally within the page */

    overflow-x: hidden;

    /* Align items to the start of the flex container */

    justify-content: flex-start;

    /* Maintain vertical alignment */

    align-items: stretch;

  }



  .unique-slider-card {

    /* Make each card take the full available width of its parent page */

    min-width: 100%;

    /* Remove any horizontal margins to ensure full width usage */

    margin: 0;

    /* Allow card height to adjust based on its content */

    height: auto;

    /* Add some bottom padding for visual spacing */

    padding-bottom: 20px;

  }



  .unique-slider-2-heading {

    font-size: 32px;

  }

}



@media (max-width: 480px) {

  .unique-slider-2-heading {

    font-size: 26px;

  }



  .unique-slider-card {

    /* Further refinement for smaller screens, if necessary */

    padding-left: 10px;

    padding-right: 10px;

  }

}



/* Specific mobile device breakpoints (if further adjustments are needed) */

@media (max-width: 767px) {

  /* No specific changes here for the slider layout, as 1200px handles it */

}



@media (max-width: 375px) {

  /* No specific changes here for the slider layout */

}



@media (max-width: 320px) {

  /* No specific changes here for the slider layout */

}



/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */



/* ////////////////////////////////////////////////////////  HOME PAGE CONTACT US FORM SECTION ////////////////////////////////////////////////////////*/



/*Contact Us Form Heading*/

.contact-us-form-section-container {

  display: flex;

  justify-content: center;

  align-items: center;

  padding: 0px 20px;

  padding-top: 40px;

  text-align: center;

}



.unique-contact-us-form-heading {

  font-family: "Poppins", sans-serif;

  font-size: 40px;

  font-weight: 600; /* SemiBold */

  color: #000000;

  margin: 0;

  word-break: break-word;

}



/* Responsive scaling */

@media (max-width: 768px) {

  .unique-contact-us-form-heading {

    font-size: 32px;

  }

}



@media (max-width: 480px) {

  .unique-contact-us-form-heading {

    font-size: 26px;

  }

}



/* Contact Us Form Styling */

/* Ensure the form is centered and padded */

.contact-us-section {

  display: flex;

  justify-content: center;

  align-items: center;

  padding: 0px;

  min-height: 80vh; /* Optional: Full viewport height for centering */

  /* border: 1px solid green; */

}



/* Style the form container */

.contact-us-form {

  width: 100%;

  max-width: 900px; /* Limits form width on larger screens */

  /* border: 1px solid red; */

  height: 650px;

  padding-top: 20px !important;

}



/* Style each row */

.contact-us-row {

  display: flex;

  flex-wrap: wrap; /* Allows fields to wrap on smaller screens */

  margin-bottom: 10px;

}



/* Style input fields and textarea */

.contact-us-input {

  /* border: 1px solid blue !important; */

  height: 70px;

}

.contact-us-textarea {

  /* border: 1px solid blue !important; */

  height: 330px !important;

}

.contact-us-input,

.contact-us-textarea {

  flex: 1; /* Allows fields to grow equally */

  margin: 5px; /* Spacing between fields */

  padding: 10px; /* Inner padding for comfort */

  border: 1px solid #757474; /* Border as required */

  border-radius: 5px; /* Rounded corners */

  font-family: "Poppins", sans-serif; /* Poppins font */

  font-size: 18px; /* Font size as required */

  font-weight: 400; /* Regular weight */

  padding-left: 20px !important;

}



/* Specific styling for textarea */

.contact-us-textarea {

  height: 100px; /* Fixed height */

  resize: vertical; /* Allows vertical resizing only */

}



/* Center the button row */

.contact-us-button-row {

  justify-content: center;

  margin-top: 30px !important;

}



/*Submit Button for Contact Us form*/

.contact-us-form-button {

  display: inline-flex;

  align-items: center;

  background-color: #0096ff;

  color: #fff;

  text-decoration: none;

  padding: 0px 30px;

  border: none !important;

  font-family: "Poppins", sans-serif;

  font-weight: 500;

  font-size: 16px;

  transition: background-color 0.3s ease;

  height: 70px !important;

}



.contact-us-form-button-text {

  margin-right: 18px;

  font-family: "Poppins", sans-serif !important;

  font-size: 24px !important;

  font-weight: bold !important;

}



.contact-us-form-pipe {

  margin-right: 20px;

  width: 1px !important;

  font-size: 55px; /* Increased font size for taller pipe */

  /*line-height: 1;*/ /* Prevents extra vertical spacing */

  transform: scaleX(0.1);

  display: inline-flex;

  align-items: center; /* Vertically centers the pipe */

}



.contact-us-form-arrow-icon {

  font-size: 18px;

}



.contact-us-form-button:hover {

  background-color: #0056b3;

}



/* Responsive Styles */

@media (max-width: 768px) {

  .contact-us-form-button {

    padding: 8px 16px;

    font-size: 14px;

  }



  .contact-us-form-pipe {

    font-size: 20px; /* Slightly smaller for tablets */

  }



  .contact-us-form-arrow-icon {

    font-size: 16px;

  }

}



@media (max-width: 480px) {

  .contact-us-form-button {

    padding: 6px 12px;

    font-size: 12px;

  }



  .contact-us-form-pipe {

    font-size: 18px; /* Smaller for mobile */

  }



  .contact-us-form-arrow-icon {

    font-size: 14px;

  }

}



/* Placeholder styling */

.contact-us-input::placeholder,

.contact-us-textarea::placeholder {

  font-family: "Poppins", sans-serif;

  font-size: 18px;

  font-weight: 400;

  color: #999; /* Light gray for readability */

}



/* Responsive design */

@media (max-width: 768px) {

  .contact-us-row {

    flex-direction: column; /* Stack fields vertically on small screens */

  }



  .contact-us-input,

  .contact-us-textarea {

    margin: 5px 0; /* Adjust margins for vertical stacking */

  }

}



/*Large Mobile Responsive*/

@media (max-width: 767px) {

  section.contact-us-section {

    padding: 0 30px;

  }

  button.contact-us-form-button {

    width: 170px !important;

    justify-content: center;

    height: 50px !important;

  }



  button.contact-us-form-button .contact-us-form-button-text {

    font-size: 18px !important;

  }



  button.contact-us-form-button .contact-us-form-pipe {

    font-size: 38px;

  }

  button.contact-us-form-button .contact-us-form-arrow-icon {

    margin-top: 8px;

    margin-left: -10px;

  }

  .contact-us-section {

    min-height: 40vh !important;

  }

  .contact-us-form {

    height: 500px !important;

    /* border: 1px solid red; */

  }

}



/*Medium Mobile Responsive*/

@media (max-width: 375px) {

}



/* Small Mobile Device Responsive*/

@media (max-width: 320px) {

}

/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */



/* ////////////////////////////////////////////////////////  FOOTER SECTION ////////////////////////////////////////////////////////*/



/* Footer Section */

.footer-section {

  background-color: #041e30;

  color: #ffffff;

  font-family: "Poppins", sans-serif !important;

  padding-top: 80px;

}



/* Footer Container */

.footer-container {

  display: flex;

  flex-wrap: wrap;

  justify-content: space-between;

  justify-self: center;

  /* border: 1px solid yellow; */

  width: 80%;

}



/* Footer Columns */

.footer-column {

  flex: 1;

  min-width: 200px;

  margin: 10px;

  /* border: 1px solid pink; */

}

.footer-column-1 {

  min-width: 460px !important;

  /* border: 1px solid purple; */

}

.footer-column-4 {

  padding-left: 33px !important;

  min-width: 330px !important;

  /* border: 1px solid teal; */

}

.footer-column-3 {

  min-width: 250px !important;

  /* border: 1px solid teal; */

}

.footer-list li a {

  text-decoration: none !important;

}

.footer-list li a:hover,

.footer-contact-list li span:hover {

  color: #0096ff;

}



.footer-list li a,

.footer-contact-list li span {

  font-size: 16px !important;

}

/* Logo */

.footer-logo {

  width: 250px; /* Customize as needed */

  margin-bottom: 20px;

  height: 60px;

}



/* Paragraph Text */

.footer-text {

  font-size: 15px;

  font-weight: 400;

  margin-bottom: 20px;

}



/* Social Icons For Footer*/

.footer-social-icons {

  /* border: 1px solid orange; */

  margin-top: 50px;

}

.footer-social-icons a {

  margin-left: 10px;

}



.footer-social-icons img {

  width: 30px;

  height: 30px;

}



/* Headings */

.footer-heading {

  font-size: 30px;

  font-weight: 600;

  margin-bottom: 20px;

  color: #ffffff;

}



/* Lists */

.footer-list,

.footer-contact-list {

  list-style: none;

  padding: 0;

}



.footer-list li,

.footer-contact-list li {

  margin-bottom: 28px;

}



.footer-contact-list li a {

  /* border: 1px solid brown; */

  margin-right: 10px;

}

.footer-list a,

.footer-contact-list span {

  color: #ffffff;

  text-decoration: none;

  font-size: 18px;

  font-weight: 400;

}



.footer-list a:hover {

  text-decoration: underline;

}



/* Contact Icons */

.footer-contact-icon {

  color: #0096ff;

  margin-right: 10px;

  font-size: 20px;

  vertical-align: middle;

}



/* Horizontal Line */

.footer-divider {

  border: 0;

  height: 1px;

  background-color: #ffffff;

  margin: 20px 0;

  width: 80%;

  justify-self: center;

}



/* Bottom Content */

.footer-bottom {

  display: flex;

  justify-content: space-between;

  align-items: center;

  padding: 0px 0px;

  padding-bottom: 20px;

  font-size: 16px;

  width: 80%;

  justify-self: center;

}



.footer-bottom a {

  color: #ffffff;

  text-decoration: none;

}



.footer-bottom a:hover {

  text-decoration: underline;

}



.footer-bottom span {

  margin: 0 10px;

  color: #ffffff;

}



/* .footer-bottom-right {

  border: 1px solid green;

} */

.footer-bottom-right a {

  margin-right: 10px;

  text-decoration: none !important;

}

.footer-bottom-right a:hover {

  color: #0096ff;

}



/*Commented out for now by Muzaffar*/

/* Responsive Design */

/* @media (max-width: 992px) {

  .footer-container {

    flex-direction: column;

    align-items: center;

  }



  .footer-column {

    margin: 20px 0;

    text-align: center;

  }



  .footer-social-icons {

    justify-content: center;

  }



  .footer-bottom {

    flex-direction: column;

    text-align: center;

  }



  .footer-bottom-left,

  .footer-bottom-right {

    margin: 10px 0;

  }

} */



/*Commented out for now by Muzaffar*/

/* @media (max-width: 576px) {

  .footer-heading {

    font-size: 26px;

  }



  .footer-text,

  .footer-list a,

  .footer-contact-list span {

    font-size: 16px;

  }



  .footer-bottom {

    font-size: 14px;

  }

} */



/*Commented out for now by Muzaffar*/

/*Large Mobile Responsive*/

/* @media (max-width: 767px) {

  .footer-column.footer-column-2,

  .footer-column.footer-column-3,

  .footer-column.footer-column-4 {

    display: flex;

    flex-direction: column;

    padding: 0px !important;

    border: 1px solid blue;

    min-width: 300px !important;

  }



  .footer-container {

    width: 80%;

    padding: 0px !important;

    padding-left: 0px !important;

  }



  .footer-column-1 p {

    font-size: 14px !important;

  }

  .footer-column-1 {

    min-width: 300px !important;

  }

} */



/*Commented out for now by Muzaffar*/

/* Small Mobile Device Responsive*/

/* @media (max-width: 320px) {

  .footer-column.footer-column-2,

  .footer-column.footer-column-3,

  .footer-column.footer-column-4 {

    display: flex;

    flex-direction: column;

    padding: 0px !important;

    border: 1px solid blue;

    min-width: 200px !important;

  }

  .footer-column-1 {

    min-width: 200px !important;

  }

} */



/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */



/* ////////////////////////////////////////////////////////  ABOUT PAGE SECTION ///////////////////////////////////////////////////////////////*/



/* ***************************************************************************************************

                                     ABOUT US PAGE STYLING 

*************************************************************************************************** */

.about-us-page-hero-banner {

  height: 680px;

  background-image: url("/images/male-electrician-working-switchboard-with-fuses.png") !important;

  /* border: 1px solid red; */

}



.about-us-navbar {

  /* border: 1px solid yellow; */

  margin-top: -290px;

}

.about-us-main-title-div {

  margin-bottom: 2.5rem;

}

.about-us-content {

  /* border: 1px solid blue; */

  padding-top: 5rem;

}

.about-us-page-text-container p span,

.about-us-page-unordered-list li,

.about-us-page-last-span,

.about-us-page-unordered-list-for-image-and-text-section li {

  font-family: "Poppins", sans-serif !important;

  font-size: 16px !important;

  color: #000000 !important;

  line-height: 25px !important;

}

.about-us-page-text-container ul {

  /* border: 1px solid red; */

  margin-left: 20px;

}

.about-us-page-banner-heading {

  /* border: 1px solid yellowgreen; */

  width: 65%;

  font-size: 35px;

}

.about-us-page-banner-heading span a {

  color: white;

}



.about-us-page-image-and-text-section {

  display: flex;

  align-items: center;

  justify-content: space-between;

  flex-direction: row-reverse;

  max-width: 1300px;

  margin: 0 auto;

  gap: 35px;

  /* border: 1px solid blue; */

}



.about-us-page-text-container-for-image-and-text-section span a {

  color: black;

}

.about-us-page-unordered-list-for-image-and-text-section {

  /* border: 1px solid #041e30; */

  margin-left: 1rem;

}

.about-us-page-image-text-section-image {

  width: 60% !important;

  /* border: 1px solid blue; */

}

.about-us-page-image-text-section-image img {

  height: 800px;

}

/* .about-us-page-image-and-text-section {

  border: 1px solid brown;

} */

.about-us-page-unordered-list-for-image-and-text-section li {

  margin-bottom: 0.8rem;

}

.about-us-page-text-container-for-image-and-text-section h2 {

  font-size: 35px !important;

}

.about-us-page-unordered-list-for-image-and-text-section li a {

  color: black;

}



/*About Us Navbar Styling for Mobile Screen Devices*/

@media (max-width: 500px) {

  .about-us-navbar ul.nav-links.active li {

    margin-left: 10px !important;

    /* border: 1px solid red; */

  }

}



@media (max-width: 767px) {

  .about-us-navbar ul.nav-links.active li a {

    margin-right: 10px;

    /* border: 1px solid orange; */

  }

}



@media (max-width: 320px) {

  .about-us-navbar ul.nav-links.active li a {

    margin-right: 10px;

  }

}



/*Large Mobile Responsive*/

@media (max-width: 767px) {

  .section-container.about-us-page-image-and-text-section {

    flex-direction: column;

  }

  .image-container.about-us-page-image-text-section-image {

    width: 85% !important;

    height: 400px;

    /* border: 1px solid blue; */

  }

  .image-container.about-us-page-image-text-section-image img {

    height: 100%;

    object-fit: cover;

    object-position: center;

  }

  .text-container.about-us-page-text-container-for-image-and-text-section {

    padding: 0px 30px;

    padding-bottom: 15px;

    /* border: 1px solid red; */

  }

  .custom-banner-overlay {

    padding: 0px 30px !important;

    /* border: 1px solid red; */

  }

  h1.custom-banner-heading.about-us-page-banner-heading {

    font-size: 22px !important;

    /* border: 1px solid; */

    padding-bottom: 20px;

    width: 90%;

  }

  .custom-banner-overlay {

    padding: 0px 30px !important;

    /* border: 1px solid red; */

  }



  .about-us-page-main-contact-us-button .banner-contact-us-button {

    height: 50px !important;

  }

  .about-us-page-main-contact-us-button .banner-contact-us-button-text {

    font-size: 20px !important;

  }



  .about-us-page-main-contact-us-button .banner-contact-us-pipe {

    font-size: 38px;

    margin-right: 10px !important;

  }

  .about-us-page-main-contact-us-button .banner-contact-us-arrow-icon {

    margin-top: 6px;

  }



  /*Commented out for now by Muzaffar*/

  /* .about-us-page-hero-banner .navbar-line {

    margin-top: -10px !important;

  } */

}



/*Commented out for now by Muzaffar*/

/* Small Mobile Device Responsive*/

/* @media (max-width: 320px) {

  .about-us-content {

    border: 1px solid red;

    margin-top: 30px !important;

    padding-top: 20px !important;

  }

} */

/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/* FAQ's Section */

.faqs-page-hero-banner {

  height: 680px;

  background-image: url("/images/FAQs.png") !important;

  /* border: 1px solid red; */

}



/* ////////////////////////////////////////////////////////  OUR SERVICES PAGE SECTION ///////////////////////////////////////////////////////////////*/



/* ***************************************************************************************************

                                     OUR SERVICES PAGE STYLING 

*************************************************************************************************** */

/* ////////////////////////////////////////////////////////////////////// */

@media (max-width: 767px) {

  /*Muzaffar Hussain Addes Changes*/

  .our-services-property-card .slider-button a.slider-pagination-button {

    width: 170px !important;

  }

  .our-services-property-card

    .slider-button

    a.slider-pagination-button

    .slider-pagination-pipe {

    font-size: 45px !important;

  }



  .our-services-property-card

    .slider-button

    a.slider-pagination-button

    .slider-pagination-arrow-icon {

    margin-left: 3px !important;

  }

}



.our-services-hero-banner {

  height: 680px;

  background-image: url("/images/our-services-navbar-image.png") !important;

  /* border: 1px solid red; */

}

.our-services-property-slides {

  /* border: 1px solid red; */

  display: flex;

  flex-wrap: wrap;

  justify-content: center;

  width: 85%;

  justify-self: center;

}

.our-services-property-card {

  /* border: 1px solid yellow; */

  flex: 1 1 400px;

  max-width: 450px;

  height: 550px; /* Fixed height for consistency */

  position: relative;

  border-radius: 20px;

  background-size: cover;

  background-position: center;

  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);

}

.our-services-section-multiple-cards {

  padding-top: 5rem;

  padding-bottom: 5rem;

}



@media (max-width: 500px) {

  .services-navbar-styling ul.nav-links.active li a {

    margin-right: 30px;

    /* border: 1px solid orange; */

  }

}



@media (max-width: 375px) {

  .services-navbar-styling ul.nav-links.active li {

    margin-right: 50px !important;

  }

}



@media (max-width: 320px) {

  .services-navbar-styling ul.nav-links.active li a {

    margin-right: 40px;

  }

}



/*Large Mobile Responsive*/

@media (max-width: 767px) {

  /* section.our-services-section-multiple-cards {

    border: 1px solid red;

  } */

  .property-slide.property-slide-1.our-services-property-slides {

    /* border: 1px solid orange; */

    padding: 0px;

  }

  .our-services-property-card {

    /* border: 1px solid green; */

    width: 340px !important;

  }

  .our-services-property-card

    .property-card-content

    h3

    .our-services-property-card

    .property-card-content

    h3 {

    font-size: 17px !important;

  }

  .our-services-property-card .property-card-content p {

    font-size: 16px;

  }

  .our-services-property-card .property-card-content .slider-button a {

    height: 53px !important;

    border-radius: 0px;

    width: 200px;

  }

  .our-services-property-card

    .property-card-content

    .slider-button

    a

    .button-text {

    font-size: 17px !important;

    margin-right: 13px;

  }

  .our-services-property-card

    .property-card-content

    .slider-button

    a

    .slider-pagination-pipe {

    margin-right: 10px;

  }

  .our-services-property-card

    .property-card-content

    .slider-button

    a

    .slider-pagination-arrow-icon {

    margin-top: 5px;

  }

}



/*Medium Mobile Responsive*/

@media (max-width: 375px) {

  section.our-services-section-multiple-cards {

    /* border: 1px solid red; */

    padding-left: 0px !important;

  }

  .property-slide.property-slide-1.our-services-property-slides {

    /* border: 1px solid orange; */

    padding: 0px;

  }

  .our-services-property-card {

    /* border: 1px solid green; */

    width: 310px !important;

  }

}



/* Small Mobile Device Responsive*/

@media (max-width: 320px) {

  section.our-services-section-multiple-cards {

    /* border: 1px solid red; */

    padding-left: 0px !important;

  }

  .property-slide.property-slide-1.our-services-property-slides {

    /* border: 1px solid orange; */

    padding: 0px;

    width: 100%;

  }

  .our-services-property-card {

    /* border: 1px solid green; */

    width: 290px !important;

  }

}



/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */



/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */



/* ***************************************************************************************************

                          RIGHT THREE BOXES STYLING FOR INNER PAGES OF SERVICES 

*************************************************************************************************** */

.contact-section {

  padding: 80px 20px;

}



.contact-container {

  display: flex;

  flex-wrap: wrap;

  gap: 240px;

  /* border: 1px solid red; */

  max-width: 80%;

  justify-self: center;

}



.contact-column {

  box-sizing: border-box;

}



/* Primary (image + text) column */

.contact-column--media {

  flex: 2 1 300px;

}



.media-image {

  width: 100%;

  height: auto;

  display: block;

  border-radius: 8px;

}



.media-text,

.media-text-unordered-list {

  margin-top: 25px;

  font-family: "Poppins", sans-serif;

  font-size: 18px;

  font-weight: 400;

  color: #000000;

}



/* Secondary (boxes) column */

.contact-column--info {

  flex: 1 1 50px;

  display: flex;

  flex-direction: column;

  gap: 20px;

}



.contact-box {

  flex: 0 0 280px;

  border-radius: 16px;

  display: flex;

  align-items: center;

  justify-content: center;

  text-align: center;

  padding: 10px;

  box-sizing: border-box;

}



.contact-box--phone {

  background-color: #0096ff;

}



.contact-box--email {

  background-color: #041e30;

}



.contact-box--address {

  background-color: #ff5900;

}



.contact-box__text {

  font-family: "Poppins", sans-serif;

  font-size: clamp(1rem, 2vw, 25px);

  font-weight: 600;

  color: #ffffff;

  word-break: break-word;

  padding: 50px 20px 50px 20px;

}



/*Commented out for now by Muzaffar*/

/* Responsive adjustments */

@media (max-width: 768px) {

  .contact-container {

    flex-direction: column;

  }



  .contact-column--info {

    flex-direction: row;

    flex-wrap: wrap;

    justify-content: space-between;

  }



  .contact-box {

    flex: 1 1 calc(50% - 10px);

    max-width: calc(50% - 10px);

    height: auto;

  }

}



@media (max-width: 480px) {

  .contact-box {

    flex: 1 1 100%;

    max-width: 100%;

  }

}

/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/



/* ////////////////////////////////////////////////////////  EPC PAGE SECTION ///////////////////////////////////////////////////////////////*/



/* ***************************************************************************************************

                                     EPC PAGE STYLING 

*************************************************************************************************** */

.epc-page-main-title-heading {

  width: 150% !important;

  /* border: 1px solid red; */

}

.EPC-Hero-Banner {

  height: 680px;

  background-image: url("/images/EPC.png") !important;

}



/*Large Mobile Responsive*/

@media (max-width: 767px) {

  .inner-page-container .contact-column--media {

    /* border: 1px solid red; */

    max-width: 600px !important;

  }

  .inner-page-main-section {

    /* border: 1px solid blue; */

    padding: 40px 0px;

  }

  .inner-page-container {

    gap: 20px !important;

  }

  /*Commented out for now by Muzaffar*/

  /* .EPC-Hero-Banner .navbar-line {

    margin-top: 70px !important;

  } */

  .inner-page-container .contact-column--media p,

  .inner-page-container .contact-column--media ul li {

    font-size: 15px !important;

  }

}



/*Medium Mobile Responsive*/

@media (max-width: 375px) {

}



/* Small Mobile Device Responsive*/

@media (max-width: 320px) {

}

/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */



/* ////////////////////////////////////////////////////////  PAT PAGE SECTION ///////////////////////////////////////////////////////////////*/



/* ***************************************************************************************************

                                     PAT PAGE STYLING 

*************************************************************************************************** */

.PAT-Hero-Banner {

  height: 680px;

  background-image: url("/images/PAT.png") !important;

}



/*Commented out for now by Muzaffar*/

/* @media (max-width: 767px) {

  .PAT-Hero-Banner .navbar-line {

    margin-top: 45px !important;

  }

} */

/*Medium Mobile Responsive*/

/* @media (max-width: 375px) {

  .PAT-Hero-Banner .navbar-line {

    margin-top: 30px !important;

  }

} */

/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */



/* ***************************************************************************************************

                                     LEGIONELLA PAGE STYLING 

*************************************************************************************************** */

.Legionella-Hero-Banner {

  height: 700px;

  background-image: url("/images/Legionella.png") !important;

}



/* ***************************************************************************************************

                                     FHP3 PAGE STYLING 

*************************************************************************************************** */

.media-text-unordered-list {

  margin-left: 1.5rem;

}

.FHP3-Hero-Banner {

  height: 700px;

  background-image: url("/images/FHP3.png") !important;

}



/* ////////////////////////////////////////////////////////  BLOG PAGE SECTION ////////////////////////////////////////////////////////*/



/* ////////////////////////////////////////////////////////  EICR-BLOG PAGE SECTION ///////////////////////////////////////////////////////////////*/



/* ***************************************************************************************************

                                     EICR-BLOG PAGE STYLING 

*************************************************************************************************** */

.EICR-blog-container {

  width: 67%;

}

.EICR-Blog-Hero-Banner {

  height: 700px;

  background-image: url("/images/male-plumber-working-with-client-fix-kitchen-problems.png") !important;

}

.media-text-span {

  color: #0096ff !important;

  /* margin-top: 30px !important; */

  font-family: "Poppins", sans-serif;

  font-size: 18px;

  font-weight: 400;

  /* border: 1px solid red; */

  margin-bottom: 2rem;

}

/*Large Mobile Responsive*/

@media (max-width: 767px) {

  .hero-banner-main-title.about-us-main-title-div.epc-page-main-title-heading {

    /* border: 1px solid red; */

    width: 100% !important;

  }



  /*Commented out for now by Muzaffar*/

  /* .unique-blog-container {

    border: 1px solid blue;

    width: 90% !important;

  } */



  h2.unique-blog-title {

    font-size: 26px;

  }

  .EICR-blog-container {

    /* border: 1px solid blue; */

    width: 100%;

  }



  /*Commented out for now by Muzaffar*/

  /* .EICR-blog-container .contact-column--media {

    border: 1px solid red;

  } */

  /* .EICR-blog-main-section .contact-section {

    padding: 40px 0px;

  } */



  /* .EICR-blog-main-section .EICR-blog-container {

    border: 3px solid;

    max-width: 350px !important;

  } */



  /* .media-text-EICR-Blog {

    font-size: 15px !important;

    line-height: 23px;

  } */

}



/*Medium Mobile Responsive*/

@media (max-width: 375px) {

}



/* Small Mobile Device Responsive*/

@media (max-width: 320px) {

}



/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */



/* ////////////////////////////////////////////////////////  BLOG PAGE SECTION ////////////////////////////////////////////////////////*/



/* ////////////////////////////////////////////////////////  CONTACT US PAGE SECTION ///////////////////////////////////////////////////////////////*/



/* ***************************************************************************************************

                                     CONTACT US PAGE STYLING 

*************************************************************************************************** */



.Contact-Us-Hero-Banner {

  height: 700px;

  background-image: url("/images/couple-using-laptop-desk.png") !important;

}

.contact-us-page-contact-form {

  max-width: 1500px !important;

  width: 100%;

  margin-top: -110px !important;

  /* border: 1px solid orange; */

}

.contact-us-page-left-side-div {

  flex-basis: 400px !important;

  padding-top: 0px !important;

  /* border: 1px solid brown; */

}



.contact-us-column--info {

  flex: 1 1 39px !important;

}

.contact-us-container {

  gap: 90px !important;

  width: 100% !important;

  /* border: 1px solid purple; */

}



/*Large Mobile Responsive*/

@media (max-width: 767px) {

  /* .contact-us-page-left-side-div {

    border: 1px solid red;

  } */

  .contact-us-page-contact-form {

    /* border: 1px solid blue; */

    margin-top: 0px !important;

    width: 100% !important;

  }

  .contact-us-page-main-info-new-class {

    /* border: 1px solid purple; */

    margin-top: -60px !important;

  }

}



/*Commented out for now by Muzaffar*/

/* @media (max-width: 375px) {

  .contact-page-main-contact-section {

    padding: 0px !important;

  }

}



@media (max-width: 320px) {

  .contact-page-main-contact-section {

    padding: 0px !important;

  }

} */



/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */



/* Google Map Section */

/* ***************************************************************************************************

                                      Google Map Section STYLING

*************************************************************************************************** */

/* Unique map section wrapper */

.unique-map-section {

  width: 100%;

  padding: 0;

  margin: 0 auto;

  box-sizing: border-box;

  /* border: 1px solid red; */

}



/* Container enforces responsive aspect ratio */

.unique-map-container {

  position: relative;

  width: 100%;

  padding-bottom: 56.25%; /* 16:9 */

  overflow: hidden;

  border-radius: 12px;

  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);

}



/* Full-cover map */

.unique-map-iframe {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  border: 0;

}



/* Tablet: slightly taller */

@media (max-width: 768px) {

  .unique-map-container {

    padding-bottom: 75%;

  }

}



/* Mobile: square frame for narrow screens */

@media (max-width: 480px) {

  .unique-map-container {

    padding-bottom: 100%;

  }

}



/* ***************************************************************************************************

                                      MAIN BLOG PAGE STYLING

*************************************************************************************************** */

.Blog-Hero-Banner {

  height: 700px;

  background-image: url("/images/male-plumber-working-with-client-fix-kitchen-problems-for-blog-page.png") !important;

}

.unique-blog-section {

  width: 100%;

  padding: 80px 20px;

  box-sizing: border-box;

}



.unique-blog-container {

  display: flex;

  /* justify-content: center; */

  flex-wrap: wrap;

  gap: 20px;

  width: 80%;

  /* border: 1px solid red; */

  justify-self: center;

}



.unique-blog-card {

  max-width: 530px;

  width: 100%;

  background-color: #ffffff;

  border-radius: 12px;

  overflow: hidden;

  /* box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); */

  display: flex;

  flex-direction: column;

  align-items: flex-start;

  padding: 0;

  box-sizing: border-box;

  /* border: 1px solid blue; */

}



.unique-blog-image {

  display: block;

  width: 100%;

  height: auto;

  object-fit: cover;

}



.unique-blog-meta {

  margin: 12px 16px 8px;

  font-family: "Poppins", sans-serif;

  font-size: 20px;

  font-weight: 400;

  color: #0096ff;

}



.unique-blog-title {

  margin: 0 16px 12px;

  font-family: "Poppins", sans-serif;

  font-size: 30px;

  font-weight: 600;

  color: #000000;

  line-height: 1.2;

}



.unique-blog-excerpt {

  margin: 0 16px 16px;

  font-family: "Poppins", sans-serif;

  font-size: 15px;

  font-weight: 400;

  color: #000000;

  line-height: 25px;

}



.unique-blog-readmore {

  margin: 0 16px 16px;

  font-family: "Poppins", sans-serif;

  font-size: 17px;

  font-weight: 400;

  color: #0096ff;

  text-decoration: underline;

  align-self: flex-start;

}



/* Responsive: adjust card width on smaller screens */



/*Commented out for now by Muzaffar*/

/* @media (max-width: 767px) {

  .unique-blog-card {

    max-width: 45%;

  }

} */



@media (max-width: 480px) {

  .unique-blog-card {

    max-width: 100%;

  }



  .unique-blog-meta {

    font-size: 18px;

  }



  .unique-blog-title {

    font-size: 32px;

  }



  .unique-blog-excerpt {

    font-size: 16px;

    line-height: 24px;

  }



  .unique-blog-readmore {

    font-size: 18px;

  }

}