/* Erweiterung - Audio */

.mw-audio-container {
	margin-left: auto;
	margin-right: auto;
	max-width: 900px;
}
.mw-audio {
	background: #EBEFEF;
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 28px 22px;
	padding-bottom: 28px;
	padding-top: 28px;
	position: relative;
}
.mw-audio .image {
	aspect-ratio: 1 / 0.59;
	background-repeat: no-repeat;
	display: block;
	margin: 0 auto;
	max-width: 281px;
	position: relative;
	width: 100%;
}
.mw-audio .content {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding-top: 16px;
	position: relative;
	width: 100%;
}
.mw-audio .content .title {
	font: 400 24px / 22px var(--mw-font-secondary);
}
.mw-audio .content .text {
	font: 16px / 22px var(--mw-font-primary);
}
.mw-audio .content .audio {
	background: #80918E;
	border-radius: 100vw;
	max-width: 370px;
	width: 100%;
}
.mw-audio .content .audio audio {
	border-radius: 100vw;
	display: block;
	max-width: 370px;
	width: 100%;
}
.mw-audio .content .audio audio::-webkit-media-controls-enclosure {
  background-color: transparent;
}
.mw-audio .content .audio audio::-webkit-media-controls-panel,
.mw-audio .content .audio audio::-webkit-media-controls-mute-button,
.mw-audio .content .audio audio::-webkit-media-controls-play-button,
.mw-audio .content .audio audio::-webkit-media-controls-timeline-container,
.mw-audio .content .audio audio::-webkit-media-controls-current-time-display,
.mw-audio .content .audio audio::-webkit-media-controls-time-remaining-display,
.mw-audio .content .audio audio::-webkit-media-controls-timeline,
.mw-audio .content .audio audio::-webkit-media-controls-volume-slider-container,
.mw-audio .content .audio audio::-webkit-media-controls-volume-slider,
.mw-audio .content .audio audio::-webkit-media-controls-seek-back-button,
.mw-audio .content .audio audio::-webkit-media-controls-seek-forward-button,
.mw-audio .content .audio audio::-webkit-media-controls-fullscreen-button,
.mw-audio .content .audio audio::-webkit-media-controls-rewind-button,
.mw-audio .content .audio audio::-webkit-media-controls-return-to-realtime-button,
.mw-audio .content .audio audio::-webkit-media-controls-toggle-closed-captions-button {
	filter: brightness(0) invert(1);
}

@media all and (min-width: 600px){
	.mw-audio {
		flex-direction: row;
	}
	.mw-audio .image {
		margin: 0;
	}
	.mw-audio .content {
		padding: 16px;
	}
}