@import url(https://fonts.googleapis.com/css?family=Roboto+Mono);#app{font-family:Avenir,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-align:center;color:#2c3e50}#nav{padding:30px}#nav a{font-weight:700;color:#2c3e50}#nav a.router-link-exact-active{color:#42b983}.piano-key[data-v-38dbb1f8]{cursor:pointer;stroke:#3b3636;fill:#fff;-fill:#fff}.piano-key[data-v-38dbb1f8]:hover{opacity:.88}.piano-key.black[data-v-38dbb1f8]{stroke:#3b3636;fill:#000}.piano-key.black.active[data-v-38dbb1f8]{fill:#b3945b}.piano-key.white[data-v-38dbb1f8]{stroke:#3b3636;fill:#fff}.piano-key.white.active[data-v-38dbb1f8]{fill:#ffcd71}.piano-key.black.tonic[data-v-38dbb1f8],.piano-key.white.tonic[data-v-38dbb1f8]{fill:#ffb11b}.piano-key.black.tonics[data-v-38dbb1f8],.piano-key.white.tonics[data-v-38dbb1f8]{fill:#ffefd1}.piano-key.black.tonic.tonics[data-v-38dbb1f8],.piano-key.white.tonic.tonics[data-v-38dbb1f8]{fill:#ffb11b}svg[data-v-3afc9ac0]{margin:0 auto}g[data-v-26e53ea4]{-webkit-transform:rotate(10deg);transform:rotate(10deg)}.piano-key[data-v-26e53ea4]{cursor:pointer;fill:#545954}.piano-key[data-v-26e53ea4]:hover{opacity:.88}.piano-key.black[data-v-26e53ea4]{z-index:9;fill:#000;stroke:#545954}.piano-key.black.active[data-v-26e53ea4]{fill:#b3945b}.piano-key.white[data-v-26e53ea4]{z-index:8;fill:#fff;stroke:#545954}.piano-key.white.active[data-v-26e53ea4]{fill:#ffcd71}.piano-key.black.tonic[data-v-26e53ea4]{fill:#ffb11b}.piano-key.black.tonics[data-v-26e53ea4]{fill:#ffefd1}.piano-key.black.tonic.tonics[data-v-26e53ea4]{fill:#ffb11b}.piano-key-text[data-v-26e53ea4]{cursor:pointer;fill:#fff;opacity:.44;stroke-width:1}.piano-key-text[data-v-26e53ea4]:hover{opacity:.88}.piano-key-text.black.active[data-v-26e53ea4]{opacity:1;fill:#b3945b;stroke:#b3945b}.piano-key-text.white.active[data-v-26e53ea4]{opacity:1;fill:#ffcd71;stroke:#ffcd71}.piano-key-text.black.tonic[data-v-26e53ea4],.piano-key-text.white.tonic[data-v-26e53ea4]{opacity:1;fill:#ffb11b;stroke:#ffb11b}.piano-key-text.black.tonics[data-v-26e53ea4],.piano-key-text.white.tonics[data-v-26e53ea4]{opacity:1;fill:#ffefd1;stroke:#ffefd1}.piano-key-text.black.tonic.tonics[data-v-26e53ea4],.piano-key-text.white.tonic.tonics[data-v-26e53ea4]{opacity:1;fill:#ffb11b;stroke:#ffb11b}.dot[data-v-5970068a]{fill:#545954}.display[data-v-335f2bed]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}@media (min-width:680px){.display[data-v-335f2bed]{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}}.roto-keyboard[data-v-335f2bed]{height:28vh;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}@media (min-width:680px){.roto-keyboard[data-v-335f2bed]{height:38vh}}.piano-keyboard[data-v-335f2bed]{padding:1rem;-webkit-box-flex:4;-ms-flex-positive:4;flex-grow:4;height:22vh;display:-webkit-box;display:-ms-flexbox;display:flex}@media (min-width:680px){.piano-keyboard[data-v-335f2bed]{height:32vh}}.row-flex[data-v-335f2bed]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;overflow-x:auto}.row-flex.wrap[data-v-335f2bed]{-ms-flex-wrap:wrap;flex-wrap:wrap}@media (min-width:680px){.row-flex[data-v-335f2bed]{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}}.row-flex .col[data-v-335f2bed]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex:1;flex:1}@media (min-width:679px){.row-flex .col[data-v-335f2bed]{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}}@media (min-width:680px){.row-flex .col[data-v-335f2bed]{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}}.row-flex .col.expand[data-v-335f2bed]{-webkit-box-flex:2;-ms-flex:2;flex:2}.chord-keyboard[data-v-335f2bed]{-webkit-box-flex:4;-ms-flex-positive:4;flex-grow:4;height:auto}@media (min-width:680px){.chord-keyboard[data-v-335f2bed]{height:auto}}.scale[data-v-335f2bed]{height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:left;-ms-flex-align:left;align-items:left;background-color:#545954}.scale a[data-v-335f2bed]{color:#fff;text-decoration:none}.scale .key-box[data-v-335f2bed]{text-transform:capitalize;font-size:1.1rem;margin-bottom:1rem}.scale .key-name[data-v-335f2bed]{display:inline-block}.scale .key-group[data-v-335f2bed]{-webkit-box-orient:vertical;-ms-flex-direction:column;flex-direction:column;color:#fff;padding:1rem;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.scale .key-group .row[data-v-335f2bed],.scale .key-group[data-v-335f2bed]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-direction:normal}.scale .key-group .row[data-v-335f2bed]{-webkit-box-orient:horizontal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;overflow-x:auto;overflow-y:hidden;margin-bottom:.5rem}.scale .key-group .row .col[data-v-335f2bed]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-flex:1;-ms-flex:1;flex:1}@media (min-width:680px){.scale .key-group .row .col[data-v-335f2bed]{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}}.scale .key-group .row .col.expand[data-v-335f2bed]{-webkit-box-flex:2;-ms-flex:2;flex:2}.scale .key-group .row .head[data-v-335f2bed]{min-width:12rem}.scale .key-group .row .preset-item[data-v-335f2bed]{font-size:1.2rem;text-align:left;-webkit-box-flex:1;-ms-flex:1;flex:1}.scale .key-group .row .item-sup[data-v-335f2bed]{font-size:1rem;line-height:1}.scale .key-group .row a[data-v-335f2bed],.scale .key-group .row span[data-v-335f2bed]{padding-right:.2rem}.scale .item-chord[data-v-335f2bed],.scale .piano-chord[data-v-335f2bed]{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-sizing:border-box;box-sizing:border-box;width:calc(100% - .5rem);display:-webkit-box;display:-ms-flexbox;display:flex;margin:.4rem .25rem .2rem .25rem;padding:.3rem;border-radius:.2rem;background-color:rgba(119,126,119,.808);position:relative}@media (min-width:680px){.scale .item-chord[data-v-335f2bed],.scale .piano-chord[data-v-335f2bed]{width:calc(50% - .5rem)}}@media (min-width:1200px){.scale .item-chord[data-v-335f2bed],.scale .piano-chord[data-v-335f2bed]{width:calc(25% - .5rem)}}.scale .item-chord[data-v-335f2bed]:hover,.scale .piano-chord[data-v-335f2bed]:hover{background-color:transparent;cursor:pointer}.scale .item-chord[data-v-335f2bed]:hover:before,.scale .piano-chord[data-v-335f2bed]:hover:before{content:"♬";position:absolute;top:.66rem;right:.3rem;opacity:.66}.scale .chord-name[data-v-335f2bed],.scale .scale-name[data-v-335f2bed]{font-size:1.2rem;text-align:center;padding:.1rem .5rem .4rem}.scale .scale-name[data-v-335f2bed]{text-transform:capitalize}.scale .chord-interval[data-v-335f2bed]{font-size:.8rem}.scale .big[data-v-335f2bed]{font-size:4rem;font-weight:700}.scale .mid[data-v-335f2bed]{font-size:2rem;font-weight:700;color:#fff}.scale .mini[data-v-335f2bed]{font-size:1.2rem;font-weight:700;color:#fff;opacity:.8}.scale small[data-v-335f2bed]{opacity:.82}.scale .chords-title[data-v-335f2bed],.scale .chords[data-v-335f2bed]{padding-top:.5rem;padding-bottom:.5rem}.scale .chords-title[data-v-335f2bed]{line-height:1.4rem;width:100%;border-bottom:.2rem solid #fff;text-align:left}.scale .preset-item[data-v-335f2bed]{text-transform:capitalize;padding:.2rem;text-align:center;border-bottom:.2rem solid #fff}.scale .preset-item.router-link-exact-active[data-v-335f2bed]{color:#ffb11b;border-bottom:.2rem solid #ffb11b}.scale .btn[data-v-335f2bed]{display:block;background:#ffb11b;color:#fff;border:none;border-radius:2px;float:left;line-height:1.6;margin-right:.5rem}.scale select[data-v-335f2bed]{-webkit-appearance:none;background:none;border:none;border-bottom:.2rem solid #fff;color:#fff;padding:.5rem .5rem .5rem 0;border-radius:1px}.scale select.before[data-v-335f2bed]{content:">";position:absolute;left:0;top:0}html{font-family:Roboto Mono,monospace;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;outline:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#545954}@media (min-width:679px){html{font-size:1rem}}@media (min-width:680px){html{font-size:1.2rem}}@media (min-width:1200px){html{font-size:1.3rem}}@media (min-width:1800px){html{font-size:1.4rem}}h1,h2,h3,h4{margin:0}::-moz-selection{background-color:rgba(65,131,196,.4)}::selection{background-color:rgba(65,131,196,.4)}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-button{width:0;height:0}::-webkit-scrollbar-thumb{background:hsla(0,0%,48.6%,.16);border:0 none hsla(0,0%,48.6%,.16);border-radius:50px}::-webkit-scrollbar-thumb:hover{background:hsla(0,0%,48.6%,.22)}::-webkit-scrollbar-thumb:active,::-webkit-scrollbar-track{background:hsla(0,0%,48.6%,.16)}::-webkit-scrollbar-track{border:0 none #fff;border-radius:50%}::-webkit-scrollbar-track:hover{background:hsla(0,0%,48.6%,.16)}::-webkit-scrollbar-corner,::-webkit-scrollbar-track:active{background:transparent}