﻿#ppa{position: relative;width:100%;height:320px;background: linear-gradient(180deg, #CC95C0 0%,#DBD4B4 50%,#7AA1D2 100%);place-items: center;overflow:hidden;margin-top:0px;margin-left: 0px;border-radius: 2px;}
  .aplayer{
background:#fff;font-family:Georgia,antoniolight,HelvLightIBM,Arial,Helvetica,sans-serif;
margin:5px;box-shadow:0 2px 2px 0 rgba(0,0,0,.07),0 1px 5px 0 rgba(0,0,0,.1);
border-radius:2px;
overflow:hidden;

user-select:none;
line-height:normal;position:relative
}
.aplayer *{
box-sizing:content-box
}
.aplayer svg{
width:100%;height:100%
}
.aplayer svg circle,.aplayer svg path{
fill:#fff
}
.aplayer.aplayer-withlist .aplayer-info{
border-bottom:1px solid #e9e9e9
}
.aplayer.aplayer-withlist .aplayer-list{
display:block
}
.aplayer.aplayer-withlist .aplayer-icon-order,.aplayer.aplayer-withlist .aplayer-info .aplayer-controller .aplayer-time .aplayer-icon.aplayer-icon-menu{
display:inline
}
.aplayer.aplayer-withlrc .aplayer-pic{
height:90px;width:90px
}
.aplayer.aplayer-withlrc .aplayer-info{
margin-left:90px;height:90px;padding:10px 7px 0
}
.aplayer.aplayer-withlrc .aplayer-lrc{
display:block
}
.aplayer.aplayer-narrow{
width:66px
}
.aplayer.aplayer-narrow .aplayer-info,.aplayer.aplayer-narrow .aplayer-list{
display:none
}
.aplayer.aplayer-narrow .aplayer-body,.aplayer.aplayer-narrow .aplayer-pic{
height:66px;width:66px
}
.aplayer.aplayer-fixed{
position:fixed;
bottom:0;
left:0;
right:0;
margin:0;
z-index:99;
overflow:visible;
max-width:400px;
box-shadow:none
}
.aplayer.aplayer-fixed .aplayer-list{
margin-bottom:65px;
border:1px solid #eee;
border-bottom:none
}
.aplayer.aplayer-fixed .aplayer-body{
position:fixed;
bottom:0;
left:0;
right:0;
margin:0;
z-index:99;
background:#fff;
padding-right:18px;
transition:all .3s ease;
max-width:400px
}
.aplayer.aplayer-fixed .aplayer-lrc{
display:block;
position:fixed;
bottom:10px;
left:0;right:0;
margin:0;
z-index:98;
pointer-events:none;
text-shadow:-1px -1px 0 #EDF0F6
}
.aplayer.aplayer-fixed .aplayer-lrc:after,.aplayer.aplayer-fixed .aplayer-lrc:before{
display:none
}
.aplayer.aplayer-fixed .aplayer-info{

transform:scaleX(1);

transform-origin:0 0;
transition:all .3s ease;
border-bottom:none;
border-top:1px solid #e9e9e9
}
.aplayer.aplayer-fixed .aplayer-info .aplayer-music{
width:calc(100% - 105px)
}
.aplayer.aplayer-fixed .aplayer-miniswitcher{
display:block
}
.aplayer.aplayer-fixed.aplayer-narrow .aplayer-info{
display:block;
-webkit-transform:scaleX(0);
transform:scaleX(0)
}
.aplayer.aplayer-fixed.aplayer-narrow .aplayer-body{
width:66px!important
}
.aplayer.aplayer-fixed.aplayer-narrow .aplayer-miniswitcher .aplayer-icon{
-webkit-transform:rotateY(0);
transform:rotateY(0)
}
.aplayer.aplayer-fixed .aplayer-icon-back,.aplayer.aplayer-fixed .aplayer-icon-forward,.aplayer.aplayer-fixed .aplayer-icon-lrc,.aplayer.aplayer-fixed .aplayer-icon-play{
display:inline-block
}
.aplayer.aplayer-fixed .aplayer-icon-back,.aplayer.aplayer-fixed .aplayer-icon-forward,.aplayer.aplayer-fixed .aplayer-icon-menu,.aplayer.aplayer-fixed .aplayer-icon-play{
position:absolute;
bottom:27px;
width:20px;height:20px
}
.aplayer.aplayer-fixed .aplayer-icon-back{
right:75px}
.aplayer.aplayer-fixed .aplayer-icon-play{
right:50px
}
.aplayer.aplayer-fixed .aplayer-icon-forward{
right:25px
}
.aplayer.aplayer-fixed .aplayer-icon-menu{
right:0
}
.aplayer.aplayer-arrow .aplayer-icon-loop,.aplayer.aplayer-arrow .aplayer-icon-order,.aplayer.aplayer-mobile .aplayer-icon-volume-down{
display:none
}
.aplayer.aplayer-loading .aplayer-info .aplayer-controller .aplayer-loading-icon{
display:block
}
.aplayer.aplayer-loading .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-played .aplayer-thumb{
-webkit-transform:scale(1);
transform:scale(1)
}
.aplayer .aplayer-body{
position:relative
}
.aplayer .aplayer-icon{
width:15px;
height:15px;
border:none;
background-color:transparent;
outline:none;
cursor:pointer;
opacity:.8;
vertical-align:middle;
padding:0;
font-size:13px;
margin:0;
display:inline-block
}
.aplayer .aplayer-icon path{
transition:all .2s ease-in-out
}
.aplayer .aplayer-icon-back,.aplayer .aplayer-icon-forward,.aplayer .aplayer-icon-lrc,.aplayer .aplayer-icon-order,.aplayer .aplayer-icon-play{
display:none
}
.aplayer .aplayer-icon-lrc-inactivity svg{
opacity:1
}
.aplayer .aplayer-icon-forward{transform:rotate(180deg)}
.aplayer .aplayer-lrc-content{
display:none}
.aplayer .aplayer-pic{
position:relative;
float:left;
height:66px;
width:66px;
background-position:50%;
background-size:cover;
transition:all .3s ease;
cursor:pointer
}
.aplayer .aplayer-pic:hover .aplayer-button{
opacity:1
}
.aplayer .aplayer-pic .aplayer-button{
position:absolute;
border-radius:50%;
opacity:.8;

box-shadow:0 1px 1px rgba(0,0,0,.2);background:rgba(0,0,0,.2);
transition:all .1s ease
}
.aplayer .aplayer-pic .aplayer-button path{
fill:#fff
}
.aplayer .aplayer-pic .aplayer-hide{
display:none
}
.aplayer .aplayer-pic .aplayer-play{
width:26px;
height:26px;
border:2px solid #fff;
bottom:50%;
right:50%;
margin:0 -15px -15px 0
}
.aplayer .aplayer-pic .aplayer-play svg{
position:absolute;
top:3px;
left:4px;
height:20px;
width:20px
}
.aplayer .aplayer-pic .aplayer-pause{
width:16px;
height:16px;
border:2px solid #fff;
bottom:4px;right:4px
}
.aplayer .aplayer-pic .aplayer-pause svg{
position:absolute;
top:2px;
left:2px;
height:12px;
width:12px
}
.aplayer .aplayer-info{
margin-left:66px;
padding:14px 7px 0 10px;
height:66px;
box-sizing:border-box
}
.aplayer .aplayer-info .aplayer-music{
overflow:hidden;
white-space:nowrap;
text-overflow:ellipsis;
margin:0 0 13px 5px;

user-select:text;
cursor:default;
padding-bottom:2px;
height:20px
}
.aplayer .aplayer-info .aplayer-music .aplayer-title{
font-size:15px
}
.aplayer .aplayer-info .aplayer-music .aplayer-author{
font-size:13px;
}
.aplayer .aplayer-info .aplayer-controller{
position:relative;
display:flex
}
.aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap{
margin:0 0 0 5px;
padding:4px 0;
cursor:pointer!important;
flex:1
}
.aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap:hover .aplayer-bar .aplayer-played .aplayer-thumb{

transform:scale(1)
}
.aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar{
position:relative;
height:2px;
width:100%;
background:#add8e6
}
.aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-loaded{
position:absolute;
left:0;
top:0;
bottom:0;
background:#6633CC;
height:2px;
transition:all .5s ease
}
.aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-played{
position:absolute;
left:0;
top:0;
bottom:0;
height:2px
}
.aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-played .aplayer-thumb{
position:absolute;
top:0;
right:5px;
margin-top:-4px;
margin-right:-10px;
height:10px;
width:10px;
border:1px solid #fcc500;

border-radius:50%;
background:rgba(0,0,0,0);
cursor:pointer;
transition:all .3s ease-in-out;

transform:scale(0)
}
.aplayer .aplayer-info .aplayer-controller .aplayer-time{
position:relative;
right:0;
bottom:4px;
height:17px;
color:#4a76c8;
font-size:12px;
padding-left:7px
}
.aplayer .aplayer-info .aplayer-controller .aplayer-time .aplayer-time-inner{
vertical-align:middle
}
.aplayer .aplayer-info .aplayer-controller .aplayer-time .aplayer-icon{
cursor:pointer;
transition:all .2s ease
}
.aplayer .aplayer-info .aplayer-controller .aplayer-time .aplayer-icon path{
fill:#4a76c8
}
.aplayer .aplayer-info .aplayer-controller .aplayer-time .aplayer-icon.aplayer-icon-loop{
margin-right:2px
}
.aplayer .aplayer-info .aplayer-controller .aplayer-time .aplayer-icon:hover path{
fill:#FF9900
}
.aplayer .aplayer-info .aplayer-controller .aplayer-time .aplayer-icon.aplayer-icon-menu,.aplayer .aplayer-info .aplayer-controller .aplayer-time.aplayer-time-narrow .aplayer-icon-menu,.aplayer .aplayer-info .aplayer-controller .aplayer-time.aplayer-time-narrow .aplayer-icon-mode{
display:none
}
.aplayer .aplayer-info .aplayer-controller .aplayer-volume-wrap{
position:relative;
display:inline-block;
margin-left:3px;
cursor:pointer!important
}
.aplayer .aplayer-info .aplayer-controller .aplayer-volume-wrap:hover .aplayer-volume-bar-wrap{
height:40px
}
.aplayer .aplayer-info .aplayer-controller .aplayer-volume-wrap .aplayer-volume-bar-wrap{
position:absolute;
bottom:15px;
right:-3px;
width:25px;
height:0;
z-index:99;
overflow:hidden;
transition:all .2s ease-in-out
}
.aplayer .aplayer-info .aplayer-controller .aplayer-volume-wrap .aplayer-volume-bar-wrap.aplayer-volume-bar-wrap-active{
height:40px
}
.aplayer .aplayer-info .aplayer-controller .aplayer-volume-wrap .aplayer-volume-bar-wrap .aplayer-volume-bar{
position:absolute;
bottom:0;right:10px;
width:5px;
height:35px;
background:#aaa;
border-radius:2.5px;
overflow:hidden
}
.aplayer .aplayer-info .aplayer-controller .aplayer-volume-wrap .aplayer-volume-bar-wrap .aplayer-volume-bar .aplayer-volume{
position:absolute;
bottom:0;
right:0;
width:5px;
transition:all .1s ease
}
.aplayer .aplayer-info .aplayer-controller .aplayer-loading-icon{
display:none
}
.aplayer .aplayer-info .aplayer-controller .aplayer-loading-icon svg{
position:absolute;
-webkit-animation:rotate 1s linear infinite;
animation:rotate 1s linear infinite
}
.aplayer .aplayer-lrc{
display:none;
position:relative;
height:30px;
background:rgba(0,0,0,0);
text-align:center;
overflow:hidden;
margin:-10px 0 7px
}
.aplayer .aplayer-lrc:before{
top:10px;
height:25%;
}
.aplayer .aplayer-lrc:after,.aplayer .aplayer-lrc:before{
position:absolute;
z-index:1;
display:block;
overflow:hidden;
width:100%;
content:" "
}
.aplayer .aplayer-lrc:after{
bottom:0px;
height:30%;


}
.aplayer .aplayer-lrc p{
font-size:25px;
color:#000;font-family:仿宋;
line-height:30px!important;
height:16px!important;
padding:0px!important;
margin:0px!important;
transition:all .5s ease-out;
opacity:0;
overflow:hidden
}
.aplayer .aplayer-lrc p.aplayer-lrc-current{
opacity:1;
overflow:visible;
height:auto!important;
min-height:16px
}
.aplayer .aplayer-lrc.aplayer-lrc-hide{
display:none
}
.aplayer .aplayer-lrc .aplayer-lrc-contents{
width:100%;
transition:all .5s ease-out;

user-select:text;
cursor:default
}
.aplayer .aplayer-list{
overflow:auto;
transition:all .5s ease;
will-change:height;
display:none;
overflow:hidden
}
.aplayer .aplayer-list.aplayer-list-hide{
max-height:0!important
}
.aplayer .aplayer-list ol{
list-style-type:none;
margin:0;
padding:0;
overflow-y:auto
}
.aplayer .aplayer-list ol::-webkit-scrollbar{
width:5px
}
.aplayer .aplayer-list ol::-webkit-scrollbar-thumb{
border-radius:2px;
background-color:#CFD8DC
}
.aplayer .aplayer-list ol::-webkit-scrollbar-thumb:hover{
background-color:#78909C
}
.aplayer .aplayer-list ol li{
position:relative;
height:32px;
line-height:32px;
padding:0 15px;
font-size:13px;
border-top:1px solid #ddd;
cursor:pointer;
transition:all .2s ease;
overflow:hidden;
margin:0
}
.aplayer .aplayer-list ol li:first-child{
border-top:none
}
.aplayer .aplayer-list ol li:hover{
background:#F0F3F4 
}
.aplayer .aplayer-list ol li.aplayer-list-light{
background:#ECF0F1
}
.aplayer .aplayer-list ol li.aplayer-list-light .aplayer-list-cur{
display:inline-block
}
.aplayer .aplayer-list ol li .aplayer-list-cur{
display:none;
width:3px;
height:22px;
position:absolute;
left:0;
top:5px;
cursor:pointer
}
.aplayer .aplayer-list ol li .aplayer-list-index{
color:#669999;
margin-right:12px;
cursor:pointer
}
.aplayer .aplayer-list ol li .aplayer-list-author{
color:#669999;
float:right;
cursor:pointer
}
.aplayer .aplayer-notice{
opacity:0;
position:absolute;
top:50%;
left:50%;

transform:translate(-50%,-50%);
font-size:16px;

padding:5px 10px;
transition:all .3s ease-in-out;
overflow:hidden;
color:#fff;
pointer-events:none;


}
.aplayer .aplayer-miniswitcher{
display:none;
position:absolute;
top:0;
right:0;
bottom:0;
height:100%;
background:#e6e6e6;
width:18px;
border-radius:0 2px 2px 0
}
.aplayer .aplayer-miniswitcher .aplayer-icon{
height:100%;
width:100%;

transform:rotateY(180deg);
transition:all .3s ease
}
.aplayer .aplayer-miniswitcher .aplayer-icon path{
fill:#669999
}
.aplayer .aplayer-miniswitcher .aplayer-icon:hover path{
fill:#000
}
.aplayer-author {
    color: #000;
 font-size:16px!important;
line-height: 25px;
    display: inline;
    *display: inline;
    *zoom: 1;
    margin-bottom: 3px;
}        

.aplayer-title {
    color: #000;
 line-height: 25px;
    display: inline;
    *display: inline;
    *zoom: 1;
    margin-bottom: 3px;
}  
#container{
    width: 0; /*设置为0 隐藏自定义菜单*/
    height: 125px;
    overflow: hidden; /*隐藏溢出的元素*/
}

//@media screen and (max-width: 650px) {
    .aplayer {
        opacity:0.8;
        width:98%;
    }
}
.aplayer-list-title{
color:#669999;
}
.aplayer{background-color:rgba(0,0,0,0) !important;}
.aplayer .aplayer-pic img {
	height:100%!important;
	width:100%!important;
}
@media screen and (max-width:650px) {
    .aplayer {
        opacity:1;
        width:100%;        
    }
}
@media (min-width:650px) {
    .aplayer {
        opacity:1;
        width:100%;        
    }
}
.aplayer-title {
    color: #000;
 line-height: 25px;
    display: inline;
    *display: inline;
    *zoom: 1;
    margin-bottom: 3px;
}  