/* @import url("https://fonts.cdnfonts.com/css/gilroy-bold"); */

:root {

  --color-primary: #0173ef;

  --color-white: #fff;

  --color-black: #1f2b37;

  --color-bg: #002348;

  --color-grey: #787f87;

  --color-yellow: #fcba00;

  --font: "Gilroy", sans-serif;

}



/* default css start */

* {

  margin: 0;

  padding: 0;

  box-sizing: border-box;

}



body {

  overflow-x: hidden;

}



.container-left {

  padding-left: 16px;

  margin-left: auto;

  width: calc(1600px + (50% - 1600px / 2));

}



.btn-check:focus + .btn,

.btn:focus {

  box-shadow: none;

}



.btn {

  color: var(--color-primary);

  padding: 0;

  font: normal normal 400 18px/26px var(--font);

  letter-spacing: 0.36px;

  transition: 0.5s all ease-out;

}



.btn img {

  width: 20px;

  height: auto;

}



.row {

  row-gap: 26px;

}



h1,

h2,

h3,

h4,

h5,

h6,

p {

  margin: 0;

}



h1 {

  font: normal normal 700 60px/62px var(--font);

  letter-spacing: -0.6px;

  color: var(--color-bg);

}



h2 {

  font: normal normal 700 52px var(--font);

  letter-spacing: -0.6px;

  color: var(--color-black);

}



h4 {

  font: normal normal 600 32px var(--font);

}



h5 {

  font: normal normal 600 24px var(--font);

  letter-spacing: 0.48px;

}



h6 {

  font: normal normal 600 20px var(--font);

}



p {

  font: normal normal normal 18px/26px var(--font);

  letter-spacing: 0.36px;

}



p b {

  font-weight: 500;

}



h1 span,

h3 span,

h4 span,

h5 span,

h6 span,

p span {

  color: var(--color-primary);

}



span span {

  font: normal normal 500 14px/18px var(--font);

  letter-spacing: 0.56px;

}



.btn__primary {

  padding: 14px 18px;

  font: normal normal 400 18px/20px var(--font);

  letter-spacing: 0.36px;

  border-radius: 6px;

  background: var(--color-primary);

  color: var(--color-white);

}



.btn__primary:hover {

  background: var(--color-yellow);

  color: var(--color-black);

}



.rn__sectin__gapTop {

  padding: 96px 0;

}



.inner__gapTop {

  margin-top: 56px;

}



.main__heading h2 {

  text-align: center;

  /* position: relative;

  width: fit-content;

  margin: auto; */

  color: var(--color-black);

}



.main__heading h2 span.color {

  color: var(--color-primary);

}



.main__heading h2 span.cap {

  position: relative;

}



.main__heading h2 span.cap::before {

  position: absolute;

  right: -19px;

  top: 0;

  content: "";

  width: 19px;

  height: 19px;

  background-image: url(../img/title-cap.svg);

  background-size: 100%;

  background-repeat: no-repeat;

}



.main__heading p {

  text-align: center;

  margin-top: 24px;

  color: var(--color-grey);

}



.top__header {

  background-color: var(--color-white);

  padding: 15px 30px;

}



.top__header .item__track span span {

  text-transform: uppercase;

}



.top__header .slider {

  position: relative;

  width: 100%;

  display: grid;

  place-items: center;

  overflow: hidden;

}



.top__header .slide__track {

  width: calc(235px * 12);

  display: flex;

  animation: scroll 20s linear infinite;

  justify-content: space-between;

}



.top__header .item__track {

  width: auto;

  display: flex;

  gap: 30px;

  transition: 0.5s;

  cursor: pointer;

}



.top__header .item__track img {

  width: 16px;

  height: auto;

}



@keyframes scroll {

  0% {

    transform: translateX(0px);

  }



  100% {

    transform: translateX(calc(-235px * 6));

  }

}



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

  .slide__track {

    width: calc(180px * 12) !important;

  }



  @keyframes scroll {

    0% {

      transform: translateX(0px);

    }



    100% {

      transform: translateX(calc(-180px * 12));

    }

  }

}



