/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Handling Updates
-----------------------------------------------------------------*/
.hero-diagonal { position: relative; }

.hero-diagonal::before {
	content: '';
	position: absolute;
	top: -50px;
	left: 0;
	width: 100%;
	height: calc(100% + 100px);
	-webkit-clip-path: polygon(0 9%, 100% 0%, 100% 91%, 0 100%);
	clip-path: polygon(0 9%, 100% 0%, 100% 91%, 0 100%);
	background-image: linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.4)), url('../images/section.jpg');
	background-position: center center;
	background-size: cover;
}