/* responisve css start here */

@media screen and (min-width: 767px) {
	
	.row.row-reverse { flex-flow: row-reverse; display: flex; }
	
}	

@media screen and (max-width: 1350px) {

  #collapsibleNavbar ul > li { margin: 0px 12px 0px;}
}

@media screen and (max-width: 1199px) {
  .nav_logo { width: 100%; max-width: 250px;}
  
  #collapsibleNavbar > ul > li{margin: 0px 11px;}
  #collapsibleNavbar > ul > li > a {font-size: 15px; }
  #header::before {width: 713px;z-index: 2; }
  #collapsibleNavbar ul li .sub {position: absolute;right: -9px;top: 1px;font-size: 12px;}
  .banner .bn-box {padding: 17px;}
  #main_silder .carousel-caption h1 {font-size: 40px;line-height: 45px;}
  .section-B .men-img { bottom: -90px; }
  .section-B{height: auto;padding: 50px 0px;}
  .section-d .blog-box figure { width: 100%; }
  .section-d .blog-box figure >img{max-width: 100%;}
  #main_silder .owl-nav button i {font-size: 15px !important;width: 40px !important ;height: 40px !important;border-radius: 40px !important;}
#main_silder .owl-nav [class*="owl-"]:hover{width: 40px !important ;height: 40px !important;border-radius: 40px !important;}

}
@media screen and (max-width: 991px) {
  section { padding: 50px 0px;}
  h1, h2, h3, h4{font-size: 23px;}
  #header .container-fluid.pl-0 {padding: 0;}
  #header::before {display: none;}
  #header .right-manu {padding-right: 15px; }
  #header .flex_manu .navbar-toggler .navbar-toggler-icon1 span { border: 1px solid #000; width: 30px; height: 2px;
    display: block; margin-top: 5px; }
    #header  #collapsibleNavbar {position: absolute; width: 100%; left: 0;background: #fff;z-index: 3; top: 100%;}
    #header .flex_manu {flex-grow: inherit; flex-direction: row;}
    #header .navbar.navbar-expand-lg { align-items: center; }
       #header .right-manu .quick-btn {margin: 0px;}
    #collapsibleNavbar > ul,
     #collapsibleNavbar ul li {display: inherit;}
    #header #collapsibleNavbar > ul > li > a{display: block;width: 100%;padding: 10px;}
  #collapsibleNavbar ul li .sub {width: 20px;height: 20px; background: #055c2d;text-align: center;color: #fff;
      border-radius: 20px;font-size: 15px;line-height: 15px;right: 15px;top: 10px;z-index: 2;}
      #header #collapsibleNavbar .sub.submenu-hide {transform: rotate(180deg);}
      #header #collapsibleNavbar > ul > li { margin:0;}
      #header  #collapsibleNavbar > ul > li:hover > a{color: #fff;background: #000;}
      #header #collapsibleNavbar ul li a::before {display: none;}
      #header #collapsibleNavbar > ul > li ul{margin: 10px;}
      #main_silder .carousel-caption h1 {text-transform: capitalize;}
      .section-d .blog-box {flex-wrap: wrap;padding: 15px;}
      .section-d .blog-box figure > img {width: 100%;}
      .section-B .row {flex-direction: column-reverse;}
      .section-B .men-img {bottom: -51px;right: 0;left: 0;margin: 0px auto;	text-align: center;}
    .section-a .who-right {padding:50px 0px 40px}
      .section-c .involvoed-box a figure { margin-bottom: 20px; }
      .section-c .involvoed-box h5 { font-size: 20px;}
   #main_silder .owl-nav .owl-prev {top: 38%;right: 15px;}
  #main_silder .owl-nav .owl-next {top: 50%;right: 15px;}
      #main_silder img {width: 100%;height: 400px;object-fit: cover;}  
      .banner .bn-box {max-width: 500px;}
      .section-a .container {margin: ;max-width: 100%;}
      .section-a .who-left .heading span{max-width: 130px;}
      .section-a .who-left .heading span::before {width: 60px;left: 0;}
      .section-a .who-left .heading span::after{width: 60px;right: -38px;}
        .section-a .who-left .heading span img {padding-left: 38px;}
        .section-a .who-right p {margin: 0;}
        .section-a .who-right .full-box {flex: 0 0 46%;}
        .section-a .who-right {	gap: 30px;}
        .section-B span {width: 100%;max-width: 400px;}
        .section-B .heading span img {padding-left: 38px;}
        .section-B span::before, .section-B span::after {width: 195px;}
        .section-B span::after {right: -40px;}
        .section-c span::before, .section-c span::after {width: 70px;}
        .section-c .heading span::after {right: 29px;}
        .section-c span::before {left: 36px;}
        .banner {min-height: auto;}
      }

