/* Global */
*{
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

html{
	overflow-y:scroll;
}

html, body{
	background:#fff;
	height:100%;
	width:100%;
}

body, button, textarea, input, select{
	color:#231f20;
	font-family:Arial,Verdana,Tahoma,Helvetica,sans-serif;
	font-size:0.812em;
	line-height:1.385em;
}

fieldset{
	border:0;
	padding:0;
	margin:0;
}

img{
	border:0;
	display:block;
	font-size:0;
	line-height:0;
}

ol, ul{
	list-style-position:inside;
	margin:0;
	padding:0;
}

i, em{
	font-style:italic;
}

address{
	font-style:normal;
}

a{
	text-decoration:underline;
}

a:hover{
	text-decoration:none;
}

legend,
.hide{
	display:none;
}

.show{
	display:block;
}

/* Styles */
body > #container{
	height:auto !important;
	height:100%;
	margin:0 auto;
	min-height:100%;
	position:relative;
	width:990px;
}

body > #container > div{
	min-height:845px;
	padding-top:20px;
}

header > *{
	border-bottom:1px solid #808285;
	font-size:1em;
	margin:0 0 5px 0;
	padding-bottom:5px;
	text-transform:uppercase;
}

/* Left */
aside#left{
	float:left;
	width:221px;
}

aside#left div{
	border-bottom:1px solid #fff;
	border-top:1px solid #fff;
	height:223px;
	width:221px;
}

/* Content */
#content,
#logo{
	float:left;
	margin:0 25px;
	width:479px;
}

#content{
	padding-bottom:113px;
}

#content > header > *{
	color:#ed161e;
	font-size:1em;
}

/* Overview */
#overview{
	list-style:none;
}

#overview li{
	border-bottom:1px solid #808285;
	margin-bottom:5px;
	padding-bottom:5px;
}

#overview li header{
	position:relative;
}

#overview li header:before{
	content:"";
	cursor:pointer;
	display:block;
	height:13px;
	left:0;
	position:absolute;
	top:2px;
	width:13px;
	z-index:1;
}

#overview li header > *{
	border-bottom:0;
	cursor:pointer;
	font-size:1em;
	margin:0;
	padding:0 0 0 18px;
	position:relative;
	z-index:2;
}

#overview li div p{
	margin:0;
}

#overview li div a.website{
	color:#231f20;
	font-style:italic;
}

#overview li div strong.info{
	font-size:11px;
	text-transform:uppercase;
}

/* Right */
aside#right{
	float:right;
	position:relative;
	width:240px;
}

aside#right > div,
#address{
	width:224px;
}

aside#right header > *{
	margin-top:20px;
}

/* Right - agenda en rubriek */
#rightAgenda table td{
	color:#808285;
	text-align:center;
	text-transform:uppercase;
	width:32px;
}

#rightAgenda table td,
#rightAgenda table td a{
	font-weight:bold;
}

#rightAgenda table td a{
	color:#ed161e;
	display:inline-block;
	line-height:1.539em;
	text-decoration:none;
	width:20px;
}

#rightAgenda table td a:hover,
#rightAgenda table td a.active{
	background:#ed161e;
	color:#fff;
}

/* Colors */
#content h1.grey,
#rightRubriek ol li.grey a{
	color:#808285;
}

#rightRubriek ol li.grey a:hover,
#rightRubriek ol li.grey a.active,
#overview li.grey header:before{
	background:#808285;
}

#content h1.blue,
#rightRubriek ol li.blue a{
	color:#00adef;
}

#rightRubriek ol li.blue a:hover,
#rightRubriek ol li.blue a.active,
#overview li.blue header:before{
	background:#00adef;
}

#content h1.orange,
#rightRubriek ol li.orange a{
	color:#f5821f;
}

#rightRubriek ol li.orange a:hover,
#rightRubriek ol li.orange a.active,
#overview li.orange header:before{
	background:#f5821f;
}

#content h1.green,
#rightRubriek ol li.green a{
	color:#77c24b;
}

#rightRubriek ol li.green a:hover,
#rightRubriek ol li.green a.active,
#overview li.green header:before{
	background:#77c24b;
}

#content h1.pink,
#rightRubriek ol li.pink a{
	color:#ec008c;
}

#rightRubriek ol li.pink a:hover,
#rightRubriek ol li.pink a.active,
#overview li.pink header:before{
	background:#ec008c;
}

#content h1.yellow,
#rightRubriek ol li.yellow a{
	color:#ffce17;
}

#rightRubriek ol li.yellow a:hover,
#rightRubriek ol li.yellow a.active,
#overview li.yellow header:before{
	background:#ffce17;
}

#rightRubriek ol li a:hover,
#rightRubriek ol li a.active{
	color:#fff;
}

#rightRubriek ol li a:hover,
#rightRubriek ol li a.active{
	padding-left:5px;
}

#rightRubriek ol{
	list-style:none;
}

#rightRubriek h3{
	font-size:1em;
	margin:0;
}

#rightRubriek a{
	display:block;
	margin:2px 0;
	padding:2px 0;
	text-decoration:none;
	text-transform:uppercase;
}

/* Footer */
#footer{
	padding-left:221px;
	position:relative;
	top:-13px;
	width:100%;
}

/* Footer - logo */
#logo{
	bottom:0;
	list-style:none;
	position:absolute;
}

#logo li{
	float:left;
	padding-right:7px;
}

/* Footer - address */
#address{
	bottom:0;
	position:absolute;
	right:16px;
}

#address a{
	display:block;
}

#address a.beleef{
	border-bottom:1px solid #808285;
	margin-bottom:10px;
	padding-bottom:15px;
}

#address a.beleef img{
	float:right;
}

#address a.gemeente{
	bottom:5px;
	position:absolute;
	right:0;
	width:76px;
}

#address address{
	margin-bottom:5px;
}

#address address strong{
	display:block;
	font-size:11px;
	text-transform:uppercase;
}

#address address a{
	color:#231f20;
}

/* Clear */
.clear:after{
	clear: both;
	content:".";
	display:block;
	height:0;
	line-height:0;
	visibility:hidden;
}

.clear {
	display:inline-block;
}

html[xmlns] .clear {
	display:block;
}

* html .clear {
	height:1%;
}

/* Media queries */
@media screen and (max-width:1005px){

	*{
		transition:all .2s linear;
		-o-transition:all .2s linear;
		-moz-transition:all .2s linear;
		-webkit-transition:all .2s linear;
	}

	body > #container{
		width:769px;
	}

	aside#left,
	#footer{
		display:none;
	}
}

@media screen and (max-width:800px){

	body > #container{
		width:240px;
	}

	#content,
	aside#right{
		width:100%;
	}

	#content,
	aside#right{
		float:none;
		padding:0 4px 0 20px;
	}

	#content{
		margin:20px 0 0 0;
		width:248px;
	}
}