/*!
 * Bootstrap  v5.3.7 (https://getbootstrap.com/)
 * Copyright 2011-2025 The Bootstrap Authors
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
 */

.varbase-hero-card.hero-style-overlay {
  min-height: 40.625rem;
  max-height: 40.625rem;
}

@media (max-width: 991.98px) {
  .varbase-hero-card.hero-style-overlay {
    min-height: 30rem;
    max-height: 30rem;
  }
}

.varbase-hero-card.hero-style-overlay .ratio {
  width: 100vw;
}

.varbase-hero-card.hero-style-overlay .ratio .drimage picture {
  position: absolute;
  left: 0;
  width: 100%;
  height: 100%;
}

[dir="rtl"] .varbase-hero-card.hero-style-overlay .ratio .drimage picture {
  left: auto;
  right: 0;
}

@media screen and (max-width: 992px) {
  .varbase-hero-card.hero-style-overlay .ratio > .drimage,
  .varbase-hero-card.hero-style-overlay .ratio > video,
  .varbase-hero-card.hero-style-overlay .ratio > iframe {
    position: fixed;
    top: 15%;
  }
}

.varbase-hero-card.hero-style-overlay .hero-card-content {
  position: absolute;
  width: 100%;
  inset: 0;
  padding: 1.88rem;
  z-index: 2;
  color: #fff;
}

.varbase-hero-card.hero-style-overlay .hero-card-content > * {
  max-width: 53rem;
}

@media screen and (max-width: 576px) {
  .varbase-hero-card.hero-style-overlay .hero-card-content {
    padding-bottom: 9.375rem;
  }
}

@media screen and (min-width: 576px) {
  .varbase-hero-card.hero-style-overlay .hero-card-content {
    padding: 1.88rem calc((100vw - 540px) / 2) 3.88rem;
  }
}

@media screen and (min-width: 768px) {
  .varbase-hero-card.hero-style-overlay .hero-card-content {
    padding: 1.88rem calc((100vw - 720px) / 2 + .9375rem) 3.88rem;
  }
}

@media screen and (min-width: 992px) {
  .varbase-hero-card.hero-style-overlay .hero-card-content {
    padding: 1.88rem calc((100vw - 960px) / 2 + .9375rem) 9.375rem;
  }
}

@media screen and (min-width: 1200px) {
  .varbase-hero-card.hero-style-overlay .hero-card-content {
    padding: 1.88rem calc((100vw - 1140px) / 2 + .9375rem) 9.375rem;
  }
}

@media screen and (min-width: 1400px) {
  .varbase-hero-card.hero-style-overlay .hero-card-content {
    padding: 1.88rem calc((100vw - 1270px) / 2 + .9375rem) 9.375rem;
  }
}

.varbase-hero-card.hero-style-overlay .hero-card-content .card-title {
  color: #fff;
  font-size: calc(1.59375rem + 4.125vw);
  line-height: 1.15;
}

@media (min-width: 1200px) {
  .varbase-hero-card.hero-style-overlay .hero-card-content .card-title {
    font-size: 4.6875rem;
  }
}

.varbase-hero-card.hero-style-overlay .hero-card-content .card-title a {
  color: #fff;
  text-transform: none;
}

.varbase-hero-card.hero-style-overlay .hero-card-content .card-title h2,
.varbase-hero-card.hero-style-overlay .hero-card-content .card-title h3 {
  font-size: calc(1.375rem + 1.5vw);
}

@media (min-width: 1200px) {
  .varbase-hero-card.hero-style-overlay .hero-card-content .card-title h2,
  .varbase-hero-card.hero-style-overlay .hero-card-content .card-title h3 {
    font-size: 2.5rem;
  }
}

@media screen and (min-width: 576px) {
  .varbase-hero-card.hero-style-overlay .hero-card-content .card-title h2,
  .varbase-hero-card.hero-style-overlay .hero-card-content .card-title h3 {
    font-size: calc(1.375rem + 1.5vw);
  }
}

@media screen and (min-width: 576px) and (min-width: 1200px) {
  .varbase-hero-card.hero-style-overlay .hero-card-content .card-title h2,
  .varbase-hero-card.hero-style-overlay .hero-card-content .card-title h3 {
    font-size: 2.5rem;
  }
}