@media only screen and (min-width: 768px) and (max-width: 1023px) {

  .slide__track {

    width: calc(200px * 12) !important;

  }



  @keyframes scroll {

    0% {

      transform: translateX(0px);

    }



    100% {

      transform: translateX(calc(-200px * 12));

    }

  }

}



.header__spacing {

  min-height: 100px;

}



.header {

  position: fixed;

  top: 54px;

  min-height: 100px;

  width: 100%;

  z-index: 999;

  display: flex;

  align-items: center;

  transition: 0.6s all ease-out;

}



.header.fixed {

  position: fixed;

  top: 0;

  min-height: 80px;

  background-color: var(--color-primary);

}



.header .site-logo img {

  width: 200px;

  height: auto;

  z-index: 9999;

  transition: 0.4s all ease-out;

  position: relative;

}



/*.home .header .site-logo img,*/

/*.header.fixed .site-logo img {*/

/*  filter: brightness(0) invert(1);*/

/*}*/



.header .site-logo .offscroll,

.header.fixed .site-logo .onscroll {

  display: block;

  animation: scale-display 0.8s ease;

}



.header .site-logo .onscroll,

.header.fixed .site-logo .offscroll {

  display: none;

}



.hvac .header {

  top: 0;

}



@keyframes scale-display {

  0% {

    opacity: 0;

  }

  100% {

    opacity: 1;

  }

}



.navbar {

  display: flex;

  justify-content: space-between;

  align-items: center;

  width: 100%;

  padding: 0;

}



.navbar ul {

  margin: 0;

  padding: 0;

  list-style: none;

  display: flex;

  gap: 18px;

}



.navbar ul li a {

  color: var(--color-black);

  font: normal normal 500 18px var(--font);

  letter-spacing: 0.36px;

  text-decoration: none;

  padding: 8px 16px;

  transition: 0.6s all ease-out;

  position: relative;

  z-index: 0;

}



.home .navbar ul li a,

.header.fixed .navbar ul li a {

  color: var(--color-white);

}



.navbar ul li a::before {

  position: absolute;

  left: 0;

  top: 0;

  border-radius: 4px;

  width: 0;

  height: 100%;

  content: "";

  background: var(--color-primary);

  z-index: -1;

  transition: width 0.6s;

}



.home .navbar ul li a::before,

.header.fixed .navbar ul li a::before {

  background-color: var(--color-white);

}



.navbar ul li a.active::before,

.navbar ul li a:hover::before {

  width: 100%;

}



.home .navbar ul li a.active,

.home .navbar ul li a:hover,

.header.fixed .navbar ul li a.active,

.header.fixed .navbar ul li a:hover {

  color: var(--color-black);

}



.navbar ul li a.active,

.navbar ul li a:hover {

  color: var(--color-white);

  border-radius: 4px;

  transition: 0.4s all ease-out;

}



.navbar .btn {

  font: normal normal 500 18px var(--font);

  color: var(--color-black);

  letter-spacing: 0.36px;

}



.home .navbar .btn,

.header.fixed .navbar .btn {

  color: var(--color-white);

}



.navbar .btn img {

  width: 24px;

  height: auto;

  margin-right: 8px;

  animation: hithere 1.5s ease infinite;

}

@keyframes hithere {

  30% {

    transform: scale(1.2);

  }

  40%,

  60% {

    transform: rotate(-20deg) scale(1.2);

  }

  50% {

    transform: rotate(20deg) scale(1.2);

  }

  70% {

    transform: rotate(0deg) scale(1.2);

  }

  100% {

    transform: scale(1);

  }

}



/* navbar regular css end */



/* nav-toggler css start */

.nav-toggler {

  background-color: transparent;

  cursor: pointer;

  height: 28px;

  display: none;

  border: none;

}



.nav-toggler span,

.nav-toggler span:before,

.nav-toggler span:after {

  width: 24px;

  height: 2px;

  background-color: var(--color-primary);

  display: block;

  transition: 0.3s;

}



.header.fixed .nav-toggler span,

.header.fixed .nav-toggler span:before,

.header.fixed .nav-toggler span:after,

.home .nav-toggler span,

.home .nav-toggler span:before,

.home .nav-toggler span:after {

  background-color: #fff;

}



.header.fixed .nav-toggler.toggler-open span {

  background-color: transparent;

}



