*	{
	font-family:	monospace;
}
a	{
	color:	#dd8;
}
a:hover	{
	color:	#df7;
}
body	{
	margin:	0;
	color:	white;
}

.login	{
	text-align: right;
	border:		1px solid black;
	float: right;
	width: auto;
	padding:	10px 10px 10px 10px;
	background-color:	#333;
	font-size:	15px;
	position:	fixed;
	right:	0;
	z-index: 100;
}
header	{
	background-image:	url("img/bg_header1.jpg");
	background-size:	cover;
	background-repeat:	no-repeat;
	background-attachment:	fixed;
	background-position: center top;
	height:	500px;
}
header h1		{
	font-size:	72px;
	padding: 170px 0 100px 0;
	text-align:	center;
	margin:	0;
}
header h2		{
	font-size:	50px;
	text-align:	center;
}
@media screen and (max-width: 820px)	{
	header	{
		background-image:	url("img/bg_header3.jpg");
		height: 350px;
	}
	header h1 {
		font-size: 50px;
	}
	header h2		{
		font-size:	40px;
	}
}
@media screen and (max-width: 600px)	{
	header	{
		background-image:	url("img/bg_header3.jpg");
		height: 250px;
	}
	header h1 {
		font-size: 35px;
	}
	header h2		{
		font-size:	30px;
	}
}
@media screen and (max-width: 350px)	{
	header	{
		background-image:	url("img/bg_header3.jpg");
		/*background-size: 350px auto;*/
		height: 150px;
	}
	header h1 {
		font-size: 25px;
		padding: 70px 0 0 0;
	}
	header h2		{
		font-size:	20px;
	}
}
h1 a	{
	color:	white;
	text-decoration:	none;
}

