/* media-Query 992 */

@media (max-width: 991px) {
  .hero-section .hero-image {
    display: none;
  }

  .header-section .conatact-btn {
    display: none;
  }

  .header-section .menu-bar .nav-link {
    padding: 10px 10px;
    border-bottom: 1px solid #fff;
    width: 100%;
  }


  .offcanvas-body {
    padding: 10px 0;
    background-color: var(--dark);
  }

  .service-section .section-title,
  .why-choose-us .section-title,
  .service-section .section-title {
    margin: 0px 0px 45px 0px;
  }

  .success-story .success-content {
    margin: 0;
  }

  .header-section .nav-link::after {
    height: 1px;
    bottom: 0;
  }

  .header-section .nav-link:hover:after {
    bottom: 0px;
  }

  .footer-section .copy-right .copy-right-main {
    justify-content: center;
  }

  .footer-section .copy-right .copy-right-main p,
  .footer-section .copy-right .copy-right-main a {
    font-size: 14px;
    margin-bottom: 10px;
  }

  .about-section .about-item .about-images .about-image-1 {
    height: 100%;
    width: 100%;
  }

  .about-section .about-item .about-images .about-image-2 {
    height: 200px;
    width: 300px;
    bottom: 0;
    right: 0;
  }

}

/* media-Query 768px */

@media (max-width: 767px) {

  .gallery-section .section-title span,
  .about-section .about-content span,
  .service-section .section-title span,
  .why-choose-us-section .section-title span,
  .project-section .section-title span,
  .process-section .section-title span,
  .testimonials-section .section-title span,
  .contact-section .section-title span {
    font-size: 16px;
  }

  .gallery-section .section-title h2,
  .about-section .about-content h2,
  .service-section .section-title h2,
  .why-choose-us-section .section-title h2,
  .project-section .section-title h2,
  .process-section .section-title h2,
  .testimonials-section .section-title h2,
  .contact-section .section-title h2 {
    font-size: 22px;
  }

  .contact-info-section .contact-info h3,
  .why-choose-us-section .why-choose-us-item h3,
  .service-section .service-item h3,
  .step-content h3 {
    font-size: 20px;
  }


  .case-study .case-study-header h3 {
    font-size: 20px;
  }

  .cta-section .cta-subtitle {
    font-size: 18px;
  }

  .about-section .about-element,
  .why-choose-us-section .why-choose-us-element,
  .process-section .process-element,
  .gallery-section .about-element {
    top: -30px;
  }

  .service-section .service-element,
  .project-section .project-element,
  .testimonials-section .testimonial-element {
    top: -30px;
  }

  .service-section .service-element img,
  .project-section .project-element img,
  .testimonials-section .testimonial-element img,
  .gallery-section .about-element img {
    height: 100px;
    width: 100px;
    object-fit: contain;
  }

  .about-section .about-element img,
  .why-choose-us-section .why-choose-us-element img,
  .project-section .project-element img,
  .process-section .process-element img {
    height: 100px;
    width: 100px;
    object-fit: contain;
  }
}

/* media-Query 575px */

@media (max-width: 575px) {
  .hero-section .hero-caption h1 {
    font-size: 40px;
    line-height: 60px;
  }

  .hero-section .hero-caption p {
    margin-top: 20px;
  }

  .breadcrumb-section .breadcrumb-heading h1 {
    font-size: 20px;
  }

  .hero-section .contact-link {
    margin-top: 30px;
  }

  .about-section .about-item .about-images .about-image-2 {
    height: 150px;
    width: 150px;
    bottom: -20px;
    right: 0;
  }
}


@media (max-width: 475px) {
  .banner-section .banner-content h1 {
    font-size: 40px;
    line-height: 50px;
  }



  .banner-section .hero-caption p {
    font-size: 14px;
    margin-top: 10px;
  }

  .banner-section .contact-link {
    margin-top: 20px;
  }

}