#navigateButton,.Navigationbar{top:50%;transform:translateY(-50%)}#cancel,#navigateButton,#rotateMessege>svg,#timeContainer>span,.selectedLevel{color:var(--mainColor)}#resultBlur,#startBlur,main{height:100%;width:100%}#ResultDetails,#questionHolder,.headerItems,main,main>section{box-sizing:border-box}:root{--mainColor:rgb(0, 123, 255);--mainColorFaded:rgba(0, 123, 255, 0.5);--WhiteColor:rgb(255, 255, 255);--WhiteColorFaded:rgba(255, 255, 255, 0.5);--BlackColor:rgb(0, 0, 0);--hoveEffect:0.5;--mainColorBorder:2px solid var(--mainColor)}*{font-family:Arial,Helvetica,sans-serif;padding:0;margin:0}button{cursor:pointer}body,html{height:100dvh;width:100vw;user-select:none;min-width:290px}body{display:flex;flex-direction:column;position:relative;-webkit-tap-highlight-color:transparent}.headerItems{width:100%;border-bottom:1px solid #d6d6d6;display:flex;align-items:center;justify-content:center;gap:clamp(1.5rem,5vw,4rem);padding:1rem}.level-buttons{display:flex;flex-wrap:wrap;gap:.3rem}.level-buttons>button{border:2px solid transparent;padding:5px 10px;border-radius:5px;flex:1}#submitPopup,main{flex-direction:column;display:flex}.selectedLevel{font-weight:700;background-color:#f0f7ff;border:var(--mainColorBorder)}#navigateButton,#startbtn,.blueButtons{background-color:var(--mainColor)}.blueButtons{color:var(--WhiteColor);border-radius:5px;border:none;padding:10px;text-wrap:nowrap;box-shadow:2px 2px 5px gray;font-size:large}#cancel,#questionNumbers>.buttons,#submitPopup,.Navigationbar{background-color:var(--WhiteColor)}#closResult,#quizInstructions button,#resultLevelButtons button,#submitPopup,.blueButtons,.buttons,.navArrowBtn{transition:.3s}#OptionContainer>li:hover,#closResult:hover,#quizInstructions button:hover,#resultLevelButtons button:hover,.blueButtons:hover,.buttons:hover,.level-buttons>button:hover{opacity:var(--hoveEffect)}#closResult:active,#quizInstructions button:active,#resultLevelButtons button:active,.blueButtons:active,.buttons:active,.level-buttons button:active{opacity:.3}#submitPopup{box-shadow:0 0 20px gray;padding:1rem 2rem;border-radius:10px;align-items:center;justify-content:center;gap:1rem;z-index:10;position:fixed;top:-100%;opacity:0}#popupButtons{margin-left:auto;display:flex;gap:1rem}#popupButtons button{padding:5px 10px;font-size:medium}main{align-items:center;justify-content:center}#rotateMessege{display:none;font-size:1.8rem}#rotateMessege>svg{width:5rem;height:5rem;vertical-align:middle}main>section{width:clamp(290px,90%,600px);display:flex;flex-direction:column;gap:clamp(.5rem,2vw,1rem);box-shadow:0 0 20px gray;padding:clamp(.5rem,5vw,2rem) clamp(1rem,5vw,2rem);border-radius:20px}#timeContainer>span{font-weight:bolder;font-size:small}#ResultLevel,#closResult svg{color:var(--WhiteColorFaded)}#questionHolder{width:100%;margin:1rem 0 0;background-color:#f1f1f1;padding:10px;border-radius:10px;display:flex;gap:20px;align-items:center}#Qnumber{font-weight:bolder}#question{font-weight:700;user-select:none;display:block;font-size:clamp(.9rem, 5vw, 1.2rem)}#OptionContainer{display:flex;flex-direction:column;gap:5px;padding-left:1.5rem;margin:clamp(1rem,5vw,2rem) 0 clamp(1rem,8vw,3rem)}#OptionContainer>li{background-color:#f0f0f0;padding:5px 10px;border-radius:10px;width:fit-content;min-width:40%;align-items:center;gap:1rem;font-size:clamp(.7rem, 3.9vw, 1rem);transition:.1s;cursor:pointer}#pageControler{width:100%;display:flex;flex-direction:row;align-items:center;justify-content:space-evenly;padding:2rem 0}#resultBlur,.Navigationbar{position:fixed;flex-direction:column}#pageControler>button{width:40%}.Navigationbar{right:0;padding:clamp(1rem,5vw,2rem) clamp(1.5rem,5vw,2rem);display:flex;gap:1rem;border-radius:10px 0 0 10px;box-shadow:0 0 10px #181818;border:2px solid var(--mainColor);border-right:none;transition:transform .5s,opacity .5s;transform:translateY(-50%) translateX(100%)}.Navigationbar.Close{transform:translateY(-50%) translateX(0)}#questionNumbers{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(.5rem,3vw,1rem)}#questionNumbers>.buttons{color:var(--mainColor);border-radius:5px;border:2px solid transparent;box-shadow:0 0 10px gray;font-weight:700;font-size:clamp(.9rem, 5vw, 1.3rem);padding:10px}.Navigationbar>h3{font-size:2rem;text-align:center;width:100%;border-bottom:2px solid #bcbcbc;padding-bottom:10px}#navigateButton{position:absolute;right:100%;box-shadow:none;z-index:0;border:none;border-radius:10px 0 0 10px;padding:30px 0}.navArrowBtn{color:#f0f0f0;width:2rem;filter:drop-shadow(0px 1px 5px rgba(0, 0, 0, .4));transform:rotateZ(0)}.navArrowBtnclose{transform:rotatez(-180deg)}#startBlur{position:absolute;top:0;left:0;z-index:10;background-color:rgba(12,12,12,.8);display:flex;align-items:center;justify-content:center}#startbtn{color:var(--WhiteColor);box-shadow:2px 2px 10px #ababab;outline:0;border:none;font-size:1.5rem;font-weight:bolder;padding:20px}#startbtn:active{box-shadow:2px 2px 50px #ababab}#resultBlur{top:0;left:0;background-color:rgba(0,0,0,.718);align-items:center;justify-content:center;gap:2rem;display:none;z-index:9999}#ResultDetails{display:flex;flex-direction:column;gap:1rem;width:90%;max-width:400px;background:linear-gradient(to top left,var(--mainColor) 45%,#004288 85%,#002041);padding:3rem 2rem;border-radius:10px;color:var(--WhiteColor);position:relative}#closResult{background-color:transparent;border:none;margin-left:auto;position:absolute;top:10px;right:10px;padding-right:10px}#closResult svg{width:2rem}#ResultDetails>h3{font-size:1.7rem}#ResultLevel{font-size:.8rem;font-weight:700}#resultLevelButtons{width:100%;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:clamp(1rem,5vw,1.5rem);margin:2rem 0 0}#resultLevelButtons button{border:none;color:var(--WhiteColor);font-weight:700;font-size:clamp(.8rem, 3vw, 1rem);padding:5px;border:2px solid var(--WhiteColorFaded);border-radius:5px;background-color:rgba(255,255,255,.2)}#attemepedAnswers{color:#d6d6d6}#correctAnswers{color:#abf1ab}#wrongAnswers{color:#f59494}.correctAnswer{background-color:#d0ffd0!important;color:green!important}.selectedAnswer{background-color:#d7eaff!important;color:var(--mainColor)!important}.WrongAnswer{background-color:#ffd7d7!important;color:red!important}.unAttempted{background-color:#d6d6d6!important;color:gray!important}.blinking{animation:2s ease-in-out infinite blink}.show{display:flex!important}.confirmSubmit{top:10%!important;opacity:1!important}.hide{display:none!important}.popupTimeOut{font-size:2rem;color:red}.focuseButton{animation:3s linear infinite highlightIT!important}@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}@keyframes RotatePhoneIcon{0%,100%{transform:rotateZ(0)}70%,90%{transform:rotateZ(-140deg)}}@keyframes highlightIT{0%{transform:scale(1);opacity:1}50%{transform:scale(.9);opacity:.5}100%{opacity:1;transform:scale(1)}}@media (hover:none){:root{--hoveEffect:1}}@media screen and (max-width:330px){main section{padding:1rem .5rem;gap:.2rem}#OptionContainer{margin:1rem 0}}@media screen and (max-height:450px){#resultBlur,#startBlur,#submitPopup,.Navigationbar,.instContainer,main>section{display:none!important}#rotateMessege{display:block}#rotateMessege>svg{animation:3s infinite RotatePhoneIcon}}@media screen and (min-width:1400px){.Navigationbar{transform:translateY(-50%) translateX(0);border-radius:10px;border:2px solid var(--mainColor)}#navigateButton{display:none}}