@import"https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700&display=swap";:root{--mc-primary: #008E88;--mc-primary-light: #4A8B66;--mc-primary-dark: #1E3F2A;--mc-white: #FFFFFF;--mc-black: #000000;--mc-dark-gray: #333333;--mc-gray: #666666;--mc-light-gray: #999999;--mc-bg-primary: #FFFFFF;--mc-bg-secondary: #FAFAFA;--mc-bg-tertiary: #F8F8F8;--mc-border: #E5E5E5;--mc-border-light: #F0F0F0;--mc-font-family: "Roboto", sans-serif;--mc-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .03);--mc-shadow: 0 1px 3px 0 rgba(0, 0, 0, .08);--mc-shadow-md: 0 2px 4px 0 rgba(0, 0, 0, .08);--mc-transition: all .15s ease}body{margin:0;padding:20px;font-family:var(--mc-font-family);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-image:url(/myculture_quiz_design.png);background-size:cover;background-position:center;background-repeat:no-repeat;background-attachment:fixed;min-height:100vh;font-weight:400;color:var(--mc-black);line-height:1.5}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}*{box-sizing:border-box}.container{position:relative;max-width:800px;margin:0 auto;background:#fffffffa;box-shadow:var(--mc-shadow-md);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}@media (min-width: 769px){.container{margin:2.5rem auto}body{padding:40px}}.result{padding:2rem 2.5rem 3rem}.answerOptions{margin:0;padding:0;list-style:none}.questionCount{padding:1.5rem 2.5rem 0;font-size:14px;font-weight:700;color:var(--mc-dark-gray);text-transform:uppercase;letter-spacing:.025em}.question{margin:0;padding:1rem 2.5rem 1.5rem;font-size:22px;font-weight:400;color:var(--mc-primary);line-height:1.4}.answerOption{border-top:1px solid var(--mc-border-light);transition:var(--mc-transition)}.answerOption:hover{background-color:var(--mc-bg-secondary)}.radioCustomButton{position:absolute;width:auto;opacity:0}.radioCustomButton,.radioCustomLabel{display:inline-block;vertical-align:middle;cursor:pointer}.radioCustomLabel{position:relative;width:100%;margin:0;padding:1.5rem 2.5rem 1.5rem 5rem;font-size:18px;line-height:1.5;font-weight:400;color:var(--mc-dark-gray);transition:var(--mc-transition)}.radioCustomButton:checked~.radioCustomLabel{font-weight:500;color:var(--mc-primary)}.radioCustomButton~.radioCustomLabel:before{position:absolute;top:20px;left:38px;width:28px;height:28px;content:"";display:inline-block;vertical-align:middle;background:var(--mc-white);border:2px solid var(--mc-border);transition:var(--mc-transition)}.radioCustomButton:checked~.radioCustomLabel:before{content:"";background:var(--mc-primary) url("data:image/svg+xml,%3csvg%20fill='%23fff'%20height='24'%20viewBox='0%200%2024%2024'%20width='24'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M0%200h24v24H0z'%20fill='none'/%3e%3cpath%20d='M9%2016.17L4.83%2012l-1.42%201.41L9%2019%2021%207l-1.41-1.41z'/%3e%3c/svg%3e") no-repeat center;background-size:20px;border-color:var(--mc-primary)}.radioCustomButton:focus~.radioCustomLabel:before{outline:2px solid var(--mc-primary);outline-offset:2px}.fade-enter{opacity:0}.fade-enter-active{opacity:1;transition:opacity .5s ease-in-out .3s}.fade-exit{position:absolute;top:0;left:0;width:100%;opacity:1}.fade-exit-active{opacity:0;transition:opacity .5s ease-in-out}.fade-appear{opacity:0}.fade-appear-active{opacity:1;transition:opacity .5s ease-in-out}@media (max-width: 768px){body{padding:10px}.container{margin:0}.App-header{padding:2rem 1.5rem}.App-header h2{font-size:24px}.App-subtitle{font-size:16px}.questionCount{padding:1.5rem 1.5rem 0;font-size:13px}.question{padding:1rem 1.5rem 1.5rem;font-size:20px}.radioCustomLabel{padding:1.25rem 1.5rem 1.25rem 4rem;font-size:16px}.radioCustomButton~.radioCustomLabel:before{left:20px;width:24px;height:24px}.result{padding:1.5rem 1.5rem 2.5rem}.result-title{font-size:28px}.result-description,.result-recommendation{font-size:16px}.result-cta{font-size:15px}}@media (max-width: 480px){.App-header{padding:1.5rem 1rem}.App-header h2{font-size:22px}.App-subtitle{font-size:15px}.questionCount{padding:1rem 1rem 0}.question{padding:.75rem 1rem 1rem;font-size:18px}.radioCustomLabel{padding:1rem 1rem 1rem 3.5rem;font-size:15px}.radioCustomButton~.radioCustomLabel:before{left:15px;width:22px;height:22px}.result{padding:1.5rem 1rem 2rem}.result-title{font-size:24px}}.radioCustomButton:focus~.radioCustomLabel{outline:2px solid var(--mc-primary);outline-offset:-2px}@media (prefers-reduced-motion: reduce){.fade-enter-active,.fade-exit-active,.fade-appear-active{transition:none}.answerOption,.radioCustomButton~.radioCustomLabel:before,.radioCustomLabel{transition:none}}.App-logo{height:128px;width:128px;margin-bottom:0}.App-header{background-color:#ffffffd9;padding:2.5rem 2rem;color:var(--mc-black);text-align:center}.App-header h2{font-family:var(--mc-font-family);font-size:28px;font-weight:400;margin:0 0 .75rem;line-height:1.3;letter-spacing:-.025em}.App-subtitle{font-family:var(--mc-font-family);font-size:18px;color:#000000b3;margin:0;font-weight:300;line-height:1.5}.App-intro{font-size:large}.result-content{text-align:center;padding:2rem 1.5rem}.result-title{font-family:var(--mc-font-family);font-size:32px;color:var(--mc-primary);margin:0 0 1.5rem;font-weight:400;letter-spacing:-.025em;line-height:1.2}.result-description{font-family:var(--mc-font-family);font-size:18px;line-height:1.6;margin:0 0 2rem;color:var(--mc-dark-gray);font-weight:400}.result-recommendation{font-family:var(--mc-font-family);font-size:18px;color:var(--mc-primary);margin:0 0 1.5rem;font-weight:500;line-height:1.5}.result-cta{font-family:var(--mc-font-family);font-size:16px;color:var(--mc-gray);font-weight:400;margin:2rem 0 0;line-height:1.5}.result-restart-btn{font-family:var(--mc-font-family);font-size:18px;font-weight:600;padding:1rem 2.5rem;margin-top:2rem;border:none;background:var(--mc-primary);color:var(--mc-white);cursor:pointer;transition:var(--mc-transition);text-transform:uppercase;letter-spacing:.025em}.result-restart-btn:hover{background:var(--mc-primary-dark)}.result-restart-btn:focus{outline:2px solid var(--mc-primary);outline-offset:2px}.result-restart-btn:active{transform:translateY(1px)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width: 768px){.result-restart-btn{font-size:16px;padding:.875rem 2rem}}@media (max-width: 480px){.result-restart-btn{font-size:15px;padding:.75rem 1.5rem;width:100%}}
