ul,ol{list-style:none}h1,h2,h3,h4,h5,h6,pre,code{font-size:1em}ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input,dl,dt,dd,figure,figcaption{margin:0;padding:0}a{text-decoration:none}a img,:link img,:visited img,fieldset{border:none;outline:none}address{font-style:normal}header,section,article,nav,footer,hgroup,details,summary,figure,main{display:block}mark{color:inherit;background:0 0}abbr{border:none}summary::-webkit-details-marker{display:none}html{font-size:100%}body{background:#f6f6f6;font-family:Open Sans}a{color:#c00}a:hover{color:#008bcc;transition:all .2s}.modal{background-color:#fff;width:400px;margin:74px auto 0;padding:1em;position:relative}.overlay{z-index:100;background-color:#0003;width:100%;height:100%;position:fixed;top:0;left:0}input[type=text],input[type=number],textarea,select{color:#474747;background:#fafafa;border:1px solid #e5e5e5;border-radius:1rem;padding:.5rem .7rem;font:.75rem Open Sans;display:inline-block}input[type=text]:focus,input[type=number]:focus,textarea:focus,select:focus{border-color:#7f7f7f;outline:none}input[type=range]{-webkit-appearance:none;vertical-align:middle;background:#e0e0e0;border:1px solid #cbcbcb;border-radius:1rem;height:.3rem;margin-top:.0625rem;display:inline-block}input[type=range]:focus{outline:none}input[type=range]:focus::-webkit-slider-thumb{border-color:#7f7f7f}::-webkit-slider-thumb{-webkit-appearance:none;background:#fff;border:1px solid #bbb;border-radius:1rem;width:1rem;height:1rem}header{background:#fff;font-size:1em}header>h1{color:#c00;text-align:center;padding:.8rem 0;font:2rem Permanent Marker}header dl{float:left;width:18%;margin:0}header dl dd{margin:0}section.controls{width:90%;max-width:1000px;margin:0 auto;padding:1rem 0;font-size:1em}section.controls h2{color:#363636;float:left;margin:0 0 0 1rem;font:1.5rem Permanent Marker}section.controls h3{color:#363636;font:600 .75rem Open Sans}section.controls>a{text-transform:uppercase;float:right;margin:.4rem .8rem 0 0;font:.75rem/2rem Open Sans}section.controls article:before{content:" "}section.controls article:after{content:" ";clear:both;display:table}section.controls article{background:#fff;border:1px solid #dadada;border-radius:3rem;margin:3.3rem 0 1rem;padding:.8rem 1rem;font-size:1em;position:relative}section.controls article dl dt,section.controls article dl dd{display:inline;position:relative}section.controls article dl dt{margin-left:1rem;margin-right:.5rem}section.controls article dl dt:first-child{margin-left:0}section.controls article dl dt label{color:#565656;text-transform:uppercase;margin-bottom:.3rem;font-size:.75rem;display:inline-block}section.controls article dl dt a.active{display:none}section.controls article dl dt a.active+a{display:inline}section.controls article.instrument dl{float:left;width:calc(100% - 25px)}section.controls article.instrument button{float:left;width:25px}section.controls article.instrument label{width:12px}section.controls article.instrument label[for=volume]{text-indent:-9999px;background:url(/img/icon_sound@2x.png) 0/12px 12px no-repeat;height:1.05rem}section.controls article.instrument label[for=shape],section.controls article.instrument label[for=channel]{width:auto}section.controls article>section{width:4.5rem;position:absolute;top:-.9rem;right:4rem}section.controls article>section #transport{width:11rem}section.controls article>section #transport button{color:#fff;z-index:50;background:#363636;border:.5rem solid #fff;border-radius:3.5rem;width:4.875rem;margin:0 .5rem 0 0;padding:1rem 3rem 1rem 1.5rem;font-size:2rem;display:inline-block;position:relative}section.controls article>section #transport button:focus{outline:none}section.controls article>section #transport button:before{content:"";z-index:2;border:1px solid #d0cece;border-radius:3.5rem;width:2.875rem;height:3.3rem;padding:1rem 1rem 1rem 1.5rem;position:absolute;top:-.5rem;left:-.5rem}section.controls article>section #transport button:hover{cursor:pointer;background:#222;transition:all .8s}section.controls article>section #transport h3{float:right;margin:2.4rem 0 0;padding-right:3.7rem;display:inline-block}#parts,#songs{width:90%;max-width:1024px;margin:0 auto;overflow:auto}#parts>ul,#songs>ul{clear:both}#parts>ul:before,#songs>ul:before{content:" "}#parts>ul:after,#songs>ul:after{content:" ";clear:both;display:table}#parts>ul>li,#songs>ul>li{box-sizing:border-box;float:left;cursor:pointer;border:1px solid #e5e5e5;width:23%;height:100px;margin:1%;display:block}#parts>ul>li.part,#parts>ul>li.song,#songs>ul>li.part,#songs>ul>li.song{background-color:#fff;overflow:hidden}#parts>ul>li.part:hover,#parts>ul>li.song:hover,#songs>ul>li.part:hover,#songs>ul>li.song:hover{border:1px solid #ccc}#parts>ul>li.part.mute,#parts>ul>li.song.mute,#songs>ul>li.part.mute,#songs>ul>li.song.mute{background-color:#000}#parts>ul>li.part a,#parts>ul>li.song a,#songs>ul>li.part a,#songs>ul>li.song a{width:100%;height:100px;display:block;position:relative}#parts>ul>li.part a>ul,#parts>ul>li.song a>ul,#songs>ul>li.part a>ul,#songs>ul>li.song a>ul{width:100%;height:100%;position:relative;overflow:hidden}#parts>ul>li.part a>ul li,#parts>ul>li.song a>ul li,#songs>ul>li.part a>ul li,#songs>ul>li.song a>ul li{border-radius:2px;position:absolute}#songs>button{float:right;margin:1%}.part,.song{position:relative}.part header,.song header{z-index:5;background:0 0;display:none;position:absolute;top:0}.part header button,.song header button{margin:2px 0 0 2px}.part:hover header,.song:hover header{display:block}.part li{background:#1aa8dd}.song .Q{background:red}.song .W{background:orange}.song .E{background:#ff0}.song .R{background:green}.song .A{background:#00f}.song .S{background:indigo}.song .D{background:violet}.song .F{background:#000}.play-bar{z-index:3;opacity:.5;background:#c00;width:4px;height:100%;transition-property:left;transition-timing-function:linear;position:absolute;box-shadow:1px 0 #fff}#piano-roll #grid{float:right;background:#fff;width:90%;position:relative;overflow:hidden}#piano-roll #grid .measures{z-index:1;width:100%;height:100%;position:absolute}#piano-roll #grid .measures .measure{box-sizing:border-box;float:right;border-left:1px dashed #b2b2b2;height:100%}#piano-roll #grid ul.notes{cursor:pointer;z-index:2;width:100%;height:100%;position:absolute}#piano-roll #grid ul.notes li{background:#1aa8dd;border-radius:.625rem;height:20px;position:absolute;top:11%;left:0%}#piano-roll #grid ul.notes li.selected{background:#18bf3b}#piano-roll #keyboard{background:#fff;width:10%;font:.875rem/1.625rem Open Sans}#piano-roll #keyboard li{color:#363636;padding:0 0 0 .3rem}#piano-roll #keyboard li.sharp{color:#fff;background:#363636}#piano-roll ul{margin:0;padding:0;list-style-type:none}#piano-roll .row{border-top:1px solid #d4d4d4;height:25px}#piano-roll .sharp{background-color:#e9e8e8}#piano-roll #selection-box{background-color:#0000001a;border:1px dashed #000;position:absolute}