@media screen and (min-width: 768px) {
  .varbase-hero-card.hero-style-overlay .hero-card-content .card-title h2,
  .varbase-hero-card.hero-style-overlay .hero-card-content .card-title h3 {
    font-size: calc(1.375rem + 1.5vw);
  }
}

@media screen and (min-width: 768px) and (min-width: 1200px) {
  .varbase-hero-card.hero-style-overlay .hero-card-content .card-title h2,
  .varbase-hero-card.hero-style-overlay .hero-card-content .card-title h3 {
    font-size: 2.5rem;
  }
}

@media screen and (min-width: 992px) {
  .varbase-hero-card.hero-style-overlay .hero-card-content .card-title h2,
  .varbase-hero-card.hero-style-overlay .hero-card-content .card-title h3 {
    font-size: calc(1.59375rem + 4.125vw);
  }
}

@media screen and (min-width: 992px) and (min-width: 1200px) {
  .varbase-hero-card.hero-style-overlay .hero-card-content .card-title h2,
  .varbase-hero-card.hero-style-overlay .hero-card-content .card-title h3 {
    font-size: 4.6875rem;
  }
}

@media screen and (min-width: 1200px) {
  .varbase-hero-card.hero-style-overlay .hero-card-content .card-title h2,
  .varbase-hero-card.hero-style-overlay .hero-card-content .card-title h3 {
    font-size: calc(1.59375rem + 4.125vw);
  }
}

@media screen and (min-width: 1200px) and (min-width: 1200px) {
  .varbase-hero-card.hero-style-overlay .hero-card-content .card-title h2,
  .varbase-hero-card.hero-style-overlay .hero-card-content .card-title h3 {
    font-size: 4.6875rem;
  }
}

@media screen and (min-width: 768px) {
  .varbase-hero-card.hero-style-overlay .hero-card-content.card-body {
    min-height: 30rem;
  }
}

.varbase-hero-card.hero-style-overlay .hero-card-content.card-body .content-inner {
  max-width: 50rem;
}

@media (max-width: 991.98px) {
  .varbase-hero-card.hero-style-overlay .hero-card-content.card-body .content-inner {
    max-width: 75%;
  }
}

.varbase-hero-card.hero-style-overlay .media {
  position: relative;
  width: 100vw;
  height: 130vh;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  padding-bottom: 0;
}

[dir="rtl"] .varbase-hero-card.hero-style-overlay .media {
  left: auto;
  right: 50%;
  transform: translateY(-50%) translateX(50%);
}

@media screen and (min-width: 1200px) {
  .varbase-hero-card.hero-style-overlay .media {
    height: auto;
  }
}

.varbase-hero-card.hero-style-overlay .media .drimage img {
  top: 0;
  left: 0;
  width: 100%;
  min-height: 30rem;
  object-fit: cover;
}

[dir="rtl"] .varbase-hero-card.hero-style-overlay .media .drimage img {
  left: auto;
  right: 0;
}

.varbase-hero-card.hero-style-overlay .media .varbase-video-player video {
  top: 0;
  left: 0;
  width: 100%;
  min-height: 30rem;
  object-fit: cover;
}

[dir="rtl"] .varbase-hero-card.hero-style-overlay .media .varbase-video-player video {
  left: auto;
  right: 0;
}

.varbase-hero-card.hero-style-overlay .media .varbase-video-player iframe {
  position: absolute;
  left: 0;
  object-fit: cover;
}

[dir="rtl"] .varbase-hero-card.hero-style-overlay .media .varbase-video-player iframe {
  left: auto;
  right: 0;
}

.varbase-hero-card.hero-style-overlay .video-play-link {
  position: absolute;
  bottom: 9.6875rem;
  right: 1.875rem;
  width: 3.125rem;
  height: 3.125rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 10;
  background: none;
  border: 0;
  opacity: 1;
}

[dir="rtl"] .varbase-hero-card.hero-style-overlay .video-play-link {
  right: auto;
  left: 1.875rem;
}

@media (max-width: 991.98px) {
  .varbase-hero-card.hero-style-overlay .video-play-link {
    bottom: 2.5rem;
    right: .625rem;
  }

  [dir="rtl"] .varbase-hero-card.hero-style-overlay .video-play-link {
    right: auto;
    left: .625rem;
  }
}

