h1 {
	margin-bottom: 0;
}
.banner {
	display: block;
}
.text-center {
	text-align: center;
}
.grey-bg {
	background-color: #E8E8E8;
	padding: 1rem 2rem;
}
.flex-container {
	display: flex;
}
h2, h3, h4 {
	font-size: 3rem;
	font-family: 'Open Sans Condensed', sans-serif;
	font-family: 'Open Sans Condensed ExtraBold', sans-serif;
	
	text-transform: uppercase;
}
h2 {
	max-width: 500px;
	margin: 3rem auto 0;
	font-size: 5rem;
	line-height: 5rem;
}
img.product {
	display: block;
	width: 565px;
	width: 500px;
	margin: 3rem auto;
	position: relative;
	z-index: 1; /* owv pulse anim erachter */
	left: 80px;
}
h3.subtitle {
	font-size: 2.2rem;
	line-height: 3rem;
}
.inner_content p {
	font-size: 1.2em;
	line-height: 1.4em;
}
h3.steps-intro {
	font-size: 1.4rem;
	line-height: 2rem;
}
.steps {
	gap: 3rem;
	background: #1d1d1d;
	color: #fff;
	margin: 1rem 0 2rem 0;
	padding: 2rem;
}
.steps > div {
	width: 33.33%;
}
.steps h4 {
	font-size: 1rem;
	font-weight: 400;
}
.steps .icon {
	max-width: 60%;
}
.steps p {
	margin: 0;
	font-size: .9rem;
	line-height: 1.2rem;
	color: #f4f4f4;
}


/* !PULSE ANIM */
#pulse_container {
	background: #45453f;
	position: relative;
	top: 50px;
	left: 36%;
	
	/* bugfix voor kleinere schermen, anders groeit viewport in/uit in de breedte tijdens anim */
	display: inline-block;
	left: auto;
	width: 20px;
	margin-left: -300px;
}
#pulse_container .pulse {
	width: 10px;
	height: 10px;
	border: 5px solid #f7f14c;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	border-radius: 30px;
	background-color: #716f42;
	z-index: 10;
	position: absolute;
}
#pulse_container .dot,
#pulse_container .dot2 {
	/*border: 10px solid #fff601;*/
	border: 10px solid #fff;
	background: transparent;
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	border-radius: 100%;
	height: 340px;
	width: 340px;
	
	-webkit-animation: pulse_custom 3s ease-out;
	-moz-animation: pulse_custom 3s ease-out;
	-o-animation: pulse_custom 3s ease-out;
	animation: pulse_custom 3s ease-out;
	
	-webkit-animation-iteration-count: infinite;
	-moz-animation-iteration-count: infinite;
	-o-animation-iteration-count: infinite;
	animation-iteration-count: infinite;
	
	position: absolute;
	top: -25px;
	left: -25px;
	z-index: 1;
	opacity: 0;
}
#pulse_container .dot2 {
	-webkit-animation-delay: .2s;
	-moz-animation-delay: .2s;
	-o-animation-delay: .2s;
	animation-delay: .2s;
}
/* Pulse custom (straling) */
/* https://codepen.io/danest/pen/GxfqB */
@-webkit-keyframes "pulse_custom"
{
	0% {-webkit-transform: scale(0);opacity: 0.0;}
	25% {-webkit-transform: scale(0);opacity: 0.1;}
	50% {-webkit-transform: scale(0.1);opacity: 0.3;}
	75% {-webkit-transform: scale(0.5);opacity: 0.5;}
	100% {-webkit-transform: scale(1.2);opacity: 0.0;}
}
@-moz-keyframes pulse_custom
{
	0% {-moz-transform: scale(0);opacity: 0.0;}
	25% {-moz-transform: scale(0);opacity: 0.1;}
	50% {-moz-transform: scale(0.1);opacity: 0.3;}
	75% {-moz-transform: scale(0.5);opacity: 0.5;}
	100% {-moz-transform: scale(1.2);opacity: 0.0;}
}
@-o-keyframes pulse_custom
{
	0% {-o-transform: scale(0);opacity: 0.0;}
	25% {-o-transform: scale(0);opacity: 0.1;}
	50% {-o-transform: scale(0.1);opacity: 0.3;}
	75% {-o-transform: scale(0.5);opacity: 0.5;}
	100% {-o-transform: scale(1.2);opacity: 0.0;}
}
@keyframes pulse_custom
{
	0% {transform: scale(0);opacity: 0.0;}
	25% {transform: scale(0);opacity: 0.1;}
	50% {transform: scale(0.1);opacity: 0.3;}
	75% {transform: scale(0.5);opacity: 0.5;}
	100% {transform: scale(1.2);opacity: 0.0;}
}