/** Shopify CDN: Minification failed

Line 16:105 "positon" is not a known CSS property
Line 157:71 Expected identifier but found ")"
Line 173:0 Expected "}" to go with "{"

**/
.questionSet-active { display: flex !important; }
.homepage-hero__container { height: 34vw; min-height: 450px; max-height: 650px; gap: 48px; padding: 24px; justify-content: center; display: grid; grid-template-columns: minmax(350px, 740px) minmax(350px, 740px); background: url('/cdn/shop/files/bright-yellow-topography-web.jpg?v=1690295887') no-repeat center center; background-size: cover; }
.homepage-hero__half { display: grid; align-content: center; }
.homepage-hero__half .dropdown { justify-self: start; }
.homepage-hero__half .dropdown .topDrop { margin-left: 0px; }
.homepage-hero__h1 { color: #292b2e; font-weight: 800; font-size: 64px; }
.homepage-hero__h2 { color: #292b2e; font-size: 20px; text-transform: none; letter-spacing: 0px; }
.heroSwiper { overflow: hidden; position: relative; }
.heroSwiper .swiper-slide { background: transparent; min-height: 400px; height: 30vw; max-height: 620px; positon: relative; }
.heroSwiper .swiper-slide .top-left { transition: all .85s ease .25s; position: absolute; max-width: 50%; left: 15%; top: 3%; }
.heroSwiper .swiper-slide.swiper-slide-active .top-left { left: 12%; top: 1%; }
.heroSwiper .swiper-slide .bottom-right { transition: all .85s ease .25s; position: absolute; max-width: 40%; left: 50%; top: 45%; }
.heroSwiper .swiper-slide.swiper-slide-active .bottom-right { top: 50%; left: 55%; }
.heroSwiper .swiper-slide .rounded.border { width: 200px; border-radius: 36px; overflow: hidden; border: 8px solid #fee97a; }
.heroSwiper .swiper-button-next, .heroSwiper .swiper-button-prev { color: #292b2e; }
.heroSwiper .swiper-button-next:after, .heroSwiper .swiper-button-prev:after { text-shadow: none; }
.heroSwiper .swiper-slide p.hero-label { transition: all .6s ease .3s; opacity: 0; font-weight: 600; left: 14%; bottom: 24%; border-radius: 26px; border: 1.5px solid #e9d565; padding: 6px 24px; background: #ffeb7b; position: absolute; width: initial; display: flex; line-height: 40px; color: #292b2e; }
.heroSwiper .swiper-slide.swiper-slide-active p.hero-label { left: 10%; bottom: 24%; opacity: 1; }
p.hero-label img { max-width: 40px; border-radius: 50% 50%; height: 40px; padding: 4px; margin-left: 8px; }
p.hero-label a { line-height: 1; display: flex; align-items: center; width: 100%; align-content: center; justify-content: center; }
@media only screen and (max-width:899px) {
  .homepage-hero__h1 { font-size: 52px; }
  .homepage-hero__container { grid-template-columns: 1fr; max-height: initial; height: initial; }
  .heroSwiper .swiper-slide .top-left { max-width: 70%; }
  .heroSwiper .swiper-slide p.hero-label { width: 80%; left: initial; transition: 0.1s ease; }
  .heroSwiper .swiper-slide.swiper-slide-active p.hero-label { width: 100%; left: 50%; transform: translate(-50%); bottom: 0%; justify-content: center; }
}


.questionSet-Container { display: none; }
.questionSet-Container.question-active { display: flex; flex-wrap: wrap; place-content: center; animation: fadeInAnimation ease-out .3s; animation-iteration-count: 1; animation-fill-mode: forwards; width: 100vw; min-height: 555px; padding: 48px; margin-bottom: 3px; }
@keyframes fadeInAnimation {
  0% { opacity: 0; transform: scale(.95); }
  100% { opacity: 1; transform: scale(1); }
}
#questionSets { display: flex; place-content: center; background: white; }
.questions-question { width: 100%; font-size: 1.5em; justify-content: center; align-items: center; text-align: center; }
.questionButtonWrapper { display: flex; place-content: center; text-align: center; flex-wrap: wrap; gap: 24px; max-width: 1200px; }
.questionButton { justify-content: space-around; align-items: center; background-color: #fed10a; margin: 0 5px; padding: 10px 20px; flex: 0 1  175px; text-align: center; align-content: center; display: flex; border-radius: 4px; cursor: pointer; }
.questionButton:hover { background-color: #e8a515; }
.questionButton_Original { margin: 0px 0px; padding: 10px 15px; flex: 0 1 210px; text-align: center; align-content: center; border-radius: 0px; display: flex; flex-direction: column; align-items: center; justify-content: center; cursor: pointer; background: white; border: 0px solid #fed10a; transition: 0.3s; padding:48px;}
.questionButton_Original a.primary { margin-top: 20px; font-weight: 600; letter-spacing: 0px; font-size: calc(15px + .5vw);    text-transform: none;    border-radius: 8px;}
.questionButton_Original:hover { background-color: #ffffff; transition: 0.3s; }
#questionAllBrandsList { gap: 24px; }
.question-active { display: flex; }
.quiz_navigation { justify-content: space-around; align-items: center; background-color: #fed10a; margin: 10px; padding: 10px 20px; flex: 0 1  175px; text-align: center; align-content: center; display: flex; border-radius: 4px; cursor: pointer; width: 50%; }
#startOverButton { margin: auto; padding: 10px; }
.quiz-started { background-color: #f2f2f2; flex: none; }
.active-quiz { display: none; }
.quiz-started.active-quiz { display: block }
.quiz-started .questionButton_Original { flex: none; background-color: #ffffff; }
.thumbnail__icon--lenses { background: url(/cdn/shop/files/icon-lens2.png?v=1675100509) no-repeat center; background-size: 45px; }
.thumbnail__icon--sunglasses { background: url(/cdn/shop/files/icon-sunniy.png?v=1675097429) no-repeat center; background-size: 45px; }
.thumbnail__icon--rx { background: url(/cdn/shop/files/icon-rx3.png?v=1675099453) no-repeat center; background-size: 45px; }
#questionnaireTitle { font-size: 2em; }

#questionFlowContainer { background: #4f6c97 url('/cdn/shop/files/hands-holding-sapphire-rbs_2100x.jpg?v=1706798967')no-repeat center center; background-size: cover; box-shadow: 0 6px 7px #0000002e;padding-top: initial;  min-height: 650px; align-content: start; display: grid; justify-content: center; }
#questionFlowContainer:has(.questionSet-Container.question-active) { padding-top: 94px; }
#questionFlowContainer:has(.questionSet-Container.question-active) h1 { display: none; }
#questionFlowContainer .big-search .dropdown .topDrop { border: 3px solid #e7e7e7; box-shadow: 0 0 3px black; grid-template-columns: 45px auto; }
#questionFlowContainer .big-search .dropdown .topDrop .dropbtn#myInput { font-size: 16px; line-height: 25px; padding-left: 12px; }
#questionFlowContainer .big-search .dropdown .topDrop svg { height: 20px; fill: #222; }


.questionnaire-headline { text-transform: uppercase; letter-spacing: 0.1em; font-size: 1.3em; margin-bottom: 0; text-transform: none; font-size: 64px; letter-spacing: 0px; font-weight: 600; color: white; text-shadow: 3px 3px 12px #27273c54; text-align: left; top: 170px; position: absolute; left: 50%; transform: translate(-450px); width: 430px; }
.questionnaire-headline { text-align: left; top: initial; position: relative; left: initial; transform: initial; width: 60%; align-self: center; max-width:600px; line-height: 1.1; }
.q1-top-margin { }
#lastQuestionButton { font-weight: 700; cursor: pointer; position: absolute; left: calc(10% - 20px); }
#lastQuestionButton svg { height: 10px; margin-top: -3px; }
#questionSetSunglasses #lastQuestionButton svg { margin-top: 7px; }
.options-three-columns { display: grid; grid-template-columns: 1fr 1fr 1fr; }
.options-single-column { display: grid; grid-template-columns: 1fr; }
.options-four-columns { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; }
.options-three-columns .btn, .options-single-column .btn { margin: 0 5px; padding: 10px 50px; width: 100%; }
.order-custom-title { width: 100%; text-align: center; }
#quiz_navigation-box { display: flex; justify-content: center; }
#questionnaireThumbnailNav { animation: fadeInAnimation ease-out .3s; }
#questionnaireThumbnailNav { display: none; }
#questionnaireThumbnailNav.quiz-thumb-show { display: block; width: 100%; position: absolute; }

.questions-question { padding-top: 10px; }
.big-search { width: 100%; }
#guide-content { display: none; }
.dropdown { padding-top: 25px; padding-bottom: 50px; }
#quiz_navigation-box { padding: 10px; }
#questionnaire-order-custom { text-decoration: underline; }
#questionnaire-order-custom:hover { cursor: pointer; }
.questionTracking.primary svg { max-width: 32px; }
.icon-btn { width: 110% !important; }
#questionSetOakley .questionTracking.primary svg, #questionSetRayBan .questionTracking.primary svg, #questionSetCostaDelMar .questionTracking.primary svg, #questionSetPrada .questionTracking.primary svg { max-width: 52px; display: flex; margin: 0 auto 3px; }

#questionContainer { width: 100vw; display: flex; width: 100vw; display: none; place-content: center; flex-wrap: wrap; animation: fadeInAnimation ease-out .3s; border-radius: 24px; background: white; margin-bottom: -20px; padding-top: 40px; box-shadow: 0 12px 12px -6px rgba(0, 0, 0, 0.5); }
#questionContainer.question-active { display: flex; }
#questionContainer { margin: 0 0; border-radius: 0px; padding: 0px; box-shadow: 0 0 0 0; display: grid !important; grid-template-columns: 1fr 1fr; gap: 0px; }
#questionContainer.quiz-started { display: none !important; }
#questionContainer .rlQuestion { grid-column: 1/3; background: #494b4e url('/cdn/shop/files/costa-replace-landscape.jpg?v=1708702152')no-repeat center center; background-size: cover; height: calc(600px + 6vw); display: grid; grid-template-rows: auto auto; grid-template-columns: minmax(600px, 1600px); text-align: left; }

.rlQuestion div { align-self: end; }
.questionButton_Original.sunglasses { background: url('/cdn/shop/files/sunglasses_amp-img.jpg?v=1708532201')no-repeat center center; background-size: cover; display: grid; align-content: end;height:600px; }
.questionButton_Original.prescription { background: url('/cdn/shop/files/golfrx.png?v=1658260216')no-repeat center center; background-size: cover; display: grid; align-content: end;height:600px; }

.questionButton_Original.sunglasses,.questionButton_Original.prescription {
  box-shadow:inset 0 -480px 150px -150px rgba(0,0,0,0.5);
}

.questionButton_Original.sunglasses div,.questionButton_Original.prescription div {display:grid;color:white;}
.questionButton_Original.sunglasses h3,.questionButton_Original.prescription h3 {font-weight:600;font-size:2.5em;}

@media only screen and (max-width:1120px) {
  .questionSet-Container.question-active { width: 100vw; padding: 24px; }
  .questionButton_Original { margin: 0px 5px; padding: 10px 15px; flex: 0 1 175px; }
  .questionButton_Original a.primary { position: relative; margin-top: 6px; }
  #questionContainer { padding-top: 30px; }
}

@media only screen and (max-width:749px) {
  .questionButton_Original.sunglasses,.questionButton_Original.prescription {
  box-shadow:none;
}
  .questionButton_Original.sunglasses h3,.questionButton_Original.prescription h3, .questionButton_Original.sunglasses span,.questionButton_Original.prescription span{
     display:none;
}
  .questionButton_Original {margin:0 0;border-radius:12px;
                           width: 100%;
    padding: 12px;
                           }
  .questionButton_Original a.primary {
    text-transform: none;
    font-size: 15px;
    padding: 10px 8px;
    border-radius: 8px;
    width: 100%;
  }
  #lastQuestionButton { position: static; left: auto; }
  .options-four-columns, .options-three-columns { grid-template-columns: 1fr 1fr; }
  .options-three-columns .btn, .options-single-column .btn { max-width: 70vw; font-size: 0.75em; padding: 8px 15px; }
  #questionContainer {padding-top:0px;gap:12px;padding:12px;}
  #questionnaireTitle { font-size: 1.25em; padding: 0 20px; }
  .questionSet-Container.question-active { min-height: 420px; }
  #questionFlowContainer { min-height: 60vh; gap:8px;padding-top: 0px; background: white url('/cdn/shop/files/hands-holding-sapphire-rbs_2100x.jpg?v=1706798967')no-repeat 70% -3%; background-size: 620px; }
  .questionnaire-headline { font-size: 1.8em; transform: translate(0); width: 100%; top: 10px; left: 0px; padding: 24px; font-size: 2.0em; text-align: center; text-shadow: 0 2px 9px #22455a; font-weight: 700; align-self: start; }
  #questionContainer .rlQuestion { height: 90vw; grid-template-columns: unset; grid-template-rows: 1fr auto; }
  .questionButton_Original.sunglasses { height: 50vw;width:100%; }
  .questionButton_Original.prescription { height: 50vw;width:100%; }
  #questionSets { padding: 0 0; }
  #questionSets .dropdown-content.show {position:relative;border:0px;}
  #questionSets .dropdown {padding-bottom:25px;}
  #questionSets .topDrop #closeX.visible {display: grid;place-content: center;right: 0;}
  #questionSets .dropdown-content ul#brandsDropdown {padding: 0px;height: 100%;grid-template-rows: auto auto auto;gap: 12px;}
  #questionSets .dropdown-content ul#brandsDropdown a {padding:8px 4px;)
}