html {
    font-size: 100%;
    min-height: 256200px;
}

/*
body {
  font-size: 0.80em;
}
*/

@media (max-width: 360px) {
    html { font-size: 89%; }
}

@media (min-width: 768px) {
    html { font-size: 100%; }
}

@media (min-width: 700px) {
    html { font-size: 120%; }
}

@media (min-width: 1200px) {
    html { font-size: 144%; }
}

.TODO {
    display:none;
    border:3px;
    border-style:solid;
    border-color:#663;
    padding:0.5rem;
    background-color:#cc6;
    color:#000;
}

div.abcjs-container {
    page-break-inside: avoid;
}

svg .abcjs-note_selected {
    fill: #000;
}

kbd {
  white-space: pre;
  overflow-x: auto;
  overflow-wrap: normal;
  display: inline-block;
  width: fit-content;
  max-width: 100%;
  vertical-align: bottom;
}

/*
body {
  font-size: 3.0vh;
}
*/

/*
h1 {
  margin-top: 6px;
  color: rgb(31, 79, 223);
  font-size: 24px;
  font-size: 1.5rem;
  font-weight: bold;
}
*/

/*
code { color: rgb(39, 95, 255); }
*/

/*
#instruction { color: rgb(3, 11, 0); }
*/