@charset "utf-8";
body { behavior: url("csshover3.htc"); }
/* stijlen voor het menu */
a, a:visited{color:#ffffff; font-weight:bold; text-decoration:none;}
a:hover{color:#000000;}
ul.navigation{list-style:none; 
	padding:0;
	margin:0;
	font-family: Arial;
	font-size: 11px;
	font-style: normal;
}
ul.navigation li {	
	display:block;
	float:left;
	width: 196px;
}
ul.navigation li a, ul.navigation li a:hover, ul.navigation li a:active, ul.navigation li a:visited {
	display:block;
	width:196px;
	margin:1px;padding:5px 20px; 
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #ffffff;	
	text-transform:uppercase;
}
ul.navigation li.highlight a{ color:#000000; background:#ffffff;}
ul.navigation li a:hover { background:#ffffff; color:#000000; cursor:hand;}
/* einde menu */

/*SUB MENU */
/*--- DROPDOWN ---*/
ul.navigation ul{
	list-style:none;
	display:none;
	/*left: 99em;*/
	margin:1px;padding:5px 10px; 
	font-size:0.8em;
	color:#000000;
	z-index:999;
	position:absolute;
	margin:-26px 0 0 196px;
	background-color:#012f49;
	/*top:-9999px;  Hide off-screen when not needed (this is more accessible than display:none;) */
}
ul.navigation ul li {
	padding-top:0px; /* Introducing a padding between the li and the a give the illusion spaced items */
	float:none;
}
ul.navigation ul a {
	white-space:nowrap; /* Stop text wrapping and creating multi-line dropdown items */
}
ul.navigation li:hover ul { /* Display the dropdown on hover */
	display:block;
	/*left: 10px;*/
	/*left:160px;  Bring back on-screen when needed */
}
ul.navigation li:hover a { /* These create persistent hover states, meaning the top-most link stays 'hovered' even when your cursor has moved down the list. */
	text-decoration:underline;
}
ul.navigation li:hover ul a { /* The persistent hover state does however create a global style for links even before they're hovered. Here we undo these effects. */
	text-decoration:none;
	margin:1px;padding:5px 0px 5px 0px; 
}
ul.navigation li:hover ul li a:hover { /* Here we define the most explicit hover states--what happens when you hover each individual link. */
	width:196px;
	text-transform:uppercase;
	z-index:999;
}

/* EINDE SUB-MENU */



/* NIEUW MENU */
ul#nav{list-style:none; 
	padding:0;
	margin:0;
	font-family: Arial;
	font-size: 11px;
	font-style: normal;
}
ul#nav li {	
	display:block;
	float:left;
	width: 196px;
}
ul#nav li a, ul#nav li a:hover, ul#nav li a:active, ul#nav li a:visited {
	display:block;
	width:196px;
	margin:1px;padding:5px 20px; 
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #ffffff;	
	text-transform:uppercase;
}
ul#nav li.highlight a{ color:#000000; background:#ffffff;}
ul#nav li a:hover { background:#ffffff; color:#000000; cursor:hand;}
/* einde menu */

/*SUB MENU */
/*--- DROPDOWN ---*/
ul#nav ul{
	list-style:none;
	display:none;
	/*left: 99em;*/
	margin:1px;padding:5px 10px; 
	font-size:0.8em;
	color:#000000;
	z-index:999;
	position:absolute;
	margin:-26px 0 0 196px;
	background-color:#012f49;
	/*top:-9999px;  Hide off-screen when not needed (this is more accessible than display:none;) */
}
ul#nav ul li {
	padding-top:0px; /* Introducing a padding between the li and the a give the illusion spaced items */
	float:none;
}
ul#nav ul a {
	white-space:nowrap; /* Stop text wrapping and creating multi-line dropdown items */
}
ul#nav li:hover ul { /* Display the dropdown on hover */
	display:block;
	/*left: 10px;*/
	/*left:160px;  Bring back on-screen when needed */
}
ul#nav li:hover a { /* These create persistent hover states, meaning the top-most link stays 'hovered' even when your cursor has moved down the list. */
	text-decoration:underline;
}
ul#nav li:hover ul a { /* The persistent hover state does however create a global style for links even before they're hovered. Here we undo these effects. */
	text-decoration:none;
	margin:1px;padding:5px 0px 5px 0px; 
}
ul#nav li:hover ul li a:hover { /* Here we define the most explicit hover states--what happens when you hover each individual link. */
	width:196px;
	text-transform:uppercase;
	z-index:999;
}

