.page-section--style-rightangled .page-section-aside,
.page-section--style-leftangled .page-section-aside
{
	display: block;
}


/* Mobile specific */
@media only screen and (max-width: 899px) {
	/*  Angled image style image */
	.page-section--style-rightangled .page-section-container, .page-section--style-leftangled .page-section-container {
		display: flex;
		flex-direction: column-reverse;
		padding: 0px;
	}

	.page-section--style-rightangled .page-section-content, .page-section--style-leftangled .page-section-content {
		padding: 25px;
	}

	.page-section--style-rightangled .page-section-aside, .page-section--style-leftangled .page-section-aside {
		height: 100vw;
		position: relative;
	}

		.page-section--style-rightangled .page-section-aside::before, .page-section--style-leftangled .page-section-aside::before {
			content: '';
			display: block;
			position: absolute;
			right: 0px;
			left: 0px;
			top: 0px;
			bottom: 0px;
			background-image: var(--background-image);
			background-size: cover;
			background-position: center center;
			clip-path: polygon(0 50%,50% 0, 100% 20%, 100% 100%, 0 100%);
		}

		.page-section--style-rightangled .page-section-aside::after, .page-section--style-leftangled .page-section-aside::after {
			content: '';
			display: block;
			background: linear-gradient(90deg, #4F0077 0%, var(--primary-color) 100%);
			position: absolute;
			top: 0%;
			left: 0px;
			height: 50%;
			width: 50%;
			z-index: -1;
			clip-path: polygon(0% 50%,100% 15%, 100% 100%, 0% 100%);
		}
}


/* Desktop specific */
@media only screen and (min-width: 900px) {

	/*  Angled image left aligned */
	.page-section--style-rightangled .page-section-container {
		display: flex;
		flex-direction: row-reverse;
		min-height: 710px;
		padding: 0;
		gap: 100px;
	}

	.page-section--style-rightangled .page-section-aside {
		position: relative;
		flex: 1;
	}

	.page-section--style-rightangled .page-section-content {
		flex: 1;
		padding: 5em;
		display: flex;
		flex-direction: column;
		justify-content: center;
	}

	.page-section--style-rightangled .page-section-aside::before {
		content: '';
		display: block;
		position: absolute;
		right: 0px;
		left: 0px;
		top: 0px;
		bottom: 0px;
		background-image: var(--background-image);
		background-size: cover;
		background-position: center center;
		clip-path: polygon(13% 0,100% 0, 100% 100%, 50% 100%, 0 50%);
	}

	.page-section--style-rightangled .page-section-aside::after {
		content: '';
		display: block;
		background: linear-gradient(0deg, #4F0077 0%, var(--primary-color) 100%);
		position: absolute;
		bottom: 0px;
		right: 0px;
		height: 50%;
		width: 100%;
		z-index: -1;
		clip-path: polygon(10% 0,100% 0, 100% 100%, 25% 100%);
	}

	/*  Angled image right aligned */

	.page-section--style-leftangled .page-section-container {
		display: flex;
		flex-direction: row;
		min-height: 710px;
		padding: 0;
		gap: 100px;
	}

	.page-section--style-leftangled .page-section-aside {
		position: relative;
		flex: 1;
	}

	.page-section--style-leftangled .page-section-content {
		flex: 1;
		padding: 5em;
		display: flex;
		flex-direction: column;
		justify-content: center;
	}


	.page-section--style-leftangled .page-section-aside::before {
		content: '';
		display: block;
		position: absolute;
		right: 0px;
		left: 0px;
		top: 0px;
		bottom: 0px;
		background-image: var(--background-image);
		background-size: cover;
		background-position: center center;
		clip-path: polygon(0 0,87% 0,100% 50%,50% 100%,0 100%);
	}

	.page-section--style-leftangled .page-section-aside::after {
		content: '';
		display: block;
		background: linear-gradient(0deg, #4F0077 0%, var(--primary-color) 100%);
		position: absolute;
		bottom: 0px;
		right: 0px;
		height: 50%;
		width: 100%;
		z-index: -1;
		clip-path: polygon(0 0,90% 0,75% 100%,0 100%);
	}

}