.ps-container{overflow:hidden!important}.ps-container.ps-active-x>.ps-scrollbar-x-rail,.ps-container.ps-active-y>.ps-scrollbar-y-rail{display:block}.ps-container.ps-in-scrolling{pointer-events:none}.ps-container.ps-in-scrolling.ps-x>.ps-scrollbar-x-rail{background-color:#eee;opacity:.9}.ps-container.ps-in-scrolling.ps-x>.ps-scrollbar-x-rail>.ps-scrollbar-x{background-color:#999}.ps-container.ps-in-scrolling.ps-y>.ps-scrollbar-y-rail{background-color:#eee;opacity:.9}.ps-container.ps-in-scrolling.ps-y>.ps-scrollbar-y-rail>.ps-scrollbar-y{background-color:#999}.ps-container>.ps-scrollbar-x-rail{display:none;position:absolute;-webkit-border-radius:4px;-moz-border-radius:4px;-ms-border-radius:4px;border-radius:4px;opacity:0;-webkit-transition:background-color .2s linear,opacity .2s linear;-moz-transition:background-color .2s linear,opacity .2s linear;-o-transition:background-color .2s linear,opacity .2s linear;transition:background-color .2s linear,opacity .2s linear;bottom:3px;height:8px}.ps-container>.ps-scrollbar-x-rail>.ps-scrollbar-x{position:absolute;background-color:#aaa;-webkit-border-radius:4px;-moz-border-radius:4px;-ms-border-radius:4px;border-radius:4px;-webkit-transition:background-color .2s linear;-moz-transition:background-color .2s linear;-o-transition:background-color .2s linear;transition:background-color .2s linear;bottom:0;height:8px}.ps-container>.ps-scrollbar-y-rail{display:none;position:absolute;-webkit-border-radius:4px;-moz-border-radius:4px;-ms-border-radius:4px;border-radius:4px;opacity:0;-webkit-transition:background-color .2s linear,opacity .2s linear;-moz-transition:background-color .2s linear,opacity .2s linear;-o-transition:background-color .2s linear,opacity .2s linear;transition:background-color .2s linear,opacity .2s linear;right:3px;width:8px}.ps-container>.ps-scrollbar-y-rail>.ps-scrollbar-y{position:absolute;background-color:#aaa;-webkit-border-radius:4px;-moz-border-radius:4px;-ms-border-radius:4px;border-radius:4px;-webkit-transition:background-color .2s linear;-moz-transition:background-color .2s linear;-o-transition:background-color .2s linear;transition:background-color .2s linear;right:0;width:8px}.ps-container:hover.ps-in-scrolling{pointer-events:none}.ps-container:hover.ps-in-scrolling.ps-x>.ps-scrollbar-x-rail{background-color:#eee;opacity:.9}.ps-container:hover.ps-in-scrolling.ps-x>.ps-scrollbar-x-rail>.ps-scrollbar-x{background-color:#999}.ps-container:hover.ps-in-scrolling.ps-y>.ps-scrollbar-y-rail{background-color:#eee;opacity:.9}.ps-container:hover.ps-in-scrolling.ps-y>.ps-scrollbar-y-rail>.ps-scrollbar-y{background-color:#999}.ps-container:hover>.ps-scrollbar-x-rail,.ps-container:hover>.ps-scrollbar-y-rail{opacity:.6}.ps-container:hover>.ps-scrollbar-x-rail:hover{background-color:#eee;opacity:.9}.ps-container:hover>.ps-scrollbar-x-rail:hover>.ps-scrollbar-x{background-color:#999}.ps-container:hover>.ps-scrollbar-y-rail:hover{background-color:#eee;opacity:.9}.ps-container:hover>.ps-scrollbar-y-rail:hover>.ps-scrollbar-y{background-color:#999}.inset{background-color:#fefefe;border:1px solid #ddd;border-radius:10px;box-shadow:inset 0 2px 10px #ddd}.player{}.player .btn-play{width:70px}.player .bpm{max-width:166px;margin-top:2px}.player .timer{font-size:18px;line-height:46px}.player .player-buttons{margin-left:10px}.btn.active{color:#008ee5}.tracks-container{margin:20px 0}.canvasgrid>.box-select{display:none;border:1px dashed #777;position:absolute;z-index:100}.canvasgrid{position:relative}.canvasgrid>.shelf{border-bottom-right-radius:6px;border-top-right-radius:6px;border-right:1px solid #ccc;border-top:1px solid #ccc;border-bottom:1px solid #ccc;min-height:70px}.instrument{border-bottom-left-radius:6px;border-top-left-radius:6px;border:1px solid #ccc;text-shadow:0 1px 0 #fff;background-image:-webkit-linear-gradient(top,#fff 0%,#e0e0e0 100%);background-image:-o-linear-gradient(top,#fff 0%,#e0e0e0 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#fff),to(#e0e0e0));background-image:linear-gradient(to bottom,#fff 0%,#e0e0e0 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff',endColorstr='#ffe0e0e0',GradientType=0);filter:progid:DXImageTransform.Microsoft.gradient(enabled=false);background-repeat:repeat-x;border-color:#dbdbdb;border-color:#ccc;min-height:70px}.canvas{box-sizing:border-box;border:1px solid #aaa;position:absolute;height:70px;z-index:1;opacity:.9;border-radius:6px;top:0;background-image:-webkit-linear-gradient(top,#efe 0%,#aea 100%);background-image:-o-linear-gradient(top,#efe 0%,#aea 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#efe),to(#aea));background-image:linear-gradient(to bottom,#efe 0%,#aea 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#e0f0e0',endColorstr='#a0e0a0',GradientType=0);filter:progid:DXImageTransform.Microsoft.gradient(enabled=false)}.canvas.is-selected{background-image:-webkit-linear-gradient(top,#fee 0%,#eaa 100%);background-image:-o-linear-gradient(top,#fee 0%,#eaa 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#fee),to(#eaa));background-image:linear-gradient(to bottom,#fee 0%,#eaa 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f0e0e0',endColorstr='#e0a0a0',GradientType=0);filter:progid:DXImageTransform.Microsoft.gradient(enabled=false)}.canvas.ui-draggable-dragging{border-width:2px;z-index:2}.tracks-header{height:20px}.tracks-playhead{position:relative;height:20px}.btn-canvas-edit{display:none;position:absolute;left:0;top:0}.canvas:hover>.btn-canvas-edit{display:inline-block}.roll-header{margin-top:20px;margin-bottom:20px}.roll-and-keys{}.roll{border:1px solid #000;box-sizing:border-box;position:relative;margin-left:100px}.roll.is-cursor-select{cursor:context-menu}.roll.is-cursor-add{cursor:copy}.roll.is-cursor-subtract{cursor:alias}.roll>.box-select{display:none;border:1px dashed #fff;position:absolute;z-index:100}.track{padding:0;margin:0;height:20px;border-bottom:1px solid #000;box-sizing:border-box}.cursor{width:1px;height:100%;top:0;background-color:#ff0;position:absolute;z-index:100}.playhead{width:1px;height:100%;top:0;position:absolute;z-index:100;border:1px solid #ccc;width:20px;border-radius:10px;text-shadow:0 1px 0 #fff;background-image:-webkit-linear-gradient(top,#fff 0%,#e0e0e0 100%);background-image:-o-linear-gradient(top,#fff 0%,#e0e0e0 100%);background-image:-webkit-gradient(linear,left top,left bottom,from(#fff),to(#e0e0e0));background-image:linear-gradient(to bottom,#fff 0%,#e0e0e0 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff',endColorstr='#ffe0e0e0',GradientType=0);filter:progid:DXImageTransform.Microsoft.gradient(enabled=false);background-repeat:repeat-x;border-color:#dbdbdb;border-color:#ccc}.canvasgrid .cursor{background-color:#739873}.track-1{background-image:url('../Images/track1.png')}.track-2{background-image:url('../Images/track2.png')}.track-3{background-image:url('../Images/track3.png')}.track-4{background-image:url('../Images/track4.png')}.track-5{background-image:url('../Images/track5.png')}.track:hover{border-top:1px solid #aaa;border-bottom:1px solid #aaa}.note{box-sizing:border-box;border:1px solid #fff;position:absolute;height:19px;background-color:#afa;z-index:1;opacity:.9;border-radius:5px}.note.is-selected{background-color:#faa}.note.ui-draggable-dragging{border-width:2px;z-index:2}.ui-resizable-handle{position:absolute;font-size:.1px;display:block;-ms-touch-action:none;touch-action:none}.ui-resizable-disabled .ui-resizable-handle,.ui-resizable-autohide .ui-resizable-handle{display:none}.ui-resizable-e{cursor:e-resize;width:7px;right:-5px;top:0;height:100%}.ps-scrollbar-x{background-color:#fff!important;height:10px!important}.ps-scrollbar-y{background-color:#fff!important;width:10px!important}.keyboard{width:100px;position:absolute;z-index:10}.key{position:relative;height:30px;border:1px solid #000;box-sizing:border-box;font-size:smaller;border-radius:3px}.key.key-black{background-color:#141414;height:20px;width:85%;left:0;top:-10px;z-index:1;margin-bottom:-20px;color:#fff}.key.key-white{background-color:#fff;color:#000}.key.key-white.key-white-sandwiched{height:40px;padding-top:10px}.key.key-white.key-white-blackontop{padding-top:10px}.key.key-white.key-white-blackonbottom{padding-top:0}.key.key-white.key-white-tippytop{padding-top:0;height:20px}.key.key-is-active{background-color:#ff0;color:#000}.key:hover{border-color:#aaa;cursor:pointer}.track>.key-white{background-color:#fff;opacity:.2;width:100%;height:100%}.track>.key-c{opacity:.35}.track>.key-is-active{background-color:#ff0;opacity:.2;width:100%;height:100%}