/*Spray Foundation Quiz*/
.quiz-footer-padding {
  padding-left: 0 !important;
  padding-bottom: 0 !important;
}

.spray-airbrush-try-before-you-buy-main {
  background: #EDD2C6;
  margin: 15px;
  position: absolute;
  bottom: 0;
  padding: 15px;
  width: 95%;
}

.btn.btn-airbrush-quiz {
  background: #871057 !important;
  color: #fff !important;
  font-family: "montserratsemibold";
  width: 100%;
  height: 60px;
  margin: 0.5rem 0;
  border-radius: 5px !important;
}

.btn-airbrush-quiz:hover {
  color: #fff;
}

.spray-airbrush-try-before-you-buy-small-title {
  font-family: montserratsemibold;
  font-size: 1.15rem;
  margin-bottom: 5px;
  line-height: 1.15rem;
  margin-top: 0.25rem;
}

.spray-airbrush-try-before-you-buy-highlight-text {
  font-family: montserratsemibold;
  font-size: 2rem;
  line-height: 2.25rem;
  letter-spacing: 0.03rem;
}

.title-skin-type-choose {
  text-align: center;
  font-family: "montserratsemibold";
  font-size: 1.35rem;
}

.skin-type-shade-select-card {
  text-align: center;
  border: 1px solid #ddd;
  max-width: 500px;
  background: #fff;
  color: #553627;
  margin: 0 auto;
  padding: 5px 0;
  margin-bottom: 20px;
  -webkit-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2);
          box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2);
  cursor: pointer;
  height: 4rem !important;
  -ms-flex-line-pack: center !important;
      align-content: center !important;
}

.quiz-product-pdp {
  color: #fff !important;
}

.answer-selected {
  background: #fca742;
  color: #553627 !important;
  cursor: pointer;
}

.template-2 .answer-selected {
  background: transparent;
  color: #fff !important;
  cursor: pointer;
}

.template-3 .answer-section,
.template-4 .answer-section {
  text-align: center;
}
.template-3 .quiz-d-flex-image-cart,
.template-3 .d-flex.justify-content-center,
.template-4 .quiz-d-flex-image-cart,
.template-4 .d-flex.justify-content-center {
  display: inline-block !important;
  width: 70%;
}
@media only screen and (max-width: 767px) {
  .template-3 .quiz-d-flex-image-cart,
  .template-3 .d-flex.justify-content-center,
  .template-4 .quiz-d-flex-image-cart,
  .template-4 .d-flex.justify-content-center {
    margin: 0 !important;
    width: 100%;
  }
}
.template-3 .quiz-d-flex-image-cart .quiz-card-section.answer-type,
.template-3 .d-flex.justify-content-center .quiz-card-section.answer-type,
.template-4 .quiz-d-flex-image-cart .quiz-card-section.answer-type,
.template-4 .d-flex.justify-content-center .quiz-card-section.answer-type {
  display: inline-block;
  width: 20%;
}
.template-3 .quiz-d-flex-image-cart .quiz-card-section.answer-type img,
.template-3 .d-flex.justify-content-center .quiz-card-section.answer-type img,
.template-4 .quiz-d-flex-image-cart .quiz-card-section.answer-type img,
.template-4 .d-flex.justify-content-center .quiz-card-section.answer-type img {
  width: 100%;
}
@media only screen and (max-width: 767px) {
  .template-3 .quiz-d-flex-image-cart .quiz-card-section.answer-type,
  .template-3 .d-flex.justify-content-center .quiz-card-section.answer-type,
  .template-4 .quiz-d-flex-image-cart .quiz-card-section.answer-type,
  .template-4 .d-flex.justify-content-center .quiz-card-section.answer-type {
    width: 46%;
  }
  .template-3 .quiz-d-flex-image-cart .quiz-card-section.answer-type img,
  .template-3 .d-flex.justify-content-center .quiz-card-section.answer-type img,
  .template-4 .quiz-d-flex-image-cart .quiz-card-section.answer-type img,
  .template-4 .d-flex.justify-content-center .quiz-card-section.answer-type img {
    max-width: 150px;
  }
}
.template-3 .answer-selected,
.template-4 .answer-selected {
  background: none;
}
.template-3 .answer-selected .ans-title-spray-quiz,
.template-4 .answer-selected .ans-title-spray-quiz {
  background: #fca742;
  color: #553627 !important;
  margin: 10px auto 0;
  padding: 5px 15px;
}
.template-3 .answer-selected .quiz-image,
.template-4 .answer-selected .quiz-image {
  border: 2px solid #fca742;
  border-radius: 100%;
  border-width: 4px;
}

