/*!**********************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./node_modules/sass-loader/dist/cjs.js!./cartridges/app_paulaschoice/cartridge/scss/pagedesigner/video-banner.scss ***!
  \**********************************************************************************************************************************************************************************************************************************************************************/
.fa {
  font-family: "icomoon" !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.fa-user:before, .fa-times:before, .fa-remove:before, .fa-close:before, .fa-facebook:before, .fa-youtube-play:before, .fa-youtube:before, .fa-twitter:before, .fa-instagram:before, .fa-search:before, .fa-comment:before, .fa-pinterest:before, .fa-paulas-choice-logo:before {
  color: #71605f;
}

.fa-logo-paulaschoice-stacked:before {
  content: "\e900";
}

.fa-paulas-choice-new-logo:before {
  content: "\e902";
}

.fa-klarna-logo:before {
  content: "\e903";
}

.fa-calendar:before {
  content: "\e904";
}

.fa-clock:before {
  content: "\e905";
}

.fa-savepay:before {
  content: "\e906";
}

.fa-play-circle:before {
  content: "\e907";
}

.fa-menu:before {
  content: "\e908";
}

.fa-paulas-choice-logo:before {
  content: "\e909";
}

.fa-info:before {
  content: "\e90a";
}

.fa-empty-star:before {
  content: "\e90b";
}

.fa-chat-user:before {
  content: "\e90c";
}

.fa-faq:before {
  content: "\e90d";
}

.fa-shopping-cart:before {
  content: "\e90e";
}

.fa-double-tap:before {
  content: "\e90f";
}

.fa-chevron-down:before {
  content: "\e910";
}

.fa-undo:before {
  content: "\e911";
}

.fa-eyedropper:before {
  content: "\e912";
}

.fa-chevron-left:before {
  content: "\e913";
}

.fa-mail:before {
  content: "\e914";
}

.fa-chevron-right:before {
  content: "\e915";
}

.fa-chevron-up:before {
  content: "\e916";
}

.fa-star:before {
  content: "\e917";
}

.fa-star-empty:before {
  content: "\e918";
}

.fa-info-circle:before {
  content: "\e919";
}

.fa-star-half:before {
  content: "\e91a";
}

.fa-youtube-play2:before {
  content: "\e91b";
}

.fa-pinterest:before {
  content: "\e91c";
}

.fa-comment:before {
  content: "\e91d";
}

.fa-search:before {
  content: "\e91e";
}

.fa-instagram:before {
  content: "\e91f";
}

.fa-twitter:before {
  content: "\e920";
}

.fa-youtube:before {
  content: "\e921";
}

.fa-facebook:before {
  content: "\e922";
}

.fa-close:before {
  content: "\e923";
}

.fa-remove:before {
  content: "\e923";
}

.fa-user:before {
  content: "\e924";
}

.fa-send:before {
  content: "\e925";
}

.fa-check:before {
  content: "\e926";
}

.fa-minus:before {
  content: "\e927";
}

.fa-plus:before {
  content: "\e928";
}

.fa-pf-bank-transfer:before {
  content: "\e929";
}

.fa-pf-ideal:before {
  content: "\e92a";
}

.fa-pf-mastercard:before {
  content: "\e92b";
}

.fa-pf-paypal:before {
  content: "\e92c";
}

.fa-pf-sofort:before {
  content: "\e92d";
}

.fa-pf-visa:before {
  content: "\e92e";
}

.fa-pf-bancontact-mister-cash:before {
  content: "\e92f";
}

.fa-heart--inactive:before {
  content: "\e930";
}

.fa-heart--active:before {
  content: "\e931";
}

/*
Animated checkmark icon
To animate, add .animate class to js-success-checkmark
*/
.success-checkmark {
  width: 80px;
  height: 115px;
}
.success-checkmark.animate .check-icon {
  display: block;
}
.success-checkmark .check-icon {
  width: 80px;
  height: 80px;
  position: relative;
  border-radius: 50%;
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  border: 4px solid #00b451;
}
.success-checkmark .check-icon::before {
  top: 3px;
  left: -2px;
  width: 30px;
  -webkit-transform-origin: 100% 50%;
          transform-origin: 100% 50%;
  border-radius: 100px 0 0 100px;
}
.success-checkmark .check-icon::after {
  top: 0;
  left: 30px;
  width: 60px;
  -webkit-transform-origin: 0 50%;
          transform-origin: 0 50%;
  border-radius: 0 100px 100px 0;
  -webkit-animation: rotate-circle 4.25s ease-in;
          animation: rotate-circle 4.25s ease-in;
}
.success-checkmark .check-icon::before, .success-checkmark .check-icon::after {
  content: "";
  height: 100px;
  position: absolute;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}
.success-checkmark .check-icon .icon-line {
  height: 5px;
  background-color: #00b451;
  display: block;
  border-radius: 2px;
  position: absolute;
  z-index: 10;
}
.success-checkmark .check-icon .icon-line.line-tip {
  top: 46px;
  left: 14px;
  width: 25px;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  -webkit-animation: icon-line-tip 0.75s;
          animation: icon-line-tip 0.75s;
}
.success-checkmark .check-icon .icon-line.line-long {
  top: 38px;
  right: 8px;
  width: 47px;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
  -webkit-animation: icon-line-long 0.75s;
          animation: icon-line-long 0.75s;
}
.success-checkmark .check-icon .icon-circle {
  top: -4px;
  left: -4px;
  z-index: 10;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  position: absolute;
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  border: 4px solid rgba(0, 180, 81, 0.5);
}
.success-checkmark .check-icon .icon-fix {
  top: 8px;
  width: 5px;
  left: 26px;
  z-index: 1;
  height: 85px;
  position: absolute;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

@-webkit-keyframes rotate-circle {
  0% {
    -webkit-transform: rotate(-45deg);
            transform: rotate(-45deg);
  }
  5% {
    -webkit-transform: rotate(-45deg);
            transform: rotate(-45deg);
  }
  12% {
    -webkit-transform: rotate(-405deg);
            transform: rotate(-405deg);
  }
  100% {
    -webkit-transform: rotate(-405deg);
            transform: rotate(-405deg);
  }
}

@keyframes rotate-circle {
  0% {
    -webkit-transform: rotate(-45deg);
            transform: rotate(-45deg);
  }
  5% {
    -webkit-transform: rotate(-45deg);
            transform: rotate(-45deg);
  }
  12% {
    -webkit-transform: rotate(-405deg);
            transform: rotate(-405deg);
  }
  100% {
    -webkit-transform: rotate(-405deg);
            transform: rotate(-405deg);
  }
}
@-webkit-keyframes icon-line-tip {
  0% {
    width: 0;
    left: 1px;
    top: 19px;
  }
  54% {
    width: 0;
    left: 1px;
    top: 19px;
  }
  70% {
    width: 50px;
    left: -8px;
    top: 37px;
  }
  84% {
    width: 17px;
    left: 21px;
    top: 48px;
  }
  100% {
    width: 25px;
    left: 14px;
    top: 45px;
  }
}
@keyframes icon-line-tip {
  0% {
    width: 0;
    left: 1px;
    top: 19px;
  }
  54% {
    width: 0;
    left: 1px;
    top: 19px;
  }
  70% {
    width: 50px;
    left: -8px;
    top: 37px;
  }
  84% {
    width: 17px;
    left: 21px;
    top: 48px;
  }
  100% {
    width: 25px;
    left: 14px;
    top: 45px;
  }
}
@-webkit-keyframes icon-line-long {
  0% {
    width: 0;
    right: 46px;
    top: 54px;
  }
  65% {
    width: 0;
    right: 46px;
    top: 54px;
  }
  84% {
    width: 55px;
    right: 0;
    top: 35px;
  }
  100% {
    width: 47px;
    right: 8px;
    top: 38px;
  }
}
@keyframes icon-line-long {
  0% {
    width: 0;
    right: 46px;
    top: 54px;
  }
  65% {
    width: 0;
    right: 46px;
    top: 54px;
  }
  84% {
    width: 55px;
    right: 0;
    top: 35px;
  }
  100% {
    width: 47px;
    right: 8px;
    top: 38px;
  }
}
body .wrapper:not(.menu-active):not(.sub-menu-active):not(.search-active) .top-banner:not(.scrolled) {
  background-color: transparent;
}
@media screen and (min-width: 768px) {
  body .wrapper:not(.menu-active):not(.sub-menu-active):not(.search-active) .top-banner:not(.scrolled) .main-nav {
    background-color: transparent;
  }
}
body .wrapper:not(.menu-active):not(.sub-menu-active):not(.search-active) .top-banner:not(.scrolled) .menu-utility-user {
  background-color: transparent;
}
body .wrapper:not(.menu-active):not(.sub-menu-active):not(.search-active) .top-banner:not(.scrolled) .search-toggle {
  border-color: #ffffff;
}
body .video-banner {
  margin-bottom: -90px;
  top: -90px;
}
@media screen and (max-width: 768px) {
  body .video-banner {
    margin-bottom: -136px;
    top: -136px;
  }
  body .quick-ctas-carousel .quick-ctas-item a {
    border-color: #ffffff;
    color: #ffffff;
  }
  body .quick-ctas i {
    color: #ffffff;
  }
}

.wrapper:not(.search-active) .header:not(.header--menu-open):not(.header--submenu-open):not(.header--scrolled) {
  background-color: transparent;
}
.wrapper:not(.search-active) .header:not(.header--menu-open):not(.header--submenu-open):not(.header--scrolled) .header__hamburger-button::before {
  background-color: #ffffff;
}
.wrapper:not(.search-active) .header:not(.header--menu-open):not(.header--submenu-open):not(.header--scrolled) .header__hamburger-button::after {
  border-color: #ffffff;
}
.wrapper:not(.search-active) .header:not(.header--menu-open):not(.header--submenu-open):not(.header--scrolled).header--menu-open .header__hamburger-button::after {
  border-top-color: transparent;
}
.wrapper:not(.search-active) .header:not(.header--menu-open):not(.header--submenu-open):not(.header--scrolled) .mini-cart__link {
  border-color: #ffffff;
}
.wrapper:not(.search-active) .header:not(.header--menu-open):not(.header--submenu-open):not(.header--scrolled) .menu-categories > li > a,
.wrapper:not(.search-active) .header:not(.header--menu-open):not(.header--submenu-open):not(.header--scrolled) .menu-categories > li .navigation-custom-link,
.wrapper:not(.search-active) .header:not(.header--menu-open):not(.header--submenu-open):not(.header--scrolled) button.search-toggle i.fa:before,
.wrapper:not(.search-active) .header:not(.header--menu-open):not(.header--submenu-open):not(.header--scrolled) li.help i.fa:before,
.wrapper:not(.search-active) .header:not(.header--menu-open):not(.header--submenu-open):not(.header--scrolled) .user-info__icon,
.wrapper:not(.search-active) .header:not(.header--menu-open):not(.header--submenu-open):not(.header--scrolled) a.mini-cart-link i.fa:before,
.wrapper:not(.search-active) .header:not(.header--menu-open):not(.header--submenu-open):not(.header--scrolled) .menu-toggle,
.wrapper:not(.search-active) .header:not(.header--menu-open):not(.header--submenu-open):not(.header--scrolled) .search-toggle,
.wrapper:not(.search-active) .header:not(.header--menu-open):not(.header--submenu-open):not(.header--scrolled) .header__logo,
.wrapper:not(.search-active) .header:not(.header--menu-open):not(.header--submenu-open):not(.header--scrolled) .main-nav__link,
.wrapper:not(.search-active) .header:not(.header--menu-open):not(.header--submenu-open):not(.header--scrolled) .mini-cart__link,
.wrapper:not(.search-active) .header:not(.header--menu-open):not(.header--submenu-open):not(.header--scrolled) .fa-user:before {
  color: #ffffff;
}
.wrapper:not(.search-active) .header:not(.header--menu-open):not(.header--submenu-open):not(.header--scrolled) .header__content {
  background-color: transparent;
}

.video-banner {
  position: relative;
}
@media screen and (min-width: 1180px) {
  .video-banner .button {
    min-width: 215px;
  }
}
.video-banner .button.dark {
  border-color: #333133;
}

.video-banner__media {
  background-color: #959498;
  height: 100%;
  min-height: calc(100vh - 38px);
  overflow: hidden;
  position: relative;
}
@media screen and (min-width: 1180px) {
  .video-banner__media {
    margin: 0 -48px;
  }
}

.video-banner__media-link {
  cursor: pointer;
}

.video-banner__image,
.video-banner__video,
.video-banner__cld-video,
.video-banner__cld-video.cld-video-player.cld-fluid {
  aspect-ratio: 16/9;
  min-height: 100vh;
  min-width: 100vw;
  left: 50%;
  pointer-events: none;
  position: absolute;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 100%;
}
@media screen and (min-width: 1180px) {
  .video-banner__image,
  .video-banner__video,
  .video-banner__cld-video,
  .video-banner__cld-video.cld-video-player.cld-fluid {
    height: 120vh;
  }
}

.video-banner__video,
.video-banner__cld-video,
.video-banner__cld-video.cld-video-player.cld-fluid {
  width: 220vh;
}

.video-banner__cld-video,
.video-banner__cld-video.cld-video-player.cld-fluid {
  padding: 0;
  max-width: none;
}

.video-banner__video--desktop {
  display: none;
}
@media screen and (min-width: 1180px) {
  .video-banner__video--desktop {
    display: block;
  }
}

.video-banner__video--mobile {
  display: block;
}

.video-banner__image img {
  display: block;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
}

.video-banner__video,
.video-banner__cld-video {
  z-index: 2;
}

.video-banner__text-content {
  --desktop-position-left: 0;
  --desktop-position-top: 20%;
  --mobile-position-top: 25px;
  position: absolute;
  z-index: 2;
  margin: 0 auto;
  max-width: 1220px;
  padding: 0 20px;
}
@media screen and (max-width: 1180px) {
  .video-banner__text-content {
    top: var(--mobile-position-top);
  }
}
@media screen and (min-width: 1180px) {
  .video-banner__text-content {
    top: var(--desktop-position-top);
    left: calc(50% + var(--desktop-position-left));
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: 100%;
  }
}

.video-banner__text-content--fullwidth {
  max-width: 100%;
}

.video-banner__text-content-inner--left {
  text-align: left;
}

.video-banner__text-content-inner--center {
  text-align: center;
  margin: 0 auto;
}
.video-banner__text-content-inner--center p {
  margin-left: auto;
  margin-right: auto;
}

.video-banner__text-content-inner--right {
  margin-left: auto;
  text-align: right;
}
.video-banner__text-content-inner--right p {
  margin-left: inherit;
}

@media screen and (min-width: 1180px) {
  .video-banner__text-content-inner--left-desktop {
    text-align: left;
    margin: 0;
  }
  .video-banner__text-content-inner--left-desktop p {
    margin-left: 0;
  }
}

@media screen and (min-width: 1180px) {
  .video-banner__text-content-inner--center-desktop {
    text-align: center;
    margin: 0 auto;
  }
  .video-banner__text-content-inner--center-desktop p {
    margin-left: auto;
    margin-right: auto;
  }
}

@media screen and (min-width: 1180px) {
  .video-banner__text-content-inner--right-desktop {
    text-align: right;
    margin: 0 0 0 auto;
  }
  .video-banner__text-content-inner--right-desktop p {
    margin: 0 0 0 auto;
  }
}

.video-banner__subheading {
  color: #ffffff;
  font-size: 24px;
  font-weight: bold;
  line-height: 32px;
  margin: 0 0 10px;
}
.video-banner__subheading span {
  background-color: #ffffff;
  color: #333133;
  white-space: nowrap;
  display: inline-block;
  line-height: 25px;
  padding: 6px 12px;
  border-radius: 16px;
  letter-spacing: unset !important;
}
@media screen and (min-width: 1180px) {
  .video-banner__subheading {
    margin-bottom: 15px;
  }
}

.video-banner__heading {
  --social-color: #E2967F;
  --mobile-font-size: 48px;
  --desktop-font-size: 64px;
  --mobile-line-height: 44px;
  --desktop-line-height: 64px;
  color: #ffffff;
  font-size: var(--mobile-font-size);
  line-height: var(--mobile-line-height);
  margin-bottom: 10px;
}
.video-banner__heading span {
  display: inline-block;
  position: relative;
}
.video-banner__heading span::before {
  background-color: var(--social-color);
  bottom: 23%;
  content: "";
  left: -0.14em;
  position: absolute;
  right: -0.14em;
  top: 25%;
  z-index: -1;
}
@media screen and (min-width: 1180px) {
  .video-banner__heading {
    font-size: var(--desktop-font-size);
    line-height: var(--desktop-line-height);
    margin-bottom: 27px;
  }
}
@media screen and (min-width: 1180px) and (max-height: 720px) {
  .video-banner__heading {
    line-height: 1;
  }
}

.video-banner__text {
  color: #ffffff;
  font-size: 16px;
  line-height: 1.128;
  margin: 10px 0 20px;
  max-width: 280px;
}
@media screen and (min-width: 1180px) {
  .video-banner__text {
    font-size: 32px;
    margin-bottom: 50px;
    max-width: 480px;
  }
}

.nav-account-layover__item a {
  color: #333133 !important;
}

.quick-ctas-carousel {
  z-index: 3;
}

.video-banner--light .video-banner__heading,
.video-banner--dark .video-banner__heading {
  --mobile-font-size: 14vw;
  --desktop-font-size: 110px;
  --mobile-line-height: 1.33;
  --desktop-line-height: 1.25;
  line-height: var(--mobile-line-height);
}
@supports (mix-blend-mode: screen) {
  .video-banner--light .video-banner__video,
  .video-banner--light .video-banner__text-content,
  .video-banner--dark .video-banner__video,
  .video-banner--dark .video-banner__text-content {
    z-index: auto;
  }
  .video-banner--light .video-banner__heading,
  .video-banner--dark .video-banner__heading {
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, transparent), color-stop(11%, transparent), color-stop(11%, #ffffff), color-stop(89%, #ffffff), color-stop(89%, transparent));
    background-image: linear-gradient(to bottom, transparent 0, transparent 11%, #ffffff 11%, #ffffff 89%, transparent 89%);
    -webkit-box-shadow: 20px 0 0 calc(var(--mobile-font-size) / -6.1) #ffffff, -20px 0 0 calc(var(--mobile-font-size) / -6.1) #ffffff;
            box-shadow: 20px 0 0 calc(var(--mobile-font-size) / -6.1) #ffffff, -20px 0 0 calc(var(--mobile-font-size) / -6.1) #ffffff;
    color: #000000 !important;
    display: inline;
    font-size: var(--mobile-font-size);
    mix-blend-mode: screen;
    padding: 0;
    position: relative;
    word-break: break-word;
  }
  @media screen and (min-width: 1180px) {
    .video-banner--light .video-banner__heading,
    .video-banner--dark .video-banner__heading {
      -webkit-box-shadow: 36px 0 0 calc(var(--desktop-font-size) / -6.1) #ffffff, -36px 0 0 calc(var(--desktop-font-size) / -6.1) #ffffff;
              box-shadow: 36px 0 0 calc(var(--desktop-font-size) / -6.1) #ffffff, -36px 0 0 calc(var(--desktop-font-size) / -6.1) #ffffff;
      font-size: var(--desktop-font-size);
      line-height: var(--desktop-line-height);
    }
    .video-banner--light .video-banner__text-content,
    .video-banner--dark .video-banner__text-content {
      margin-left: -50%;
      -webkit-transform: none;
              transform: none;
    }
  }
}

@supports (mix-blend-mode: multiply) {
  .video-banner--dark .video-banner__heading {
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, transparent), color-stop(11%, transparent), color-stop(11%, #333133), color-stop(89%, #333133), color-stop(89%, transparent));
    background-image: linear-gradient(to bottom, transparent 0, transparent 11%, #333133 11%, #333133 89%, transparent 89%);
    -webkit-box-shadow: 20px 0 0 calc(var(--mobile-font-size) / -6.1) #333133, -20px 0 0 calc(var(--mobile-font-size) / -6.1) #333133;
            box-shadow: 20px 0 0 calc(var(--mobile-font-size) / -6.1) #333133, -20px 0 0 calc(var(--mobile-font-size) / -6.1) #333133;
    color: #ffffff !important;
    mix-blend-mode: multiply;
  }
  @media screen and (min-width: 1180px) {
    .video-banner--dark .video-banner__heading {
      -webkit-box-shadow: 36px 0 0 calc(var(--desktop-font-size) / -6.1) #333133, -36px 0 0 calc(var(--desktop-font-size) / -6.1) #333133;
              box-shadow: 36px 0 0 calc(var(--desktop-font-size) / -6.1) #333133, -36px 0 0 calc(var(--desktop-font-size) / -6.1) #333133;
    }
  }
}

#vwo-MyCustomTrustbadge {
  position: absolute !important;
}
