*{box-sizing:border-box}html,body{height:100%}body{color:#10102a;background-color:#d8d8f0;background-image:linear-gradient(#fdf5e6e0,#fdf5e6e0),url(./Treble_clef-C66E6zWL.png);background-repeat:no-repeat,repeat;background-size:cover,28px 28px;background-attachment:fixed,fixed;margin:0;padding:0 0 3rem;font-family:Times New Roman,Times,Georgia,serif;font-size:18px}.side-clef{z-index:0;opacity:.85;pointer-events:none;width:110px;animation:6s ease-in-out infinite clef-bob;position:fixed;top:50%}.side-clef.left{left:6px}.side-clef.right{animation-delay:-3s;right:6px}@keyframes clef-bob{0%,to{transform:translateY(-180px)}50%{transform:translateY(180px)}}header{z-index:1;text-align:center;padding:1.5rem 1rem .5rem;position:relative}h1.blockletters{letter-spacing:.05em;text-transform:uppercase;margin:0;font-family:Arial Black,Arial,sans-serif;font-size:2.6rem}h1.blockletters span{text-shadow:2px 2px #000,4px 4px #0000004d;font-weight:900;display:inline-block}h1.blockletters span:nth-child(7n+1){color:red}h1.blockletters span:nth-child(7n+2){color:#f90}h1.blockletters span:nth-child(7n+3){color:#dc0}h1.blockletters span:nth-child(7n+4){color:#0a4}h1.blockletters span:nth-child(7n+5){color:#06f}h1.blockletters span:nth-child(7n+6){color:#60c}h1.blockletters span:nth-child(7n){color:#f0a}.subtitle{color:indigo;font-style:italic}nav{z-index:1;text-align:center;background:navy;border:6px ridge silver;max-width:40rem;margin:1rem auto;padding:.5rem 1rem;position:relative}nav a{text-transform:uppercase;margin:0 .6rem;font-weight:700;text-decoration:none}a:link{color:#00e}a:visited{color:purple}a:hover{color:red}a:active{color:#f90}nav a:link,nav a:visited{color:#ff0}nav a:hover,nav a:focus{color:#0ff;text-decoration:underline}main{z-index:1;background:ivory;border:10px ridge silver;max-width:42rem;margin:0 auto 2rem;padding:1.5rem 2rem;line-height:1.6;position:relative}main h2{color:indigo;border-bottom:2px dotted indigo}.portrait{filter:grayscale()contrast(1.15)sepia(.12);border:8px ridge #a0a0a0;width:100%;max-width:260px;height:auto;margin:0 auto .5rem;display:block}figure.composer{text-align:center;float:right;width:260px;margin:0 0 1.5rem 1.5rem}figcaption{font-size:.85rem;font-style:italic}.audio-box{text-align:center;clear:both;background:#e0e0ff;border:6px ridge gray;margin:1.5rem 0;padding:1rem}.audio-box audio{width:100%;max-width:320px}.audio-note{font-size:.85rem}.fallback-link{color:red;background:#ff0;border:4px ridge gray;margin-top:.6rem;padding:.3rem .7rem;font-weight:700;animation:1.2s step-end infinite blink-anim;display:inline-block}@keyframes blink-anim{50%{opacity:0}}table.compare{border-collapse:collapse;clear:both;width:100%;margin:1rem 0}table.compare th,table.compare td{text-align:left;vertical-align:top;border:3px ridge #999;padding:.5rem}table.compare th{color:#ff0;background:navy}table.compare tr:nth-child(2n) td{background:#f0f0ff}footer{z-index:1;text-align:center;color:navy;margin-top:1rem;font-size:.85rem;position:relative}footer .badge{background:#e6e6fa;border:4px ridge silver;margin:.25rem;padding:.3rem .7rem;display:inline-block}.hit-counter{color:#0f0;letter-spacing:2px;background:#000;border:3px ridge #444;padding:.2rem .5rem;font-family:Courier New,monospace}.under-construction{color:red;background:#ff0;border:4px ridge gray;padding:.2rem .6rem;font-weight:700;animation:1s step-end infinite blink-anim}