@media (max-width: 768px) {
    .hero-section {
      min-height: auto;
    }
    .features {
      position: relative;
      margin-top: 2rem;
    }
    .hero-content h3 {
      font-size: 1.5rem;
    }
  
    .hero-content {
      top: 40px;
    }
  }


  @media (min-width: 320px) and (max-width: 767px) {
    .video-background video {
      width: 100%;
      height: auto;
      object-fit: cover;
    }
  }



  /* Mobile-specific styles */
@media (max-width: 768px) {
    .navbar-collapse {
      position: absolute;
      top: 80px; 
      right: 0;
      background-color: #343a40; 
      z-index: 1000;
      width: 100%; 
      text-align: left;
      display: none; 
    }
    .navbar-collapse.show {
      display: block; 
    }
    .nav-link {
      padding: 10px 20px;
    }
  }



  
/* Mobile-specific styles */
@media (max-width: 768px) {
    .feature-wrapper {
      position: static !important;
      flex-direction: column;
    }
  
    .feature-all-items {
      display: block;
      flex-direction: row !important;
      gap: 10px;
      margin: 0px 0;
      background-color: #0b0335;
    }
    .feature-item img {
      width: 30px;
      margin: 4px;
    }
  
    .rectangluar {
      display: none;
    }
  }

  @media (max-width: 768px) {
    .footer-logo img {
      max-width: 300px;
    }
  
    .review-card {
      width: 250px;
      max-width: 700px;
      margin: auto;
    }
  }
  
  @media (max-width: 480px) {
    .footer-logo img {
      max-width: 200px;
    }
  }



  
/* media query */
@media (min-width: 320px) and (max-width: 1200px) {
    .rectangluar {
      width: 9%;
      height: 75px;
      background-color: rgb(255, 255, 255);
    }
  }
  
  @media (min-width: 320px) and (max-width: 1190px) {
    .triangle {
      position: relative;
      width: 52px;
      height: 52px;
      background-color: rgb(255, 255, 255);
      transform: rotate(60deg) skew(-30deg) scale(1, 0.866);
    
      left: 90%;
      top: 37%;
    }
  }


  
@media (min-width: 320px) and (max-width: 767px) {
    .typing-demo {
      font-size: 1.7em;
    }
  }
  .product-1 {
    text-align: justify;
  }
  
  /* Services page responsive images */
  .container img {
    max-width: 100%;
    height: auto;
    display: block;
    /* margin: 0 auto; */
  }
  
  @media (max-width: 768px) {
    .container .row .col-12 img {
      width: 100%;
      margin-bottom: 2rem;
    }
}





@media (max-width: 768px) {
    .stones {
      width: 100%;
      min-height: auto;
    }
  }

  
  @media (max-width: 768px) {
    .pump_jack {
      width: 100%;
      min-height: 250px;
    }
  }



  @media (min-width: 320px) and (max-width: 767px) {
    .typing-demo {
      font-size: 40px;
    }
  }

  
  /*--------------------------------------------------------------------------------------------------------------  */
  @media (min-width: 320px) and (max-width: 767px) {
    .container img {
      max-width: 100%;
      height: auto;
      display: block;
      /* margin: 0 auto; */
    }
}




@media (min-width: 768px) and (max-width: 1024px) {
    .video-background video {
      width: 100%;
      height: 50vh;
      object-fit: cover;
    }
  }
  /* ---------------------------------------------------------------------- */
  
  @media (min-width: 320px) and (max-width: 767px) {
    .cardss {
      position: unset !important;
    }
  
    .video-background video {
      width: 100%;
  
      object-fit: cover;
    }
  }




  @media (min-width: 320px) and (max-width: 767px) {
    .team_person {
      font-size: 15px;
    }
    .team_location {
      font-size: 13px;
    }
  }
  

  
  @media (min-width: 320px) and (max-width: 767px) {
    .filter-btn {
      width: 120px;
      font-size: 12px;
    }
  }




  @media (max-width: 768px) {
    .container {
      padding-left: 15px;
      padding-right: 15px;
    }
  
    .col-md-6 {
      margin-bottom: 2rem;
    }
  
    .w-75 {
      width: 100% !important;
    }
  
    .Super-Antiques-inner-bg {
      padding: 1rem;
      width: 90%;
    }
  
    .carousel-item img {
      max-height: 300px;
      object-fit: cover;
    }
  }
  
  @media (max-width: 576px) {
    h3 {
      font-size: 1.5rem;
    }
  
    p {
      font-size: 0.9rem;
    }
  
    .py-5 {
      padding-top: 2rem !important;
      padding-bottom: 2rem !important;
    }
  }



  @media (max-width: 768px) {
    .hero-section {
      min-height: auto;
    }
    .features {
      position: relative;
      margin-top: 2rem;
    }
    .hero-content h3 {
      font-size: 1.5rem;
    }
  
    .hero-content {
      top: 40px;
    }
  }