.playr{width:100%;background-color:#d2d9e5;padding:10px;color:#5f6672;border-radius:5px}.playr-ui{display:flex;align-items:stretch}.playr-controls{display:flex;align-items:center;justify-content:center}.playr-controls.left{margin-right:15px}.playr-controls.right{margin-left:15px}.playr-panel{display:flex;align-items:center;justify-content:center;position:relative;flex:1 1 auto}.playr-ui.volume-controls .playr-panel{width:70%}.playr-controls button{color:#da0000;background-color:transparent;border:none;padding:0;cursor:pointer;font-size:26px;line-height:1}.playr-controls button:focus,.playr-controls button:hover{color:#da0000;outline:0}.playr-controls button::after{font-family:FontAwesome;display:flex;align-items:center;justify-content:center}.playr-play::after{content:"\f04b"}.playr.playing .playr-play::after{content:"\f04c"}.playr-fastforward::after{content:"\f050"}.playr-rewind::after{content:"\f049"}.playr-fastforward::after,.playr-rewind::after{font-size:21px}.playr-progress{background-color:#5f6672;height:4px;cursor:pointer;flex:1 1 auto;transition:.3s}.playr-progress-bar{background-color:#da0000;height:100%;transform:scale3d(0,1,1);transform-origin:0 0 0;width:100%}.playr-panel:hover .playr-progress{-webkit-transform:scaleY(1.5);-moz-transform:scaleY(1.5);-ms-transform:scaleY(1.5);-o-transform:scaleY(1.5);transform:scaleY(1.5)}.playr-progress~.playr-duration{margin-left:15px}.playr-duration,.playr-filename{font-size:12px;font-weight:600}.playr-filename{left:15px;overflow:hidden;text-align:left;text-overflow:ellipsis;white-space:nowrap}.playr-duration{text-align:right;margin-left:auto}.playr-volume{position:relative;width:100%;display:flex;align-items:center;justify-content:center}.playr-volume-box.hidden{background-color:#da0000;bottom:0;height:100px;position:absolute;width:35px;display:none}.playr-volume-box{background-color:#5f6672;height:4px;width:100%;cursor:pointer}.playr-volume-box span{display:block;background-color:#d2d9e5;height:100%;width:100%;transform:scale3d(1,1,1);transform-origin:0 0 0}.playr.compact .playr-fastforward,.playr.compact .playr-rewind{display:none}.playr-filename.overflow span{animation:5s linear infinite forwards scroll;display:inline-block;margin-right:0;padding-right:100%;transform:translate3d(0,0,0)}.playr-playlist{position:relative;z-index:2}.playr-playlist-box{border:1px solid #5f6672;border-radius:3px}.playr-playlist-box:active,.playr-playlist-box:focus{background-color:rgba(255,255,255,.2)}.playr-playlist-box .playr-playlist-label{padding:3px;display:block;cursor:pointer}.playr-playlist-dropdown-box{position:absolute;top:100%;right:-1px;min-width:100%;border:1px solid #5f6672;border-radius:3px;display:flex;flex-direction:column;background-color:#d2d9e5;visibility:hidden;opacity:0;transition:.3s;z-index:2}.playr-playlist-dropdown-box .dropdown-item{padding:5px 10px;cursor:pointer;color:#5f6672}.playr-playlist-dropdown-box .dropdown-item:hover{background-color:rgba(255,255,255,.2)}.playr-playlist-dropdown-box .dropdown-item.active{background-color:#da0000;color:#fff}.playr-playlist-dropdown-box.show{visibility:visible;opacity:1}@media only screen and (max-width:768px){.playr-duration{display:none}}@keyframes scroll{0%{transform:translate3d(0,0,0)}100%{transform:translate3d(-100%,0,0)}}