@import"https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap";*{margin:0;padding:0;box-sizing:border-box}body{background-color:#000;background-repeat:no-repeat;background-position:center}*{font-family:Poppins,sans-serif}.main-container{display:flex;place-self:center;flex-direction:column;gap:20px;align-items:center;width:45%;margin-top:100px;padding:20px;border-radius:12px;background-color:#ffffff1a;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);color:#fff;font-weight:600;box-shadow:0 0 20px #1a1a1a1a,0 0 40px #1a1a1a1a,0 0 80px #1a1a1a1a}.main-container img{border-radius:50%;width:200px}.music-controls{display:flex;flex-direction:row;gap:20px}.music-controls img{width:35px;filter:grayscale(100%)}.duration{display:flex;flex-direction:row;width:85%;justify-content:space-between}.progress-bar{height:7px;width:85%}.backgroundVideo{position:absolute;right:0;top:0;width:100%;object-fit:cover;height:100vh;z-index:-1;filter:opacity(.8)}.music-head{font-size:.9rem;color:#dcdcdc}.artist-name{font-family:Courier New,Courier,monospace}@media screen and (max-width: 768px){.main-container{width:88%}.main-container img{width:180px}.music-controls img{width:30px}.progress-bar{width:100%}.music-head,.artist-name{font-size:.8rem}}.volume-controls img{width:20px}.volume-controls{display:flex;flex-direction:row;gap:10px}.change-video{background-color:#57575732;padding:8px;width:max-content;margin-top:10px;place-self:center;border-radius:12px;color:#fff}.footer{color:#fd3232;position:absolute;bottom:0;left:30%;place-self:center}