*{box-sizing:border-box;font-family:Fira Sans,sans-serif;margin:0;padding:0}body{background-color:#111}.App{align-items:center}.App,.c-player{display:flex;flex-direction:column}.c-player{background-color:#313131;border-radius:16px;box-shadow:inset -6px -6px 12px rgba(0,0,0,.8),inset 6px 6px 12px hsla(0,0%,100%,.4);height:650px;justify-content:center;padding:50px;width:300px}.c-player>h4{color:#fff;font-weight:500;text-transform:uppercase}.c-player>h4,.c-player>p{font-size:14px;text-align:center}.c-player>p{color:#aaa;font-weight:600}.c-player>p span{font-weight:400}.c-player--details .details-img{margin:0 auto;position:relative;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.c-player--details .details-img img{border-radius:50%;box-shadow:6px 6px 12px rgba(0,0,0,.8),-6px -6px 12px hsla(0,0%,100%,.4);display:block;margin:30px auto;max-width:300px;width:100%}.c-player--details .details-img:after{border:3px dashed #ffce00;border-radius:50%;bottom:-25px;content:"";display:block;left:-25px;position:absolute;right:-25px;top:-25px}.details-artist{transition:text-shadow 300s}.c-player--details .details-title{color:#eee;font-size:28px;min-height:64px}.c-player--details .details-artist,.c-player--details .details-title{text-align:center;text-shadow:2px 2px 4px rgba(0,0,0,.8),-2px -2px 4px hsla(0,0%,100%,.4)}.c-player--details .details-artist{color:#aaa;font-size:20px}.c-player--controls{align-items:center;display:flex;justify-content:center}.c-player--controls .play-btn{background-color:#ffce00;border:none;border-radius:50%;box-shadow:4px 4px 10px rgba(0,0,0,.8),-4px -4px 10px hsla(0,0%,100%,.4),inset -4px -4px 10px rgba(0,0,0,.4),inset 4px 4px 10px hsla(0,0%,100%,.4);color:#fff;cursor:pointer;display:flex;font-size:24px;outline:none;padding:20px}.c-player--controls .skip-btn{background:none;border:none;color:#888;cursor:pointer;font-size:18px;outline:none}.rotateImage{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.btn{-webkit-transform:scale(.5);transform:scale(.5)}.playing-now{letter-spacing:.5px;top:-15px}.left-img,.playing-now,.right-img{position:relative}.left-img{right:-115px}.right-img{right:115px}.next-up{letter-spacing:.5px;position:relative;top:-30px}.glow{-webkit-animation:glow 1s ease-in-out infinite alternate;animation:glow 1s ease-in-out infinite alternate}@-webkit-keyframes glow{0%{text-shadow:0 0 5px #fff,0 0 10px #fff,0 0 15px #c6e41a,0 0 20px #c6e41a,0 0 25px #c6e41a,0 0 30px #c6e41a,0 0 350px #c6e41a}to{text-shadow:0 0 10px #fff,0 0 30px #e9d30b,0 0 40px #e9d30b,0 0 50px #e9d30b,0 0 60px #e9d30b,0 0 70px #e9d30b,0 0 80px #e9d30b}}@keyframes glow{0%{text-shadow:0 0 5px #fff,0 0 10px #fff,0 0 15px #c6e41a,0 0 20px #c6e41a,0 0 25px #c6e41a,0 0 30px #c6e41a,0 0 350px #c6e41a}to{text-shadow:0 0 10px #fff,0 0 30px #e9d30b,0 0 40px #e9d30b,0 0 50px #e9d30b,0 0 60px #e9d30b,0 0 70px #e9d30b,0 0 80px #e9d30b}}.slider_container{align-items:center;display:flex;justify-content:center;max-width:400px}.seek_slider,.volume_slider{-webkit-appearance:none;appearance:none;background:#000;height:5px;opacity:.7;transition:opacity .2s}.seek_slider::-webkit-slider-thumb,.volume_slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:#fff;border-radius:50%;cursor:pointer;height:15px;width:15px}.seek_slider:hover,.volume_slider:hover{opacity:1}.seek_slider{width:60%}.volume_slider{width:30%}.current-time,.total-duration{padding:10px}
/*# sourceMappingURL=main.57a475c1.css.map*/