:root {
	--white: #fff;
	--gray: #5F5F5F;
	--primary: #1F50A2;
  --secondary: #E29A00;
	--success: #00A827;
	--info: #36b9cc;
	--warning: #E29A00;
	--danger: #EA0000;
	--light: #f8f9fc;
    --light-dark: #404040;
	--dark: #1E1E1E;
	--border-color: #C9C9C9; 
	--bg-light: #fff;
    --bg-dark :#E9E1E9;
	--table-border: #F5F5F5;
	--light-primary: #FFD5B8;
  --p:#1A1A1A
}

* {
    padding: 0;
    margin: 0;
    box-shadow: none;
  }
  *,
  ::after,
  ::before {
      box-sizing: border-box
  }

  body {
    position: relative;
    min-height: 100%;
    overflow-x: hidden;
    font-family: "Commissioner", sans-serif !important;
}

h1 {
  font-size: clamp(2.5rem, 5vw + 1rem, 6.25rem) !important;
  font-weight: 800 !important;
  line-height: clamp(2.75rem, 5vw + 0.5rem, 6.0625rem) !important;
}
h3{
    font-size: 44px !important;
    line-height: 58px !important;
}
h2 {
color: var(--primary);
}
p{
  font-size: 18px !important;
  color: var(--p);
  font-weight: 300;
}
.fw-800{font-weight: 800 !important;}
.fw-700{font-weight: 700 !important;}
.fw-600{font-weight: 600 !important;}
.fw-500{font-weight: 500 !important;}
.fw-400{font-weight: 400 !important;}
.white{color: var(--white);}
.black{color: var(--dark);}
.primary{color: var(--primary) !important;}
.white{color: var(--white) !important;}
.warning{color: var(--warning) !important;}
ul li a.nav-link{color: var(--white);font-size: 15px;font-weight: 400;}
ul li a.nav-link:hover{color: var(--secondary);}
.nav-item.active{border-bottom: 1px solid #fff;}
.over-hidden{overflow: hidden;}
.container-fluid {
     padding: 0px 72px !important;
}
.gray{
  color: var(--gray);
}
.circle{
  border-radius: 50%;
}
.btn.btn-white{
  background-color: var(--white);
  color: var(--primary);
  padding: 16px 30px !important;
  font-size: 17px !important;
}
.btn {
  color: var(--white);
  background-color: var(--primary);
  padding: 11px 30px !important;
    font-size: 16px !important;
  border: none !important;
  border-radius: 2.875rem !important;
  position: relative;
  cursor: pointer;
  overflow: hidden;
}

.btn span:not(:nth-child(6)) {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  height: 30px;
  width: 30px;
  border-radius: 50%;
  transition: .6s ease;
}
.btn:hover span:not(:nth-child(6)) {
  height: 100px;
  width: 100px;
}

.btn span:nth-child(6) {
  position: relative;
}


.btn span:nth-child(1) { transform: translate(-150%, -210%); }
.btn span:nth-child(2) { transform: translate(-250%, 110%); }
.btn span:nth-child(3) { transform: translate(-10%, 110%); }
.btn span:nth-child(4) { transform: translate(150%, 110%); }
.btn span:nth-child(5) { transform: translate(150%, -225%); }

.btn:hover span:not(:nth-child(6)) {
  transform: translate(-50%, -50%) scale(4);
  transition: 1.5s ease;
}

.btn.btn.btn-primary{background-color: var(--primary);}
.btn.btn-hover span:not(:nth-child(6)) { background-color: var(--warning);}
.btn.btn-hover:hover{border-color: var(--warning);}

/* --------------------------------------------------------------------start moble-menu */


  /* From Uiverse.io by Cevorob */ 
.burger {
  position: relative;
  width: 35px;
  height: 25px;
  background: transparent;
  cursor: pointer;
  display: block;
}

.burger input {
  display: none;
}

.burger span {
  display: block;
  position: absolute;
  height: 4px;
  width: 100%;
  background: var(--white);
  border-radius: 9px;
  opacity: 1;
  left: 0;
  transform: rotate(0deg);
  transition: .25s ease-in-out;
}

.burger span:nth-of-type(1) {
  top: 0px;
  transform-origin: left center;
}

.burger span:nth-of-type(2) {
  top: 50%;
  transform: translateY(-50%);
  transform-origin: left center;
}

.burger span:nth-of-type(3) {
  top: 100%;
  transform-origin: left center;
  transform: translateY(-100%);
}

.burger-line {
  display: block;
  width: 25px;
  height: 3px;
  background: var(--white);
  margin: 5px 0;
  transition: 0.3s;
  position: relative;
}
.header-scrolled .burger-line{
  background: var(--primary);
}
/* When menu is open, add .open to button */
#burgerBtn.open .burger-line:nth-child(1) {
  transform: rotate(45deg) translate(5px,5px);
}
#burgerBtn.open .burger-line:nth-child(2) {
  opacity: 0;
  width: 0;
}
#burgerBtn.open .burger-line:nth-child(3) {
  transform: rotate(-45deg) translate(5px,-5px);
}

