.video-with-image-section{
  display: block;
}
.video-with-image-section .video-with-image {
  max-width: calc(var(--page-width) + 60px);
  margin: 0 auto;
}
.video-with-image-section .video-with-image__header {
  padding: 50px 0 34px;
  color: #48413F;
}
.video-with-image-section .video-with-image__header__title {
  font-weight: bold;
  font-size: 40px;
  line-height: 1.5;
  text-align: center;
}
.video-with-image-section .video-with-image__header__subtitle {
  font-size: 20px;
  line-height: 1.5;
  text-align: center;
}
.video-with-image-section .video-with-image__items {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 1rem;
}
.video-with-image-section .video-with-image__item {
  overflow: hidden;
}
.video-with-image-section .video-with-image__video {
  flex: 1;
}
.video-with-image-section .video-with-image__video-el {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.video-with-image-section .video-with-image__image {
  flex: 1;
}
.video-with-image-section .video-with-image__img {
  width: 100%;
  height: auto;
  display: block;
}
.video-with-image-section .video-with-image__content-wrapper {
  flex: 1;
}
.video-with-image-section .video-with-image__content {
  font-size: 22px;
  color: #48413F;
  font-weight: 500;
  padding-top: 21px;
}
.video-with-image-section .video-with-image__content__title {
  text-align: center;
  font-weight: bold;
}
.video-with-image-section .video-with-image__content__subtitle {
  font-size: 18px;
  padding: 19px 20px 0;
  text-align: center;
}
.video-with-image-section .button-group {
  padding: 35px 22px 50px;
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  gap: 26px;
}
.video-with-image-section .video-with-image__product-form{
  display: block;
  max-width: 200px;
  width: 100%;
}
.video-with-image-section .button-group .btn {
  max-width: 200px;
  width: 100%;
  height: 50px;
  font-size: 14px;
  background: #F9608A;
  color: #fff;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  border: none;
  cursor: pointer;
  text-decoration: none;
}
.video-with-image-section .button-group .btn span{
  margin-right: 6px;
}
.video-with-image-section .button-group .btn-hollow {
  background: #fff;
  color: #48413F;
  border: 1px solid #48413F;
}
.video-with-image-section .button-group .btn::after {
  content: '';
  display: block;
  border: 6px solid transparent;
  border-left-width: 8px;
  margin-left: 8px;
  margin-top: 2px;
  border-left-color: #fff;
}
.video-with-image .button-group .video-with-image__product-form .btn::after{
  display: none;
}
.video-with-image-section .button-group .btn-hollow::after {
  border-left-color: #48413F;
}


.video-with-image__quick-add .icon-loading {
  display: none;
  margin: 8px;
  color: rgb(255 255 255 / 100%);
  animation: animation-button-loading linear 1.5s infinite;
}

.video-with-image__quick-add.loading {
  pointer-events: none;
}

.video-with-image__quick-add.loading .icon-quick-add {
  display: none;
}

.video-with-image__quick-add.loading .icon-loading {
  display: block;
}

@media (min-width: 768px) {
  .video-with-image-section .video-with-image__items {
    grid-template-columns: repeat(var(--colum-num), minmax(0, 1fr));
  }
  .video-with-image-section .video-with-image__item--single {
    display: flex;
    align-items: center;
  }
  .video-with-image-section .video-with-image__item--single .video-with-image__content {
    padding-top: 0;
  }
  .video-with-image-section .video-with-image__item--single .button-group {
    padding: 35px 22px 0;
  }
}

@media (max-width: 767px) {
  .video-with-image-section .video-with-image__header {
    padding: 2rem 0 1rem;
  }
  .video-with-image-section .video-with-image__header__title {
    font-size: 1.42rem;
  }
  .video-with-image-section .video-with-image__header__subtitle {
    font-size: 1rem;
  }
  .video-with-image-section .video-with-image__content {
    font-size: 1.083rem;
    padding-top: 2.083rem;
  }
  .video-with-image-section .video-with-image__content__subtitle {
    font-size: 1rem;
    padding: 1.083rem 1rem 0;
  }
  .video-with-image-section .button-group {
    padding: 1.5rem 1.83rem 2.083rem;
    gap: 0.5rem;
  }
  .video-with-image-section .button-group .btn {
    flex: 1;
    min-width: auto;
    height: 3.5rem;
    font-size: 1.083rem;
  }
}