#question,.header h1{letter-spacing:1px;font-weight:700}#nextButton,.header{padding:15px 30px;width:100%}body,html{overflow-x:hidden}body{font-family:Poppins,sans-serif;margin:0;background-image:url('https://www.pocketdriver.be/afbeeldingen/verkeerslab-oefenen-krijtbord-verkeersborden.webp');background-repeat:no-repeat;background-attachment:fixed;background-position:center;background-size:100% auto;color:#333;background-color:#f0f4f8}:root{--container-bg:#ffffff}.header{background-color:#1cb0f6;text-align:center;color:#fff;box-shadow:0 4px 8px rgba(0,0,0,.3),0 1px 2px rgba(0,0,0,.15);position:fixed;top:0;left:0;z-index:1000;border-radius:0}.header h1{margin:0;font-size:clamp(1.1rem, 4.5vw, 2.6em);line-height:1.25;text-shadow:1px 1px 3px rgba(0,0,0,.4);text-align:center}.header h1 i{vertical-align:middle;position:relative}.quiz-container{background-color:var(--container-bg);border-radius:10px;border:2px solid #000;padding:40px 50px;margin-top:100px;max-width:900px;width:100%;margin-left:auto;margin-right:auto;overflow:visible;position:relative;height:auto;min-height:calc(100vh - 120px)}.question-wrapper{display:flex;flex-direction:row;align-items:flex-start;gap:0;justify-content:center;flex-wrap:wrap}.professor-image{max-width:250px;height:auto;border-radius:0;flex-shrink:0}.question-content{flex:1;min-width:250px;margin-left:0}.status-bar{display:flex;justify-content:space-between;align-items:center;padding:12px 5px;background-color:#ecf0f1;border-radius:10px;border:2px solid #1cb0f6;margin-bottom:10px}#result,.status-item{flex-direction:column}.status-item{display:flex;line-height:1.1}.status-item:first-child{align-items:flex-start;margin-left:5px}.status-item:last-child{align-items:flex-end;margin-right:5px}.status-item:nth-child(2){align-items:center}.status-title{font-size:.65em;color:#555;font-weight:700;letter-spacing:.5px;margin-bottom:3px}#question-counter,#score{color:#1cb0f6;font-size:1.15em;font-weight:700}#timer{color:#1cb0f6;font-size:1.9em;font-weight:700}.question-image{max-width:70%;height:auto;margin:15px auto;border-radius:10px;display:block}img[src$=".jpg"]{border:2px solid #000}#result{display:none;position:relative;align-items:center;gap:15px;padding:10px;background-color:#f9f9f9;border-radius:5px;font-size:1.3em;margin-top:20px;overflow:hidden}#result.correct::before{content:"";position:absolute;top:0;left:-50%;width:50%;height:100%;background:linear-gradient(120deg,rgba(255,255,255,.3),rgba(255,255,255,.6),rgba(255,255,255,.3));transform:skewX(-20deg);animation:.5s linear shine;pointer-events:none}@keyframes shine{0%{left:-50%}100%{left:100%}}#result.correct{background-color:#b9f289;color:#5da223;border:2px solid #5da223}#result.incorrect{background-color:#ff4b4b;color:#fff;border:2px solid #a22323}.explanation-toggle{margin-top:5px;background:0 0;border:none;color:#5da223;font-weight:700;font-size:.8em;cursor:pointer;text-decoration:underline}.explanation-toggle:hover{transform:scale(1.05)}.explanation-box{display:none;color:#5da223;font-size:.9em;text-align:left;width:100%}#question{font-size:1.48em;color:#333;margin-bottom:0;text-align:center}li,p{line-height:1.6;margin-bottom:1em;text-shadow:1px 1px 2px rgba(0,0,0,.1)}#startScreen{display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:var(--container-bg);border-radius:10px;border:2px solid #000;padding:0 40px 40px;max-width:800px;margin:120px auto;box-shadow:0 8px 20px rgba(0,0,0,.2)}#startScreen .professor-image{margin-top:50px}#startScreen .question-wrapper{display:flex;align-items:flex-start;gap:20px;flex-wrap:wrap}#startScreen .question-wrapper .question-content{margin-top:40px;font-size:1.5em;line-height:1.6;color:#333;text-align:left}#startScreen .scoreboard{width:100%;margin-top:30px;border-radius:12px;border:1px solid #000;background-color:var(--container-bg);font-size:1.1em;padding:12px 16px;border-bottom:1px solid #333;border-right:1px solid #333}#startScreen .scoreboard th{background-color:#1cb0f6;color:#fff;font-weight:700;padding:12px 16px;border-bottom:2px solid #333;text-align:left}#startScreen .scoreboard td:last-child,#startScreen .scoreboard th:last-child,.scoreboard td:last-child,.scoreboard th:last-child{border-right:none}.scoreboard-wrapper{width:100%;overflow-x:auto}.scoreboard{min-width:600px}.difficulty-modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:9999;justify-content:center;align-items:center}.difficulty-content{background:#fff;padding:35px;border-radius:15px;text-align:center;box-shadow:0 8px 25px rgba(0,0,0,.3);min-width:320px}#nextButton,.start-btn{background-color:#76c802;box-shadow:0 6px #3b6401}.difficulty-content h2{margin-top:0;margin-bottom:25px;color:#333}.difficulty-btn{display:block;width:100%;margin:12px 0;padding:15px;font-size:1.1em;font-weight:700;color:#fff;border:none;border-radius:12px;cursor:pointer;transition:transform .2s,filter .2s}#nextButton,.option,.start-btn{font-size:1.2em;cursor:pointer}.difficulty-btn:hover{transform:scale(1.03);filter:brightness(1.1)}.difficulty-btn:active{transform:scale(.98)}.difficulty-btn[data-level=easy]{background-color:#28a745;box-shadow:0 5px #1e7e34}.difficulty-btn[data-level=medium]{background-color:#fd7e14;box-shadow:0 5px #c65d00}.difficulty-btn[data-level=hard]{background-color:#dc3545;box-shadow:0 5px #a71d2a}.difficulty-btn[data-level=all]{background-color:#1cb0f6;box-shadow:0 5px #0a74b9}.start-btn{color:#fff;border:none;border-radius:10px;padding:15px 40px;display:flex;align-items:center;justify-content:center;gap:10px;transition:background-color .2s,transform .2s;margin-top:30px}.start-btn:hover{background-color:#5da201;transform:scale(1.05)}.start-btn:active{background-color:#3b6401;transform:scale(1)}#options-container{display:flex;gap:20px;flex-wrap:wrap;justify-content:center}.option{flex:1 1 22%;min-width:180px;max-width:300px;margin:0;background-color:#fff;color:#333;border:3px solid #ddd;padding:12px 20px;border-radius:15px;box-sizing:border-box;box-shadow:0 6px #aaa;transition:background-color .3s,transform .2s,box-shadow .3s}.option:hover{background-color:#f9f9f9;transform:scale(1.05)}.option:active{background-color:#1cb0f6;color:#fff}.option.correct{background-color:#b9f289;color:#5da223;border:3px solid #5da223;box-shadow:0 6px #5da223}.option.incorrect{background-color:#ff4b4b;color:#fff;border:3px solid #a22323;box-shadow:0 6px #a22323}#nextButton{color:#fff;border:none;border-radius:15px;transition:background-color .3s,transform .2s;margin-top:25px}#reloadButton,.back-btn{position:fixed;right:20px;text-decoration:none;font-size:1.2em;align-items:center;gap:10px;z-index:1000;box-shadow:0 6px #0a74b9;background-color:#1cb0f6;color:#fff;display:flex}#nextButton:disabled{background-color:#b0b0b0;box-shadow:0 6px #585858;cursor:not-allowed}#nextButton:hover:enabled{background-color:#66b402;transform:scale(1.05)}#nextButton:disabled:hover{background-color:#a0a0a0;transform:scale(1.02)}#reloadButton{bottom:80px;padding:15px 40px;border-radius:10px;justify-content:center;outline:0;border:none}#reloadButton:hover,.back-btn:hover{background-color:#1294d6;transform:scale(1.1)}#reloadButton:active,.back-btn:active{background-color:#0a74b9}.back-btn{bottom:20px;padding:15px 25px;border-radius:10px;transition:transform .2s,background-color .2s}.end-wrapper,.scoreboard{background-color:var(--container-bg)}.scoreboard{width:100%;border-collapse:collapse;margin-top:0;border-radius:12px;border:1px solid #000;overflow:hidden;font-size:1.1em}.scoreboard td,.scoreboard th{padding:12px 16px;text-align:left;border-bottom:1px solid #333;border-right:1px solid #333}.scoreboard th{background-color:#1cb0f6;color:#fff;font-weight:700;border-bottom:2px solid #333}.final-score{font-size:1.5em;text-align:left;margin-top:10px;font-weight:700}.end-wrapper{display:flex;align-items:center;justify-content:center;gap:25px;margin-top:20px;padding:0;flex-wrap:wrap}.end-wrapper img{max-width:250px;width:auto;height:auto;border-radius:10px;flex-shrink:0}.end-content{flex:1 1 300px;display:flex;flex-direction:column;justify-content:center;gap:10px}.end-wrapper h2{font-size:1.8em;margin:0;color:#333;line-height:1.3}.end-wrapper h3.final-score{font-size:1.35em;font-weight:700;margin:0;color:#333}.end-wrapper p{font-size:1.05em;color:#777;margin:0;text-shadow:none}@media (max-width:1024px){body{min-height:100dvh;background-position:center;background-size:cover}.quiz-container{padding:25px;margin:120px auto 40px;min-height:auto;max-width:85%}#question{font-size:1.4rem;text-align:center;margin-bottom:15px}.question-wrapper{display:flex;flex-direction:row;align-items:flex-start;justify-content:center;gap:0;flex-wrap:nowrap}.professor-image{max-width:220px;flex-shrink:0}.question-content{flex:1;min-width:0}.question-image{max-width:80%;height:auto;display:block;margin-top:20px}#nextButton{display:block;margin:25px auto 0;width:100%}#reloadButton,.back-btn{right:20px;left:auto;width:auto}#reloadButton{bottom:80px}.back-btn{bottom:20px}}@media (min-width:1025px) and (max-height:900px){.quiz-container{margin-top:80px;padding:25px 40px;min-height:auto}.professor-image{max-width:170px}#question{font-size:1.35em;margin-bottom:10px}.status-bar{padding:8px 5px;margin-bottom:8px}#options-container{gap:12px}.option{padding:12px 20px;font-size:1.05em}#nextButton{margin-top:15px;padding:12px 30px}}@media (min-width:1025px) and (max-height:750px){.professor-image{max-width:120px}.quiz-container{margin-top:70px;padding:20px 35px}#question{font-size:1.2em}}@media (max-width:1024px) and (min-width:768px){.header h1{font-size:2em}#startScreen{padding-top:0;margin-top:120px!important;width:85%;max-width:800px;margin:120px auto}#startScreen .professor-image{margin-top:60px}}@media (max-width:600px){#startScreen,.quiz-container{background-color:transparent!important;border:none!important;max-width:92%}body{background-image:none!important;background-color:#fff!important;padding-bottom:20px;padding-top:0}.header{padding:10px 15px;position:static}.header h1{margin-bottom:0}.header h1 i{font-size:.75em}#startScreen{margin:15px auto 20px;min-height:auto;padding:15px 10px;box-shadow:none}.start-btn{width:100%;padding:15px;font-size:1.1em;margin-top:25px}#startScreen .question-wrapper{flex-direction:column;align-items:center;text-align:center;gap:5px}#startScreen .professor-image{max-width:150px;margin-top:0}#startScreen .question-wrapper .question-content{font-size:1.1em;margin-top:0;line-height:1.4}#startScreen .scoreboard-wrapper{margin:-15px 0 0;overflow-x:auto;padding:0}#startScreen .scoreboard{display:table;font-size:.9em;min-width:520px}#startScreen .scoreboard td,#startScreen .scoreboard th{padding:10px 8px;font-size:.85em}.quiz-container{padding:10px 15px;margin:12px auto 20px}.status-bar{padding:8px 10px;gap:6px}.status-title{font-size:.55em}.end-wrapper p,.status-item span:not(.status-title){font-size:.9em}#question-counter,#score{font-size:.95em}#timer{font-size:1.5em}.question-wrapper{flex-direction:row;justify-content:center;align-items:flex-start;gap:10px;flex-wrap:nowrap}.professor-image{max-width:100px;flex:0 0 auto}.option,.question-image{max-width:100%}#quiz-container .professor-image{max-width:130px}.question-content{flex:1;min-width:0}#question{font-size:1em;margin-bottom:10px}#options-container{flex-wrap:wrap;gap:10px;justify-content:center}.option{flex:1 1 100%;font-size:1em;padding:12px;min-height:44px;box-sizing:border-box}#result{font-size:1.05em;padding:8px 8px 4px;gap:8px;margin-top:10px}#nextButton,.end-wrapper h3.final-score{font-size:1em}#nextButton{margin:8px auto 0;display:block;width:100%;min-height:48px}.mobile-buttons{display:flex;gap:10px;margin:15px 15px 0}.mobile-buttons #reloadButton,.mobile-buttons .back-btn{position:static!important;inset:auto!important;flex:1;min-width:0;min-height:48px;box-sizing:border-box;justify-content:center;padding:15px 0;font-size:1em}.end-wrapper{flex-direction:column;align-items:center;text-align:center;gap:6px;margin-top:8px}.end-wrapper img{max-width:130px;margin:0 auto}.end-content{flex:none;display:flex;flex-direction:column;align-items:center;gap:4px;padding:0 0 12px}.end-wrapper h2{font-size:1em!important}.scoreboard-wrapper{overflow-x:auto}.scoreboard{font-size:.9em;min-width:300px}.scoreboard td,.scoreboard th{padding:6px 8px}}@media (max-width:380px){#quiz-container .professor-image,#startScreen .professor-image{max-width:110px}#question,#startScreen .question-wrapper .question-content{font-size:.95em}.quiz-container{padding:8px 10px;margin:10px auto 20px}.question-wrapper{flex-direction:column;align-items:center;text-align:center;gap:8px}.professor-image{max-width:90px}.status-bar{padding:6px 8px}.status-title{font-size:.5em}#timer{font-size:1.3em}.option{font-size:.95em;padding:12px 10px}.mobile-buttons{gap:8px;margin:20px 10px 0}.mobile-buttons #reloadButton,.mobile-buttons .back-btn{font-size:.9em;padding:12px 0}}