@import"https://fonts.googleapis.com/css2?family=Orbitron:wght@700&display=swap";@media screen and (max-width: 767px){.answer-quiz{width:150px;padding:10px;font-size:1rem}.welcome{font-size:1rem}.timer{width:100px;font-size:1rem}.question{margin:50px 0 20px;font-size:2rem}.game-over{height:40vh}.flag-image{width:200px;height:135x}.progress-bar{width:75%}.feedback{top:235px;font-size:1.5rem}}.feedback{position:absolute;top:235px;left:50%;transform:translate(-50%,-50%);font-size:1.5rem;opacity:0;transition:opacity .3s ease-in-out}.feedback.show{opacity:1;z-index:1}.feedback.correct{color:green;animation:bounce 1s ease}.feedback.incorrect{color:red;animation:shake 1s ease}@keyframes bounce{0%,to{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-60%) scale(1.2)}}@keyframes shake{0%{transform:translate(-50%,-50%) rotate(0)}25%{transform:translate(-50%,-50%) rotate(-10deg)}50%{transform:translate(-50%,-50%) rotate(10deg)}75%{transform:translate(-50%,-50%) rotate(-10deg)}to{transform:translate(-50%,-50%) rotate(0)}}.fade-out{animation:fadeOut .4s forwards}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.fade-in{animation:fadeIn .4s forwards}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@media screen and (min-width: 768px) and (max-width: 1023px){.answer-quiz{width:200px;padding:12px;font-size:1rem}.welcome{font-size:1.5rem}h1{font-size:2em}.question{margin:50px 0 20px;font-size:2.5rem}.alternative{padding-top:20px}.timer{width:120px;font-size:1.5rem}.flag-image{width:250px;height:170px}.game-over{height:35vh}.progress-bar{width:75%}.feedback{font-size:2rem;top:280px}}@media (min-width: 1024px){.answer-quiz{width:250px;padding:14px;font-size:1.5rem}.welcome{font-size:2rem}h1{font-size:2em}.progress-bar{width:60%}.timer{width:150px}.start-game-btn{font-size:3.5rem}.flag-image{width:300px;height:200px}.feedback{font-size:3rem;top:320px}.question{margin:50px 0 20px;font-size:3rem}}*{margin:0;padding:0;box-sizing:border-box}body{background-image:url(/MarilynQuiz/images/background.png);background-repeat:no-repeat;background-size:cover;background-position:center;background-color:#8d54c3;height:100vh;font-family:Arial Narrow Bold,sans-serif}section{display:flex;flex-direction:column;align-items:center;justify-content:center}h1{text-align:center;padding:20px}p{padding:5px;font-size:1.2rem}main{text-align:center}.answer-container{display:flex;flex-direction:column;align-items:center;justify-content:center;margin-top:20px}.answer-quiz{margin-top:10px;display:none;flex-direction:column;align-items:center;padding:12px;font-weight:700;text-align:center;border-radius:5px;cursor:pointer;background-color:#f0f0f0;color:#000;box-shadow:0 2px 4px #0003;transition:all .3s ease;justify-content:space-around}.answer-quiz:hover{transform:translateY(-2px);background-color:#ccc9c9}.answer-quiz:active{transform:scale(.95)}.answer-quiz input[type=radio]{display:none}.answer-quiz input[type=radio]:checked+.answer-quiz{background-color:#ccc9c9}.play-again-btn{display:block;padding:8px;margin-top:10px;font-size:1rem;width:200px;height:50px;font-weight:700;text-align:center;border-radius:5px;cursor:pointer;background-color:#14e014;color:#fff;border:none;box-shadow:0 2px 4px #0003;transition:all .3s ease}.play-again-btn:hover{background-color:#097a34;transform:scale(1.05)}.play-again-btn:active{background-color:#003f7f;transform:scale(.95)}input[type=radio]{display:none}input[type=radio]:checked+.answer-quiz{background-color:#5bb92b;color:#fff}.game-over{display:none;position:absolute;left:50%;top:50%;transform:translate(-50%,-70%);background-color:#fff;height:35vh;padding:50px;border-radius:5px;box-shadow:0 2px 4px #0003;flex-direction:column;justify-content:space-between}.game-over .result h2{font-size:2rem;margin-bottom:20px}.timer{justify-content:center;display:flex;box-shadow:1px 1px 6px 4px #e1c6ec99;margin:auto;position:relative;top:20px;border-radius:10px;border:#bc61e0 2px solid;display:none;background-color:#541559;font-family:Orbitron,sans-serif;color:#e1bfeb;text-align:center;letter-spacing:.2rem;padding:2px;font-size:1.2rem}.welcome{position:relative;top:45vh;padding:20px;margin:auto;width:100vw;background-color:#ed9dec;color:#fff}.start-game-btn{display:block;margin:auto;position:relative;top:50%;padding:8px;font-size:1rem;width:200px;height:50px;font-weight:700;text-align:center;border-radius:5px;cursor:pointer;background-color:#14e014;color:#fff;border:none;box-shadow:0 2px 4px #0003;transition:all .3s ease}.start-game-btn:hover{background-color:#097a34;transform:scale(1.05)}.start-game-btn:active{background-color:#003f7f;transform:scale(.95)}.question{display:none;color:#050505}.flag{display:none}.flag .flag-image{box-shadow:0 0 15px 10px #ffffff80}.flags-icon{position:absolute;left:50%;transform:translate(-50%);margin-top:10vh}.footer{position:fixed;bottom:0;width:100%;background-color:#222;color:#fff;display:flex;justify-content:space-between;padding:10px 20px;flex-direction:column;align-items:center}.progress-bar{position:relative;height:30px;background-color:#ff0;border-radius:10px;overflow:hidden;margin-bottom:10px;margin-right:10px;border:2px solid #a1d895}.progress{position:absolute;height:100%;width:0%;background-color:green;transition:width .5s ease}.progress-icon{position:absolute;top:20%;left:1.5%;transform:translate(-50%,-50%) scaleX(-1);transition:all .5s ease;transform-origin:center;font-size:2rem;z-index:1}.footer-content{display:flex;flex-direction:column;align-items:flex-end}.question-counter{margin-bottom:10px;font-size:1rem}.copyright{font-size:.7rem}button:focus,a:focus,input:focus,select:focus,textarea:focus,[tabindex]:focus{outline:2px solid #040404}