/* Cemacon Audio Widget Styles */

.cemacon-audio-holder {
	--cemacon-audio-bg-color: #f1f1f1;
	--cemacon-audio-time-color: #949494;
	--cemacon-audio-time-value-color: #5b5b5b;
	--cemacon-audio-rail-bg-color: #fff;
	--cemacon-audio-rail-progress-color: #ABB8C3;
	--cemacon-audio-font-body: Ubuntu, sans-serif;

	margin-bottom: 30px;
}

.cemacon-audio-holder .cemacon-audio {
	max-width: 100%;
}

.cemacon-audio-holder .mejs-container.mejs-audio {
	height: 68px !important;
	background: var(--cemacon-audio-bg-color);
}
.cemacon-audio-holder .mejs-container .mejs-controls {
	box-sizing: border-box;
	height: 68px;
	background: transparent;
	padding: 0 15px;
}
.cemacon-audio-holder .mejs-container .mejs-controls .mejs-button {
	display: table;
	height: 68px;
	padding-right: 10px;
}
.cemacon-audio-holder .mejs-controls .mejs-button button {
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: center;
	display: table-cell;
	height: 68px;
	width: 100%;
	vertical-align: middle;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	text-align: center;
	text-transform: none;
	letter-spacing: normal;
	font-size: 0;
	position: inherit;
}
.cemacon-audio-holder .mejs-controls .mejs-button button:focus {
	outline: none;
}
.cemacon-audio-holder .mejs-controls .mejs-play button {
	background-image: url(img/audio/play.png);
}
.cemacon-audio-holder .mejs-controls .mejs-pause button {
	background-image: url(img/audio/pause.png);
}
.cemacon-audio-holder .mejs-controls .mejs-mute button {
	background-image: url(img/audio/sound.png);
}
.cemacon-audio-holder .mejs-controls .mejs-unmute button {
	background-image: url(img/audio/mute.png);
}
.cemacon-audio-holder .mejs-container .mejs-controls .mejs-time {
	font-size: 15px;
	color: var(--cemacon-audio-time-color);
	display: table;
	height: auto;
	padding: 0 10px 0 0;
}
.cemacon-audio-holder .mejs-time .mejs-currenttime,
.cemacon-audio-holder .mejs-time .mejs-duration {
	display: table-cell;
	width: 100%;
	height: 100%;
	vertical-align: middle;
	color: var(--cemacon-audio-time-value-color);
	font-size: 14px;
	letter-spacing: -0.2px;
	font-family: var(--cemacon-audio-font-body);
}
.cemacon-audio-holder .mejs-controls .mejs-time-rail {
	padding: 0 10px 0 0;
	height: 68px;
}
.cemacon-audio-holder .mejs-controls .mejs-time-rail .mejs-time-total {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	margin: 0 5px;
}
.cemacon-audio-holder .mejs-controls .mejs-time-rail .mejs-time-total,
.cemacon-audio-holder .mejs-controls .mejs-time-rail .mejs-time-loaded,
.cemacon-audio-holder .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total {
	background-color: var(--cemacon-audio-rail-bg-color);
}
.cemacon-audio-holder .mejs-controls .mejs-time-rail .mejs-time-current,
.cemacon-audio-holder .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current {
	background: var(--cemacon-audio-rail-progress-color);
}
.cemacon-audio-holder .mejs-controls a.mejs-horizontal-volume-slider {
	height: 68px;
}
.cemacon-audio-holder .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total,
.cemacon-audio-holder .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current {
	top: 50%;
	transform: translateY(-50%);
}
