@charset "UTF-8";
/* CSS Document */
body {
	background-image:url(images/background2.jpg);
	background-size:cover;
	font-family: 'Open Sans', Verdana, Genava, sans-serif;
}
#header {
	background-image:url(images/header.png);
	background-size:cover;
	height:200px;
	width:100%;
	max-width:850px;
	margin:0 auto;
}
#container {
	width:80%;
	max-width:850px;
	margin:0 auto;
}
#nav {
	background-color:#0B0B61;
}
#nav ul {
	list-style:none;
	text-align:center;
	padding:0;
}
#nav ul li {
	display:inline-block;
	width:23%;
	background-color:#0B0B61;
}
#nav ul li a {
	color:white;
	text-decoration:none;
	display:block;
	padding:10%;
}
#nav ul li a:hover {
	background-color:lightgrey;
	color:black;
}
#content {
	color:black;
	background-color:white;
	height:auto;
	padding:3%;
	width:94%;
}
#rood {
	color:red;	
}
#blauw {
	color:#0B0B61;
}
.logo {
	display:inline-block;
	margin:7%;
	margin-top:0%;
	margin-bottom:0%;
}
.foto {
	display:inline-block;
}
.foto1 {
	display:inline-block;
}


/*--------MEDIA QUERIES----------*/

@media screen and (max-width: 480px) {  
body {
	font-size:smaller;	
}
#container {
	width:100%;
	padding:0%;
}
#header {
	background-image:url(images/header.png);
	background-size:cover;
	height:90px;
	width:100%;
	max-width:850px;
	margin:0 auto;
}
#nav {
	width:100%;
	float:none;
}
#content {
	width:100%;
	padding:2px;
	float:none;
}
#nav ul li a {
	text-decoration:none;
	color:white;
	padding:10px;
	display:block;
}
#nav ul li a:hover {
	color:white;
	background-color:#lightgrey;
}
#nav ul li {
	background-color:#0B0B61;
	display:block;
	width:100%;
}
#nav ul {
	padding:2%;	
	float:none;
}
.logo {
	display:inline-block;
	margin:0%;
	margin-top:0%;
	margin-bottom:0%;
	padding:5%;
}
.foto {
	display:inline-block;
	padding:1%;
}
.foto img {
	width:100%;
	height:auto;
}
.foto1 {
	display:inline-block;
	padding:1%;
}
.foto1 img {
	width:100%;
	height:auto;	
}
}