@charset "utf-8";
/*初始化*/
body,h1,h2,h3,h4,h5,h6,dl,dt,li,dd,th,td,p,pre,form,input,button,textarea,hr{margin:0;padding:0;}h1,h2,h3,h4,h5,h6{font-size:100%;}img{border:0;}button,input,select,textarea{font-size:100%;}ul,ol{ padding-left:40px;}
.clear{ clear:both; }
.list-none{ list-style:none; padding:0px; margin:0px;}
.editor{ line-height:2; color:#333;}
.editor ul,.editor ol{ padding:0px 0px 0px 25px; margin:0px;}
.editor a{ color:#1C57C4; text-decoration:underline;}
.editor .metvideobox{ text-align:center; margin:10px auto; }
.editor .video-js{ max-width:100%; }
.editor img{max-width:100%;margin: 0 auto;display: block;}
.editor blockquote{padding-top:5px;padding-bottom:5px;padding-left:15px;border-left:4px solid #ddd}
.editor hr{display:block;padding:0;border:0;height:0;border-top:1px solid #ddd;margin:20px 0;-webkit-box-sizing:content-box;box-sizing:content-box}
.editor table{width:100%!important;margin-bottom:1.6rem;border-spacing:0!important;border-collapse:collapse!important;padding:0!important;border:0}
.editor table td{border:1px solid #ddd!important}
.editor table>thead>tr>th,table>tbody>tr>th,table>tfoot>tr>th,table>thead>tr>td,table>tbody>tr>td,table>tfoot>tr>td{line-height:1.6;vertical-align:top;border-top:1px solid #ddd}
.editor table>thead>tr>th{vertical-align:bottom;border-bottom:1px solid #ddd}
/*按钮*/
.button{ display: inline-block; zoom: 1; *display: inline; vertical-align: baseline; margin: 0 2px; outline: none; cursor: pointer; text-align: center; text-decoration: none; font: 14px/100% Arial, Helvetica, sans-serif; padding: .5em 2em .55em; text-shadow: 0 1px 1px rgba(0,0,0,.3); -webkit-border-radius: .5em; -moz-border-radius: .5em; border-radius: .5em; -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2); -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2); box-shadow: 0 1px 2px rgba(0,0,0,.2);}
.button:hover { text-decoration: none; color:#fff; }
.button:active { position: relative; top: 1px;}
.orange{ color: #fef4e9; border: solid 1px #da7c0c; background: #f78d1d; background: -webkit-gradient(linear, left top, left bottom, from(#faa51a), to(#f47a20)); background: -moz-linear-gradient(top,  #faa51a,  #f47a20); filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#faa51a', endColorstr='#f47a20'); }
.orange:hover { background: #f47c20; background: -webkit-gradient(linear, left top, left bottom, from(#f88e11), to(#f06015)); background: -moz-linear-gradient(top,  #f88e11,  #f06015); filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f88e11', endColorstr='#f06015'); }
.orange:active { color: #fcd3a5; background: -webkit-gradient(linear, left top, left bottom, from(#f47a20), to(#faa51a)); background: -moz-linear-gradient(top,  #f47a20,  #faa51a); filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f47a20', endColorstr='#faa51a');}
input.input-text,input.input-file,input.code,textarea { padding: 4px; font-size: 15px; outline: none; text-shadow: 0px 1px 0px #fff; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; border: 1px solid #ccc; -webkit-transition: .3s ease-in-out; -moz-transition: .3s ease-in-out; -o-transition: .3s ease-in-out; background:#fff url(../images/dt-10.gif) repeat-x left top; }
input.input-text:focus,input.input-file:focus,input.code:focus,textarea:focus { border: 1px solid #fafafa; -webkit-box-shadow: 0px 0px 6px #007eff; -moz-box-shadow: 0px 0px 5px #007eff; box-shadow: 0px 0px 5px #007eff;}
/*表单*/
td.text{ width:20%; padding:6px 5px 6px 0px; text-align:right; font-size:14px; font-weight:bold;}
td.input{ padding:6px 8px;}
td.input input{ margin-right:8px;}
td.input .info{ padding-left:15px; color:#f00;}
td.input img{ position:relative; bottom:1px;}
td.submint{ padding:10px;}
/*工具栏*/
.met_hits{ padding:0px 5px; height:35px; line-height:35px; margin-top:10px; border-top:1px dotted #ccc; text-align:right; position:relative; color:#666;}
.met_hits a{ color:#666;}
.met_hits .metjiathis{ position:absolute; left:5px; top:8px;}
.met_page{ text-align:center;}
.met_page a{ margin-right:50px; color:#1C57C4; text-decoration:underline;}
/*翻页*/
#flip{ margin-bottom:15px;}
/*附件*/
.met_annex{ color:#f00; text-decoration:underline;}
.met_annex:hover{ color:#f00; text-decoration:underline}
/*简介模块*/
#showtext{ padding:15px; line-height:2;}
/*文章模块*/
#newslist{ padding:15px 20px;}
#newslist li{ padding:6px 10px; background:url(../images/dt-0.gif) no-repeat left 19px;}
#newslist li a{ font-size:14px; margin-right:5px;}
#newslist li span{ float:right; color:#aaa;}
#newslist li p{ color:#aaa;}
#shownews{ padding:0px 15px 15px;}
#shownews .editor{ line-height:2; padding:0px 10px; font-size:14px;}
#shownews h1{ font-size:20px; text-align:center; border-bottom:1px dotted #ccc; padding:5px 0px; margin:10px 0px; color:#333;}
/*产品模块*/
#productlist{ padding:15px 10px;}
#productlist li{ float:left; display:inline; text-align:center;margin:0 17px!important;}
#productlist li a.img{ display:block; text-align:center; font-size:0px;}
#productlist li a.img img{ margin:auto; border:1px solid #ccc;}
#productlist li h3{ padding:5px 0px 10px; font-weight:normal; line-height:1.5;}
#showproduct{ padding:15px;}
#showproduct h1.title{ font-size:18px; padding:5px 0px; margin-bottom:5px;}
#showproduct .pshow dt{ float:left;}
#showproduct .pshow dd{ float:right;}
#showproduct .pshow dd ul{ margin-left:15px; }
#showproduct .pshow dd li{ padding:5px 5px 5px 45px; min-height:28px; _height:28px; margin:5px 0px; clear:both; border-bottom:1px solid #eee; position:relative; line-height:2; }
#showproduct .pshow dd li span{ position:absolute; left:0px; top:0px; color:#999; padding:5px; height:28px;}
#showproduct .ctitle{ margin:15px 0px 10px; padding:5px 20px; background:url(../images/dt-7.gif) no-repeat left center; *background-position:left 17px; font-size:14px; border-bottom:1px dotted #ccc; }
#showproduct .editor{ line-height:2; padding:0px 10px; font-size:14px;}
/*下载模块*/
#downloadlist{ padding:15px;}
#downloadlist .metlist{ margin-bottom:20px;}
#downloadlist dl.top dt a{ color:#f00;}
#downloadlist .metlist dt{ border-bottom:1px solid #ddd; font-size:14px; font-weight:bold; padding:3px 5px 3px 20px; background:url(../images/dt-9.gif) no-repeat 5px 11px;}
#downloadlist .metlist dd{ color:#999; padding:5px 8px; background:#f8f8f8;}
#downloadlist .metlist dd b{ font-weight:normal;}
#downloadlist .metlist dd div{ float:right;}
#downloadlist .metlist dd span{ padding-right:20px;}
#downloadlist .metlist dd a{ color:#1C57C4; text-decoration:underline;}
#downloadlist .metlist dd a.down{ color:#fa1a1a; text-decoration:underline;}
#showdownload{ padding:15px;}
#showdownload h1.title{ font-size:18px; padding:5px 0px; margin-bottom:5px;}
#showdownload .paralist{ background:#f6f6f6; padding:5px 10px;}
#showdownload .paralist li{ padding:3px 5px 3px 0px; margin:5px 0px; border-bottom:1px solid #eee;}
#showdownload .paralist li a{ color:#f00; text-decoration:underline;}
#showdownload .paralist li span{ float:left; padding:0px 10px; margin-right:5px; text-align:left; }
#showdownload .editor{ line-height:2; padding:0px 10px; font-size:14px;}
#showdownload .ctitle{ margin:15px 0px 10px; padding:5px 20px; background:url(../images/dt-7.gif) no-repeat left center; *background-position:left 17px; font-size:14px; border-bottom:1px dotted #ccc; }
/*图片模块*/
#imglist{ padding:15px 10px;}
#imglist li{ float:left; display:inline; text-align:center;margin-bottom:10px;}
#imglist li a.img{ font-size:0px; display:block;}
#imglist li a.img img{ margin:auto;  border:1px solid #ccc; }
#imglist li h3{ padding:5px 0px 10px; line-height:1.5;font-size:16px;}
#showimg{ padding:15px;}
#showimg h1.title{ font-size:18px; padding:5px 0px; margin-bottom:10px; text-align:center;}
#showimg .imgshow{ text-align:center;}
#showimg .editor{ line-height:2; padding:0px 10px; font-size:14px;}
.imgparalist li{ padding:3px 15px 3px; background:url(../images/dt-0.gif) no-repeat 5px center;}
.imgparalist li span{ float:left; margin-right:10px; color:#999;}
#showimg .ctitle{ margin:10px 0px 10px; padding:5px 20px; background:url(../images/dt-7.gif) no-repeat left center; *background-position:left 17px; font-size:14px; border-bottom:1px dotted #ccc; }
/*招聘模块*/
#joblist{ padding:15px;}
#joblist dl{ padding:0px 5px 15px; margin-bottom:15px;}
#joblist dt{ padding:5px 10px; font-size:16px; font-weight:bold; border-bottom:1px dotted #ccc;}
#joblist dd{ padding:0px 0px 5px;}
#joblist dd .dtail{ padding:5px 10px; border-top:1px dotted #ccc;}
#joblist dd .dtail span{ margin-right:20px;}
#joblist dd .dtail a{ color:#1C57C4;}
#joblist dd .editor{padding:5px;}
#joblist dd .mis{ padding:5px 10px;}
#joblist dd .mis span{ margin-right:15px; color:#999;}
#showjob{ padding:15px;}
#showjob h1.title{ font-size:18px; padding:5px 0px; margin-bottom:5px;}
#showjob .paralist li{ float:left; width:45%; padding:3px 15px 3px; background:url(../images/dt-0.gif) no-repeat 5px center;}
#showjob .paralist li span{ float:left; margin-right:10px; color:#999;}
#showjob .ctitle{ margin:10px 0px 10px; padding:5px 20px; background:url(../images/dt-7.gif) no-repeat left center; *background-position:left 17px; font-size:14px; border-bottom:1px dotted #ccc; }
#showjob .info_cv{ font-size:12px; text-align:center; margin:10px 0px; }	
#showjob .editor{ line-height:2; padding:0px 10px; font-size:14px; }	
#cvlist{ padding:15px;}
/*在线留言*/
#messagelist{ padding:15px;}
#messagelist .metlist{ margin-bottom:10px; border:6px solid #dedede; padding:5px;}
#messagelist .metlist dt{ background:url(../images/message.gif) no-repeat left center; border-bottom:1px dotted #dedede; padding:4px 0px 4px 20px; margin-bottom:5px;}
#messagelist .metlist dt span.name{ color:#2c7199;}
#messagelist .metlist dt span.time{ padding-left:8px; color:#999;}
#messagelist .metlist dt span.tt{ float:right; padding-right:5px;}
#messagelist .metlist dd.info span.tt{ display:none; clear:both;}
#messagelist .metlist dd.info span.text{ display:block; line-height:1.5; padding:8px 5px;}
#messagelist .metlist dd.reinfo span.tt{ background:url(../images/admin.gif) no-repeat left 3px; display:block; border-bottom:1px dotted #dedede; padding:2px 0px 2px 20px; margin:0px 0px 5px;color:#2c7199;}
#messagelist .metlist dd.reinfo span.text{ display:block; line-height:1.5; padding:8px 5px;}
#messagelist .ctitle{ margin:10px 0px 10px; padding:5px 20px; background:url(../images/dt-7.gif) no-repeat left center; *background-position:left 17px; font-size:14px; border-bottom:1px dotted #ccc;}
#messagelist table{ margin:0px auto;}
#messagetable{ padding:15px;}
#messagetable table{ margin:0px auto;}
/*在线反馈*/
#feedback{ padding:15px;}
#feedback table{ margin:0px auto;}
/*友情链接*/
#linklist{ padding:15px 15px 25px;}
#linklist .ctitle{ margin:10px 0px 10px; padding:5px 20px; background:url(../images/dt-7.gif) no-repeat left center; *background-position:left 17px; font-size:14px; border-bottom:1px dotted #ccc;}
#linklist .inside{ padding:15px 0px 0px;}
#linklist .metlist .img li{ list-style:none; display:inline; padding-right:5px;}
#linklist .metlist .img img{ width:88px; height:31px;}
#linklist .metlist .txt li{ list-style:none; float:left; width:88px; height:20px; line-height:20px; margin-right:5px; overflow:hidden;}
#linksubmit{ padding:15px;}
#linksubmit table{ margin:0px auto;}
#memberbox{ padding:15px;}
/*站内搜索*/
ul.searchnavlist{ list-style:none; padding:0px; margin:0px;}
ul.searchnavlist li{ padding:5px 0px;}
#searchlist{ padding:15px;}
#searchlist li{ padding-left:10px; margin-bottom:6px; line-height:1.5;}
#searchlist ul{ list-style:none; padding:0px; margin:0px;}
#searchlist ul li{ padding:3px 5px; margin-bottom:5px;}
#searchlist ul li img{ display:none;}
#searchlist .search_title{ display:block; padding:2px 0px;}
#searchlist .search_title a{ font-size:14px; color:#12C; text-decoration:underline;}
#searchlist .search_title em{ color:#c00; text-decoration:underline; font-style:normal;}
#searchlist .search_detail{ display:block; }
#searchlist .search_detail a{ text-decoration:underline; color:#12C;}
#searchlist .search_content em{ color:#c00; font-style:normal;}
#searchlist .search_updatetime{ display:block; margin-top:5px; color:green;}
#searchlist a:hover{ text-decoration:underline;}
/*网站地图*/
#sitemaplist{ padding:15px;}
#sitemaplist .sitemapclass{ padding:5px 0px;}
#sitemaplist .sitemapclass1{ display:block; height:28px; line-height:28px; margin-bottom:5px; border-bottom:1px solid #ddd;}
#sitemaplist .sitemapclass1 a{ padding:5px 10px; background:#eee;}
#sitemaplist .sitemapclass2{ padding-left:15px; padding-top:3px;}
#sitemaplist .sitemapclass2 h3{  background:url(../images/dt-0.gif) no-repeat left center; padding:2px 8px;}
#sitemaplist .sitemapclass2 h3 a{ color:#444;}
#sitemaplist .sitemapclass2 div{ padding-left:2px;}
#sitemaplist .sitemapclass2 h4{ display:inline; padding:2px 6px;}
#sitemaplist .sitemapclass2 h4 a{ text-decoration:underline; color:#2c7199;}
/*翻页样式*/
.metpager_1{ text-align:center;}
.metpager_2{ text-align:center;}
.metpager_3{ text-align:center;}

.digg4{ padding:3px; margin:3px; text-align:center; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; }
.digg4 a,.digg4 span.miy{ margin:2px; text-decoration:none;}
.digg4 .disabledfy{ font-family: Tahoma, Verdana;}

.metpager_4 a,.metpager_4 span.miy{ border:1px solid #aaaadd; padding:2px 5px 2px 5px; color:#009;}
.metpager_4 a:hover { border:1px solid #009; color:#000;}
.metpager_4 a:active {border:1px solid #009; color:#000;}
.metpager_4 span.current { border:1px solid #009; background-color:#009; padding:2px 5px 2px 5px; margin:2px; color:#FFFFFF; text-decoration:none;}
.metpager_4 span.disabled { border:1px solid #eee; padding:2px 5px 2px 5px; margin:2px; color:#ddd;}

.metpager_5 a,.metpager_5 span.miy{ border:1px solid #ccdbe4; padding:2px 8px 2px 8px; color:#0061de; }
.metpager_5 a:hover { border:1px solid #2b55af; color:#fff; background-color:#3666d4;}
.metpager_5 a:active {border:1px solid #009; color:#000;}
.metpager_5 span.current { padding:2px 8px 2px 8px; margin:2px; color:#000; text-decoration:none;}
.metpager_5 span.disabled { border:1px solid #ccdbe4; padding:2px 8px 2px 8px; margin:2px; color:#ddd;}

.metpager_6{ color:#ff6500; }
.metpager_6 a,.metpager_6 span.miy{ border:1px solid  #ff9600; padding:2px 7px 2px 7px; background-position:50% bottom; color:#ff6500; background-image:url(../images/page6.jpg);}
.metpager_6 a:hover { border:1px solid #ff9600; color:#ff6500; background-color:#ffc794;}
.metpager_6 a:active {border:1px solid #ff9600; color:#ff6500; background-color:#ffc794;}
.metpager_6 span.current {border:1px solid #ff6500; padding:2px 7px 2px 7px; margin:2px; color:#ff6500; background-color:#ffbe94; text-decoration:none;}
.metpager_6 span.disabled { border:1px solid #ffe3c6; padding:2px 7px 2px 7px; margin:2px; color:#ffe3c6;}

.metpager_7 a,.metpager_7 span.miy{ border:1px solid  #2c2c2c; padding:2px 5px 2px 5px; background:url(../images/page7.gif) #2c2c2c; color:#fff;}
.metpager_7 a:hover { border:1px solid #aad83e; color:#fff;background:url(../images/page7_2.gif) #aad83e;}
.metpager_7 a:active { border:1px solid #aad83e; color:#fff;background:urlurl(../images/page7_2.gif) #aad83e;}
.metpager_7 span.current {border:1px solid #aad83e; padding:2px 5px 2px 5px; margin:2px; color:#fff;background:url(../images/page7_2.gif) #aad83e; text-decoration:none;}
.metpager_7 span.disabled { border:1px solid #f3f3f3; padding:2px 5px 2px 5px; margin:2px; color:#ccc;}

.metpager_8 a,.metpager_8 span.miy{ border:1px solid #ddd; padding:2px 5px 2px 5px; color:#aaa;}
.metpager_8 a:hover { border:1px solid #a0a0a0; }
.metpager_8 a:hover { border:1px solid #a0a0a0; }
.metpager_8 span.current {border:1px solid #e0e0e0; padding:2px 5px 2px 5px; margin:2px; color:#aaa; background-color:#f0f0f0; text-decoration:none;}
.metpager_8 span.disabled { border:1px solid #f3f3f3; padding:2px 5px 2px 5px; margin:2px; color:#ccc;}

.metpager_9 a,.metpager_9 span.miy{ border:1px solid #ddd; padding:2px 5px 2px 5px; color:#88af3f; } 
.metpager_9 a:hover { border:1px solid #85bd1e; color:#638425; background-color:#f1ffd6; } 
.metpager_9 a:hover { border:1px solid #85bd1e; color:#638425; background-color:#f1ffd6; } 
.metpager_9 span.current {border:1px solid #b2e05d; padding:2px 5px 2px 5px; margin:2px; color:#fff; background-color:#b2e05d; text-decoration:none;} 
.metpager_9 span.disabled { border:1px solid #f3f3f3; padding:2px 5px 2px 5px; margin:2px; color:#ccc;} 


.f-cb{height: 0;}
.f-cb:after{display:block;content:" ";height:0;visibility:hidden;clear: both;}
.f-ib{display:inline-block;}
.f-din{display:inline;}
.f-dn{display:none;}
.f-db{display:block;}
.f-fl{float:left;}
.f-fr{float:right;}
.f-fwn{font-weight:normal;}
.f-fwb{font-weight:bold;}
.f-tal{text-align:left;}
.f-tac{text-align:center;}
.f-tar{text-align:right;}
.f-oh{overflow: hidden;zoom: 1;clear: both;}
.f-tdn{text-decoration: none!important;}
.f-vam,.f-vama *{vertical-align:middle;}
.f-wsn{word-wrap:normal;white-space:nowrap;}
.f-pre{overflow:hidden;text-align:left;white-space:pre-wrap;word-wrap:break-word;word-break:break-all;}
.f-wwb{white-space:normal;word-wrap:break-word;word-break:break-all;}
.f-ti{overflow:hidden;text-indent:-30000px;}
.f-lhn{line-height:normal;}
.f-toe{overflow:hidden;word-wrap:normal!important;white-space:nowrap;text-overflow:ellipsis;}
.f-usn{-webkit-user-select:none;user-select:none;}
.f-bsb{-webkit-box-sizing:border-box;box-sizing:border-box;}
.f-cp{cursor: pointer}

/*滚动条美化*/
::-webkit-scrollbar{width:6px;height:6px}
::-webkit-scrollbar-button:vertical{display:none}
::-webkit-scrollbar-track:vertical{background-color:transparent;}
::-webkit-scrollbar-track-piece{background-color:transparent;}
::-webkit-scrollbar-thumb:vertical{background-color:#3792ef;border-radius:6px}
::-webkit-scrollbar-thumb:vertical:hover,
::-webkit-scrollbar-thumb:vertical:active {background-color: #2e86ef}



/*SMusic*/
.grid-music-container{
    width: 650px;
    
    padding: 20px 0;
    position: relative;
    background-color: rgba(255,255,255,.7);
    font-family: "Microsoft Yahei","微软雅黑","Helvetica Neue","Hiragino Sans GB",Helvetica,Tahoma,sans-serif;
    text-shadow: 1px 0 0 rgba(255,255,255,.7);
}

.grid-music-container .m-music-play-wrap{
    height: 150px;
    position: relative;
    padding-left: 0;
    width: 350px;
margin: 0 auto;
}
.u-cover{
	display: none;
    margin: 0 40%;
    width: 121px;
    height: 121px;
    overflow: hidden;
    background: url(../images/music_icons.png) 0 0 no-repeat;
    position: absolute;
    top: 0;
    left: 0;
}
.u-cover img{
    display: block;
    width: 100%;
    height: auto;
    max-height: 100%;
    border-radius: 50%;
}


.grid-music-container .m-now-info{
    height: 100%;
}
.grid-music-container .m-now-info h1{
    font-weight: normal;
}
.grid-music-container .m-now-info h1 strong{
    font-size: 24px;
    color: #111210;

}
.grid-music-container .m-now-info h1 small{
    margin-left: 20px;
    font-size: 14px;
    color: #313230;
}
.grid-music-container .m-now-controls{
    padding-top: 30px;
    position: relative;
}
.grid-music-container .m-now-controls .u-control{
    display: inline-block;
    vertical-align:middle;
    font-size: 0;
    overflow: hidden;
}
.grid-music-container .m-now-controls .u-process{
    width: 220px;
    height: 4px;
    position: relative;
    background-color: #cecfd4;
}
.grid-music-container .m-now-controls .u-process .buffer-process,.grid-music-container .m-now-controls .u-process .current-process{
    display: block;
    width: 0;
    height: 4px;
    position: absolute;
    top:0;
    left: 0;
    background-color: #ac3b34;
    z-index: 1;
}
.grid-music-container .m-now-controls .u-process .buffer-process{
    z-index: 0;
    background-color: #c1c2c0;
}
.grid-music-container .m-now-controls .u-time{
    margin-left: 10px;
    font-size: 12px;
    color: #585957;
}
.grid-music-container .m-now-controls .u-volume{
    overflow: visible;
    text-align: center;
    position: relative;
    margin-left: 20px;
}
.grid-music-container .u-volume .volume-process{
    width: 3px;
    height: 50px;
    background: #cecfd4;
    position: absolute;
    top: -54px;
    left: 6px;
    cursor: pointer;
    visibility: hidden; /*设置不可见性，最好不要使用display:none，不然高度很难获取*/
}
.grid-music-container .u-volume .volume-process.show{
    visibility: visible;
}
.grid-music-container .u-volume .volume-process .volume-current,
.grid-music-container .u-volume .volume-process .volume-event{
    display: inline-block;
    width: 3px;
    height: 50%;
    background-color: #ac3b34;
    position: absolute;
    left: 0;
    bottom:0;
    -webkit-transition: height .2s linear;
    transition: height .2s linear;
}
.grid-music-container .u-volume .volume-process .volume-event{
    width: 21px;
    left: -10px;
    background: none;
    height: 100%;
    z-index: 1;
}
.grid-music-container .u-volume .volume-process .volume-bar{
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 100%;
    background-color: #fff;
    border: 1px solid #a8a9a7;
    position: absolute;
    left: -3px;
    bottom: 50%;
    -webkit-transition: bottom .2s linear;
    transition: bottom .2s linear;
   /* z-index: 2;*/
   /* opacity: 0;*/
}
.grid-music-container .u-volume .volume-process .volume-bar:hover,
.grid-music-container .u-volume .volume-process .volume-bar:active{
    background-color: #f1f2f0;
}
.grid-music-container .u-volume .volume-control{
    display: inline-block;
    width: 18px;
    height: 18px;
    background: url(../images/music_icons.png) -140px -80px no-repeat;
    cursor: pointer;
}
.grid-music-container .u-volume .volume-control:hover{
    background-position: -158px -80px;
}
.grid-music-container .u-volume .volume-control.muted{
    background-position: -140px -98px;
}
.grid-music-container .u-volume .volume-control.muted:hover{
    background-position: -158px -98px;
}
.grid-music-container .m-music-list-wrap{
  	margin-top: 20px;
    border: 1px solid rgba(255,255,255,.7);
    overflow-x: hidden;
    overflow-y: auto;
    padding:80px;
    background: url("../images/bg1.jpg") no-repeat left top;
    height:640px;
    border:1px solid #000;
}
.grid-music-container .m-music-list-wrap ul{
	padding:0;
	overflow-x: hidden;
overflow-y: auto;
width: 350px;
margin: 0 auto;
height: 600px;}
.grid-music-container .m-music-list-wrap li{
    display: block;
    line-height: 30px;
    padding: 0 10px;
    cursor: pointer;
    color: #383937;
    font-size: 14px;
    border-bottom: 1px dashed #383937;
margin-bottom: 10px;
}
.grid-music-container .m-music-list-wrap li strong{
    font-size: 20px;
    font-weight: normal;
}
.grid-music-container .m-music-list-wrap li:hover,.grid-music-container .m-music-list-wrap li.current{
    background-color: rgba(255,255,255,.7);
    color: #ac3b34;
    border-bottom: 1px dashed #ac3b34;
}
.grid-music-container .m-music-list-wrap li.current{
    background-color: transparent;
}
.grid-music-container .m-play-controls{
    margin-top: 10px;
}
.grid-music-container .m-play-controls a{
    display: inline-block;
    vertical-align: middle;
}
.grid-music-container .m-play-controls .u-play-btn{
    display: inline-block;
    width: 30px;
    height: 30px;
    margin-right: 15px;
    cursor: pointer;
}
.u-play-btn{
    background: url(../images/music_icons.png) -220px 0 no-repeat;
}
.u-play-btn.prev,.u-play-btn.next{
    background-position: -220px 0;
}
.u-play-btn.prev:hover,.u-play-btn.next:hover{
    background-position: -220px -36px;
}
.u-play-btn.prev{
    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg);
}
.u-play-btn.play{
    background-position: -250px 0;
}
.u-play-btn.play:hover{
    background-position: -250px -36px;
}
.u-play-btn.paused{
    background-position: -280px 0;
}
.u-play-btn.paused:hover{
    background-position: -280px -36px;
}
.u-play-btn.mode{
    width: 20px!important;
    height: 18px!important;
    margin-right: 10px!important;
}
.u-play-btn.mode-list{
    background-position: -181px -98px;
    margin-left: 65px;
}
.u-play-btn.mode-list.current{
    background-position: -221px -98px;
}
.u-play-btn.mode-random{
    background-position: -201px -80px;
}
.u-play-btn.mode-random.current{
    background-position: -241px -80px;
}
.u-play-btn.mode-single{
    background-position: -181px -80px;
}
.u-play-btn.mode-single.current{
    background-position: -221px -80px;
}

.wwrap{
	width: 650px;
	margin: 0 auto;
}