.color-variant-hdr-button-wrap{display:flex;justify-content:space-between}#color-quiz-modal{z-index:80000}.color-quiz-modal{background-color:#23232780;color:#232327;z-index:800001}.color-quiz-modal .mm-modal-header{position:relative}.color-quiz-modal .modal__card{background-color:#fff}.color-quiz-modal__table-centered{text-align:center}.color-quiz-modal .modal__close-trigger{position:absolute;right:1.6rem;top:.8rem;background-color:transparent;min-width:fit-content;color:#232327;padding:0;z-index:6}.color-quiz-modal .modal__close-trigger:hover{background-color:#f6f4f3}@media screen and (max-width: 989px){.color-quiz-modal .modal__close-trigger{top:.4rem;right:1.4rem}}.color-quiz-modal .modal__card{max-width:900px;width:900px;padding:0;margin-left:auto;margin-right:auto}@media screen and (max-width: 989px){.color-quiz-modal .modal__card{width:100%;max-width:100%}}.color-quiz-modal .modal__title{text-align:center}@media screen and (max-width: 989px){.color-quiz-modal .modal__title{font-size:1.6rem;padding-left:3rem;padding-right:3rem}}.color-quiz-modal .modal__header{padding-bottom:0;background-color:#fff}@media screen and (max-width: 989px){.color-quiz-modal .modal__header{padding:1.8rem 1.2rem 1.2rem}}@media screen and (max-width: 989px){.color-quiz-modal .modal__card{height:100vh;max-height:100vh}.color-quiz-modal .modal__body{padding-left:1.5em;padding-right:1.5em}.color-quiz-modal h5{margin-bottom:0}}.color-quiz-modal .modal__contents{position:relative;width:100%;height:100%}.quiz-main{width:100%;padding-top:4.8rem}@media screen and (max-width: 1500px){.quiz-main{padding:1rem 0 0}}.cq-progress-bar,.cq-progress-bar-label{width:282px;max-width:90%;margin:1em auto 0;position:relative}.cq-progress-bar-label{margin-top:2.5rem}.cq-progress-bar:before{content:"";position:absolute;top:0;left:0;height:5px;width:33.33%;background-color:#232326;z-index:1}.cq-progress-bar:after{content:"";position:absolute;top:0;left:0;height:5px;width:100%;background-color:#d9d9d9;z-index:0}.cq-progress-bar-circle{position:absolute;width:10px;height:10px;border:#232326 solid 2px;border-radius:50%;background-color:#fff;z-index:2;top:-2.5px;left:calc(33% - 5px)}.cq-step-2 .cq-progress-bar:before{width:66.66%}.cq-step-2 .cq-progress-bar .cq-progress-bar-circle{left:calc(66% - 5px)}.cq-step-1-label,.cq-step-2-label{display:none;text-align:center}.cq-step-1 .cq-step-1-label{display:block;transform:translate(-16.66%)}.cq-step-2 .cq-step-2-label{display:block;transform:translate(16.66%)}.cq-quiz-wrap-inner{max-width:100%;margin:0 auto 3rem}@media screen and (max-width: 989px){.cq-quiz-wrap-inner{margin-top:0}}.cq-questions-wrap-outer{width:768px;max-width:100%;margin:1.6rem auto}.quiz-main-inner .modal__body{width:524px;max-width:100%;margin:0 auto;overflow:hidden}.cq-question{text-align:center;width:524px;max-width:100%;margin:0;transition:all ease-in .2s;transform:translate(0)}@media screen and (max-width: 749px){.cq-question{width:calc(100vw - 3em)}.cq-question h6{padding:0 2.4rem}}.cq-screen{width:840px;max-width:100%;margin:0 auto;transition:all ease-in .2s;transform:translate(0)}@media screen and (max-width: 989px){.cq-screen{width:100vw}}.off-left{transform:translate(-150%)}.off-right{transform:translate(150%)}.cq-question h6{margin:0 auto 2.4rem}.cq-questions{list-style:none;margin:0 auto;padding:0;display:grid;gap:1.6rem;grid-template-columns:repeat(3,1fr)}@media screen and (max-width: 767px){.cq-questions{gap:.8rem;grid-template-columns:repeat(2,1fr)}}.cq-questions label{display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;height:10.4rem;background-color:#f2f2f7;color:#000;font-size:18px;line-height:1.35;padding:1.6rem;border-radius:5px;transition:all ease-in .1s;cursor:pointer}.cq-questions label svg.icon.large{width:50px;height:50px}@media screen and (max-width: 989px){.cq-questions label{height:9.6rem;padding:.9rem .4rem .4rem;display:block}}.cq-questions label:hover,.cq-questions input:checked+label{background-color:#232327;color:#fff}.cq-question-input{position:absolute;opacity:0}.cq-question-2 label{height:13.6rem}.cq-question-2 label .svg-label-text{transform:translateY(-.7rem)}.cq-questions label svg{width:56px;height:56px;display:block;margin:0 auto}@media screen and (max-width: 989px){.cq-questions label svg{width:50px;height:50px}.cq-question-2 label{display:flex;height:10.4rem;padding:2rem .4rem}.cq-question-2 label .svg-label-text{line-height:1.25}.cq-question-2 label svg{width:50px;height:50px}.cq-question-2 label .icon-cloudy{transform:translateY(.3rem)}}.step-back{display:none;position:absolute;top:1.7rem;left:1.6rem;color:#000;z-index:2;border:none;background-color:transparent;padding:4px;cursor:pointer}@media screen and (max-width: 989px){.step-back{top:.9rem;left:1rem}}.cq-reset{display:none;font-family:var(--font-body-family);font-size:1.6rem;position:absolute;top:2.6rem;right:8.6rem;color:#000;z-index:2;border:none;background-color:transparent;cursor:pointer;margin-top:-.4rem}.cq-reset svg{display:inline-block;vertical-align:middle;margin-left:4px;width:16px;height:16px}@media screen and (max-width: 989px){.cq-reset{top:2rem;right:unset}}.cq-reset-icon{display:inline-block;vertical-align:top;margin-left:.4rem}@media screen and (max-width: 989px){.color-quiz-modal .cq-results .modal__header{position:fixed;top:0;left:0;width:100%}}@media screen and (min-width: 990px){.color-quiz-modal .cq-results .modal__header{padding-top:0;padding-left:0}}@media screen and (min-width: 990px){.cq-results .modal__title{text-align:left}}@media screen and (max-width: 989px){.cq-result{padding:2.7rem 4%}}@media screen and (min-width: 990px){.cq-result{padding-top:2.4rem}.cq-result:first-of-type{padding-top:.5rem}}.cq-result strong{font-weight:bolder}.cq-result h6{margin-bottom:.3rem}@media screen and (min-width: 990px){.cq-result-wrap{display:flex;gap:2.4rem}}.color-quiz-modal .modal__body-scroll{position:relative;height:100%;max-height:100vh;overflow-y:auto;-webkit-overflow-scrolling:touch;padding-top:4.8rem}@media screen and (max-width: 749px){.color-quiz-modal .modal__body-scroll{max-height:calc(100vh - (4rem + 25px))}}@media screen and (min-width: 750px){.color-quiz-modal .modal__body-scroll{height:calc(85vh - 60px);max-height:740px}}@media screen and (max-width: 989px){.color-quiz-modal .modal__body-scroll{padding-top:4.56rem}}.cq-result-img-title{display:flex}@media screen and (max-width: 749px){.cq-result-img-title{flex-direction:column-reverse;padding-bottom:.4rem}}@media screen and (min-width: 750px){.cq-result-img-title{gap:2.4rem;align-items:stretch}}@media screen and (min-width: 990px){.cq-result-img-title{width:63%}}.cq-result-img{background-color:#f6f4f3}@media screen and (max-width: 749px){.cq-result-img{margin-top:1.6rem;margin-bottom:2.4rem}}@media screen and (min-width: 750px){.cq-result-img{width:50%}}.cq-result-img img{display:block;mix-blend-mode:multiply;max-width:100%}.cq-result-title h6{font-size:1.8rem;margin:0}.cq-result-title h3{margin-top:0;margin-bottom:1.2rem}@media screen and (min-width: 750px){.cq-result-title{width:50%;display:flex;flex-direction:column;justify-content:space-between}.cq-result-title h3{font-size:2.2rem}}@media screen and (max-width: 989px){.cq-result-icons{margin-top:2.4rem}}@media screen and (max-width: 749px){.cq-result-icons{margin-top:0}}@media screen and (min-width: 750px){.cq-result-icons{width:37%}}.color-quiz-modal .btn{background-color:#000;color:#fff}.cq-result-icon-wrap{display:flex;align-items:center;margin-bottom:.4rem;column-gap:15px}@media screen and (max-width: 749px){.cq-result-icon-wrap{column-gap:5px}}.cq-result-icon{width:60px;min-width:60px;text-align:center}.cq-result-text{flex-grow:1;font-size:1.3rem;line-height:1.5}.icon-sunshine{transform:translateY(3px);margin-top:-.5em;margin-bottom:-.5em}button.mobile-only{margin-top:1.6rem}@media screen and (max-width: 989px){#color-quiz-modal{background-color:#000}#color-quiz-modal .modal__card{transform:translateY(0)}}.cq-email-results-wrap{display:none;position:absolute;bottom:0;left:0;width:100%;background-color:#fafafc}@media screen and (max-width: 749px){.cq-email-results-wrap{box-shadow:0 0 12px #0000004d}}.cq-email-results{margin:0 auto;padding:1.9rem 5%;width:840px;max-width:100%}@media screen and (min-width: 990px){.cq-email-results{display:flex;padding:2.7rem 3% 2rem}}@media screen and (max-width: 749px){.cq-email-intro{display:none}}.cq-email-intro{font-size:85%}.cq-email-intro h6{margin-top:0;margin-bottom:.4rem}.cq-email-intro p{font-size:1.3rem;line-height:1.4;margin-top:.5rem;margin-bottom:.8rem}@media screen and (min-width: 990px){.cq-email-intro{width:55%;padding-right:2.4em}}.hr-cq{margin:-1.6rem auto 2.4rem}@media screen and (min-width: 990px){.hr-cq{margin:.8rem auto 3rem}}.hr-cq-0{display:none;margin:0}.quiz-hide{display:none;margin:0;padding:0}.quiz-hide *{margin:0;padding:0}.modal__header.modal__header-main{position:absolute;top:0;left:0;width:100%;z-index:5}.no-results{padding:1.6rem}@media screen and (max-width: 749px){.cq-result-details{margin-bottom:1rem}}.icon-activity.icon .d{fill:none}@media screen and (max-width: 989px){.icon-activity.icon{display:block;margin:0 auto;width:30px;height:30px}}.cq-email-form .color-quiz-email-button{height:48px;padding:.4rem .1rem}@media screen and (min-width: 750px){.cq-email-form .color-quiz-email-button{width:130px}}.cq-results{padding-bottom:6rem}.color-quiz-opt-in{margin-top:.7rem}.color-quiz-opt-in label{padding-top:.25rem}.cq-email-form .newsletter-callout__input-group{flex-flow:row nowrap}@media screen and (max-width: 989px){.cq-email-form .newsletter-callout__field .newsletter-callout__input{padding:.9rem 1rem .8rem}}@media screen and (max-width: 989px){.cq-email-form .newsletter-callout__field:focus-within .newsletter-callout__input{padding:1.6rem 1.2rem .3rem}}@media screen and (max-width: 989px){.cq-email-form .newsletter-callout__field{margin-bottom:0;flex-grow:1}}.cq-result-scroll{padding-bottom:9.6rem}@media screen and (max-width: 749px){.cq-result-scroll{padding-bottom:9.6rem}}.cq-email-success-message{line-height:1.45}@media screen and (min-width: 750px){.cq-email-success-message{margin-top:.8rem}}#color-quiz-title{margin-top:1.6rem;margin-bottom:1.6rem}@media screen and (max-width: 749px){#color-quiz-title{margin-top:0;margin-bottom:0}.cq-button{width:100%}}
/*# sourceMappingURL=/cdn/shop/t/513/assets/color-quiz-modal.css.map */