.entry-hero {
	height: rem-calc(200);
	background-position: center center;
	background-size: cover;

	@include breakpoint(medium up) {
		height: rem-calc(400);
	}

	@include breakpoint(large up) {
		height: rem-calc(600);
	}

	.entry-hero-content {
		display: block;
		position: relative;
		width: 100%;
	}

	.entry-hero-inner {
		position: absolute;
		top: 75%;
		left: 50%;
		transform: translate(-50%,-50%);
		background-color: rgba(0,0,0,0.5);
		color: $white;
		padding: rem-calc(10 20);
	}

	.entry-hero-title {
		text-align: center;
	}
}

.container-body-boxed,
.container-page-boxed,
.container-post-boxed,
.container-singular-boxed {
	.entry-hero {
		@include flex-grid-row();
	}
}