body { font-family: Roboto, sans-serif; }
.font-sora { font-family: Sora, sans-serif; }
main .absolute { left: 26%; width: 60%; }
header { background: linear-gradient(269.89deg, rgb(228, 222, 222) -54.42%, rgb(18, 103, 231) 67.13%), rgb(0, 87, 182); }
h1 { line-height: 1; font-size: 48px !important; }
h1 .big { font-size: 72px !important; }
.text-primary { color: rgb(0, 87, 182); }
.bg-primary { background: rgb(0, 87, 182) !important; }
.quiz-container, .results { max-width: 1000px; }
button { border-radius: 80px; }
.card { background: rgb(248, 248, 248); box-shadow: rgba(197, 197, 197, 0.25) -4px -4px 20px inset; border-radius: 20px; }
.heading-card { background: rgb(227, 238, 255); border-radius: 21.9579px; margin-top: -74px; margin-bottom: 1rem; width: max-content; }
.text-secondary { color: rgb(0, 87, 182); }
#last { background: url("") left bottom / 300px no-repeat black; border-radius: 60px; overflow: hidden; position: relative; }
#last::after { position: absolute; top: -32px; right: 0px; background: url("") left bottom / 300px no-repeat black; content: ""; width: 300px; height: 300px; transform: rotate(196deg); }
.answer-variants__other { display: flex; -webkit-box-pack: justify; justify-content: space-between; -webkit-box-align: stretch; align-items: stretch; }
.answer-variants__other label { -webkit-box-flex: 1; flex: 1 1 52px; max-width: 52px; width: 52px !important; }
.answer-variants__other .field { -webkit-box-flex: 1; flex: 1 1 100%; }
.answer-variants__other input { background: var(--color-bg-2, #f7f7f7); border-width: medium !important; border-style: none !important; border-color: currentcolor !important; border-image: initial !important; border-top-left-radius: 0px !important; border-bottom-left-radius: 0px !important; }
.answer-variants__other .control, .answer-variants__other input { height: 100% !important; }
.answer-variants__group { width: 100%; margin-right: 1rem; }
.answer-variants__group::-webkit-scrollbar { width: 10px; }
.answer-variants__group::-webkit-scrollbar-track { border-left: 8px solid transparent; box-shadow: inset 0 0 10px 10px var(--color-bg-2, #eae9f1); }
.answer-variants__group::-webkit-scrollbar-thumb { border-left: 8px solid transparent; box-shadow: inset 0 0 10px 10px var(--color); }
@media (max-width: 767px) {
  .answer-variants_has_image .answer-variants__group { margin: 0px; -webkit-box-flex: 0; flex: 0 0 auto; }
}
.answer-variants__answerContainer { text-align: left; }
.answer-variants__variant-text { -webkit-box-flex: 0; flex: 0 1 49%; border-radius: 5px; -webkit-box-align: center; align-items: center; will-change: box-shadow; transition: box-shadow 0.15s ease-out, -webkit-box-shadow 0.15s ease-out; }
.answer-variants_has_image .answer-variants__variant-text { -webkit-box-flex: 0; flex: 0 1 auto; }
.answer-variants_long .answer-variants__variant-text { -webkit-box-flex: 1; flex: 1 0 100%; }
@media (max-width: 767px) {
  .answer-variants__variant-text { -webkit-box-flex: 0; flex: 0 1 100%; }
}
.answer-variants__variant-text .control-label { padding-left: 0.5rem !important; }
.answer-variants__variant-text label { padding: 0.8rem 1rem; width: 100%; text-align: left; display: flex; height: 100%; background: rgba(255, 255, 255, 0.83); border-radius: 5px; }
.answer-variants__variant-text_selected { box-shadow: 0 1px 3px 0 var(--color-bg-2, rgba(0, 0, 0, .1)); border: solid 1px var(--color-alpha); }
.answer-variants__gradient { display: none; }
.answer-variants .check { -webkit-box-flex: 0; flex: 0 0 1.25rem; }
.answer-variants_long .check { align-self: flex-start; }
@media (max-width: 767px) {
  .answer-variants_has_image .answer-variants__image { margin: 0px 0px 1rem; -webkit-box-flex: 0; flex: 0 0 auto; width: 100%; }
}
.checkbox input, .radio input { cursor: pointer; }
#app input, #app textarea { border-radius: 4px; }
#app input, #app textarea { border: solid 1.2px var(--color-bg-3, #b1b5be); color: var(--color-bg-text, #363636); background: none rgba(0, 0, 0, 0); }
.b-radio.radio { outline: none; display: inline-flex; -webkit-box-align: center; align-items: center; user-select: none; }
.b-radio.radio + .radio { margin-left: 0.5em; }
.b-radio.radio input[type="radio"] { position: absolute; left: 0px; opacity: 0; outline: none; z-index: -1; }
.b-radio.radio input[type="radio"] + .check { display: flex; flex-shrink: 0; position: relative; cursor: pointer; width: 20px; height: 20px; transition: background 0.15s ease-out; border-radius: 50%; border: 2px solid rgb(122, 122, 122); }
.question { position: relative; }
.question::before { position: absolute; content: ""; top: 10px; left: 0px; width: 6px; height: 6px; border-radius: 100%; background: black; }
.b-radio.radio input[type="radio"] + .check::before { content: ""; display: flex; position: absolute; left: 50%; margin-left: 5px; bottom: 50%; margin-bottom: 5px; width: 20px; height: 20px; transition: transform 0.15s ease-out, -webkit-transform 0.15s ease-out; border-radius: 50%; transform: scale(0); background-color: rgb(121, 87, 213); }
.b-radio.radio input[type="radio"]:checked + .check::before { background:  0% 0% / 21px black; }
.b-radio.radio input[type="radio"]:checked + .check { border: 4px solid white; background: black; outline: black solid 2px; box-shadow: black 0px 2px 6px 0px !important; }
#app input { background-color: var(--color-bg-1, #f7f7f7); }
.checkbox, .radio { cursor: pointer; display: inline-block; line-height: 1.25; position: relative; }
.test-step { display: none; }
.test-step.active { display: block; }
@media (max-width: 767px) {
  h1 { line-height: 1.2; font-size: 30px !important; }
  h1 .big { font-size: 44px !important; }
  main .absolute { left: 5%; width: 100%; }
  .test-step.active { max-width: 100%; }
}
@media (max-width: 1024px) {
  .quiz-container { max-width: none; }
}
@media (min-width: 1440px) {
  .container { max-width: 1440px; padding-left: 32px; padding-right: 32px; }
}