:root{--font-family:-apple-system, system-ui, sans-serif;--font-family-monospace:Consolas, Menlo, Monaco, Andale Mono WT, Andale Mono, Lucida Console, Lucida Sans Typewriter, DejaVu Sans Mono, Bitstream Vera Sans Mono, Liberation Mono, Nimbus Mono L, Courier New, Courier, monospace;--background:#e5000f;--player-background:#ffffff}html{box-sizing:border-box}body{background:#402413;animation:color 9s infinite linear;height:100vh;display:flex;flex-direction:column;overflow:hidden;font-family:var(--font-family)}@keyframes color{0%{background:#e5000f}20%{background:#a0000a}40%{background:#440004}60%{background:#8c5b20}80%{background:#ce000d}100%{background:#e5000f}}header{display:flex;flex-wrap:wrap;justify-content:center;padding:1em}main{flex-grow:1}footer{display:flex;justify-content:center;margin-top:2rem;color:var(--player-background);font-weight:bolder;text-align:center}.visually-hidden{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}#groups{--min:30ch;--gap:4rem;display:grid;grid-gap:var(--gap);grid-template-columns:repeat(auto-fit,minmax(min(100%,var(--min)),1fr));place-content:center}.player-container{background-color:var(--player-background);color:var(--background);justify-self:center;width:auto;height:600px;padding:.5em;border-radius:1.5rem;box-shadow:0 15px 30px 5px rgba(0,0,0,.3);transition:background-color .5s ease-in}.img-container{position:relative;text-align:center;margin:0}.img-container img{width:100%;height:100%;object-fit:cover;border-radius:20px}.player-controls{position:relative;top:20px;height:50px;width:100%;display:flex;flex-direction:row;justify-content:space-evenly;align-items:center}.fas,.fa-solid{font-size:30px;color:var(--background);cursor:pointer;user-select:none;transition:color .5s ease-in}.fas.fa-backward,.fas.fa-forward{font-size:33px;transform:scale(1.4,1);margin-top:7px;color:var(--background)}.fas.fa-backward:hover,.fas.fa-forward:hover{filter:brightness(80%)}.main-button{font-size:47px;position:relative;top:3px;color:var(--background)}.volume-controls{position:relative;top:65px;width:100%;height:30px;display:flex;justify-content:space-evenly;margin:0}.fas.fa-volume-down{width:35px;cursor:default}.fas.fa-volume-up{width:35px;cursor:default}input[type=range]{position:relative;-webkit-appearance:none;width:48%;margin:.3rem 0 0;padding:0;height:1rem;float:left;outline:none}input[type=range]::-webkit-slider-runnable-track{width:100%;height:6px;cursor:pointer;background:var(--background)}input[type=range]::-webkit-slider-thumb{position:relative;-webkit-appearance:none;box-sizing:content-box;border:1px solid var(--background);height:15px;width:15px;background-color:var(--background);cursor:pointer;margin:-5px 0 0}input[type=range]:active::-webkit-slider-thumb{transform:scale(1.2);background:var(--background)}input[type=range]::-moz-range-track{width:100%;height:3px;cursor:pointer}input[type=range]::-moz-range-progress{background-color:var(--background)}input[type=range]::-moz-focus-outer{border:0}input[type=range]::-moz-range-thumb{box-sizing:content-box;border:1px solid var(--background);height:15px;width:15px;border-radius:50%;background-color:var(--background);cursor:pointer}input[type=range]:active::-moz-range-thumb{transform:scale(1.2);background:var(--background)}input[type=range]::-ms-track{width:100%;height:3px;cursor:pointer;background:var(--background);border:solid transparent;color:transparent}input[type=range]::-ms-fill-lower{background-color:var(--background)}input[type=range]::-ms-fill-upper{background-color:var(--player-background)}input[type=range]::-ms-thumb{box-sizing:content-box;border:1px solid var(--background);height:15px;width:15px;background-color:#fff;cursor:pointer}input[type=range]:active::-ms-thumb{transform:scale(1.2);background:var(--background)}@media screen and (max-width:376px){.player-container{width:95vw}h2{font-size:20px}h3{font-size:15px}.player-controls{top:10px}}#error svg{animation:rotation 2s infinite linear}@keyframes rotation{from{transform:rotate(0)}to{transform:rotate(360deg)}}