.radio .player-wpr {
	max-width: 260px;
	height: ;
	font-family: roboto, Arial, sans-serif;
	font-weight: 260;
	text-align: left;
	color: transparent;
	position: relative;
	overflow: hidden;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility
}
.radio .bg-wpr {
	width: 260px
	height: ;
	background: transparent;
	overflow: hidden;
	z-index: 100
}
.radio .player-ctr {
	height: 80px;
	position: relative;
	overflow: hidden;
	z-index: 101
}
.radio .blur {
	width: 260px
	height: ;
	position: absolute;
	opacity: 0;
	display: none;
	-webkit-transform: scale(1.5);
	-moz-transform: scale(1.5);
	-ms-transform: scale(1.5);
	-o-transform: scale(1.5);
	transform: scale(1.5);
	z-index: 100
}.radio .ppBtn {
	width: 30px;
	height: 30px;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 34px 34px;
	font-size: 16px;
	text-align: center;
	position: absolute;
left: 285px;
top: 24px;
    border-radius: 50%;

	cursor: pointer;
	z-index: 400
}
.radio .play-btn {

        left: 15px;
        top: 22px;
	background: #00FFFF url(https://i.imgur.com/3JHg1NC.png);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 29px 25px;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	transition: all .5s
}
.radio .stop-btn {

        left: 15px;
        top: 22px;
	background: #FF0000 url(https://i.imgur.com/W9wPqnR.png);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 25px 25px;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	transition: all .5s
}
.radio .play-btn:hover,
.radio .stop-btn:hover {
	background-color: rgb(0, 255, 0)
}
.radio .controls-wpr {
		height: 34px;
	background: transparent;
	text-align: left;
	position: absolute;
	bottom: 28px;
	left: 50px;
		margin-left: 20px;
	padding-top: 2;
		padding-left: 5px;
		padding-right: 20px
	z-index: 101

}
.radio .volume-slider-wpr {
	padding-left: 7px;
	padding-right: 6px
}
.radio .volume-slider {
	display: inline-block
}
.radio .vol-value {
     color:#00ffff ;
	width: 36px;
	font-size: 15px;
    line-height: 38px;
	text-align: center;
	position: absolute;
	margin-left: 135;
	margin-top: 0px;
	display: inline-block;
	font-weight: bold
}
.radio .vol-icon {
	width: 16px;
	height: 16px;
	line-height: 16px;
	position: absolute;
	top: 10px;
        left: -17px;
	font-size: 25px;
	color: rgb(0, 255, 0)
}
.radio .vol-icon1::before {
	content:url(https://i.imgur.com/O8dD0nS.png);
}
.radio .vol-icon2::before {
	content:url(https://i.imgur.com/mfICZ05.png);
}
.radio .vol-icon3::before {
	content:url(https://i.imgur.com/fXY6ewB.png);
}
.radio input[type=range] {
	min-width: 100px;
	max-width: 130px;
	width: 100px;
	height: 9px;
	background: transparent;
	margin-top: 5px;
	padding: 10px 0;
	-webkit-appearance: none;
	cursor: pointer
}
.radio input[type=range]:focus {
	outline: none
}
.radio input[type=range]::-webkit-slider-runnable-track {
	width: 130px;
	height: 9px;
	background: #00ffff;
	padding: 0;
	margin: 0;
	border: 0;
	border-radius: 8px;
	cursor: pointer;
	animate: .2s
}
.radio input[type=range]:focus::-webkit-slider-runnable-track {
	background: #1cff00
}
.radio input[type=range]::-webkit-slider-thumb {
	width: 14px;
	height: 14px;
	background: #0000FF;
	margin-top: -2px;
	border-radius: 50%;
	cursor: pointer;
	-webkit-appearance: none
	

}
.radio  input[type=range]:hover::-webkit-slider-thumb {
	margin-top: -3px;
	-webkit-appearance: none;
	transform: scale(1.3)
}


@media only screen and (max-width: 230px) {
}