:root {
  --swiper-navigation-color: #fff;
}

.fxcb-flex-tab-column-banner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  column-gap: 75px;
}

.fxcb-flex-item-title {
  margin-right: 0 !important;
}

#fxcb-text div:nth-of-type(2),
.fxcb-flex-item-content-tag {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

#fxcb-text div:nth-of-type(4),
.fxcb-description-item {
  display: -webkit-box !important;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.fxcb-flex-item-content-tags {
  margin-bottom: 20px;
}

.fxcb-devider {
  width: 127px;
  height: 1px;
  background-color: #dcdddf;
  display: block;
  margin: 22px auto 20px;
}

.fxcb-description-item {
  margin-bottom: 30px;
}

.fxcb-description {
  width: 300px;
  margin: 0 auto;
}

.fxcb-img-hover {
  animation: 5s linear;
}

.fxcb-test.fxcb-active {
  display: block !important;
}
.fxcb-tab-title {
  cursor: pointer;
  position: relative;
}
.fxcb-child-count {
  position: absolute;
  top: -10px;
  right: -13px;
}
.fxcb-img-content {
  position: absolute;
  bottom: 0;
  left: 0;
  top: 0;
  right: 0;
  z-index: 1;
}

@media (min-width: 1300px) {
  .fxcb-img-height {
    width: 100%;
    padding-top: 32%;
    height: 100%;
    position: relative;
  }

  .fxcb-col {
    padding: 0 15px !important;
  }

  .fxcb-tab-content-item-uxb {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr);
  }

  .fxcb-tab-content-item-uxb .uxb-wrapper {
    display: block;
  }

  .fxcb-tab-content-item-uxb .uxb-wrapper:nth-of-type(n + 5) {
    display: none;
  }
}

@media (min-width: 992px) and (max-width: 1299.98px) {
  .fxcb-img-height {
    width: 100%;
    padding-top: 45%;
    height: 100%;
    position: relative;
  }

  .fxcb-tab-content-item-uxb {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr);
  }

  .fxcb-tab-content-item-uxb .uxb-wrapper {
    display: block;
  }

  .fxcb-tab-content-item-uxb .uxb-wrapper:nth-of-type(n + 4) {
    display: none;
  }
}

@media (min-width: 575px) and (max-width: 991.98px) {
  .fxcb-img-height {
    width: 100%;
    padding-top: 66%;
    height: 100%;
    position: relative;
  }

  .fxcb-tab-content-item-uxb {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr);
  }

  .fxcb-tab-content-item-uxb .uxb-wrapper {
    display: block;
  }
}

@media (max-width: 574.98px) {
  .fxcb-img-height {
    width: 100%;
    padding-top: 100%;
    height: 100%;
    position: relative;
  }

  .fxcb-tab-content-item-uxb {
    display: grid !important;
    grid-template-columns: repeat(1, 1fr);
  }

  .fxcb-tab-content-item-uxb .uxb-wrapper {
    display: block;
  }

  .fxcb-tab-content-item-uxb .uxb-wrapper-inline:nth-of-type(n + 2) {
    display: none;
  }
}

.fxcb-img-default {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.fxcb-model-img {
  position: absolute;
  bottom: 0;
  top: 0;
  left: 0;
  right: 0;
  background-color: rgba(11, 11, 11, 0.3);
  z-index: 1;
}

.fxcb-background-default {
  background-color: #7e7e7e;
  position: absolute;
  bottom: 0;
  top: 0;
  left: 0;
  right: 0;
}

.fxcb-tab-content {
  cursor: pointer;
}

.fxcb-title-header {
  position: relative;
}

.fxcb-title-header::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  background-color: #dcdddf;
  bottom: -5px;
  left: 0;
}

.fxcb-line-hover {
  position: relative;
  display: inline-block;
  cursor: pointer;
}

.fxcb-line-hover::after {
  content: "";
  position: absolute;
  left: 50%;
  right: 50%;
  bottom: -5px;
  height: 1px;
  background-color: #dcdddf;
  transition: left 0.4s cubic-bezier(0.4, 0, 0.2, 1),
    right 0.4s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s;
}

.fxcb-line-hover:hover::after {
  left: 0;
  right: 0;
  opacity: 1;
}

.fxcb-img-bg {
  transition: all 0.7s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.fxcb-tab-content__uxb {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  z-index: 9999;
  background: #fff;
  display: none;
}

.uxb-wrapper--fxcb_tab_banner_item:first-of-type .fxcb-tab-content__uxb {
  display: block;
}

.uxb-wrapper {
  position: static !important;
}

.fxcb-fade-container img {
  opacity: 0;
  transition: opacity 0.7s ease-in-out;
}

.fxcb-fade-container img.fxcb-active-img {
  opacity: 1;
  z-index: 1;
}

p {
  margin-bottom: 0 !important;
}

#fxcb-text a.uxb-draggable,
#fxcb-text div:nth-of-type(3),
#fxcb-text div:nth-of-type(4) {
  display: none;
  max-height: 0;
  transform: translateY(20px);
  transition: opacity 0.2s ease, transform 0.2s ease, max-height 0.2s ease;
  will-change: opacity, transform, max-height;
  pointer-events: none;
  overflow: hidden;
}

