body {
	background-image: url(../../Images/weixin/BG.png);
}
#music-panel {
}
#top {
	margin: 5% 5% 0% auto;
	width: 80%;
}

#musicBg {
    background-image: url(../../Images/WeiXin/music/m.png);
    background-size: 45%;
    background-repeat: no-repeat;
    background-position: center center;
    width: 70%;
    height: 24%;
    margin-left: 15%;
    position: absolute;
}


#music-switch {
	display: block;
	width: 70px;
	height: 32px;
}


#music-mute {
	display: block;
	width: 40px;
	height: 40px;
}

#music-mute {
	float: left;
}

#music-mute .icon {
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 100% 100%;
	display: block;
	width: 100%;
	height: 100%;
}
.icon-music-mute {
	background-image: url(../../Images/WeiXin/music/Mute-normal.png);
}
.selected .icon-music-mute {
	background-image: url(../../Images/WeiXin/music/Mute-selected.png);
}


#middle {
    margin: 38% auto 3% auto;
/*width: 80%;
    height: 45%;
    background-size: 70%;
    background-repeat: no-repeat;
    background-position: center center;*/
}

#voice-panel, #channel-panel {
	color: #FFF;
	width: 20%;
	height: 100%;
	float: left;
	position: relative;
}
#voice-panel .text, #channel-panel .text {
	width: 100%;
	font-size: 14pt;
	position: absolute;
	top: 50%;
	margin-top: -25%;
	text-align: center;
	cursor: default;
}
#music-voice-inc, #music-voice-dec, #music-channel-inc, #music-channel-dec {
	display: block;
	vertical-align: middle;
	text-decoration: none;
	font-size: 40pt;
	color: #FFF;
	text-align: center;
	width: 100%;
	position: absolute;
	height: 25%;
}
/*#music-voice-inc:hover, #music-voice-dec:hover, #music-channel-inc:hover, #music-channel-dec:hover {
	color: #33CC33;
}*/
#music-voice-inc, #music-channel-inc {
	top: 0;
}
#music-voice-dec, #music-channel-dec {
	bottom: 0;
}

#dir-panel {
	width: 100%;
	height: 100%;
	float: left;
	position: relative;
}

#music-key-VoiceInc {
display: block;
    margin: 0 auto;
    position: absolute;
    top: 100px;
    left: 5px;
    width: 50px;
    height: 50px;
    border-radius: 50%;
}
#music-key-VoiceInc .icon {
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 100% 100%;
	display: block;
	width: 100%;
	height: 100%;
}
.icon-music-key-VoiceInc {
	background-image: url(../../Images/WeiXin/music/VoiceInc-normal.png);
}
.selected .icon-music-key-VoiceInc {
	background-image: url(../../Images/WeiXin/music/VoiceInc-selected.png);
}

#music-key-Prev {
display: block;
    position: absolute;
    left: 0px;
    top: 0px;
    width: 50px;
    height: 50px;
    border-radius: 50%;
}
#music-key-Prev .icon {
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 100% 100%;
	display: block;
	width: 100%;
	height: 100%;
}
.icon-music-key-Prev {
	background-image: url(../../Images/WeiXin/music/Prev-normal.png);
}
.selected .icon-music-key-Prev {
	background-image: url(../../Images/WeiXin/music/Prev-selected.png);
}

#music-key-Play {
    display: block;
    position: absolute;
    top: 14px;
    left: 36px;
}
#music-key-Play .icon {
background-repeat: no-repeat;
    background-position: center center;
    background-size: 80%;
    display: block;
    width: 110px;
    height: 110px;
    border-radius: 50%;
}
.icon-music-key-Play {
	background-image: url(../../Images/WeiXin/music/Play.png);
}
.selected .icon-music-key-Play {
	background-image: url(../../Images/WeiXin/music/Pause.png);
}


#music-key-Next {
	display: block;
	width: 50px;
    height: 50px;
	border-radius: 50%;
	position: absolute;
	top: 0px;
	right: -8px;
}

#music-key-Next .icon {
	background-repeat: no-repeat;
    background-position: center center;
    background-size: 100% 100%;
    display: block;
    width: 100%;
    height: 100%;
}
.icon-music-key-Next {
	background-image: url(../../Images/WeiXin/music/Next-normal.png);
}
.selected .icon-music-key-Next {
	background-image: url(../../Images/WeiXin/music/Next-selected.png);
}

#music-key-VoiceDec {
    display: block;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    position: absolute;
    right: -6px;
    bottom: 32px;
}
#music-key-VoiceDec .icon {
	background-repeat: no-repeat;
    background-position: center center;
    background-size: 100% 100%;
    display: block;
    width: 100%;
    height: 100%;
}
.icon-music-key-VoiceDec {
	background-image: url(../../Images/WeiXin/music/VoiceDec-normal.png);
}
.selected .icon-music-key-VoiceDec {
	background-image: url(../../Images/WeiXin/music/VoiceDec-selected.png);
}

#bottom {
    width: 80%;
    margin: 0 auto;
    /* background: blue; */
}

#bottom a {
    color: #FFF;
    display: block;
    height: inherit;
    text-decoration: none;
    width: 33%;
    float: left;
    height: 80px;
}
#bottom .icon {
    display: block;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: auto 85%;
    height: 100%;
}
#bottom .text {
	display: block;
	font-style: normal;
	text-align: center;
	font-size: 12pt;
	padding: 5px 0; /*background-color: red;*/
	height: 30%;
}
.icon-music-key-SequentialPlay {
	background-image: url(../../Images/WeiXin/music/SequentialPlay-normal.png);
}
.selected .icon-music-key-SequentialPlay {
	background-image: url(../../Images/WeiXin/music/SequentialPlay-selected.png);
}


.icon-music-key-RandomPlay {
	background-image: url(../../Images/WeiXin/music/RandomPlay-normal.png);
}
.selected .icon-music-key-RandomPlay {
	background-image: url(../../Images/WeiXin/music/RandomPlay-selected.png);
}


.icon-music-key-SingleCycle {
	background-image: url(../../Images/WeiXin/music/SingleCycle-normal.png);
}
.selected .icon-music-key-SingleCycle {
	background-image: url(../../Images/WeiXin/music/SingleCycle_selected.png);
}



