.video-player {
	--plyr-color-main: var(--primary-color-500);
	
	position: relative;
	padding-top: var(--space-8);
	margin-bottom: var(--space-12);
}

.video-player.content-width {
	max-width: var(--width-base);
	margin-inline: auto;
	padding: 0 var(--space-5);
}

.video-player .title {
	margin: 0 var(--space-3) var(--space-6) var(--space-3);
	font-size: var(--text-2xl);
	font-weight: var(--font-weight-bold, 700);
	color: var(--plyr-color-main);
}

.video-player .plyr__control--overlaid {
	border: 3px solid var(--plyr-video-control-color, var(--white));
	background: var(--plyr-video-control-background-hover,var(--plyr-color-main,var(--plyr-color-main,rgba(0, 0, 0, .7))));
}

.video-player .plyr--video .plyr__control.plyr__tab-focus,
.video-player .plyr--video .plyr__control:hover,
.video-player .plyr--video .plyr__control[aria-expanded="true"] {
	background: var(--plyr-video-control-background-hover,var(--plyr-color-main,var(--plyr-color-main,var(--black))));
	color: var(--plyr-video-control-color-hover,var(--white));
}

:is(#slideshow-container, #main-content) > div:first-child .video-player {
	padding-top: unset;
}