@import url(https://fonts.googleapis.com/css2?family=Ubuntu:wght@400;500;700&display=swap);@font-face{font-family:Overpass;font-style:italic;font-weight:300;src:url(/React_Quiz_App/static/media/overpass-light-italic.f78ab496466e18c9e554.otf)}@font-face{font-family:Overpass;font-weight:300;src:url(/React_Quiz_App/static/media/overpass-light.7fcceb8a5f8f2362108e.otf)}@font-face{font-family:Overpass;font-weight:400;src:url(/React_Quiz_App/static/media/overpass-regular.ec2a70940995f785573e.otf)}@font-face{font-family:Overpass;font-weight:600;src:url(/React_Quiz_App/static/media/overpass-semibold.f824e0a9cfb588129316.otf)}@font-face{font-family:Overpass;font-weight:700;src:url(/React_Quiz_App/static/media/overpass-bold.0d14110fa0a3f426763d.otf)}@font-face{font-family:Overpass;font-weight:800;src:url(/React_Quiz_App/static/media/overpass-extrabold.addcdcfb86a0ec2de55d.otf)}@font-face{font-family:Mabry Pro;font-weight:300;src:url(/React_Quiz_App/static/media/MabryPro-Light.b9125760599cb789da3e.ttf)}@font-face{font-family:Mabry Pro;font-weight:400;src:url(/React_Quiz_App/static/media/MabryPro-Regular.b867029db9eb660840ba.ttf)}@font-face{font-family:Mabry Pro;font-weight:500;src:url(/React_Quiz_App/static/media/MabryPro-Medium.3b5723719cd3af9b642c.ttf)}@font-face{font-family:Mabry Pro;font-weight:700;src:url(/React_Quiz_App/static/media/MabryPro-Bold.e5c08e7a334a40d76482.ttf)}html{background-color:#e5e5e5}#root{display:grid;grid-template-rows:1fr 4.25rem;height:100vh}*{border:0;box-sizing:border-box;margin:0;padding:0}main{display:grid;padding:2rem;place-items:center}.questionLoader{color:#363636;font-family:Mabry Pro;font-size:32px;font-weight:500}.questionContainer{-webkit-animation:shadowPopIn .3s cubic-bezier(.47,0,.745,.715) both;animation:shadowPopIn .3s cubic-bezier(.47,0,.745,.715) both;border:2px solid #363636;border-radius:6px}.finalContainer,.questionContainer.animate,.startContainer{-webkit-animation:shadowPopOut .3s cubic-bezier(.47,0,.745,.715) both;animation:shadowPopOut .3s cubic-bezier(.47,0,.745,.715) both;border-color:#363636;border-radius:6px;border-style:solid;border-width:2px 0 0 2px}@-webkit-keyframes shadowPopOut{0%{box-shadow:0 3.5px 8px rgba(0,0,0,.25),0 0 #363636,0 0 #363636,0 0 #363636,0 0 #363636,0 0 #363636,0 0 #363636,0 0 #363636,0 0 #363636;-webkit-transform:translateX(0) translateY(0);transform:translateX(0) translateY(0)}to{box-shadow:1px 1px #363636,2px 2px #363636,3px 3px #363636,4px 4px #363636,5px 5px #363636,6px 6px #363636,7px 7px #363636,8px 8px #363636,14px 14px 8px rgba(0,0,0,.25);-webkit-transform:translateX(-8px) translateY(-8px);transform:translateX(-8px) translateY(-8px)}}@keyframes shadowPopOut{0%{box-shadow:0 3.5px 8px rgba(0,0,0,.25),0 0 #363636,0 0 #363636,0 0 #363636,0 0 #363636,0 0 #363636,0 0 #363636,0 0 #363636,0 0 #363636;-webkit-transform:translateX(0) translateY(0);transform:translateX(0) translateY(0)}to{box-shadow:1px 1px #363636,2px 2px #363636,3px 3px #363636,4px 4px #363636,5px 5px #363636,6px 6px #363636,7px 7px #363636,8px 8px #363636,14px 14px 8px rgba(0,0,0,.25);-webkit-transform:translateX(-8px) translateY(-8px);transform:translateX(-8px) translateY(-8px)}}@-webkit-keyframes shadowPopIn{0%{box-shadow:1px 1px #363636,2px 2px #363636,3px 3px #363636,4px 4px #363636,5px 5px #363636,6px 6px #363636,7px 7px #363636,8px 8px #363636,14px 14px 8px rgba(0,0,0,.25);-webkit-transform:translateX(-8px) translateY(-8px);transform:translateX(-8px) translateY(-8px)}to{box-shadow:0 3.5px 8px rgba(0,0,0,.25),0 0 #363636,0 0 #363636,0 0 #363636,0 0 #363636,0 0 #363636,0 0 #363636,0 0 #363636,0 0 #363636;-webkit-transform:translateX(0) translateY(0);transform:translateX(0) translateY(0)}}@keyframes shadowPopIn{0%{box-shadow:1px 1px #363636,2px 2px #363636,3px 3px #363636,4px 4px #363636,5px 5px #363636,6px 6px #363636,7px 7px #363636,8px 8px #363636,14px 14px 8px rgba(0,0,0,.25);-webkit-transform:translateX(-8px) translateY(-8px);transform:translateX(-8px) translateY(-8px)}to{box-shadow:0 3.5px 8px rgba(0,0,0,.25),0 0 #363636,0 0 #363636,0 0 #363636,0 0 #363636,0 0 #363636,0 0 #363636,0 0 #363636,0 0 #363636;-webkit-transform:translateX(0) translateY(0);transform:translateX(0) translateY(0)}}.startContainer{align-items:center;background-color:#dfdfdf;display:flex;flex-direction:column;padding:1.5rem 1.5rem 2.5rem}@media screen and (min-width:870px){.startContainer{max-height:584px;min-width:815px}}.startContainer h1{color:#363636;font-family:Overpass;font-size:2rem;font-weight:700}.startContainer small:nth-child(2){color:#363636;font-family:Overpass;font-size:14px;font-style:italic;font-weight:300;margin-bottom:2rem}.startContainer small:nth-child(2) a{border-bottom:1px solid transparent;color:#363636;text-decoration:none;transition:all .28s ease}.startContainer small:nth-child(2) a:hover{border-bottom:1px solid #676767;color:#676767}.startContainer .getStartedTxt{color:#363636;font-family:Mabry Pro;font-size:14px}.startContainer .optionsContainer{margin-top:.5rem}.startContainer .optionsContainer div{margin-bottom:1.5rem;max-width:335px}.startContainer .optionsContainer div:nth-child(4){align-items:center;display:flex;justify-content:space-between;margin-bottom:2rem}.startContainer .optionsContainer h2{color:#363636;font-family:Ubuntu,sans-serif;font-size:1.5rem;font-weight:500;margin-bottom:4px}.startContainer .optionsContainer div h2#amount{margin-bottom:0}.startContainer .optionsContainer select{background-color:#eaeaea;border:1px solid #363636;border-radius:6px;box-shadow:0 3px 0 #363636,0 6px 8px rgba(0,0,0,.25);color:#363636;cursor:pointer;font-family:Mabry Pro;font-size:1rem;padding:.5rem;transition:.2s ease;width:100%}.startContainer .optionsContainer select:focus,.startContainer .optionsContainer select:hover{box-shadow:0 1px 0 #363636,0 3.5px 8px rgba(0,0,0,.25);-webkit-transform:translateY(.2em);transform:translateY(.2em)}.startContainer .optionsContainer option{background-color:#eaeaea;color:#363636;font-family:Ubuntu,sans-serif;font-size:14px;padding:.5rem;width:100%}.startContainer .optionsContainer input{background-color:#eaeaea;border:1px solid #363636;border-radius:6px;box-shadow:0 3px 0 #363636,0 6px 8px rgba(0,0,0,.25);color:#363636;font-family:Mabry Pro;font-size:14px;outline:none;padding:.5rem;transition:.2s ease;width:25%}.startContainer .optionsContainer input:focus,.startContainer .optionsContainer input:hover{box-shadow:0 1px 0 #363636,0 3.5px 8px rgba(0,0,0,.25);-webkit-transform:translateY(.2em);transform:translateY(.2em)}.startContainer .optionsContainer .errorTxt{bottom:92px;color:#ed2939;font-family:Mabry Pro;font-size:12px;position:absolute;right:1px}@media screen and (min-width:870px){.startContainer .optionsContainer .errorTxt{bottom:92px;right:217px}}.startContainer .optionsContainer button{background-color:#363636;border-radius:6px;box-shadow:0 6px 8px rgba(0,0,0,.25);cursor:pointer;justify-self:center;transition:.2s ease;width:100%}.startContainer .optionsContainer button .btnTop{background-color:#eaeaea;border:1px solid #363636;border-radius:6px;color:#363636;display:block;font-family:Mabry Pro;font-size:14px;font-weight:500;padding:.75em 1.5em;-webkit-transform:translateY(-.2em);transform:translateY(-.2em);transition:transform .2s ease}.startContainer .optionsContainer button:hover{box-shadow:0 8px 8px rgba(0,0,0,.25)}.startContainer .optionsContainer button:hover .btnTop{border-width:2px;font-weight:700;-webkit-transform:translateY(-.33em);transform:translateY(-.33em)}.startContainer .optionsContainer button:active{box-shadow:0 3.5px 8px rgba(0,0,0,.25)}.startContainer .optionsContainer button:active .btnTop{background-color:#f1f1f1;-webkit-transform:translateY(0);transform:translateY(0)}.questionContainer{align-items:center;background-color:#dfdfdf;display:flex;flex-direction:column;padding:1.5rem 1.5rem 1rem}@media screen and (min-width:870px){.questionContainer{min-width:815px}}.arrowBack{left:1.5rem;position:absolute}.arrowBack svg{color:#363636;font-size:2rem;transition:all .38s ease}.arrowBack:active{-webkit-transform:translateY(2px);transform:translateY(2px)}.arrowBack:hover svg{color:#676767}.questionContainer h1{color:#363636;font-family:Overpass;font-size:2rem;font-weight:700;margin-bottom:3rem}.questionContainer h3{color:#363636;font-family:Mabry Pro;font-size:18px;margin-bottom:2rem}.questionContainer ul{grid-column-gap:2rem;grid-row-gap:1.5rem;-webkit-column-gap:2rem;column-gap:2rem;display:grid;grid-template-columns:1fr 1fr;list-style:none;row-gap:1.5rem}.questionContainer ul .question{align-items:center;background-color:#eaeaea;border:1px solid #363636;border-radius:6px;box-shadow:0 3px 0 #363636,0 6px 8px rgba(0,0,0,.25);color:#363636;cursor:pointer;display:flex;font-family:Mabry Pro;font-size:1rem;gap:.5rem;padding:.5rem;transition:.2s ease}.questionContainer ul .question:hover{box-shadow:0 1px 0 #363636,0 3.5px 8px rgba(0,0,0,.25);-webkit-transform:translateY(.2em);transform:translateY(.2em)}.questionContainer ul .correct{background-color:#35d435;pointer-events:none}.questionContainer ul .incorrect{background-color:#ed2939;pointer-events:none}.questionContainer ul .question.disable{opacity:.68;pointer-events:none}.questionContainer .scoreContainer{display:flex;justify-content:space-between;margin-top:3rem;width:100%}@media screen and (min-width:870px){.questionContainer .scoreContainer{width:93%}}.questionContainer .scoreContainer p{align-self:flex-start;color:#363636;font-family:Mabry Pro;font-size:18px}.questionContainer .scoreContainer a{border-bottom:1px solid transparent;color:#363636;font-family:Mabry Pro;font-size:18px;text-decoration:none;transition:all .28s ease}.questionContainer .scoreContainer a:hover{border-bottom:1px solid #676767;color:#676767}.finalContainer{align-items:center;background-color:#dfdfdf;display:flex;flex-direction:column;padding:1.5rem}@media screen and (min-width:450px){.finalContainer{max-height:236px;min-width:397px;padding:1.5rem 3rem}}.finalContainer h2{color:#363636;font-family:Mabry Pro;font-size:1.5rem;font-weight:700;margin-bottom:1rem}.finalContainer h3{color:#363636;font-family:Mabry Pro;font-size:18px;font-weight:500;margin-bottom:.7rem}.finalContainer div{display:flex;gap:1rem;margin-bottom:1rem}.finalContainer button{background-color:#363636;border-radius:6px;box-shadow:0 6px 8px rgba(0,0,0,.25);cursor:pointer;justify-self:center;transition:.2s ease;width:100%}.finalContainer button .btnTop{background-color:#eaeaea;border:1px solid #363636;border-radius:6px;color:#363636;display:block;font-family:Mabry Pro;font-size:14px;font-weight:500;padding:.75em 1.5em;-webkit-transform:translateY(-.2em);transform:translateY(-.2em);transition:transform .2s ease}.finalContainer div button,.finalContainer div button .btnTop{align-items:center;display:flex;justify-content:center;min-height:42px;padding:0}.finalContainer div button:first-child,.finalContainer div button:first-child .btnTop{min-width:102.467px}.finalContainer div button:nth-child(2),.finalContainer div button:nth-child(2) .btnTop{min-width:179px}@media screen and (max-width:400px){.finalContainer div button:first-child,.finalContainer div button:first-child .btnTop,.finalContainer div button:nth-child(2),.finalContainer div button:nth-child(2) .btnTop{width:100%}.finalContainer div{flex-direction:column;width:100%}}.finalContainer button:hover{box-shadow:0 8px 8px rgba(0,0,0,.25)}.finalContainer button:hover .btnTop{border-width:2px;font-weight:700;-webkit-transform:translateY(-.33em);transform:translateY(-.33em)}.finalContainer button:active{box-shadow:0 3.5px 8px rgba(0,0,0,.25)}.finalContainer button:active .btnTop{background-color:#f1f1f1;-webkit-transform:translateY(0);transform:translateY(0)}footer{align-items:center;display:flex;gap:2rem;justify-content:space-around;padding:.5rem 1rem}@media screen and (max-width:500px){footer{align-items:center;flex-direction:column;gap:.5rem}}footer p{font-family:Mabry Pro;font-weight:700}footer p,footer p a{color:#363636;font-size:18px}footer p a{border-bottom:1px solid transparent;font-weight:400;text-decoration:none;transition:all .28s ease}footer p a:hover{border-bottom:1px solid #676767;color:#676767}footer p span{color:#363636;font-size:18px;font-weight:400}.quizErrorContainer{margin:1.5rem 0 0 1rem;text-align:center}.quizErrorContainer p{color:var(--wordsBlackMain);font-family:Mabry Pro;font-size:18px;margin-bottom:.5rem}.quizErrorContainer span{color:var(--redColour);font-family:Ubuntu,sans-serif;font-size:24px;font-weight:600}.quizErrorContainer button{background-color:#eaeaea;border:1px solid var(--redColour);border-radius:6px;box-shadow:0 3px 0 var(--redColour),0 6px 8px rgba(0,0,0,.25);color:var(--redColour);cursor:pointer;font-family:Mabry Pro;font-size:14px;padding:.4rem;transition:.2s ease}.quizErrorContainer button:active{border-color:#269626;box-shadow:0 1px 0 #269626,0 3.5px 8px rgba(0,0,0,.25);color:#269626;-webkit-transform:translateY(.2em);transform:translateY(.2em)}
/*# sourceMappingURL=main.0cbe3dee.css.map*/