/*-----------------------------------------
 =============== Sec-1 start ===============
 ------------------------------------------*/
.sec-1 .hero-img-wrapper {
  display: flex;
  justify-content: center;
  overflow: hidden;
  max-height: 500px;
  height: 70vh;
}

.sec-1 .hero-img {
  max-width: 200%;
  height: max-content;
}

@media (min-width: 576px) {
  .sec-1 .hero-img-wrapper {
    display: block;
    overflow: unset;
    height: unset;
    max-height: none;
  }

  .sec-1 .hero-img {
    max-width: 100%;
    height: auto;
  }
}

@media (min-width: 1200px) {
  .sec-1 .hero-img-wrapper {
    margin-right: -3%;
  }
}

@media (min-width: 1500px) {
  .sec-1 .hero-img-wrapper {
    margin-right: -5%;
  }
}

/*-----------------------------------------
   =============== Sec-1 end ===============
   ------------------------------------------*/


/*-----------------------------------------
   =============== Sec-2 start ===============
   ------------------------------------------*/


/*-----------------------------------------
   =============== Sec-2 end ===============
   ------------------------------------------*/



/*-----------------------------------------
   =============== Sec-3 start ===============
   ------------------------------------------*/
.sec-3 .bg-img-container {
  height: 30vh;
  position: relative;
}

.sec-3 .bg-img {
  width: 100%;
  object-fit: cover;
  height: 100%;
  transition: .5s ease-in-out;
}

@media (min-width: 576px) {
  .sec-3 .bg-img-container {
    border-radius: 8px 8px 0 0;
  }

  .sec-3 .content-wrapper {
    border-radius: 0 0 8px 8px;
  }
}

@media (min-width: 768px) {
  .sec-3 .bg-img-container {
    height: unset;
    position: unset;
    overflow: hidden;
    border-radius: 8px 0 0 8px;
  }

  .sec-3 .bg-img {
    position: absolute;
  }

  .sec-3 .bg-img:hover {
    width: 105%;
    height: 105%;
    transition: .5s ease-in-out;
  }

  .sec-3 .content-wrapper {
    border-radius: 0 8px 8px 0;
  }

}

/*-----------------------------------------
   =============== Sec-3 end ===============
   ------------------------------------------*/
/*-----------------------------------------
   =============== Sec-4 start ===============
   ------------------------------------------*/

.sec-4 .bg-img-container {
  height: 30vh;
}

.sec-4 .bg-wrapper {
  background-image: url('https://cdn.transactbridge.com/index/our-services.png');
  width: 100%;
  height: 100%;
  background-size: cover;
}

.sec-4 .bg-wrapper .bg-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (min-width: 576px) {
  .sec-4 .bg-wrapper {
    border-radius: 8px;
  }
}

@media (min-width: 992px) {
  .sec-4 .bg-img-container {
    height: unset;
    position: unset;
  }

  .bg-img-container {
    height: unset;
  }

  .sec-4 .bg-wrapper {
    border-radius: 8px;
    background-position: 50% 50%;
  }
}

/*-----------------------------------------
   =============== Sec-4 end ===============
   ------------------------------------------*/



/*------------------------------------------
   =============== Sec-5 start ===============
   ------------------------------------------*/

@media (max-width: 768px) {
  .sec-5 .card.reverse {
    flex-direction: column-reverse;
  }

  .sec-5 .card.reverse .card-img-bottom {
    border-radius: .375rem .375rem 0 0;
  }
}

/*-----------------------------------------
   =============== Sec-5 end ===============
   ------------------------------------------*/

/*-------------------------------------
   =============== Sec-6 start ===============
   --------------------------------------*/
.sec-6 .bg-wrapper {
  background-image: url('https://cdn.transactbridge.com/index/global-payment-solution-mob.png');
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: bottom;
  border-radius: 0 0 8px 8px;
}

.sec-6 .bg-img-container {
  max-height: 400px;
  height: 70vh;
}

@media (min-width: 576px) {
  .sec-6 .bg-img-container {
    max-height: unset;
    height: unset;
  }
}

@media (min-width: 992px) {
  .sec-6 .bg-wrapper {
    background-image: url('https://cdn.transactbridge.com/index/global-payment-solution.png');
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: unset;
    border-radius: 0 8px 8px 0;
  }
}
/*-----------------------------------------
   =============== Sec-6 end ===============
   ------------------------------------------*/