@charset "utf-8";
/* CSS Document */

.player_wrap{font-family: \5fae\8f6f\96c5\9ed1, u9ed1u4f5353, "Lucida Grande";width:100%;margin:0 auto;}
.player_inner,.main_inner{padding:0;min-width:960px}


.player_wrap{height:100px;background:#424242; position:relative;z-index:9; overflow:hidden;max-height:100px;}
.footer_wrap{min-height:20px}

/*----------------header------------------*/
.header_wrap{height:40px;background:#292929 !important;width:100%;margin:0 auto;}
.header_inner{padding:0;min-width:960px}

/*----------------/header------------------*/

/*--------------播放器主体-----------------*/
#player{position:relative;z-index:100;height:100px;padding:0;border:none;background-color:#424242}

/*--player layout--*/
#player .player_portrait{float:left;width:100px;height:100px}
#player .player_layout{margin-left:100px}
#player .player_sociality{float:right;width:200px;height:100px}

/*--figure--*/
#player .player_portrait .figure{float:left;width:100px;height:100px;overflow:hidden;background:transparent no-repeat}

/*--control and sociality*/
#player .player_containers{height:100px;}


#player .player_main{margin-left:190px;margin-right:50px; color:#fff; *width:620px;_width:560px; overflow:hidden; position:relative;*zoom:1}
#player .player_textinfo{position:relative;height:22px;line-height:22px;padding-top:20px;padding-left:0px; }
#player .player_textinfo .musicname{float:left;font-size:18px;color:#fff;font-weight:normal;}
#player .player_textinfo .musicname a,#player .player_textinfo .musicname a:hover{color:#fff;text-decoration:none;}
#player .player_textinfo .jp-time-holder{position:absolute;top:25px;right:0;height:22px;line-height:22px;font-size:12px;color:#999;-webkit-text-size-adjust:none}

#player .progress{margin-top:10px;height:5px;position:relative;background:#fff;}
#player .progress_bar{margin-right:0}
#player .default_bar{display:block;width:100%;border:1px solid #fff;height:3px;cursor:pointer;position:relative;_overflow:hidden}
#progress_percent{position:absolute;top:-1px;left:-1px;height:5px;overflow:hidden;background:#ff6600;width:0;z-index:20;-webkit-transition:all 0.5s linear;-moz-transition:all 0.5s linear;-o-transition:all 0.5s linear;transition:all 0.5s linear;}
#loaded_percent{position:absolute;top:0;left:0;height:3px;overflow:hidden;background:#fff;width:0;z-index:10}

#player .play_operate{padding-top:12px;height:20px;}
#player .volume_bar{float:left;margin-left:25px;cursor:pointer;position:relative;width:60px;height:3px;margin-top:9px;background:#fff;}
#player .volume_bar .volume_value{position:absolute;top:0;left:0;height:3px;overflow:hidden;background:#aaa;width:0;z-index:10}

#player .play_operate{position:relative;}
#mode_list{float:right;}
#mode_list .playmod{float:left;margin-right:5px;}
#mode_list .playmod a{display:block;cursor:pointer;width:20px;height:20px;background:transparent url(../images/ui_player.png) 0 0 no-repeat;_background-image:url(../images/ui_player.gif)}
#mode_list .playmod .random{background-position:-350px 0}
#mode_list .selected .random,#mode_list .playmod .random:hover{background-position:-350px -20px}
#mode_list .playmod .repeat{background-position:-380px 0}
#mode_list .selected .repeat,#mode_list .playmod .repeat:hover{background-position:-380px -20px}
#mode_list .playmod .single{background-position:-410px 0;margin-right:0}
#mode_list .selected .single,#mode_list .playmod .single:hover{background-position:-410px -20px}




/*---------play btn----------*/
#player .jp-controls{float:left;width:190px;height:100px;padding:0;margin:0;}
#player .jp-controls li{float:left;position:relative;}
#player .jp-controls li a{display:block;cursor:pointer;background:transparent url(../images/ui_player.png) 0 0 no-repeat;_background-image:url(../images/ui_player.gif)}

#player .jp-controls li a.jp-previous{width:35px;height:50px;background-position:-25px -25px;margin:25px 0 0 25px}
#player .jp-controls li a.jp-previous:hover{background-position:-25px -125px}
#player .jp-controls li a.jp-previous:active{margin:25px 0 0 25px;opacity:.8}
#player .jp-controls li a.jp-next{width:35px;height:50px;background-position:-190px -25px;margin:25px 0 0 10px}
#player .jp-controls li a.jp-next:hover{background-position:-190px -125px}
#player .jp-controls li a.jp-next:active{margin:25px 0 0 10px;opacity:.8}
#player .jp-controls li a.jp-play{width:50px;height:50px;background-position:-70px -25px;margin:25px 0 0 10px}
#player .jp-controls li a.jp-play:hover{background-position:-70px -125px}
#player .jp-controls li a.jp-play:active{margin:25px 0 0 10px;opacity:.8}
#player .jp-controls li a.jp-pause{width:50px;height:50px;background-position:-130px -25px;margin:25px 0 0 10px}
#player .jp-controls li a.jp-pause:hover{background-position:-130px -125px}
#player .jp-controls li a.jp-pause:active{margin:25px 0 0 10px;opacity:.8}

#player .jp-controls li a.jp-mute,#player .jp-controls li a.jp-unmute{position:absolute;left:26px;top:70px;z-index:99;}

#player .jp-controls li a.jp-mute{width:20px;height:20px;background-position:-440px -0;margin:0}
#player .jp-controls li a.jp-mute:hover{background-position:-440px -20px}
#player .jp-controls li a.jp-mute:active{margin:0;opacity:.8}
#player .jp-controls li a.jp-unmute{width:20px;height:20px;background-position:-470px -0;margin:0}
#player .jp-controls li a.jp-unmute:hover{background-position:-470px -20px}
#player .jp-controls li a.jp-unmute:active{margin:0;opacity:.8}


/*------------sociality btn------------*/
#player .sociality{padding:35px 0;}
#player .sociality li{float:left;position:relative;}
#player .sociality li > a,#player .sociality li .share,#player .sociality li .share:hover{display:block;cursor:pointer;background:transparent url(../images/ui_player.png) 0 0 no-repeat;_background-image:url(../images/ui_player.gif)}

#player .sociality li > a.like{width:30px;height:30px;background-position:-250px 0;margin:0 0 0 35px}
#player .sociality li > a.like:hover{background-position:-250px -30px}
#player .sociality li > a.like.current{background-position:-250px -30px}
#player .sociality li .share{float:left;width:30px;height:30px;background-position:-280px 0;margin:0 0 0 28px}
#player .sociality li .share:hover{background-position:-280px -30px}
#player .sociality li > a.comment{width:30px;height:30px;background-position:-310px 0;margin:0 0 0 26px}
#player .sociality li > a.comment:hover{background-position:-310px -30px}
#player .sociality li > a.comment.current{background-position:-310px -30px}

/*------------main content---------------*/
.main_inner{position:relative;}
#player_relate{float:left;width:100%;margin-left:-290px;overflow:hidden;background:#fff;color:#333;}
#offset_relate{padding-left:290px;}
#list_panel{float:right;width:280px;height:700px;background:#fff;}


#relateitem_menu{position:relative;width:100%;height:30px;line-height:30px;z-index:1000;}
#relateitem_menu li{float:left;width:25%;height:30px;overflow:hidden;text-align:center;background-color:#28cbb5;background-image:url(../images/tabs.jpg);background-position:right top;background-repeat:no-repeat;color:#fff;cursor:pointer;}
#relateitem_menu li.last{background-image:none !important;}
#relateitem_menu li.current{background:#fff;color:#333;}
#relateitem_con{width:100%;}
#relateitem_con .tabs_con_content{display:none;width:100%;padding:0;margin:0;}
#relateitem_con .tabs_con_list{width:100%;}

/*-Tab1 data-*/
.relate_data{padding:30px;}
.relate_data .data_statistics{width:100%;min-width:620px;margin-bottom:30px;border:1px #e9e9e9 solid;border-collapse:collapse;}
.relate_data .data_statistics td{width:25%;font-size:14px;color:#aaa;height:78px;text-align:center;border:1px #e9e9e9 solid;border-collapse:collapse;}
.relate_data .data_statistics td span{font-size:30px;color:#333;}

/*-Tab2 datum-*/
.relate_datum{padding:30px;font-family:'\5B8B\4F53';font-size:12px;}
.relate_datum li{height:30px;line-height:30px;color:#333;}
.relate_datum li a{color:#38a085;}
.relate_datum li span{color:#999;}

/*-Tab3 lyrics-*/
.relate_lyrics{padding:30px;width:100%;font-family:'\5B8B\4F53',Verdana,Geneva,sans-serif;font-size:12px;}
.relate_lyrics li{width:100%;height:30px;line-height:30px;color:#999;text-align:center;cursor:pointer;}
.relate_lyrics li.paragraph{width:100%;height:20px;}
.relate_lyrics li:hover{color:#89bf43;}
.relate_lyrics li.current,.relate_lyrics li.current:hover{color:#333;font-size:16px;font-weight:bold;}


/*-Tab3 comments-*/
.relate_comments{padding:30px;font-family:'\5B8B\4F53';font-size:12px;}




/*--右边部分---*/

#detail_menu{position:relative;width:100%;height:30px;line-height:30px;}
#detail_menu li{float:left;width:50%;height:30px;overflow:hidden;text-align:center;background-color:#28cbb5;color:#fff;cursor:pointer;}
#detail_menu li.current{background:#fff;color:#333;}
#detail_con{width:280px;}
#detail_con .tabs_content{display:none;}


.song_list{width:280px;font-family:'\5B8B\4F53';font-size:12px;}
.song_list table{width:100%;background:#fff}
.song_list th,.song_list td{height:40px;border-bottom:1px #e9e9e9 solid;padding:0 15px;text-align:left;vertical-align:middle}
.song_list th{color:#aaa;font-weight:normal;}
.song_list td{color:#aaa;}
.song_list td a{color:#38a085;}
.song_list .title{width:110px;height:40px;text-align:left;padding-left:30px;text-align:left;overflow:hidden;}
.song_list .songer{width:70px;height:40px;overflow:hidden;}
.song_list .clear_listdata{margin:20px auto;clear:both;width:85px;height:30px;overflow:hidden;background:url(../images/clear_list.gif) 0 0 no-repeat;}
.song_list .clear_listdata a{float:left;width:85px;height:30px;}



/*------------/main content---------------*/

/*------------------标签类型--------------------*/
.player_label{position:absolute;left:0;top:24px;z-index:999;width:33px;height:15px;overflow:hidden;}
.label_yc,.label_gb,.label_fc{width:33px;height:15px;overflow:hidden;display:inline-block;background:url(.../images/images/css_sprites/a8ui_label.gif) no-repeat;}
.label_yc{background-position:0 0}
.label_gb{background-position:0 -15px}
.label_fc{background-position:0 -30px}