.nav-toggler span:before {

  content: "";

  transform: translateY(-8px);

}



.nav-toggler span:after {

  content: "";

  transform: translateY(6px);

}



.nav-toggler.toggler-open span {

  background-color: transparent;

}



.nav-toggler.toggler-open span:before {

  transform: translateY(0px) rotate(45deg);

}



.nav-toggler.toggler-open span:after {

  transform: translateY(-2px) rotate(-45deg);

}



/* nav-toggler css start */



/* mobile breakpoint start */

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

  body.overflow {

    overflow: hidden;

  }



  .header {

    top: 36px;

    min-height: 60px;

  }



  .header.fixed {

    min-height: 60px;

  }



  .navbar .btn {

    font-size: 0;

    position: absolute;

    right: 12%;

    width: min-content;

  }



  .header .site-logo img {

    width: 120px;

  }



  .navbar .btn img {

    width: 18px;

    margin-right: 0;

  }



  /* navbar css for mobile start */

  .nav-toggler {

    display: block;

  }



  .navbar {

    min-height: 60px;

    position: unset;

  }



  .navbar ul {

    position: absolute;

    padding: 30px 0;

    width: 50%;

    height: 100vh;

    left: 0;

    top: 60px;

    flex-direction: column;

    align-items: center;

    background-color: var(--color-white);

    transform: translateX(-100%);

    overflow: hidden;

    visibility: hidden;

    gap: 12px;

    transition: 0.4s all ease-in-out;

  }



  .navbar ul.open {

    transform: translateX(0);

    visibility: visible;

    overflow: visible;

  }



  .navbar ul li {

    width: 100%;

  }



  .navbar ul li a {

    font: normal normal 500 16px var(--font);

    text-align: left;

    padding: 6px 12px;

    color: var(--color-black) !important;

  }



  .navbar ul li a.active,

  .navbar ul li a:hover {

    color: var(--color-white) !important;

    background-color: var(--color-primary);

    border-radius: 0;

    width: 100%;

    display: block;

  }



  .navbar ul li a::before {

    display: none;

  }

}



/* mobile breakpoint end */



.hero__section {

  border-radius: 20px;

  background: linear-gradient(

    180deg,

    #0151a7 25.73%,

    rgba(52, 143, 242, 0) 94.57%

  );

  min-height: 95vh;

  z-index: 0;

  display: flex;

  align-items: center;

  justify-content: center;

  padding: 215px 0 100px;

}



.hero__section .left__section {

  position: relative;

}



.hero__section .left__section .img__box img {

  width: 100%;

  max-width: 775px;

}



.hero__section .left__section .hero__slider {

  position: absolute;

  bottom: 0;

  right: 0;

  max-width: 445px;

}



.hero__section .left__section .content__bx h1 {

  margin-bottom: 8px;

}



.hero__section .owl-carousel .owl-dots {

  display: flex;

  gap: 8px;

  position: absolute;

  bottom: -65px;

}



.hero__section .owl-carousel button.owl-dot {

  border-radius: 3.5px;

  opacity: 0.4;

  background-color: var(--color-black);

  width: 30px;

  height: 4px;

}



.hero__section .owl-carousel button.owl-dot.active {

  background-color: var(--color-primary);

  opacity: 1;

}



.service__form .card__bnr {

  padding: 46px 40px;

  border-radius: 12px;

  background: var(--color-bg);

  position: relative;

  z-index: 0;

  overflow: hidden;

}



.service__form .card__bnr h4 {

  color: var(--color-white);

  text-align: center;

}



.service__form .form__box {

  margin-top: 36px;

}



.contact__form .form__box .input__inr {

  position: relative;

  z-index: 0;

  margin-bottom: 20px;

}



.contact__form .form__box .form-control,

.contact__form .form__box .form-select {

  font: normal normal 500 14px/18px var(--font);

  padding: 14px 18px 14px 52px;

  border-radius: 6px;

  background-color: var(--color-white);

  position: relative;

  z-index: 0;

}

.contact__form .form__box label {

  font: normal normal 500 14px/18px var(--font);

  color: #f2f2f2;

  margin-top: 3px;

}

