emilis
/
tonnetz.eu
1
1
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
main
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from 'main'
${ noResults }
tonnetz.eu/index.html

3312 lines
250 KiB
HTML
Raw Permalink Blame History

<!DOCTYPE html>
<html lang="en">
<!-- (c) Emilis Dambauskas 2021 https://tildegit.org/emilis/tonnetz.eu -->
<head>
<meta charset="utf8">
<meta name="viewport" content="width=1024">
<title>Tonnetz.EU</title>
<style type="text/css">
html {
margin: 0;
padding: 0;
position: relative;
}
body {
background-color: #111;
color: #eee;
font-family: serif;
font-size: 100%;
line-height: 1.6;
}
a {
color: #69c;
display: block;
padding: 0.25em 0;
}
a:hover {
background-color: #123;
}
h1, h2, h3, h4, h5, h6 {
font-family: serif;
}
h1 {
font-size: 200%;
}
input[type=checkbox],
input[type=radio] {
display: none;
}
label {
cursor: pointer;
}
li {
margin-bottom: 0.4em;
}
li:last-child {
margin-bottom: 0;
}
/*- Background -------------------------------------------------------------- */
#background {
background-color: #111;
bottom: 0;
content: '';
display: block;
left: 0;
position: absolute;
right: 0;
top: 0;
z-index: -3;
}
/*- Menu button ------------------------------------------------------------- */
#menu-button {
background-color: #69c;
border-radius: 0 0 0.25em 0;
color: black;
display: block;
font-family: sans-serif;
font-size: 200%;
font-weight: bold;
left: 0;
padding: 0 1em;
position: absolute;
text-align: center;
top: 0;
z-index: 3;
}
#menu-button > .closed {
display: inline;
}
#menu-button > .opened {
display: none;
}
#menu-button:hover {
background-color: #9cf;
}
input#ui-menu:checked ~ #menu-button > .closed {
display: none;
}
input#ui-menu:checked ~ #menu-button > .opened {
display: inline;
}
/*- Main menu --------------------------------------------------------------- */
#menu {
background-color: rgba( 0, 0, 0, 0.9 );
border-radius: 0 0 1em 0;
box-sizing: border-box;
display: none;
font-family: sans-serif;
left: 0;
max-width: 80vw;
padding: 1em 2em;
position: absolute;
top: 0;
width: 32em;
z-index: 2;
}
input#ui-menu:checked ~ #menu {
display: block;
}
#menu > label {
display: block;
color: #9cf;
padding: 0.5em 0;
}
#menu > label::before {
content: '❌';
display: inline-block;
margin-right: 0.5em;
position: relative;
}
#menu > label:hover {
background-color: #123;
}
input#theme-default:checked ~ #menu > .for-theme-default,
input#theme-bow:checked ~ #menu > .for-theme-bow,
input#theme-wob:checked ~ #menu > .for-theme-wob,
input#i-p4:checked ~ #menu > .toggle-interval.for-i-p4,
input#i-ma2:checked ~ #menu > .toggle-interval.for-i-ma2,
input#i-ma6:checked ~ #menu > .toggle-interval.for-i-ma6,
input#i-mi2:checked ~ #menu > .toggle-interval.for-i-mi2,
input#i-ma3:checked ~ #menu > .toggle-interval.for-i-ma3,
input#i-ma7:checked ~ #menu > .toggle-interval.for-i-ma7,
input#i-tri:checked ~ #menu > .toggle-interval.for-i-tri {
font-weight: bold;
}
input#theme-default:checked ~ #menu > .for-theme-default::before,
input#theme-bow:checked ~ #menu > .for-theme-bow::before,
input#theme-wob:checked ~ #menu > .for-theme-wob::before,
input#i-p4:checked ~ #menu > .toggle-interval.for-i-p4::before,
input#i-ma2:checked ~ #menu > .toggle-interval.for-i-ma2::before,
input#i-ma6:checked ~ #menu > .toggle-interval.for-i-ma6::before,
input#i-mi2:checked ~ #menu > .toggle-interval.for-i-mi2::before,
input#i-ma3:checked ~ #menu > .toggle-interval.for-i-ma3::before,
input#i-ma7:checked ~ #menu > .toggle-interval.for-i-ma7::before,
input#i-tri:checked ~ #menu > .toggle-interval.for-i-tri::before {
content: '👁️';
}
/*- Circles ----------------------------------------------------------------- */
main {
display: flex;
flex-direction: row;
height: 100%;
margin-top: -9em;
width: 100%;
overflow: hidden;
}
.block {
display: flex;
flex-direction: row;
}
.block > .column,
.block > .column > label {
display: block;
list-style: none;
margin: 0;
padding: 0;
}
.block > .column {
margin-right: 2em;
}
.block > .column:nth-child(2) { margin-top: 3em; }
.block > .column:nth-child(3) { margin-top: 6em; }
.block > .column:nth-child(4) { margin-top: 2em; }
.block > .column:nth-child(5) { margin-top: 5em; }
.block > .column:nth-child(6) { margin-top: 1em; }
.block > .column:nth-child(7) { margin-top: 4em; }
.block > .column > label {
border-radius: 50%;
border: 1px solid lime;
box-sizing: border-box;
cursor: pointer;
height: 2em;
line-height: calc(2em - 2px);
margin-bottom: 5em;
text-align: center;
width: 2em;
}
.block > .column > label:hover {
border-width: 4px;
box-shadow: 0 0 6px white;
line-height: calc(2em - 8px);
}
.block > .column > label.a { color: hsl( 0deg, 100%, 60% ); border-color: hsl( 0deg, 100%, 60% ); }
.block > .column > label.d { color: hsl( 30deg, 100%, 60% ); border-color: hsl( 30deg, 100%, 60% ); }
.block > .column > label.g { color: hsl( 60deg, 100%, 60% ); border-color: hsl( 60deg, 100%, 60% ); }
.block > .column > label.c { color: hsl( 90deg, 100%, 60% ); border-color: hsl( 90deg, 100%, 60% ); }
.block > .column > label.f { color: hsl( 120deg, 100%, 60% ); border-color: hsl( 120deg, 100%, 60% ); }
.block > .column > label.as { color: hsl( 150deg, 100%, 60% ); border-color: hsl( 150deg, 100%, 60% ); }
.block > .column > label.ds { color: hsl( 180deg, 100%, 60% ); border-color: hsl( 180deg, 100%, 60% ); }
.block > .column > label.gs { color: hsl( 210deg, 100%, 60% ); border-color: hsl( 210deg, 100%, 60% ); }
.block > .column > label.cs { color: hsl( 240deg, 100%, 65% ); border-color: hsl( 240deg, 100%, 63% ); }
.block > .column > label.fs { color: hsl( 270deg, 100%, 65% ); border-color: hsl( 270deg, 100%, 60% ); }
.block > .column > label.b { color: hsl( 300deg, 100%, 60% ); border-color: hsl( 300deg, 100%, 60% ); }
.block > .column > label.e { color: hsl( 330deg, 100%, 60% ); border-color: hsl( 330deg, 100%, 60% ); }
input#c-a:checked ~ .block > .column > label.a,
input#c-as:checked ~ .block > .column > label.as,
input#c-b:checked ~ .block > .column > label.b,
input#c-c:checked ~ .block > .column > label.c,
input#c-cs:checked ~ .block > .column > label.cs,
input#c-d:checked ~ .block > .column > label.d,
input#c-ds:checked ~ .block > .column > label.ds,
input#c-e:checked ~ .block > .column > label.e,
input#c-f:checked ~ .block > .column > label.f,
input#c-fs:checked ~ .block > .column > label.fs,
input#c-g:checked ~ .block > .column > label.g,
input#c-gs:checked ~ .block > .column > label.gs {
border-width: 4px;
line-height: calc(2em - 8px);
}
.int {
background-color: #fff;
border: 0 none transparent;
display: none;
margin: 0;
opacity: 0.4;
padding: 0;
position: relative;
visibility: hidden;
width: 6px;
z-index: -2;
}
.int.i-p4 {
background-color: #36f;
height: 5em;
margin-bottom: -5em;
transform: translate(calc(1em - 3px), 2em);
}
.int.i-ma2 {
background-color: #666;
height: 9em;
margin-bottom: -9em;
transform: translate(2.9em, 1.5em) rotate(159deg);
z-index: -3;
}
.int.i-ma6 {
background-color: #0f0;
height: 3em;
margin-bottom: -3em;
transform: translate(2.9em,0.95em) rotate(-51deg);
}
.int.i-mi2 {
background-color: #f00;
height: 6.3em;
margin-bottom: -6.3em;
transform: translate(4.9em, -2.7em) rotate(-98deg);
}
.int.i-ma3 {
background-color: #3cc;
height: 4em;
margin-bottom: -4em;
transform: translate(2.8em,-3.1em) rotate(45deg);
}
.int.i-ma7 {
background-color: red;
height: 10em;
margin-bottom: -10em;
transform: translate(2.8em,-9.5em) rotate(19deg);
}
.int.i-tri {
background-color: transparent;
border-radius: 50%;
border-right: 6px dotted red;
height: 9em;
margin-bottom: -9em;
margin-right: -3em;
transform: translate(3.8em,-1em) rotate(-52deg);
width: 3em;
z-index: -1;
}
input#c-a:checked ~ input#c-as:checked ~ .block > .column > .int.a.as,
input#c-a:checked ~ input#c-b:checked ~ .block > .column > .int.a.b,
input#c-a:checked ~ input#c-c:checked ~ .block > .column > .int.a.c,
input#c-a:checked ~ input#c-cs:checked ~ .block > .column > .int.a.cs,
input#c-a:checked ~ input#c-d:checked ~ .block > .column > .int.a.d,
input#c-a:checked ~ input#c-ds:checked ~ .block > .column > .int.a.ds,
input#c-a:checked ~ input#c-e:checked ~ .block > .column > .int.a.e,
input#c-a:checked ~ input#c-f:checked ~ .block > .column > .int.a.f,
input#c-a:checked ~ input#c-fs:checked ~ .block > .column > .int.a.fs,
input#c-a:checked ~ input#c-g:checked ~ .block > .column > .int.a.g,
input#c-a:checked ~ input#c-gs:checked ~ .block > .column > .int.a.gs,
input#c-as:checked ~ input#c-b:checked ~ .block > .column > .int.as.b,
input#c-as:checked ~ input#c-c:checked ~ .block > .column > .int.as.c,
input#c-as:checked ~ input#c-cs:checked ~ .block > .column > .int.as.cs,
input#c-as:checked ~ input#c-d:checked ~ .block > .column > .int.as.d,
input#c-as:checked ~ input#c-ds:checked ~ .block > .column > .int.as.ds,
input#c-as:checked ~ input#c-e:checked ~ .block > .column > .int.as.e,
input#c-as:checked ~ input#c-f:checked ~ .block > .column > .int.as.f,
input#c-as:checked ~ input#c-fs:checked ~ .block > .column > .int.as.fs,
input#c-as:checked ~ input#c-g:checked ~ .block > .column > .int.as.g,
input#c-as:checked ~ input#c-gs:checked ~ .block > .column > .int.as.gs,
input#c-b:checked ~ input#c-c:checked ~ .block > .column > .int.b.c,
input#c-b:checked ~ input#c-cs:checked ~ .block > .column > .int.b.cs,
input#c-b:checked ~ input#c-d:checked ~ .block > .column > .int.b.d,
input#c-b:checked ~ input#c-ds:checked ~ .block > .column > .int.b.ds,
input#c-b:checked ~ input#c-e:checked ~ .block > .column > .int.b.e,
input#c-b:checked ~ input#c-f:checked ~ .block > .column > .int.b.f,
input#c-b:checked ~ input#c-fs:checked ~ .block > .column > .int.b.fs,
input#c-b:checked ~ input#c-g:checked ~ .block > .column > .int.b.g,
input#c-b:checked ~ input#c-gs:checked ~ .block > .column > .int.b.gs,
input#c-c:checked ~ input#c-cs:checked ~ .block > .column > .int.c.cs,
input#c-c:checked ~ input#c-d:checked ~ .block > .column > .int.c.d,
input#c-c:checked ~ input#c-ds:checked ~ .block > .column > .int.c.ds,
input#c-c:checked ~ input#c-e:checked ~ .block > .column > .int.c.e,
input#c-c:checked ~ input#c-f:checked ~ .block > .column > .int.c.f,
input#c-c:checked ~ input#c-fs:checked ~ .block > .column > .int.c.fs,
input#c-c:checked ~ input#c-g:checked ~ .block > .column > .int.c.g,
input#c-c:checked ~ input#c-gs:checked ~ .block > .column > .int.c.gs,
input#c-cs:checked ~ input#c-d:checked ~ .block > .column > .int.cs.d,
input#c-cs:checked ~ input#c-ds:checked ~ .block > .column > .int.cs.ds,
input#c-cs:checked ~ input#c-e:checked ~ .block > .column > .int.cs.e,
input#c-cs:checked ~ input#c-f:checked ~ .block > .column > .int.cs.f,
input#c-cs:checked ~ input#c-fs:checked ~ .block > .column > .int.cs.fs,
input#c-cs:checked ~ input#c-g:checked ~ .block > .column > .int.cs.g,
input#c-cs:checked ~ input#c-gs:checked ~ .block > .column > .int.cs.gs,
input#c-d:checked ~ input#c-ds:checked ~ .block > .column > .int.d.ds,
input#c-d:checked ~ input#c-e:checked ~ .block > .column > .int.d.e,
input#c-d:checked ~ input#c-f:checked ~ .block > .column > .int.d.f,
input#c-d:checked ~ input#c-fs:checked ~ .block > .column > .int.d.fs,
input#c-d:checked ~ input#c-g:checked ~ .block > .column > .int.d.g,
input#c-d:checked ~ input#c-gs:checked ~ .block > .column > .int.d.gs,
input#c-ds:checked ~ input#c-e:checked ~ .block > .column > .int.ds.e,
input#c-ds:checked ~ input#c-f:checked ~ .block > .column > .int.ds.f,
input#c-ds:checked ~ input#c-fs:checked ~ .block > .column > .int.ds.fs,
input#c-ds:checked ~ input#c-g:checked ~ .block > .column > .int.ds.g,
input#c-ds:checked ~ input#c-gs:checked ~ .block > .column > .int.ds.gs,
input#c-e:checked ~ input#c-f:checked ~ .block > .column > .int.e.f,
input#c-e:checked ~ input#c-fs:checked ~ .block > .column > .int.e.fs,
input#c-e:checked ~ input#c-g:checked ~ .block > .column > .int.e.g,
input#c-e:checked ~ input#c-gs:checked ~ .block > .column > .int.e.gs,
input#c-f:checked ~ input#c-fs:checked ~ .block > .column > .int.f.fs,
input#c-f:checked ~ input#c-g:checked ~ .block > .column > .int.f.g,
input#c-f:checked ~ input#c-gs:checked ~ .block > .column > .int.f.gs,
input#c-fs:checked ~ input#c-g:checked ~ .block > .column > .int.fs.g,
input#c-fs:checked ~ input#c-gs:checked ~ .block > .column > .int.fs.gs,
input#c-g:checked ~ input#c-gs:checked ~ .block > .column > .int.g.gs,
div.css-placeholder {
display: block;
}
input#i-p4:checked ~ main > .block > .column > .int.i-p4,
input#i-ma2:checked ~ main > .block > .column > .int.i-ma2,
input#i-ma6:checked ~ main > .block > .column > .int.i-ma6,
input#i-mi2:checked ~ main > .block > .column > .int.i-mi2,
input#i-ma3:checked ~ main > .block > .column > .int.i-ma3,
input#i-ma7:checked ~ main > .block > .column > .int.i-ma7,
input#i-tri:checked ~ main > .block > .column > .int.i-tri {
visibility: visible;
}
/*- Themes ------------------------------------------------------------------ */
/*- black-on-white ---------------------------------------------------------- */
input#theme-bow:checked ~ #background {
background-color: white;
}
input#theme-bow:checked ~ #menu-button {
background-color: #ccc;
}
input#theme-bow:checked ~ #menu {
background-color: #eee;
color: #222;
}
input#theme-bow:checked ~ #menu a,
input#theme-bow:checked ~ #menu > label {
color: #036;
}
input#theme-bow:checked ~ #menu a:hover,
input#theme-bow:checked ~ #menu > label:hover {
background-color: #ccc;
}
input#theme-bow:checked ~ main > .block > .column > label {
color: #333;
border-color: #666;
}
input#theme-bow:checked ~ main > .block > .column > label:hover {
box-shadow: 0 0 6px black;
}
input#theme-bow:checked ~ main > .block > .column > .int {
background-color: #666;
}
input#theme-bow:checked ~ main > .block > .column > .int.i-tri {
background-color: transparent;
border-color: #666;
}
/*- white-on-black ---------------------------------------------------------- */
input#theme-wob:checked ~ #background {
background-color: #000;
}
input#theme-wob:checked ~ main > .block > .column > label {
color: #fff;
border-color: #555;
}
input#theme-wob:checked ~ main > .block > .column > .int {
background-color: #fff;
}
input#theme-wob:checked ~ main > .block > .column > .int.i-tri {
background-color: transparent;
border-color: #fff;
}
/*- Printing ---------------------------------------------------------------- */
@media print {
@page {
margin: 0;
}
body {
font-size: 5pt;
line-height: 1;
}
#background,
#menu-button,
#menu,
.int {
display: none !important;
}
main > .block > .column {
margin-right: 20pt !important;
}
main > .block > .column:nth-child(2) { margin-top: 30pt; }
main > .block > .column:nth-child(3) { margin-top: 60pt; }
main > .block > .column:nth-child(4) { margin-top: 20pt; }
main > .block > .column:nth-child(5) { margin-top: 50pt; }
main > .block > .column:nth-child(6) { margin-top: 10pt; }
main > .block > .column:nth-child(7) { margin-top: 40pt; }
main > .block > .column > label {
border: 1pt solid #666 !important;
height: 20pt !important;
line-height: 20pt !important;
margin-bottom: 50pt !important;
width: 20pt !important;
}
}
</style>
</head>
<body>
<input type="checkbox" id="ui-menu" checked>
<input type="radio" name="theme" id="theme-default" checked>
<input type="radio" name="theme" id="theme-bow">
<input type="radio" name="theme" id="theme-wob">
<input type="checkbox" id="i-p4" checked>
<input type="checkbox" id="i-ma2" checked>
<input type="checkbox" id="i-ma6" checked>
<input type="checkbox" id="i-mi2">
<input type="checkbox" id="i-ma3" checked>
<input type="checkbox" id="i-ma7" checked>
<input type="checkbox" id="i-tri" checked>
<div id="background"></div>
<label id="menu-button" for="ui-menu">
<span class="opened">X</span>
<span class="closed">Menu</span>
</label>
<aside id="menu">
<h1>Tonnetz.EU</h1>
<p>Shows harmonic relationships between musical notes.</p>
<p>Click on the circles to highlight them and see the intervals.</p>
<h3>Try these out:</h3>
<ul>
<li>A major chord: <strong>C-E-G</strong></li>
<li>A minor chord: <strong>A-E-C</strong></li>
<li>A suspended chord: <strong>F-C-G</strong></li>
<li>A major 7th chord: <strong>C-E-G-B</strong></li>
<li>A minor 7th chord: <strong>A-C-E-G</strong></li>
</ul>
<h3>Further excercises:</h3>
<ul>
<li>Find the largest chord without dissonant intervals.</li>
<li>Highlight a major scale (show only P5, M3 & m3 intervals). Highlight other scales.</li>
<li>Find roots of chords. Find chords with multiple roots. Find chords without a single root.</li>
</ul>
<h3>Learn more</h3>
<ul>
<li><a href="https://en.wikipedia.org/wiki/Tonnetz">Wikipedia: Tonnetz</a></li>
</ul>
<h2>Show/hide intervals:</h2>
<label class="toggle-interval for-i-p4" for="i-p4">
P5 & P4: perfect 5th and perfect 4th
</label>
<label class="toggle-interval for-i-ma3" for="i-ma3">
M3 & m6: major 3rd and minor 6th
</label>
<label class="toggle-interval for-i-ma6" for="i-ma6">
m3 & M6: minor 3rd and major 6th
</label>
<label class="toggle-interval for-i-ma2" for="i-ma2">
m7 (M2): minor 7th (major 2nd)
</label>
<label class="toggle-interval for-i-tri" for="i-tri">
tritone
</label>
<label class="toggle-interval for-i-ma7" for="i-ma7">
M7 (m2): major 7th (minor 2nd)
</label>
<label class="toggle-interval for-i-mi2" for="i-mi2">
m2 (M7): minor 2nd (major 7th)
</label>
<h2>Color scheme:</h2>
<label class="change-theme for-theme-default" for="theme-default">
Colors on black (default)
</label>
<label class="change-theme for-theme-wob" for="theme-wob">
White on black
</label>
<label class="change-theme for-theme-bow" for="theme-bow">
Black on white
</label>
<h2>About</h2>
<p><a href="https://tildegit.org/emilis/tonnetz.eu">Source code</a></p>
<p>You can reach me at: emilis [at] tonnetz.eu.</p>
</aside>
<main>
<input type="checkbox" id="c-a">
<input type="checkbox" id="c-as">
<input type="checkbox" id="c-b">
<input type="checkbox" id="c-c" checked>
<input type="checkbox" id="c-cs">
<input type="checkbox" id="c-d">
<input type="checkbox" id="c-ds">
<input type="checkbox" id="c-e" checked>
<input type="checkbox" id="c-f">
<input type="checkbox" id="c-fs">
<input type="checkbox" id="c-g" checked>
<input type="checkbox" id="c-gs">
<div class="block">
<div class="column">
<hr class="int i-p4 as ds"><hr class="int i-ma2 as c"><hr class="int i-ma6 as g"><hr class="int i-mi2 as b"><hr class="int i-ma3 as d"><hr class="int i-ma7 as a">
<hr class="int i-tri as e">
<label class="as" for="c-as">A#</label>
<hr class="int i-p4 ds gs"><hr class="int i-ma2 ds f"><hr class="int i-ma6 ds c"><hr class="int i-mi2 ds e"><hr class="int i-ma3 ds g"><hr class="int i-ma7 ds d">
<hr class="int i-tri ds a">
<label class="ds" for="c-ds">D#</label>
<hr class="int i-p4 gs cs"><hr class="int i-ma2 gs as"><hr class="int i-ma6 gs f"><hr class="int i-mi2 gs a"><hr class="int i-ma3 gs c"><hr class="int i-ma7 gs g">
<hr class="int i-tri gs d">
<label class="gs" for="c-gs">G#</label>
<hr class="int i-p4 cs fs"><hr class="int i-ma2 cs ds"><hr class="int i-ma6 cs as"><hr class="int i-mi2 cs d"><hr class="int i-ma3 cs f"><hr class="int i-ma7 cs c">
<hr class="int i-tri cs g">
<label class="cs" for="c-cs">C#</label>
<hr class="int i-p4 fs b"><hr class="int i-ma2 fs gs"><hr class="int i-ma6 fs ds"><hr class="int i-mi2 fs g"><hr class="int i-ma3 fs as"><hr class="int i-ma7 fs f">
<hr class="int i-tri fs c">
<label class="fs" for="c-fs">F#</label>
<hr class="int i-p4 b e"><hr class="int i-ma2 b cs"><hr class="int i-ma6 b gs"><hr class="int i-mi2 b c"><hr class="int i-ma3 b ds"><hr class="int i-ma7 b as">
<hr class="int i-tri b f">
<label class="b" for="c-b">B</label>
<hr class="int i-p4 e a"><hr class="int i-ma2 e fs"><hr class="int i-ma6 e cs"><hr class="int i-mi2 e f"><hr class="int i-ma3 e gs"><hr class="int i-ma7 e ds">
<hr class="int i-tri e as">
<label class="e" for="c-e">E</label>
<hr class="int i-p4 a d"><hr class="int i-ma2 a b"><hr class="int i-ma6 a fs"><hr class="int i-mi2 a as"><hr class="int i-ma3 a cs"><hr class="int i-ma7 a gs">
<hr class="int i-tri a ds">
<label class="a" for="c-a">A</label>
<hr class="int i-p4 d g"><hr class="int i-ma2 d e"><hr class="int i-ma6 d b"><hr class="int i-mi2 d ds"><hr class="int i-ma3 d fs"><hr class="int i-ma7 d cs">
<hr class="int i-tri d gs">
<label class="d" for="c-d">D</label>
<hr class="int i-p4 g c"><hr class="int i-ma2 g a"><hr class="int i-ma6 g e"><hr class="int i-mi2 g gs"><hr class="int i-ma3 g b"><hr class="int i-ma7 g fs">
<hr class="int i-tri g cs">
<label class="g" for="c-g">G</label>
<hr class="int i-p4 c f"><hr class="int i-ma2 c d"><hr class="int i-ma6 c a"><hr class="int i-mi2 c cs"><hr class="int i-ma3 c e"><hr class="int i-ma7 c b">
<hr class="int i-tri c fs">
<label class="c" for="c-c">C</label>
<hr class="int i-p4 f as"><hr class="int i-ma2 f g"><hr class="int i-ma6 f d"><hr class="int i-mi2 f fs"><hr class="int i-ma3 f a"><hr class="int i-ma7 f e">
<hr class="int i-tri f b">
<label class="f" for="c-f">F</label>
<hr class="int i-p4 as ds"><hr class="int i-ma2 as c"><hr class="int i-ma6 as g"><hr class="int i-mi2 as b"><hr class="int i-ma3 as d"><hr class="int i-ma7 as a">
<hr class="int i-tri as e">
<label class="as" for="c-as">A#</label>
<hr class="int i-p4 ds gs"><hr class="int i-ma2 ds f"><hr class="int i-ma6 ds c"><hr class="int i-mi2 ds e"><hr class="int i-ma3 ds g"><hr class="int i-ma7 ds d">
<hr class="int i-tri ds a">
<label class="ds" for="c-ds">D#</label>
<hr class="int i-p4 gs cs"><hr class="int i-ma2 gs as"><hr class="int i-ma6 gs f"><hr class="int i-mi2 gs a"><hr class="int i-ma3 gs c"><hr class="int i-ma7 gs g">
<hr class="int i-tri gs d">
<label class="gs" for="c-gs">G#</label>
<hr class="int i-p4 cs fs"><hr class="int i-ma2 cs ds"><hr class="int i-ma6 cs as"><hr class="int i-mi2 cs d"><hr class="int i-ma3 cs f"><hr class="int i-ma7 cs c">
<hr class="int i-tri cs g">
<label class="cs" for="c-cs">C#</label>
<hr class="int i-p4 fs b"><hr class="int i-ma2 fs gs"><hr class="int i-ma6 fs ds"><hr class="int i-mi2 fs g"><hr class="int i-ma3 fs as"><hr class="int i-ma7 fs f">
<hr class="int i-tri fs c">
<label class="fs" for="c-fs">F#</label>
<hr class="int i-p4 b e"><hr class="int i-ma2 b cs"><hr class="int i-ma6 b gs"><hr class="int i-mi2 b c"><hr class="int i-ma3 b ds"><hr class="int i-ma7 b as">
<hr class="int i-tri b f">
<label class="b" for="c-b">B</label>
<hr class="int i-p4 e a"><hr class="int i-ma2 e fs"><hr class="int i-ma6 e cs"><hr class="int i-mi2 e f"><hr class="int i-ma3 e gs"><hr class="int i-ma7 e ds">
<hr class="int i-tri e as">
<label class="e" for="c-e">E</label>
<hr class="int i-p4 a d"><hr class="int i-ma2 a b"><hr class="int i-ma6 a fs"><hr class="int i-mi2 a as"><hr class="int i-ma3 a cs"><hr class="int i-ma7 a gs">
<hr class="int i-tri a ds">
<label class="a" for="c-a">A</label>
<hr class="int i-p4 d g"><hr class="int i-ma2 d e"><hr class="int i-ma6 d b"><hr class="int i-mi2 d ds"><hr class="int i-ma3 d fs"><hr class="int i-ma7 d cs">
<hr class="int i-tri d gs">
<label class="d" for="c-d">D</label>
<hr class="int i-p4 g c"><hr class="int i-ma2 g a"><hr class="int i-ma6 g e"><hr class="int i-mi2 g gs"><hr class="int i-ma3 g b"><hr class="int i-ma7 g fs">
<hr class="int i-tri g cs">
<label class="g" for="c-g">G</label>
<hr class="int i-p4 c f"><hr class="int i-ma2 c d"><hr class="int i-ma6 c a"><hr class="int i-mi2 c cs"><hr class="int i-ma3 c e"><hr class="int i-ma7 c b">
<hr class="int i-tri c fs">
<label class="c" for="c-c">C</label>
<hr class="int i-p4 f as"><hr class="int i-ma2 f g"><hr class="int i-ma6 f d"><hr class="int i-mi2 f fs"><hr class="int i-ma3 f a"><hr class="int i-ma7 f e">
<hr class="int i-tri f b">
<label class="f" for="c-f">F</label>
</div>
<div class="column">
<hr class="int i-p4 g c"><hr class="int i-ma2 g a"><hr class="int i-ma6 g e"><hr class="int i-mi2 g gs"><hr class="int i-ma3 g b"><hr class="int i-ma7 g fs">
<hr class="int i-tri g cs">
<label class="g" for="c-g">G</label>
<hr class="int i-p4 c f"><hr class="int i-ma2 c d"><hr class="int i-ma6 c a"><hr class="int i-mi2 c cs"><hr class="int i-ma3 c e"><hr class="int i-ma7 c b">
<hr class="int i-tri c fs">
<label class="c" for="c-c">C</label>
<hr class="int i-p4 f as"><hr class="int i-ma2 f g"><hr class="int i-ma6 f d"><hr class="int i-mi2 f fs"><hr class="int i-ma3 f a"><hr class="int i-ma7 f e">
<hr class="int i-tri f b">
<label class="f" for="c-f">F</label>
<hr class="int i-p4 as ds"><hr class="int i-ma2 as c"><hr class="int i-ma6 as g"><hr class="int i-mi2 as b"><hr class="int i-ma3 as d"><hr class="int i-ma7 as a">
<hr class="int i-tri as e">
<label class="as" for="c-as">A#</label>
<hr class="int i-p4 ds gs"><hr class="int i-ma2 ds f"><hr class="int i-ma6 ds c"><hr class="int i-mi2 ds e"><hr class="int i-ma3 ds g"><hr class="int i-ma7 ds d">
<hr class="int i-tri ds a">
<label class="ds" for="c-ds">D#</label>
<hr class="int i-p4 gs cs"><hr class="int i-ma2 gs as"><hr class="int i-ma6 gs f"><hr class="int i-mi2 gs a"><hr class="int i-ma3 gs c"><hr class="int i-ma7 gs g">
<hr class="int i-tri gs d">
<label class="gs" for="c-gs">G#</label>
<hr class="int i-p4 cs fs"><hr class="int i-ma2 cs ds"><hr class="int i-ma6 cs as"><hr class="int i-mi2 cs d"><hr class="int i-ma3 cs f"><hr class="int i-ma7 cs c">
<hr class="int i-tri cs g">
<label class="cs" for="c-cs">C#</label>
<hr class="int i-p4 fs b"><hr class="int i-ma2 fs gs"><hr class="int i-ma6 fs ds"><hr class="int i-mi2 fs g"><hr class="int i-ma3 fs as"><hr class="int i-ma7 fs f">
<hr class="int i-tri fs c">
<label class="fs" for="c-fs">F#</label>
<hr class="int i-p4 b e"><hr class="int i-ma2 b cs"><hr class="int i-ma6 b gs"><hr class="int i-mi2 b c"><hr class="int i-ma3 b ds"><hr class="int i-ma7 b as">
<hr class="int i-tri b f">
<label class="b" for="c-b">B</label>
<hr class="int i-p4 e a"><hr class="int i-ma2 e fs"><hr class="int i-ma6 e cs"><hr class="int i-mi2 e f"><hr class="int i-ma3 e gs"><hr class="int i-ma7 e ds">
<hr class="int i-tri e as">
<label class="e" for="c-e">E</label>
<hr class="int i-p4 a d"><hr class="int i-ma2 a b"><hr class="int i-ma6 a fs"><hr class="int i-mi2 a as"><hr class="int i-ma3 a cs"><hr class="int i-ma7 a gs">
<hr class="int i-tri a ds">
<label class="a" for="c-a">A</label>
<hr class="int i-p4 d g"><hr class="int i-ma2 d e"><hr class="int i-ma6 d b"><hr class="int i-mi2 d ds"><hr class="int i-ma3 d fs"><hr class="int i-ma7 d cs">
<hr class="int i-tri d gs">
<label class="d" for="c-d">D</label>
<hr class="int i-p4 g c"><hr class="int i-ma2 g a"><hr class="int i-ma6 g e"><hr class="int i-mi2 g gs"><hr class="int i-ma3 g b"><hr class="int i-ma7 g fs">
<hr class="int i-tri g cs">
<label class="g" for="c-g">G</label>
<hr class="int i-p4 c f"><hr class="int i-ma2 c d"><hr class="int i-ma6 c a"><hr class="int i-mi2 c cs"><hr class="int i-ma3 c e"><hr class="int i-ma7 c b">
<hr class="int i-tri c fs">
<label class="c" for="c-c">C</label>
<hr class="int i-p4 f as"><hr class="int i-ma2 f g"><hr class="int i-ma6 f d"><hr class="int i-mi2 f fs"><hr class="int i-ma3 f a"><hr class="int i-ma7 f e">
<hr class="int i-tri f b">
<label class="f" for="c-f">F</label>
<hr class="int i-p4 as ds"><hr class="int i-ma2 as c"><hr class="int i-ma6 as g"><hr class="int i-mi2 as b"><hr class="int i-ma3 as d"><hr class="int i-ma7 as a">
<hr class="int i-tri as e">
<label class="as" for="c-as">A#</label>
<hr class="int i-p4 ds gs"><hr class="int i-ma2 ds f"><hr class="int i-ma6 ds c"><hr class="int i-mi2 ds e"><hr class="int i-ma3 ds g"><hr class="int i-ma7 ds d">
<hr class="int i-tri ds a">
<label class="ds" for="c-ds">D#</label>
<hr class="int i-p4 gs cs"><hr class="int i-ma2 gs as"><hr class="int i-ma6 gs f"><hr class="int i-mi2 gs a"><hr class="int i-ma3 gs c"><hr class="int i-ma7 gs g">
<hr class="int i-tri gs d">
<label class="gs" for="c-gs">G#</label>
<hr class="int i-p4 cs fs"><hr class="int i-ma2 cs ds"><hr class="int i-ma6 cs as"><hr class="int i-mi2 cs d"><hr class="int i-ma3 cs f"><hr class="int i-ma7 cs c">
<hr class="int i-tri cs g">
<label class="cs" for="c-cs">C#</label>
<hr class="int i-p4 fs b"><hr class="int i-ma2 fs gs"><hr class="int i-ma6 fs ds"><hr class="int i-mi2 fs g"><hr class="int i-ma3 fs as"><hr class="int i-ma7 fs f">
<hr class="int i-tri fs c">
<label class="fs" for="c-fs">F#</label>
<hr class="int i-p4 b e"><hr class="int i-ma2 b cs"><hr class="int i-ma6 b gs"><hr class="int i-mi2 b c"><hr class="int i-ma3 b ds"><hr class="int i-ma7 b as">
<hr class="int i-tri b f">
<label class="b" for="c-b">B</label>
<hr class="int i-p4 e a"><hr class="int i-ma2 e fs"><hr class="int i-ma6 e cs"><hr class="int i-mi2 e f"><hr class="int i-ma3 e gs"><hr class="int i-ma7 e ds">
<hr class="int i-tri e as">
<label class="e" for="c-e">E</label>
<hr class="int i-p4 a d"><hr class="int i-ma2 a b"><hr class="int i-ma6 a fs"><hr class="int i-mi2 a as"><hr class="int i-ma3 a cs"><hr class="int i-ma7 a gs">
<hr class="int i-tri a ds">
<label class="a" for="c-a">A</label>
<hr class="int i-p4 d g"><hr class="int i-ma2 d e"><hr class="int i-ma6 d b"><hr class="int i-mi2 d ds"><hr class="int i-ma3 d fs"><hr class="int i-ma7 d cs">
<hr class="int i-tri d gs">
<label class="d" for="c-d">D</label>
</div>
<div class="column">
<hr class="int i-p4 e a"><hr class="int i-ma2 e fs"><hr class="int i-ma6 e cs"><hr class="int i-mi2 e f"><hr class="int i-ma3 e gs"><hr class="int i-ma7 e ds">
<hr class="int i-tri e as">
<label class="e" for="c-e">E</label>
<hr class="int i-p4 a d"><hr class="int i-ma2 a b"><hr class="int i-ma6 a fs"><hr class="int i-mi2 a as"><hr class="int i-ma3 a cs"><hr class="int i-ma7 a gs">
<hr class="int i-tri a ds">
<label class="a" for="c-a">A</label>
<hr class="int i-p4 d g"><hr class="int i-ma2 d e"><hr class="int i-ma6 d b"><hr class="int i-mi2 d ds"><hr class="int i-ma3 d fs"><hr class="int i-ma7 d cs">
<hr class="int i-tri d gs">
<label class="d" for="c-d">D</label>
<hr class="int i-p4 g c"><hr class="int i-ma2 g a"><hr class="int i-ma6 g e"><hr class="int i-mi2 g gs"><hr class="int i-ma3 g b"><hr class="int i-ma7 g fs">
<hr class="int i-tri g cs">
<label class="g" for="c-g">G</label>
<hr class="int i-p4 c f"><hr class="int i-ma2 c d"><hr class="int i-ma6 c a"><hr class="int i-mi2 c cs"><hr class="int i-ma3 c e"><hr class="int i-ma7 c b">
<hr class="int i-tri c fs">
<label class="c" for="c-c">C</label>
<hr class="int i-p4 f as"><hr class="int i-ma2 f g"><hr class="int i-ma6 f d"><hr class="int i-mi2 f fs"><hr class="int i-ma3 f a"><hr class="int i-ma7 f e">
<hr class="int i-tri f b">
<label class="f" for="c-f">F</label>
<hr class="int i-p4 as ds"><hr class="int i-ma2 as c"><hr class="int i-ma6 as g"><hr class="int i-mi2 as b"><hr class="int i-ma3 as d"><hr class="int i-ma7 as a">
<hr class="int i-tri as e">
<label class="as" for="c-as">A#</label>
<hr class="int i-p4 ds gs"><hr class="int i-ma2 ds f"><hr class="int i-ma6 ds c"><hr class="int i-mi2 ds e"><hr class="int i-ma3 ds g"><hr class="int i-ma7 ds d">
<hr class="int i-tri ds a">
<label class="ds" for="c-ds">D#</label>
<hr class="int i-p4 gs cs"><hr class="int i-ma2 gs as"><hr class="int i-ma6 gs f"><hr class="int i-mi2 gs a"><hr class="int i-ma3 gs c"><hr class="int i-ma7 gs g">
<hr class="int i-tri gs d">
<label class="gs" for="c-gs">G#</label>
<hr class="int i-p4 cs fs"><hr class="int i-ma2 cs ds"><hr class="int i-ma6 cs as"><hr class="int i-mi2 cs d"><hr class="int i-ma3 cs f"><hr class="int i-ma7 cs c">
<hr class="int i-tri cs g">
<label class="cs" for="c-cs">C#</label>
<hr class="int i-p4 fs b"><hr class="int i-ma2 fs gs"><hr class="int i-ma6 fs ds"><hr class="int i-mi2 fs g"><hr class="int i-ma3 fs as"><hr class="int i-ma7 fs f">
<hr class="int i-tri fs c">
<label class="fs" for="c-fs">F#</label>
<hr class="int i-p4 b e"><hr class="int i-ma2 b cs"><hr class="int i-ma6 b gs"><hr class="int i-mi2 b c"><hr class="int i-ma3 b ds"><hr class="int i-ma7 b as">
<hr class="int i-tri b f">
<label class="b" for="c-b">B</label>
<hr class="int i-p4 e a"><hr class="int i-ma2 e fs"><hr class="int i-ma6 e cs"><hr class="int i-mi2 e f"><hr class="int i-ma3 e gs"><hr class="int i-ma7 e ds">
<hr class="int i-tri e as">
<label class="e" for="c-e">E</label>
<hr class="int i-p4 a d"><hr class="int i-ma2 a b"><hr class="int i-ma6 a fs"><hr class="int i-mi2 a as"><hr class="int i-ma3 a cs"><hr class="int i-ma7 a gs">
<hr class="int i-tri a ds">
<label class="a" for="c-a">A</label>
<hr class="int i-p4 d g"><hr class="int i-ma2 d e"><hr class="int i-ma6 d b"><hr class="int i-mi2 d ds"><hr class="int i-ma3 d fs"><hr class="int i-ma7 d cs">
<hr class="int i-tri d gs">
<label class="d" for="c-d">D</label>
<hr class="int i-p4 g c"><hr class="int i-ma2 g a"><hr class="int i-ma6 g e"><hr class="int i-mi2 g gs"><hr class="int i-ma3 g b"><hr class="int i-ma7 g fs">
<hr class="int i-tri g cs">
<label class="g" for="c-g">G</label>
<hr class="int i-p4 c f"><hr class="int i-ma2 c d"><hr class="int i-ma6 c a"><hr class="int i-mi2 c cs"><hr class="int i-ma3 c e"><hr class="int i-ma7 c b">
<hr class="int i-tri c fs">
<label class="c" for="c-c">C</label>
<hr class="int i-p4 f as"><hr class="int i-ma2 f g"><hr class="int i-ma6 f d"><hr class="int i-mi2 f fs"><hr class="int i-ma3 f a"><hr class="int i-ma7 f e">
<hr class="int i-tri f b">
<label class="f" for="c-f">F</label>
<hr class="int i-p4 as ds"><hr class="int i-ma2 as c"><hr class="int i-ma6 as g"><hr class="int i-mi2 as b"><hr class="int i-ma3 as d"><hr class="int i-ma7 as a">
<hr class="int i-tri as e">
<label class="as" for="c-as">A#</label>
<hr class="int i-p4 ds gs"><hr class="int i-ma2 ds f"><hr class="int i-ma6 ds c"><hr class="int i-mi2 ds e"><hr class="int i-ma3 ds g"><hr class="int i-ma7 ds d">
<hr class="int i-tri ds a">
<label class="ds" for="c-ds">D#</label>
<hr class="int i-p4 gs cs"><hr class="int i-ma2 gs as"><hr class="int i-ma6 gs f"><hr class="int i-mi2 gs a"><hr class="int i-ma3 gs c"><hr class="int i-ma7 gs g">
<hr class="int i-tri gs d">
<label class="gs" for="c-gs">G#</label>
<hr class="int i-p4 cs fs"><hr class="int i-ma2 cs ds"><hr class="int i-ma6 cs as"><hr class="int i-mi2 cs d"><hr class="int i-ma3 cs f"><hr class="int i-ma7 cs c">
<hr class="int i-tri cs g">
<label class="cs" for="c-cs">C#</label>
<hr class="int i-p4 fs b"><hr class="int i-ma2 fs gs"><hr class="int i-ma6 fs ds"><hr class="int i-mi2 fs g"><hr class="int i-ma3 fs as"><hr class="int i-ma7 fs f">
<hr class="int i-tri fs c">
<label class="fs" for="c-fs">F#</label>
<hr class="int i-p4 b e"><hr class="int i-ma2 b cs"><hr class="int i-ma6 b gs"><hr class="int i-mi2 b c"><hr class="int i-ma3 b ds"><hr class="int i-ma7 b as">
<hr class="int i-tri b f">
<label class="b" for="c-b">B</label>
</div>
<div class="column">
<hr class="int i-p4 gs cs"><hr class="int i-ma2 gs as"><hr class="int i-ma6 gs f"><hr class="int i-mi2 gs a"><hr class="int i-ma3 gs c"><hr class="int i-ma7 gs g">
<hr class="int i-tri gs d">
<label class="gs" for="c-gs">G#</label>
<hr class="int i-p4 cs fs"><hr class="int i-ma2 cs ds"><hr class="int i-ma6 cs as"><hr class="int i-mi2 cs d"><hr class="int i-ma3 cs f"><hr class="int i-ma7 cs c">
<hr class="int i-tri cs g">
<label class="cs" for="c-cs">C#</label>
<hr class="int i-p4 fs b"><hr class="int i-ma2 fs gs"><hr class="int i-ma6 fs ds"><hr class="int i-mi2 fs g"><hr class="int i-ma3 fs as"><hr class="int i-ma7 fs f">
<hr class="int i-tri fs c">
<label class="fs" for="c-fs">F#</label>
<hr class="int i-p4 b e"><hr class="int i-ma2 b cs"><hr class="int i-ma6 b gs"><hr class="int i-mi2 b c"><hr class="int i-ma3 b ds"><hr class="int i-ma7 b as">
<hr class="int i-tri b f">
<label class="b" for="c-b">B</label>
<hr class="int i-p4 e a"><hr class="int i-ma2 e fs"><hr class="int i-ma6 e cs"><hr class="int i-mi2 e f"><hr class="int i-ma3 e gs"><hr class="int i-ma7 e ds">
<hr class="int i-tri e as">
<label class="e" for="c-e">E</label>
<hr class="int i-p4 a d"><hr class="int i-ma2 a b"><hr class="int i-ma6 a fs"><hr class="int i-mi2 a as"><hr class="int i-ma3 a cs"><hr class="int i-ma7 a gs">
<hr class="int i-tri a ds">
<label class="a" for="c-a">A</label>
<hr class="int i-p4 d g"><hr class="int i-ma2 d e"><hr class="int i-ma6 d b"><hr class="int i-mi2 d ds"><hr class="int i-ma3 d fs"><hr class="int i-ma7 d cs">
<hr class="int i-tri d gs">
<label class="d" for="c-d">D</label>
<hr class="int i-p4 g c"><hr class="int i-ma2 g a"><hr class="int i-ma6 g e"><hr class="int i-mi2 g gs"><hr class="int i-ma3 g b"><hr class="int i-ma7 g fs">
<hr class="int i-tri g cs">
<label class="g" for="c-g">G</label>
<hr class="int i-p4 c f"><hr class="int i-ma2 c d"><hr class="int i-ma6 c a"><hr class="int i-mi2 c cs"><hr class="int i-ma3 c e"><hr class="int i-ma7 c b">
<hr class="int i-tri c fs">
<label class="c" for="c-c">C</label>
<hr class="int i-p4 f as"><hr class="int i-ma2 f g"><hr class="int i-ma6 f d"><hr class="int i-mi2 f fs"><hr class="int i-ma3 f a"><hr class="int i-ma7 f e">
<hr class="int i-tri f b">
<label class="f" for="c-f">F</label>
<hr class="int i-p4 as ds"><hr class="int i-ma2 as c"><hr class="int i-ma6 as g"><hr class="int i-mi2 as b"><hr class="int i-ma3 as d"><hr class="int i-ma7 as a">
<hr class="int i-tri as e">
<label class="as" for="c-as">A#</label>
<hr class="int i-p4 ds gs"><hr class="int i-ma2 ds f"><hr class="int i-ma6 ds c"><hr class="int i-mi2 ds e"><hr class="int i-ma3 ds g"><hr class="int i-ma7 ds d">
<hr class="int i-tri ds a">
<label class="ds" for="c-ds">D#</label>
<hr class="int i-p4 gs cs"><hr class="int i-ma2 gs as"><hr class="int i-ma6 gs f"><hr class="int i-mi2 gs a"><hr class="int i-ma3 gs c"><hr class="int i-ma7 gs g">
<hr class="int i-tri gs d">
<label class="gs" for="c-gs">G#</label>
<hr class="int i-p4 cs fs"><hr class="int i-ma2 cs ds"><hr class="int i-ma6 cs as"><hr class="int i-mi2 cs d"><hr class="int i-ma3 cs f"><hr class="int i-ma7 cs c">
<hr class="int i-tri cs g">
<label class="cs" for="c-cs">C#</label>
<hr class="int i-p4 fs b"><hr class="int i-ma2 fs gs"><hr class="int i-ma6 fs ds"><hr class="int i-mi2 fs g"><hr class="int i-ma3 fs as"><hr class="int i-ma7 fs f">
<hr class="int i-tri fs c">
<label class="fs" for="c-fs">F#</label>
<hr class="int i-p4 b e"><hr class="int i-ma2 b cs"><hr class="int i-ma6 b gs"><hr class="int i-mi2 b c"><hr class="int i-ma3 b ds"><hr class="int i-ma7 b as">
<hr class="int i-tri b f">
<label class="b" for="c-b">B</label>
<hr class="int i-p4 e a"><hr class="int i-ma2 e fs"><hr class="int i-ma6 e cs"><hr class="int i-mi2 e f"><hr class="int i-ma3 e gs"><hr class="int i-ma7 e ds">
<hr class="int i-tri e as">
<label class="e" for="c-e">E</label>
<hr class="int i-p4 a d"><hr class="int i-ma2 a b"><hr class="int i-ma6 a fs"><hr class="int i-mi2 a as"><hr class="int i-ma3 a cs"><hr class="int i-ma7 a gs">
<hr class="int i-tri a ds">
<label class="a" for="c-a">A</label>
<hr class="int i-p4 d g"><hr class="int i-ma2 d e"><hr class="int i-ma6 d b"><hr class="int i-mi2 d ds"><hr class="int i-ma3 d fs"><hr class="int i-ma7 d cs">
<hr class="int i-tri d gs">
<label class="d" for="c-d">D</label>
<hr class="int i-p4 g c"><hr class="int i-ma2 g a"><hr class="int i-ma6 g e"><hr class="int i-mi2 g gs"><hr class="int i-ma3 g b"><hr class="int i-ma7 g fs">
<hr class="int i-tri g cs">
<label class="g" for="c-g">G</label>
<hr class="int i-p4 c f"><hr class="int i-ma2 c d"><hr class="int i-ma6 c a"><hr class="int i-mi2 c cs"><hr class="int i-ma3 c e"><hr class="int i-ma7 c b">
<hr class="int i-tri c fs">
<label class="c" for="c-c">C</label>
<hr class="int i-p4 f as"><hr class="int i-ma2 f g"><hr class="int i-ma6 f d"><hr class="int i-mi2 f fs"><hr class="int i-ma3 f a"><hr class="int i-ma7 f e">
<hr class="int i-tri f b">
<label class="f" for="c-f">F</label>
<hr class="int i-p4 as ds"><hr class="int i-ma2 as c"><hr class="int i-ma6 as g"><hr class="int i-mi2 as b"><hr class="int i-ma3 as d"><hr class="int i-ma7 as a">
<hr class="int i-tri as e">
<label class="as" for="c-as">A#</label>
<hr class="int i-p4 ds gs"><hr class="int i-ma2 ds f"><hr class="int i-ma6 ds c"><hr class="int i-mi2 ds e"><hr class="int i-ma3 ds g"><hr class="int i-ma7 ds d">
<hr class="int i-tri ds a">
<label class="ds" for="c-ds">D#</label>
</div>
<div class="column">
<hr class="int i-p4 f as"><hr class="int i-ma2 f g"><hr class="int i-ma6 f d"><hr class="int i-mi2 f fs"><hr class="int i-ma3 f a"><hr class="int i-ma7 f e">
<hr class="int i-tri f b">
<label class="f" for="c-f">F</label>
<hr class="int i-p4 as ds"><hr class="int i-ma2 as c"><hr class="int i-ma6 as g"><hr class="int i-mi2 as b"><hr class="int i-ma3 as d"><hr class="int i-ma7 as a">
<hr class="int i-tri as e">
<label class="as" for="c-as">A#</label>
<hr class="int i-p4 ds gs"><hr class="int i-ma2 ds f"><hr class="int i-ma6 ds c"><hr class="int i-mi2 ds e"><hr class="int i-ma3 ds g"><hr class="int i-ma7 ds d">
<hr class="int i-tri ds a">
<label class="ds" for="c-ds">D#</label>
<hr class="int i-p4 gs cs"><hr class="int i-ma2 gs as"><hr class="int i-ma6 gs f"><hr class="int i-mi2 gs a"><hr class="int i-ma3 gs c"><hr class="int i-ma7 gs g">
<hr class="int i-tri gs d">
<label class="gs" for="c-gs">G#</label>
<hr class="int i-p4 cs fs"><hr class="int i-ma2 cs ds"><hr class="int i-ma6 cs as"><hr class="int i-mi2 cs d"><hr class="int i-ma3 cs f"><hr class="int i-ma7 cs c">
<hr class="int i-tri cs g">
<label class="cs" for="c-cs">C#</label>
<hr class="int i-p4 fs b"><hr class="int i-ma2 fs gs"><hr class="int i-ma6 fs ds"><hr class="int i-mi2 fs g"><hr class="int i-ma3 fs as"><hr class="int i-ma7 fs f">
<hr class="int i-tri fs c">
<label class="fs" for="c-fs">F#</label>
<hr class="int i-p4 b e"><hr class="int i-ma2 b cs"><hr class="int i-ma6 b gs"><hr class="int i-mi2 b c"><hr class="int i-ma3 b ds"><hr class="int i-ma7 b as">
<hr class="int i-tri b f">
<label class="b" for="c-b">B</label>
<hr class="int i-p4 e a"><hr class="int i-ma2 e fs"><hr class="int i-ma6 e cs"><hr class="int i-mi2 e f"><hr class="int i-ma3 e gs"><hr class="int i-ma7 e ds">
<hr class="int i-tri e as">
<label class="e" for="c-e">E</label>
<hr class="int i-p4 a d"><hr class="int i-ma2 a b"><hr class="int i-ma6 a fs"><hr class="int i-mi2 a as"><hr class="int i-ma3 a cs"><hr class="int i-ma7 a gs">
<hr class="int i-tri a ds">
<label class="a" for="c-a">A</label>
<hr class="int i-p4 d g"><hr class="int i-ma2 d e"><hr class="int i-ma6 d b"><hr class="int i-mi2 d ds"><hr class="int i-ma3 d fs"><hr class="int i-ma7 d cs">
<hr class="int i-tri d gs">
<label class="d" for="c-d">D</label>
<hr class="int i-p4 g c"><hr class="int i-ma2 g a"><hr class="int i-ma6 g e"><hr class="int i-mi2 g gs"><hr class="int i-ma3 g b"><hr class="int i-ma7 g fs">
<hr class="int i-tri g cs">
<label class="g" for="c-g">G</label>
<hr class="int i-p4 c f"><hr class="int i-ma2 c d"><hr class="int i-ma6 c a"><hr class="int i-mi2 c cs"><hr class="int i-ma3 c e"><hr class="int i-ma7 c b">
<hr class="int i-tri c fs">
<label class="c" for="c-c">C</label>
<hr class="int i-p4 f as"><hr class="int i-ma2 f g"><hr class="int i-ma6 f d"><hr class="int i-mi2 f fs"><hr class="int i-ma3 f a"><hr class="int i-ma7 f e">
<hr class="int i-tri f b">
<label class="f" for="c-f">F</label>
<hr class="int i-p4 as ds"><hr class="int i-ma2 as c"><hr class="int i-ma6 as g"><hr class="int i-mi2 as b"><hr class="int i-ma3 as d"><hr class="int i-ma7 as a">
<hr class="int i-tri as e">
<label class="as" for="c-as">A#</label>
<hr class="int i-p4 ds gs"><hr class="int i-ma2 ds f"><hr class="int i-ma6 ds c"><hr class="int i-mi2 ds e"><hr class="int i-ma3 ds g"><hr class="int i-ma7 ds d">
<hr class="int i-tri ds a">
<label class="ds" for="c-ds">D#</label>
<hr class="int i-p4 gs cs"><hr class="int i-ma2 gs as"><hr class="int i-ma6 gs f"><hr class="int i-mi2 gs a"><hr class="int i-ma3 gs c"><hr class="int i-ma7 gs g">
<hr class="int i-tri gs d">
<label class="gs" for="c-gs">G#</label>
<hr class="int i-p4 cs fs"><hr class="int i-ma2 cs ds"><hr class="int i-ma6 cs as"><hr class="int i-mi2 cs d"><hr class="int i-ma3 cs f"><hr class="int i-ma7 cs c">
<hr class="int i-tri cs g">
<label class="cs" for="c-cs">C#</label>
<hr class="int i-p4 fs b"><hr class="int i-ma2 fs gs"><hr class="int i-ma6 fs ds"><hr class="int i-mi2 fs g"><hr class="int i-ma3 fs as"><hr class="int i-ma7 fs f">
<hr class="int i-tri fs c">
<label class="fs" for="c-fs">F#</label>
<hr class="int i-p4 b e"><hr class="int i-ma2 b cs"><hr class="int i-ma6 b gs"><hr class="int i-mi2 b c"><hr class="int i-ma3 b ds"><hr class="int i-ma7 b as">
<hr class="int i-tri b f">
<label class="b" for="c-b">B</label>
<hr class="int i-p4 e a"><hr class="int i-ma2 e fs"><hr class="int i-ma6 e cs"><hr class="int i-mi2 e f"><hr class="int i-ma3 e gs"><hr class="int i-ma7 e ds">
<hr class="int i-tri e as">
<label class="e" for="c-e">E</label>
<hr class="int i-p4 a d"><hr class="int i-ma2 a b"><hr class="int i-ma6 a fs"><hr class="int i-mi2 a as"><hr class="int i-ma3 a cs"><hr class="int i-ma7 a gs">
<hr class="int i-tri a ds">
<label class="a" for="c-a">A</label>
<hr class="int i-p4 d g"><hr class="int i-ma2 d e"><hr class="int i-ma6 d b"><hr class="int i-mi2 d ds"><hr class="int i-ma3 d fs"><hr class="int i-ma7 d cs">
<hr class="int i-tri d gs">
<label class="d" for="c-d">D</label>
<hr class="int i-p4 g c"><hr class="int i-ma2 g a"><hr class="int i-ma6 g e"><hr class="int i-mi2 g gs"><hr class="int i-ma3 g b"><hr class="int i-ma7 g fs">
<hr class="int i-tri g cs">
<label class="g" for="c-g">G</label>
<hr class="int i-p4 c f"><hr class="int i-ma2 c d"><hr class="int i-ma6 c a"><hr class="int i-mi2 c cs"><hr class="int i-ma3 c e"><hr class="int i-ma7 c b">
<hr class="int i-tri c fs">
<label class="c" for="c-c">C</label>
</div>
<div class="column">
<hr class="int i-p4 a d"><hr class="int i-ma2 a b"><hr class="int i-ma6 a fs"><hr class="int i-mi2 a as"><hr class="int i-ma3 a cs"><hr class="int i-ma7 a gs">
<hr class="int i-tri a ds">
<label class="a" for="c-a">A</label>
<hr class="int i-p4 d g"><hr class="int i-ma2 d e"><hr class="int i-ma6 d b"><hr class="int i-mi2 d ds"><hr class="int i-ma3 d fs"><hr class="int i-ma7 d cs">
<hr class="int i-tri d gs">
<label class="d" for="c-d">D</label>
<hr class="int i-p4 g c"><hr class="int i-ma2 g a"><hr class="int i-ma6 g e"><hr class="int i-mi2 g gs"><hr class="int i-ma3 g b"><hr class="int i-ma7 g fs">
<hr class="int i-tri g cs">
<label class="g" for="c-g">G</label>
<hr class="int i-p4 c f"><hr class="int i-ma2 c d"><hr class="int i-ma6 c a"><hr class="int i-mi2 c cs"><hr class="int i-ma3 c e"><hr class="int i-ma7 c b">
<hr class="int i-tri c fs">
<label class="c" for="c-c">C</label>
<hr class="int i-p4 f as"><hr class="int i-ma2 f g"><hr class="int i-ma6 f d"><hr class="int i-mi2 f fs"><hr class="int i-ma3 f a"><hr class="int i-ma7 f e">
<hr class="int i-tri f b">
<label class="f" for="c-f">F</label>
<hr class="int i-p4 as ds"><hr class="int i-ma2 as c"><hr class="int i-ma6 as g"><hr class="int i-mi2 as b"><hr class="int i-ma3 as d"><hr class="int i-ma7 as a">
<hr class="int i-tri as e">
<label class="as" for="c-as">A#</label>
<hr class="int i-p4 ds gs"><hr class="int i-ma2 ds f"><hr class="int i-ma6 ds c"><hr class="int i-mi2 ds e"><hr class="int i-ma3 ds g"><hr class="int i-ma7 ds d">
<hr class="int i-tri ds a">
<label class="ds" for="c-ds">D#</label>
<hr class="int i-p4 gs cs"><hr class="int i-ma2 gs as"><hr class="int i-ma6 gs f"><hr class="int i-mi2 gs a"><hr class="int i-ma3 gs c"><hr class="int i-ma7 gs g">
<hr class="int i-tri gs d">
<label class="gs" for="c-gs">G#</label>
<hr class="int i-p4 cs fs"><hr class="int i-ma2 cs ds"><hr class="int i-ma6 cs as"><hr class="int i-mi2 cs d"><hr class="int i-ma3 cs f"><hr class="int i-ma7 cs c">
<hr class="int i-tri cs g">
<label class="cs" for="c-cs">C#</label>
<hr class="int i-p4 fs b"><hr class="int i-ma2 fs gs"><hr class="int i-ma6 fs ds"><hr class="int i-mi2 fs g"><hr class="int i-ma3 fs as"><hr class="int i-ma7 fs f">
<hr class="int i-tri fs c">
<label class="fs" for="c-fs">F#</label>
<hr class="int i-p4 b e"><hr class="int i-ma2 b cs"><hr class="int i-ma6 b gs"><hr class="int i-mi2 b c"><hr class="int i-ma3 b ds"><hr class="int i-ma7 b as">
<hr class="int i-tri b f">
<label class="b" for="c-b">B</label>
<hr class="int i-p4 e a"><hr class="int i-ma2 e fs"><hr class="int i-ma6 e cs"><hr class="int i-mi2 e f"><hr class="int i-ma3 e gs"><hr class="int i-ma7 e ds">
<hr class="int i-tri e as">
<label class="e" for="c-e">E</label>
<hr class="int i-p4 a d"><hr class="int i-ma2 a b"><hr class="int i-ma6 a fs"><hr class="int i-mi2 a as"><hr class="int i-ma3 a cs"><hr class="int i-ma7 a gs">
<hr class="int i-tri a ds">
<label class="a" for="c-a">A</label>
<hr class="int i-p4 d g"><hr class="int i-ma2 d e"><hr class="int i-ma6 d b"><hr class="int i-mi2 d ds"><hr class="int i-ma3 d fs"><hr class="int i-ma7 d cs">
<hr class="int i-tri d gs">
<label class="d" for="c-d">D</label>
<hr class="int i-p4 g c"><hr class="int i-ma2 g a"><hr class="int i-ma6 g e"><hr class="int i-mi2 g gs"><hr class="int i-ma3 g b"><hr class="int i-ma7 g fs">
<hr class="int i-tri g cs">
<label class="g" for="c-g">G</label>
<hr class="int i-p4 c f"><hr class="int i-ma2 c d"><hr class="int i-ma6 c a"><hr class="int i-mi2 c cs"><hr class="int i-ma3 c e"><hr class="int i-ma7 c b">
<hr class="int i-tri c fs">
<label class="c" for="c-c">C</label>
<hr class="int i-p4 f as"><hr class="int i-ma2 f g"><hr class="int i-ma6 f d"><hr class="int i-mi2 f fs"><hr class="int i-ma3 f a"><hr class="int i-ma7 f e">
<hr class="int i-tri f b">
<label class="f" for="c-f">F</label>
<hr class="int i-p4 as ds"><hr class="int i-ma2 as c"><hr class="int i-ma6 as g"><hr class="int i-mi2 as b"><hr class="int i-ma3 as d"><hr class="int i-ma7 as a">
<hr class="int i-tri as e">
<label class="as" for="c-as">A#</label>
<hr class="int i-p4 ds gs"><hr class="int i-ma2 ds f"><hr class="int i-ma6 ds c"><hr class="int i-mi2 ds e"><hr class="int i-ma3 ds g"><hr class="int i-ma7 ds d">
<hr class="int i-tri ds a">
<label class="ds" for="c-ds">D#</label>
<hr class="int i-p4 gs cs"><hr class="int i-ma2 gs as"><hr class="int i-ma6 gs f"><hr class="int i-mi2 gs a"><hr class="int i-ma3 gs c"><hr class="int i-ma7 gs g">
<hr class="int i-tri gs d">
<label class="gs" for="c-gs">G#</label>
<hr class="int i-p4 cs fs"><hr class="int i-ma2 cs ds"><hr class="int i-ma6 cs as"><hr class="int i-mi2 cs d"><hr class="int i-ma3 cs f"><hr class="int i-ma7 cs c">
<hr class="int i-tri cs g">
<label class="cs" for="c-cs">C#</label>
<hr class="int i-p4 fs b"><hr class="int i-ma2 fs gs"><hr class="int i-ma6 fs ds"><hr class="int i-mi2 fs g"><hr class="int i-ma3 fs as"><hr class="int i-ma7 fs f">
<hr class="int i-tri fs c">
<label class="fs" for="c-fs">F#</label>
<hr class="int i-p4 b e"><hr class="int i-ma2 b cs"><hr class="int i-ma6 b gs"><hr class="int i-mi2 b c"><hr class="int i-ma3 b ds"><hr class="int i-ma7 b as">
<hr class="int i-tri b f">
<label class="b" for="c-b">B</label>
<hr class="int i-p4 e a"><hr class="int i-ma2 e fs"><hr class="int i-ma6 e cs"><hr class="int i-mi2 e f"><hr class="int i-ma3 e gs"><hr class="int i-ma7 e ds">
<hr class="int i-tri e as">
<label class="e" for="c-e">E</label>
</div>
<div class="column">
<hr class="int i-p4 fs b"><hr class="int i-ma2 fs gs"><hr class="int i-ma6 fs ds"><hr class="int i-mi2 fs g"><hr class="int i-ma3 fs as"><hr class="int i-ma7 fs f">
<hr class="int i-tri fs c">
<label class="fs" for="c-fs">F#</label>
<hr class="int i-p4 b e"><hr class="int i-ma2 b cs"><hr class="int i-ma6 b gs"><hr class="int i-mi2 b c"><hr class="int i-ma3 b ds"><hr class="int i-ma7 b as">
<hr class="int i-tri b f">
<label class="b" for="c-b">B</label>
<hr class="int i-p4 e a"><hr class="int i-ma2 e fs"><hr class="int i-ma6 e cs"><hr class="int i-mi2 e f"><hr class="int i-ma3 e gs"><hr class="int i-ma7 e ds">
<hr class="int i-tri e as">
<label class="e" for="c-e">E</label>
<hr class="int i-p4 a d"><hr class="int i-ma2 a b"><hr class="int i-ma6 a fs"><hr class="int i-mi2 a as"><hr class="int i-ma3 a cs"><hr class="int i-ma7 a gs">
<hr class="int i-tri a ds">
<label class="a" for="c-a">A</label>
<hr class="int i-p4 d g"><hr class="int i-ma2 d e"><hr class="int i-ma6 d b"><hr class="int i-mi2 d ds"><hr class="int i-ma3 d fs"><hr class="int i-ma7 d cs">
<hr class="int i-tri d gs">
<label class="d" for="c-d">D</label>
<hr class="int i-p4 g c"><hr class="int i-ma2 g a"><hr class="int i-ma6 g e"><hr class="int i-mi2 g gs"><hr class="int i-ma3 g b"><hr class="int i-ma7 g fs">
<hr class="int i-tri g cs">
<label class="g" for="c-g">G</label>
<hr class="int i-p4 c f"><hr class="int i-ma2 c d"><hr class="int i-ma6 c a"><hr class="int i-mi2 c cs"><hr class="int i-ma3 c e"><hr class="int i-ma7 c b">
<hr class="int i-tri c fs">
<label class="c" for="c-c">C</label>
<hr class="int i-p4 f as"><hr class="int i-ma2 f g"><hr class="int i-ma6 f d"><hr class="int i-mi2 f fs"><hr class="int i-ma3 f a"><hr class="int i-ma7 f e">
<hr class="int i-tri f b">
<label class="f" for="c-f">F</label>
<hr class="int i-p4 as ds"><hr class="int i-ma2 as c"><hr class="int i-ma6 as g"><hr class="int i-mi2 as b"><hr class="int i-ma3 as d"><hr class="int i-ma7 as a">
<hr class="int i-tri as e">
<label class="as" for="c-as">A#</label>
<hr class="int i-p4 ds gs"><hr class="int i-ma2 ds f"><hr class="int i-ma6 ds c"><hr class="int i-mi2 ds e"><hr class="int i-ma3 ds g"><hr class="int i-ma7 ds d">
<hr class="int i-tri ds a">
<label class="ds" for="c-ds">D#</label>
<hr class="int i-p4 gs cs"><hr class="int i-ma2 gs as"><hr class="int i-ma6 gs f"><hr class="int i-mi2 gs a"><hr class="int i-ma3 gs c"><hr class="int i-ma7 gs g">
<hr class="int i-tri gs d">
<label class="gs" for="c-gs">G#</label>
<hr class="int i-p4 cs fs"><hr class="int i-ma2 cs ds"><hr class="int i-ma6 cs as"><hr class="int i-mi2 cs d"><hr class="int i-ma3 cs f"><hr class="int i-ma7 cs c">
<hr class="int i-tri cs g">
<label class="cs" for="c-cs">C#</label>
<hr class="int i-p4 fs b"><hr class="int i-ma2 fs gs"><hr class="int i-ma6 fs ds"><hr class="int i-mi2 fs g"><hr class="int i-ma3 fs as"><hr class="int i-ma7 fs f">
<hr class="int i-tri fs c">
<label class="fs" for="c-fs">F#</label>
<hr class="int i-p4 b e"><hr class="int i-ma2 b cs"><hr class="int i-ma6 b gs"><hr class="int i-mi2 b c"><hr class="int i-ma3 b ds"><hr class="int i-ma7 b as">
<hr class="int i-tri b f">
<label class="b" for="c-b">B</label>
<hr class="int i-p4 e a"><hr class="int i-ma2 e fs"><hr class="int i-ma6 e cs"><hr class="int i-mi2 e f"><hr class="int i-ma3 e gs"><hr class="int i-ma7 e ds">
<hr class="int i-tri e as">
<label class="e" for="c-e">E</label>
<hr class="int i-p4 a d"><hr class="int i-ma2 a b"><hr class="int i-ma6 a fs"><hr class="int i-mi2 a as"><hr class="int i-ma3 a cs"><hr class="int i-ma7 a gs">
<hr class="int i-tri a ds">
<label class="a" for="c-a">A</label>
<hr class="int i-p4 d g"><hr class="int i-ma2 d e"><hr class="int i-ma6 d b"><hr class="int i-mi2 d ds"><hr class="int i-ma3 d fs"><hr class="int i-ma7 d cs">
<hr class="int i-tri d gs">
<label class="d" for="c-d">D</label>
<hr class="int i-p4 g c"><hr class="int i-ma2 g a"><hr class="int i-ma6 g e"><hr class="int i-mi2 g gs"><hr class="int i-ma3 g b"><hr class="int i-ma7 g fs">
<hr class="int i-tri g cs">
<label class="g" for="c-g">G</label>
<hr class="int i-p4 c f"><hr class="int i-ma2 c d"><hr class="int i-ma6 c a"><hr class="int i-mi2 c cs"><hr class="int i-ma3 c e"><hr class="int i-ma7 c b">
<hr class="int i-tri c fs">
<label class="c" for="c-c">C</label>
<hr class="int i-p4 f as"><hr class="int i-ma2 f g"><hr class="int i-ma6 f d"><hr class="int i-mi2 f fs"><hr class="int i-ma3 f a"><hr class="int i-ma7 f e">
<hr class="int i-tri f b">
<label class="f" for="c-f">F</label>
<hr class="int i-p4 as ds"><hr class="int i-ma2 as c"><hr class="int i-ma6 as g"><hr class="int i-mi2 as b"><hr class="int i-ma3 as d"><hr class="int i-ma7 as a">
<hr class="int i-tri as e">
<label class="as" for="c-as">A#</label>
<hr class="int i-p4 ds gs"><hr class="int i-ma2 ds f"><hr class="int i-ma6 ds c"><hr class="int i-mi2 ds e"><hr class="int i-ma3 ds g"><hr class="int i-ma7 ds d">
<hr class="int i-tri ds a">
<label class="ds" for="c-ds">D#</label>
<hr class="int i-p4 gs cs"><hr class="int i-ma2 gs as"><hr class="int i-ma6 gs f"><hr class="int i-mi2 gs a"><hr class="int i-ma3 gs c"><hr class="int i-ma7 gs g">
<hr class="int i-tri gs d">
<label class="gs" for="c-gs">G#</label>
<hr class="int i-p4 cs fs"><hr class="int i-ma2 cs ds"><hr class="int i-ma6 cs as"><hr class="int i-mi2 cs d"><hr class="int i-ma3 cs f"><hr class="int i-ma7 cs c">
<hr class="int i-tri cs g">
<label class="cs" for="c-cs">C#</label>
</div>
</div>
<div class="block">
<div class="column">
<hr class="int i-p4 as ds"><hr class="int i-ma2 as c"><hr class="int i-ma6 as g"><hr class="int i-mi2 as b"><hr class="int i-ma3 as d"><hr class="int i-ma7 as a">
<hr class="int i-tri as e">
<label class="as" for="c-as">A#</label>
<hr class="int i-p4 ds gs"><hr class="int i-ma2 ds f"><hr class="int i-ma6 ds c"><hr class="int i-mi2 ds e"><hr class="int i-ma3 ds g"><hr class="int i-ma7 ds d">
<hr class="int i-tri ds a">
<label class="ds" for="c-ds">D#</label>
<hr class="int i-p4 gs cs"><hr class="int i-ma2 gs as"><hr class="int i-ma6 gs f"><hr class="int i-mi2 gs a"><hr class="int i-ma3 gs c"><hr class="int i-ma7 gs g">
<hr class="int i-tri gs d">
<label class="gs" for="c-gs">G#</label>
<hr class="int i-p4 cs fs"><hr class="int i-ma2 cs ds"><hr class="int i-ma6 cs as"><hr class="int i-mi2 cs d"><hr class="int i-ma3 cs f"><hr class="int i-ma7 cs c">
<hr class="int i-tri cs g">
<label class="cs" for="c-cs">C#</label>
<hr class="int i-p4 fs b"><hr class="int i-ma2 fs gs"><hr class="int i-ma6 fs ds"><hr class="int i-mi2 fs g"><hr class="int i-ma3 fs as"><hr class="int i-ma7 fs f">
<hr class="int i-tri fs c">
<label class="fs" for="c-fs">F#</label>
<hr class="int i-p4 b e"><hr class="int i-ma2 b cs"><hr class="int i-ma6 b gs"><hr class="int i-mi2 b c"><hr class="int i-ma3 b ds"><hr class="int i-ma7 b as">
<hr class="int i-tri b f">
<label class="b" for="c-b">B</label>
<hr class="int i-p4 e a"><hr class="int i-ma2 e fs"><hr class="int i-ma6 e cs"><hr class="int i-mi2 e f"><hr class="int i-ma3 e gs"><hr class="int i-ma7 e ds">
<hr class="int i-tri e as">
<label class="e" for="c-e">E</label>
<hr class="int i-p4 a d"><hr class="int i-ma2 a b"><hr class="int i-ma6 a fs"><hr class="int i-mi2 a as"><hr class="int i-ma3 a cs"><hr class="int i-ma7 a gs">
<hr class="int i-tri a ds">
<label class="a" for="c-a">A</label>
<hr class="int i-p4 d g"><hr class="int i-ma2 d e"><hr class="int i-ma6 d b"><hr class="int i-mi2 d ds"><hr class="int i-ma3 d fs"><hr class="int i-ma7 d cs">
<hr class="int i-tri d gs">
<label class="d" for="c-d">D</label>
<hr class="int i-p4 g c"><hr class="int i-ma2 g a"><hr class="int i-ma6 g e"><hr class="int i-mi2 g gs"><hr class="int i-ma3 g b"><hr class="int i-ma7 g fs">
<hr class="int i-tri g cs">
<label class="g" for="c-g">G</label>
<hr class="int i-p4 c f"><hr class="int i-ma2 c d"><hr class="int i-ma6 c a"><hr class="int i-mi2 c cs"><hr class="int i-ma3 c e"><hr class="int i-ma7 c b">
<hr class="int i-tri c fs">
<label class="c" for="c-c">C</label>
<hr class="int i-p4 f as"><hr class="int i-ma2 f g"><hr class="int i-ma6 f d"><hr class="int i-mi2 f fs"><hr class="int i-ma3 f a"><hr class="int i-ma7 f e">
<hr class="int i-tri f b">
<label class="f" for="c-f">F</label>
<hr class="int i-p4 as ds"><hr class="int i-ma2 as c"><hr class="int i-ma6 as g"><hr class="int i-mi2 as b"><hr class="int i-ma3 as d"><hr class="int i-ma7 as a">
<hr class="int i-tri as e">
<label class="as" for="c-as">A#</label>
<hr class="int i-p4 ds gs"><hr class="int i-ma2 ds f"><hr class="int i-ma6 ds c"><hr class="int i-mi2 ds e"><hr class="int i-ma3 ds g"><hr class="int i-ma7 ds d">
<hr class="int i-tri ds a">
<label class="ds" for="c-ds">D#</label>
<hr class="int i-p4 gs cs"><hr class="int i-ma2 gs as"><hr class="int i-ma6 gs f"><hr class="int i-mi2 gs a"><hr class="int i-ma3 gs c"><hr class="int i-ma7 gs g">
<hr class="int i-tri gs d">
<label class="gs" for="c-gs">G#</label>
<hr class="int i-p4 cs fs"><hr class="int i-ma2 cs ds"><hr class="int i-ma6 cs as"><hr class="int i-mi2 cs d"><hr class="int i-ma3 cs f"><hr class="int i-ma7 cs c">
<hr class="int i-tri cs g">
<label class="cs" for="c-cs">C#</label>
<hr class="int i-p4 fs b"><hr class="int i-ma2 fs gs"><hr class="int i-ma6 fs ds"><hr class="int i-mi2 fs g"><hr class="int i-ma3 fs as"><hr class="int i-ma7 fs f">
<hr class="int i-tri fs c">
<label class="fs" for="c-fs">F#</label>
<hr class="int i-p4 b e"><hr class="int i-ma2 b cs"><hr class="int i-ma6 b gs"><hr class="int i-mi2 b c"><hr class="int i-ma3 b ds"><hr class="int i-ma7 b as">
<hr class="int i-tri b f">
<label class="b" for="c-b">B</label>
<hr class="int i-p4 e a"><hr class="int i-ma2 e fs"><hr class="int i-ma6 e cs"><hr class="int i-mi2 e f"><hr class="int i-ma3 e gs"><hr class="int i-ma7 e ds">
<hr class="int i-tri e as">
<label class="e" for="c-e">E</label>
<hr class="int i-p4 a d"><hr class="int i-ma2 a b"><hr class="int i-ma6 a fs"><hr class="int i-mi2 a as"><hr class="int i-ma3 a cs"><hr class="int i-ma7 a gs">
<hr class="int i-tri a ds">
<label class="a" for="c-a">A</label>
<hr class="int i-p4 d g"><hr class="int i-ma2 d e"><hr class="int i-ma6 d b"><hr class="int i-mi2 d ds"><hr class="int i-ma3 d fs"><hr class="int i-ma7 d cs">
<hr class="int i-tri d gs">
<label class="d" for="c-d">D</label>
<hr class="int i-p4 g c"><hr class="int i-ma2 g a"><hr class="int i-ma6 g e"><hr class="int i-mi2 g gs"><hr class="int i-ma3 g b"><hr class="int i-ma7 g fs">
<hr class="int i-tri g cs">
<label class="g" for="c-g">G</label>
<hr class="int i-p4 c f"><hr class="int i-ma2 c d"><hr class="int i-ma6 c a"><hr class="int i-mi2 c cs"><hr class="int i-ma3 c e"><hr class="int i-ma7 c b">
<hr class="int i-tri c fs">
<label class="c" for="c-c">C</label>
<hr class="int i-p4 f as"><hr class="int i-ma2 f g"><hr class="int i-ma6 f d"><hr class="int i-mi2 f fs"><hr class="int i-ma3 f a"><hr class="int i-ma7 f e">
<hr class="int i-tri f b">
<label class="f" for="c-f">F</label>
</div>
<div class="column">
<hr class="int i-p4 g c"><hr class="int i-ma2 g a"><hr class="int i-ma6 g e"><hr class="int i-mi2 g gs"><hr class="int i-ma3 g b"><hr class="int i-ma7 g fs">
<hr class="int i-tri g cs">
<label class="g" for="c-g">G</label>
<hr class="int i-p4 c f"><hr class="int i-ma2 c d"><hr class="int i-ma6 c a"><hr class="int i-mi2 c cs"><hr class="int i-ma3 c e"><hr class="int i-ma7 c b">
<hr class="int i-tri c fs">
<label class="c" for="c-c">C</label>
<hr class="int i-p4 f as"><hr class="int i-ma2 f g"><hr class="int i-ma6 f d"><hr class="int i-mi2 f fs"><hr class="int i-ma3 f a"><hr class="int i-ma7 f e">
<hr class="int i-tri f b">
<label class="f" for="c-f">F</label>
<hr class="int i-p4 as ds"><hr class="int i-ma2 as c"><hr class="int i-ma6 as g"><hr class="int i-mi2 as b"><hr class="int i-ma3 as d"><hr class="int i-ma7 as a">
<hr class="int i-tri as e">
<label class="as" for="c-as">A#</label>
<hr class="int i-p4 ds gs"><hr class="int i-ma2 ds f"><hr class="int i-ma6 ds c"><hr class="int i-mi2 ds e"><hr class="int i-ma3 ds g"><hr class="int i-ma7 ds d">
<hr class="int i-tri ds a">
<label class="ds" for="c-ds">D#</label>
<hr class="int i-p4 gs cs"><hr class="int i-ma2 gs as"><hr class="int i-ma6 gs f"><hr class="int i-mi2 gs a"><hr class="int i-ma3 gs c"><hr class="int i-ma7 gs g">
<hr class="int i-tri gs d">
<label class="gs" for="c-gs">G#</label>
<hr class="int i-p4 cs fs"><hr class="int i-ma2 cs ds"><hr class="int i-ma6 cs as"><hr class="int i-mi2 cs d"><hr class="int i-ma3 cs f"><hr class="int i-ma7 cs c">
<hr class="int i-tri cs g">
<label class="cs" for="c-cs">C#</label>
<hr class="int i-p4 fs b"><hr class="int i-ma2 fs gs"><hr class="int i-ma6 fs ds"><hr class="int i-mi2 fs g"><hr class="int i-ma3 fs as"><hr class="int i-ma7 fs f">
<hr class="int i-tri fs c">
<label class="fs" for="c-fs">F#</label>
<hr class="int i-p4 b e"><hr class="int i-ma2 b cs"><hr class="int i-ma6 b gs"><hr class="int i-mi2 b c"><hr class="int i-ma3 b ds"><hr class="int i-ma7 b as">
<hr class="int i-tri b f">
<label class="b" for="c-b">B</label>
<hr class="int i-p4 e a"><hr class="int i-ma2 e fs"><hr class="int i-ma6 e cs"><hr class="int i-mi2 e f"><hr class="int i-ma3 e gs"><hr class="int i-ma7 e ds">
<hr class="int i-tri e as">
<label class="e" for="c-e">E</label>
<hr class="int i-p4 a d"><hr class="int i-ma2 a b"><hr class="int i-ma6 a fs"><hr class="int i-mi2 a as"><hr class="int i-ma3 a cs"><hr class="int i-ma7 a gs">
<hr class="int i-tri a ds">
<label class="a" for="c-a">A</label>
<hr class="int i-p4 d g"><hr class="int i-ma2 d e"><hr class="int i-ma6 d b"><hr class="int i-mi2 d ds"><hr class="int i-ma3 d fs"><hr class="int i-ma7 d cs">
<hr class="int i-tri d gs">
<label class="d" for="c-d">D</label>
<hr class="int i-p4 g c"><hr class="int i-ma2 g a"><hr class="int i-ma6 g e"><hr class="int i-mi2 g gs"><hr class="int i-ma3 g b"><hr class="int i-ma7 g fs">
<hr class="int i-tri g cs">
<label class="g" for="c-g">G</label>
<hr class="int i-p4 c f"><hr class="int i-ma2 c d"><hr class="int i-ma6 c a"><hr class="int i-mi2 c cs"><hr class="int i-ma3 c e"><hr class="int i-ma7 c b">
<hr class="int i-tri c fs">
<label class="c" for="c-c">C</label>
<hr class="int i-p4 f as"><hr class="int i-ma2 f g"><hr class="int i-ma6 f d"><hr class="int i-mi2 f fs"><hr class="int i-ma3 f a"><hr class="int i-ma7 f e">
<hr class="int i-tri f b">
<label class="f" for="c-f">F</label>
<hr class="int i-p4 as ds"><hr class="int i-ma2 as c"><hr class="int i-ma6 as g"><hr class="int i-mi2 as b"><hr class="int i-ma3 as d"><hr class="int i-ma7 as a">
<hr class="int i-tri as e">
<label class="as" for="c-as">A#</label>
<hr class="int i-p4 ds gs"><hr class="int i-ma2 ds f"><hr class="int i-ma6 ds c"><hr class="int i-mi2 ds e"><hr class="int i-ma3 ds g"><hr class="int i-ma7 ds d">
<hr class="int i-tri ds a">
<label class="ds" for="c-ds">D#</label>
<hr class="int i-p4 gs cs"><hr class="int i-ma2 gs as"><hr class="int i-ma6 gs f"><hr class="int i-mi2 gs a"><hr class="int i-ma3 gs c"><hr class="int i-ma7 gs g">
<hr class="int i-tri gs d">
<label class="gs" for="c-gs">G#</label>
<hr class="int i-p4 cs fs"><hr class="int i-ma2 cs ds"><hr class="int i-ma6 cs as"><hr class="int i-mi2 cs d"><hr class="int i-ma3 cs f"><hr class="int i-ma7 cs c">
<hr class="int i-tri cs g">
<label class="cs" for="c-cs">C#</label>
<hr class="int i-p4 fs b"><hr class="int i-ma2 fs gs"><hr class="int i-ma6 fs ds"><hr class="int i-mi2 fs g"><hr class="int i-ma3 fs as"><hr class="int i-ma7 fs f">
<hr class="int i-tri fs c">
<label class="fs" for="c-fs">F#</label>
<hr class="int i-p4 b e"><hr class="int i-ma2 b cs"><hr class="int i-ma6 b gs"><hr class="int i-mi2 b c"><hr class="int i-ma3 b ds"><hr class="int i-ma7 b as">
<hr class="int i-tri b f">
<label class="b" for="c-b">B</label>
<hr class="int i-p4 e a"><hr class="int i-ma2 e fs"><hr class="int i-ma6 e cs"><hr class="int i-mi2 e f"><hr class="int i-ma3 e gs"><hr class="int i-ma7 e ds">
<hr class="int i-tri e as">
<label class="e" for="c-e">E</label>
<hr class="int i-p4 a d"><hr class="int i-ma2 a b"><hr class="int i-ma6 a fs"><hr class="int i-mi2 a as"><hr class="int i-ma3 a cs"><hr class="int i-ma7 a gs">
<hr class="int i-tri a ds">
<label class="a" for="c-a">A</label>
<hr class="int i-p4 d g"><hr class="int i-ma2 d e"><hr class="int i-ma6 d b"><hr class="int i-mi2 d ds"><hr class="int i-ma3 d fs"><hr class="int i-ma7 d cs">
<hr class="int i-tri d gs">
<label class="d" for="c-d">D</label>
</div>
<div class="column">
<hr class="int i-p4 e a"><hr class="int i-ma2 e fs"><hr class="int i-ma6 e cs"><hr class="int i-mi2 e f"><hr class="int i-ma3 e gs"><hr class="int i-ma7 e ds">
<hr class="int i-tri e as">
<label class="e" for="c-e">E</label>
<hr class="int i-p4 a d"><hr class="int i-ma2 a b"><hr class="int i-ma6 a fs"><hr class="int i-mi2 a as"><hr class="int i-ma3 a cs"><hr class="int i-ma7 a gs">
<hr class="int i-tri a ds">
<label class="a" for="c-a">A</label>
<hr class="int i-p4 d g"><hr class="int i-ma2 d e"><hr class="int i-ma6 d b"><hr class="int i-mi2 d ds"><hr class="int i-ma3 d fs"><hr class="int i-ma7 d cs">
<hr class="int i-tri d gs">
<label class="d" for="c-d">D</label>
<hr class="int i-p4 g c"><hr class="int i-ma2 g a"><hr class="int i-ma6 g e"><hr class="int i-mi2 g gs"><hr class="int i-ma3 g b"><hr class="int i-ma7 g fs">
<hr class="int i-tri g cs">
<label class="g" for="c-g">G</label>
<hr class="int i-p4 c f"><hr class="int i-ma2 c d"><hr class="int i-ma6 c a"><hr class="int i-mi2 c cs"><hr class="int i-ma3 c e"><hr class="int i-ma7 c b">
<hr class="int i-tri c fs">
<label class="c" for="c-c">C</label>
<hr class="int i-p4 f as"><hr class="int i-ma2 f g"><hr class="int i-ma6 f d"><hr class="int i-mi2 f fs"><hr class="int i-ma3 f a"><hr class="int i-ma7 f e">
<hr class="int i-tri f b">
<label class="f" for="c-f">F</label>
<hr class="int i-p4 as ds"><hr class="int i-ma2 as c"><hr class="int i-ma6 as g"><hr class="int i-mi2 as b"><hr class="int i-ma3 as d"><hr class="int i-ma7 as a">
<hr class="int i-tri as e">
<label class="as" for="c-as">A#</label>
<hr class="int i-p4 ds gs"><hr class="int i-ma2 ds f"><hr class="int i-ma6 ds c"><hr class="int i-mi2 ds e"><hr class="int i-ma3 ds g"><hr class="int i-ma7 ds d">
<hr class="int i-tri ds a">
<label class="ds" for="c-ds">D#</label>
<hr class="int i-p4 gs cs"><hr class="int i-ma2 gs as"><hr class="int i-ma6 gs f"><hr class="int i-mi2 gs a"><hr class="int i-ma3 gs c"><hr class="int i-ma7 gs g">
<hr class="int i-tri gs d">
<label class="gs" for="c-gs">G#</label>
<hr class="int i-p4 cs fs"><hr class="int i-ma2 cs ds"><hr class="int i-ma6 cs as"><hr class="int i-mi2 cs d"><hr class="int i-ma3 cs f"><hr class="int i-ma7 cs c">
<hr class="int i-tri cs g">
<label class="cs" for="c-cs">C#</label>
<hr class="int i-p4 fs b"><hr class="int i-ma2 fs gs"><hr class="int i-ma6 fs ds"><hr class="int i-mi2 fs g"><hr class="int i-ma3 fs as"><hr class="int i-ma7 fs f">
<hr class="int i-tri fs c">
<label class="fs" for="c-fs">F#</label>
<hr class="int i-p4 b e"><hr class="int i-ma2 b cs"><hr class="int i-ma6 b gs"><hr class="int i-mi2 b c"><hr class="int i-ma3 b ds"><hr class="int i-ma7 b as">
<hr class="int i-tri b f">
<label class="b" for="c-b">B</label>
<hr class="int i-p4 e a"><hr class="int i-ma2 e fs"><hr class="int i-ma6 e cs"><hr class="int i-mi2 e f"><hr class="int i-ma3 e gs"><hr class="int i-ma7 e ds">
<hr class="int i-tri e as">
<label class="e" for="c-e">E</label>
<hr class="int i-p4 a d"><hr class="int i-ma2 a b"><hr class="int i-ma6 a fs"><hr class="int i-mi2 a as"><hr class="int i-ma3 a cs"><hr class="int i-ma7 a gs">
<hr class="int i-tri a ds">
<label class="a" for="c-a">A</label>
<hr class="int i-p4 d g"><hr class="int i-ma2 d e"><hr class="int i-ma6 d b"><hr class="int i-mi2 d ds"><hr class="int i-ma3 d fs"><hr class="int i-ma7 d cs">
<hr class="int i-tri d gs">
<label class="d" for="c-d">D</label>
<hr class="int i-p4 g c"><hr class="int i-ma2 g a"><hr class="int i-ma6 g e"><hr class="int i-mi2 g gs"><hr class="int i-ma3 g b"><hr class="int i-ma7 g fs">
<hr class="int i-tri g cs">
<label class="g" for="c-g">G</label>
<hr class="int i-p4 c f"><hr class="int i-ma2 c d"><hr class="int i-ma6 c a"><hr class="int i-mi2 c cs"><hr class="int i-ma3 c e"><hr class="int i-ma7 c b">
<hr class="int i-tri c fs">
<label class="c" for="c-c">C</label>
<hr class="int i-p4 f as"><hr class="int i-ma2 f g"><hr class="int i-ma6 f d"><hr class="int i-mi2 f fs"><hr class="int i-ma3 f a"><hr class="int i-ma7 f e">
<hr class="int i-tri f b">
<label class="f" for="c-f">F</label>
<hr class="int i-p4 as ds"><hr class="int i-ma2 as c"><hr class="int i-ma6 as g"><hr class="int i-mi2 as b"><hr class="int i-ma3 as d"><hr class="int i-ma7 as a">
<hr class="int i-tri as e">
<label class="as" for="c-as">A#</label>
<hr class="int i-p4 ds gs"><hr class="int i-ma2 ds f"><hr class="int i-ma6 ds c"><hr class="int i-mi2 ds e"><hr class="int i-ma3 ds g"><hr class="int i-ma7 ds d">
<hr class="int i-tri ds a">
<label class="ds" for="c-ds">D#</label>
<hr class="int i-p4 gs cs"><hr class="int i-ma2 gs as"><hr class="int i-ma6 gs f"><hr class="int i-mi2 gs a"><hr class="int i-ma3 gs c"><hr class="int i-ma7 gs g">
<hr class="int i-tri gs d">
<label class="gs" for="c-gs">G#</label>
<hr class="int i-p4 cs fs"><hr class="int i-ma2 cs ds"><hr class="int i-ma6 cs as"><hr class="int i-mi2 cs d"><hr class="int i-ma3 cs f"><hr class="int i-ma7 cs c">
<hr class="int i-tri cs g">
<label class="cs" for="c-cs">C#</label>
<hr class="int i-p4 fs b"><hr class="int i-ma2 fs gs"><hr class="int i-ma6 fs ds"><hr class="int i-mi2 fs g"><hr class="int i-ma3 fs as"><hr class="int i-ma7 fs f">
<hr class="int i-tri fs c">
<label class="fs" for="c-fs">F#</label>
<hr class="int i-p4 b e"><hr class="int i-ma2 b cs"><hr class="int i-ma6 b gs"><hr class="int i-mi2 b c"><hr class="int i-ma3 b ds"><hr class="int i-ma7 b as">
<hr class="int i-tri b f">
<label class="b" for="c-b">B</label>
</div>
<div class="column">
<hr class="int i-p4 gs cs"><hr class="int i-ma2 gs as"><hr class="int i-ma6 gs f"><hr class="int i-mi2 gs a"><hr class="int i-ma3 gs c"><hr class="int i-ma7 gs g">
<hr class="int i-tri gs d">
<label class="gs" for="c-gs">G#</label>
<hr class="int i-p4 cs fs"><hr class="int i-ma2 cs ds"><hr class="int i-ma6 cs as"><hr class="int i-mi2 cs d"><hr class="int i-ma3 cs f"><hr class="int i-ma7 cs c">
<hr class="int i-tri cs g">
<label class="cs" for="c-cs">C#</label>
<hr class="int i-p4 fs b"><hr class="int i-ma2 fs gs"><hr class="int i-ma6 fs ds"><hr class="int i-mi2 fs g"><hr class="int i-ma3 fs as"><hr class="int i-ma7 fs f">
<hr class="int i-tri fs c">
<label class="fs" for="c-fs">F#</label>
<hr class="int i-p4 b e"><hr class="int i-ma2 b cs"><hr class="int i-ma6 b gs"><hr class="int i-mi2 b c"><hr class="int i-ma3 b ds"><hr class="int i-ma7 b as">
<hr class="int i-tri b f">
<label class="b" for="c-b">B</label>
<hr class="int i-p4 e a"><hr class="int i-ma2 e fs"><hr class="int i-ma6 e cs"><hr class="int i-mi2 e f"><hr class="int i-ma3 e gs"><hr class="int i-ma7 e ds">
<hr class="int i-tri e as">
<label class="e" for="c-e">E</label>
<hr class="int i-p4 a d"><hr class="int i-ma2 a b"><hr class="int i-ma6 a fs"><hr class="int i-mi2 a as"><hr class="int i-ma3 a cs"><hr class="int i-ma7 a gs">
<hr class="int i-tri a ds">
<label class="a" for="c-a">A</label>
<hr class="int i-p4 d g"><hr class="int i-ma2 d e"><hr class="int i-ma6 d b"><hr class="int i-mi2 d ds"><hr class="int i-ma3 d fs"><hr class="int i-ma7 d cs">
<hr class="int i-tri d gs">
<label class="d" for="c-d">D</label>
<hr class="int i-p4 g c"><hr class="int i-ma2 g a"><hr class="int i-ma6 g e"><hr class="int i-mi2 g gs"><hr class="int i-ma3 g b"><hr class="int i-ma7 g fs">
<hr class="int i-tri g cs">
<label class="g" for="c-g">G</label>
<hr class="int i-p4 c f"><hr class="int i-ma2 c d"><hr class="int i-ma6 c a"><hr class="int i-mi2 c cs"><hr class="int i-ma3 c e"><hr class="int i-ma7 c b">
<hr class="int i-tri c fs">
<label class="c" for="c-c">C</label>
<hr class="int i-p4 f as"><hr class="int i-ma2 f g"><hr class="int i-ma6 f d"><hr class="int i-mi2 f fs"><hr class="int i-ma3 f a"><hr class="int i-ma7 f e">
<hr class="int i-tri f b">
<label class="f" for="c-f">F</label>
<hr class="int i-p4 as ds"><hr class="int i-ma2 as c"><hr class="int i-ma6 as g"><hr class="int i-mi2 as b"><hr class="int i-ma3 as d"><hr class="int i-ma7 as a">
<hr class="int i-tri as e">
<label class="as" for="c-as">A#</label>
<hr class="int i-p4 ds gs"><hr class="int i-ma2 ds f"><hr class="int i-ma6 ds c"><hr class="int i-mi2 ds e"><hr class="int i-ma3 ds g"><hr class="int i-ma7 ds d">
<hr class="int i-tri ds a">
<label class="ds" for="c-ds">D#</label>
<hr class="int i-p4 gs cs"><hr class="int i-ma2 gs as"><hr class="int i-ma6 gs f"><hr class="int i-mi2 gs a"><hr class="int i-ma3 gs c"><hr class="int i-ma7 gs g">
<hr class="int i-tri gs d">
<label class="gs" for="c-gs">G#</label>
<hr class="int i-p4 cs fs"><hr class="int i-ma2 cs ds"><hr class="int i-ma6 cs as"><hr class="int i-mi2 cs d"><hr class="int i-ma3 cs f"><hr class="int i-ma7 cs c">
<hr class="int i-tri cs g">
<label class="cs" for="c-cs">C#</label>
<hr class="int i-p4 fs b"><hr class="int i-ma2 fs gs"><hr class="int i-ma6 fs ds"><hr class="int i-mi2 fs g"><hr class="int i-ma3 fs as"><hr class="int i-ma7 fs f">
<hr class="int i-tri fs c">
<label class="fs" for="c-fs">F#</label>
<hr class="int i-p4 b e"><hr class="int i-ma2 b cs"><hr class="int i-ma6 b gs"><hr class="int i-mi2 b c"><hr class="int i-ma3 b ds"><hr class="int i-ma7 b as">
<hr class="int i-tri b f">
<label class="b" for="c-b">B</label>
<hr class="int i-p4 e a"><hr class="int i-ma2 e fs"><hr class="int i-ma6 e cs"><hr class="int i-mi2 e f"><hr class="int i-ma3 e gs"><hr class="int i-ma7 e ds">
<hr class="int i-tri e as">
<label class="e" for="c-e">E</label>
<hr class="int i-p4 a d"><hr class="int i-ma2 a b"><hr class="int i-ma6 a fs"><hr class="int i-mi2 a as"><hr class="int i-ma3 a cs"><hr class="int i-ma7 a gs">
<hr class="int i-tri a ds">
<label class="a" for="c-a">A</label>
<hr class="int i-p4 d g"><hr class="int i-ma2 d e"><hr class="int i-ma6 d b"><hr class="int i-mi2 d ds"><hr class="int i-ma3 d fs"><hr class="int i-ma7 d cs">
<hr class="int i-tri d gs">
<label class="d" for="c-d">D</label>
<hr class="int i-p4 g c"><hr class="int i-ma2 g a"><hr class="int i-ma6 g e"><hr class="int i-mi2 g gs"><hr class="int i-ma3 g b"><hr class="int i-ma7 g fs">
<hr class="int i-tri g cs">
<label class="g" for="c-g">G</label>
<hr class="int i-p4 c f"><hr class="int i-ma2 c d"><hr class="int i-ma6 c a"><hr class="int i-mi2 c cs"><hr class="int i-ma3 c e"><hr class="int i-ma7 c b">
<hr class="int i-tri c fs">
<label class="c" for="c-c">C</label>
<hr class="int i-p4 f as"><hr class="int i-ma2 f g"><hr class="int i-ma6 f d"><hr class="int i-mi2 f fs"><hr class="int i-ma3 f a"><hr class="int i-ma7 f e">
<hr class="int i-tri f b">
<label class="f" for="c-f">F</label>
<hr class="int i-p4 as ds"><hr class="int i-ma2 as c"><hr class="int i-ma6 as g"><hr class="int i-mi2 as b"><hr class="int i-ma3 as d"><hr class="int i-ma7 as a">
<hr class="int i-tri as e">
<label class="as" for="c-as">A#</label>
<hr class="int i-p4 ds gs"><hr class="int i-ma2 ds f"><hr class="int i-ma6 ds c"><hr class="int i-mi2 ds e"><hr class="int i-ma3 ds g"><hr class="int i-ma7 ds d">
<hr class="int i-tri ds a">
<label class="ds" for="c-ds">D#</label>
</div>
<div class="column">
<hr class="int i-p4 f as"><hr class="int i-ma2 f g"><hr class="int i-ma6 f d"><hr class="int i-mi2 f fs"><hr class="int i-ma3 f a"><hr class="int i-ma7 f e">
<hr class="int i-tri f b">
<label class="f" for="c-f">F</label>
<hr class="int i-p4 as ds"><hr class="int i-ma2 as c"><hr class="int i-ma6 as g"><hr class="int i-mi2 as b"><hr class="int i-ma3 as d"><hr class="int i-ma7 as a">
<hr class="int i-tri as e">
<label class="as" for="c-as">A#</label>
<hr class="int i-p4 ds gs"><hr class="int i-ma2 ds f"><hr class="int i-ma6 ds c"><hr class="int i-mi2 ds e"><hr class="int i-ma3 ds g"><hr class="int i-ma7 ds d">
<hr class="int i-tri ds a">
<label class="ds" for="c-ds">D#</label>
<hr class="int i-p4 gs cs"><hr class="int i-ma2 gs as"><hr class="int i-ma6 gs f"><hr class="int i-mi2 gs a"><hr class="int i-ma3 gs c"><hr class="int i-ma7 gs g">
<hr class="int i-tri gs d">
<label class="gs" for="c-gs">G#</label>
<hr class="int i-p4 cs fs"><hr class="int i-ma2 cs ds"><hr class="int i-ma6 cs as"><hr class="int i-mi2 cs d"><hr class="int i-ma3 cs f"><hr class="int i-ma7 cs c">
<hr class="int i-tri cs g">
<label class="cs" for="c-cs">C#</label>
<hr class="int i-p4 fs b"><hr class="int i-ma2 fs gs"><hr class="int i-ma6 fs ds"><hr class="int i-mi2 fs g"><hr class="int i-ma3 fs as"><hr class="int i-ma7 fs f">
<hr class="int i-tri fs c">
<label class="fs" for="c-fs">F#</label>
<hr class="int i-p4 b e"><hr class="int i-ma2 b cs"><hr class="int i-ma6 b gs"><hr class="int i-mi2 b c"><hr class="int i-ma3 b ds"><hr class="int i-ma7 b as">
<hr class="int i-tri b f">
<label class="b" for="c-b">B</label>
<hr class="int i-p4 e a"><hr class="int i-ma2 e fs"><hr class="int i-ma6 e cs"><hr class="int i-mi2 e f"><hr class="int i-ma3 e gs"><hr class="int i-ma7 e ds">
<hr class="int i-tri e as">
<label class="e" for="c-e">E</label>
<hr class="int i-p4 a d"><hr class="int i-ma2 a b"><hr class="int i-ma6 a fs"><hr class="int i-mi2 a as"><hr class="int i-ma3 a cs"><hr class="int i-ma7 a gs">
<hr class="int i-tri a ds">
<label class="a" for="c-a">A</label>
<hr class="int i-p4 d g"><hr class="int i-ma2 d e"><hr class="int i-ma6 d b"><hr class="int i-mi2 d ds"><hr class="int i-ma3 d fs"><hr class="int i-ma7 d cs">
<hr class="int i-tri d gs">
<label class="d" for="c-d">D</label>
<hr class="int i-p4 g c"><hr class="int i-ma2 g a"><hr class="int i-ma6 g e"><hr class="int i-mi2 g gs"><hr class="int i-ma3 g b"><hr class="int i-ma7 g fs">
<hr class="int i-tri g cs">
<label class="g" for="c-g">G</label>
<hr class="int i-p4 c f"><hr class="int i-ma2 c d"><hr class="int i-ma6 c a"><hr class="int i-mi2 c cs"><hr class="int i-ma3 c e"><hr class="int i-ma7 c b">
<hr class="int i-tri c fs">
<label class="c" for="c-c">C</label>
<hr class="int i-p4 f as"><hr class="int i-ma2 f g"><hr class="int i-ma6 f d"><hr class="int i-mi2 f fs"><hr class="int i-ma3 f a"><hr class="int i-ma7 f e">
<hr class="int i-tri f b">
<label class="f" for="c-f">F</label>
<hr class="int i-p4 as ds"><hr class="int i-ma2 as c"><hr class="int i-ma6 as g"><hr class="int i-mi2 as b"><hr class="int i-ma3 as d"><hr class="int i-ma7 as a">
<hr class="int i-tri as e">
<label class="as" for="c-as">A#</label>
<hr class="int i-p4 ds gs"><hr class="int i-ma2 ds f"><hr class="int i-ma6 ds c"><hr class="int i-mi2 ds e"><hr class="int i-ma3 ds g"><hr class="int i-ma7 ds d">
<hr class="int i-tri ds a">
<label class="ds" for="c-ds">D#</label>
<hr class="int i-p4 gs cs"><hr class="int i-ma2 gs as"><hr class="int i-ma6 gs f"><hr class="int i-mi2 gs a"><hr class="int i-ma3 gs c"><hr class="int i-ma7 gs g">
<hr class="int i-tri gs d">
<label class="gs" for="c-gs">G#</label>
<hr class="int i-p4 cs fs"><hr class="int i-ma2 cs ds"><hr class="int i-ma6 cs as"><hr class="int i-mi2 cs d"><hr class="int i-ma3 cs f"><hr class="int i-ma7 cs c">
<hr class="int i-tri cs g">
<label class="cs" for="c-cs">C#</label>
<hr class="int i-p4 fs b"><hr class="int i-ma2 fs gs"><hr class="int i-ma6 fs ds"><hr class="int i-mi2 fs g"><hr class="int i-ma3 fs as"><hr class="int i-ma7 fs f">
<hr class="int i-tri fs c">
<label class="fs" for="c-fs">F#</label>
<hr class="int i-p4 b e"><hr class="int i-ma2 b cs"><hr class="int i-ma6 b gs"><hr class="int i-mi2 b c"><hr class="int i-ma3 b ds"><hr class="int i-ma7 b as">
<hr class="int i-tri b f">
<label class="b" for="c-b">B</label>
<hr class="int i-p4 e a"><hr class="int i-ma2 e fs"><hr class="int i-ma6 e cs"><hr class="int i-mi2 e f"><hr class="int i-ma3 e gs">