* {
	min-width: 0
}
body {
	background: #fed807;
	padding: 0 10px
}
body, ul {
	margin: 0
}
ul {
	padding: 0;
	list-style: none
}
.links-social {
	width: 100px;
	display: none
}
.links-social ul {
	float: left
}
.links-social ul li {
	float: left;
	margin-right: 6px
}
.links-social ul li:last-child {
	margin-right: 0
}
.links-social ul li a {
	display: block;
	width: 22px;
	line-height: 22px;
	text-align: center;
	color: #fff;
	font-size: 12px;
	border-radius: 50%
}
.links-social ul li a.facebook {
	background: #4e71a8
}
.links-social ul li a.twitter {
	background: #1cb7eb
}
.player-container .controls {
	width: 44px
}
.player-container .controls button {
	background: transparent;
	width: 30px;
	height: 30px;
	color: #fff;
	border: 2px solid #fff;
	font-size: 12px;
	cursor: pointer;
	border-radius: 50%;
	outline: none
}
.player-container .controls button.player-stop {
	display: none
}
.player-container .playing {
	font-size: 13px;
	font-weight: 700;
	color: #fff;
	padding: 2px 0 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap
}
.player-container .current-time {
	font-size: 11px;
	color: #fff;
	width: 80px
}
.player-container .volume-range {
	margin: 6px 0 0;
	width: 120px;
	height: 6px
}
.player-container .volume-range .rangeslider {
	width: 100%;
	height: 100%;
	background: #545a72;
	position: relative;
	border-radius: 10px
}
.player-container .volume-range .rangeslider .rangeslider__fill {
	height: 100%;
	background: #989caa;
	border-radius: 10px
}
.player-container .volume-range .rangeslider .rangeslider__handle {
	width: 12px;
	height: 12px;
	background: #989caa;
	cursor: pointer;
	display: inline-block;
	position: absolute;
	top: -3px;
	border-radius: 50%
}
.links-listen {
	width: 100px;
	display: none
}
.links-listen ul {
	float: right
}
.links-listen ul li {
	float: left;
	margin-right: 10px
}
.links-listen ul li:last-child {
	margin-right: 0
}
.links-listen ul li a {
	display: block
}

@media (min-width:576px) {
.links-listen, .links-social {
	display: block
}
}