html, body{
	min-height: 100%;
	padding:0;
	margin:0;
}
.background-container{
	position: relative;
	height: 90vh;
	width: 100%;
	background-color: rgba(0,0,0,0.8);
}
.background{
	position: absolute;
	top:0;
	left:0;
	width: 100%;
	height: 100%;
	background-image: url('../img/ware-in-ontwikkeling.jpg');
	background-position: center center;
	background-size: cover;
	opacity:0.75;
}

.background-image {
-webkit-animation: fadein 2s; /* Safari and Chrome */
-moz-animation: fadein 2s; /* Firefox */
-ms-animation: fadein 2s; /* Internet Explorer */
-o-animation: fadein 2s; /* Opera */
animation: fadein 2s;
}
@keyframes fadein{
from{opacity:0;}
to{opacity:0.75;}
}
/* Firefox */
@-moz-keyframes fadein{
from{opacity:0;}
to{opacity:0.75;}
}
/* Safari and Chrome */
@-webkit-keyframes fadein {
from{opacity:0;}
to{ opacity:0.75;}
}
/* Internet Explorer */
@-ms-keyframes fadein {
from{opacity:0;}
to{ opacity:0.75;}
}
/* Opera */
@-o-keyframes fadein {
from{opacity:0;}
to{opacity:0.75;}
}

body{
	font-family: 'Merriweather', serif;
	font-size: 16px;
	line-height: 120%;
	color: #454545;
}

/* LOGO */
.logo{
	position: fixed;
	top:40px;
	left:40px;
	height: 96px;
	width: 400px;
	background-image: url('../img/logo-ware-communicatie.svg');
	background-position: center center;
	background-size: 100%;
}

/* TEXT */
.tekst-container{
	position: relative;
	display: table;
	height: 90vh;
	width: 100%;
}
.tekst-container .tekst{
	display: table-cell; 
	vertical-align: middle; 
	padding: 0 30%;
}
.tekst-container .tekst h1{
	color: white;
	text-align: center;
	font-weight: 700;
	font-size: 48px;
	line-height: 100%;
}

/* 1200PX */
@media (max-width: 1200px) { 
	.tekst-container .tekst{
		padding: 0 15%;
	}
}

/* 500PX */
@media (max-width: 500px) { 
	.background-container{
		height: 84vh;
	}
	.tekst-container .tekst{
		padding: 0 5%;
	}
	.tekst-container .tekst h1{
		font-size: 32px;
	}
	.logo{
		top:20px;
		left:20px;
		height: 72px;
		width: 300px;
	}
}