.violet-bg .card-video p strong {
  color: var(--element1-color); }

.green-bg .card-video-wrapper, .violet-bg .card-video-wrapper {
  border-top: 1px solid #cabdee; }

.green-bg .card-video .video-circle, .white-bg .card-video .video-circle {
  background-color: var(--element2-color); }

.card-video-wrapper {
  border-top: 1px solid #e9e9e9;
  padding-top: 60px; }

.card-video .buttons {
  margin-top: 45px;
  justify-content: flex-start; }
  .card-video .buttons .btn {
    margin-left: 0; }
.card-video p {
  font-size: 18rem; }
  .card-video p strong {
    color: var(--primary-title); }
.card-video h3 {
  font-weight: 600;
  font-size: 80rem;
  margin: 0 !important; }
.card-video .title {
  margin-bottom: 60px; }
.card-video .video-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 362px;
  position: relative;
  margin-bottom: 60px; }
.card-video .video-circle {
  position: absolute;
  width: 362px;
  height: 362px;
  background-color: var(--element1-color);
  border-radius: 50%;
  z-index: -1; }
.card-video .video-bg {
  width: 199px;
  height: 401px;
  background-image: url("/img/phone-wideo-bg-white.webp");
  background-size: contain;
  background-repeat: no-repeat;
  padding: 10px;
  padding-bottom: 6px;
  display: flex;
  justify-content: center;
  align-items: center;
  filter: drop-shadow(-10px 0px 10px #00000055);
  margin: 20px 0; }
  .card-video .video-bg:hover .video-play {
    transform: scale(0.9); }
.card-video .video-camera {
  position: absolute;
  top: 20px;
  background-color: var(--primary-bg);
  border-radius: 50px;
  width: 52px;
  height: 18px; }
.card-video .video-play {
  background-image: url("/img/phone-wideo-play.webp");
  background-size: contain;
  background-repeat: no-repeat;
  width: 107px;
  height: 107px;
  position: absolute;
  pointer-events: none;
  transition: 0.3s;
  -webkit-transition: 0.3s; }
.card-video iframe, .card-video video {
  width: 100%;
  height: 100%;
  border-radius: 24px;
  height: 386px;
  background-color: black;
  cursor: pointer; }

@media (max-width: 575.5px) {
  .card-video {
    margin-bottom: 40px; }
    .card-video .video-circle {
      width: 290px;
      height: 290px; }
    .card-video .video-bg {
      width: 160px;
      height: 321px;
      padding: 8px;
      padding-bottom: 5px;
      margin: 16px 0;
      filter: drop-shadow(-8px 0px 8px #00000055); }
    .card-video .video-camera {
      top: 16px;
      width: 42px;
      height: 14px; }
    .card-video .video-play {
      width: 86px;
      height: 86px; }
    .card-video iframe, .card-video video {
      height: 309px;
      border-radius: 18px; }
    .card-video .text p {
      text-align: center; }
    .card-video .title {
      margin-bottom: 20px; }
    .card-video h3 {
      font-size: 50rem;
      text-align: center; }
    .card-video .video-wrapper {
      margin: 0 auto;
      margin-bottom: 20px;
      width: 290px; }
    .card-video .buttons {
      margin-top: 20px;
      justify-content: center; } }
@media (min-width: 576px) and (max-width: 767.5px) {
  .card-video {
    margin-bottom: 40px; }
    .card-video .text p {
      text-align: center; }
    .card-video .title {
      margin-bottom: 20px; }
    .card-video h3 {
      font-size: 60rem;
      text-align: center; }
    .card-video .video-wrapper {
      margin: 0 auto;
      margin-bottom: 20px; }
    .card-video .buttons {
      margin-top: 20px;
      justify-content: center; } }
@media (min-width: 768px) and (max-width: 991.5px) {
  .card-video {
    margin-bottom: 40px; }
    .card-video .video-circle {
      width: 247px;
      height: 247px; }
    .card-video .video-bg {
      width: 136px;
      height: 274px;
      padding: 7px;
      padding-bottom: 4px;
      margin: 14px 0; }
    .card-video .video-camera {
      width: 35px;
      height: 12px;
      top: 14px; }
    .card-video .video-play {
      width: 73px;
      height: 73px; }
    .card-video iframe, .card-video video {
      height: 263px;
      border-radius: 16px; }
    .card-video .title {
      margin-bottom: 20px; }
    .card-video h3 {
      font-size: 60rem; }
    .card-video .video-wrapper {
      margin-bottom: 20px;
      width: 289px; }
    .card-video .buttons {
      margin-top: 20px; } }
@media (min-width: 992px) and (max-width: 1199.5px) {
  .card-video .video-circle {
    width: 247px;
    height: 247px; }
  .card-video .video-bg {
    width: 136px;
    height: 274px;
    padding: 7px;
    padding-bottom: 4px;
    margin: 14px 0; }
  .card-video .video-camera {
    width: 35px;
    height: 12px;
    top: 14px; }
  .card-video .video-play {
    width: 73px;
    height: 73px; }
  .card-video iframe, .card-video video {
    height: 263px;
    border-radius: 16px; }
  .card-video .title {
    margin-bottom: 20px; }
  .card-video h3 {
    font-size: 60rem; }
  .card-video .video-wrapper {
    margin-bottom: 20px;
    width: 289px; }
  .card-video .buttons {
    margin-top: 20px; } }
@media (min-width: 1200px) and (max-width: 1579.5px) {
  .card-video .title {
    margin-bottom: 40px; }
  .card-video h3 {
    font-size: 67rem; }
  .card-video .video-wrapper {
    margin-bottom: 40px; }
  .card-video .buttons {
    margin-top: 30px; } }

/*# sourceMappingURL=card_video.css.map */