.jp-volume-controls .jp-mute,.jp-controls div{display:flex;flex-direction:column;justify-content:center;align-items:center}body{background-color:#fff;min-width:auto;height:auto}.backplayer{background-color:#fff;padding:30px 0;color:#666;width:calc(100% - 40px);max-width:600px;margin:auto}.backplayer>header{padding:0 0 20px;font-size:1.2rem;line-height:1.4;font-weight:normal;font-family:"Noto Sans SC";text-transform:uppercase}.backplayer>header .logo{display:block;width:100%;max-width:300px;margin:10px auto;padding:15px 0 0;clear:both}.backplayer>header .logo img{width:100%}.backplayer>header span.vivo{display:inline-block;background:#f30024;color:#fff;padding:8px 14px;font-size:.8rem;line-height:1.1;margin:5px 0 0;border-radius:8px;position:relative;left:50%;transform:translateX(-50%)}.backplayer>header .social{float:right}.backplayer>header .social span{display:none}@media screen and (min-width: 640px){.backplayer>header .logo{display:block;width:250px;margin:0;padding:0;clear:none;float:left}.backplayer>header .logo img{width:100%}.backplayer>header span.vivo{left:auto;transform:none;margin:4px 0 0 25px}}.jp-audio{margin:0 auto 40px;box-shadow:0 5px 5px -5px rgba(0,0,0,.3);border:1px solid #d0d0d0;border-radius:5px;overflow:hidden;color:#3a3a3a}.radio-info{padding:10px 15px;text-align:center}.adbox{margin:auto}.m_audio{background:#f5f5f5;padding:0;border-radius:5px;position:relative;clear:both;margin:30px 0}.jp-gui{position:relative;padding:15px;background:#fff}.jp-gui div:focus,.jp-gui div:active{outline:0}.jp-progress{position:absolute;width:100%;height:2px;top:0;left:0}.jp-seek-bar{background:#28aae2;height:100%;width:0;display:none}.jp-seek-bar .jp-play-bar{background:#28aae2;height:100%}.jp-controls{display:grid;grid-template-columns:1fr 1fr;grid-gap:20px}.jp-controls div{font-size:2rem;background-color:#f0f0f0;height:80px}.jp-controls div span{display:inline-block;padding:10px}@media screen and (min-width: 640px){.jp-controls{width:50%;float:left}.jp-controls div{font-size:1rem;height:40px}.jp-controls div span{display:inline-block;padding:10px}}.jp-audio .pause,.jp-state-playing .play{display:none}.jp-state-playing .pause{display:block}.jp-time-holder{display:none}.jp-time-holder span{display:inline-block}.jp-repeat{font-size:22px;float:right;margin-top:-1px}.jp-volume-controls{padding:15px 0 0;margin:0;position:relative;font-size:20px}.jp-volume-controls span{display:inline-block}.jp-volume-controls .jp-mute{font-size:2rem;background-color:#f0f0f0;height:80px}@media screen and (min-width: 640px){.jp-volume-controls{width:40%;float:right;padding:8px 0 0;display:grid;grid-template-columns:30px 1fr 30px;grid-gap:10px}.jp-volume-controls .jp-mute{float:left;display:block;font-size:1rem;background-color:#fff;height:auto}.jp-volume-controls .jp-mute,.jp-volume-controls .jp-volume-max{font-size:1.4rem;text-align:center}.jp-volume-controls .jp-volume-bar{position:relative;width:100%;height:7px;background:#a0a0a0;cursor:pointer;border-radius:5px;overflow:hidden;margin-top:8px}}.jp-volume-bar .jp-volume-bar-value{position:absolute;top:0;left:0;height:100%;background:#f30024}.jp-details{padding:20px 25px 0;font-size:14px;background:#fff;color:#212121;transition:all .2s ease;display:none}.jp-state-looped .jp-details{box-shadow:0 5px 8px -7px rgba(40,170,226,.6) inset}.jp-state-looped .jp-repeat{color:#28aae2}.jp-no-solution{display:none}.jp-state-no-volume .jp-mute .fa-volume-off,.jp-mute .fa-volume-up{display:none}.jp-state-no-volume .jp-mute .fa-volume-up{display:block}.jp-state-no-volume.jp-state-muted .jp-mute .fa-volume-off{display:block}.jp-state-no-volume.jp-state-muted .jp-mute .fa-volume-up{display:none}