.music-all {
	line-height: 200%;
	font-size: 14px;
	background: rgb(51, 51, 51);
	margin-top: 40px;
	padding: 10px 15px;
	border-radius: 5px;
}

.music-play{
	display: inline-block;
}

.music-no{
	display: none;
}

.music-cur{
	text-align: center;
	display: inline-block;
	width: 50px;
}

.music-max{
	text-align: center;
	display: inline-block;
	width: 50px;
}

.music-voice{
	position: relative;
}

.music-vol{
	padding-bottom: 35px;
	position: absolute;
	bottom: 0px;
	left: -11px;
	display: none;
}

.music-vol-con{
	background: rgb(51, 51, 51);
	display: inline-block;
	padding: 20px 0 10px 3px;
	border-radius: 5px;
}

.buttonMS img{width: 16px; height: 16px;margin-top: -5px;}

/* 进度条 */
.music-range-bg{
	background: #fff;
	display: inline-block;
	width: calc(100% - 150px);
	height: 5px;
	border-radius: 5px;
	position: relative;
	top: -3px;
}
input.music-range {
	width: 100%;
	height: 5px;
	background: #fff;
	border-radius: 5px;
	-webkit-appearance: none;
	cursor: pointer;
	outline: none;
	position: absolute;
	top:0;
}

input.music-range[type=range] {
    -webkit-appearance: none;
    width: 100%;
	border-radius: 10px; /*这个属性设置使填充进度条时的图形为圆角*/
	background: -webkit-linear-gradient(rgb(40, 110, 250), rgb(40, 110, 250)) no-repeat;
	background-size: 0% 100%;
}
input.music-range[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
}

input.music-range[type=range]::-webkit-slider-runnable-track {
    height: 5px;
    border-radius: 10px; /*将轨道设为圆角的*/
}
input.music-range[type=range]:focus {
    outline: none;
}
input.music-range[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    height: 15px;
    width: 15px;
    margin-top: -5px; /*使滑块超出轨道部分的偏移量相等*/
    background: #ffffff; 
    border-radius: 50%; /*外观设置为圆形*/
}
input.music-range[type=range]::-moz-range-progress {
    background: rgb(40, 110, 250);
    height: 13px;    
    border-radius: 10px;
}

/* 进度滑块 */
.music-range::-webkit-slider-thumb {
	width: 15px;
	height: 15px;
	background: #fff;
	cursor: pointer;
	border-radius: 90px;
	-webkit-appearance: none;
}

/* slider */
.slider{margin: 0 10px;}
.slider-selection{background: linear-gradient(to bottom#fff 0,#fff 100%);}
.slider-handle{background: linear-gradient(to bottom,#fff 0,#fff 100%);}
.slider-track{background-image: linear-gradient(to bottom,rgb(40, 110, 250) 0,rgb(40, 110, 250) 100%);}
.slider.slider-vertical .slider-track{width: 5px;}
.slider-handle{width: 15px; height: 15px;}
.slider.slider-vertical{height: 60px;}

@media (max-width: 768px) {
	.music-all {
		width: 100%;
		min-width: auto;
		max-width: calc(100% - 40px);
		margin: 88% 20px 0 20px;
	}
	.music-voice{
		display: none;
	}
	/* 进度条 */
	.music-range-bg{
		background: #fff;
		display: inline-block;
		height: 5px;
		border-radius: 5px;
		position: relative;
		top: -3px;
	}
}