.ps-mc-media {
	margin: var(--ftps-media-content-gap) 0;
}

.media-content-inner {
	margin: 0 auto;
	max-width: var(--ftps-media-content-max-width);
}

.page-section-media-content {
	margin-left: var(--ftps-media-content-gap);
	margin-right: var(--ftps-media-content-gap);
}

/* At some point the media/content get next to eachother */
@media(min-width: 48.5em){

	.ftps-media-content-container {
		display: flex;
		align-items: center;
		margin: 0 calc( -1 * var(--ftps-media-content-col-padding) );
	}

	.media-side-right .ftps-media-content-container {
		flex-direction: row-reverse;
	}

	.media-content-media,
	.media-content-content {
		max-width: 50%;
		min-width: 50%;
		padding: 0 var(--ftps-media-content-col-padding);
	}

}

@media only screen and (min-width: 50em) { 	/* 800px */

	.media-content-inner {
		max-width: var(--ftps-media-content-max-width);
	}

	/* start to display side-by-side */
	.ps-mc-wrapper {
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin: 0 calc( -1 * var(--ftps-media-content-gap) );
	}

	/* side of media can be overridden */
	.ps-mc-media-right .ps-mc-wrapper {
		flex-direction: row;
	}

	.ps-mc-media-left .ps-mc-wrapper {
		flex-direction: row-reverse;
	}

	.ps-mc-content {
		width: 50%;
		min-width: 50%;
		max-width: 50%;
		padding: 0 var(--ftps-media-content-gap);
	}

	.ps-mc-media {
		margin: 0;
		width: 50%;
		min-width: 50%;
		max-width: 50%;
		padding: 0 var(--ftps-media-content-gap);
	}

}