body{font-family:Merriweather,serif !important}#main .textwidget{padding:0}#main .textwidget{padding:0 20px 20px}#circle-of-fourths{background:#fff;color:#000;display:flex;flex-direction:column;align-items:center;padding:1rem}#circle-of-fourths h1{margin-bottom:.5rem;font-weight:500}#circle-of-fourths #controls{margin:.5rem}#circle-of-fourths button{margin:0 4px;padding:6px 10px;font-size:14px;cursor:pointer;border:1px solid #ccc;background:#f8f8f8;border-radius:4px}#circle-of-fourths button.active{background:#0078ff;color:#fff;border-color:#0078ff}#circle-of-fourths svg{width:min(90vw,420px);height:min(90vw,420px);margin-top:.5rem}#circle-of-fourths circle.base{stroke:#000;stroke-width:3;fill:none}#circle-of-fourths line.ray{stroke:#ddd;stroke-width:1}#circle-of-fourths text.note{font-size:16px;text-anchor:middle;alignment-baseline:middle;user-select:none;fill:#555;transition:.15s}#circle-of-fourths text.note.active{fill:#0078ff;font-weight:700;font-size:18px}#circle-of-fourths text.degree{font-size:12px;text-anchor:middle;alignment-baseline:middle;fill:#0078ff}#circle-of-fourths #current-key{font-size:36px;font-weight:700;fill:#333;text-anchor:middle}#circle-of-fourths #relative,#circle-of-fourths #scale,#circle-of-fourths #chords,#circle-of-fourths #progression{margin-top:.4rem;font-size:15px;text-align:center}#circle-of-fourths #relative b{cursor:pointer;text-decoration:underline}