@import url(https://fonts.googleapis.com/css2?family=Luckiest+Guy&family=Roboto&family=Staatliches&display=swap);@import url(https://fonts.googleapis.com/css2?family=Heebo:wght@300&display=swap);@import url(https://fonts.googleapis.com/css2?family=Heebo:wght@300&family=Lemonada&display=swap);.loader{background:#f7dfed;overflow:hidden;position:fixed;z-index:99999}.loader,.loader-inner{bottom:0;left:0;right:0;top:0}.loader-inner{height:60px;margin:auto;position:absolute;width:100px}.loader-line-wrap{animation:spin 2s cubic-bezier(.175,.885,.32,1.275) infinite;height:50px;overflow:hidden;transform-origin:50% 100%}.loader-line,.loader-line-wrap{box-sizing:border-box;left:0;position:absolute;top:0;width:100px}.loader-line{border:4px solid transparent;border-radius:100%;height:100px;margin:0 auto;right:0}.loader-line-wrap:first-child{animation-delay:-50ms}.loader-line-wrap:nth-child(2){animation-delay:-.1s}.loader-line-wrap:nth-child(3){animation-delay:-.15s}.loader-line-wrap:nth-child(4){animation-delay:-.2s}.loader-line-wrap:nth-child(5){animation-delay:-.25s}.loader-line-wrap:first-child .loader-line{border-color:#eb4747;height:90px;width:90px;top:7px}.loader-line-wrap:nth-child(2) .loader-line{border-color:#ebeb47;height:76px;width:76px;top:14px}.loader-line-wrap:nth-child(3) .loader-line{border-color:#47eb47;height:62px;width:62px;top:21px}.loader-line-wrap:nth-child(4) .loader-line{border-color:#47ebeb;height:48px;width:48px;top:28px}.loader-line-wrap:nth-child(5) .loader-line{border-color:#4747eb;height:34px;width:34px;top:35px}@keyframes spin{0%,15%{transform:rotate(0)}to{transform:rotate(1turn)}}.first{color:#000;padding-top:10%;margin-left:100px;font-size:30px}.second{width:190px;margin-left:120px;margin-top:20px;border-radius:25px}.third{margin-left:-235px;margin-bottom:-80px}.fourth{float:right;margin-left:160px;margin-top:30px;width:90%;height:90%;overflow-y:scroll}.five{margin-top:90px;margin-left:210px}.par{background-color:rgba(209,180,235,.8980392156862745);box-shadow:5px 5px #9dd8f7,10px 10px #f98ebb,15px 15px #faf088;margin-left:850px;font-family:serif;font-weight:lighter;margin-top:-570px;font-size:15px;line-height:30px}.par,.part1{border-radius:5%;width:28%;height:500px}.part1{background-color:rgba(209,180,235,.8823529411764706);box-shadow:-5px 5px #9dd8f7,-10px 10px #f98ebb,-15px 15px #faf088;margin:150px 20px 66px 420px}.storyImage{width:250px;height:250px;margin:60px 20px 20px 50px;border-radius:4%}.imagest{width:210px;height:200px;margin-top:-50px;border-radius:4%}a:link{text-decoration:none}.infocardContainer *{font-weight:300}.infocardContainer{display:flex;height:200px;width:200px;border-radius:100px;background:#009fff;background:linear-gradient(121deg,hsla(0,0%,100%,0) 13%,#009fff);transition:all .5s ease-in;transition-delay:1s;--margin-top:100px;margin:60px auto auto 170px}.infocardContainer:hover{width:500px;border-radius:100px 10px 100px 100px;transition:all 1s ease-out}.infocardContainer div{text-color:#fff;flex-shrink:1;width:100%;--background-color:green}.infocardContainer div *{display:flex;--flex:inherit;overflow:hidden;text-overflow:hidden;--background-color:#ff0;color:#fff;white-space:nowrap;width:0;height:auto;transition:all .45s ease-in;transition-delay:1s}.infocardContainer:hover div *{--background-color:purple;display:flex;visibility:visible;transition:all 1s ease-out;transition-delay:.5s;width:100%;height:auto}.infocardContainer #main,.infocardContainer #main img{--background-color:red;height:200px;width:200px;padding-right:10px;border-radius:100%;flex-shrink:0;object-fit:cover}.infocardContainer #main img{height:180px;width:180px;transition:none;display:float;position:relative;border:10px solid #fff;margin:0;padding:0}.infocardContainer #textbois{position:relative}.infocardContainer #textbois #hotlinks{max-width:60%;max-height:30px;--background-color:#fff;position:absolute;bottom:5px;display:flex;justify-content:space-between;border-radius:13px}.infocardContainer #textbois #hotlinks *{background-color:#fff;max-width:30px;--margin:0 1px 0 1px;border-radius:25px}.infocardContainer2 *{font-family:"Fira Sans Condensed",sans-serif;font-weight:300}.infocardContainer2{display:flex;height:200px;width:200px;border-radius:100px;background:#009fff;background:linear-gradient(121deg,hsla(0,0%,100%,0) 13%,#009fff);transition:all .5s ease-in;transition-delay:1s;--margin-top:100px;margin:-190px auto auto 600px}.infocardContainer2:hover{width:500px;border-radius:100px 10px 100px 100px;transition:all 1s ease-out}.infocardContainer2 div{text-color:#fff;flex-shrink:1;width:100%;--background-color:green}.infocardContainer2 div *{display:flex;--flex:inherit;overflow:hidden;text-overflow:hidden;--background-color:#ff0;color:#fff;white-space:nowrap;width:0;height:auto;transition:all .45s ease-in;transition-delay:1s}.infocardContainer2:hover div *{--background-color:purple;display:flex;visibility:visible;transition:all 1s ease-out;transition-delay:.5s;width:100%;height:auto}.infocardContainer2 #main,.infocardContainer2 #main img{--background-color:red;height:200px;width:200px;padding-right:10px;border-radius:100%;flex-shrink:0;object-fit:cover}.infocardContainer2 #main img{height:180px;width:180px;transition:none;display:float;position:relative;border:10px solid #fff;margin:0;padding:0}.infocardContainer2 #textbois{position:relative}.infocardContainer2 #textbois #hotlinks{max-width:60%;max-height:30px;--background-color:#fff;position:absolute;bottom:5px;display:flex;justify-content:space-between;border-radius:13px}.infocardContainer2 #textbois #hotlinks *{background-color:#fff;max-width:30px;--margin:0 1px 0 1px;border-radius:25px}.infocardContainer3 *{font-family:"Fira Sans Condensed",sans-serif;font-weight:300}.infocardContainer3{display:flex;height:200px;width:200px;border-radius:100px;background:#009fff;background:linear-gradient(121deg,hsla(0,0%,100%,0) 13%,#009fff);transition:all .5s ease-in;transition-delay:1s;--margin-top:100px;margin:-190px auto auto 1015px}.infocardContainer3:hover{width:500px;border-radius:100px 10px 100px 100px;transition:all 1s ease-out}.infocardContainer3 div{text-color:#fff;flex-shrink:1;width:100%;--background-color:green}.infocardContainer3 div *{display:flex;--flex:inherit;overflow:hidden;text-overflow:hidden;--background-color:#ff0;color:#fff;white-space:nowrap;width:0;height:auto;transition:all .45s ease-in;transition-delay:1s}.infocardContainer3:hover div *{--background-color:purple;display:flex;visibility:visible;transition:all 1s ease-out;transition-delay:.5s;width:100%;height:auto}.infocardContainer3 #main,.infocardContainer3 #main img{--background-color:red;height:200px;width:200px;padding-right:10px;border-radius:100%;flex-shrink:0;object-fit:cover}.infocardContainer3 #main img{height:180px;width:180px;transition:none;display:float;position:relative;border:10px solid #fff;margin:0;padding:0}.infocardContainer3 #textbois{position:relative}.infocardContainer3 #textbois #hotlinks{max-width:60%;max-height:30px;--background-color:#fff;position:absolute;bottom:5px;display:flex;justify-content:space-between;border-radius:13px}.infocardContainer3 #textbois #hotlinks *{background-color:#fff;max-width:30px;--margin:0 1px 0 1px;border-radius:25px}.infocardContainer4 *{font-family:"Fira Sans Condensed",sans-serif;font-weight:300}.infocardContainer4{display:flex;height:200px;width:200px;border-radius:100px;background:#009fff;background:linear-gradient(121deg,hsla(0,0%,100%,0) 13%,#009fff);transition:all .5s ease-in;transition-delay:1s;--margin-top:100px;margin:100px auto auto 310px}.infocardContainer4:hover{width:500px;border-radius:100px 10px 100px 100px;transition:all 1s ease-out}.infocardContainer4 div{text-color:#fff;flex-shrink:1;width:100%;--background-color:green}.infocardContainer4 div *{display:flex;--flex:inherit;overflow:hidden;text-overflow:hidden;--background-color:#ff0;color:#fff;white-space:nowrap;width:0;height:auto;transition:all .45s ease-in;transition-delay:1s}.infocardContainer4:hover div *{--background-color:purple;display:flex;visibility:visible;transition:all 1s ease-out;transition-delay:.5s;width:100%;height:auto}.infocardContainer4 #main,.infocardContainer4 #main img{--background-color:red;height:200px;width:200px;padding-right:10px;border-radius:100%;flex-shrink:0;object-fit:cover}.infocardContainer4 #main img{height:180px;width:180px;transition:none;display:float;position:relative;border:10px solid #fff;margin:0;padding:0}.infocardContainer4 #textbois{position:relative}.infocardContainer4 #textbois #hotlinks{max-width:60%;max-height:30px;--background-color:#fff;position:absolute;bottom:5px;display:flex;justify-content:space-between;border-radius:13px}.infocardContainer4 #textbois #hotlinks *{background-color:#fff;max-width:30px;--margin:0 1px 0 1px;border-radius:25px}.infocardContainer5 *{font-weight:300}.infocardContainer5 *,h2{font-family:"Fira Sans Condensed",sans-serif}h2{font-weight:600;font-style:italic}header{height:2em;background-color:#112;margin:0;padding:auto;font-size:2em;text-align:center;line-height:2em;color:#fff}a{text-decoration:none}a:visited{color:#556}a:hover{text-decoration:underline}.infocardContainer5{display:flex;height:200px;width:200px;border-radius:100px;background:#009fff;background:linear-gradient(121deg,hsla(0,0%,100%,0) 13%,#009fff);transition:all .5s ease-in;transition-delay:1s;--margin-top:100px;margin:-190px auto auto 820px}.infocardContainer5:hover{width:500px;border-radius:100px 10px 100px 100px;transition:all 1s ease-out}.infocardContainer5 div{text-color:#fff;flex-shrink:1;width:100%;--background-color:green}.infocardContainer5 div *{display:flex;--flex:inherit;overflow:hidden;text-overflow:hidden;--background-color:#ff0;color:#fff;white-space:nowrap;width:0;height:auto;transition:all .45s ease-in;transition-delay:1s}.infocardContainer5:hover div *{--background-color:purple;display:flex;visibility:visible;transition:all 1s ease-out;transition-delay:.5s;width:100%;height:auto}.infocardContainer5 #main,.infocardContainer5 #main img{--background-color:red;height:200px;width:200px;padding-right:10px;border-radius:100%;flex-shrink:0;object-fit:cover}.infocardContainer5 #main img{height:180px;width:180px;transition:none;display:float;position:relative;border:10px solid #fff;margin:0;padding:0}.infocardContainer5 #textbois{position:relative}.infocardContainer5 #textbois #hotlinks{max-width:60%;max-height:30px;--background-color:#fff;position:absolute;bottom:5px;display:flex;justify-content:space-between;border-radius:13px}.infocardContainer5 #textbois #hotlinks *{background-color:#fff;max-width:30px;--margin:0 1px 0 1px;border-radius:25px}.titlo{color:#000;font-size:25px;background-color:#9dd8f7;box-shadow:4px 5px 7px #888;font-family:"Luckiest Guy",cursive;border-radius:3%;width:90%;height:20%;padding-top:10%;margin-left:5%;font-style:inherit;margin-top:-100px}.divall,.titlo{text-decoration:none}.divall{text-align:center}.navsectsongs{height:350px;width:250px;margin-top:-450px;margin-left:100px}.navsectsongs p a{color:#070707;text-decoration:none}.youtubeLink{border-radius:50%;width:160px;height:150px;margin-top:-48px;margin-left:-46px;display:flex}.vee{padding:5%;background-color:rgba(200,230,244,.5411764705882353);border-radius:50%;width:65px;height:55px;margin-left:90px;margin-top:10px;flex-shrink:3;box-shadow:5px 7px 5px #b6b5b5}.songs{text-align:center}.youtubecontainer{margin-top:80px;margin-left:210px;width:100%;height:400px;display:flex;flex-wrap:wrap}.iframe{width:400px;height:300px;margin-top:50px;margin-left:500px;border-left:40px solid #000;border-right:40px solid #000}.allSongsDiv{margin-top:3%}.songsTitle{margin-left:38%;color:#593b74;font-size:100px}.h1divv{margin-top:150px}.mainVid{width:500px;height:230px}.formdiv{width:400px;height:500px;font-family:"Potta One",cursive;margin-top:150px;background-color:rgba(177,70,168,.329);border-radius:5%;box-shadow:5px 5px #9dd8f7,10px 10px #f98ebb,15px 15px #faf088;position:relative}.myform{padding:15%}.mybutton{height:50px;width:180px;margin-top:30px;margin-left:40px;background-color:#faef82;border:1px solid #faef82;border-radius:5%;font-family:"Potta One",cursive;box-shadow:5px 5px #9dd8f7,10px 10px #f98ebb}.mybutton:hover{background-color:#f98ebb}.s1{position:absolute;margin-top:60px;margin-left:150px}.text{margin-top:80px}.text2{margin-top:40px}.dont{margin-top:15px;margin-left:45px}.do{margin-left:30px;margin-top:13px}.menu-item,.menu-open-button{background:#a38bb7;border-radius:100%;width:80px;height:80px;margin-left:-40px;position:absolute;color:#3a3131;text-align:center;line-height:80px;transform:translateZ(0);transition:transform .2s ease-out}.menu-open{display:none}.lines{width:25px;height:3px;background:#596778;display:block;position:absolute;top:50%;left:50%;margin-left:-12.5px;margin-top:-1.5px;transition:transform .2s}.line-1{transform:translate3d(0,-8px,0)}.line-2{transform:translateZ(0)}.line-3{transform:translate3d(0,8px,0)}.menu-open:checked+.menu-open-button .line-1{transform:translateZ(0) rotate(45deg)}.menu-open:checked+.menu-open-button .line-2{transform:translateZ(0) scaleX(.1)}.menu-open:checked+.menu-open-button .line-3{transform:translateZ(0) rotate(-45deg)}.menu{top:0;bottom:0;left:0;right:100;text-align:center;box-sizing:border-box;font-size:15px;font-weight:700;text-decoration:none}.menu-item:hover{background:#eee;color:#3290b1}.menu-item:nth-child(3),.menu-item:nth-child(4),.menu-item:nth-child(5),.menu-item:nth-child(6),.menu-item:nth-child(7),.menu-item:nth-child(8),.menu-item:nth-child(9){transition-duration:.18s}.menu-open-button{z-index:2;transition-timing-function:cubic-bezier(.175,.885,.32,1.275);transition-duration:.4s;transform:scale(1.1) translateZ(0);cursor:pointer;box-shadow:3px 3px 3px #9dd8f7}.menu-open-button:hover{transform:scale(1.2) translateZ(0)}.menu-open:checked+.menu-open-button{transition-timing-function:linear;transition-duration:.2s;transform:scale(.8) translateZ(0)}.menu-open:checked~.menu-item{transition-timing-function:cubic-bezier(.935,0,.34,1.33)}.menu-open:checked~.menu-item:nth-child(3){transition-duration:.18s;-webkit-transition-duration:.18s;transform:translate3d(.08361px,-104.99997px,0)}.menu-open:checked~.menu-item:nth-child(4){transition-duration:.28s;-webkit-transition-duration:.28s;transform:translate3d(90.9466px,-52.47586px,0)}.menu-open:checked~.menu-item:nth-child(5){transition-duration:.38s;-webkit-transition-duration:.38s;transform:translate3d(90.9466px,52.47586px,0)}.menu-open:checked~.menu-item:nth-child(6){transition-duration:.48s;-webkit-transition-duration:.48s;transform:translate3d(.08361px,104.99997px,0)}.menu-open:checked~.menu-item:nth-child(7){transition-duration:.58s;-webkit-transition-duration:.58s;transform:translate3d(-90.86291px,52.62064px,0)}.menu-open:checked~.menu-item:nth-child(8){transition-duration:.68s;-webkit-transition-duration:.68s;transform:translate3d(-91.03006px,-52.33095px,0)}.menu-open:checked~.menu-item:nth-child(9){transition-duration:.78s;-webkit-transition-duration:.78s;transform:translate3d(-.25084px,-104.9997px,0)}.blue{background-color:#669ae1;box-shadow:3px 3px 0 0 rgba(0,0,0,.14);text-shadow:1px 1px 0 rgba(0,0,0,.12)}.blue:hover{color:#669ae1;text-shadow:none}.green{background-color:#70cc72;box-shadow:3px 3px 0 0 rgba(0,0,0,.14);text-shadow:1px 1px 0 rgba(0,0,0,.12)}.green:hover{color:#70cc72;text-shadow:none}.red{background-color:#f196bf;box-shadow:3px 3px 0 0 rgba(0,0,0,.14);text-shadow:1px 1px 0 rgba(0,0,0,.12)}.red:hover{color:#fe4365;text-shadow:none}.purple{background-color:#faef82;box-shadow:3px 3px 0 0 rgba(0,0,0,.14);text-shadow:1px 1px 0 rgba(0,0,0,.12)}.purple:hover{color:#c49cde;text-shadow:none}.orange{background-color:#f49b72;box-shadow:3px 3px 0 0 rgba(0,0,0,.14);text-shadow:1px 1px 0 rgba(0,0,0,.12)}.orange:hover{color:#fc913a;text-shadow:none}.credit{margin:24px 20px 120px 0;text-align:right;color:#eee}.credit a{padding:8px 0;color:#c49cde;text-decoration:none;transition:all .3s ease 0s}.credit a:hover{text-decoration:underline}.menucontainer{margin-top:150px;margin-left:-1400px;position:relative}.navsect{margin-top:-350px}*{font-family:"Luckiest Guy",cursive}.mainbody{background-image:url(/static/media/final2.4ddcf904.png);background-size:cover;background-repeat:no-repeat;width:auto;margin:0;padding:0;overflow-x:hidden}.welcome{margin-top:-60px;margin-left:120px;color:#775d8b;text-shadow:3px 3px 0 rgba(0,0,0,.12)}.ballmain{display:inline-block;width:100%;height:100%;border-radius:100%;background:radial-gradient(circle at bottom,#81e8f6,#76deef 10%,#055194 80%,#062745 100%)}.ballmain:before{top:1%;left:5%;width:90%;height:90%;background:radial-gradient(circle at top,#fff,hsla(0,0%,100%,0) 58%);-webkit-filter:blur(5px);filter:blur(5px)}.ballmain:after,.ballmain:before{content:"";position:absolute;border-radius:100%;z-index:2}.ballmain:after{display:none;top:5%;left:10%;width:80%;height:80%;-webkit-filter:blur(1px);filter:blur(1px);transform:rotate(-30deg)}.ballmain .shadow{position:absolute;width:100%;height:100%;background:radial-gradient(circle,rgba(0,0,0,.4),rgba(0,0,0,.1) 40%,transparent 50%);transform:rotateX(90deg) translateZ(-160px);z-index:1}.ballmain.plain{background:#000}.ballmain.plain:after,.ballmain.plain:before{display:none}.ballmain.bubble{background:radial-gradient(circle at 50% 55%,rgba(240,245,255,.9),rgba(240,245,255,.9) 40%,rgba(225,238,255,.8) 60%,rgba(43,130,255,.4));animation:bubble-anim 2s ease-out infinite}.ballmain.bubble:before{-webkit-filter:blur(0);filter:blur(0);height:80%;width:40%;background:radial-gradient(circle at 130% 130%,hsla(0,0%,100%,0) 0,hsla(0,0%,100%,0) 46%,hsla(0,0%,100%,.8) 50%,hsla(0,0%,100%,.8) 58%,hsla(0,0%,100%,0) 60%,hsla(0,0%,100%,0) 100%);transform:translateX(131%) translateY(58%) rotate(168deg) rotateX(10deg)}.ballmain.bubble:after{display:block;background:radial-gradient(circle at 50% 80%,hsla(0,0%,100%,0),hsla(0,0%,100%,0) 74%,#fff 80%,#fff 84%,hsla(0,0%,100%,0) 100%)}.stage{width:250px;height:250px;-ms-perspective:1200px;-o-perspective:1200px;perspective:1200px;-ms-perspective-origin:50% 50%;-o-perspective-origin:50% 50%;perspective-origin:50% 50%}.ball2,.stage{display:inline-block}.ball2{width:100%;height:100%;border-radius:100%;background:radial-gradient(circle at bottom,#81e8f6,#76deef 10%,#055194 80%,#062745 100%)}.ball2:before{top:1%;left:5%;width:90%;height:90%;background:radial-gradient(circle at top,#fff,hsla(0,0%,100%,0) 58%);-webkit-filter:blur(5px);filter:blur(5px)}.ball2:after,.ball2:before{content:"";position:absolute;border-radius:100%;z-index:2}.ball2:after{display:none;top:5%;left:10%;width:80%;height:80%;-webkit-filter:blur(1px);filter:blur(1px);transform:rotate(-30deg)}.ball2 .shadow{position:absolute;width:100%;height:100%;background:radial-gradient(circle,rgba(0,0,0,.4),rgba(0,0,0,.1) 40%,transparent 50%);transform:rotateX(90deg) translateZ(-160px);z-index:1}.ball2.plain{background:#000}.ball2.plain:after,.ball2.plain:before{display:none}.ball2.bubble{background:radial-gradient(circle at 50% 55%,rgba(240,245,255,.9),rgba(240,245,255,.9) 40%,rgba(225,238,255,.8) 60%,rgba(43,130,255,.4));animation:bubble-anim 2s ease-out infinite}.ball2.bubble:before{-webkit-filter:blur(0);filter:blur(0);height:80%;width:40%;background:radial-gradient(circle at 130% 130%,hsla(0,0%,100%,0) 0,hsla(0,0%,100%,0) 46%,hsla(0,0%,100%,.8) 50%,hsla(0,0%,100%,.8) 58%,hsla(0,0%,100%,0) 60%,hsla(0,0%,100%,0) 100%);transform:translateX(131%) translateY(58%) rotate(168deg) rotateX(10deg)}.ball2.bubble:after{display:block;background:radial-gradient(circle at 50% 80%,hsla(0,0%,100%,0),hsla(0,0%,100%,0) 74%,#fff 80%,#fff 84%,hsla(0,0%,100%,0) 100%)}.stage2{width:250px;height:250px;margin-left:100px;margin-top:10px;-ms-perspective:1200px;-o-perspective:1200px;perspective:1200px;-ms-perspective-origin:50% 50%;-o-perspective-origin:50% 50%;perspective-origin:50% 50%}.ball3,.stage2{display:inline-block}.ball3{top:20%;left:20%;width:100%;height:100%;border-radius:100%;background:radial-gradient(circle at bottom,#81e8f6,#76deef 10%,#055194 80%,#062745 100%)}.ball3:before{top:1%;left:5%;width:90%;height:90%;background:radial-gradient(circle at top,#fff,hsla(0,0%,100%,0) 58%);-webkit-filter:blur(5px);filter:blur(5px)}.ball3:after,.ball3:before{content:"";position:absolute;border-radius:100%;z-index:2}.ball3:after{display:none;top:5%;left:10%;width:80%;height:80%;-webkit-filter:blur(1px);filter:blur(1px);transform:rotate(-30deg)}.ball3 .shadow{position:absolute;width:100%;height:100%;background:radial-gradient(circle,rgba(0,0,0,.4),rgba(0,0,0,.1) 40%,transparent 50%);transform:rotateX(90deg) translateZ(-160px);z-index:1}.ball3.plain{background:#000}.ball2.plain:after,.ball3.plain:before{display:none}.ball3.bubble{background:radial-gradient(circle at 50% 55%,rgba(240,245,255,.9),rgba(240,245,255,.9) 40%,rgba(225,238,255,.8) 60%,rgba(43,130,255,.4));animation:bubble-anim 2s ease-out infinite}.ball3.bubble:before{-webkit-filter:blur(0);filter:blur(0);height:80%;width:40%;background:radial-gradient(circle at 130% 130%,hsla(0,0%,100%,0) 0,hsla(0,0%,100%,0) 46%,hsla(0,0%,100%,.8) 50%,hsla(0,0%,100%,.8) 58%,hsla(0,0%,100%,0) 60%,hsla(0,0%,100%,0) 100%);transform:translateX(131%) translateY(58%) rotate(168deg) rotateX(10deg)}.ball3.bubble:after{display:block;background:radial-gradient(circle at 50% 80%,hsla(0,0%,100%,0),hsla(0,0%,100%,0) 74%,#fff 80%,#fff 84%,hsla(0,0%,100%,0) 100%)}.stage3{width:250px;height:250px;display:inline-block;margin-left:200px;-ms-perspective:1200px;-o-perspective:1200px;perspective:1200px;-ms-perspective-origin:50% 50%;-o-perspective-origin:50% 50%;perspective-origin:50% 50%}.ball4{width:100%;height:100%;border-radius:100%;position:relative;background:radial-gradient(circle at bottom,#81e8f6,#76deef 10%,#055194 80%,#062745 100%)}.ball4:before{top:1%;left:5%;width:90%;height:90%;background:radial-gradient(circle at top,#fff,hsla(0,0%,100%,0) 58%);-webkit-filter:blur(5px);filter:blur(5px)}.ball4:after,.ball4:before{content:"";position:absolute;border-radius:100%;z-index:2}.ball4:after{display:none;top:5%;left:10%;width:80%;height:80%;-webkit-filter:blur(1px);filter:blur(1px);transform:rotate(-30deg)}.ball4 .shadow{position:absolute;width:100%;height:100%;background:radial-gradient(circle,rgba(0,0,0,.4),rgba(0,0,0,.1) 40%,transparent 50%);transform:rotateX(90deg) translateZ(-160px);z-index:1}.ball4.plain{background:#000}.ball4.plain:after,.ball4.plain:before{display:none}.ball4.bubble{background:radial-gradient(circle at 50% 55%,rgba(240,245,255,.9),rgba(240,245,255,.9) 40%,rgba(225,238,255,.8) 60%,rgba(43,130,255,.4));animation:bubble-anim 2s ease-out infinite}.ball4.bubble:before{-webkit-filter:blur(0);filter:blur(0);height:80%;width:40%;background:radial-gradient(circle at 130% 130%,hsla(0,0%,100%,0) 0,hsla(0,0%,100%,0) 46%,hsla(0,0%,100%,.8) 50%,hsla(0,0%,100%,.8) 58%,hsla(0,0%,100%,0) 60%,hsla(0,0%,100%,0) 100%);transform:translateX(131%) translateY(58%) rotate(168deg) rotateX(10deg)}.ball4.bubble:after{background:radial-gradient(circle at 50% 80%,hsla(0,0%,100%,0),hsla(0,0%,100%,0) 74%,#fff 80%,#fff 84%,hsla(0,0%,100%,0) 100%)}.stage4{width:250px;height:250px;margin-left:100px;margin-top:60px;-ms-perspective:1200px;-o-perspective:1200px;perspective:1200px;-ms-perspective-origin:50% 50%;-o-perspective-origin:50% 50%;perspective-origin:50% 50%}.small,.stage4{display:inline-block}.small{width:100%;height:100%;border-radius:100%;background:radial-gradient(circle at bottom,#81e8f6,#76deef 10%,#055194 80%,#062745 100%)}.small:before{top:1%;left:5%;width:90%;height:90%;background:radial-gradient(circle at top,#fff,hsla(0,0%,100%,0) 58%);-webkit-filter:blur(5px);filter:blur(5px)}.small:after,.small:before{content:"";position:absolute;border-radius:100%;z-index:2}.small:after{display:none;top:5%;left:10%;width:80%;height:80%;-webkit-filter:blur(1px);filter:blur(1px);transform:rotate(-30deg)}.small .shadow{position:absolute;width:100%;height:100%;background:radial-gradient(circle,rgba(0,0,0,.4),rgba(0,0,0,.1) 40%,transparent 50%);transform:rotateX(90deg) translateZ(-160px);z-index:1}.small.plain{background:#000}.ball2.plain:after,.small.plain:before{display:none}.small.bubble{background:radial-gradient(circle at 50% 55%,rgba(240,245,255,.9),rgba(240,245,255,.9) 40%,rgba(225,238,255,.8) 60%,rgba(43,130,255,.4));animation:bubble-anim 2s ease-out infinite}.small.bubble:before{-webkit-filter:blur(0);filter:blur(0);height:80%;width:40%;background:radial-gradient(circle at 130% 130%,hsla(0,0%,100%,0) 0,hsla(0,0%,100%,0) 46%,hsla(0,0%,100%,.8) 50%,hsla(0,0%,100%,.8) 58%,hsla(0,0%,100%,0) 60%,hsla(0,0%,100%,0) 100%);transform:translateX(131%) translateY(58%) rotate(168deg) rotateX(10deg)}.small.bubble:after{display:block;background:radial-gradient(circle at 50% 80%,hsla(0,0%,100%,0),hsla(0,0%,100%,0) 74%,#fff 80%,#fff 84%,hsla(0,0%,100%,0) 100%)}.smalls{width:50px;height:50px;display:inline-block;margin-left:100px;margin-top:10px;-ms-perspective:1200px;-o-perspective:1200px;perspective:1200px;-ms-perspective-origin:50% 50%;-o-perspective-origin:50% 50%;perspective-origin:50% 50%}@keyframes bubble-anim{0%{transform:scale(1)}20%{transform:scaleY(.95) scaleX(1.05)}48%{transform:scaleY(1.1) scaleX(.9)}68%{transform:scaleY(.98) scaleX(1.02)}80%{transform:scaleY(1.02) scaleX(.98)}97%,to{transform:scale(1)}}.signin{height:100px;width:240px;margin-left:610px;margin-top:0;background-color:#816f91;border:2px solid #816f91;border-radius:2%;color:#fff;font-size:35px;box-shadow:5px 5px #9dd8f7,10px 10px #f98ebb,15px 15px #faf088}.signin:hover{background-color:#b298c8;color:#000;font-weight:700;font-size:40px;border:2px solid #b298c8}.clickme{position:relative;margin-left:200px}.img1{margin-left:38px;margin-top:40px;border-radius:50%;width:70%;height:70%;opacity:.9}.img2,.img3{margin-left:30px}.img2,.img3,.img4{margin-top:20px;border-radius:50%;width:80%;height:80%;opacity:.9}.img4{margin-left:25px}.xogame{margin-left:300px}.paraDiv{width:40%;background-color:rgba(127,255,255,.212);font-family:serif;margin-left:200px;font-size:20px}.homaPara{width:80%;padding-left:2%;padding-top:1%;padding-bottom:1%}.navsect{height:350px;width:250px;margin-top:-400px;margin-left:100px}.navdiv{margin-right:auto;border-radius:10px;width:200px;height:40px;margin-top:12%;transition-duration:.2s}.navdiv:nth-child(odd){transform:perspective(300px) rotateY(45deg);box-shadow:-2px 2px 7px grey}.navdiv:nth-child(2n){transform:perspective(300px) rotateY(-45deg);box-shadow:2px 2px 7px grey}.navdiv:hover{transform:rotateY(0);background:#fff;color:#000;box-shadow:0 0 0}.navsect p a{color:#000;text-decoration:none}.navstoriessect{height:350px;width:250px;margin-top:-550px;margin-left:100px}.navdivsto{margin-right:auto;border-radius:10px;width:200px;height:40px;margin-top:12%;transition-duration:.2s}.navdivsto:nth-child(odd){transform:perspective(300px) rotateY(45deg);box-shadow:-2px 2px 7px grey}.navdivsto:nth-child(2n){transform:perspective(300px) rotateY(-45deg);box-shadow:2px 2px 7px grey}.navdivsto:hover{transform:rotateY(0);background:#fff;color:#000;box-shadow:0 0 0}.navdivsto p a{color:#000;text-decoration:none}.listButtons{list-style:none;text-align:center;margin-left:1025px;box-shadow:5px 10px 18px #888}.buttons{background-color:#ff3385;color:#fff;padding:10px;width:150px;height:50px;text-align:center;font-size:20px;text-decoration:none;border:none}.player{margin-left:1100px;margin-top:50px;text-align:center;font-weight:1000;font-size:50px;color:#080808}.moves,.player{display:inline-block;position:absolute}.moves{margin-top:-200px;margin-left:100px;height:10px}.board{width:1000px}.navsectXO{height:350px;width:250px;margin-top:-330px;margin-left:100px}.navdivXO{margin-right:auto;border-radius:10px;width:200px;height:40px;margin-top:12%;transition-duration:.2s}.navdivXO:nth-child(odd){transform:perspective(300px) rotateY(45deg);box-shadow:-2px 2px 7px grey}.navdivXO:nth-child(2n){transform:perspective(300px) rotateY(-45deg);box-shadow:2px 2px 7px grey}.navdivXO:hover{transform:rotateY(0);background:#fff;color:#000;box-shadow:0 0 0}.navsectXO p a{color:#000;text-decoration:none}.app-container{position:absolute;left:0;right:0;bottom:0;top:0;display:flex;align-items:center;flex-direction:column;justify-content:center;background:#444}.piano-container{display:inline-flex;margin-top:300px;margin-left:350px;border-top:5px solid #03030a;border-right:5px solid #03030a;border-left:5px solid #03030a;border-collapse:collapse;box-shadow:5px 10px 18px #888}.piano-natural-key{width:50px;height:300px;cursor:pointer;background:#fcdeeb;margin:0 2px;color:#444;padding:10px;border-radius:0 0 3px 3px;border:3px solid #472f3a;border-bottom:5px solid #03030a}.piano-text{height:100%;display:flex;align-items:flex-end;justify-content:center;font-size:1rem}.piano-accidental-key-wrapper{position:relative;width:0}.piano-accidental-key{position:absolute;cursor:pointer;background:#111;transform:translateX(-50%);width:30px;height:170px;border-radius:0 0 3px 3px;border:3px solid #444;border-top:none;padding:5px;outline:none;color:#dbdbdd}.home{width:70%;text-align:center;margin-top:250px;background-color:rgba(209,226,243,.47843137254901963);margin-left:220px;padding:25px}.gusp{font-size:1.5pc}.gush{font-size:3pc}.guss{width:100px;margin-left:40%;color:#000;border-radius:4px;text-shadow:0 1px 1px rgba(0,0,0,.2);background-color:#ffbdb5;padding:5px;margin-top:10px}.center{text-align:center}.gusa{margin-left:6%;margin-top:50px}.btngus{color:#000;border-radius:4px;text-shadow:0 1px 1px rgba(0,0,0,.2);background-color:#ffbdb5;padding:10px}.inputBox{width:30%;margin-top:90px;background-color:rgba(209,226,243,.47843137254901963);margin-left:470px;padding:35px}.inputBox,.title{text-align:center}.title{margin-top:10%;text-decoration:none;font-size:2.5pc}.textBox{font-size:1pc}.fourth{font-family:"Lemonada",cursive}.game1div{position:absolute}.ball{display:inline-block;width:100%;height:100%;margin:0;border-radius:50%;position:relative;background:radial-gradient(circle at 50% 120%,#d9f5f8,#db9fba 10%,#e28cb2 80%,#e65495 100%)}.ball:before{content:"";position:absolute;top:1%;left:5%;width:90%;height:90%;border-radius:50%;background:radial-gradient(circle at 50% 0,#fff,hsla(0,0%,100%,0) 58%);-webkit-filter:blur(5px);z-index:2}.ball .shadow{position:absolute;width:100%;height:100%;background:radial-gradient(circle at 50% 50%,rgba(0,0,0,.4),rgba(0,0,0,.1) 40%,transparent 50%);transform:rotateX(90deg) translateZ(-150px);z-index:-1}.stagegames{width:220px;height:220px;display:inline-block;margin-top:-60px;margin-left:370px;-ms-perspective:1200px;-o-perspective:1200px;perspective:1200px;-ms-perspective-origin:50% 50%;-o-perspective-origin:50% 50%;perspective-origin:50% 50%}.ballgames{display:inline-block;width:100%;height:100%;margin:0;border-radius:50%;position:relative;background:radial-gradient(circle at 50% 120%,#dfd5e8,#c9b6db 10%,#b298c8 80%,#7e7289 100%)}.ballgames:before{content:"";position:absolute;top:1%;left:5%;width:90%;height:90%;border-radius:50%;background:radial-gradient(circle at 50% 0,#fff,hsla(0,0%,100%,0) 58%);-webkit-filter:blur(5px);z-index:2}.ballgames .shadow{position:absolute;width:100%;height:100%;background:radial-gradient(circle at 50% 50%,rgba(0,0,0,.4),rgba(0,0,0,.1) 40%,transparent 50%);transform:rotateX(90deg) translateZ(-150px);z-index:-1}.stagegames2{width:220px;height:220px;margin-left:865px;margin-top:350px;-ms-perspective:1200px;-o-perspective:1200px;perspective:1200px;-ms-perspective-origin:50% 50%;-o-perspective-origin:50% 50%;perspective-origin:50% 50%}.imgxo{z-index:2;margin-left:-195px;margin-top:-100px}.imgpiano{z-index:5;margin-left:-85px;margin-top:5px;width:400px;height:250px}.navsection4{height:350px;width:250px;margin-top:-150px;margin-left:100px}.p{font-size:35px;text-align:center;margin-top:0;cursor:pointer;width:100%;background:#62dbeb;font-family:Century Gothic;letter-spacing:5px}.navdiv4,.p{border-radius:10px}.navdiv4{margin-right:auto;width:200px;height:40px;margin-top:12%;transition-duration:.2s}.p:hover{background:#fff;color:#000}.navdiv4:nth-child(odd){transform:perspective(300px) rotateY(45deg);box-shadow:-2px 2px 7px grey}.navdiv4:nth-child(2n){transform:perspective(300px) rotateY(-45deg);box-shadow:2px 2px 7px grey}.navdiv4:hover{transform:rotateY(0);background:#fff;color:#000;box-shadow:0 0 0}.navsection4 p a{color:#000;text-decoration:none}
/*# sourceMappingURL=main.7b49711c.chunk.css.map */