.bannerheader {
	background-color: #D8B528;
	display: flex;
	flex-direction: column;
	position: relative;
	margin-bottom: 40px;
}

.bannerheader p.smallheading {
	font-weight: 300;
	font-size: 16px;
	line-height: 20px;
	color: #020873;
}

.bannerheader h1 {
	font-weight: 400;
	font-size: 24px;
	line-height: 1.25;
	margin: 0;
	color: #FFFFFF;
}

.bannerheader .wrapper div {
	padding-top: 24px;
	width: 100%;
}

.bannerheader .wrapper {
	flex: 1;
	display: flex;
	position: relative;
}

.bannerheader .wrapper b {
	display: block;
	display: flex;
	flex-direction: column;
	width: auto;
	position: relative;
}

.bannerheader .wrapper b>img {
	position: relative;
	display: block;
	width: auto;
	object-position: left center;
	height: 300px;
}

.bannerheader b::after {
	display: block;
	content: "";
	height: 100%;
	width: calc((100vw - 1400px) / 2);
	position: absolute;
	top: 0;
	right: 1px;
	background: #020773;
	width: 50vw;
	transform: translateX(100%);
}

@media all and (min-width: 600px) {
	.bannerheader .wrapper div {
		padding-top: 48px;
		width: calc((((100% - (11 * 20px)) / 12) * 6) + (5 * 20px));
		margin: 0 0 0 calc((((100% - (11 * 20px)) / 12) * 1) + (1 * 20px));
	}
	.bannerheader h1 {
		font-size: 36px;
	}
}

@media all and (max-width: 899px) {
	.bannerheader .wrapper {
		flex-wrap: wrap;
		min-height: 230px;
	}
	.bannerheader .wrapper div {
		width: auto;
		width: 50%;
		padding-bottom: 24px;
	}
	.bannerheader .wrapper b {
		width: 45%;
		height: 100%;
		display: block;
		position: absolute;
		bottom: 0;
		right: -24px;
	}
	.bannerheader .wrapper b>img {
		height: 100%;
		width: 100%;
		object-fit: cover;
		object-position: left center;
	}
	.bannerheader b::after {
		display: none;
	}
}

@media all and (max-width: 599px) {
	.bannerheader .wrapper {
		min-height: 160px;
	}
}

@media all and (max-width: 449px) {
	.bannerheader .wrapper {
		min-height: 120px;
	}
	.bannerheader .wrapper b {
		width: 60%;
	}
}

@media all and (min-width: 900px) {
	.bannerheader .wrapper div {
		width: calc((((100% - (11 * 20px)) / 12) * 5) + (4 * 20px));
		margin: 0 0 0 calc((((100% - (11 * 20px)) / 12) * 2) + (2 * 20px));
	}
}

@media all and (min-width: 1200px) {
	.bannerheader .wrapper div {
		padding-top: 36px;
		width: calc((((100% - (11 * 20px)) / 12) * 4) + (3 * 20px));
		margin: 0 0 0 calc((((100% - (11 * 20px)) / 12) * 3) + (3 * 20px));
	}
	.bannerheader h1 {
		font-size: 48px;
	}
}

@media all and (min-width: 1400px) {
	.bannerheader .wrapper div {
		padding-top: 56px;
	}
}

@media all and (-ms-high-contrast:none) {
	.bannerheader .wrapper b,
	.bannerheader .wrapper b img,
	.bannerheader {
		height: 300px;
	}
}

@media all and (-ms-high-contrast:none) and ( max-width: 899px) {
	.bannerheader .wrapper b {
		display: none;
	}
	.bannerheader {
		height: auto !important;
		min-height: 150px
	}
}