{{#if data.featuredImage && data.featuredImage != postPreviewFallbackImage}}
<style>
	.post-header {
		background-image: url("{{data.featuredImage}}");
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center;
	}
	.post-header .overlay {
		background-color: rgba(0, 0, 0, 0.5);
	}
	.post-header .overlay h1,
	.post-header .overlay h2 {
		color: #fff;
	}
	@media (min-width: 48em) {
		.post-header .overlay {
			display: inline-block;
			width: 50%;
		}
	}
</style>

<div class="header post-header">
	<div class="overlay">{{include("themes/default/components/header-headings.html")}}</div>
</div>
{{#else}}
<div class="header">{{include("themes/default/components/header-headings.html")}}</div>
{{/if}}