:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}*{margin:0;padding:0;width:99.9%}.navbarTitleContainer{padding-left:30px;width:200px;position:absolute;top:0;left:0;height:60px;display:flex;justify-content:space-between;align-items:center;background:transparent;z-index:1000}.navbarTitle{cursor:pointer;display:flex;align-items:center;font-family:Comic Sans MS,Arial,sans-serif;font-size:40px;font-weight:700;background:linear-gradient(45deg,#ff6ec4,#7873f5,#42f5e6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:2px;-webkit-text-stroke:1px white}.navbarTitle:hover{text-shadow:2px 2px 5px rgb(252,120,252),0 0 10px rgb(115,253,253)}.container{display:flex;flex-direction:column}.registrationBtn{display:flex;align-items:center;justify-content:end;margin:30px 0}.profile{position:relative;cursor:pointer;width:50px}.avatar{width:45px;height:45px;border-radius:50%;background:#58cc02;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:20px}.profileMenu{position:absolute;top:55px;right:0;background:#fff;border-radius:12px;padding:12px;min-width:180px;box-shadow:0 4px 20px #00000026;z-index:1000}.profileMenu p{margin-bottom:10px;font-weight:600}.profileMenu button{width:100%;padding:8px;border:none;border-radius:8px;cursor:pointer}.loginBtn,.signUpBtn,.exitBtn{background-color:#cf25a5;color:#fff;width:120px;height:40px;text-align:center;font-size:20px;margin:0 30px;border:none;border-radius:10px;cursor:pointer;display:flex;justify-content:center;align-items:center;gap:8px;transition:background-color .2s ease;box-shadow:0 4px 6px #000000e6}.loginBtn:hover,.signUpBtn:hover{background-color:#45a049}.signupRedirect{margin-top:18px;display:flex;justify-content:center;align-items:center;gap:6px;font-size:14px;color:#666}.signupLink{background:none;border:none;color:#09028d;font-weight:600;cursor:pointer;padding:0;font-size:20px;transition:color .2s}.signupLink:hover{color:#3730a3;text-decoration:underline}.mainPagecontainer{display:flex;justify-content:space-between;padding-bottom:80px}.mini_container_right{width:30%;padding:10px}.mini_container_left{width:auto;padding:10px 10px 10px 60px;background:url(/images/back6.jpg);background-position:center;background-size:cover}.tutorialsDiv,.menuDiv{display:flex;justify-content:center}.section1{height:500px;text-align:center;justify-content:center;display:flex;flex-direction:column;background-position:center;background-repeat:cover;width:55%;border:2px solid black}.header{padding:30px;font-size:70px;text-align:center;font-family:Comic Sans MS,Fredoka One,Luckiest Guy,sans-serif}h2{padding:20px;text-align:center;font-family:Comic Sans MS,Fredoka One,Luckiest Guy,sans-serif}.button_box,.header_box{align-items:center;width:100%;display:flex;flex-direction:column}.button1{width:350px;height:200px;margin:10px;background:url(/images/englishTutorials.jpg);background:linear-gradient(#0006,#0006),url(/images/englishTutorials.jpg);background-position:center;background-size:cover;border:5px solid white;overflow:hidden;color:#fff;font-size:35px;box-shadow:0 4px 10px #000;transition:all .2s ease;font-family:Comic Sans MS,Fredoka One,Luckiest Guy,sans-serif}.button2,.button3,.button4{width:250px;height:200px;margin:10px;border:5px solid white;overflow:hidden;color:#fff;font-size:35px;box-shadow:0 4px 10px #000;transition:all .2s ease;font-family:Comic Sans MS,Fredoka One,Luckiest Guy,sans-serif}.button2{background:url(/images/chatbot.jpg);background-position:center;background-size:cover}.button3{background:url(/images/grammar.jpg);background-position:center;background-size:cover}.button4{background:url(/images/games.jpg);background-position:center;background-size:cover}.button1:hover,.button2:hover,.button3:hover,.button4:hover{transform:translateY(-5px);box-shadow:0 8px 20px #0009;background-color:#ffea4d}.button1:active,.button2:active,.button3:active,.button4:active{transform:scale(.95);box-shadow:0 3px 8px #0006;background-color:#ffd800}video{margin-top:50px;height:500px}.reply_box{display:flex;height:450px;width:85%;margin-top:10px}.ai_reply_box{width:50%;height:450px;display:flex;padding:10px}.user_reply_box{padding:10px;width:50%;height:450px;align-items:end;display:flex}#ai_img{width:220px;height:230px;margin-top:220px;border-radius:50%;background-color:#e2e5e9}#user_img{width:220px;height:230px;margin-top:190px;border-radius:50%}.ai_speech{font-size:20px;background-color:#fff;width:fit-content;max-width:70%;height:200px;margin:10px;text-align:center;padding:25px 20px;border-radius:30%;position:relative;color:#0f0101;-webkit-text-stroke:1px #353030;font-family:Comic Sans MS,Fredoka One,Luckiest Guy,sans-serif;box-shadow:0 4px 10px #0000001a}.ai_speech:after{content:"";position:absolute;bottom:-12px;left:45px;width:0;height:0;border:11px solid transparent;border-top-color:#fff;filter:drop-shadow(0 3px 3px rgba(0,0,0,.1))}.user_speech-box{display:flex;flex-direction:column;align-items:center}.user_speech{font-size:20px;background-color:#fff;width:fit-content;max-width:70%;height:200px;margin-bottom:80px;text-align:center;padding:25px 30px;border-radius:30%;position:relative;color:#0f0101;-webkit-text-stroke:1px #353030;font-family:Comic Sans MS,Fredoka One,Luckiest Guy,sans-serif;box-shadow:0 4px 10px #0000001a}.recordbtn{background-color:#0d6efd;color:#fff;padding:12px 20px;border:none;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:.2s ease;width:150px;margin-bottom:20px}.btn:hover{background-color:#0b5ed7}.btn:active{transform:scale(.98)}.overlay{position:fixed;inset:0;background:#0000004d;z-index:999;display:flex;align-items:center;justify-content:center}.login-box,.login-box-signup{background-color:#24c816;border:15px solid rgba(255,255,255,.938);padding:30px;border-radius:30px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;width:450px;height:420px;position:relative;font-weight:700;color:#fff;font-size:30px;z-index:1000;box-shadow:0 20px 40px #00000040}.login-box-signup{height:520px}.formContainer{display:flex;flex-direction:column;align-items:center}.close-btn{position:absolute;top:-20px;right:-20px;background-color:#fdae04;border-radius:200px;text-align:center;width:65px;cursor:pointer;font-size:40px}.emaiInput{cursor:pointer;border:none;padding:20px;margin:10px;width:320px;border-radius:5px;font-size:25px;font-family:Comic Sans MS,Arial,sans-serif}.loginbutton{cursor:pointer;margin-top:10px;width:300px;height:70px;display:flex;align-items:center;justify-content:center;background-color:#2196f3;color:#fff;font-size:30px;border-radius:60px;font-family:Comic Sans MS,Arial,sans-serif;box-shadow:0 20px 40px #00000040}.forgotPass{cursor:pointer;margin-top:20px;font-size:20px}.loader{width:70px;aspect-ratio:1;background:radial-gradient(farthest-side,#ffa516 90%,#0000) center/16px 16px,radial-gradient(farthest-side,green 90%,#0000) bottom/12px 12px;background-repeat:no-repeat;animation:l17 1s infinite linear;position:relative}.loader:before{content:"";position:absolute;width:8px;aspect-ratio:1;inset:auto 0 16px;margin:auto;background:#ccc;border-radius:50%;transform-origin:50% calc(100% + 10px);animation:inherit;animation-duration:.5s}@keyframes l17{to{transform:rotate(1turn)}}footer{background-color:#5aeb06;width:auto}.footer-content{display:flex;justify-content:space-between;align-items:flex-start}.footer-left{margin:20px}.icon-footer{background-color:#fff;width:30px;height:30px;align-items:center;margin:10px}.linkedinLink,.githubLink{width:170px;height:50px;padding:0 7px;font-size:14px;border-radius:25px}.linkedinLink:hover{background-color:#5db0f3}.githubLink:hover{background-color:#474747}.fa-eye{margin:5px}.linkedinLink{background-color:#2196f3}.githubLink{background-color:#000}.footer-bottom{margin-top:25px;padding-top:20px;border-top:1px solid rgba(255,255,255,.2);text-align:center}@media(max-width:600px){body{font-size:14px}.video_section{height:auto;width:auto}.container{width:auto}.navbarTitle{font-size:25px}.button1,.button2,.button3,.button4{width:200px}.loginBtn,.signUpBtn{width:90px;height:35px;font-size:15px;margin:0 10px;gap:4px}.menuDiv{display:flex;flex-direction:column;align-items:center}.mini_container_right{display:none}}@media(max-width:1024px){body{font-size:15px}.container{width:auto}.navbarTitle{font-size:30px}.mainPagecontainer{width:auto;display:flex;flex-direction:column}.button1,.button2,.button3,.button4{width:230px}.loginBtn,.signUpBtn{width:100px;height:38px;font-size:15px;margin:0 20px}.mini_container_right{display:none}}.chat_container{background-color:#03fa03;height:700px;align-items:center;text-align:center;display:flex;flex-direction:column}.title{padding-top:20px;padding-bottom:20px}.mini_chat_container{width:100%;max-width:1000px;height:600px;background:#f8e91a;border-radius:18px;display:flex;flex-direction:column;overflow:hidden;border:1px solid #d6ddcd}.chat_header{height:45px;background:#5682a3;display:flex;align-items:center;flex-direction:column;color:#fff;padding:8px}.header_name{font-size:20px;font-weight:700}.chat_messages{width:auto;flex:1;padding:16px;overflow-y:auto}.ai_avatar{width:36px;height:36px;border-radius:50%;margin-right:8px}.user_avatar{width:36px;height:36px;border-radius:50%;margin-left:8px}.chat_msg_left{background:#fffc;margin:5px;border-radius:12px 12px 12px 0;width:auto;padding:5px 10px;display:flex;align-items:center}.chat_msg_right{color:#000;background:#4aff038f;display:inline-block;border-radius:12px 12px 0;width:51%;padding:5px 10px;display:flex;justify-content:flex-end;align-items:center}.audioBox{border:2px solid;width:100%}.chat_msg{border:2px solid black;padding:8px 5px;max-width:60%;font-size:15px;line-height:20px}.chat_input_box{width:auto;height:60px;background:#fff;display:flex;align-items:center;padding:0 10px;border-top:1px solid #dce2ea;gap:8px}.chat_input{flex:1;height:40px;padding:0 14px;border-radius:22px;border:1px solid #cbd3dd;outline:none;font-size:15px}.chat_send{width:42px;height:42px;border-radius:50%;background:#5682a3;color:#fff;border:none;font-size:18px;cursor:pointer;justify-content:center;display:flex}.topic_selection{display:flex;flex-direction:column;gap:10px;margin:12px 0;width:450px;align-items:center;background-color:#fff;border-radius:12px 12px 12px 0;padding:20px}.topic_selection p{font-size:20px;color:#0e0d0d;margin-bottom:6px;font-weight:700}.topic_button{min-width:160px;padding:10px 16px;font-size:15px;font-weight:600;border-radius:18px;border:none;cursor:pointer;background:linear-gradient(135deg,#6ee7ff,#8b5cf6);color:#fff;box-shadow:0 6px 16px #8b5cf640;transition:all .25s ease}.topic_button:hover{transform:translateY(-2px) scale(1.03);box-shadow:0 10px 24px #8b5cf659}.topic_button:active{transform:scale(.96)}.topic_button:focus{outline:none}.tutorials_container{width:100%;height:650px;background:url(/images/backgr.png);background-size:cover;background-position:center;border:2px solid black}.title_div{text-align:center;padding:30px 0;color:#0e168b;color:#0f0101;-webkit-text-stroke:1px #d4bbbb;font-family:Comic Sans MS,Fredoka One,Luckiest Guy,sans-serif}.lessons_mini_container{display:flex;width:100%;justify-content:flex-end}.tutorials_img{width:30%}.lessons_box{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;width:70%;padding-right:50px}.lesson_box{display:flex;width:350px;height:200px;margin:15px;box-shadow:0 4px 10px #000;border-radius:10%;padding:10px;cursor:pointer;transition:all .2s ease;background-color:#ff0;font-family:Comic Sans MS,Fredoka One,Luckiest Guy,sans-serif}.lesson_box:hover{transform:translateY(-5px);box-shadow:0 8px 20px #0009;background-color:#ffea4d}.lesson_box:active{transform:scale(.95);box-shadow:0 3px 8px #0006;background-color:#ffd800}.lesson__box_img{padding-top:110px}.grade_div{display:flex;justify-content:center;align-items:center;font-size:40px;font-weight:700}.gradeImg{height:200px}@media(max-width:768px){.lessons_container{height:auto}.lessons_mini_container{flex-direction:column;align-items:center}.lesson__box_img{width:60%;padding-top:20px}.lessons_box{width:100%;padding-right:0;justify-content:center}.lesson_box{width:80%;height:auto;flex-direction:column;text-align:center}.grade_div{font-size:30px}.gradeImg{height:150px}}@media(max-width:1024px){.lessons_container{height:auto}.lessons_box{width:100%;padding-right:0;justify-content:center}.lesson_box{width:35%;height:200px}.lesson__box_img{width:40%;padding-top:40px}}.grammarmaincontainer{height:700px}.grammarheaderContainer{width:auto;padding:10px;text-align:center;color:#2e03c7;font-size:20px;background-color:#f0ec02}.grammarHeader{width:auto;padding:40px}.grammarcontainer{display:flex;background-color:pink;align-items:center;justify-content:center}.video{margin:20px;border:2px solid black;color:#fff;font-size:50px;font-weight:700;width:600px;height:200px;overflow:hidden;text-align:center;border-radius:20px;box-shadow:0 4px 10px #000;-webkit-text-stroke:1px #0c0000;cursor:pointer;transition:all .2s ease;font-family:Courier New,Courier,monospace}.video:hover{transform:translateY(-5px);box-shadow:0 8px 20px #0009;background-color:#ffea4d}.video:active{transform:scale(.95);box-shadow:0 3px 8px #0006;background-color:#ffd800}@media(max-width:1024px){.grammarcontainer{align-items:center;flex-wrap:wrap;width:auto}.video{width:40%}}@media(max-width:768px){.grammarcontainer{flex-direction:column;align-items:center;width:auto}.grammarHeader{font-size:40px}.video{width:60%;margin:10px 0;height:40%}}@media(max-width:480px){.grammarHeader{padding:20px;font-size:28px}.grammarcontainer{flex-direction:column;align-items:center;width:auto}.grammarheaderContainer p{font-size:16px}.video{width:90%}.videoFrame{border:2px solid black}}.grade1Container{width:100%;height:650px;background-size:cover;background-position-x:center;background:url(/images/artoonn.png);display:flex;flex-direction:column;align-items:center;justify-content:center}.title_div{text-align:center;padding:40px 0;color:#0e168b;color:#0f0101;-webkit-text-stroke:1px #d4bbbb;font-family:Comic Sans MS,Fredoka One,Luckiest Guy,sans-serif}.lessons_container{display:flex;flex-wrap:wrap;justify-content:center;align-items:center}.lesson{position:relative;color:#fff;font-weight:700;font-size:35px;margin:20px 50px;width:180px;height:180px;background:url(/images/toys.png);background-position:center;background-size:cover;overflow:hidden;text-align:center;display:flex;justify-content:center;align-items:center;border-radius:20px;box-shadow:0 4px 10px #000;-webkit-text-stroke:1px #0c0000;cursor:pointer;transition:all .2s ease}.lesson:hover{transform:translateY(-5px);box-shadow:0 8px 20px #0009;background-color:#ffea4d}.lesson:active{transform:scale(.95);box-shadow:0 3px 8px #0006;background-color:#ffd800}.dropdown{display:flex;width:300px;margin:0;overflow:hidden;max-height:0;opacity:0;transform:translateY(-15px);transition:max-height .5s ease,opacity .35s ease,transform .35s ease}.dropdown.open{max-height:200px;opacity:1;transform:translateY(0)}.lessonItem{margin:5px;padding:15px;text-align:center;border-bottom:1px solid #eee;transition:.2s;box-shadow:0 4px 10px #000;-webkit-text-stroke:1px #0c0000;cursor:pointer;transition:all .2s ease;border-radius:20px;background-color:#fff}.lessonItem:last-child{border-bottom:none}.lessonItem:hover{background:#f5f5f5}.unit{width:280px;margin:20px;display:flex;flex-direction:column;align-items:center}.lessonsPageContainer{width:100%;height:auto;display:flex;flex-direction:column;justify-content:center;align-items:center}.titleContainer{padding-top:45px}.title{margin:15px 0;width:700px;padding-left:50px;font-size:35px;background-color:#f88484}.lessonBigContainer{background-size:cover;background-position-x:center;background:url(/images/artoon2.png);width:100%;height:auto;display:flex;justify-content:center;align-items:center;flex-direction:column}.lessonContainer{height:auto;display:flex}.page{display:flex;margin-top:20px;align-items:center;flex-direction:column}.screen{display:flex;flex-direction:column;height:550px;background-color:#f5f3f3;border-radius:15px;overflow:hidden;width:70%;box-shadow:0 0 30px #000000b3,inset 0 0 10px #fff3;position:relative;aspect-ratio:16 / 9}.loader{width:50px;aspect-ratio:1;border-radius:50%;background:#25b09b;--_m: conic-gradient(#0000 10%, #000), linear-gradient(#000 0 0) content-box;-webkit-mask:var(--_m);mask:var(--_m);-webkit-mask-composite:source-out;mask-composite:subtract;animation:l3 1s infinite linear}@keyframes l3{to{transform:rotate(1turn)}}.lessonImageContainer{position:relative;display:flex;width:100%;height:100%;justify-content:center;align-items:center;border:2px solid black}.lessonVideo{display:block;width:100%;height:100%;object-fit:cover;margin:0;padding:0}.lessImage{width:99%;height:99%;border:2px solid black}@media(max-width:768px){.screen{width:80%;height:350px}.lessImage{width:100%;height:100%;object-fit:cover}}@media(max-width:992px){.screen{width:90%;height:350px}.lessImage{width:100%;height:100%;object-fit:cover}}@media(max-width:1200px){.screen{width:85%}.lessImage{width:100%;height:100%;object-fit:cover}}.videoOverlay{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;pointer-events:none;z-index:2}.bigPlayButton{width:80px;height:80px;background-color:#ffffff4d;border-radius:50%;display:flex;justify-content:center;align-items:center;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:2px solid rgba(255,255,255,.5);box-shadow:0 4px 15px #0003;transition:all .3s ease}.bigPlayButton:after{content:"";display:block;width:0;height:0;border-style:solid;border-width:15px 0 15px 25px;border-color:transparent transparent transparent rgba(255,255,255,.8);margin-left:5px}.screen:hover .bigPlayButton{background-color:#ffffff80;transform:scale(1.05)}.videoOverlay.hidden{display:none}.btnCont{margin-bottom:50px;display:flex;justify-content:space-around}.speakBtn{background-color:#4caf50;color:#fff;height:70px;text-align:center;font-size:20px;border:none;border-radius:10px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:background-color .2s ease;box-shadow:0 4px 6px #000000e6}.speakBtn.recording{background-color:#e53935;animation:pulse 1s infinite}.speakBtn{display:flex;justify-content:center;width:160px}.speakBtn:hover{background-color:#45a049}.speakBtn.recording:hover{background-color:#e53935}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}.speakBtn:disabled{background-color:#9e9e9e!important;color:#fff!important;opacity:.5!important;cursor:not-allowed!important;box-shadow:none!important}.quizContainer{width:auto;height:auto;display:flex;flex-direction:column;align-items:center;background-color:#f1f1b1}.quizImgContainer{margin-top:50px;width:40%}.quizForm{display:flex;flex-wrap:wrap;justify-content:center;margin-bottom:50px}.question{border:2px solid black;font-size:20px;border-radius:20px;margin:10px;width:300px;height:280px;padding:10px;box-shadow:0 4px 10px #000;transition:all .2s ease;font-family:Comic Sans MS,Fredoka One,Luckiest Guy,sans-serif}.questionCondi{text-align:center;height:30%}.options{display:flex;flex-direction:column;height:65%}.option_input{margin:20px;width:20px;height:15px}.option_label{border:2px solid black;border-radius:20px;transition:all .2s ease;cursor:pointer;margin-top:5px}.option_label:hover{transform:translateY(-5px);box-shadow:0 8px 20px #0009;background-color:#ffea4d}.option_label:active{transform:scale(.95);box-shadow:0 3px 8px #0006;background-color:#ffd800}.option_label.selected{background-color:#ffea4d;border-color:#d4b000;transform:translateY(-2px);box-shadow:0 5px 15px #0006}.submitBtnCont,.score{text-align:center}.score{align-items:center;justify-content:center;display:flex;flex-direction:column}.scoreHeader{width:300px;height:100px;margin:20px;align-items:center;justify-content:center;display:flex}.submitBtn{margin:20px;background-color:#4caf50;color:#fff;font-size:20px;border:none;cursor:pointer;width:300px;height:80px;gap:8px;transition:background-color .2s ease;box-shadow:0 4px 6px #000000e6}@media(max-width:1024px){.screen{border-width:10px}.titleContainer{text-align:center}.title{width:80%;font-size:28px;height:80px;padding:0;display:flex;align-items:center;justify-content:center}.transcriptionPart{padding-top:50px;font-size:12px}.lessonImage{width:200px;object-fit:contain}}@media(max-width:900px){.screen{border-width:8px}.titleContainer{text-align:center}.title{width:80%;font-size:28px;height:80px;padding:0;display:flex;align-items:center;justify-content:center}.lessonImageContainer{width:auto}.lessonImage{width:15px;object-fit:contain}.character{width:auto}.teacherImg{width:200px}.transcriptionPart{padding-top:100px;font-size:10px}.lessonImage{width:180px;object-fit:contain}}@media(max-width:600px){.lessonsPageContainer{width:auto}.lessonContainer{display:grid;justify-content:center;align-items:center}.titleContainer{text-align:center}.title{width:80%;font-size:28px;height:80px;padding:0;display:flex;align-items:center;justify-content:center}.lessonImageContainer{width:auto}.lessonImage{width:15s0px;object-fit:contain}.transcriptionPart{padding-top:50px;font-size:12px}.recordButton{width:180px;font-size:18px}}.gamesmaincontainer{height:650px}.headerContainer{width:auto;display:flex;font-family:Courier New,Courier,monospace;text-align:center;font-size:50px;padding:20px;background-color:#02b902}.gamescontainer{height:430px;display:flex;background-color:pink;align-items:center;justify-content:center}.game{margin:80px;padding:80px;border:2px solid black;color:#fff;font-size:50px;font-weight:700;width:180px;height:180px;background:url(/images/toys.png);background-position:center;background-size:cover;overflow:hidden;text-align:center;border-radius:20px;box-shadow:0 4px 10px #000;-webkit-text-stroke:1px #0c0000;cursor:pointer;transition:all .2s ease;font-family:Courier New,Courier,monospace}.game:hover{transform:translateY(-5px);box-shadow:0 8px 20px #0009;background-color:#ffea4d}.game:active{transform:scale(.95);box-shadow:0 3px 8px #0006;background-color:#ffd800}*{padding:0;margin:0}main{background-repeat:no-repeat;background-size:cover;background-position:center;width:100%;height:580px;display:flex;justify-content:center;align-items:center}.back-container{display:flex;justify-content:center;align-items:center;background-color:#fff;width:900px;border:10px solid rgb(165,165,165);height:98%;border-radius:30px}.findWordContainer{background-image:url(/images/container.png);background-position:center;background-repeat:no-repeat;background-size:cover;width:800px;border:4px double rgb(165,165,165);height:90%;border-radius:30px;display:flex;justify-content:center;align-items:center;flex-direction:column;opacity:1;transition-duration:.7s}.container.fade{opacity:0}.titleImg{width:400px}.startbtn{width:300px;height:100px;color:#fff;font-weight:700;font-size:40px;border-radius:30px;margin:20px;background-color:#fd7171;border:none;transition:all .2s ease;font-family:Cambria,Cochin,Georgia,Times,Times New Roman,serif}.startbtn:hover{transform:translateY(-5px);box-shadow:0 8px 20px #0009;background-color:#f0b9b9}.startbtn:active{transform:scale(.95);box-shadow:0 3px 8px #0006;background-color:#f0b9b9}.part1,.part2{width:100%;height:50%;display:flex;justify-content:center;align-items:center}.part2{flex-direction:column}.abtn,.bbtn,.cbtn{width:200px;height:200px;background-color:#add8e6;border-radius:30px;margin:20px;border:2px solid gray;cursor:pointer;padding:10px;display:flex;justify-content:center;align-items:center;position:relative}.quest,.retry{width:500px;height:80px;background-color:#add8e6;border-radius:30px;margin:20px;border:2px solid gray;font-size:60px;font-family:Cambria,Cochin,Georgia,Times,Times New Roman,serif;font-weight:700;text-align:center}.countQw{width:200px;height:80px;background-color:#add8e6;border-radius:30px;margin:20px;border:2px solid gray;font-size:60px;font-family:Cambria,Cochin,Georgia,Times,Times New Roman,serif;font-weight:700;text-align:center}.abtn:hover,.bbtn:hover,.cbtn:hover{background-color:#fff;width:201px;height:201px}.right{background-color:green;border:2px double gray;border-radius:50%;width:50px;height:50px;position:absolute;right:10px;bottom:1px;visibility:hidden}.wrong{background-color:red;border:2px double gray;border-radius:50%;width:50px;height:50px;position:absolute;right:10px;bottom:1px;visibility:hidden}.aimg,.bimg,.cimg{width:200px;height:150px}.end,.result{text-align:center;font-size:100px;color:red;width:100%;height:100%;font-family:Cambria,Cochin,Georgia,Times,Times New Roman,serif;display:flex;justify-content:center;align-items:center}.retry{width:400px;height:130px;background-color:#fdd589;border-radius:30px;margin:20px;border:2px solid gray;font-size:60px;font-family:Cambria,Cochin,Georgia,Times,Times New Roman,serif;font-weight:700;text-align:center}.retry:hover{background-color:#ffeecf}@media(max-width:1024px){main{height:auto;min-height:100vh;padding:20px 0}.back-container{width:95%;height:auto;padding:20px 0}.findWordContainer{width:95%;height:auto;padding:30px 0}.titleImg{width:320px}.startbtn{width:240px;height:80px;font-size:32px}.part1{flex-wrap:wrap}.abtn,.bbtn,.cbtn{width:170px;height:170px;margin:10px}.aimg,.bimg,.cimg{width:140px;height:110px}.quest{width:90%;font-size:42px;height:70px}.countQw{width:180px;height:70px;font-size:40px}.retry{width:300px;height:90px;font-size:40px}.result,.end{font-size:70px}}@media(max-width:768px){main{height:auto;min-height:100vh;padding:15px 0}.back-container{width:98%;height:auto;border-width:6px;border-radius:20px}.findWordContainer{width:97%;height:auto;padding:20px 0;border-radius:20px}.titleImg{width:220px}.startbtn{width:180px;height:60px;font-size:24px;border-radius:18px}.part1{flex-direction:column;height:auto}.part2{height:auto}.abtn,.bbtn,.cbtn{width:150px;height:150px;margin:8px 0;border-radius:20px}.aimg,.bimg,.cimg{width:110px;height:90px}.quest{width:90%;height:60px;font-size:30px;margin:10px 0}.countQw{width:120px;height:55px;font-size:28px;margin:10px 0}.retry{width:220px;height:70px;font-size:30px}.result,.end{font-size:48px;padding:20px}.right,.wrong{width:35px;height:35px;right:8px;bottom:8px}}@media(max-width:480px){.titleImg{width:180px}.startbtn{width:160px;height:55px;font-size:20px}.abtn,.bbtn,.cbtn{width:130px;height:130px}.aimg,.bimg,.cimg{width:90px;height:70px}.quest{font-size:24px;height:50px}.countQw{width:100px;height:45px;font-size:24px}.retry{width:180px;height:60px;font-size:24px}.result,.end{font-size:36px}}.admin-login-page{height:100vh;display:flex;justify-content:center;align-items:center;background:#f4f6fb}.admin-login-box{width:380px;background:#fff;padding:40px;border-radius:12px;box-shadow:0 5px 20px #00000026}.admin-login-box h1{text-align:center;margin-bottom:10px}.admin-login-box p{text-align:center;color:gray;margin-bottom:25px}.admin-login-box form{display:flex;flex-direction:column;gap:14px}.admin-login-box input{padding:14px;border:1px solid #ccc;border-radius:8px;font-size:16px}.admin-login-box button{padding:14px;border:none;background:#2b7cff;color:#fff;border-radius:8px;cursor:pointer;font-size:16px}.admin-login-box button:hover{background:#1f63d6}
