@font-face{font-family:"goodtimes";src:url("./goodtimes.otf") format("opentype");}*{margin:0;padding:0;box-sizing:border-box;}body{width:100%;height:100vh;overflow:hidden;background:url(./pics/bg1.jpg) no-repeat center center/cover;color:aliceblue;}#title{font-family:"Raleway";text-align:center;color:aliceblue;font-size:clamp(1.3rem,2vw,2.1rem);margin:1rem auto;text-shadow:0 0 10px rgba(109,35,143,.5);}a{text-decoration:none;color:aliceblue;cursor:crosshair;font-weight:600;letter-spacing:1.5px;}.music-player-container{position:absolute;font-family:"goodtimes";text-transform:uppercase;bottom:4rem;left:4rem;width:480px;transition:all .5s cubic-bezier(.79,.14,.15,.86);}.music-player-container.hide{width:180px;}.music-player-container.hide .track-info,.music-player-container.hide .track-nav,.music-player-container.hide .sound-bars{transition:all .5s cubic-bezier(.075,.82,.165,1);opacity:0;}.toggle-player{position:absolute;top:-20px;right:-20px;z-index:2;height:40px;width:40px;border-radius:100%;display:flex;justify-content:center;align-items:center;background:rgba(255,255,255,.155);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.155);cursor:crosshair;}.avatar{position:absolute;top:-50px;width:100px;height:120px;z-index:2;}.avatar img{width:100%;height:100%;}.sound-bars{flex:1;width:70px;margin:0 20px;}.player{display:flex;justify-content:center;align-items:center;height:70px;border-radius:5px;background:rgba(255,255,255,.1);box-shadow:0 5px 10px rgba(94,76,102,.164);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);padding:0 1.5rem 0 100px;}.track-info{flex:2;margin-right:1rem;transition:all .25s ease-in-out;}.track-name{font-size:1rem;margin-bottom:.25rem;pointer-events:none;}.track-artist{font-size:.7rem;letter-spacing:4px;opacity:.5;pointer-events:none;}.track-nav{flex:2;display:flex;flex-direction:row;align-items:center;transition:all .25s ease-in-out;}.playpause-track,.prev-track,.next-track{padding:5px 10px;opacity:.8;cursor:pointer;}.playpause-track ion-icon{font-size:1.2rem;}@media screen and (max-width:500px){.music-player-container{bottom:2rem;left:2rem;width:310px}.toggle-player{height:30px;width:30px;right:-10px;top:-20px}.music-player-container.hide{width:120px}.avatar{top:-40px;width:80px;height:90px}.sound-bars{width:20px}.player{height:50px;padding:0 1rem 0 80px}.track-info{margin-right:.5rem}.track-name{font-size:.5rem}.track-artist{font-size:.35rem}.playpause-track,.prev-track,.next-track{padding:5px 5px}}