@charset "UTF-8";
/* @St. 2015-06-15 09:23 */
html,
body,
p,
ul,
ol,
dl,
li,
dt,
dd { margin: 0; padding: 0; border: 0; outline: none; list-style: none; }
body,
html { height: 100%; width: 100%; font-size: 0.9em; }
li { list-style-type: none; }
a { text-decoration: none; outline: none; color: #333333; }
a:hover { text-decoration: underline; }
table { border-collapse: collapse; border-spacing: 0; margin: 0 auto; clear: both; }
img { border: 0; display: block; }
em { font-style: normal; }
hr { height: 0; clear: both; }
.hide,
.none { display: none; }
.clear { clear: both; }
.playList li:after,
.clearfix:after { content: ""; display: block; height: 0; clear: both; visibility: hidden; }
body { background-color: rgb(232, 235, 237); background-image: -webkit-linear-gradient(180deg, rgb(171, 174, 255), rgb(139, 232, 255)); background-image: -o-linear-gradient(270deg, rgb(171, 174, 255), rgb(139, 232, 255)); background-image: -moz-linear-gradient(270deg, rgb(171, 174, 255), rgb(139, 232, 255)); background-image: linear-gradient(270deg, rgb(171, 174, 255), rgb(139, 232, 255)); font-family: "PingHei", "Lucida Grande", "Lucida Sans Unicode", "STHeiti", "Helvetica", "Arial", "Verdana", "sans-serif"; }
/*头部样式*/
#mobileHeader { width: 100%; height: 90px; background: #e2e2e2 url(../images/bannerMobile.jpg) no-repeat 0 0px; -webkit-background-size: 100% 90px; background-size: 100% 90px; position: relative; }
#mobileHeader .name { position: absolute; left: 5%; top: 35%; background: url(../images/font.png) no-repeat; width: 260px; height: 24px; background-size: cover; }
#mobileHeader .right { display: block; width: 40px; height: 18px; position: absolute; top: 35%; right: 10px; /*background: url(http://www.xinhuanet.com/2015/txh2015/img/navMore.png) no-repeat 0 0px;
	-webkit-background-size: cover;
	background-size: cover;*/ background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20398%20308'%3E%0A%3Cpath%20style='fill:#ffffff;'%20d='M373.6,254.3H24.4C10.9,254.3,0,264.9,0,278.1v5.7c0,13.2,10.9,23.8,24.4,23.8h349.3%0A%09c13.5,0,24.4-10.7,24.4-23.8v-5.7C398,264.9,387.1,254.3,373.6,254.3z%20M373.6,0H24.4C10.9,0,0,10.7,0,23.8v5.7%0A%09c0,13.2,10.9,23.8,24.4,23.8h349.3c13.5,0,24.4-10.7,24.4-23.8v-5.7C398,10.7,387.1,0,373.6,0z%20M373.6,127.1H24.4%0A%09C10.9,127.1,0,137.8,0,151v5.8c0,13.2,10.9,23.8,24.4,23.8h349.3c13.5,0,24.4-10.7,24.4-23.8V151%0A%09C398,137.8,387.1,127.1,373.6,127.1z'/%3E%0A%3C/svg%3E"); background-position: center center; background-repeat: no-repeat; background-size: 100% 100%; }
#mobileHeader .mobileNavList { width: 100%; height: 0px; overflow: hidden; position: absolute; top: 90px; left: 0px; background: #ededed; z-index: 10; }
#mobileHeader .mobileNavList a { float: left; width: 20%; padding: 10px 0; color: #000; text-align: center; font-size: 16px; }
#mobileHeader .phnav { text-align: center; padding-bottom: 6px; }
#mobileHeader .phnav a { float: left; width: 25%; height: 30px; line-height: 35px; text-align: center; font-size: 16px; color: #333; }
/*页签状态*/
#navTab .tab,
#navTab .tab span { color: #fff; text-align: center; font-size: 1.2em; height: 50px; line-height: 50px; }
#navTab .tab,
.playList li .jp-playlist-item .audioItemTitle .jp-artist { text-shadow: 1px 1px 2px rgba(0,0,0,0.3); }
#navTab .tab { float: left; width: 20%; }
#navTab .tab:hover { text-decoration: none; }
#navTab .tab span { display: block; width: 100%; }
#navTab .tab0 { background-color: #293e82; }
#navTab .tab1 { background-color: #304f94; }
#navTab .tab2 { background-color: #3769ab; }
#navTab .tab3 { background-color: #3d7ebb; }
#navTab .tab4 { background-color: #4292ca; }
#navTab .tab.on { background-color: transparent; }
/*播放列表*/
.playList { clear: both; }
.playList li .jp-playlist-item-remove { display: none }
.playList li,
.playList li.jp-playlist-current a { color: #FFFFFF; }
.playList li a { text-decoration: none; }
.playList li .jp-playlist-item .listNum,
.playList li .jp-playlist-item .audioItemTitle { padding-left: 1em; }
.playList li { font-size: 1.2em; height: 50px; line-height: 50px; list-style: none; overflow: hidden; }
.playList li .jp-playlist-item .listNum { font-weight: bold; }
.playList li .jp-playlist-item .audioItemTitle .jp-artist { color: rgba(255,255,255,0.6); float: right; text-align: right; padding-right: 1em; }
.playList li.jp-playlist-current div { background-color: rgba(0,0,0,0.5); color: #FFFFFF !important; }
/*播放器*/
.playercoverBox,
.bottomBlankBox { height: 7em; }
.bottomLine,
.bottomBlankBox,
.shareBox,
.shareBox .icon,
.shareBox .t { display: block; }
.bottomLine,
.bottomBlankBox/*,
.shareBox .t */ { clear: both; }
.bottomLine { height: 1px; margin: 1em; overflow: hidden; background-color: #666; }
.shareBox { margin: 0 auto; padding: 1em 1em 2em 1em; }
.shareBox .icon { width: 150px; height: 150px; background-position: center center; background-repeat: no-repeat; background-size: 100% 100%; }
.shareBox .icon0 { display: none; /*background-image: url(../images/xinhuaRadioShareIcon0.jpg); -moz-border-radius: 25px; -webkit-border-radius: 25px; border-radius: 25px; float: left;*/ }
.shareBox .icon1 { background-image: url(../images/xinhuaRadioShareIcon1.gif); margin: 0 auto; /*float: left; margin-right: 2em;*/ }
.shareBox .t { font-size: 1.4em; line-height: 2em; color: #000000; padding-top: 0.5em; text-align:center; }
.shareBox .t .t1 { display: block; font-size: 1.2em; }
.shareBox .t .u { display: block; font-size: 0.8em; line-height: 1.4em; color: #666666; }
.playercoverBox { width: 100%; background: rgba(0, 0, 0, 0.8); background-repeat: repeat; position: fixed; bottom: 0; left: 0; z-index: 999; }
/*播放按钮*/
.playercoverBox .audioBtnBox { width: 56%; height: auto; margin: 0 auto; position: relative; padding: 0.5em 0 1em 0; }
.playercoverBox .audioBtnBox .btn,
.playercoverBox .audioBtnBox button { border: none; cursor: pointer; display: block; height: 4em; width: 4em; overflow: hidden; padding: 0; text-indent: -9999px; background-color: transparent; background-size: 100%; background-position: center center; background-repeat: no-repeat; background-size: 60%; }
.playercoverBox .audioBtnBox .btn:hover { filter: alpha(opacity=70); -moz-opacity: .7; opacity: .7; }
.playercoverBox .audioBtnBox .iconPlay { margin-left: -2em; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='49.4%200%20401.2%20500'%3E%3Cpath%20style='fill:#FFFFFF;'%20d='M450.6,250L49.4,500V0L450.6,250z'/%3E%3C/svg%3E%0A"); background-position: 60% center; background-size: 40%; position: absolute; left: 50%;/*-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	border: 1px #FFFFFF solid;*/ }
.jp-state-playing .playercoverBox .audioBtnBox .iconPlay { /*background-image: url(http://www.xinhuanet.com/2015/txh2015/img/iconPus.png);*/ background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2055.4%2081.4'%3E%3Cpath%20fill-rule='evenodd'%20clip-rule='evenodd'%20fill='#FFFFFF'%20d='M0,81.4h11.1V0H0V81.4z%20M44.3,0v81.4h11.1V0H44.3z'/%3E%3C/svg%3E%0A"); background-position: 53% center; }
.playercoverBox .audioBtnBox .iconPre { /*background-image: url(http://www.xinhuanet.com/2015/txh2015/img/iconPre.png);*/ background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='49.4%200%20501.2%20319.8'%3E%3Cpolygon%20fill='#FFFFFF'%20points='550.6,0%20312.3,145.7%20312.3,0%2049.4,159.9%20312.3,319.8%20312.3,174.7%20550.6,319.8'/%3E%3C/svg%3E%0A"); float: left; }
.playercoverBox .audioBtnBox .iconNext { /*background-image: url(http://www.xinhuanet.com/2015/txh2015/img/iconNext.png);*/ background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2081.2%2051.8'%3E%3Cpolygon%20style='fill:#FFFFFF;'%20points='81.2,25.9%2038.7,0%2038.7,23.6%200,0%200,51.8%2038.7,28.3%2038.7,51.8'/%3E%3C/svg%3E%0A"); float: right; }
/*进度条*/
.playercoverBox .barPlayBox { width: 90%; margin: 0 auto; position: relative; height: 1em; }
.playercoverBox .barPlayBox .barPlay { position: absolute; z-index: 99; width: 76%; margin-top: -0.5em; margin-left: -38%; top: 50%; left: 50%; }
.playercoverBox .barPlayBox .barPlay,
.playercoverBox .barPlayBox .bar,
.playercoverBox .barPlayBox .barValue { height: 6px; }
.playercoverBox .barPlayBox .bar,
.playercoverBox .barPlayBox .barValue { background-position: right center; }
.playercoverBox .barPlayBox .bar { background-color: #514d51; cursor: pointer; margin-bottom: 0; overflow: hidden; }
.playercoverBox .barPlayBox .barValue { /*background-image: url(http://www.xinhuanet.com/2015/txh2015/img/barBgPlayOn.png);*/ background-color: rgb(232, 235, 237); background-image: -webkit-linear-gradient(180deg, rgb(169, 138, 190), rgb(104, 222, 173)); background-image: -o-linear-gradient(270deg, rgb(169, 138, 190), rgb(104, 222, 173)); background-image: -moz-linear-gradient(270deg, rgb(169, 138, 190), rgb(104, 222, 173)); background-image: linear-gradient(270deg, rgb(169, 138, 190), rgb(104, 222, 173)); }
/*播放时间*/
.playercoverBox .playTimesBox { /*font-family: "Lucida Sans Unicode";*/ height: 1em; line-height: 1em; width: 6em; }
.playercoverBox .currentTimeBox,
.playercoverBox .durationBox { margin-top: -0.7em; top: 50%; position: absolute; }
.playercoverBox .duration,
.playercoverBox .middleTxt { color: #969696; }
.playercoverBox .currentTime { color: #fff; }
.playercoverBox .duration { text-align: right; float: right; }
.playercoverBox .middleTxt { left: 0; }
.playercoverBox .currentTimeBox { left: 0; text-align: left; }
.playercoverBox .durationBox { right: -0.3em; text-align: right; }
.wifiTips { text-align: center; line-height: 1.2em; font-size: 0.8em; background: rgba(0,0,0,1.00); color: #FFFFFF; }
.coverBox { width: 100%; height: 100%; position: fixed; z-index: 1000; background-image: url(../images/coverBg.jpg); background-position: center center; background-repeat: no-repeat; background-size: 100% 100%; }
.coverBox .logo { position: absolute; top: 38%; width: 100%; height: 5em; background-image: url(../images/xinhuaRadioLogo.png); background-position: center top; background-repeat: no-repeat; background-size: auto 100%; }
.coverBox .txtBox,
.coverBox .btnBox,
.coverBox .tips { font-size: 1em; line-height: 2em; color: #FFFFFF; text-align: center; }
.coverBox .txtBox { position: absolute; bottom: 0; height: 6em; text-shadow: 1px 1px 2px rgba(0,0,0,0.8); width: 100%; }
.coverBox .btnBox { position: absolute; bottom: 10em; left: 50%; border: rgba(255,255,255,0.7) 1px solid; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; padding: 0; width: 6em; margin-left: -3em; }
.coverBox .tips { position: absolute; bottom: 0; height: 2em; color: rgba(255,255,255,0.5); text-shadow: 1px 1px 2px rgba(0,0,0,0.8); width: 100%; }
.coverBox2 { top: 0; left: 0; z-index: 998; display: none; }
.coverBox2 .txtBox { bottom: 6em; }

@media screen and (max-width:320px) {
/*小于320生效*/
.coverBox .btnBox { position: absolute; bottom: 8em; font-size: 0.8em; }
}
/*
@media screen and (min-width:321px) and (max-width:567px) {
*大于321小于414生效*
}

@media screen and (min-width:415px) and (max-width:736px) {
*大于415生效小于736*
}
*/