nav		{
	background-image:	linear-gradient(to bottom right, #050505, #353555);
	width:	100%;
	padding:	70px 0 70px 0;
}
nav.newnav	{
	padding: 60px 0 148px 0; /* 2 times a padding plus font size */
}
nav.newnav ul 	{
	list-style-type:	none;
	background-color:	#484;
	width:	100%;
	padding: 0 0 0 0;
	margin:	0;
}
nav.newnav li	{
	float:	left;
	width:	33.333%;
	text-align:	center;
}
nav.newnav a 	{
	display: block;
	border:	1px solid black;
	padding:	30px 0 30px 0;
	background-color:	#6495cc;
	text-decoration: none;
	font-size:	28px;
	transition:	background-color 0.2s;
	transition:	color 0.2s;
	color:	#444;
	border-radius:	0;
}
nav.newnav a:hover	{
	background-color:	#1E90ED;
	color:	#BDB76B;
}
@media screen and (max-width: 1000px) {
	nav.newnav	{
		padding: 60px 0 60px 0; /* 2 times a padding plus font size */
	}
	nav.newnav li	{
		float:	none;
		width:	100%;
	}
	nav.newnav a 	{
		font-size:	24px;
	}
}

.expl1	{
	text-align:	center;
	font-size:	35px;
	min-height:	300px;
	width:	80%;
	padding:	10% 10% 5% 10%;
	background-image:	url("img/bg_expl1.jpg");
	background-size:	cover;
	background-repeat:	no-repeat;
	background-attachment:	fixed;
	background-position: 20% 0;
}
@media screen and (max-width: 350px)	{
	.expl1	{
		font-size:	15px;
	}
}

form.entry	{
	margin:	0;
	min-height:	300px;
	padding:	2% 2% 2% 10%;
	background-image:	url("img/bg_entry2.jpg");
	background-size:	cover;
	background-repeat:	no-repeat;
	background-attachment:	fixed;
	font-size:	20px;
	color:	white;
	text-shadow: 0px 0px 5px black;
	background-position: center top;
}
form.entry div	{
	padding: 10px;
}
input[type="text"]	{
	width:	20%;
	min-width:	200px;
	box-sizing:	border-box;
	font-size:	20px;
	padding:	10px;
	transition:	width 0.4s;
}
input[type="text"]:focus	{
	width:	35%;
	border-bottom:	4px solid #9f3;
}
textarea	{
	resize: vertical;
	font-size:	18px;
	padding:	10px;
	max-width:	90%
}
textarea:focus	{
	border-bottom:	4px solid #9f3;
}
input[type="submit"]	{
	color: white;
	background-color: black;
	border: 4px solid white;
	border-radius: 8px;
	font-size: 15px;
	padding: 8px 15px 8px 15px;
}
input[type="submit"]:hover	{
	background-color:	#333;
	cursor:	pointer;
}

div.adminlogin	{
	margin:	0;
	min-height:	200px;
	padding:	2% 2% 2% 10%;
	background-image:	url("img/bg_login2.jpg");
	background-size:	cover;
	background-repeat:	no-repeat;
	background-attachment:	fixed;
	font-size:	20px;
}
.adminlogin input[type="text"]	{
	width:	300px;
	box-sizing:	border-box;
	font-size:	18px;
	padding:	10px;
}
.adminlogin input[type="password"]	{
	width:	300px;
	box-sizing:	border-box;
	font-size:	18px;
	padding:	10px;
}
.adminlogin td	{
	padding: 0 20px 10px 0;
}

div.mess	{
	margin:	0;
	min-height:	200px;
	padding:	2% 2% 2% 5%;
	color:	#aaa;
	background-image:	linear-gradient(to bottom right, #ddf, #555);
	background-size:	cover;
	background-repeat:	no-repeat;
	background-attachment:	fixed;
}

.mess table, .adm table	{
	background-color:	#333;
	opacity:	0.8;
	cursor:	default;
	width:	80%
}
.qq	{
	padding:	5px 0 20px 10px;
}
.infoit	{
	padding:	5px;
}
.qans	{
	font-style:	italic;
	padding:	10px;
	border:		1px dashed #444;
}
.mess .qans::before	{
	content: "Antwoord van Ivar:\A";
	white-space:	pre;
}
.mess .qans::first-line	{
	color:	#888;
}
.mess tr:nth-child(even), .adm tr.qitem:nth-child(even)	{
	background-color:	#555;
}
.mess tr:hover, .adm tr:hover	{
	background-color:	#666;
	opacity: 1;
}
tr.qitemnoans	{
	background-color:	#855;
}
td.qinfo	{
	padding: 5px;
	opacity: 1;
	width:	10%;
	min-width:	100px;
}
td.qcont	{
	padding: 10px;
	opacity: 1;
	width: 90%;
	min-width:	200px;
}
.mess input[type="submit"], .adm input[type="submit"]	{
	padding:	5px;
	font-size:	14px;
}
.mess select, .adm select	{
	padding: 5px;
	font-size:	14px;
}
.mess form	{
	padding:	20px;
}
@media screen and (max-width: 800px)	{
	div.mess	{
		width: 100%;
		padding: 0;
	}
	div.mess table 	{
		padding: 0;
		margin: 0;
		max-width: 90%;
		border-collapse: collapse;
	}
	tr.qitem 	{
		width: 80%;
		padding: 0;
		border:	0;
	}
	.qq	{
		padding:	0;
		border:	0;
	}
	.infoit	{
		padding:	0;
		border:	0;
	}
	.qans	{
		padding:	0;
		border:	0;
		border-bottom: 1px dashed #444;
		border-top:	1px dashed #444;
	}
	td.qinfo	{
		padding:	0;
		min-width:	0;
		border:	0;
	}
	td.qcont	{
		padding:	0;
		min-width:	0;
		border:	0;
	}
	.mess input[type="submit"], .adm input[type="submit"]	{
		padding:	0;
	}
	.mess select, .adm select	{
		padding:	0;
	}
	.mess form	{
		padding:	5px;
	}
}

div.adm 	{
	margin:	0;
	min-height:	200px;
	padding:	2% 2% 2% 10%;
	background-image:	url("img/im2.png");
	background-size:	cover;
	background-repeat:	no-repeat;
	background-attachment:	fixed;
}
div.adm p {
	font-size: 16px;
}
div.admaction	{
	padding: 10px;
}

div.about	{
	text-align:	center;
	font-size:	20px;
	min-height:	300px;
	width:	80%;
	padding:	10% 10% 5% 10%;
	background-image:	url("img/bg_about1.png");
	background-size:	cover;
	background-repeat:	no-repeat;
	background-attachment:	fixed;
	background-position: right top;
}

footer	{
	background-image:	linear-gradient(to bottom right, #222, #669);
	width:	90%;
	height:	150px;
	color: white;
	padding:	50px 0 50px 10%;
}