html,body,ul,ol,li,h1,h2,h3,h4,h5,h6,p,table,th,td {
	margin: 0;
	padding: 0;
	font-size: 14px;
	font-weight: normal;
}
html,body {
	min-height: 100%;
}
body {
	color: #FFF;
	background: #6E5641;
	background: -webkit-linear-gradient(top, #745c48, #45322d);
	background: linear-gradient(top, #745c48, #45322d);
}
li {
	list-style: none;
}
em,i {
	font-style: normal;
}
strong,b {
	font-weight: normal;
}

.wrapper {
	max-width: 640px;
	margin: auto;
}

.topBar {
	height: 3.17rem;
	background: rgba(0, 0, 0, .5);
	overflow: hidden;
	width: 100%;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 2000;
}
.topBar div {
	position: relative;
	max-width: 640px;
	margin: auto;
}
.topBar span {
	display: block;
	height: 2.35rem;
	margin: .38rem 0 0 .508rem;
	padding-left: 2.857rem;
	background: url(/song/img/logo.png) no-repeat;
	background-size: 2.35rem 2.35rem;
}
.topBar strong {
	display: block;
	padding-bottom: .2rem;
}
.topBar em {
	display: block;
	font-size: .8rem;
	color: #9d7e67;
}
.topBar a {
	display: inline-block;
	height: 1.777rem;
	line-height: 1.9rem;
	overflow: hidden;
	background: #53D468;
	color: #FFF;
	text-decoration: none;
	padding: 0 .5rem;
	position: absolute;
	right: 1rem;
	top: .25rem;
	-webkit-border-radius: .2rem;
	-moz-border-radius: .2rem;
	border-radius: .2rem;
}

.name {
	padding: 1.269rem 0 .825rem 0;
	color: #FFF;
	font-size: 1.2rem;
	text-align: center;
	margin-top: 3.17rem;
}

.cover {
	min-width: 20rem;
	width: 90%;
	margin: auto;
	position: relative;
}
.cover:after {
	display: block;
	content: "";
	clear: both;
}
.coverGroup {
	width: 45%;
	text-align: center;
}
.cover .coverGroup:first-child {
	float: left;
}
.cover .coverGroup:last-child {
	float: right;
}
.coverGroup span {
	display: block;
	background: rgba(0, 0, 0, .2);
	padding: .26rem;
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	border-radius: 100%;
}
.coverGroup img {
	display: block;
	width: 100%;
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	border-radius: 100%;
}
.coverGroup strong {
	display: block;
	padding: .254rem 0 .381rem 0;
}
.coverGroup em {
	display: inline-block;
	color: #AEA8B1;
	padding-left: 1.8rem;
	height: .9rem;
	line-height: .9rem;
	background: url(/song/img/icon_uid.png) 0 center no-repeat;
	background-size: contain;
}
.coverConnect {
	font-family: Arial;
	font-size: 1.72rem;
	color: #C9AC93;
	text-shadow: 1px 1px 3px #333;
	position: absolute;
	text-align: center;
	width: 100%;
	left: 0;
	top: 50%;
	margin-top: -2.5rem;
}

.player {
	height: 2.6rem;
	margin: 1rem .762rem 1.8rem .762rem;
	position: relative;
	overflow: hidden;
}
.playerBtn {
	width: 2.6rem;
	height: 2.6rem;
	background-image: url(/song/img/icon_play.png);
	background-repeat: no-repeat;
	background-size: contain;
	position: absolute;
	left: 0;
	top: 0;
	cursor: pointer;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	tap-highlight-color: rgba(0, 0, 0, 0);
}
.playerBtn.playing {
	background-image: url(/song/img/icon_pause.png);
}
.playerProgress {
	margin: 1.25rem 6.5rem 0 3.1rem;
	height: .2rem;
	position: relative;
}
.playerTrack {
	width: 100%;
	height: 100%;
	background: #74685e;
	position: absolute;
	left: 0;
	top: 0;
	-webkit-border-radius: 1rem;
	-moz-border-radius: 1rem;
	border-radius: 1rem;
}
.bufferedTrack {
	height: 100%;
	background: #D6BBA4;
	position: absolute;
	left: 0;
	top: 0;
	-webkit-border-radius: 1rem;
	-moz-border-radius: 1rem;
	border-radius: 1rem;
}
.playerCurrent {
	height: 100%;
	background: #FF7800;
	position: absolute;
	left: 0;
	top: 0;
	-webkit-border-radius: 1rem;
	-moz-border-radius: 1rem;
	border-radius: 1rem;
}
.playerCurrentDot {
	width: 1.016rem;
	height: 1.016rem;
	background: url(/song/img/icon_dot.png) center center no-repeat;
	background-size: contain;
	position: absolute;
	top: -.45rem;
	right: -.508rem;
	cursor: pointer;
}
.playerTimes {
	font-family: Arial;
	height: 1rem;
	line-height: 1rem;
	position: absolute;
	right: 0;
	top: .65rem;
}
.playerTimes div {
	display: inline;
	vertical-align: middle;
}
.playerTimes span {
	vertical-align: middle;
	color: #A19FAA;
}
.playerTotalTime {
	color: #A19FAA;
}
.player input {
	margin: 0;
	width: 100%;
	position: absolute;
	left: 0;
	top: -.7rem;
	opacity: 0;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	tap-highlight-color: rgba(0, 0, 0, 0);
}

.user {
	position: relative;
	border-top: 1px solid rgba(255, 255, 255, .2);
}
.user img {
	width: 3.174rem;
	height: 3.174rem;
	-webkit-border-radius: 10rem;
	-moz-border-radius: 10rem;
	border-radius: 10rem;
	position: absolute;
	left: .762rem;
	top: 1.27rem;
}
.user h6 {
	position: absolute;
	left: 4.444rem;
	top: 1.5rem;
}
.user h6 strong {
	vertical-align: middle;
}
.user h6 em {
	display: inline-block;
	width: 4rem;
	height: 1.4rem;
	margin-left: .254rem;
	vertical-align: middle;
	background-repeat: no-repeat;
	background-size: contain;
}
.user h6 em.lv0 { background-image: url(/song/pic/lv0.png); }
.user h6 em.lv1 { background-image: url(/song/pic/lv1.png); }
.user h6 em.lv2 { background-image: url(/song/pic/lv2.png); }
.user h6 em.lv3 { background-image: url(/song/pic/lv3.png); }
.user h6 em.lv4 { background-image: url(/song/pic/lv4.png); }
.user h6 em.lv5 { background-image: url(/song/pic/lv5.png); }
.user h6 em.lv6 { background-image: url(/song/pic/lv6.png); }

.user h6 em.lv7 { background-image: url(/song/pic/lv7.png); }
.user h6 em.lv8 { background-image: url(/song/pic/lv8.png); }
.user h6 em.lv9 { background-image: url(/song/pic/lv9.png); }

.user h6 em.lv10 { background-image: url(/song/pic/lv10.png); }
.user h6 em.lv11 { background-image: url(/song/pic/lv11.png); }
.user h6 em.lv12 { background-image: url(/song/pic/lv12.png); }

.user h6 em.lv13 { background-image: url(/song/pic/lv13.png); }
.user h6 em.lv14 { background-image: url(/song/pic/lv14.png); }
.user h6 em.lv15 { background-image: url(/song/pic/lv15.png); }

.user h6 em.lv16 { background-image: url(/song/pic/lv16.png); }
.user h6 em.lv17 { background-image: url(/song/pic/lv17.png); }
.user h6 em.lv18 { background-image: url(/song/pic/lv18.png); }

.user div {
	position: absolute;
	left: 4.444rem;
	top: 3rem;
}
.user div span {
	display: inline-block;
	color: #94929C;
	padding: 0 .7rem 0 1.016rem;
	height: .8rem;
	line-height: .8rem;
	background-position: 0 center;
	background-repeat: no-repeat;
	background-size: contain;
}
.user div span.mic { background-image: url(/song/img/icon_mic.png); }
.user div span.gift { background-image: url(/song/img/icon_gift.png); }
.user div span.comment { background-image: url(/song/img/icon_comment.png); }
.user div span.like { background-image: url(/song/img/icon_like.png); }
.user p {
	margin: 5.5rem .762rem 5rem .762rem;
	padding: .635rem;
	color: #9d7e67;
	line-height: 1.5rem;
	background: rgba(0, 0, 0, .2);
	position: relative;
}
.user p:after {
	content: "";
	display: block;
	width: 0;
    height: 0;
    border-left: .5rem solid transparent;
    border-right: .5rem solid transparent;
    border-bottom: .5rem solid rgba(0, 0, 0, .2);
    position: absolute;
    left: 1rem;
    top: -.5rem;
}

.footer {
	background: #000;
	width: 100%;
	height: 3.3rem;
	line-height: 3.3rem;
	text-align: center;
	font-size: 1.4rem;
	position: fixed;
	left: 0;
	bottom: 0;
	z-index: 2000;
}
.footer a {
	display: block;
	color: #EC7F1E;
	text-decoration: none;
}