.fxcb-card.mobile-hover #fxcb-text a.uxb-draggable,
.fxcb-card.mobile-hover #fxcb-text div:nth-of-type(3),
.fxcb-card.mobile-hover #fxcb-text div:nth-of-type(4),
.fxcb-card:hover #fxcb-text a.uxb-draggable,
.fxcb-card:hover #fxcb-text div:nth-of-type(3),
.fxcb-card:hover #fxcb-text div:nth-of-type(4) {
  display: block;
  max-height: 500px;
  transform: translateY(0);
  pointer-events: auto;
}

.fxcb-card.mobile-hover #fxcb-text div:nth-of-type(4),
.fxcb-card:hover #fxcb-text div:nth-of-type(4){
  margin-bottom: 10px;
}
/* Animation */
.fxcb-card {
  height: 100%;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

#fxcb-content {
  width: 100%;
  text-align: center;
  position: relative;
  color: white;
  padding: 30px 30px 7px 30px;
  transition: padding 0.4s ease;
}

.fxcb-card.mobile-hover #fxcb-content,
.fxcb-card:hover #fxcb-content {
  padding: 42px 30px 37px 30px;
}
#fxcb-content::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: #fff;
  z-index: 0;
  transform: translateY(20%);
  opacity: 0;
  transition: transform 0.6s ease, opacity 0.6s ease;
  will-change: transform, opacity;
  pointer-events: none;
}

.fxcb-card.mobile-hover #fxcb-content::before,
.fxcb-card:hover #fxcb-content::before {
  transform: translateY(0);
  opacity: 1;
}

#fxcb-content > * {
  position: relative;
  z-index: 1;
}

.fxcb-flex-item-content-title {
  transform: translateY(20px);
  transition: transform 0.6s ease, opacity 0.6s ease;
  will-change: transform, opacity;
  margin-bottom: 35px;
}


.fxcb-card.mobile-hover .fxcb-flex-item-content-title,
.fxcb-card:hover .fxcb-flex-item-content-title {
  transform: translateY(0px);
  opacity: 1;
  margin-bottom: 0;
}

.fxcb-flex-item-content-description {
  opacity: 0;
  max-height: 0;
  transform: translateY(20px);
  transition: opacity 0.2s ease, transform 0.2s ease, max-height 0.2s ease;
  will-change: opacity, transform, max-height;
  pointer-events: none;
  overflow: hidden;
}

.fxcb-card.mobile-hover .fxcb-flex-item-content-description,
.fxcb-card:hover .fxcb-flex-item-content-description {
  opacity: 1;
  max-height: 500px;
  transform: translateY(0);
  pointer-events: auto;
}
.fxcb-flex-item-content-tags,
#fxcb-text{
  color: #ffffff;
}

#fxcb-text,
.fxcb-flex-item-content-tags {
  margin-bottom: 10px;
  transition: color 0.6s ease;
}

.fxcb-description-item {
  transition: color 0.6s ease;
}
.fxcb-card.mobile-hover #fxcb-text,
.fxcb-card.mobile-hover #fxcb-text div >*,
.fxcb-card.mobile-hover .fxcb-description-item div >*,
.fxcb-card:hover #fxcb-text,
.fxcb-card:hover #fxcb-text div >*,
.fxcb-card:hover .fxcb-description-item div >* {
  color: #0a1119 !important;
}

.fxcb-card.mobile-hover .fxcb-flex-item-content-tags,
.fxcb-card.mobile-hover .fxcb-flex-item-content-tags div >*,
.fxcb-card:hover .fxcb-flex-item-content-tags,
.fxcb-card:hover .fxcb-flex-item-content-tags div >* {
  color: #4b535d !important;
}

.fxcb-card.mobile-hover #fxcb-text div:nth-of-type(2),
.fxcb-card.mobile-hover .fxcb-flex-item-content-tag,
.fxcb-card:hover #fxcb-text div:nth-of-type(2),
.fxcb-card:hover .fxcb-flex-item-content-tag {
  display: block;
}

.uxb-wrapper.uxb-wrapper--text{
  color: #ffffff;
}

.swiper-slide::before{
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-right: 1px solid rgba(255, 255, 255, 0.3);
}

.devider{
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  border-right: 1px solid rgba(255, 255, 255, 0.3);
}

.flexa-button-next,
.flexa-button-prev {
  display: block;
  color: #000;
}
.swiper .swiper-button-next:after, .swiper .swiper-button-prev:after {
  --swiper-navigation-size: 10px;
}



.swiper .swiper-button-next, .swiper .swiper-button-prev {
  background-color: #c72831;
  border: 8px solid rgb(255, 255, 255, 0.1);
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  box-sizing: border-box;
  background-clip: padding-box;
}

.swiper .swiper-button-next {
  background-color: #1d71b8;
}

@media screen and (min-width: 768px) {
  .swiper .swiper-button-next.swiper-button-disabled, .swiper .swiper-button-prev.swiper-button-disabled {
    opacity: 0;
  }
}

@media screen and (max-width: 768px) {
  .flexa-button-next,
  .flexa-button-prev {
    display: block !important;
  }
}
