@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@200;400;700&display=swap);:root{--hijau:#0cca98;--merah:#e2125d;--unguCerah:#5e366a;--ungu:#462653;--unguGelap:#331940}*{font-family:Poppins;margin:0;padding:0;-webkit-user-select:none;user-select:none}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#fff}.App{background:linear-gradient(235.93deg,#5e366a 17.18%,#331940 120.05%);display:block;height:calc(100vh - 60px);padding:30px}@media (max-width:900px){.App{height:100vh;padding:0;width:100vw}}.pemisah{height:20px}select{border-radius:7px;padding:1px 5px}.tmb-lonjong{background:var(--hijau);border-radius:50px;box-shadow:0 0 10px rgba(0,0,0,.7);color:#fff;cursor:pointer;font-weight:700;margin:3px;padding:5px 20px;text-decoration:none;transition:.2s}.tmb-lonjong:hover{background:#fff;color:var(--ungu);transition:.2s}.tmb-lonjong.ungu{background-color:var(--ungu);border:1px solid #fff;transition:.2s}.tmb-lonjong.ungu:hover{background-color:#fff;color:var(--ungu);transition:.2s}.tmb-lonjong:disabled{background-color:var(--ungu);color:#838383}.panjang{padding:5px 55px}.tmb-kotak-jwb{background-color:var(--ungu);border-radius:7px;box-shadow:0 0 7px rgba(0,0,0,.7);color:#fff;cursor:pointer;display:block;font-weight:700;padding:5px 20px;text-align:center;transition:.2s;width:100px}.tmb-kotak-jwb:hover{background:#fff;color:var(--ungu);transition:.2s}.tmb-kotak{background-color:var(--hijau);border-radius:7px;box-shadow:0 0 10px rgba(0,0,0,.7);color:#fff;cursor:pointer;display:block;font-weight:700;margin:0 3px;padding:5px 20px;text-align:center;text-decoration:none;transition:.2s;width:100%}.tmb-kotak:hover{background:#fff;color:var(--ungu);transition:.2s}.tmb-kotak.ungu,.tmb-langkah.ungu{background-color:var(--ungu);cursor:default;transition:.2s}.tmb-kotak.ungu:hover,.tmb-langkah.ungu:hover{background-color:var(--ungu);color:#fff;transition:.2s}.langkah{width:100%}.tmb-langkah{background-color:var(--hijau);border-radius:7px;box-shadow:0 0 10px rgba(0,0,0,.7);color:#fff;cursor:pointer;display:block;margin:5px 5px 5px 0;padding:15px 25px;text-decoration:none;transition:.2s}.tmb-langkah i{font-size:30px}.tmb-langkah span:hover{color:var(--hijau)}.tmb-langkah:hover{background-color:#fff;color:var(--ungu);transition:.2s}#container-langkah{height:600px;overflow-y:scroll}@media (max-width:900px){#container-langkah{height:calc(100vh - 215px);margin-inline:10px}#beranda-pengajar .tmb-langkah{font-size:smaller}.ditengahkan-kolom-hp{align-items:center;display:flex;flex-direction:column;justify-content:center}}::-webkit-scrollbar{height:7px;width:7px}::-webkit-scrollbar-track{background:var(--ungu);border-radius:7px}::-webkit-scrollbar-thumb{background:#fff;border-radius:7px}::-webkit-scrollbar-thumb:hover{background:var(--hijau)}.putih{background-color:#fff;color:var(--hijau);transition:.2s}.putih:hover{background-color:var(--ungu);color:#fff;outline:1px solid #fff;transition:.2s}.merah{background-color:var(--merah);height:30px;margin-top:20px;padding:0;width:130px}.merah .rekam-teks{display:flex;justify-content:center;position:absolute;width:130px}.merah .rekam-teks.no-absolute{position:static}.merah .rekam-teks p{line-height:30px;text-align:center}.merah .rekam-bar{background-color:var(--merah);border-radius:7px;height:30px;max-width:100%;width:0}.merah:hover{background-color:#fff;color:var(--merah)}.merah.merekam{background-color:var(--hijau)}.merah.merekam:hover{color:#fff}.rekam-banyak,.rekam-soal-banyak{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.rekam-soal-banyak{display:flex;gap:10px}.rekam-soal-banyak>div{align-items:center;display:flex;flex-direction:column;width:100%}.rekam-soal-banyak>div>span{background-color:#fff;border-radius:50%;display:block;height:25px;width:25px}@media (max-width:900px){.tmb-kotak:hover{background-color:var(--hijau);color:#fff}.putih:hover{background-color:#fff;color:var(--hijau);outline:1px solid #fff;transition:.2s}.merah:hover{background-color:var(--merah)}.merah.merekam:hover{background-color:var(--hijau);color:#fff}}.ditengahkan-baris{align-items:center;display:flex;justify-content:space-between}.ditengahkan-kolom{align-items:center;display:flex;flex-direction:column;justify-content:center;padding:1px}.body{height:600px;margin-top:5px;width:100%}button{border:none;display:block;outline:none}.tekslink{color:var(--hijau);font-weight:700;text-decoration:none}.tekslink:hover{color:#fff}::-webkit-input-placeholder{color:#fff;opacity:.5}::placeholder{color:#fff;opacity:.5}:-ms-input-placeholder{color:#fff}::-ms-input-placeholder{color:#fff}.container-piano{display:flex;margin:auto;width:1020px}.container-piano .piano-putih{background-color:#fff;border:2px solid var(--ungu);border-radius:5px;color:var(--ungu);cursor:pointer;display:block;font-weight:700;height:100px;text-align:center;width:100%}.container-piano .piano-putih:hover{background-color:var(--hijau);color:#fff}.container-piano .piano-putih span{display:block;height:70px;width:100%}.container-piano .piano-hitam{background-color:#000;border:2px solid var(--ungu);border-radius:5px;color:#fff;cursor:pointer;display:block;font-size:10px;font-weight:700;height:60px;margin-right:-27px;position:relative;text-align:center;-webkit-transform:translateX(-50%);transform:translateX(-50%);width:50%}.container-piano .piano-hitam:hover{background-color:var(--hijau)}.container-piano .piano-hitam span{display:block;height:10px;width:100%}.jwbnTeks{background-color:transparent;border:2px solid #fff;border-radius:10px;color:#fff;outline:none;padding-block:3px;text-align:center;text-transform:uppercase}.list-siswa{margin-bottom:15px;width:80%}.list-siswa h2{background-color:var(--hijau);line-height:42px}.list-siswa h2,.list-siswa p{padding-left:10px}.sembunyikan{display:none}.eror{border-radius:7px;color:var(--merah);font-weight:700;text-align:center}.inputauth{margin-bottom:26px}.inputauth label{color:#fff;pointer-events:none;position:absolute;-webkit-transform:translate(-310px,8px);transform:translate(-310px,8px);transition:.5s;width:200px}.inputauth input{background-color:transparent;border-color:#fff;border-width:0 0 2px;color:#fff;height:40px;outline:none;padding-inline:10px;width:300px}.inputauth input:focus,.inputauth input:valid{background-color:transparent;border-color:var(--hijau)}.inputauth input:focus~label,.inputauth input:valid~label{color:var(--hijau);font-size:13px;font-weight:700;-webkit-transform:translate(-310px,-12px);transform:translate(-310px,-12px);transition:.5s}#daftar,#masuk{height:calc(100vh - 166px)}@media (max-width:900px){.inputauth{margin-bottom:20px}.inputauth input{width:250px}.inputauth label{-webkit-transform:translate(-260px,8px);transform:translate(-260px,8px)}.inputauth input:focus~label,.inputauth input:valid~label{-webkit-transform:translate(-260px,-12px);transform:translate(-260px,-12px)}}header{background-color:var(--unguGelap);border-radius:7px;box-shadow:0 0 10px rgba(0,0,0,.7);display:block;padding:15px 0;width:100%}header>div{align-items:center;display:flex;justify-content:space-between;margin-inline:auto;max-width:936px;width:80%}header a{border-radius:50px;color:#fff;display:block;line-height:30px;margin-left:10px;padding:3px 10px;text-decoration:none;transition:.2s}header a:hover{color:var(--hijau);-webkit-transform:scale(1.2);transform:scale(1.2);transition:.2s}header a:active{background-color:#5e366a;transition:.2s}.expand{display:none}.expand i{display:inline}.expand input,.expand-item-bar{display:none}@media (max-width:900px){header{padding:8px 0}header img{height:40px;position:relative;-webkit-transform:translateY(5px);transform:translateY(5px)}.expand{display:block}.expand-item{display:none}.expand-item-bar{align-items:center;background-color:var(--ungu);box-shadow:0 5px 10px 0 rgba(0,0,0,.7);display:flex;height:50px;justify-content:space-around;overflow-y:hidden;position:absolute;right:0;top:73px;transition:.2s;width:100vw}.expand-item-bar.hide{height:0;transition:.2s}}.audioicon{cursor:pointer;transition:.1s}.audioicon:hover{-webkit-transform:scale(1.1);transform:scale(1.1);transition:.1s}.audioicon.no-hover img{height:60px}.audioicon.no-hover h1{font-size:40px;margin-left:-20px}.audioicon.no-hover:hover{-webkit-transform:scale(1);transform:scale(1)}.audioicon img{display:inline;margin:0}.audioicon h1{display:inline;font-size:100px;margin-left:-65px}@media (max-width:900px){.audioicon img{height:100px}.audioicon h1{font-size:70px;margin-left:-35px}}.latihan{display:flex;flex-direction:column;gap:3px;height:calc(100vh - 284px);margin-block:7px;margin-inline:auto;max-width:1025px}.latihan .bungkus-tmb-latihan{background:none;overflow-x:scroll}.latihan .container-tmb-sublatihan{margin-block:2px}.latihan .container-tmb-sublatihan,.latihan .isi{align-items:center;display:flex;justify-content:center}.latihan .isi{flex:1 1}.latihan .kiri{align-items:center;border:1px solid #fff;border-radius:7px;display:flex;height:100%;justify-content:center;width:40%}.latihan .kiri div{padding:60px}.latihan .kanan{height:100%;margin-left:20px;width:60%}.latihan .kanan .utama{height:calc(100% - 63px)}.latihan .kanan .penghitung,.waktu{font-weight:700}.latihan .kanan .border-barpenghitung{border:4px solid #fff;border-radius:50px;height:30px;width:100%}.latihan .kanan .barpenghitung{background-color:var(--hijau);border-radius:50px;height:30px;position:relative;-webkit-transform:translateY(-35px);transform:translateY(-35px);width:0}.latihan .dot{background-color:#fff;border-radius:50%;display:block;height:25px;margin-inline:7px;width:25px}.latihan .tmb-instruksi{position:absolute;-webkit-transform:translate(15px,60px);transform:translate(15px,60px)}.latihan .tmb-instruksi-noSub{position:absolute;-webkit-transform:translate(15px,16px);transform:translate(15px,16px)}.piano-div{overflow-x:scroll}.latihan-instruksi,.latihan-lulus{border:1px solid #fff;border-radius:7px;display:flex;flex-direction:column;height:calc(100vh - 173px);justify-content:center;margin-inline:auto;margin-top:7px;max-width:1025px}.latihan-instruksi>div,.latihan-lulus>div{margin-inline:auto;text-align:center;width:60%}.latihan-instruksi>div button,.latihan-lulus>div button,.latihan.quiz{margin-inline:auto}.latihan.quiz{height:calc(100vh - 173px);max-width:1025px}.latihan.quiz .kanan{height:80%;margin:auto;text-align:center;width:70%}@media (max-width:900px){.latihan-instruksi,.latihan-lulus{height:calc(100vh - 86px);margin-inline:10px}.latihan-instruksi>div,.latihan-lulus>div{width:80%}.latihan-instruksi .overflow-y{max-height:340px;overflow-y:scroll;width:100%}.latihan{height:calc(100vh - 197px)}.latihan .bungkus-tmb-latihan{margin-inline:auto;width:calc(100vw - 20px)}.latihan .container-tmb-sublatihan{justify-content:normal}.latihan .isi{flex-direction:column}.latihan .kiri{height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;width:calc(100vw - 20px)}.latihan .kiri div{padding:10px 20px}.latihan .kiri h1,.latihan .kiri p{font-size:smaller}.latihan .kanan{flex:1 1;margin:0;width:calc(100vw - 40px)}.latihan .tmb-instruksi{-webkit-transform:translate(15px,57px) scale(.9);transform:translate(15px,57px) scale(.9)}.latihan .tmb-instruksi-noSub{-webkit-transform:translate(15px,10px) scale(.9);transform:translate(15px,10px) scale(.9)}.piano-div{margin-inline:auto;width:calc(100vw - 20px)}.space-instruksi{display:block;height:35px}.latihan.quiz{height:calc(100vh - 86px)}}.cara-main{background-color:rgba(0,0,0,.9);height:calc(100vh - 60px);left:0;padding:30px;position:absolute;top:0;width:calc(100% - 60px);z-index:1}.cara-main h1,.cara-main p{margin-bottom:20px}.cara-main img{margin-inline:10px}.cara-main .icon-inline{display:inline;margin-block:0;margin-inline:10px}.cara-guna{align-items:center;border:1px solid #fff;border-radius:7px;display:flex;flex-direction:column;height:calc(100vh - 173px);margin-inline:auto;margin-top:7px;max-width:1025px;overflow-y:scroll}.cara-guna>div{padding-block:30px;width:90%}.cara-guna h1{margin-bottom:20px}.cara-guna h1,.cara-guna h2{line-height:40px;text-align:center}.cara-guna h2{color:var(--hijau);margin-bottom:10px}.cara-guna li,.cara-guna p{margin-bottom:15px}.cara-guna img{margin-inline:10px}.cara-guna .icon-inline{display:inline;margin-block:0;margin-inline:10px}@media (max-width:900px){.cara-main{font-size:smaller;overflow-y:scroll}.cara-guna{height:calc(100vh - 86px);margin-inline:10px}.cara-guna>div{padding-block:30px;width:80%}}.materi{display:flex;flex-direction:column;gap:3px;height:calc(100vh - 284px);margin-inline:auto;max-width:1025px}.materi .materi-isi{border:1px solid #fff;border-radius:7px;display:flex;flex:1 1;flex-direction:column;margin-bottom:10px;width:100%}.materi .materi-isi>div{align-items:center;display:flex;flex:1 1;padding:30px}.materi .materi-isi>p{background-color:#fff;border-radius:0 0 7px 7px;box-shadow:0 0 10px -5px rgba(0,0,0,.7);color:#331940;line-height:30px;padding-inline:10px;text-align:center}.materi-isi .margin-a{margin-bottom:10px}.materi-isi .margin-b{margin-bottom:20px}.materi-isi .highlight{background-color:var(--hijau)}.materi-isi .highlight,.materi-isi .highlight-ungu{border-radius:7px;font-weight:700;padding:5px 15px;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.materi-isi .highlight-ungu{background-color:var(--unguCerah)}.materi-isi .flex-row-col{align-items:center;display:flex;flex-direction:row;gap:10px}.materi-isi .container-bagi2{display:flex;gap:30px}.materi-isi .container-bagi2>div{width:50%}.materi input{background-color:transparent;border:2px solid #fff;border-radius:10px;color:#fff;outline:none;padding-block:3px;text-align:center;text-transform:uppercase}.materi-head i{display:none}.input-div{align-items:center;display:flex;margin-bottom:5px}.input-div p{display:inline-block;max-width:170px;width:50%}.input-div input{max-width:200px;width:50%}.input-div i{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.materi .pilgan label{cursor:pointer;display:flex;gap:7px;margin-bottom:2px}.materi .pilgan label input{display:none}.materi .pilgan label div{display:inline-block}.materi .pilgan label div i{display:block}@media (max-width:900px){.materi{height:calc(100vh - 197px);margin-inline:10px}.materi-isi h2,.materi-isi h3,.materi-isi p{font-size:smaller}.materi .materi-isi>div{padding:10px}.materi-head i{display:block}.materi-head p{display:none}.materi-isi .flex-row-col{flex-direction:column;gap:5px}.materi-isi .container-bagi2{flex-direction:column;gap:10px;height:450px;overflow-y:scroll}.materi-isi .container-bagi2>div{width:100%}.materi-isi .hilang{display:none}.materi .pilgan{display:flex;flex-direction:column;flex-wrap:wrap;height:180px;justify-content:center;width:calc(100% - 50px)}.materi .pilgan label{font-weight:700}}#welcome{align-items:center;display:flex;justify-content:center}#welcome>img{display:none}#welcome .kiri{z-index:1}#welcome .kanan,#welcome .kiri{align-items:center;display:flex;justify-content:center;width:50%}#welcome .kanan{z-index:0}#welcome img{-webkit-transform:translate(-100px,20px);transform:translate(-100px,20px)}.hiasan-versi-hp{display:none}@media (max-width:900px){#welcome{flex-direction:column;height:calc(100vh - 250px)}#welcome .kiri{display:block;width:80%}span{display:flex;flex-direction:column;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}#welcome .kanan{display:none}.hiasan-versi-hp{display:block;height:36px;position:relative;width:100vw}#welcome .hiasan-versi-hp img{position:absolute;-webkit-transform:translateY(-150px);transform:translateY(-150px);width:100vw}}.tentang{border:1px solid #fff;border-radius:10px;display:flex;flex-direction:column;gap:3px;height:calc(100vh - 213px);margin-block:7px;margin-inline:auto;max-width:1025px;overflow-y:scroll;padding:20px}.tentang img{margin:auto;margin-block:10px;max-width:300px}.tentang section{margin-bottom:10px}.tentang table{border-collapse:collapse;font-family:arial,sans-serif;width:100%}.tentang td,th{border:1px solid var(--unguGelap);padding:8px;text-align:left}.tentang tr:nth-child(2n){background-color:var(--unguCerah)}@media (max-width:900px){.tentang{font-size:smaller;height:calc(100vh - 126px);margin-inline:10px}.tentang img{-webkit-transform:scale(.7);transform:scale(.7)}}
/*# sourceMappingURL=main.1071abc2.css.map*/