@import url('https://fonts.googleapis.com/css2?family=Alata&display=swap');
  @import url('https://fonts.googleapis.com/css2?family=Alata&family=Host+Grotesk:ital,wght@0,300..800;1,300..800&display=swap');
  @import url('https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css');

  /* General Reset */
  * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Alata', sans-serif;
  }

  /* Header Container */
  header {
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 5px 5%;
    background-color: #fff;
    border-color: aqua;
    box-sizing: border-box;
    border-bottom: 2px solid #ccc;
  }

  /* Logo */
  .logo {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-right: 2%;
  }

  .logo img {
    
    height: 8vh;
    width: auto;
  }


  /* Search Bar */
  .search-bar {
    display: flex;
    flex-grow: 1;
    justify-content: center;
    margin: 0 2%;
  }

  .search-bar input {
    width: 60%;
    height:2.5rem;
    padding: 0.5rem;
    border: 1px solid #ccc;
    border-right: none;
    border-radius: 4px 0 0 4px;
    outline: none;
    font-size: 1rem;
  }

  .search-bar button {
    height:2.5rem;
    padding: 0.6rem 1rem;
    background-color: #FFCC00;
    /* Yellow background */
    color: black;
    font-weight: bold;
    border: none;
    border-radius: 0 4px 4px 0;
    cursor: pointer;
    transition: background-color 0.3s;
    font-size: 14px;
    ;
  }

  .search-bar button:hover {
    background-color: #FFE206;
    /* Slightly darker yellow */
  }

  /* Contact Details */
  .contact-details {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-right: 2%;
    font-size: 1rem;
    color: #555;
  }

  .contact-item {
    display: flex;
    align-items: center;
    margin-bottom: 0.3rem;
  }

  .contact-item i {
    color: #555;
    margin-right: 0.3rem;
  }

  /* Login/Register Button */
  .auth-buttons {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .auth-buttons button {
    display: flex;
    align-items: center;
    padding: 0.6rem 1rem;
    background-color: #FFCC00;
    /* Yellow */
    color: black;
    gap: 10px;
    font-weight: bold;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 1rem;
    transition: background-color 0.3s;
  }

  .auth-buttons button i {
    margin-right: 0.3rem;
    border-radius: 10px;
  }

  .auth-buttons button:hover {
    background-color: #FFE206;
  }

  .auth-buttons .caption {
    margin-top: 0.3rem;
    font-size: 0.8rem;
    color: #555;
    font-style: italic;
  }

  /* Media Queries for Larger Screens */
  @media (min-width: 1440px) {
    header {
      padding: 10px 10%;
      /* Add more padding */
    }

    .logo img {
      height: 20vh;
      /* Slightly larger */
    }

    .search-bar input {
      width: 55%;
      /* Increase search bar width */
      font-size: 1.2rem;
      /* Increase font size */
    }

    .search-bar button {
      font-size: 1.2rem;
      padding: 0.8rem 1.2rem;
      /* Increase button padding */
    }

    .contact-details {
      font-size: 1.2rem;
      /* Increase font size */
    }

    .auth-buttons button {
      font-size: 1.2rem;
      padding: 0.8rem 1.2rem;
      /* Increase button padding */
    }

    .auth-buttons .caption {
      font-size: 1rem;
      /* Adjust caption size */
    }
  }

  /* Navbar */

  select .dropdown-role {

    background-color: #FFCC00;
    border: none;
  }


  .navbar {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #FFCC00;
    padding: 4px 20px;
    position: relative;
    /* height: 59px; */
    border-bottom: 1px solid black;
  }

  .nav-items {
    display: flex;
    gap: 15px;
    list-style: none;
    background-color: transparent;
    margin: auto;
  }

  .nav-items li {
    background-color: transparent;
    /* Reset background for list items */
  }

  .nav-items li a:hover{
    color:black;
    background-color:transparent;

  }

  .navbar .nav-items {
    background-color: transparent !important;
    /* Force transparency */
  }

  .nav-items li a {
    color: #010101;
    text-decoration: none;
    font-size: 14px;
    font-weight: bold;
    padding: 5px 10px;
    transition: background-color 0.3s;
    background-color: transparent;
  }



  .nav-items li a i {
    margin-left: 5px;
  }

  .profile {
    font-size: 14px;
    color: #010101;
    font-weight: bold;
    display: flex;
    align-items: center;
    gap: 5px;
    margin-top: 0px;
  }

  


  .customer {
    font-size: 14px;
    color: #010101;
    font-weight: bold;
    display: flex;
    align-items: center;
    gap: 5px;
    position: relative;
  }

  .customer a {
    text-decoration: none;
    color: #333;
  }

  .customer a i {
    margin-left: 5px;
  }

  .customer .customer-dropdown-menu {
    display: none;
    /* Hidden by default */
    position: absolute;
    top: 100%;
    left: 0;
    background-color: #fff;
    border: 1px solid #ccc;
    list-style: none;
    padding: 10px 0;
    min-width: 200px;
    z-index: 10;
  }

  .customer .customer-dropdown-menu li {
    padding: 0;
    border-bottom: 1px solid #ddd;
    /* Bottom border for items */
    width: 100%;
    box-sizing: border-box;
  }

  .customer .customer-dropdown-menu li:last-child {
    border-bottom: none;
    /* Remove border for the last item */
  }

  .customer .customer-dropdown-menu a {
    display: block;
    color: #333;
    padding: 8px 20px;
    text-decoration: none;
    font-size: 14px;
    font-weight: normal;
    transition: background-color 0.3s;
    width: 100%;
    /* Ensure links fill the container */
    box-sizing: border-box;
    /* Include padding in the width */
  }

  .customer .customer-dropdown-menu a:hover {
    background-color: #B1ACAC;
    /* Same hover color as other dropdowns */
  }

  /* Show dropdown on hover */
  .customer:hover .customer-dropdown-menu {
    display: block;
  }

  /* Adjust the navbar spacing and layout */
  .navbar .nav-items li {
    display: inline-block;
    background-color: transparent;
  }

  .navbar .profile,
  .navbar .customer {
    margin-left: 80px;
  }

  /* Dropdown Menu Styling */
  .nav-items .dropdown {
    position: relative;
  }

  .nav-items .dropdown-menu {
    display: none;
    /* Hidden by default */
    position: absolute;
    top: 100%;
    left: 0;
    background-color: #fff;
    border: 1px solid #ccc;
    list-style: none;
    padding: 10px 0;
    min-width: 200px;
    z-index: 10;
  }

  .nav-items .dropdown-menu li a,
  .nav-items .dropdown-menu .sub-menu a {
    display: block;
    color: #333;
    padding: 8px 20px;
    text-decoration: none;
    font-size: 14px;
    font-weight: normal;
    transition: background-color 0.3s;
    width: 100%;
    /* Ensure links fill the container */
    box-sizing: border-box;
    /* Include padding in the width */
  }

  .nav-items .dropdown-menu li {
    padding: 0;
    border-bottom: 1px solid #ddd;
    width: 100%;
    box-sizing: border-box;
  }

  .nav-items .dropdown-menu li:last-child {
    border-bottom: none;
    /* Remove border for the last item */
  }

  .nav-items .dropdown-menu a {
    display: block;
    color: #333;
    padding: 8px 20px;
    text-decoration: none;
    font-size: 14px;
    font-weight: normal;
    transition: background-color 0.3s;
  }

  .nav-items .dropdown-menu a:hover {
    background-color: #B1ACAC;
  }

  /* Sub-menu Styling */
  .nav-items .dropdown-menu .category {
    position: relative;
    border-bottom: 1px solid #ddd;
  }

  .nav-items .dropdown-menu .sub-menu {
    display: none;
    /* Hidden by default */
    position: absolute;
    top: 0;
    left: 100%;
    /* Horizontal display */
    background-color: #fff;
    border: 1px solid #ccc;
    list-style: none;
    padding: 0;
    min-width: 200px;
    z-index: 10;
  }

  .nav-items .dropdown-menu .sub-menu li {
  display:block;
  border-bottom: 1px solid #ddd; /* Bottom border for sub-menu items */
  padding: 0; /* Add space between items */
}

  .nav-items .dropdown-menu .sub-menu li:last-child {
    border-bottom: none;
    /* Remove border for the last item */
  }

  .nav-items .dropdown-menu .sub-menu a {
    display: block;
    color: #333;
    padding: 8px 20px;
    text-decoration: none;
    font-size: 14px;
    font-weight: normal;
    transition: background-color 0.3s;
  }

  .nav-items .dropdown-menu .sub-menu a:hover {
    background-color: #B1ACAC;
  }

  /* Hover to show dropdown and sub-menu */
  .nav-items .dropdown:hover .dropdown-menu {
    display: block;
  }

  .nav-items .dropdown-menu .category:hover .sub-menu {
    display: block;
  }

  /* Media Queries for Larger Screens (1440px and 4K screens) */
  @media (min-width: 1440px) {
    .nav-items {
      gap: 30px;
      /* Increase gap between items */
    }

    .nav-items li a {
      font-size: 18px;
      /* Increase font size */
    }

    .navbar .profile,
    .navbar .customer {
      font-size: 16px;
      /* Increase font size for profile and customer links */
    }
  }

  @media (min-width: 2560px) {

    /* Targeting 4K screen sizes */
    .nav-items {
      gap: 60px;
      /* Further increase gap between items */
    }

    .nav-items li a {
      font-size: 30px;
      /* Further increase font size */
    }

    .navbar .profile,
    .navbar .customer {
      font-size: 24px;
      /* Further increase font size for profile and customer links */
    }
  }

  /* Mobile Menu (hidden by default) */
  .mobile-icons {
    display: flex;
    /* Align icons side by side */
    align-items: center;
    /* Vertically center */
    gap: 15px;
    /* Space between icons */
    padding: 10px;
    /* Add padding */
  }

  .top-row i {
    width: 55px;
    height: 55px;

    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 24px;
    margin-right: 15px;
    color: #fff;
  }

  .search-icon i {
    font-size: 20px;
    color: #333;
    cursor: pointer;
    transition: color 0.3s ease;
  }

  .search-icon i:hover {
    color: #FFCC00;
    /* Hover effect */
  }

  .mobile-menu {
    background-color: #fff;
    padding: 20px;
    position: fixed;
    top: 0;
    right: 0;
    width: 80%;
    max-width: 320px;
    height: 100vh;
    box-shadow: -2px 0 5px rgba(0, 0, 0, 0.1);
    z-index: 1000;
    transform: translateX(100%);
    transition: transform 0.3s ease;
  }

  .mobile-menu.active {
    display: block;
    transform: translateX(0);
  }

  /* Header section with Home and Sign In */
  .menu-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 15px;
    border-bottom: 1px solid #e0e0e0;
    margin-bottom: 15px;
  }

  .menu-header .home-link {
    font-size: 24px;
    font-weight: bold;
    text-decoration: none;
    color: #000;
  }

  .sign-in-button {
    display: flex;
    align-items: center;
    gap: 8px;
    background-color: #000;
    color: #fff;
    padding: 8px 16px;
    border-radius: 20px;
    text-decoration: none;
    font-weight: 500;
  }

  .sign-in-button i {
    font-size: 18px;
  }

  /* end */

  /* Navigation Menu */
  .nav-menu {
    list-style: none;
    padding: 0;
    margin: 0;
  }

  .nav-menu li {
    border-bottom: 1px solid #e0e0e0;
  }

  .nav-menu li a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 0;
    text-decoration: none;
    color: #000;
    font-size: 16px;
  }

  .nav-menu li a::after {

    font-weight: bold;
  }

  /* Customer/Vendor Dropdown */
  .customer-vendor-dropdown {
    margin-top: 20px;
    position: relative;
  }

  .dropdown-button {
    width: 100%;
    padding: 12px;
    border: 1px solid #000;
    border-radius: 25px;
    background: transparent;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 16px;
    cursor: pointer;
  }

  .dropdown-button::after {
    font-size: 12px;
  }


  .top-row {
    display: flex;
    justify-content: space-between;
  }

  .top-row a {
    text-decoration: none;
    color: #333;
    font-size: 16px;
    font-weight: bold;
    gap: 30px;
  }

  .top-row {
    list-style: none;
    padding-bottom: 10px;
    border-bottom: 1px solid #000;
  }

  .top-row li a {
    display: block;
    text-decoration: none;
    color: #333;
    font-size: 18px;
    font-weight: bold;
    padding: 10px 0;
    text-align: center;
    margin-top: 10px;
  }

  .menu-items {
    list-style: none;
    padding: 20px 0;
  }

  .menu-items li a {
    display: block;
    text-decoration: none;
    color: #333;
    font-size: 1px;
    padding: 10px 0;
  }

  .customer-vendor {
    background-color: #fff;
    margin-top: 20px;
    padding: 10px;
    border-radius: 10px;
    text-align: center;
  }

  .customer-vendor a {
    text-decoration: none;
    color: #333;
    font-size: 16px;
    font-weight: bold;
    margin: 0 5px;
  }


  .menu-icon {
    display: none;
    font-size: 24px;
    cursor: pointer;
  }

  /* Close Button (X mark) */
  .close-menu {
    font-size: 30px;
    color: #333;
    cursor: pointer;
    display: inline-block;
    padding: 0 10px;
    transition: color 0.3s;
  }

  .close-menu:hover {
    color: #FFCC00;
    /* Change color on hover */
  }

  /* Styling for Sign In and Customer/Vendor as buttons */
  .top-row a,
  .customer-vendor a {
    display: inline-block;
    padding: 8px 14px;
    background-color: #000;
    /* Yellow background */
    color: white;
    font-weight: bold;

    border-radius: 25px;
    /* Rounded corners */
    text-decoration: none;
    transition: background-color 0.3s, color 0.3s, border-color 0.3s;
    margin-right: 10px;
    /* Space between buttons */
  }

  .top-row a:hover,
  .customer-vendor a:hover {
    background-color: rgba(0, 0, 0, 0.541);
    /* Slightly darker yellow */
    color: #fff;
    border-color: #FFE206;
  }

  /* Adding a line below each menu item except the Home link */
  .menu-items li {
    position: relative;
    border-bottom: 1px solid #ccc;
    /* Light gray line */
  }

  .menu-items li a {
    display: flex;
    justify-content: space-between;
    /* Align text to the left and icon to the right */
    text-decoration: none;
    color: #333;
    font-size: 14px;
    padding: 10px 0;
    transition: background-color 0.3s;

  }

  /* Add Angular Icon */
  .menu-items li a::after {

    font-size: 14px;
    color: #333;
    position: absolute;
    right: 10px;
    /* Position the arrow to the far right */
    font-weight: bold;
    transition: color 0.3s ease;
  }

  .menu-items li a:hover::after {
    color: #FFCC00;
    /* Change arrow color on hover */
  }


  .menu-items li a:hover {
    background-color: #f1f1f1;
    /* Light background color on hover */
  }

  /* Exclude the Home link from having a bottom border and button styling */
  .menu-items li:first-child a,.top-row a:first-child {
    /* background-color: transparent; */
    /* Remove background for Home */
    border: none;
    /* Remove border for Home */
    border-bottom: none;
    /* Remove line below Home */
    padding: 10px;
    /* Adjust padding */
  }

  .menu-items li:first-child a:hover {
    background-color: transparent;
    /* No hover effect for Home */
  }

  /* Optional: Adjust space between menu items for better alignment */
  .menu-items {
    padding: 20px 0;
  }


  /* Optional: Adjust space between menu items for better alignment */
  .menu-items {
    padding: 20px 0;
  }

  /* Dropdown Styles */

  nav {
    background-color: #333;
    padding: 10px;
  }

  nav ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    list-style: none !important;
    text-decoration: none;
  }

  nav ul li {
    display: inline-block;
    text-decoration: none !important;
    list-style: none !important;
  }

  nav ul li a {
    color: rgb(121, 119, 119);
    padding: 15px 20px;
    text-decoration: none !important;
    display: block;
    list-style: none !important;
  }

  nav ul li a:hover {
    background-color: #555;
  }

  #nav-menu li {
    margin: 12px;

  }

  .menu-home {
    color: #1f1e1e;
    text-decoration: none !important;
    list-style: none !important;
    padding: 12px 16px;
    z-index: 1;
  }

  /* Dropdown Styles */
  .dropdown {
    position: relative;
    display: inline-block;
  }

  .one {
    color: #000;
  }

  .equip {
    text-decoration: none !important;
  }

  .dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 360px;
    box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2);
    z-index: 1;
  }

  .dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
  }

  .menu-home:hover {
    color: #333;
    box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2);
  }

  .dropdown-content a:hover {
    background-color: #f1f1f1;
    color: #333;
    text-decoration: none;
  }

  .dropdown:hover .dropdown-content {
    display: block;
  }

  /* Mobile View */
  @media screen and (max-width: 768px) {
    nav ul {
      display: none;
      width: 100%;
    }

    nav ul li {
      display: block;
      text-align: left;
      text-decoration: none;
    }

    .menu-icon {
      display: block;
      color: rgb(48, 46, 46);
      padding: 15px;
      cursor: pointer;
      font-size: 22px;
      float: right;
    }

    .show-menu {
      display: block;
    }
  }


  .dropdown-1 {
    position: relative;
    display: inline-block;
  }

  .dropdown-content-1 {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    margin: 5px;
    box-shadow: solid 2px #333;
    min-width: 160px;
    box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2);
    z-index: 1;
  }

  .dropdown-content-1 a {
    color: black;
    padding: 12px 16px;
    margin: 5px;
    text-decoration: none;
    display: block;
  }

  .dropdown-content-1 a:hover {
    background-color: #f1f1f1;
  }

  .dropdown-1:hover .dropdown-content-1 {
    display: block;
  }

  /* Follow Us Section Container */
  .follow-sub {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    border-radius: 25px;
    background-color: #f9f9f9;
    
  }

  /* Follow Us Title */
  .follow-title {
    font-size: 16px;
    font-weight: bold;
    color: #000;
    text-transform: capitalize;
   padding-left:40px 
  }

  /* Social Links Container */
  .social-links {
    display: flex;
    gap:5px;
    margin-right: 10px;
  }

  /* Individual Social Icons */
  .social-icon {
    font-size: 16px;
    color: #000;
   
    transition: color 0.3s ease;
  }

  /* Icon Hover Effects */
  .social-icon.facebook:hover {
    color: #3b5998;
    /* Facebook Blue */
  }

  .social-icon.instagram:hover {
    color: #e4405f;
    /* Instagram Pink/Red */
  }

  .social-icon.linkedin:hover {
    color: #0077b5;
    /* LinkedIn Blue */
  }

  .social-icon.twitter:hover {
    color: #1da1f2;
    /* Twitter Blue */
  }

  /* Responsive Adjustments */
  @media (max-width: 768px) {
    .follow-sub
    {
      flex-wrap: nowrap;
      /* Prevent wrapping */
      /* justify-content: space-between; */
      /* Adjust alignment */
    }



  }



  /* Mobile Responsiveness for menu bar items in mobile view */
  @media (max-width: 768px) {

    /* Hide Navbar, Search Bar, and Auth Buttons */
    .navbar,
    .search-bar,
    .auth-buttons {
      display: none;
    }

    /* Display Logo, Contact Info, and Auth Caption in a Row */
    header {
      flex-direction: row;
      justify-content: space-between;
      width: 100%;
    }

    .logo {
      flex: 1;
    }

    .contact-details {
      display: flex;
      flex: 2;
      flex-direction: column;
      margin-left: 10px;
    }

    .contact-item {
      margin-bottom: 10px;
    }

    .auth-buttons .caption {
      display: block;
      margin-top: 10px;
      font-size: 12px;
      color: #555;
      font-style: italic;
    }

    .menu-icon {
      display: block;
      position: absolute;
      right: 20px;
      top: 20px;
    }
  }

  /*menu bar in mobile reduces -- style ends*/



   /*footer starts*/
  /* General Footer Styling */
  /* .footer-section, */
  .subscription-block {
    display: flex;
    flex-direction: column;
    gap: 20px;
  }

  .lets-talk,.follow-us {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
  }

  .social-icons-wrapper {
    display: flex;
    justify-content: space-evenly;
    /* Distribute social icons evenly */
  }


  .page-footer {
    background-color: #000;
    color: #fff;
    padding: 40px 20px;
  }

  .page-footer h4 {
    color: #ffe209;
    font-size: 18px;
    margin-bottom: 10px;
  }

  .footer-middle {
    display: flex;
    flex-direction: row;
    /* Row layout on large screens */
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
    /* Allow wrapping on small screens */
    margin-bottom: 20px;
  }

  /* Footer Row Styling */
  .footer-row {
    display: flex;
    justify-content: space-evenly;
    gap: 20px;
  }

  .footer-row-2 {
    display: flex;
    justify-content: flex-end;
    /* Align content to the right of the row */
    gap: 20px;
    flex-wrap: wrap;
    /* Allow wrapping on smaller screens */
    width: 100%;
  }

  /* Subscription Block */
  .subscription-block {
    border: 2px solid #fff;
    border-radius: 20px;
    padding: 6px;
    flex: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    /* Reduced gap between elements */
    text-align: center;

  }

  .subscription-block h4 {
    margin-bottom: 5px;
    font-size: 30px;
    color: #ffe209;
  }

  .subscription-block p {
    margin-bottom: 10px;
    font-size: 14px;
    font-family: Georgia;
  }

  .subscription-block__form-box {
    display: flex;
    flex-direction: column;
    gap: 10px;
    /* Reduced gap between input and button */
    width: 100%;
    max-width: 250px;
    /* Reduced max width of form box */
    align-items: center;
  }

  .uk-input {
    width: 100%;
    /* Full width of the form box */
    font-size: 12px;
    /* Adjust font size */
    padding: 6px 8px;
    /* Adjust padding for reduced height */
    border-radius: 6px;
    /* Rounded corners for input */
    color: #000;
  }

  /* Make the placeholder smaller */
  .uk-input::placeholder {
    font-size: 12px;
    /* Smaller font size for placeholder */

  }

  .uk-button {
    width: 60%;
    /* Adjust width to 80% of the form box */
    padding: 6px 8px;
    /* Adjust padding for proper button height */
    background-color: #000;
    color: #fff;
    font-size: 14px;
    border-radius: 20px;
    /* Rounded corners for the button */
    border: none;
    align-items: center;
  }

  /* Ensure lists in footer sections have white dots */
  .footer-section ul {
    list-style-type: none;
    /* Remove default list bullets */
    padding-left: 20px;
    /* Add padding to the left for proper alignment */
  }

  .footer-section ul li {
    position: relative;
    /* Allows positioning of custom dots */
    margin-bottom: 8px;
    /* Space between list items */
  }

  .footer-section ul li::before {
    content: '\2022';
    /* Unicode character for a bullet */
    color: #fff;
    /* White color for the bullet */
    font-size: 20px;
    /* Adjust bullet size */
    position: absolute;
    left: -20px;
    /* Adjust position of the bullet */
    top: 50%;
    transform: translateY(-50%);
  }


  /* Footer Sections */
  .footer-section {
    /* flex: 1;
    display: flex;
    flex-direction: column;  */
    display: block !important;
  }

  .footer-section {
    min-width: unset !important;
    max-width: unset !important;
  }

  .footer-section.newsletter {
    border: 3.5px solid #747474 !important;
    border-radius: 30px !important;
  }

  .footer-section.newsletter form {
    width: 75% !important;
    margin: 0px auto !important;
  }

  .footer-section.newsletter form .newsletter-input {
    max-width: unset !important;
  }

  .footer-section.newsletter p {
    margin: 0px;
    font-size: 18px;
    font-family: Georgia;
  }

  .footer-section.newsletter h3 {
    margin-bottom: 0px;
  }

  /* Footer Links */
  .footer-section ul {
    list-style: none;
    padding: 0;
  }

  .footer-section ul li a {
    color: #fff;
    text-decoration: none;
  }

  .footer-section ul li a:hover {
    text-decoration: underline;
  }

  /* Let's Talk Section */
  .lets-talk {
    display: flex;
    justify-content: flex-start;
    /* Align Let's Talk section to the left of this section */
    gap: 20px;
    align-items: flex-start;
  }

  .lets-talk-content {
    display: flex;
    justify-content: flex-start;
    /* Ensure logo and text are aligned left */
    gap: 20px;
    align-items: flex-start;
  }



  .lets-talk-info {
    display: flex;
    flex-direction: column;
    /* Stack the text and buttons vertically */
    align-items: flex-start;
    margin-left:20px;
  }

  /* Remove dots for all ULs in the footer */
  .footer-section ul,
  .lets-talk-info ul {
    list-style: none !important;
    /* Ensure no default bullets */
    padding: 0 !important;
    /* Remove padding */
    /* margin: 0 !important; */
    /* Remove margin */
  }

  .footer-section ul{
    margin-left: 18px;;
  }

  .about-aueqi h3,
  .explore-aueqi h3,
  .useful-links-aueqi h3,
  .lets-talk-info h3{
    font-weight:bold;
  }

  /* Ensure specific list items don't have bullets */
  .footer-section ul li,
  .lets-talk-info li {
    position: relative;
    /* Allow further customization if needed */
  }


  /* Style anchor tags within .lets-talk-info ul */
  .lets-talk-info ul li a {
    color: #fff !important;
    /* Override default blue color */
    text-decoration: none;
    /* Remove underline if any */
  }

  .lets-talk-info ul li a:hover {
    color: #fff !important;
    /* Ensure hover color is black too */
    text-decoration: underline;
    /* Add underline on hover */
  }



  .footer-logo {
    width: 100px;
  }

  .lets-talk h4 {
    margin: 10px 0;
  }



  /* Follow Us Section */
  .footer-follow-us {
    display: flex;
    flex-direction: column;
    margin-left: -30px;
    align-items: center;
    gap: 10px;
  }

  .follow-button {
    display: inline-block;
    padding: 10px 20px;
    color: white;
    font-size: 16px;
    font-weight: bold;
    background: linear-gradient(90deg, #ff5f6d, rgb(195, 33, 216));
    border-radius: 20px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
    cursor: pointer;
    text-transform: uppercase;
    text-align: center;
    width: fit-content;
    /* Automatically adjust width */
    margin-bottom: 10px;
    /* Spacing below the button-like div */
  }

  .follow-button:hover {
    transform: scale(1.05);
    /* Slight zoom on hover */
    box-shadow: 0 6px 8px rgba(0, 0, 0, 0.3);
    /* Deeper shadow */
  }

  .social-icons-wrapper {
    display: flex;
    justify-content: center;
    /* Center the icons in the container */
    padding: 10px;
    border: 2px solid #FFFF00;
    /* Border around the social icons container */
    border-radius: 20px;
    /* Rounded corners for the container */
    background-color: #fff;
    /* Background color for better contrast */
  }

  .social-icons {
    display: flex;
    gap: 10px;
  }

  .social-list__link {
    color: #000;
    /* Set the color of the link (social icon) to black */
    text-decoration: none;
    /* Remove underline */
  }

  .social-list__link:hover {
    color: #000000af;
    /* Change color when hovered (or apply any hover effect) */
  }

  .social-list__item {
    color: #000;
    font-size: 20px;
    text-decoration: none;
  }

  .social-list__item:hover {
    color: #000000af;
  }

  /* Footer Bottom */
  .footer-bottom {
    display: flex;
    justify-content: center;
    gap: 10px;
    align-items: center;
    text-align: center;
    margin-top: 20px;
    padding-top: 10px;
    border-top: 1px solid #333;
    width: 100%;
    /* Set width to full viewport width */



  }

  .footer-content {
    display: flex;
    gap: 10px;
    /* Space between elements */
    align-items: center;
    background-color: #fff;
    /* White background */
    color: #000;
    /* Black text color */
    border: 2px solid #ffe209;
    /* Yellow border */
    border-radius: 20px;
    /* Rounded corners */
    padding: 5px 10px;
    /* Padding around the content */
    flex-wrap: wrap;
    /* Allow elements to wrap on smaller screens */
    justify-content: center;
    /* Center elements when wrapped */
  }

  .footer-content a {
    color: #000;
    text-decoration: none;
    /* Remove underline from links */
  }

  .footer-content a:hover {
    text-decoration: underline;
    /* Add underline on hover */
    color: #000;
  }

  .footer-bottom p {
    font-size: 14px;
    margin: 0;
    /* Remove default margin */
    padding: 0;
  }

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


    .footer-middle {
      flex-direction: column;
      /* Stack items vertically on mobile */
    }

    .footer-row,
    .footer-row-2 {
      flex-direction: column;
      /* Stack items vertically in rows */
    }

    .subscription-block,
    .footer-section {
      flex: 1 100%;
      /* Take up full width on mobile */
    }

    /* Ensure footer-content in the footer-bottom is displayed in a row on mobile */
    .footer-bottom {
      display: flex;
      justify-content: center;
      /* Center the content */
      align-items: center;
      /* Align items vertically */
      width: 100%;
      /* Ensure full width */
      flex-wrap: wrap;
      /* Allow content to wrap if needed */
    }

    .footer-content {
      display: flex;
      flex-direction: row;
      /* Horizontal layout */
      flex-wrap: wrap;
      /* Allow wrapping if content exceeds width */
      justify-content: center;
      /* Center horizontally */
      align-items: center;
      /* Center vertically */
      gap: 5px;
      /* Adjust space between elements */
      font-size: 12px;
      /* Adjust font size for consistency */
    }

    .footer-content a {
      font-size: 12px;
      /* Ensure link text is consistent */
      text-decoration: none;
      /* Remove underlines for cleaner look */
      color: #000;
      /* Set link color */
    }

    .footer-content span {
      white-space: nowrap;
      /* Prevent breaking onto multiple lines */
    }

    .footer-bottom p {
      font-size: 10px;
      /* Adjust for mobile readability */
      margin: 0;
    }


  }

  /* Increase font sizes for large screens (1440px and above) */
  @media (min-width: 1440px) {
    .page-footer h4 {
      font-size: 22px;
      /* Increased font size for footer headings */
    }

    .footer-middle {
      font-size: 18px;
      /* Larger font for middle section */
    }

    .footer-row {
      font-size: 18px;
      /* Increase font size for footer row */
    }

    .footer-row-2 {
      font-size: 18px;
      /* Increase font size for footer row 2 */
    }

    .subscription-block h4 {
      font-size: 40px;
      /* Increase font size of subscription heading */
    }

    .subscription-block p {
      font-size: 16px;
      /* Increase font size of subscription description */
    }

    .uk-input {
      font-size: 16px;
      /* Increase font size of input fields */
    }

    .uk-button {
      font-size: 18px;
      /* Larger font size for buttons */
    }

    .lets-talk h4 {
      font-size: 24px;
      /* Increase font size for Let's Talk section */
    }

    .follow-button {
      font-size: 20px;
      /* Increase font size for Follow Us button */
    }

    .social-list__item {
      font-size: 24px;
      /* Increase font size of social media icons */
    }

    .footer-bottom p {
      font-size: 18px;
      /* Increase font size for footer bottom text */
    }

    .footer-content {
      font-size: 18px;
      /* Increase font size for footer content */
    }

    /* Optional: Increase other elements in the footer */
    .footer-section ul li {
      font-size: 18px;
      /* Increase font size for footer links */
    }
  }

  /* Further increase font sizes for 4K screens (2160px and above) */
  @media (min-width: 2160px) {
    .page-footer h4 {
      font-size: 36px;
      /* Significantly larger font size for 4K screens */
    }

    .footer-middle {
      font-size: 28px;
    }

    .footer-row {
      font-size: 28px;
    }

    .footer-row-2 {
      font-size: 28px;
    }

    .subscription-block h4 {
      font-size: 64px;
      /* Larger subscription heading for 4K */
    }

    .subscription-block p {
      font-size: 24px;
      /* Larger font size for description */
    }

    .uk-input {
      font-size: 24px;
      /* Larger font size for inputs */
    }

    .uk-button {
      font-size: 26px;
      /* Larger button font size */
    }

    .lets-talk h4 {
      font-size: 36px;
      /* Larger font size for Let's Talk section */
    }

    .follow-button {
      font-size: 28px;
      /* Larger Follow Us button font */
    }

    .social-list__item {
      font-size: 36px;
      /* Larger social media icon text */
    }

    .footer-bottom p {
      font-size: 28px;
      /* Larger footer bottom text */
    }

    .footer-content {
      font-size: 28px;
      /* Larger footer content font */
    }

    .footer-section ul li {
      font-size: 28px;
      /* Larger font for footer links */
    }
  }
  /*footer ends*/


  li > ul {
    display: none; /* Hidden by default */
    position: absolute;
    top: 20%; 
    left: 0;
    background-color: #f9f9f9;
    padding: 0;
    margin: 0;
    list-style-type: none;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    z-index: 1200;
  }

  li > ul > li {
    position:relative;
    padding: 10px 20px;
    white-space: nowrap;
    background-color: #fff;
    border-bottom: 1px solid #ccc;
    width:275px;
  }

  li > ul > li:hover {
    background-color:#eee;
  }

  /* Display dropdown on hover */
  li:hover > ul {
    display: block;
  }

  /* Nested subcategories */
  li > ul > li > ul {
    display: none; /* Hidden by default */
    position: absolute;
    top: 70%;
    left: 0; /* Positions subcategories to the left of parent */
    background-color: #f9f9f9;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    z-index:1300;
    width:inherit;
  }

  li > ul > li > ul > li {
padding: 10px 20px;
white-space: nowrap;
background-color: #fff;
border-bottom: 1px solid #ccc;
}

li > ul > li > ul > li:hover {
background-color: #eee; /* Gray background on hover for subcategories */
}

li > ul > li:hover > ul {
display: block; /* Show subcategories on hover */
}

/* Styling links */
a {
text-decoration: none !important; /* Remove underline */
color: black !important; /* Set text color to black */
}

a:hover {
color: black; /* Ensure no color change on hover */
/* text-decoration: none;  */
/* Prevent underline on hover */
}

/* Ensure dropdown remains visible */
li:hover > ul {
visibility: visible; /* Keep visible when hovering */
}

li > ul, li > ul > li > ul {
transition: opacity 0.3s ease;
visibility: hidden;
}

li:hover > ul, li > ul > li:hover > ul {
visibility: visible;
}