header {
	background: none;
	margin-bottom: 492px; /* hero minus header for zero margin e.g. 800 - 308 = 492px */
	margin-bottom: calc(492px + 65px);
	background-image: url(../_img/home/home_header_BG.png);
	background-position: center bottom;
	background-repeat: no-repeat;
	position: relative;
	z-index : 6;
}
header .container {
	
}

.wrapper--hero {
	height: 800px;	
	position: absolute;
	top: 0px;
	width: 100%;
	padding: 0 !important;
}
.wrapper--hero.wrapper--padding_vert_large,
.wrapper--hero.wrapper--bg.wrapper--padding_vert_large {
	padding: 0 !important;
}
.wrapper--hero .container {
	
}

.wrapper--hero .section {
	height: 800px;
}

.wrapper--hero .column {
	align-self: flex-end; /* aligns to bottom */
}

.wrapper--hero .content {
	padding-bottom: 80px;
	max-width: 690px;
	margin: 0 auto;
	
}
.wrapper--hero .content h2 {
	font-size: 42px;
	line-height: 50px;
	font-weight: 500;
	color: #fff;
	padding-bottom: 40px;
}


@media (max-width: 940px) {
	header {
		background: none;
		margin-bottom: 0;
		
	}
	.wrapper--hero {
		position: relative;
		height: auto;
		
	}
	.wrapper--hero .section {
		display: flex;	
		height: auto;
		min-height: calc(100vh - 144px);
	}
	
	.wrapper--hero .column {
		align-self: center; /* aligns to middle */
	}
	.wrapper--hero .content {
		padding-bottom: 0;
	}
}

@media (max-width: 740px) {
	.wrapper--hero .section {
		min-height: calc(100vh - 153px);
	}
	
	/* for smaller screens, change line breaks for better wrapping  */
	.wrapper--hero .content h2 br{content:' ';}
	.wrapper--hero .content h2 br:after{content:' ';}
	
	.wrapper--hero .content h2 {
		font-size: 36px;
		line-height: 46px;
		padding-bottom: 40px;
	}


}