body {
	background-color: black;
}

h1,h2,h3,h4,h5,h6 {
	line-height: 1;
}

p {
	font-size: 18px;
}

a.button {
	background-color: black;
}

a.button:hover, a.button:active {
	background-color: #3d3d3d;
}

div.header {
	background: linear-gradient(180deg, #000000a9 0%, transparent 100%);
	height: 90px; 
	z-index: 999;
	position: fixed;
	width: 100%;
}

div.header img.logo {
	max-height: 90px;
}

div.main-hero {
	background: url(../media/LPBH_Hero-NF.webp);
	height: 100vh;
	background-position: bottom;
	background-size:cover;
	position: relative;
	z-index: 0;
	padding-top: 20vh;
}

div.main-hero .main-hero-content {
	padding-left: 15px; 
	padding-right: 15px;
}

div.main-hero h1, div.main-hero h2{
	text-transform: uppercase;
	font-family: "New Amsterdam", sans-serif;
	font-weight: 400;
	font-style: normal;
	color: #fffccf;
	display: block;
	margin-bottom: 0;
	line-height: 1;
	text-shadow: #000 1px 0 20px;
}

div.main-hero h1 {
	font-size: 7rem;
}
div.main-hero h2 {
	font-size: 6rem;
}
div.main-hero h3 {
	font-family: "Oswald", sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
	text-transform: uppercase;
}
div.main-points {
	z-index: 1;
	text-align: center;
	background: linear-gradient(180deg, transparent 0%, #000000 100%);
	color: #fffccf;
}

div.main-points .middle {
	border-left: 1px solid #fffccf; 
	border-right: 1px solid #fffccf; 
}

div.main-points h3 {
	text-transform: uppercase;
	font-family: "New Amsterdam", sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: 4rem;
	color: #fffccf;
}

/** 
	Mobile! 
*/ 

/* Small only */
@media screen and (max-width: 39.9375em) {

	div.main-points {
		background-color: black;
	}
	div.main-hero {
		background: url(../media/LPBH_Hero-mobile.jpg);
		background-position: center;
	}
	div.main-points .middle {
		border: none;
	}
	div.main-hero h1 {
		font-size: 4rem;
	}
	div.main-hero h2 {
		font-size: 3rem;
	}
	div.main-hero a.button {
		margin-bottom: 5vh;
	}
}

/* Medium and up */
@media screen and (min-width: 40em) {
	div.main-hero h3 :not(.div.main-points h3){
		font-size: 2rem;
	}

}

/* Medium only */
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
	div.main-points h3 {
		font-size: 2rem;
	}

	div.main-hero {
		background: url(../media/LPBH_Hero-mobile.jpg);
		background-position: center;
		background-repeat: no-repeat;
	}

	div.main-points {
		padding-top: 25vh;
		-webkit-box-align: start;
		-webkit-align-items: flex-start;
		-ms-flex-align: start;
		align-items: flex-start;
	}
}

/* Large and up */
@media screen and (min-width: 64em) {}

/* Large only */
@media screen and (min-width: 64em) and (max-width: 74.9375em) {}