@media(max-width: 1199px) {
   .container {
      max-width: 95%;
      --bs-gutter-x: 30px
   }

   .banner-text h1 {
      font-size: 35px;
   }

   .about-banner .banner-content {
      padding: 80px 10px 80px 10px;
   }
}

@media(max-width: 991px) {
   .header {
      padding: 12px 0;
   }
   .header .navbar #collapsibleNavbar .nav-item .nav-link{
      text-align: center;
   }
   .header-menu {
      position: fixed;
      width: 200px;
      height: 100vh;
      top: 0;
      right: -200px;
      z-index: 1000;
      padding: 70px 0 50px;
      transition: all 0.5s ease;
      background-color: var(--white);
      box-shadow: var(--shadow);
      overflow-y: auto;
      visibility: hidden;
   }
   .header .menu-item {
      display: block;
      margin: 0;
   }
   .header .menu-item>a {
      display: flex;
      justify-content: center;
      padding: 12px 15px;
      border-bottom: 1px solid grey;
   }

   .header .menu-item:first-child>a {
      border-top: 1px solid grey;
   }

   .circular-img {
      max-width: 280px;
   }

   .circular-img img {
      max-width: 240px;
   }

   .circular-img-circle {
      height: 280px;
      width: 280px;
   }

   .banner-text h1 {
      font-size: 30px;
   }

   .section-title .title {
      font-size: 30px;
   }

   .services-section .text-box {
      margin-right: 35px;
   }

   .contact-item {
      padding-left: 30px;
      width: 100%;
   }

   .contact-item.map {
      padding-right: 30px;
   }

   .map iframe {
      width: 300px;
   }

   .contact-section .contact-item:nth-child(3) p {
      font-size: 12px;
   }

   .about-section .about-item {
      margin: 1rem 2rem;
   }

   .about-section .about-img img {
      width: 400px;
      height: 250px;
   }

   .about-section .about-content p {
      font-size: 14px;
      font-weight: 300;
   }

   .contact-section {
      margin-top: 20px;
   }
   .blockvision-inner .text2{
      display: none;
   }
}

@media(max-width: 875px) {
   .container {
      --bs-gutter-x: 15px
   }

   .contact-form {
      min-width: 200px;
   }

   .map iframe {
      width: 250px;
   }

   .swag {
      margin-top: 35px;
   }
}

@media(max-width: 750px) {
   .banner-section {
      margin-top: 100px;
   }

   .banner-section .banner-text {
      text-align: center;
   }

   .section-title .title,
   .banner-text h1 {
      font-size: 24px;
   }

   .banner-text h2 {
      font-size: 18px;
   }

   .contact-section .contact-items .contact-item,
   .contact-section .contact-form {
      position: relative;
      margin-right: auto;
      margin-left: auto;
   }

   .contact-section .contact-item:nth-child(1) {
      margin-top: 20px;
   }

   .contact-item {
      padding-left: 0;
   }

   .about-banner .banner-content {
      padding: 40px 5px 40px 5px;
   }

   .blockvision {
      padding: 15px;
      margin: 0px;
   }

   .blockvision-inner {
      padding: 20px;
   }
   .services-section .tab-content .services-img img{
      max-width: 250px;
      max-height: 250px;
   }
   .mybtn {
      font-size: 14px;
      padding: 6px 16px;
   }
   footer p{
      padding-top: 20px;
   }
}

@media(max-width: 500px) {
   body {
      font-size: 14px;
   }

   h3 {
      font-weight: 400px;
      font-size: 16px;
   }

   .circular-img {
      max-width: 230px;
   }

   .circular-img img {
      max-width: 200px;
   }

   .circular-img-circle {
      height: 230px;
      width: 230px;
   }

   footer p,
   footer .social-icon {
      margin: 2px;
      font-size: 12px;
   }
   footer p{
      padding-top: 20px;
   }
   .header-main .logo {
      width: 50px;
      height: 50px;
   }

   .contact-item .icon-box {
      width: 30px;
      height: 30px;
   }

   .contact-item.map {
      padding-right: 30px;
   }

   .home-section .home-contant h1 {
      font-size: 35px;
      font-weight: 700;
      line-height: 60px;
   }

   .customers-section img {
      width: 150px;
      height: 100px;
   }

   .section-title .subtitle {
      font-size: 20px;
      line-height: 32px;
      font-weight: 600;
   }

   .about-section .about-img {
      align-items: center;
   }

   .about-section .about-img img {
      width: 200px;
      height: 150px;
   }

   .about-section .about-content p {
      font-size: 14px;
      font-weight: 300;
   }

   #work_carousel .owl-nav .owl-next {
      left: -8px
   }

   #work_carousel .owl-nav .owl-prev {
      right: -8px
   }

   .mybtn {
      margin-top: 10px;
      font-size: 8px;
      padding: 6px 8px;
   }

   #vision-section {
      height: 45vh;
   }

   .blockvision,
   .vision-item1,
   .vision-item2,
   .photovision img {
      height: 44vh;
      width: 50vw;
   }
   .blockvision-inner {
      height: 40vh;
   }
   .blockvision-inner p{
      font-size: 10px;
   }

   .services-section .tab-content .services-img img{
      max-width: 200px;
      max-height: 200px;
   }
   .contact-section .contact-form .form-control{
      font-size: 12px;
   }

}
@media(max-width: 431px) {
   #vision-section {
      height: 250px;
   }
   .blockvision,
   .vision-item1,
   .photovision img {
      height: 245px;
      margin: 0;
      width: 50vw;
   }
   .blockvision-inner {
      height: 220px;
   }
   .blockvision-inner p{
      font-size: 10px;
      width: 30vw;
   }
 .text2{
      display: none;
   }
   .mybtn {
      margin-top: 0;
   }
   .contact-item.map {
     align-items: center;
     padding: 0;
     width: fit-content;
   }
   
.text {
   height: 350px;
 }
 .about-text{
   height: 450px;
 }
 .features-intro-img {
border-bottom: 2px solid var(--main-color);
 }

}