body {
	background: #FFFFFF;
	color: #313036;
	margin: 0px;
	font-family: 'Roboto',Helvetica Neue,Arial,Sans-serif;
	font-size: 12pt;
}
a {
	text-decoration: none;
	font-weight: bold;
	color: #3A6EA5;
}
h1 {
	text-align: left;
	color: #3A6EA5;
}
table {
	width: 100%;
}
blockquote {
  background: #f9f9f9;
  border-left: 10px solid #ccc;
  margin: 1.5em 10px;
  padding: 0.5em 10px;
  font-style: italic;
}
.speaker th {
	background: #C0C0C0;
	padding: 3px;
	text-align: center;
	vertical-align: top;
}
.speaker td {
	background: #EBEBEB;
	padding: 3px;
	text-align: left;
	vertical-align: top;
}
.kleiner {
	font-size: 60%;
}
.links { float: left; }
.rechts { float: right; }
.midden { text-align: center; }
#container {
	display:grid;
	grid-template-columns: 2fr 20fr 5fr 1fr;
    grid-gap: 5px 25px;
}
#hoofding {
	grid-area: hoofding;
	background: #262827;
}
#banner {
	height: 80px;
	background-image: url("/img/site/banner.jpg");
	background-repeat: no-repeat;
	background-position: right;
}
#navigatie {
	background: #FF6700;
	color: #EBEBEB;
	padding: 15px;
}
.menu {
	margin-left: 20px;
}
.menu a {
	color: #EBEBEB
}
.icons {
	float: right;
}
.icon {
	position: relative;
	bottom: 3px;
	float:right;
	width: 24px;
	height: 24px;
	padding-left: 10px;
}
#links {
	grid-area: links;
}
#inhoud {
	grid-area: inhoud;
	flex: 1;
	text-align: justify;
	margin-bottom: 32px;
	line-height: 1.5em;
}
#topic { font-weight: bold; }
#datum {
	font-style: italic;
	font-size: 11pt;
	padding: 0px;
}
#zijkant {
	grid-area: zijkant;
	flex: 1;
	margin-bottom: 32px;
}
#zijkant ul {
	list-style: none;
	margin-left: 0px;
	padding-left: 0px;
	font-size: 11pt;
}
.blogitem {
	font-style: bold;
}
.blogitem a {
	color: #3A6EA5;
}
#rechts {
	grid-area: rechts;
}
#onderbalk {
	grid-area: onderbalk;
	width: 100%;
	background: #3A6EA5;
}
#copyright {
	font-weight: bold;
	color: #FFFFFF;
	padding: 10px;
}
#copyright a {
	color: #FFFFFF;
	padding-left: 10px;
}

@media screen and (min-width: 1000px) {
	#container {
	grid-template-areas: 
		"hoofding hoofding hoofding hoofding"
		"links inhoud zijkant rechts"
		"onderbalk onderbalk onderbalk onderbalk";
	}
}
@media screen and (max-width: 1000px) {
	.menu { display: block; margin-left: 20px; margin-top: 5px; font-size: 14px; }
	.icons { margin-top: -28px; }
	#container {
	grid-template-areas: 
		"hoofding hoofding hoofding hoofding"
		"links inhoud inhoud rechts"
		"links zijkant zijkant rechts"
		"onderbalk onderbalk onderbalk onderbalk";
	}
}