*{margin:0;padding:0;font-family:Afacad Flux,sans-serif}body{background-image:url(/assets/background-Cv1lpwX0.png);background-repeat:repeat;background-size:auto}.row{margin:0}.allPageContainer{padding:2vw}.header{box-shadow:0 2px 8px #d3d3d3;padding:10px 0;background-color:#fff;z-index:999;position:relative}.headerContainer img{width:100px}@media (max-width: 768px){.headerContainer img{width:70px}}@media (max-width: 768px){.headerButtonlar{text-align:center}}.hamburgerMenu{display:none;text-align:center}@media (max-width: 768px){.hamburgerMenu{display:block}}.headerButtonContainer{display:flex;justify-content:start;gap:1vw}@media (max-width: 768px){.headerButtonContainer{justify-content:center}}.headerContainer .row{width:100%;justify-content:space-between;align-items:center}.dropdownMenu{position:absolute;top:100%;left:0;width:100%;background-color:#fff;box-shadow:0 4px 6px #0000001a;transform:translateY(-20px);opacity:0;pointer-events:none;transition:transform .3s ease-in-out,opacity .3s ease-in-out;z-index:999}.dropdownMenu.open{transform:translateY(0);opacity:1;pointer-events:auto}.dropdownMenu ul{list-style:none;margin:0;padding:20px}.dropdownMenu ul li{padding:10px 20px;border-bottom:1px solid #f0f0f0}.dropdownMenu ul li a{text-decoration:none;color:#000;font-size:16px;display:block;text-align:center}.dropdownMenu ul li a:hover{background-color:#f9f9f9}.headerIconContainer{display:flex;text-align:center;justify-content:center;text-decoration:none}.rootContianer{display:flex;flex-direction:column;justify-content:space-between;min-height:100vh}.sideBar{background-color:#b6c9e0;border-right:1px solid gray}@media screen and (max-width: 768px){.sideBar{display:none}}.rootMiddle{flex-grow:1;height:100%}.rootContianer .row{padding:0;margin:0}.rootBody{margin:0;padding:0;display:flex;flex-direction:column;justify-content:space-between}.sideBarMenuContainer{display:flex;align-items:center;gap:1vw;background-color:#f0f0f0;padding:.5vw;border-radius:5px;cursor:pointer;transition:all .5s}.sideBarMenuContainer:hover{background-color:#c2c2c2}.sideBarMenuContainer span{font-size:1.2vw;color:#333;text-align:center}@media screen and (max-width: 1000px){.sideBarMenuContainer span{font-size:1.5vw}}.sideBarMenu{padding:.5vw;display:flex;flex-direction:column;gap:2vw;margin-top:1.7vw}.sideBarMenu a{text-decoration:none}.sideBarMenuContainer.active{background-color:#c2c2c2;border:1px solid #333}footer{background-color:#ffcfca;padding:2vw 0;width:100%;box-shadow:0 -2px 8px #d3d3d3;z-index:1}.footer{text-align:center}.footer div{text-align:center;color:#000}.footer a{color:#000;text-decoration:underline;font-weight:500}.cardLink,.homeCards{padding:2vw}.homeCards .row>div{display:flex;align-items:stretch;justify-content:center;margin-bottom:2vw}.homeCards .row>div a{color:#b6c9e0;font-weight:800}.home{margin:0}.hece{width:100%;display:flex;justify-content:center}.heceContainer{display:flex;flex-direction:column;align-items:center;gap:120px;margin-top:7vw;margin-bottom:160px;padding:24px;border-radius:8px;box-shadow:2px 2px 8px #d3d3d3,-2px -2px 8px #d3d3d3;background-color:#fff;width:80%}@media screen and (max-width: 600px){.heceContainer{margin-top:10vw}}.heceButtons{display:flex;gap:20px;flex-wrap:wrap;justify-content:center}@media screen and (max-width: 600px){.heceButtons button{font-size:3.5vw}}@media screen and (max-width: 288px){.heceButtons button{font-size:5vw}}.heceButtonGroupContainer{display:flex;flex-direction:column;gap:10px}.heceAllButtons{display:flex;flex-direction:column;gap:20px;align-items:center}.currentWord{font-size:5vw}@media screen and (max-width: 600px){.currentWord{font-size:11vw}}@media screen and (min-width: 600px) and (max-width: 820px){.currentWord{font-size:8vw}}.storyList{width:100%;text-align:center;display:flex;flex-direction:column;min-height:100vh}.banner{margin:0 auto;box-shadow:1px 1px 4px #d3d3d3,-1px -1px 4px #d3d3d3;margin-top:2vw;height:40vw;width:8vw}@media screen and (min-width: 821px) and (max-width: 1024px){.banner{margin-top:20vw}}@media screen and (min-width: 1024px) and (max-width: 1200px){.banner{margin-top:17vw}}@media screen and (min-width: 600px) and (max-width: 820px){.banner{margin-top:27vw}}@media screen and (max-width: 600px){.banner{margin-top:11vw}}@media screen and (max-width: 600px){.banner{display:none}}.bannerImg{width:100%;height:auto}.storyListContainer{text-align:start;margin:0 auto;margin-top:2vw;width:90%;box-shadow:2px 2px 8px #d3d3d3,-2px -2px 8px #d3d3d3;border-radius:8px;padding:16px;background-color:#fff;margin-bottom:50px}.listHeading{font-size:4vw;color:#808fa1}@media screen and (max-width: 600px){.listHeading{font-size:6vw}}@media screen and (min-width: 821px) and (max-width: 1024px){.listHeading{font-size:6vw}}@media screen and (min-width: 600px) and (max-width: 820px){.listHeading{font-size:6vw}}.storyListContainer a{font-size:1.5vw}@media screen and (max-width: 600px){.storyListContainer a{font-size:4vw}}@media screen and (min-width: 600px) and (max-width: 820px){.storyListContainer a{font-size:2.5vw}}@media screen and (min-width: 821px) and (max-width: 1024px){.storyListContainer a{font-size:2.5vw}}.storyListContainer tbody tr{font-size:1.5vw}@media screen and (max-width: 600px){.storyListContainer tbody tr{font-size:4vw}}@media screen and (min-width: 600px) and (max-width: 820px){.storyListContainer tbody tr{font-size:2.5vw}}@media screen and (min-width: 821px) and (max-width: 1024px){.storyListContainer tbody tr{font-size:2.5vw}}.storyListContainer tbody tr a{color:#666;font-weight:600;text-decoration:none}.storyListContainer thead th{font-size:1.5vw}@media screen and (max-width: 600px){.storyListContainer thead th{font-size:4vw}}@media screen and (min-width: 600px) and (max-width: 820px){.storyListContainer thead th{font-size:2.5vw}}@media screen and (min-width: 821px) and (max-width: 1024px){.storyListContainer thead th{font-size:2.5vw}}.chooseGrade{text-align:center}.storyBack{display:flex;flex-direction:column;width:100%;align-items:end;gap:50px;margin-bottom:50px}.storyBack span{align-self:center;text-align:center;color:red;font-size:1.5vw}@media screen and (min-width: 600px) and (max-width: 820px){.storyBack span{font-size:2vw}}@media screen and (max-width: 600px){.storyBack span{font-size:5vw}}.story-content{font-size:2vw;display:flex;flex-direction:column;align-items:center;background-color:#d3d3d3;border-radius:16px;margin-bottom:50px;padding:2vw}.story-content p{text-align:center}@media screen and (min-width: 600px) and (max-width: 820px){.story-content p{font-size:2vw}}@media screen and (max-width: 600px){.story-content p{font-size:5.5vw}}.story-content h2{text-align:center}.storyBody{background-color:#fff;box-shadow:2px 2px 8px #d3d3d3,-2px -2px 8px #d3d3d3;border-radius:8px;margin-top:2vw;padding:2vw;margin-bottom:160px}@media screen and (max-width: 600px){.storyBody{margin-bottom:0}}@media screen and (min-width: 1024px) and (max-width: 1200px){.storyBody{margin-top:18vw}}@media screen and (min-width: 821px) and (max-width: 1024px){.storyBody{margin-top:20vw}}@media screen and (min-width: 600px) and (max-width: 820px){.storyBody{margin-top:27vw}}@media screen and (max-width: 600px){.storyBody{margin-top:18vw}}.buttonContainer{display:flex;align-items:center;gap:16px}.buttonContainer span{color:#fff}@media screen and (min-width: 600px) and (max-width: 820px){.buttonContainer span{font-size:2vw}}@media screen and (max-width: 600px){.buttonContainer span{font-size:4vw}}.timerContainer{display:flex;flex-direction:column;gap:20px;align-items:center;margin-bottom:2vw}.timerContainer h4{font-size:4vw;text-align:center}.timeLeft{background-color:#d3d3d3;padding:16px;border-radius:8px}.storyClassList{background-color:#b6c9e0;box-shadow:2px 2px 8px #d3d3d3,-2px -2px 8px #d3d3d3;border-radius:8px;margin-top:2vw;padding:32px}@media screen and (min-width: 1024px) and (max-width: 1200px){.storyClassList{margin-top:18vw}}@media screen and (min-width: 821px) and (max-width: 1024px){.storyClassList{margin-top:20vw}}@media screen and (min-width: 600px) and (max-width: 820px){.storyClassList{margin-top:27vw}}@media screen and (max-width: 600px){.storyClassList{margin-bottom:11vw}}.metinOku .row{margin:0}.storyStudentName{font-size:2vw}@media screen and (max-width: 600px){.storyStudentName{font-size:5vw}}.wordCount{font-size:1vw}@media screen and (max-width: 600px){.wordCount{font-size:4vw}}.storyClassListItem{display:flex;flex-direction:column;align-items:stretch;gap:20px}.rozet{width:3vw}.classListAllContainer{display:flex;align-items:center}.storyClassListItem h4{font-size:1.5vw;align-self:center}.storyCreateList{text-align:center}@keyframes ornek{0%{color:red}50%{color:#ff0}to{color:#00f}}.storyCreateList h4{font-size:2vw;color:red;animation-name:ornek;animation-duration:6s;animation-iteration-count:infinite;animation-delay:2s}@media screen and (min-width: 600px) and (max-width: 820px){.storyCreateList h4{font-size:2vw}}@media screen and (max-width: 600px){.storyCreateList h4{font-size:4vw}}.storyCreateList a{text-decoration:none}.storyCreateList a div{font-size:1.5vw}@media screen and (min-width: 600px) and (max-width: 820px){.storyCreateList a div{font-size:2vw}}@media screen and (max-width: 600px){.storyCreateList a div{font-size:4vw}}.storyCreateList a span{font-size:5vw}.storyButton{display:flex;align-items:center;gap:20px}@media screen and (max-width: 600px){.storyButton{gap:10px}}.storyButton span{font-size:1.5vw}@media screen and (min-width: 600px) and (max-width: 820px){.storyButton span{font-size:2vw}}@media screen and (max-width: 600px){.storyButton span{font-size:4vw}}.result h5{font-size:2.5vw;text-align:center}@media screen and (min-width: 600px) and (max-width: 820px){.result h5{font-size:4vw}}@media screen and (max-width: 600px){.result h5{font-size:6vw}}.kelimetre{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:space-between}.kelimetreContainer{display:flex;flex-direction:column;align-items:center;gap:120px;margin-top:7vw;margin-bottom:160px;padding:24px;border-radius:8px;box-shadow:2px 2px 8px #d3d3d3,-2px -2px 8px #d3d3d3;background-color:#fff;width:80%}.kelimetreButtons{display:flex;gap:20px;flex-wrap:wrap;justify-content:center}.sinif{width:100%}.formContainer{background-color:#b6c9e0;padding:24px;border-radius:8px;box-shadow:2px 2px 8px #d3d3d3,-2px -2px 8px #d3d3d3;display:flex;flex-direction:column;align-items:stretch}@media screen and (min-width: 821px) and (max-width: 1024px){.formContainer{margin-top:20vw}}@media screen and (min-width: 1024px) and (max-width: 1200px){.formContainer{margin-top:17vw}}@media screen and (min-width: 600px) and (max-width: 820px){.formContainer{margin-top:25vw}}@media screen and (max-width: 600px){.formContainer{margin-top:50vw}}.classListListContainer{box-shadow:2px 2px 8px #d3d3d3,-2px -2px 8px #d3d3d3;border-radius:8px;font-size:2vw;background-color:#fff;margin-bottom:24px;display:flex;flex-direction:column;align-items:stretch;gap:24px;padding:24px}@media screen and (min-width: 821px) and (max-width: 1024px){.classListListContainer{margin-top:20vw}}@media screen and (min-width: 1024px) and (max-width: 1200px){.classListListContainer{margin-top:17vw}}@media screen and (min-width: 600px) and (max-width: 820px){.classListListContainer{margin-top:25vw}}@media screen and (max-width: 600px){.classListListContainer{margin-top:50vw}}.listGroup{padding:0;list-style-type:none}.listGroupItem{display:flex;justify-content:space-between;align-items:center;border:1px solid black;margin-bottom:8px;border-radius:8px;padding:8px}.editContainer{display:flex;gap:16px}.editContainer img:hover{cursor:pointer}.sinif h3{text-align:center;font-size:2vw;color:red}.sign{display:flex;justify-content:center;align-items:center;padding:20px 0}.signContainer{padding:2vw;display:flex;flex-direction:column;align-items:stretch;gap:2vw;width:50%;background-color:#ffcfca;border-radius:5px}@media (max-width: 768px){.signContainer{width:90%}}.signContainer h4{text-align:center;font-size:2vw;color:#666}@media (max-width: 768px){.signContainer h4{font-size:5vw}}.signContainer{text-align:center;font-size:1.3vw;color:#666}.signContainer span{cursor:pointer}@media (max-width: 768px){.signContainer span{font-size:5vw}}.terms{display:flex;flex-direction:column;gap:1vw;justify-content:center}.forgetBack a{text-decoration:none}.forgetBack{text-align:end}.signContainer a{font-size:1.5vw}@media (max-width: 1000px){.signContainer a{font-size:2vw}}@media (max-width: 768px){.signContainer a{font-size:2.5vw}}@media (max-width: 600px){.signContainer a{font-size:3vw}}@media (max-width: 500px){.signContainer a{font-size:4vw}}.error{min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:#fff}.error img{width:15%}.error h1{font-size:4vw}.error a{color:#333;text-decoration:none;font-size:2vw;background-color:#d3d3d3;padding:1vw;border-radius:5px}.gozGontainer{display:flex;flex-direction:column;gap:.5vw;align-items:center}.gozGontainer h3{text-align:center;font-size:1.5vw}@media screen and (max-width: 600px){.gozGontainer h3{font-size:5vw}}.gozImgContainer h2{text-align:center;font-size:2.5vw}@media screen and (max-width: 600px){.gozImgContainer h2{font-size:6vw}}.gozImgContainer,.gozImgContainer img{width:100%}.cevaplar{display:flex;gap:2vw;justify-content:center;text-align:center}.cevaplar span{font-size:1.6vw;cursor:pointer;padding:.5vw}@media screen and (max-width: 768px){.cevaplar span{font-size:3vw}}@media screen and (max-width: 600px){.cevaplar span{font-size:5vw}}.selected{background-color:#d3d3d3;border-radius:10px}.soru{font-size:2vw;text-align:center}@media screen and (max-width: 768px){.soru{font-size:3vw}}@media screen and (max-width: 600px){.soru{font-size:5vw}}.mantikHeader{font-size:3vw;text-align:center;color:red}@media screen and (max-width: 768px){.mantikHeader{font-size:4vw}}@media screen and (max-width: 600px){.mantikHeader{font-size:6vw}}.mantikContainer{display:flex;flex-direction:column;gap:4vw}.sorularContainer{display:flex;flex-direction:column;align-items:center;gap:2vw}.mantikButtonContainer{display:flex;gap:1vw}button:disabled{cursor:not-allowed}.tamamlandi{display:flex;flex-direction:column;gap:1vw;align-items:center;font-size:3vw}@media screen and (max-width: 768px){.tamamlandi{font-size:4vw}}@media screen and (max-width: 600px){.tamamlandi{font-size:6vw}}.soruNumaralari{display:flex;gap:5px;flex-wrap:wrap;justify-content:center}.soruNumaralari span{padding:.5vw;width:3vw;height:3vw;border-radius:50%;cursor:pointer;display:flex;justify-content:center;align-items:center;border:1px solid black}@media (max-width: 600px){.soruNumaralari span{width:4vw;height:4vw}}@media (max-width: 480px){.soruNumaralari span{width:5vw;height:5vw}}@media (max-width: 390px){.soruNumaralari span{width:7vw;height:7vw}}.soruActive{background-color:#d3d3d3}.soruNumaralari span.dogru{background-color:green;color:#fff}.soruNumaralari span.yanlis{background-color:red;color:#fff}.cevapVerildi{font-weight:900;text-decoration:line-through}.cerez a{text-decoration:none;color:#b6c9e0;font-weight:700}.cerez h3{text-align:center}.cerez p span{font-weight:700}.cerez p{text-align:center}.cerezButton{text-align:end}