/**
 * Technologie Page
 */

.page-technologie,
.page-technology {
	position: relative;
}

body.page-technologie,
body.page-technology {
	border-top: 1px solid black;
}

.page-technologie::before,
.page-technology::before {
	content: '';
	position: absolute;
	inset: 0;
	background-image: url('../../images/background.jpg');
	background-repeat: repeat;
	opacity: 0.5;
	z-index: -1;
	pointer-events: none;
}

.page-technologie .pyrum-footer-bg-wrapper,
.page-technology .pyrum-footer-bg-wrapper {
	border-top: 1px solid black;
}

@media (max-width: 1024px) {
	/* !important überschreibt den flex-wrap:nowrap, den Gutenberg
	   pro Block-Instanz per generierter .wp-container-* Klasse setzt. */
	.technologie-container {
		flex-wrap: wrap !important;
	}
}

.technologie-svg {
	width: 100%;
	height: auto;
	max-width: 912px;
}

.technologie-svg .safe-svg-inside {
	width: 100% !important;
	height: auto !important;
}

@media (max-width: 782px) {
	.technologie-svg {
		width: 100%;
		height: auto;
		overflow-x: scroll;
		scrollbar-width: thin;
		scrollbar-color: #8cbf94 #deefdf00;

		& .wp-block-safe-svg-svg-icon {
			width: 200%;
		}
	}

	.technologie-svg::-webkit-scrollbar {
		height: 8px;
	}

	.technologie-svg::-webkit-scrollbar-track {
		background: #deefdf00;
		border-radius: 6px;
	}

	.technologie-svg::-webkit-scrollbar-thumb {
		background: #8cbf94;
		border-radius: 6px;
	}
}

@media (max-width: 782px) {
	.quad-videos video {
		aspect-ratio: 16 / 9 !important;
		object-fit: cover;
	}
}

@media (min-width: 783px) {
	.quad-videos video {
		aspect-ratio: 1 !important;
		object-fit: cover;
	}
}