.music-player {
	width: 100%;
	height: 100px;
	background: #000;
	color: #FFFFFF;
	display: flex;
}
.music-player .fix_pos{
	display: flex;
			align-items: center;
}
.music-player .m_contr{
	width: 58%;
}
.music-name,
.artist-name {

}

.music-name {
	font-size: 1em;
	margin-bottom: 10px;
}

.artist-name {
	font-size: .9em;
	color: #78777E;
}
.disk {
	display: block;
	width: 100px;
	height: 100px;
	margin-right: 15px;
	background-image: url('../images/cov.png');
	background-size: cover;
	animation: rotate 20s linear infinite;
		animation-play-state: paused;
}
/* .disk.play {
	animation-play-state: running;
}
.disk::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: #5f7a61;
} */
.song-slider {
	width: 100%;
	position: relative;
}

.seek-bar {
	-webkit-appearance: none;
	width: 100%;
	height: 5px;
	background: #77777E;
	overflow: hidden;
	cursor: pointer;
}

.seek-bar::-webkit-slider-thumb {
	-webkit-appearance: none;
	width: 1px;
	height: 20px;
	box-shadow: -400px 0 0 400px #FFFFFF;
}
.current-time,
.song-duration {
	font-size: 14px;
	display: none;
}

.song-duration {
	position: absolute;
	right: 0;
}
.controls {
	width: 40px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: auto;
	margin-top: 5px;
}

.play-btn {
	position: relative;
	width: 34px;
	height: 34px;
	cursor: pointer;
	border: none;
}

.play-btn span {
	position: absolute;
	top: 50%;
	left: 25%;
	transform: translateY(-10%);
	width: 100%;
	height: 100px;
	background: #FFFFFF;
	transition: .5s;
	clip-path: polygon(0 0, 20% 0, 20% 20%, 0% 20%);
}

.play-btn span:nth-child(2) {
	left: 55%;
	width: 100%;
	transform-origin: center;
}
.play-btn.pause span:nth-child(2) {
	transform: translateY(-50%) scaleY(0);
}

.play-btn.pause span:nth-child(1) {
	width: 50%;
	left: 50%;
	height: 50%;
	transform: translate(-50%, -50%);
	border-radius: 0;
	clip-path: polygon(0 0, 100% 50%, 100% 50%, 0% 100%);
}
/* .play-btn.pause {
	animation: pulse 2s linear infinite;
} */

/* @keyframes pulse {
	0% {
		box-shadow: 0;
	}

	50% {
		box-shadow: 0 0 0 5px rgba(255, 255, 255, 0.1);
	}

	100% {
		box-shadow: 0 0 0 5px rgba(255, 255, 255, 0.4);
	}
} */

.btn_m {
	width: 40px;
	height: 40px;
	background: #d5eebb;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	border: none;
	cursor: pointer;
	display: none;
}
@keyframes rotate {
	0% {
		transform: rotate(0);
	}

	100% {
		transform: rotate(360deg);
	}
}

/* label[for=range]{
	display: none!important;
} */

@media screen and (min-width: 600px) {
	.music-player .m_contr {
			width: 76%;
		}
}