@media only screen and (max-width: 767px) {
  .sys-plus-main .pdp-plus-mob-fixed,
  .system-details-plus-main .pdp-plus-mob-fixed {
    background: #fff;
    margin: 0;
  }
}
.answer-selected {
  border-radius: 2px;
}

.skin-type-shade-select-card-title {
  font-family: "montserratsemibold";
  font-size: 1.25rem !important;
}

.skin-type-shade-select-card-sub-title {
  font-family: "montserratmedium";
  font-size: 0.85rem;
}

.closest-skin-tone {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.closest-skin-tone .closest-skin-tone-name {
  font-family: "montserratsemibold";
  margin: 7px 0;
  text-align: center;
}

.title-closest-skin-tone {
  font-family: "montserratbold";
  text-align: center;
  font-size: 1.15rem;
  margin-bottom: 2rem;
}

.bg-almost-there-screen {
  /* background: #a8867e; */
}

.almost-there-title {
  font-family: "montserratsemibold";
  text-align: center;
  color: #553627;
  font-size: 3rem;
  padding: 0 15px;
}

.almost-there-sub-text {
  color: #553627;
  text-align: center;
  font-family: "montserratmedium";
  font-size: 1.35rem;
  padding: 0 15px;
  line-height: 1.25;
}

.w-70-form-width {
  width: 70%;
}

.bg-almost-there-screen .btn-no-thanks {
  color: #7D2553;
  text-decoration: underline !important;
  font-size: 1rem;
  margin-bottom: 0.5rem;
  text-shadow: none !important;
  font-family: "montserratsemibold";
  opacity: unset;
}

.spray-foundation-quiz-main .ans-title-spray-quiz {
  padding: 5px 0;
  text-align: center;
  font-size: 0.7rem !important;
  color: #553627;
  font-family: "montserratmedium";
}

.answer-selected .ans-title-spray-quiz {
  color: #fff;
}

.answer-selected-spray-quiz {
  background-color: #fca742;
  color: #553627;
  padding: 1px;
}

.spray-foundation-quiz-main .btn-magic {
  background: transparent !important;
  -webkit-animation: none !important;
          animation: none !important;
  -o-border-image: unset !important;
     border-image: unset !important;
  border-style: unset !important;
  border-width: unset !important;
  padding: 0 !important;
  min-height: auto !important;
}

.spray-foundation-quiz-main .quiz-backbtn {
  color: #fca742;
  font-weight: 700;
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  font-family: montserratsemibold !important;
  margin: 1rem auto;
}

.spray-foundation-quiz-main .question-text {
  color: #553627;
  font-size: 1.4rem;
  font-family: "montserratmedium";
  line-height: 1.6rem;
  margin-top: -2.4rem;
}

.spray-foundation-quiz-main .question-text-title {
  color: #553627;
  font-size: 1.2rem;
  font-family: "montserratmedium";
  line-height: 1.6rem;
}

.spray-foundation-quiz-main .card-body-spray-quiz {
  margin: 8px 0px 0px 0px;
  border: none;
}

.digit-quiz-3 {
  font-family: LibreBodoni;
  font-weight: 600;
}

.question-text {
  font-family: "montserratmedium" !important;
}

.question-text-title {
  font-family: "montserratmedium" !important;
}

.question-text-center {
  text-align: center !important;
  color: #832f5b;
  font-size: 1.5rem;
  font-family: "montserratmedium" !important;
}

.bg-almost-there-screen input {
  width: 100%;
  font-size: 1.25rem;
  color: #553627 !important;
  padding-left: 8px;
}

.bg-almost-there-screen input::-webkit-input-placeholder {
  color: #553627;
}

.bg-almost-there-screen input::-moz-placeholder {
  color: #553627;
}

.bg-almost-there-screen input:-ms-input-placeholder {
  color: #553627;
}

.bg-almost-there-screen input::-ms-input-placeholder {
  color: #553627;
}

.bg-almost-there-screen input::placeholder {
  color: #553627;
}

/*progress steps*/
.coverage-craving-sec-main .wrapper {
  max-width: 1170px;
  margin: 0 auto;
}

.coverage-craving-sec-main .steps {
  counter-reset: counter;
  list-style: none;
  padding-left: 0;
  margin-bottom: 0;
  /* margin-left: 5rem; */
}

.coverage-craving-sec-main .steps li {
  margin: 10px 0;
}

.coverage-craving-sec-main .steps li:before {
  content: "";
  counter-increment: counter;
  float: left;
  margin-right: -50px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: inline-block;
  width: 28px;
  height: 28px;
  border-radius: 100%;
  color: #FFF;
  text-align: center;
  font-size: 18px;
  line-height: 18px;
  background-color: #fff;
  border: 1px solid #707070 !important;
  margin-left: 15px;
}

.template-2 .coverage-craving-sec-main .steps li.answer-selected:before {
  border: 1px solid #7d2553 !important;
  -webkit-box-shadow: inset 0 0 0 5px #7d2553;
          box-shadow: inset 0 0 0 5px #7d2553;
}

.template-2 .coverage-craving-sec-main .steps li.answer-selected ~ li:before {
  background-color: #fff;
}

.coverage-craving-sec-main .steps li a,
.steps li span {
  text-decoration: none;
  display: inline-block;
  padding-left: 60px;
  color: #333;
  font-size: 16px;
  line-height: 16px;
  padding-top: 17px;
  padding-bottom: 17px;
}

.coverage-craving-sec-main .steps li a:hover,
.steps li a:active,
.steps li a:focus {
  color: #4aa3df;
}

/*progress steps*/
/*progress steps mob*/
.spray-airbrush-try-before-you-buy-main {
  width: 100%;
}

.spray-airbrush-try-before-you-buy-main {
  position: relative;
  margin: 0;
  padding: 20px 25px;
}

.coverage-craving-sec-main .steps {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.coverage-craving-sec-main .steps li {
  width: 20%;
  position: relative;
}

.coverage-craving-sec-main .steps li:before {
  float: none;
  margin-right: 0;
}

.coverage-craving-sec-main .steps li:after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 15px;
  left: 45px;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  /* z-index: -1; */
  height: 3px;
  width: calc(100% - 20px);
  border-radius: 0;
  background-color: #C9C9C9;
}

.coverage-craving-sec-main .steps li:last-of-type:after {
  display: none;
}

.coverage-craving-sec-main .steps li.active:after {
  background-color: #bdc3c7;
}

.coverage-craving-sec-main .steps li.active ~ li:after {
  background-color: #bdc3c7;
}

.coverage-craving-sec-main .steps li span,
.steps li span {
  display: block;
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 5px;
  font-size: 0.75rem;
  font-family: "montserratmedium";
  color: #7D2553;
  text-align: left;
}

.coverage-craving-sec-main .steps li a:hover {
  color: #000;
}

/*progress steps mob*/
.result-of-selected-shade-top-stripe {
  background: #fca742;
  color: #553627;
  font-family: "montserratmedium";
  text-align: center;
  padding: 1rem 0;
  font-size: 1rem;
}

.result-of-selected-shade-top-stripe .result-of-shade {
  font-family: "montserratmedium";
  text-transform: uppercase;
}

.result-of-selected-shade-bottom-title {
  text-align: center;
  color: #871057;
  font-family: "montserratbold";
  font-size: 1rem;
}

.result-of-selected-shade-bottom-sub-title {
  text-align: center;
  color: #871057;
  font-family: "montserratmedium";
  font-size: 1rem;
}

/*Spray foundation Quiz Vivek*/
.quiz-progress-bar {
  background-color: #553627;
  border: 0.1875em solid #553627;
}

.quiz-pagination {
  color: #553627;
  font-size: 1rem;
  font-family: montserratbold;
}

.quiz-container-footer {
  /* display: flex; */
  width: 90% !important;
  -ms-flex-pack: justify;
  -webkit-box-pack: justify;
          justify-content: space-between;
  margin: 0 auto;
  padding-bottom: 1rem;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.quiz-d-flex-image-cart {
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-pack: center !important;
      -ms-flex-pack: center !important;
          justify-content: center !important;
}

@media only screen and (max-width: 395px) {
  .quiz-footer-padding {
    padding-left: 0 !important;
    padding-bottom: 0 !important;
    margin-left: -0.3rem !important;
    margin-right: -0.1rem !important;
  }
}
@media only screen and (max-width: 320px) {
  .quiz-footer-padding {
    padding-left: 0 !important;
    padding-bottom: 0 !important;
    margin-left: -0.6rem !important;
    margin-right: -0.3rem !important;
  }
}
/*Spray foundation Quiz*/
@media only screen and (max-width: 767px) {
  .template-2 .question-text,
  .template-3 .question-text {
    margin-left: 0% !important;
    margin-right: 0% !important;
    margin-bottom: 5%;
  }
  .template-3 .text-center.question-text {
    text-align: center !important;
  }
  .spray-airbrush-try-before-you-buy-main {
    width: 100%;
  }
  .spray-airbrush-try-before-you-buy-small-title {
    font-size: 1rem;
  }
  .spray-airbrush-try-before-you-buy-small-title {
    font-size: 1rem;
  }
  .spray-airbrush-try-before-you-buy-highlight-text {
    font-size: 1.5rem;
    line-height: 1.45rem;
    margin-bottom: 10px;
  }
  .w-70-form-width {
    width: 95%;
  }
  .almost-there-title {
    font-size: 2rem;
    text-align: left;
  }
  .almost-there-sub-text {
    font-size: 1.2rem;
    text-align: left;
  }
  .coverage-craving-sec-main .steps li a,
  .steps li span {
    text-align: center;
  }
  .coverage-craving-sec-main .steps {
    margin-left: 15px;
  }
  .quiz-container-footer {
    width: 100% !important;
  }
  .spray-foundation-quiz-home-header {
    margin-bottom: 3rem !important;
    margin-top: 3rem !important;
  }
}
.master-footer {
  display: none;
}

.minicart {
  display: none !important;
}

.header-icon {
  display: none !important;
}

.header-search-main {
  display: none !important;
}

.call-now-home-show {
  display: none !important;
}

.header .mobile-logo-header-main {
  left: calc(50% + 30px);
  position: absolute;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  margin-top: 1.5rem !important;
}

/* new added code for breeze tbyb */
.btn.btn-breeze-quiz {
  background: #871057 !important;
  color: #fff !important;
  font-family: "montserratsemibold";
  width: 100%;
  height: 60px;
  margin: 2.5rem 0;
  border-radius: 5px !important;
  line-height: 15px;
}

.btn-breeze-quiz:hover {
  color: #fff;
}

.quizbreezetbybtext {
  font-size: 22px;
}

.quizbreezetbybsubtitle {
  font-size: 13px;
}

@media only screen and (max-width: 430px) {
  .quizbreezetbybtext {
    font-size: 18px;
  }
  .template-3 .answer-section {
    margin-right: 0 !important;
    padding-left: 3px !important;
  }
}
@media only screen and (max-width: 380px) {
  .quizbreezetbybtext {
    font-size: 15px;
  }
  .quizbreezetbybsubtitle {
    font-size: 11px;
  }
}
@media only screen and (min-width: 1024px) and (max-width: 1366px) {
  .quizbreezetbybtext {
    font-size: 13px;
  }
  .quizbreezetbybsubtitle {
    font-size: 9px;
  }
}
@media only screen and (max-width: 767px) {
  .search.section-search {
    margin-top: 58px;
  }
  .site-header {
    display: none !important;
  }
  .logo-page-hdr-fixed {
    top: 0px !important;
  }
  .quiz-container {
    margin-top: -3rem !important;
  }
  .no-padding.content-min-height {
    margin-top: -3rem !important;
  }
}
.site-header {
  display: none !important;
}

.quiz-micro-copy {
  text-align: center !important;
  font-style: italic !important;
  margin-top: 20px !important;
  width: 100% !important;
}

@media (max-width: 360px) and (max-height: 740px) {
  .spray-foundation-quiz-main .question-text-title {
    font-size: 1rem !important;
  }
}
@media (max-width: 375px) and (max-height: 667px) {
  .spray-foundation-quiz-main .question-text-title {
    font-size: 1rem !important;
  }
}