.navbar-toggler:focus {
  box-shadow: 0 0 0 0rem !important;
}

/* -----------------------------------------------------------------------end moble menu */



header{padding: 20px 70px;
  position: fixed;
  width: 100%;
  top: 0;
  z-index: 99;
background: #000;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.11) 0%, rgba(0, 0, 0, 0) 50%)}

header .logo{
   height: 120px;
    object-fit: contain;
    transition: all 0.3s ease;
}

header .nav-link{font-size: 15px;}

.home-banner{
    background-image:url('../images/banner_home.webp');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    height: calc(100dvh + 370px);
    position: relative;
    place-content: center;
    background-position: top;
}
.about-us h2{
      font-size: 24px;
}
.home-banner p {
    font-size: 30px !important;
}
.home-banner h1{
    font-size: 82px !important;
    line-height: 94px !important;
}
.banner-box{background: var(--white);
    padding: 14px 100px 14px 20px;
    border-radius: 16px;
    display: inline-block;}
.banner-box h5{font-size: 24px;}
.home-banner .row {margin-top: -140px;}
.banner-box p{font-size: 18px !important;}
/* ----start-nav scrolled class-----*/
header.header-scrolled .logo {
  height: 70px;
  transition: all 0.3s ease;
}
.navbar{ transition: all 0.3s ease; align-items: start;}
.header-scrolled nav.navbar{
 padding: 10px 25px !important;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
  transition: all 0.3s ease;
  align-items: center !important;
  background: var(--white);
}
header.header-scrolled ul li a.nav-link{
  color: var(--primary)
}
header.header-scrolled .nav-item.active{
  border-bottom: 1px solid var(--primary);
}
/* ----end-nav scrolled class-----*/
.about-us .card{
  padding-bottom: 59px;
}
h6.sub-head{
  font-size: 24px;
  color: var(--primary);
}
.about-us{
  margin-top: -54px;
} 
.about-us .user-img img{
  height: 50px;
  border: 3px solid #fff;
  margin-left: -18px;
}
.about-us .user-img p{
  font-size: 14px !important;
}
.click{
  display: flex;
  text-decoration: none;
  border-bottom: 1px solid var(--primary);
  color: var(--primary);
}
.about-us .about-img{
  margin-top: -95px;
  z-index: 9;
  position: relative;
}


/* --------------------------------------------------------start-slider-1 */
.owl-stage-outer {
  margin-left: 0px;
  margin-top: 20px;
}
 .owl-carousel .card {
      background: #fff;
      border-radius: 16px !important;
      overflow: hidden;
      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
      text-align: left;
      transition: transform 0.3s ease;
      position: relative;
    }

     .owl-carousel .card:hover {
      transform: translateY(-5px);
    }

     .owl-carousel .card img {
      width: 100%;
      height: 465px;
      object-fit: cover;
    }
     .owl-carousel .card-content {
      padding: 12px 15px;
      position: absolute;
      background: #fff;
      margin: 10px;
      border-radius: 12px;
      bottom: 0px;
    }
     .owl-carousel .card h3 {
      color: #004aad;
      font-size: 28px !important;
      margin-bottom: 0px;
    }
.owl-carousel .card-content p{
  font-size: 16px !important;
  margin: 0px;
}
     .owl-carousel.card p {
      color: #444;
      font-size: 0.95rem;
      line-height: 1.5;
    }

     .owl-carousel .owl-nav button {
      position: absolute;
      top: -30%;
      background: #004aad !important;
      color: #fff !important;
      border-radius: 50%;
      width: 70px;
      height: 70px;
      font-size: 20px !important;
      border-radius: 50% !important;
    }
    .owl-carousel .owl-nav .owl-prev {
      right: 113px;
      background: #fff !important;
      color: #333 !important;
      border: 1px solid #333 !important;
    }
      .owl-carousel .owl-nav .owl-next {
      right: 30px;
    }
    .owl-carousel p{
      font-size: 18px !important;
      color: var(--p);

    }
    /* .owl-prev, .owl-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    background: rgba(0,0,0,0.5);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 1000;
} */
    .owl-prev::before {
    font-family: 'Material Symbols Rounded';
    font-weight: 400;
    font-size: 28px;
    color: var(--primary);
}
.owl-next::before {
    font-family: 'Material Symbols Rounded';
    font-weight: 400;
    font-size: 28px;
    color: var(--white);
}
/* left arrow */
.owl-prev::before {
    content: 'arrow_back_ios_new';
}

/* right arrow */
.owl-next::before {
    content: 'arrow_forward_ios';
}

.owl-carousel .owl-nav span{
display: none;
}

    @media (max-width: 1024px) {
       .owl-carousel .owl-nav button {
        top: 30%;
      }
    }

    @media (max-width: 768px) {
       .owl-carousel .card img {
        height: 150px;
      }
    }
  /* -----------------------------------------------------end-slider-1 */ 
 .owl-carousel.owl-b .card-content {
    width: 96%;
} 
 .owl-carousel.owl-b p{
  color: #000;
  font-weight: 500;
  margin-bottom: 4px;
 }
  .owl-carousel.owl-b p span{
  color: var(--secondary)
 }
 .owl-carousel.owl-b .card h3{
    font-size: 20px !important;}

.service-card .ser-card{
 position: relative; 
 margin-bottom: 25px;
}
.service-card .ser-card h6{
  position: absolute;
  bottom: 9px;
  left: 20px;
  color: #fff;
      font-size: 18px;
  font-weight: 600;
}
.service-card .ser-card img{
border-radius: 17px !important;
}

.card {
  border-radius: 30px !important;
}
/* ----------------------------------------------------start-carousel-b */ 
.carousel-b {
  gap: 20px;
  position: relative;
  margin: 40px 0px 100px 0px;

}
.carousel-b .carousel-card {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  transition: width 0.5s ease, filter 0.5s ease;
}
.carousel-b .carousel-card img{
height: 600px;
  object-fit: cover;
  width: 100%;
}
.carousel-b .carousel-content {
  position: absolute;
  bottom: 0;
  background: #fff;
  padding: 17px 18px;
  margin: 10px;
  border-radius: 10px;
  width: 96%;
}
.carousel-b .carousel-content p {
    margin: 0;
    font-size: 16px !important;
}
.carousel-b .carousel-content h4{
  font-size: 30px;
  font-weight: 600;
  color: var(--primary);
}
.carousel-b .carousel-card.active{
width: 100%;
transform: translate(6px);
}
.carousel-b .carousel-card.desable {
  filter: grayscale(100%);
  width: 40%;
}
.carousel-b .carousel-card .carousel-content {
  position: absolute;
  bottom: -120px;     
  opacity: 0;     
  transition: opacity 0.5s ease, bottom 0.5s ease; 
}

.carousel-b .carousel-card.active .carousel-content {
  bottom: 0px;
  opacity: 1;      
}


/* Progress Bar */
.progress-bar-container {
  position: absolute;
  bottom: -45px;
  left: 0;
  width: 100%;
  height: 13px;
  background: rgba(0,0,0,0.1);
  border-radius: 5px;
  overflow: hidden;
}

.progress-bar {
  width: 0%;
  height: 100%;
  background: var(--primary) !important;
  transition: width 0.5s ease; /* smooth increment */
  border-radius: 10px;
}
/* ----------------------------------------------------end-carousel-b */ 

.footer-card {
 border-radius: 24px;
background: var(--Gradient-blue, linear-gradient(269deg, #2D6DD7 -0.03%, #174187 100.97%));
  border-radius: 25px;
  overflow: hidden;
}
.footer-card h3{
  font-size: 69px !important;
  line-height: 77px !important;
}
footer {
  background: #F4F8FF;
  box-shadow: 0 0 32px 0 rgba(0, 0, 0, 0.12);
  margin-top: 44px;
  padding: 30px 0px;
  position: relative;
}
footer img{
  width: 370px;
}
footer ul{
display: flex;
  list-style: none;
  text-decoration: none;
      gap: 65px;
  padding: 0;
}
footer ul li a{
  color: var(--primary);
  font-weight: 500;
      font-size: 17px;
  text-decoration: none;
  z-index: 1;
  position: relative;
}
footer h5{
font-size: 28px !important;
}
footer a.btn.btn-primary .text{
    font-size: 13px !important;
}
footer p.gray.fot-par{
  font-size: 18px !important;
  line-height: 30px;
}
footer .mail p{
  font-size: 19px !important;
}
footer .mail a{
  font-size: 19px;
  text-decoration: none;
  color: var(--primary)
}
footer::after{
   content: " ";
  background-image: url('../images/footer.webp');
  height: 250px;
  width: 250px;
  position: absolute;
  right: -30px;
  top: 0;
  background-size: contain;
z-index: 0;
}
.copy-right{
  background-color: var(--primary);
  padding: 5px 0px;
}
.copy-right p{
color: var(--white);
font-size: 18px !important;
}
.footer-card-mob{display: none;}
.inner-top{
 margin-top: 210px; 
}
.cnt-banner .container-fluid{
  padding: 0px 0px !important;
}
.contact-ads {
  border-radius: 20px;
  background: var(--Gradient-blue, linear-gradient(269deg, #2D6DD7 -0.03%, #174187 100.97%));
  color: var(--white);
  padding: 45px 50px;
  height: 100%;
}
.form-group {
  position: relative;
  margin-bottom: 30px;
}
.form-control {
  width: 100%;
  border: none;
  border-bottom: 1px solid #ccc;
  outline: none;
  padding: 10px 0 5px;
  font-size: 16px;
  background: transparent;
}
label {
  position: absolute;
  top: 10px;
  left: 0;
  color: #666;
  font-size: 16px;
  pointer-events: none;
  transition: 0.3s ease all;
}
/* When input is focused or has text */
.form-control:focus ~ label,
.form-control:not(:placeholder-shown) ~ label {
  top: -10px;
  font-size: 13px;
  color: #007bff;
}
/* Optional focus effect */
.form-control:focus {
  border-bottom: 2px solid #007bff;
}
.contact-wp {
  margin-top: -340px;
}
.contact-wp .contact-form {
  padding: 45px 50px;
  height: 100%;
  border-radius: 20px !important;
}
.contact-wp .contact-form h2,
.contact-wp .contact-ads h2{
  font-size: 45px;
  font-weight: 700;
}
.contact-wp .contact-form .form-group textarea,
.contact-wp .contact-form .form-group input{
  border-bottom: 1px solid var(--border-color) !important;
  border: none;
  border-radius: inherit;
}
.form-control:focus {
  box-shadow: 0 0 0 .25rem rgba(255, 255, 255, 0) !important;
}
.inner-page header nav ul li a.nav-link{
  color: var(--black) !important;
}
.inner-page header nav .nav-item.active {
  border-bottom: 1px solid var(--primary);
}
.mission {
  border-radius: 24px;
  background: linear-gradient(180deg, #E29A00 0%, #C87C03 100%);
  color: #fff;
}
.vision {
  border-radius: 24px;
  background: var(--Gradient-blue, linear-gradient(269deg, #2D6DD7 -0.03%, #174187 100.97%));
  color: #fff;
}
.abt .mission,.abt .vision{
padding: 40px 50px;
padding-right: 125px !important;
overflow: hidden;
 min-height: 470px;
}
.abt .mission p,.abt .vision p{
  color: var(--white);
 
  font-size: 25px !important;
  font-weight: 600;
}
.mission::after {
  content: " ";
  background-image: url('../images/mis-r.webp');
  min-height: 470px;
  width: 270px;
  position: absolute;
  right: -50px;
  top: 0;
  background-size: contain;
  background-repeat: no-repeat;
  z-index: 0;
}
.mission::before{
  content: " ";
  background-image: url('../images/mis-b.webp');
  min-height: 200px;
  width: 223px;
  position: absolute;
  left: 32px;
  bottom: 0px;
  background-size: contain;
  background-repeat: no-repeat;
  z-index: 0;
}
.vision::after{
  content: " ";
  background-image: url('../images/vis-r.webp');
  min-height: 470px;
  width: 270px;
  position: absolute;
  right: -50px;
  top: 0;
  background-size: contain;
  background-repeat: no-repeat;
  z-index: 0;
}
.vision::before{
 content: " ";
  background-image: url('../images/vis-b.webp');
  min-height: 190px;
  width: 180px;
  position: absolute;
  left: 0px;
  bottom: 0px;
  background-size: contain;
  background-repeat: no-repeat;
  z-index: 0;
}
.abt .patruz-imag-a{
  height: 430px;
  width: 100%;
  object-fit: cover;
  object-position: center;
  border-radius: 27px;
}
.cards .card .card-body h4{
  font-size: 25px;
}
.cards .card .card-body p{
 font-size: 20px !important; 
}
.org {
  background: #F5F7FF;
  padding: 90px 0px;
}
.cards .card {
  height: 100%;
}
.ser-banner{
   margin-top: -330px;
  z-index: -1;
  position: relative;
}
.ser-card {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
}

.ser-card .card {
  flex: 1 1 calc(20% - 20px); /* roughly 5 cards on large screens */
  max-width: calc(20% - 20px);
  background: #fff;
  border-radius: 20px !important;
  text-align: center;
      padding: 30px 10px;
  transition: all 0.3s ease;
  box-shadow: 0 4px 10px rgba(0,0,0,0.05);
}

.ser-card .card img {
  width: 160px;
  height: auto;
}

.ser-card .card h5 {
  font-weight: 600;
  margin-top: 15px;
}

/* Laptop & small desktop (4 per row) */
@media (max-width: 1200px) {
  .ser-card .card {
    flex: 1 1 calc(25% - 20px);
    max-width: calc(25% - 20px);
  }
}

/* Tablet (2 per row) */
@media (max-width: 992px) {
 
}

/* Mobile (1 per row) */
@media (max-width: 576px) {
  .ser-card .card {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

/* Optional hover */
.ser-card .card:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 20px rgba(0,0,0,0.1);
}
.HVAC-ser { background: #1F50A2; border-radius: 24px; color: #fff; overflow: hidden; }
.HVAC-ser .form{
    background: var(--Gradient-blue, linear-gradient(269deg, #2D6DD7 -0.03%, #174187 100.97%));
}
.HVAC-ser .r-s,
.HVAC-ser .l-s{
  padding: 45px;
}

.HVAC-ser .r-s textarea,
.HVAC-ser .r-s input{
  background: #ffffff00;
  color: #fff;
  border: none;
  border-bottom: 1px solid #fff;
  border-radius: 0px;
}
.HVAC-ser .r-s label{
color: #fff;}
  .HVAC-ser .r-s .form-group {
    position: relative;
    margin-bottom: 40px;
}
.HVAC-ser .l-s::before{
content: " ";
background-image: url('../images/services/HVAC-ser.png');
min-height: 370px;
    width: 370px;
    position: absolute;
    left: 0px;
    bottom: -21px;
background-size: contain;
background-repeat: no-repeat;
z-index: 0;
}
  
  /* --------------------------------------------responsive css */


@media (max-width: 1399.98px) { 
header .logo {height: 105px;}
.home-banner h1 {font-size: 75px !important;line-height: 74px !important;}
h3 {font-size: 35px !important;line-height: 45px !important;}
p {font-size: 19px !important;}
.service-card .ser-card h6 {font-size: 16px;}
.carousel-b .carousel-content h4 {font-size: 24px;}
.footer-card h3 {font-size: 50px !important;line-height: 54px !important;}
footer img {width: 330px;}
footer ul {gap: 55px;}
footer::after {right: 0px;}
.about-us .about-img {margin-top: -51px;}
.about-us h2 {font-size: 25px;}
.contact-wp .contact-form h2, .contact-wp .contact-ads h2 {font-size: 37px;font-weight: 700;}
.contact-wp .contact-ads h5{font-size: 19px;}
.contact-wp .contact-form, .contact-ads {padding: 45px 35px;}
.abt .mission, .abt .vision {padding-right: 110px !important;}
.abt .mission p, .abt .vision p {font-size: 22px !important;}
.mission::before {min-height: 220px;width: 200px;}
.vision::before {min-height: 220px;width: 180px;}
.cards .card .card-body h4 {font-size: 22px;}
.cards .card .card-body p {font-size: 18px !important;}
}


@media (max-width: 1199.98px) {
.btn {padding: 13px 27px !important;}
header {padding: 13px 43px;}
.container-fluid {padding: 3px 45px !important;}
.home-banner h1 {font-size: 62px !important; line-height: 62px !important;}
.about-us h2{font-size: 25px;}
.about-us .about-img {margin-top: -50px;}
.owl-carousel .owl-nav .owl-next {right: -5px;}
.owl-carousel .owl-nav .owl-prev {right: 69px;}
p {font-size: 18px !important;}
.owl-carousel .owl-nav button {width: 60px; height: 60px;}
.owl-carousel .card img {height: 405px;}
.owl-carousel .card h3 {font-size: 23px !important;line-height: 24px;}
h3 {font-size: 30px !important;line-height: 43px !important;}
.service-card .ser-card img {height: 250px;object-fit: cover;}
.carousel-b .carousel-content h4 {font-size: 23px;}
footer h5 {font-size: 30px !important;}
.owl-carousel p {font-size: 17px !important;}
.carousel-b .carousel-content p {font-size: 17px !important;}
.abt .mission, .abt .vision {padding-right: 108px !important;}
.abt .mission p, .abt .vision p {font-size: 21px !important;}
 .ser-card .card {
    flex: 1 1 calc(20% - 20px);
    max-width: calc(50% - 20px);
  }
  .ser-card .card img {
    width: 120px;
    height: auto;
}
}


 @media (max-width: 991.98px) { 
header .logo {height: 80px;}
.about-us .about-img {margin-top: -50px;}
.about-us .about-img {margin-top: 0px;}
.home-banner {height: calc(100dvh + 200px);}
.owl-theme .owl-nav{display: none;}
.carousel-b .carousel-card {border-radius: 6px;}
.carousel-b .carousel-card.desable {width: 15%;}
.footer-card h3 {font-size: 35px !important;line-height: 38px !important;}
.footer-card h5{font-size: 17px;} 
.btn.btn-white {padding: 10px 30px !important;}
footer ul {gap: 55px;justify-content: center;}
h3 br {display: none;}
.service-card .ser-card img {height:auto;object-fit: cover;}
.service-card .ser-card h6 {font-size: 20px;}
.carousel-b .carousel-card.desable {width: 0%;}
.carousel-b {gap: 0px;}
.carousel-b .carousel-card.active {width: 100%;transform: translate(0px);}
.abt .mission h3,.abt .vision h3{font-size: 35px !important;}
.abt .mission p, .abt .vision p {font-size: 19px !important;}
.abt .mission, .abt .vision {padding-right: 111px !important;}
.vision::before, .mission::before { min-height: 175px;width: 200px;}
.abt .mission, .abt .vision {min-height: 435px;}
.mission::after, .vision::after {width: 250px;}
.abt .patruz-imag-a {height: 330px;}
    .ser-card .card {
        flex: 1 1 calc(40% - 20px);
        max-width: calc(50% - 20px);
    }
    .HVAC-ser .l-s {
      height: 300px !important;
    }
    .HVAC-ser .l-s::before {
    min-height: 235px;
    width: 225px;}
    .ser-banner {
    margin-top: -190px;}
}

 @media (max-width: 767.98px) { 
.footer-card-dkt{display: none;}
.footer-card-mob{display: block;width: 100%;}
.copy-right p {color: #fff;font-size: 12px !important;}
footer p.gray.fot-par {font-size: 16px !important;}
.contact-wp {margin-top: -140px;}
}

 @media (max-width: 575.98px) { }

 @media (max-width: 400.98px) {
.home-banner h1 {font-size: 40px !important;line-height: 40px !important;}
.home-banner p {font-size: 15px !important;}
.banner-box h5 {font-size: 20px;}
.container-fluid {padding: 3px 10px !important;}
 header .logo {height: 60px;}
.carousel-b .carousel-content {margin: 5px;}
footer img { width: 250px;}
footer ul {display: block;text-align: center;}
footer ul li{margin-bottom: 15px;}
.inner-top {margin-top: 150px;}
.vision::before, .mission::before { min-height: 125px;width: 200px;}
.abt .mission, .abt .vision {min-height: 400px;}
.abt .mission, .abt .vision {padding-right: 55px !important;}
.mission::after, .vision::after {width: 213px;background-size: cover;}
}