/* EINDE SUB-MENU */

.intro {
	font-family: Arial;
	font-size: 12px;
	font-style: bold;
	line-height: 14px;
	font-weight: bold;
	font-variant: bold;
	text-transform: none;
	color: #000000;
}
.intro_journaal {
	font-family: Arial;
	font-size: 12px;
	font-style: bold;
	line-height: 16px;
	font-weight: bold;
	font-variant: bold;
	text-transform: none;
	color: #000000;
}
#main .intro_journaal a {
	color: #FF6600;
	text-decoration: none;
}
#main .intro_journaal a:hover {
	color: #95897A;
	text-decoration: underline;
}

.kop {
	font-family: Arial;
	font-size: 18px;
	font-style: bold;
	line-height: 20px;
	font-weight: bold;
	font-variant: bold;
	text-transform: none;
	color: #FF6600;
}
.kop_archief {
	font-family: Arial;
	font-size: 18px;
	font-style: bold;
	line-height: 20px;
	font-weight: bold;
	font-variant: bold;
	text-transform: none;
	color: #887B6A;
}
.tussenkop {
	font-family: Arial;
	font-size: 13px;
	font-style: bold;
	line-height: 14px;
	font-weight: bold;
	font-variant: bold;
	text-transform: none;
	color: #FF6600;
}	
#main .tussenkop a {
	color: #FF6600;
	text-decoration: none;
}
#main .tussenkop a:hover {
	color: #95897A;
	text-decoration: underline;
}
.brood {
	font-family: Arial;
	font-size: 12px;
	font-style: normal;
	line-height: 14px;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #000000;
}
.brood SUB {
	vertical-align: 0;
	position: relative;
	top: 0.8ex;
}
.brood SUP {
	vertical-align: 0;
	position: relative;
	bottom: 1ex;
}
#main .brood a {
	color: #FF6600;
	text-decoration: none;
}
#main .brood a:hover {
	color: #95897A;
	text-decoration: underline;
}
.brood_journaal {
	font-family: Arial;
	font-size: 12px;
	font-style: normal;
	line-height: 16px;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #000000;
}
#main .brood_journaal a {
	color: #FF6600;
	text-decoration: none;
}
#main .brood_journaal a:hover {
	color: #95897A;
	text-decoration: underline;
}
.broodklein {
	font-family: Arial;
	font-size: 10px;
	font-style: normal;
	line-height: 14px;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #000000;
}
.broodwit {
	font-family: Arial;
	font-size: 11px;
	font-style: normal;
	line-height: 14px;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #FFFFFF;
}	
.navigatie {
	font-family: Arial;
	font-size: 11px;
	font-style: normal;
	line-height: 14px;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #FFFFFF;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #FFFFFF;
}
#main #navigatie .navigatie a {
	color: #FFFFFF;
	text-decoration: none;
}
#main #navigatie .navigatie a:hover {
	color: #000000;
	background-color: #FFFFFF;
	height: 19px;
	width: 196px;
	text-align: left;
	font-family: Arial;
	font-size: 11px;
	font-style: normal;
	line-height: 14px;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
}
.brood_sluiter {
	font-family: Arial;
	font-size: 10px;
	font-style: normal;
	line-height: 14px;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #897C6C;
}	
#main .brood_sluiter a {
	color: #897C6C;
	text-decoration: none;
}
#main .brood_sluiter a:hover {
	color: #897C6C;
	text-decoration: underline;