.hvac .contact__form .form__box label {

    color: red;

}

.contact__form .form__box .input__inr span {

  position: absolute;

  top: 12px;

  margin: auto;

  display: flex;

  align-items: center;

  left: 18px;

  z-index: 2;

}



.contact__form .form__box .input__inr span img {

  width: 24px;

  height: auto;

}



.service__form .card__bnr .form__box .btn__submit {

  margin-top: 36px;

}



.card__bnr .form__box .btn__submit .btn {

  display: block;

}



.our__partners {

  padding: 45px 0;

}



.our__partners .main__heading p {

  color: var(--color-bg);

  font-weight: 600;

  margin-top: 0;

}



.our__partners .partners__slider {

  margin-top: 35px;

}



.our__services {

  background: linear-gradient(

    180deg,

    rgba(230, 241, 253, 0.4) 0%,

    rgba(244, 244, 244, 0) 100%

  );

}



.our__services .left__img img {

  width: 100%;

}



.our__services .card__bx .thumbnails img {

  width: 100%;

}



.our__services .card__bx {

  position: relative;

  border-radius: 8px;

  overflow: hidden;

}



.our__services .card__bx .content__bx {

  position: absolute;

  left: 0;

  bottom: 0;

  border-radius: 6px;

  background: var(--color-white);

  padding: 16px;

  max-width: 350px;

  min-width: 350px;

  margin: 30px;

}



.our__services .card__bx .content__bx span {

  color: var(--color-primary);

}



.our__services .card__bx .content__bx h6 {

  margin: 4px 0 10px;

}



.our__services .card__bx .content__bx .btn:hover {

  color: var(--color-primary);

  text-decoration: underline;

}



.our__conditioning .main__heading p {

  color: var(--color-black);

}



.our__conditioning .main__heading h2,

.our__conditioning .main__heading p {

  text-align: left;

}



.our__conditioning .img__box img {

  width: 100%;

  height: auto;

  border-radius: 12px;

}



.our__serviceBx .card__bx {

  padding: 40px 65px;

  border-radius: 6px;

  background: #002e60;

  box-shadow: 0px 35px 20px -30px rgba(20, 61, 141, 0.24);

  display: flex;

  gap: 65px;

}



.our__serviceBx .card__bx .item__card {

  display: flex;

  align-items: flex-start;

  gap: 18px;

}



.our__serviceBx .card__bx .item__card img {

  width: 24px;

}



.our__serviceBx .card__bx .item__card p {

  color: var(--color-white);

}



.our__value .card__value {

  border-radius: 12px;

  border: 2px solid var(--color-white);

  background: var(--color-white);

  box-shadow: 0px 0px 12px 1px rgba(0, 0, 0, 0.1);

  padding: 14px;

  display: flex;

  align-items: center;

  gap: 16px;

  position: relative;

  overflow: hidden;

}