.varbase-hero-card.hero-style-overlay .video-play-link .pause-icon {
  display: inline-block;
  width: 3.125rem;
  height: 3.125rem;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: 100% 100%;
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="50" height="50" viewBox="0 0 50 50" fill="none"><path d="M25 0C38.8071 0 50 11.1929 50 25C50 38.8071 38.8071 50 25 50C11.1929 50 0 38.8071 0 25C0 11.1929 11.1929 0 25 0ZM20.625 17.5C18.8991 17.5 17.5 18.8991 17.5 20.625V29.375C17.5 31.1009 18.8991 32.5 20.625 32.5C22.3509 32.5 23.75 31.1009 23.75 29.375V20.625C23.75 18.8991 22.3509 17.5 20.625 17.5ZM29.375 17.5C27.6491 17.5 26.25 18.8991 26.25 20.625V29.375C26.25 31.1009 27.6491 32.5 29.375 32.5C31.1009 32.5 32.5 31.1009 32.5 29.375V20.625C32.5 18.8991 31.1009 17.5 29.375 17.5Z" fill="white"/></svg>');
}

@media (max-width: 991.98px) {
  .varbase-hero-card.hero-style-overlay .video-play-link .pause-icon {
    width: 2.6875rem;
    height: 2.6875rem;
  }
}

.varbase-hero-card.hero-style-overlay .video-play-link.play .pause-icon {
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="50" height="50" viewBox="0 0 50 50" fill="none"><path d="M25 0C38.8071 0 50 11.1929 50 25C50 38.8071 38.8071 50 25 50C11.1929 50 0 38.8071 0 25C0 11.1929 11.1929 0 25 0ZM20 15C19.1715 15 18.5 15.6715 18.5 16.5V33.5C18.5 34.3285 19.1715 35 20 35C20.4142 35 20.7895 34.8315 21.0606 34.5303L33.0606 26.0303C33.5858 25.5858 33.5858 24.9142 33.0606 24.4697L21.0606 15.9697C20.7895 15.6685 20.4142 15.5 20 15.5Z" fill="white"/></svg>');
}

@media screen and (min-width: 768px) {
  .varbase-hero-card.hero-style-top, .varbase-hero-card.hero-style-bottom {
    padding: 0 calc((100vw - 720px) / 2 + .9375rem);
  }
}

@media screen and (min-width: 992px) {
  .varbase-hero-card.hero-style-top, .varbase-hero-card.hero-style-bottom {
    padding: 0 calc((100vw - 960px) / 2 + .9375rem);
  }
}

@media screen and (min-width: 1200px) {
  .varbase-hero-card.hero-style-top, .varbase-hero-card.hero-style-bottom {
    padding: 0 calc((100vw - 1140px) / 2 + .9375rem);
  }
}

@media screen and (min-width: 1400px) {
  .varbase-hero-card.hero-style-top, .varbase-hero-card.hero-style-bottom {
    padding: 0 calc((100vw - 1270px) / 2 + .9375rem);
  }
}

@media screen and (min-width: 992px) {
  .varbase-hero-card.hero-style-top .card-body, .varbase-hero-card.hero-style-bottom .card-body {
    padding-right: 9.375rem;
    padding-left: 9.375rem;
  }
}

.varbase-hero-card.hero-style-top .card-img, .varbase-hero-card.hero-style-bottom .card-img {
  overflow: hidden;
  width: 100%;
}

@media screen and (min-width: 992px) {
  .varbase-hero-card.hero-style-top .card-img, .varbase-hero-card.hero-style-bottom .card-img {
    min-height: 30rem;
    max-height: 30rem;
  }
}

@media screen and (min-width: 992px) {
  .varbase-hero-card.hero-style-top, .varbase-hero-card.hero-style-bottom {
    min-height: 30rem;
  }
}

@media screen and (min-width: 992px) {
  .varbase-hero-card.hero-style-top .drimage picture, .varbase-hero-card.hero-style-bottom .drimage picture {
    max-height: 30rem;
  }
}

.varbase-hero-card.hero-style-top .media, .varbase-hero-card.hero-style-bottom .media {
  position: relative;
  width: 100vw;
  height: 130vh;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  padding-bottom: 0;
}

[dir="rtl"] .varbase-hero-card.hero-style-top .media, [dir="rtl"] .varbase-hero-card.hero-style-bottom .media {
  left: auto;
  right: 50%;
  transform: translateY(-50%) translateX(50%);
}

