/*!***************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./sfra-webpack-builder/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[0].use[1]!./sfra-webpack-builder/node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./sfra-webpack-builder/node_modules/css-unicode-loader/index.js!./sfra-webpack-builder/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[4]!./shark-ninja/cartridges/app_custom_sharkninja_core/cartridge/client/default/scss/experience/components/commerceAssets/singlePromoBanner.scss ***!
  \***************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/* stylelint-disable */
/* stylelint-enable */
/***************************** Category Colors *****************************/
/***************************** Fonts *****************************/
/***************************** Border *****************************/
/***************************** Background *****************************/
/* stylelint-disable */
/* stylelint-enable */
#maincontent .container .promo-banner-container {
  position: relative;
}
#maincontent .container .promo-banner-container.full-width-container {
  width: 100vw;
  position: relative;
  margin-left: -50vw;
  margin-bottom: 2rem;
  left: 50%;
}
@media (min-width: 1200px) {
  #maincontent .container .promo-banner-container.full-width-container {
    margin-bottom: 4rem;
  }
}
@media (max-width: 1199.98px) {
  #maincontent .container .promo-banner-container:not(.full-width-container) .overlay-container .text-container {
    padding: 0.75rem;
  }
}
#maincontent .container .promo-banner-container .image-container .background-figure.background-image-component {
  margin: 0;
}
#maincontent .container .promo-banner-container .image-container .background-figure.background-image-component img {
  width: 100%;
  height: 100%;
}
#maincontent .container .promo-banner-container .overlay-container {
  padding: 0 5rem;
  -webkit-column-gap: 3rem;
     -moz-column-gap: 3rem;
          column-gap: 3rem;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow-x: clip;
}
@media (max-width: 1199.98px) {
  #maincontent .container .promo-banner-container .overlay-container {
    padding: 0;
    gap: 0;
  }
}
#maincontent .container .promo-banner-container .overlay-container .overlay-figure.overlay-image-component {
  margin-bottom: 0;
  height: 120%;
}
@media (max-width: 1199.98px) {
  #maincontent .container .promo-banner-container .overlay-container .overlay-figure.overlay-image-component {
    width: 25%;
  }
}
#maincontent .container .promo-banner-container .overlay-container .overlay-figure.overlay-image-component img {
  height: 100%;
}
@media (max-width: 1199.98px) {
  #maincontent .container .promo-banner-container .overlay-container .overlay-figure.overlay-image-component img {
    width: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: right;
       object-position: right;
  }
}
#maincontent .container .promo-banner-container .overlay-container .text-container {
  -webkit-column-gap: 3rem;
     -moz-column-gap: 3rem;
          column-gap: 3rem;
  height: 100%;
  width: 70%;
}
@media (max-width: 1199.98px) {
  #maincontent .container .promo-banner-container .overlay-container .text-container {
    padding: 1.25rem;
    padding-left: 0;
    -ms-flex-pack: distribute;
        justify-content: space-around;
  }
  #maincontent .container .promo-banner-container .overlay-container .text-container a.shop-now-link {
    text-decoration: underline;
    color: var(--text-theme-color);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    font-family: "Plus Jakarta Sans", arial, helvetica, serif;
    font-size: 0.75rem;
    font-weight: 400;
    font-style: normal;
    line-height: 1.125rem;
  }
  #maincontent .container .promo-banner-container .overlay-container .text-container a.shop-now-link.arrow-white::after {
    content: "";
    display: inline-block;
    width: 1.25rem;
    height: 1.25rem;
    background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE2Ljg0MjUgOS40MjkwNUMxNi45OTU1IDkuNTc4NzkgMTcuMDgzNCA5Ljc4MDYxIDE3LjA4MzQgOS45OTU0NUMxNy4wODM0IDEwLjIxMDMgMTYuOTk1NSAxMC40MTIxIDE2Ljg0MjUgMTAuNTYxOUwxMS4xMTMzIDE2LjAzMDZDMTAuODAwOCAxNi4zMzAxIDEwLjMwNiAxNi4zMTcxIDEwLjAwOTggMTYuMDA0NkM5LjcxMzU4IDE1LjY5MjEgOS43MjMzNSAxNS4xOTczIDEwLjAzNTggMTQuOTAxMUwxNC4zNTIzIDEwLjc3NjdMMy4yODEyOSAxMC43NzY3QzIuODQ4MzUgMTAuNzc2NyAyLjUwMDA0IDEwLjQyODQgMi41MDAwNCA5Ljk5NTQ1QzIuNTAwMDQgOS41NjI1MSAyLjg0ODM1IDkuMjE0MiAzLjI4MTI5IDkuMjE0MkwxNC4zNTIzIDkuMjE0MkwxMC4wMzI2IDUuMDkzMTFDOS43MjAwOSA0Ljc5MzYzIDkuNzEwMzMgNC4zMDIwOSAxMC4wMDY2IDMuOTg5NTlDMTAuMzAyOCAzLjY3NzA5IDEwLjc5NzYgMy42NjczMyAxMS4xMTAxIDMuOTYzNTVMMTYuODM5MiA5LjQzMjNMMTYuODQyNSA5LjQyOTA1WiIgZmlsbD0id2hpdGUiLz4KPC9zdmc+Cg==") no-repeat;
    margin-left: 0.25rem;
  }
  #maincontent .container .promo-banner-container .overlay-container .text-container a.shop-now-link.arrow-black::after {
    content: "";
    display: inline-block;
    width: 1.25rem;
    height: 1.25rem;
    background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9Imljb24tMjAiPgo8cGF0aCBpZD0iUHJpbWFyeSIgZD0iTTE2Ljg0MjYgOS40MjkyOUMxNi45OTU2IDkuNTc5MDMgMTcuMDgzNSA5Ljc4MDg1IDE3LjA4MzUgOS45OTU3QzE3LjA4MzUgMTAuMjEwNSAxNi45OTU2IDEwLjQxMjQgMTYuODQyNiAxMC41NjIxTDExLjExMzQgMTYuMDMwOUMxMC44MDA5IDE2LjMzMDMgMTAuMzA2MiAxNi4zMTczIDEwLjAwOTkgMTYuMDA0OEM5LjcxMzcgMTUuNjkyMyA5LjcyMzQ3IDE1LjE5NzUgMTAuMDM2IDE0LjkwMTNMMTQuMzUyNCAxMC43NzY5TDMuMjgxNDEgMTAuNzc2OUMyLjg0ODQ3IDEwLjc3NjkgMi41MDAxNiAxMC40Mjg2IDIuNTAwMTYgOS45OTU3QzIuNTAwMTYgOS41NjI3NSAyLjg0ODQ3IDkuMjE0NDUgMy4yODE0MSA5LjIxNDQ1TDE0LjM1MjQgOS4yMTQ0NUwxMC4wMzI3IDUuMDkzMzVDOS43MjAyMiA0Ljc5Mzg3IDkuNzEwNDUgNC4zMDIzNCAxMC4wMDY3IDMuOTg5ODRDMTAuMzAyOSAzLjY3NzM0IDEwLjc5NzcgMy42Njc1NyAxMS4xMTAyIDMuOTYzOEwxNi44Mzk0IDkuNDMyNTVMMTYuODQyNiA5LjQyOTI5WiIgZmlsbD0iYmxhY2siLz4KPC9nPgo8L3N2Zz4K") no-repeat;
    margin-left: 0.25rem;
  }
}
#maincontent .container .promo-banner-container .overlay-container .text-container .text-typography,
#maincontent .container .promo-banner-container .overlay-container .text-container .text-typography > * {
  margin: 0;
  padding: 0;
  color: var(--text-theme-color) !important;
  font-family: "DM Sans", arial, helvetica, serif;
  font-size: 1.375rem;
  font-weight: 600;
  font-style: normal;
  line-height: 1.75rem;
}
@media (max-width: 1199.98px) {
  #maincontent .container .promo-banner-container .overlay-container .text-container .text-typography,
  #maincontent .container .promo-banner-container .overlay-container .text-container .text-typography > * {
    text-align: center;
    margin-right: 0;
  }
}
@media (max-width: 767.98px) {
  #maincontent .container .promo-banner-container .overlay-container .text-container .text-typography,
  #maincontent .container .promo-banner-container .overlay-container .text-container .text-typography > * {
    font-family: "Plus Jakarta Sans", arial, helvetica, serif;
    font-size: 1rem;
    font-weight: 700;
    font-style: normal;
    line-height: 1.25rem;
  }
}
#maincontent .container .promo-banner-container .overlay-container .text-container .text-typography span,
#maincontent .container .promo-banner-container .overlay-container .text-container .text-typography > * span {
  text-decoration: underline;
}
#maincontent .container .promo-banner-container .overlay-container .text-container .btn {
  min-width: 10.625rem;
}

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