@media (min-width: 768px) {
  .navbar-expand-md .navbar-nav .dropdown-menu {position: absolute;width: 100%;}

}

@media screen and (max-width: 767px) { 
  .footer .foot_a, 
   .footer .foot_b ,
   .footer .foot_c {border-bottom: 1px solid #fff;margin-bottom: 20px;}
   .footer-strip .strip-flex {flex-direction: column;gap: 15px;text-align: center;}
   .footer-strip .strip-flex aside { text-align: center; }
   .banner .bn-box { max-width: 500px;}
   #main_silder .carousel-caption h1 { font-size: 32px;line-height: 36px;}
   .who-left {padding-top: 50px; text-align: center; }
   .section-a .who-left p {max-width: 100%; margin: 0px auto; }
   .section-a::before { z-index: -1;width: 50%;}
   .section-B .row {flex-direction: column-reverse;}
   .section-B .men-img {display: none;}
   .section-a .who-left .heading span {max-width: 150px;}
   .section-a .who-left .heading span img {padding-left: 7px;}
   .section-a .who-left .heading span::before {width: 55px;	left: 0;}
   .section-a .who-left .heading span::after {width: 55px;	right: -7px;}


   

}
@media screen and (max-width: 676px) {
  #header .nav_logo .navbar-brand::before{display: none;}
  .nav_logo{ flex: 1 0 0;}
  .right-manu .quick-btn a { font-size: 16px; }
  .right-manu .quick-btn a.request-btn {line-height: 17px; padding: 9px 7px; font-size: 14px; }
  .right-manu .quick-btn a span {font-size: 16px; padding-left: 2;}

 
 }
@media screen and (max-width: 575px) {
        h1, h2, h3, h4 {font-size: 22px;}
    .banner .bn-box {max-width: 450px;}
    #main_silder .owl-nav button {top: 0;bottom: 7px;left: 0;right: 0;margin: 0px auto;}
    #main_silder .owl-nav .owl-prev {top: inherit;right: 15px;transform: rotate(90deg);}
  #main_silder .owl-nav .owl-next {top: inherit;right: 87px;transform: rotate(90deg);}
    #main_silder .owl-nav button i {font-size: 15px !important;	width: 30px !important;	height: 30px !important;border-radius: 30px !important;}
    #main_silder .owl-nav [class*="owl-"]:hover {width: 30px !important;height: 30px !important;border-radius: 30px !important;}
    #main_silder .owl-nav button{bottom:15px;left: 12%;}
    .section-B .enetr-right ul li a span {font-size: 16px;}
 .btn {	padding: 6px 15px;font-size: 16px;}
  .btn span {font-size: 16px;}
  #main_silder .carousel-caption aside .btn i {	font-size: 17px;margin-right: 5px;}

}
 @media screen and (max-width:475px) {
 
  #header .navbar.navbar-expand-lg {flex-direction: column;}
  .nav_logo {padding-top: 20px; }
  #header .flex_manu {flex-grow: 1;flex-direction: row;	width: 100%;justify-content: space-between;padding:20px;}
  #header .flex_manu button {margin: 0;	padding: 0;}
  .right-manu .quick-btn a img {width: 20px;}
  #header .right-manu {padding-right: 0;}
  .section-a .who-right .full-box {	flex: 0 0 100%;}
      #main_silder .carousel-caption h1 {font-size: 26px;line-height: 31px;}

 }
 
  @media screen and (max-width:457px) {
      .section-B span {max-width: 200px;}
      .section-B span::before, .section-B span::after {width: 108px;}
      .section-B .heading span img {padding-left: 57px;}
      .section-B span::before {left: 0px;}
      .section-B span::after {right: -59px;}
  }