.content-block.image-content-block.narrow {
	padding-right: 15%;
}
.content-block.image-content-block.image-align-right.narrow {
	padding-left: 15%;
	padding-right: 5%;
}

.image-content-block .wp-block-columns {
	flex-direction: row;
	align-items: stretch !important;
}
.image-content-block.image-align-right .wp-block-columns {
	flex-direction: row-reverse;
	align-items: stretch !important;
}



.arrow-image {
	margin: 0 var(--padding-block);
	height: 100%;
	position: relative;
	z-index: 1;
}

.arrow-image::before,
.arrow-image::after {
	content: "";
	position: absolute;
	top: calc(var(--padding-block) * -0.5);
	bottom: calc(var(--padding-block) * -0.5);
	left: calc(var(--padding-block) * -1);
	width: calc(100% + var(--padding-block));
	background: url("../../assets/images/arrows/outline/left_black.svg");
	/* background-position: left bottom var(--padding-block); */
	background-position: left bottom;
	background-size: auto 90%;
	background-repeat: no-repeat;
	z-index: 0;
}
.arrow-image::after {
	left: auto;
	right: calc(var(--padding-block) * -1);
	background-image: url("../../assets/images/arrows/filled/right_blue.svg");
	/* background-position: right top var(--padding-block); */
	background-position: right top;
}

.arrow-image-image {
	position: relative;
	z-index: 1;
	width: 100%;
	height: 100%;
	/* padding: 35% 0; */
	display: block;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}




.single-project .arrow-image {
	height: auto;
}
.single-project .arrow-image .arrow-image-image {
	height: auto;
	padding: 35% 0;
}




/*  **********  Arrow Colours  **********  */

.image-align-right .arrow-image::before {
	background-image: url("../../assets/images/arrows/filled/left_black.svg");
}
.image-align-right .arrow-image::after {
	background-image: url("../../assets/images/arrows/outline/right_blue.svg");
}

.background-dark .arrow-image::before {
	background-image: url("../../assets/images/arrows/filled/left_blue.svg");
}
.background-dark .arrow-image::after {
	background-image: url("../../assets/images/arrows/outline/right_white.svg");
}




@media screen and (max-width: 1200px) {

	.arrow-image-image {
		/* padding: 50% 0; */
	}

}




@media screen and (max-width: 800px) {

	.content-block.image-content-block.narrow,
	.content-block.image-content-block.image-align-right.narrow {
		padding-left: 5%;
	}
	.content-block.image-content-block .wp-block-column.content h2.underline::after {
		left: 50%;
		margin-left: -15px;
	}

	.arrow-image-image {
		padding: 25% 0;
		position: relative;
	}

}