body{height:100%;background-color:#000;background-image:linear-gradient(#333,#000);margin:0;padding:0;font-family:Andada,serif;line-height:150%;overflow:hidden}div#container{width:990px;height:220px;z-index:1000;margin:0 auto;position:absolute;top:50px}div#container .view{z-index:-1;position:relative}.everything{width:990px;margin:0 auto;padding-bottom:15px}a{color:#999}a:hover{color:#933}#animate{border-radius:10px}#piano_bg{border-radius:10px;position:absolute;top:21px}div.tools{z-index:10000;width:100%;height:100%;background:rgba(0,0,0,.25);display:none;position:absolute;top:0;left:0}hr{border:0;border-top:1px solid rgba(211,211,211,.5);margin:15px 0}#tools{color:#000;width:550px;z-index:10000;background:linear-gradient(#fff,gray);border-radius:10px;margin:0 auto;padding:25px 20px;font-weight:700;position:relative;top:170px;overflow:hidden;box-shadow:1px 1px 30px 10px #000}#tools a{color:#07f}#tools a:hover{color:#f07}#tools span{width:150px;text-align:right;padding-right:15px;display:inline-block}#tools input[type=button]{color:#fff;width:100px;background-color:#0463d9;background-image:linear-gradient(#0370fa,#034291);border:0;border-radius:5px;padding:10px;font-weight:700;display:inline-block}#tools input[type=text]{border-radius:5px;padding:10px;font-weight:700;display:inline-block}#head{height:72px;width:100%;z-index:1000;background:linear-gradient(rgba(0,0,0,0),#000);margin:0;padding:0;position:absolute;box-shadow:0 3px 3px rgba(0,0,0,.25)}#head div.wrapper{width:990px;margin:0 auto;padding-top:19px}#head span{float:left}#head span img{padding:19px 9px 15px 10px}#head ul{float:right;text-align:right;margin:0;padding:0;font-size:18px;line-height:140%;list-style:none;bottom:0}#head li{float:right;height:71px;opacity:.75;background-image:linear-gradient(#222,#414141);border-left:1px solid rgba(0,0,0,.8);border-right:1px solid #323232;margin:0;transition-property:background,color,text-shadow,opacity;transition-duration:.25s;display:inline}#head li a{transition-property:inherit;transition-duration:inherit;color:#fff;float:left;padding:23px 30px 25px;text-decoration:none}#head li a span{transition-property:inherit;transition-duration:inherit;color:#aaa}#head li a:hover{color:#000}#head li:hover{cursor:pointer;opacity:1;color:#fff;background:#0055d8 linear-gradient(#003b96,#0055d8);border-right:1px solid rgba(150,50,50,0)}#head li:hover a span{color:#fff}#head li img{cursor:pointer;position:relative;top:-15px}#head li#cur{background:#000 linear-gradient(#222,#000);border-right:1px solid rgba(0,0,0,0)}#head li#cur a span{color:#fff}#photos{width:670px;float:left;margin:86px 0 0}#photos img{border:3px solid rgba(0,0,0,.3);border-radius:3px}canvas{position:absolute;top:0;left:0}div#file-browser{color:#000;opacity:1;text-overflow:ellipsis;white-space:nowrap;z-index:1000;background:#eee;transition-property:left,opacity;transition-duration:.5s;display:block;position:absolute;top:0;left:0;overflow-x:hidden;overflow-y:scroll;box-shadow:5px 5px 10px #000}div#file-browser .close-button{cursor:pointer;height:40px;text-align:center;width:40px;z-index:2;background:#fff;border:1px solid #fff;border-radius:50%;font-family:Helvetica,Arial,sans-serif;font-size:30px;font-weight:700;line-height:37px;position:fixed;top:11px;right:10px;box-shadow:inset 0 0 10px #999}div#file-browser div div{cursor:pointer;padding:3px 20px;transition-property:color,background;transition-duration:.15s}div#file-browser div div a{float:right;color:#000}div#file-browser div div a:hover{color:#fff;text-decoration:underline}div#file-browser div div:nth-child(2n){background:#fff;border-top:1px solid #ccc}div#file-browser div div:nth-child(2n+1){background:#eee;border-top:1px solid #ccc}div#file-browser div div:hover{color:#fff;background:#4bf}div#file-browser div div.selected{color:#fff;background:#f4b}div#file-browser input{color:#fff;cursor:text;max-width:100%;opacity:1;width:100%;z-index:1;background:#000;border:0;border-top:#000;border-radius:0;outline:none;margin:0;padding:22px 20px;font-size:18px;position:fixed;top:0}div#file-browser input::-webkit-input-placeholder{color:rgba(255,255,255,.75);font-style:italic}div#file-browser input::-ms-input-placeholder{color:rgba(255,255,255,.75);font-style:italic}div#file-browser input::placeholder{color:rgba(255,255,255,.75);font-style:italic}div{-webkit-user-select:none;-ms-user-select:none;user-select:none}#top{color:#444;height:30px;z-index:1;width:875px;position:absolute}#theory{float:left}#theory input[type=button]{width:35px;height:35px;color:#fff;background:#555 linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.25));border-radius:5px;font-weight:700;transition-property:background,color;transition-duration:.25s}#theory input[type=button]:active{color:#000;background:#888}#playback{float:left;padding-left:6px}#playback img{opacity:.75;background:linear-gradient(#f7f7f7,#aaa);border:1px solid #000;border-radius:50%;margin-right:.35em;transition-property:opacity,background,border,bottom;transition-duration:.5s;box-shadow:0 3px 8px #555,inset 0 2px 3px #fff}#playback img:hover{opacity:1}#playback #capsule{float:right;height:30px;width:220px;background:#000 linear-gradient(#444,#222);border:1px solid #000;border-radius:5px;display:inline-block;overflow:hidden;box-shadow:0 0 10px #333}#playback #capsule #cursor{height:100%;width:0;background:#666 linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.5));border-radius:5px 0 0 5px;transition-property:background;transition-duration:.15s;display:inline-block}#playback #capsule:hover #cursor{width:0;height:100%;background-color:#0088e9;border-radius:5px 0 0 5px;display:inline-block}#playback span.time{float:right;color:#999;width:40px;text-align:right;padding:0 10px;display:inline-block;position:relative;top:4px}#playback div.time-controls{width:560px;margin:10px auto 0;display:inline}#settings{float:right}#settings div{opacity:.6;width:32px;height:32px;cursor:pointer;background-image:url(config.59c907fe.svg);background-repeat:no-repeat;margin:0 12px;transition-property:opacity,background,border,bottom;transition-duration:.5s;display:inline-block}#settings div:hover{opacity:1}#settings div#configure{margin-right:0}#settings div#open{background-image:url(media-open.40451127.svg)}#settings div#view-song.theorymode{background-image:url(view-song.4d13c440.png)}#settings div#view-song{background-image:url(view-theory.1a2ca186.png)}#keys{position:absolute;top:22px}#keys div{color:#fff;opacity:0;text-align:center;text-shadow:1px 1px #000;border-radius:0 0 3px 3px;font:10px arial;position:absolute}#keys div.black{z-index:1}#keys div.white{z-index:0}#keys div.force{opacity:1;transition-duration:0s}#white_keys{position:absolute;top:22px}#black_keys{z-index:1;position:absolute;top:22px}input{-webkit-appearance:none;color:#000;cursor:pointer;max-width:350px;opacity:.75;border:1px solid #111;border-radius:5px;margin-left:3px;margin-right:5px;padding:0;font-family:helvetica,sans-serif;font-size:16px;line-height:1.2em;transition-property:opacity;transition-duration:.5s;position:relative;top:-2px}input:hover{opacity:1}select{-webkit-appearance:none;color:#000;cursor:pointer;max-width:350px;min-width:1em;opacity:.75;background:#333 url("data:image/png,%89PNG%0D%0A%1A%0A%00%00%00%0DIHDR%00%00%0C%80%00%00%00%40%08%02%00%00%00W%AEz%EF%00%00%00%19tEXtSoftware%00Adobe%20ImageReadyq%C9e%3C%00%00%04%E5IDATx%DA%EC%DD%3DN%E3Z%18%06%E0%B1oD%82%A8%E8(%A8%D2Q%D2%D0%40%83%C4%12%D8%01%3Db%09P%81%A0%40%A2%60%05%D9%05%BB%A0%04%09!B%3A%9A%10%07%F2g%E7%22%90f(%98%E09%23Y7%E7%3EOi%1F%1FK_%FD%EA%FD%92%E9t%FA%03%00%00%00%00%00%00%00%00%80%3F%97%1A%01%00%00%00%00%00%00%00%00%40%98%9A%06%2C%00%00%00%00%00%00%00%00%20%0E%D5%A7%A14%60%01%00%00%00%00%00%00%00%00%04%D2%80%05%00%00%00%00%00%00%00%00DB%03%16%00%00%00%00%00%00%00%00%C0%DC%D0%80%05%00%00%00%00%00%00%00%00D%A2(%8A%8A%FF(%80%05%00%00%00%00%00%00%00%00D%C2%0AB%00%00%00%00%00%00%00%00%80%B9%A1%01%0B%00%00%00%00%00%00%00%00%88%84%15%84%00%00%00%00%00%00%00%00%00%81%AC%20%04%00%00%00%00%00%00%00%00%98%1B%1A%B0%00%00%00%00%00%00%00%00%80HXA%08%00%00%00%00%00%00%00%00%10%A8%FA4%94%00%16%00%00%00%00%00%00%00%00%10%09%0DX%00%00%00%00%00%00%00%00%00%81%AAOC%A5%86%0E%00%00%00%00%00%00%00%00%10F%03%16%00%00%00%00%00%00%00%00%10%09%2B%08%01%00%00%00%00%00%00%00%00%02U%9F%86%12%C0%02%00%00%00%00%00%00%00%00%22!%80%05%00%00%00%00%00%00%00%00%10%C8%0AB%00%00%00%00%00%00%00%00%80%40%1A%B0%00%00%00%00%00%00%00%00%00%02i%C0%02%00%00%00%00%00%00%00%00%08%A4%01%0B%00%00%00%00%00%00%00%00%20%90%06%2C%00%00%00%00%00%00%00%00%80%40%02X%00%00%00%00%00%00%00%00%00%81%AC%20%04%00%00%00%00%00%00%00%00%08%24%80%05%00%00%00%00%00%00%00%00%10%C8%0AB%00%00%00%00%00%00%00%00%80%40%1A%B0%00%00%00%00%00%00%00%00%00%02i%C0%02%00%00%00%00%00%00%00%00%084%3B%0Du%7B%7B%7Bzz%3A%18%0C%CA_%D8h4%F6%F6%F6677%F3%3C%FF%F2%40%D2%E9t%CC%1D%00%00%00%00%00%00%00%00%88%40%96e3%DE%26I2%18%0C%8E%8F%8F%EF%EE%EE%CA%DC%B6%BC%BC%7Cxx%D8l6_%5E%5EF%A3%D1%97%E9%AE%D4%D0%01%00%00%00%00%00%00%00%80%FF%83%E9t%BA%B8%B8xvv%B6%B3%B3%F3%ED%E1%F5%F5%F5V%AB%B5%B6%B66%99L~W%7F%F5%26y%7C%7C4Y%00%00%00%00%00%00%00%00%20%02%BD%5E%EF%DB3i%9A%D6%EB%F5%AB%AB%ABV%AB%F5%BBu%84%BB%BB%BB%FB%FB%FB%FD~%3F%CB%B2%B73%B3%02X%EDv%DB%DC%01%00%00%00%00%00%00%00%80%08%94%09%60%FDx%DFE%B8%B0%B0%D0n%B7%2F..%3A%9D%CE%E7W%8DF%E3%E8%E8hcc%23%7B7%1C%0E%BF%DC%3C%F8%EB%AA%87%87%07s%07%00%00%00%00%00%00%00%00%22%F0%FC%FC%5C%F2d%9A%A6%B5Zm2%99%9C%9F%9F___%7F%3C%5C%5D%5D%3D99YYY%E9%F5z%FD~%7F%3C%1E%17E1%FB%9E%7F%0E%0E%0E%CC%1D%00%00%00%00%00%00%00%00%88%C0p8%2Cyr%3A%9D%E6y%9E%A6%E9%F6%F6%F6h4%BA%B9%B9%D9%DA%DA%BA%BC%BC%AC%D5j%DDn7%CB%B2%B7%87%B3%BB%AF%3E%24%F7%F7%F7%E6%0E%00%00%00%00%00%00%00%00D%A0%7C%03%D6Oi%9A%D6%EB%F5n%B7%DBl6%C7%E3q%96e%AF%AF%AF%DF%16_%FDT%2B%93%D2%02%00%00%00%00%00%00%00%00%F8%EF%2B%1F%9C%FA%FC%C9%9B%A5%A5%A5%A7%A7%A7%3C%CF%CB%AC%1D%FCL%00%0B%00%00%00%00%00%00%00%00%88DX%1A*%7F%97%24I%C0%E7%02X%00%00%00%00%00%00%00%00%40%24%FE%26%0D%15%F6%AD%00%16%00%00%00%00%00%00%00%00%10%89%80%15%84%7FI%00%0B%00%00%00%00%00%00%00%00%88D%F5i(%01%2C%00%00%00%00%00%00%00%00%20%12%1A%B0%00%00%00%00%00%00%00%00%00%02i%C0%02%00%00%00%00%00%00%00%00%08%24%80%05%00%00%00%00%00%00%00%00%10%C8%0AB%00%00%00%00%00%00%00%00%80%40%D5%A7%A1RC%07%00%00%00%00%00%00%00%00%08%A3%01%0B%00%00%00%00%00%00%00%00%88%84%15%84%00%00%00%00%00%00%00%00%00%81%AAOC%09%60%01%00%00%00%00%00%00%00%00%91%10%C0%02%00%00%00%00%00%00%00%00%08T%FD%0A%C2%D4%D0%01%00%00%00%00%00%00%00%00%C2h%C0%02%00%00%00%00%00%00%00%00%22a%05!%00%00%00%00%00%00%00%00%40%A0%EA%D3PV%10%02%00%00%00%00%00%00%00%00%04%D2%80%05%00%00%00%00%00%00%00%00D%A2(%8A%8A%FF(%80%05%00%00%00%00%00%00%00%00D%C2%0AB%00%00%00%00%00%00%00%00%80%B9%A1%01%0B%00%00%00%00%00%00%00%00%88%84%06%2C%00%00%00%00%00%00%00%00%80%B9%A1%01%0B%00%00%00%00%00%00%00%00%88DQ%14%15%FF%F1_%01%06%00md%E2%BF%C9%C3%19%DA%00%00%00%00IEND%AEB%60%82") 100%/1600px 32px no-repeat;border:1px solid #111;border-radius:5px;margin-left:3px;margin-right:5px;padding:.45em 1.5em .45em .5em;font-family:helvetica,sans-serif;font-size:16px;line-height:1.2em;transition-property:opacity;transition-duration:.5s;position:relative;top:-2px}select:hover{opacity:1}input[type=range]{background:#444}option{padding:1px 5px}optgroup{color:#000;background:#eee;border-top:1px solid #aaa;border-bottom:1px solid #aaa;padding:2px 4px;font-style:normal;font-weight:400}canvas.gradient{z-index:100;background-image:linear-gradient(rgba(0,0,0,0),#000);border-radius:10px}footer{opacity:0;min-width:470px;width:100%;text-align:center;color:#555;clear:both;z-index:1000;background:rgba(255,255,255,.35);border-top:0 solid rgba(255,255,255,0);padding-top:1em;padding-bottom:1.3em;font-family:Andada,serif;font-size:18px;transition-property:opacity,background,border,bottom;transition-duration:.5s;position:absolute;bottom:0}footer a{color:#000;margin:0 5px;transition-property:color;transition-duration:.5s}footer a:hover{color:#0577ff}footer:hover{opacity:1;background:rgba(255,255,255,.8);border-top:10px solid rgba(255,255,255,.3)}footer img{border-radius:4px;box-shadow:1px 1px 2px #000}#midifile{max-width:300px;margin-left:15px}#playback-title{float:right;color:#aaa;width:300px;white-space:nowrap;text-overflow:ellipsis;cursor:pointer;border-left:2px solid #222;padding:4px 4px 4px 15px;overflow:hidden}div#playback .control{cursor:pointer;vertical-align:middle;float:left;position:relative;left:-7px}