.our__value .card__value::before {

  position: absolute;

  bottom: 0;

  left: 0;

  content: "";

  width: 100%;

  height: 4px;

  border-bottom: 4px solid var(--Yellow, #fcba00);

}



.our__value .card__value .icon {

  border-radius: 12px 0px 46px 12px;

  background: var(--color-primary);

  padding: 30px;

  width: fit-content;

}



.our__value .card__value .icon img {

  width: 56px;

  height: auto;

}







.our__value .card__value p {

  color: var(--color-grey);

}



.our__clients {

  background: rgba(230, 241, 253, 0.56);

}



.our__clients .clients__slider .item {

  min-height: 440px;

  background-image: url(../img/feedback-bg.png);

  background-size: 100%;

  background-repeat: no-repeat;

  transition: 0.6s all;

}



.our__clients .clients__slider .center .item {

  background-image: url(../img/feedback-bg-03.png);

}



.our__clients .clients__slider .item .user__icon {

  max-width: 320px;

  margin: 0 0 0 65px;

}



.our__clients .clients__slider .item .user__icon img {

  width: 105px;

  height: auto;

  border-radius: 50%;

  margin: auto;

  display: block;

}



.our__clients .clients__slider .item .content__box {

  max-width: 320px;

  margin: 16px 0 0 65px;

}



.our__clients .clients__slider .item .content__box h5,

.our__clients .clients__slider .item .content__box p {

  text-align: center;

  color: var(--color-black);

}



.our__clients .clients__slider .item .content__box p.position {

  color: var(--color-grey);

  margin: 8px 0 0;

  font-weight: 500;

}



.our__clients .clients__slider .item .content__box img {

  width: 30px;

  height: auto;

  margin: 9px auto;

  display: block;

}



.our__clients .owl-carousel .owl-dots {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 12px;

  min-height: 12px;

  margin-top: 56px;

}



.our__clients .owl-carousel button.owl-dot {

  width: 7px;

  height: 7px;

  border-radius: 40px;

  background-color: var(--color-grey);

  transition: 0.6s all ease-out;

}



.our__clients .owl-carousel button.owl-dot.active {

  width: 12px;

  height: 12px;

  background-color: var(--color-primary);

}



.get__contact {

  background-image: url(../img/contact-bnr.png);

  background-repeat: no-repeat;

  background-size: 100%;

  min-height: 482px;

  display: flex;

  align-items: center;

  justify-content: flex-end;

}



.get__contact .main__heading h2,

.get__contact .main__heading p {

  color: var(--color-white);

}



.get__contact .main__heading h2::before {

  display: none;

}



.get__contact .main__heading p {

  margin-top: 16px;

}



.get__contact .btn__call {

  background-color: var(--color-white);

  border-radius: 12px;

  padding: 8px 24px 8px 8px;

  display: flex;

  align-items: center;

  gap: 10px;

  width: fit-content;

  color: var(--color-black);

  margin: 30px auto 0;

}



.get__contact .btn__call .icon {

  width: 60px;

  height: 60px;

  border-radius: 12px;

  background-color: var(--color-primary);

  display: flex;

  align-items: center;

  justify-content: center;

}



.get__contact .btn__call .icon img {

  width: 17px;

  height: auto;

}



.get__contact .btn__call span {

  text-align: left;

  color: var(--color-grey);

  display: block;

  margin-bottom: 2px;

  text-transform: uppercase;

}



.get__contact .btn__call h5 {

  text-align: left;

}



.footer {

  border-top: 4px solid #fcba00;

  background: #002348;

  padding: 80px 0 38px;

}



.footer .ftr__logo,

.footer .ftr__columns h4 {

  margin-bottom: 30px;

}



.footer .ftr__logo img {

  width: 190px;

  height: auto;

  filter: brightness(0) invert(1);

}



.footer .ftr__columns p,

.footer .ftr__columns h4 {

  color: var(--color-white);

  text-transform: capitalize;

}



.footer .ftr__columns h4 {

  min-height: 39px;

}



.footer .ftr__columns a {

  color: var(--color-white);

}



.footer .ftr__columns span {

  color: #fcba00;

}



.footer .contact__info {

  display: flex;

  align-items: flex-start;

  gap: 18px;

}



.footer .contact__info .icon {

  border-radius: 6px;

  background: var(--color-white);

  width: 40px;

  min-width: 40px;

  height: 40px;

  display: flex;

  align-items: center;

  justify-content: center;

}



.footer .contact__info .icon img {

  width: 16px;

  height: auto;

}



.contact__info p:nth-child(2),

.contact__info p:last-child {

  margin-top: 8px;

}



.footer .ftr__columns .contact__info .spacing {

  min-height: 12px;

}



.footer .ftr__btm {

  margin-top: 65px;

  border-top: 1px solid #e6f1fd;

  padding-top: 34px;

  display: flex;

  align-items: center;

  justify-content: space-between;

}



.footer .ftr__btm p {

  color: var(--color-white);

}



.footer .ftr__btm p span {

  color: #fcba00;

}



.footer .ftr__btm .social__media {

  display: flex;

  list-style: none;

  padding: 0;

  margin: 0;

  gap: 16px;

}



.footer .ftr__btm .social__media li img {

  width: auto;

  height: 40px;

}



.footer .ftr__btm .rt__btm {

  display: flex;

  gap: 36px;

}



.footer .ftr__btm .rt__btm a,

.footer .ftr__btm .rt__btm a:hover {

  color: white;

}



.comn__banner {

  background-image: url(../img/about-banner.png);

  background-repeat: no-repeat;

  background-size: 100%;

  padding: 110px 0;

  min-height: 462px;

}



.comn__banner .heading h1,

.comn__banner .heading p {

  color: var(--color-white);

}



.comn__banner .heading p {

  margin-top: 18px;

}



.comn__banner .service__form {

  position: absolute;

  top: 12vh;

  width: 100%;

}



.who__weAre .img__box img,

.what__weDo .img__box img {

  width: 100%;

  height: auto;

}



.who__weAre .main__heading h2,

.what__weDo .main__heading h2 {

  margin: 0;

}



.who__weAre .main__heading h2,

.who__weAre .main__heading p,

.what__weDo .main__heading h2,

.what__weDo .main__heading p {

  text-align: left;

}



.what__weDo {

  background: rgba(230, 241, 253, 0.46);

  position: relative;

  min-height: 695px;

}



.what__weDo .img__box {

  position: absolute;

  bottom: 0;

  right: 0;

  max-width: 54%;

}



.vision__section .vision__card {

  background-color: var(--color-bg);

  padding: 96px;

}



.vision__section .vision__card .card__box {

  display: flex;

  align-items: flex-start;

  gap: 32px;

}



.vision__section .vision__card img {

  width: 95px;

  height: auto;

}



.vision__section .vision__card .main__heading h2 {

  margin: 0;

}



.vision__section .vision__card .main__heading h2,

.vision__section .vision__card .main__heading p {

  color: var(--color-white);

  text-align: left;

}



.clients__section {

  background: linear-gradient(

    339deg,

    #f4f9fe 12.58%,

    rgba(244, 249, 254, 0) 62.92%

  );

}



.clients__section .main__heading p {

  color: var(--color-bg);

  text-align: center;

  margin-top: 0;

}



.our__locations .heading h2,

.our__locations .heading p {

  color: var(--color-black);

}



.our__locations .heading p {

  margin-top: 8px;

}



.our__locations .map__area iframe {

  width: 100%;

  min-height: 630px;

}



.services__section .services__card {

  display: flex;

  flex-direction: column;

  gap: 46px;

}



.services__section .item__card h2 {

  font: normal normal 700 46px var(--font);

  color: var(--color-black);

}



.services__section .item__card p {

  margin: 18px 0 30px;

  color: var(--color-black);

}



.services__section .item__card img {

  width: 100%;

  height: auto;

  border-radius: 6px;

}



/*--------HVAC Banner--------*/

.hvac__banner {

  background: linear-gradient(115deg, #0173ef -31.87%, #57a8ff 99.39%);

  position: relative;

  z-index: 0;

  overflow: hidden;

  min-height: 72vh;

  display: flex;

  align-items: center;

  padding: 52px 0;

}



.hvac__banner::before {

  position: absolute;

  right: 0;

  bottom: 0;

  content: "";

  width: 27%;

  height: 100%;

  background: linear-gradient(44deg, #ffd970 13.77%, #fcba00 83.67%);

  z-index: -1;

}



.left__section .item__content h1 {

  font: normal normal 700 70px/124% var(--font);

  color: var(--color-white);

}



.left__section .item__content h1 span {

  position: relative;

  color: var(--color-white);

  z-index: 0;

}



.left__section .item__content h1 span::before {

  position: absolute;

  right: -38px;

  top: 0;

  content: "";

  width: 38px;

  height: 38px;

  background-image: url(../img/title-cap.svg);

  background-size: 100%;

  background-repeat: no-repeat;

}



.left__section .item__content h1 span::after {

  position: absolute;

  left: 5px;

  bottom: -4px;

  content: "";

  width: 100%;

  height: 18px;

  background-image: url(../img/heading-line.svg);

  background-size: 100%;

  background-repeat: no-repeat;

  z-index: -1;

}



.left__section .item__content p {

  color: var(--color-white);

  margin: 18px 0 46px;

}



.left__section .item__content .btn__book {

  background-color: var(--color-white);

  border-radius: 6px;

  padding: 14px 28px;

}



.left__section .item__content .btn__book:hover {

  background-color: var(--color-yellow);

  color: var(--color-black);

}



.hvac__banner .right__section {

  background-color: var(--color-white);

  border-radius: 100%;

  border: 12px solid var(--color-white);

  max-width: 80%;

  margin-left: auto;

}



.hvac__banner .right__section img {

  width: 100%;

  height: auto;

  border-radius: 50%;

}



.hvac__banner .owl-carousel .owl-dots {

  display: flex;

  gap: 8px;

  margin-top: 80px;

}



.hvac__banner .owl-carousel button.owl-dot {

  border-radius: 3.5px;

  opacity: 0.4;

  background-color: var(--color-black);

  width: 30px;

  height: 4px;

}



.hvac__banner .owl-carousel button.owl-dot.active {

  background-color: var(--color-white);

  opacity: 1;

}



.contact__section .img__box img {

  width: 100%;

  height: auto;

}



.service__bookings .card__bnr {

  padding: 46px 40px;

  border-radius: 12px;

  background: #e6f1fd;

  position: relative;

  overflow: hidden;

  z-index: 0;

}



.service__bookings .card__bnr h4 {

  font: normal normal 700 40px/112% var(--font);

  color: var(--color-bg);

  text-align: left;

  letter-spacing: -0.6px;

}



.service__bookings .card__bnr p {

  color: var(--color-grey);

  text-align: center;

  margin-top: 10px;

}



.service__bookings .form__box,

.service__bookings .form__box .btn__submit {

  margin-top: 36px;

}

.service__bookings .form__box .btn__submit .btn {

  width: 100%;

}

.hvac .our__services {

  margin-top: -36px;

  padding-top: 100px;

  border-bottom: 2px solid #fed358;

  background: linear-gradient(180deg, #ffdf87 0%, #ffbc00 100%);

}



.hvac .our__services .main__heading h2 span.cap::before {

  filter: brightness(0) invert(0);

}



.hvac .our__services .main__heading p {

  color: var(--color-black);

}



.hvac .our__services .card__bx .thumbnails img {

  height: 355px;

  object-fit: cover;

}



.hvac .our__services .card__bx .content__bx {

  margin: 30px 0 30px 30px;

  max-width: 93%;

  min-width: 93%;

}



.hvac .our__services .card__bx .content__bx span {

  color: var(--color-yellow);

}



.hvac .our__serviceBx .card__bx {

  background: var(--color-yellow);

}



.hvac .our__serviceBx .card__bx .item__card p {

  color: var(--color-black);

}



.hvac .our__serviceBx .card__bx .item__card img {

  filter: brightness(0) invert(0);

}



.hvac .our__clients {

  background: var(--color-bg);

}



.hvac .our__clients .main__heading h2 {

  color: var(--color-white);

}



.hvac .our__clients .owl-carousel button.owl-dot {

  background-color: var(--color-white);

}



.hvac .our__clients .owl-carousel button.owl-dot.active {

  background-color: var(--color-primary);

}



.hvac .our__clients .clients__slider .item {

  background-image: url(../img/feedback-bg-02.png);

  transition: 0.4s all ease-out;

}



.hvac .our__clients .clients__slider .center .item {

  background-image: url(../img/feedback-bg.png);

}



.hvac .get__contact .btn__call .icon {

  background-color: var(--color-yellow);

}



.hvac .get__contact .btn__call .icon img {

  filter: brightness(0) invert(0);

}



.hvac .footer {

  background: var(--color-white);

}



.hvac .footer .ftr__logo img {

  filter: unset;

}



.hvac .footer .contact__info .icon {

  background: var(--color-primary);

}



.hvac .footer .contact__info .icon img {

  filter: brightness(0) invert(1);

}



.hvac .footer .ftr__columns p,

.hvac .footer .ftr__columns a {

  color: var(--color-grey);

}



.hvac .footer .ftr__columns h4 {

  color: var(--color-black);

}



.hvac .footer .ftr__columns span,

.hvac .footer .ftr__btm p span {

  color: var(--color-primary);

}



.hvac .footer .ftr__btm {

  border-top: 1px solid var(--color-yellow);

}



.hvac .footer .ftr__btm p,

.hvac .footer .ftr__btm .rt__btm a,

.hvac .footer .ftr__btm .rt__btm a:hover {

  color: var(--color-bg);

}



.hvac .footer .ftr__btm .social__media li img {

  filter: brightness(0) invert(0);

}



.hvac .navbar .btn {

  border-radius: 6px;

  border: 1px solid var(--color-primary);

  background: var(--color-primary);

  padding: 14px 16px;

  color: var(--color-white);

}



.hvac .navbar .btn img {

  filter: brightness(0) invert(1);

}



.form-control:focus,

.form-select:focus {

  box-shadow: none;

}



.msgdiv .alert {

  margin-top: 1rem;

  padding: 1rem;

  margin-bottom: 0rem;

  font: normal normal 500 14px/21px var(--font);

}

.alert-success {

  color: var(--color-black);

  background-color: #ffffff;

  border-color: #ffffff;

}



.our__products {

  border-bottom: 2px solid #fed358;

  background: linear-gradient(180deg, #ffdf87 0%, #ffbc00 100%);

}

.our__products .main__heading h2 span.cap::before {

  filter: brightness(0) invert(0);

}

.our__products .card__bx {

  overflow: hidden;

}

.our__products .card__bx .thumbnails {

  position: relative;

  overflow: hidden;

  border-radius: 12px;

  background: #fff;

}

.our__products .card__bx .thumbnails::before {

  position: absolute;

  left: 0;

  bottom: 0;

  content: "";

  width: 100%;

  height: 0;

  margin: auto;

  background: linear-gradient(

    180deg,

    rgba(255, 255, 255, 0) 0%,

    rgba(1, 115, 239, 0.4) 100%

  );

  border-radius: 12px;

  transition: height 0.6s;

}

.our__products .card__bx:hover .thumbnails::before {

  height: 100%;

}

.our__products .card__bx .thumbnails img {

  width: 100%;

  height: 350px;

  object-fit: cover;

}

.our__products .card__bx .content__bx {

  padding: 16px;

  background-color: var(--color-primary);

  width: 92%;

  margin: -35px auto 0px;

  position: relative;

  border-radius: 8px;

  min-height: 90px;

}

.our__products .card__bx .content__bx h5 {

  color: #fff;

  text-align: center;

}

.our__products .card__bx .content__bx p {

  color: #fff;

  margin-top: 8px;

  font: normal normal 400 18px/23px var(--font);

}

.our__projects {

  background: rgba(230, 241, 253, 0.56);

}

.our__projects .row {

  row-gap: 56px;

}

.our__projects .card__bx {

  background-color: var(--color-white);

  padding: 24px;

  border-radius: 24px;

  box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;

}

.our__projects .card__bx img {

  width: 100%;

  height: 450px;

  object-fit: cover;

  border-radius: 12px 12px 0 0;

}

.our__projects .card__bx .content__bx {

  padding: 20px 0 0 0;

}

.our__projects .card__bx .content__bx h3 {

  color: var(--color-black);

}

.our__projects .card__bx .content__bx p {

  margin-top: 12px;

  color: var(--color-black);

}

#loader {

    position: absolute;

    inset: 0;

    width: 100%;

    height: 100%;

    margin: auto;

    display: flex;

    align-items: center;

    justify-content: center;

    background: #00234840;

    z-index: 1;

}

.hvac #loader {

    background: #f1f7fe80;

}

#loader img {

    width: 50px;

    height: auto;

}

.thank-you .header {

    top: 0;

}

.thankYou__page {

    height: 100vh;

    width: 100%;

    display: flex;

    align-items: center;

    justify-content: center;

}



.thankYou__page .card__bx {

    padding: 42px;

    border-radius: 24px;

    max-width: 50%;

    margin: auto;

    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;

}

.thankYou__page .card__bx h2 {

    text-align: center;

    color: var(--color-black);

}

.thankYou__page .card__bx p {

    text-align: center;

    margin: 16px 0 24px;

    color: var(--color-grey);

}

.thankYou__page .card__bx .btn {

    margin: auto;

    display: block;

    width: fit-content;

    padding: 14px 40px;

}

.thankYou__page .card__bx img {

    display: block;

    margin: auto;

    width: 95px;

    height: auto;

    margin-bottom: 10px;

}