body *{font-family:Roboto,sans-serif}#player01{grid-area:A;padding:50px 38px}#player01 .wrapper{width:190px}#player01 img{width:190px;height:190px;object-fit:cover;border-radius:10px}#player01 .info{padding-top:28px}#player02{grid-area:B;height:-moz-fit-content;height:fit-content}#player02 .controls{display:flex;justify-content:space-around}#player03 .controls{display:flex}.player{background:linear-gradient(22deg,rgb(33,150,243) 0%,rgb(86,185,208) 100%);padding:28px;border-radius:20px}.player img{width:84px;height:84px;object-fit:cover;border-radius:10px}.info{color:#fff}.info p{opacity:.68;font-size:19px}.info-wrapper{display:flex;align-items:center;gap:30px}.player h1{font-size:27px;color:#fff;padding-bottom:7px}.controls{display:flex;justify-content:space-between;padding-top:20px}.track{padding-top:28px;position:relative}.track:before{content:"";height:6px;width:100%;display:block;background:#D9D9D9;opacity:.3;border-radius:10px;position:absolute}.track:after{content:"";height:6px;width:85%;display:block;background:#D9D9D9;border-radius:10px}.time{opacity:.7;font-size:14px;color:#dcdcdc;display:flex;justify-content:space-between;padding-top:9.6px}