@media screen and (min-width: 1200px) {
  .varbase-hero-card.hero-style-top .media, .varbase-hero-card.hero-style-bottom .media {
    height: auto;
  }
}

.varbase-hero-card.hero-style-top .media .drimage img, .varbase-hero-card.hero-style-bottom .media .drimage img {
  top: 0;
  left: 0;
  width: 100%;
  min-height: 30rem;
  object-fit: cover;
}

[dir="rtl"] .varbase-hero-card.hero-style-top .media .drimage img, [dir="rtl"] .varbase-hero-card.hero-style-bottom .media .drimage img {
  left: auto;
  right: 0;
}

@media screen and (min-width: 992px) {
  .varbase-hero-card.hero-style-top .media .drimage picture, .varbase-hero-card.hero-style-bottom .media .drimage picture {
    max-height: 30rem;
  }
}

.varbase-hero-card.hero-style-top .media .varbase-video-player video, .varbase-hero-card.hero-style-bottom .media .varbase-video-player video {
  top: 0;
  left: 0;
  width: 100%;
  min-height: 30rem;
  object-fit: cover;
}

[dir="rtl"] .varbase-hero-card.hero-style-top .media .varbase-video-player video, [dir="rtl"] .varbase-hero-card.hero-style-bottom .media .varbase-video-player video {
  left: auto;
  right: 0;
}

.varbase-hero-card.hero-style-top .media .varbase-video-player iframe, .varbase-hero-card.hero-style-bottom .media .varbase-video-player iframe {
  position: absolute;
  left: 0;
  object-fit: cover;
}

[dir="rtl"] .varbase-hero-card.hero-style-top .media .varbase-video-player iframe, [dir="rtl"] .varbase-hero-card.hero-style-bottom .media .varbase-video-player iframe {
  left: auto;
  right: 0;
}

@media screen and (max-width: 992px) {
  .varbase-hero-card.hero-style-start, .varbase-hero-card.hero-style-end {
    margin-right: 1.88rem;
    margin-left: 1.88rem;
  }

  .varbase-hero-card.hero-style-start .card-img, .varbase-hero-card.hero-style-end .card-img {
    overflow: hidden;
    width: 100%;
  }
}

.varbase-hero-card.hero-style-start .media, .varbase-hero-card.hero-style-end .media {
  position: relative;
  overflow: hidden;
}

.varbase-hero-card.hero-style-start .media .drimage img, .varbase-hero-card.hero-style-end .media .drimage img {
  position: absolute;
  width: 80vw;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  padding-bottom: 0;
  object-fit: cover;
}

[dir="rtl"] .varbase-hero-card.hero-style-start .media .drimage img, [dir="rtl"] .varbase-hero-card.hero-style-end .media .drimage img {
  left: auto;
  right: 50%;
  transform: translateY(-50%) translateX(50%);
}

.varbase-hero-card.hero-style-start .media .varbase-video-player, .varbase-hero-card.hero-style-end .media .varbase-video-player {
  overflow: hidden;
  position: static;
}

@media screen and (min-width: 992px) {
  .varbase-hero-card.hero-style-start .media .varbase-video-player video, .varbase-hero-card.hero-style-end .media .varbase-video-player video {
    position: absolute;
    width: 80vw;
    left: 20vw !important;
    top: 50%;
    transform: translateY(-50%) translateX(-50%);
    padding-bottom: 0;
    object-fit: cover;
  }

  [dir="rtl"] .varbase-hero-card.hero-style-start .media .varbase-video-player video, [dir="rtl"] .varbase-hero-card.hero-style-end .media .varbase-video-player video {
    left: auto !important;
    right: 20vw !important;
    transform: translateY(-50%) translateX(50%);
  }

  .varbase-hero-card.hero-style-start .media .varbase-video-player iframe, .varbase-hero-card.hero-style-end .media .varbase-video-player iframe {
    position: absolute;
    width: 80vw;
    left: 50%;
    top: 50%;
    transform: translateY(-50%) translateX(-50%);
    padding-bottom: 0;
    object-fit: cover;
  }

  [dir="rtl"] .varbase-hero-card.hero-style-start .media .varbase-video-player iframe, [dir="rtl"] .varbase-hero-card.hero-style-end .media .varbase-video-player iframe {
    left: auto;
    right: 50%;
    transform: translateY(-50%) translateX(50%);
  }
}

