/*
.grid-container {
	display: flex;
	flex-wrap: wrap;
}
*/

:root {
	--theme-grid-width: 960px;
}

.grid-container.vw-full {
	position: relative;
	left: 50%;
	width: 100vw;
	transform: translateX(-50%);
}

.grid-container.has-bg-image.wp-image {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: var(--temp-left) var(--temp-top);
	aspect-ratio: var(--temp-aspect-ratio);
}
.grid-container.has-bg-image.wp-image > .wrap > .row {
	height: 100%;
}

.grid-container .row {
	--bs-gutter-x: 1.5rem;
	--bs-gutter-y: 0;
}

.grid-container .swap-dummy.src {
	width: 100%;
}

.grid-container.has-bg-color,
.grid-container.has-bg-image {
	/*
	margin-left: -50vw;
	margin-right: -50vw;
	position: relative;
	left: 50%;
	right: 50%;
	width: 100vw;
	*/
	padding-top: 30px;
	padding-bottom: 30px;
}
.grid-container.has-bg-color {
	background-color: var(--bg-color);
}
.grid-container.has-bg-image {
	background-image: var(--bg-image);
	background-repeat: repeat-x;
	background-position: center center;
}
	.grid-container.has-bg-color .wrap,
	.grid-container.has-bg-image .wrap {
	    max-width: var(--theme-grid-width);
	    margin: 0 auto;
	    position: relative;
	    height: 100%;
	}
	
@media (max-width: 768px) {
	.grid-container .row {
		--bs-gutter-y: 25px;
	}
	.grid-container.has-bg-color,
	.grid-container.has-bg-image {
		padding-left: 20px;
		padding-right: 20px;
	}
	
	.grid-container.has-bg-image.wp-image {
		background-image: none;
	}
	.grid-container.has-bg-image.wp-image .wrap {
	    height: auto;
	}
	.grid-container.has-bg-image.wp-image h2::after {
		content: "";
		display: block;
		background-image: var(--bg-image);
		background-repeat: no-repeat;
		background-size: cover;
		background-position: var(--temp-mobile-left) var(--temp-mobile-top);
		height: var(--temp-mobile-height);
		margin: 20px auto;
    	aspect-ratio: var(--temp-mobile-aspect-ratio);
	}
}