.piano-keyboard{position:relative;height:100%;width:100%;pointer-events:none}.white-note{display:flex;justify-content:center;float:left;position:relative;cursor:pointer;color:#000;height:98%;border-radius:0 0 5px 5px;border-left:1px solid #e4e4ec;border-right:1px solid #e4e4ec;border-bottom:2px solid #e4e4ec}.white-note-pressed{background:#e4e4ec}.black-note{display:flex;align-items:flex-end;justify-content:center;position:absolute;cursor:pointer;height:75%;width:65%;left:68%;z-index:1;color:#fff;border-radius:0 0 3px 3px;opacity:.7}.black-note-pressed{background:#dab441!important}.key-group{align-self:flex-end;display:flex;flex-direction:column;align-items:center;margin-bottom:.8vw;font-size:1.2vw}.key-text{margin-top:.8vw}.key-text-on-black-note{transform:rotate(-90deg);margin:.8vw 0;margin-top:1vw}.key-input{text-align:center;width:2em;color:inherit;font-size:1vw}.unselectable{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.comeup{-webkit-animation:fullwhite .5s 4s forwards;animation:fullwhite .5s 4s forwards;opacity:0}.upanddown{-webkit-animation:upanddown 12s infinite forwards;animation:upanddown 12s infinite forwards;transform:translateY(-35%)}@-webkit-keyframes upanddown{0%{transform:translateY(-7%)}5%{transform:translateY(-7%)}20%{transform:translateY(40%)}25%{transform:translateY(40%)}50%{transform:translateY(-7%)}55%{transform:translateY(-7%)}70%{transform:translateY(-40%)}75%{transform:translateY(-40%)}to{transform:translateY(-7%)}}@keyframes upanddown{0%{transform:translateY(-7%)}5%{transform:translateY(-7%)}20%{transform:translateY(40%)}25%{transform:translateY(40%)}50%{transform:translateY(-7%)}55%{transform:translateY(-7%)}70%{transform:translateY(-40%)}75%{transform:translateY(-40%)}to{transform:translateY(-7%)}}.scrolldown{bottom:4em;right:50%;position:absolute;transform:translateX(41.55%)}@media only screen and (min-device-width:10px) and (max-device-width:736px){.scrolldown{bottom:5em}}#wait{position:absolute;width:100%;height:100%;background:#fff;z-index:9999;display:block}h3{margin:40px 0 0}ul{list-style-type:none;padding:0}li{display:inline-block;margin:0 10px}a{color:#42b983}body{overflow-y:hidden;height:100vh}.scrollabled{overflow-y:visible!important}.pianokeyboard{position:absolute;height:102vh;top:0;z-index:0}.pianokeyboard:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;background:linear-gradient(180deg,#fff,hsla(0,0%,100%,0));z-index:20}.text---primary{border-bottom:1px solid #dab441!important}.text---secondary{border-bottom:1px solid #da4167!important}p{line-height:1.8em}.w-100{width:100%}.video-js{background-color:#fff!important}.overflow-hidden{overflow:hidden}.rounded-video{border-radius:3em}.border-secondary{border:1px solid #dab441!important}.wrapit{white-space:normal!important}.justifytext{text-align:justify}.textgradient{text-transform:uppercase;background:linear-gradient(90deg,#dab441 0,#da4167);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.image{float:left;background-size:cover;background-repeat:no-repeat;background-position:50%;margin:5px;border-radius:5px;cursor:pointer}#imageno0,#imageno5{background-position:center -100px!important}.mainmusic .aplayer-pic{width:130px!important;height:130px!important}.mainmusic .aplayer-info{height:110px!important}.mainmusic .aplayer-title{font-size:20px!important}.mainmusic .aplayer-author{font-size:18px!important}.mainmusic .aplayer{box-shadow:0 8px 8px 0 rgba(0,0,0,.09),0 10px 14px 0 rgba(0,0,0,.2)}.startherebox{height:inherit!important;padding:10px 15px 15px 15px!important;background-color:rgba(0,0,0,.8)!important;transition:all 5s ease;width:60%;left:50%;position:relative;transform:translateX(-50%);line-height:1.5em;font-size:1.2vw;display:block}.startherebox .first{font-size:1.8vw}.startherebox a{font-size:1vw}.startherebox a:first-child{font-size:1.2vw;color:#3f51b5}.butts{position:absolute;display:block;bottom:5%;width:95%}.butts button:first-child{background-color:#ef5350!important}.butts button:nth-child(2){background-color:#66bb6a!important}.butts .green{padding:0 32px!important}.butts button{color:#fff!important}.piano-keyboard{opacity:.1}.firstimgcon,.secimgcon{height:40vh;width:40%}.firstimgcon,.firstimglancon,.secimgcon{position:relative;display:inline-block!important}.firstimglancon{height:0;width:100%}.firstimg{transform:translateX(-800px) rotate(-15deg);opacity:0}.secimg{transform:translateX(800px) rotate(15deg);opacity:0}.w4start{-webkit-animation:fullwhite 2s forwards;animation:fullwhite 2s forwards;display:none!important}.endshow{-webkit-animation:fullwhite 2s 2s forwards;animation:fullwhite 2s 2s forwards;display:inherit!important;opacity:0}.upopacity{-webkit-animation:fullwhite .5s forwards;animation:fullwhite .5s forwards;opacity:1!important}.upopacitykey{-webkit-animation:fullwhitekey 1s 1.3s forwards;animation:fullwhitekey 1s 1.3s forwards}@-webkit-keyframes fullwhitekey{to{opacity:.9}}@keyframes fullwhitekey{to{opacity:.9}}[v-cloak]>*{display:none}[v-cloak]:before{content:"Loading…"}.upline{background:#dab441;left:calc(100% - 13px);top:0}.downline,.upline{width:0;height:1px;position:absolute}.downline{background:#da4167;right:calc(100% - 13px);bottom:0}.downline.aos-animate,.upline.aos-animate{opacity:.4!important}@media only screen and (min-device-width:10px) and (max-device-width:736px){.startherebox{width:100%;line-height:1.5em;font-size:4vw}.startherebox a{font-size:4vw}.startherebox a:first-child{font-size:5vw}.butts{width:93%}.butts button{font-size:3.2vw!important}.butts .green{padding:0 12px!important}.justifytext,p{word-spacing:-.1em!important}.v-card__text{font-weight:100!important}.pianokeyboard{height:102vh}.firstimglan{position:relative!important;-webkit-animation:fiimganmob 8s .3s forwards;animation:fiimganmob 8s .3s forwards;left:50%;bottom:0;width:50vw;transition:all 3s ease-out;transform:translateX(-25vw) translateY(90vh) scale(2.5);opacity:0}@-webkit-keyframes fiimganmob{0%{transform:translateX(-25.3vw) translateY(90vh) scale(2.5);opacity:0}to{transform:translateX(-25.3vw) translateY(-13vh) scale(1.05);opacity:1}}@keyframes fiimganmob{0%{transform:translateX(-25.3vw) translateY(90vh) scale(2.5);opacity:0}to{transform:translateX(-25.3vw) translateY(-13vh) scale(1.05);opacity:1}}.image{background-size:cover!important}}@font-face{font-family:RobotoSlab;font-style:normal;font-weight:400;src:url(/static/RobotoSlab-Regular.ttf) format("truetype")}*{font-family:RobotoSlab}$body-font-family:"RobotoSlab";.v-application--wrap{position:relative}.v-main{padding:0!important}.v-app-bar--is-scrolled{background:#fff!important}.v-app-bar--hide-shadow{background:transparent!important}.upopacity00{-webkit-animation:fullwhite .5s forwards;animation:fullwhite .5s forwards;opacity:0}.upopacity0{-webkit-animation:fullwhite .5s .1s forwards;animation:fullwhite .5s .1s forwards;opacity:0}.upopacity1{-webkit-animation:fullwhite .5s .2s forwards;animation:fullwhite .5s .2s forwards;opacity:0}.upopacity2{-webkit-animation:fullwhite .5s .3s forwards;animation:fullwhite .5s .3s forwards;opacity:0}.upopacity3{-webkit-animation:fullwhite .5s .4s forwards;animation:fullwhite .5s .4s forwards;opacity:0}.upopacity4{-webkit-animation:fullwhite .5s .5s forwards;animation:fullwhite .5s .5s forwards;opacity:0}.upopacity5{-webkit-animation:fullwhite .5s .6s forwards;animation:fullwhite .5s .6s forwards;opacity:0}.upopacity6{-webkit-animation:fullwhite .5s .7s forwards;animation:fullwhite .5s .7s forwards;opacity:0}.mobmenu{display:none!important}@media only screen and (min-device-width:10px) and (max-device-width:736px){.upopacity6{display:none}.mobmenu{display:block!important}.w4start.mobmenu{display:none!important}}@-webkit-keyframes fullwhite{0%{opacity:0;transform:translate3d(0,40px,0)}to{opacity:1;transform:translateZ(0)}}@keyframes fullwhite{0%{opacity:0;transform:translate3d(0,40px,0)}to{opacity:1;transform:translateZ(0)}}