/* 
	LAYOUT.CSS
	
	Versie						:1.4.0
	Datum laatst gewijzigd		:02-09-05
	Behoort toe aan pakket		:Template 1
	Opmerkingen					:Dit bestand bepaalt de layout van de site. Het bestand kan niet gebruikt worden voor sites 
								 op basis van andere template pakketten.
*/
body {
	margin					:20px 0 20px 0;
	background				:#FFF;
	text-align				:center;
	padding					:0;
}

/* 
	De outer div omsluit alle andere divs en kan zo gemakkelijk gebruikt 
	worden om een rand om de hele layout heen te trekken.
*/
#outer {
	text-align				:left;
	border					:1px solid #FF2B01;
	width					:780px;
	margin					:auto;
}
/* 
	Dit is de hoofd div (boven aan de pagina)
*/
#header {
	height					:120px;
	background-image		:url(../img/kop.jpg);
}
/* 
	Dit is de hoofdnavigatie div (boven aan de pagina)
*/
#navbar {
	height					:20px;
	color					:#FFF;
	background				:#FFCC33 ;
	font-weight				:bold;
	text-transform			:capitalize;
	padding					:2px 0 0 0px;
}
/* 
	Binnen de ul tag in de div "navbar" bevind zich het hoofdmenu 
*/
#navbar ul {
	list-style				:none;
	margin					:0;
	padding					:0;
}
/* 
	Elk menu item wordt weer ingesloten in een li tag 
*/
#navbar li{
	margin					:0;
	padding					:0 0 0 12px;
	/* 
		Float geeft aan of items zich naast elkaar kunnen bevinden en zo ja aan welke kant.
		In dit geval zal een volgende li tag rechts vershijnen. 
		Hiervoor zal float op left moeten staan om aan de linkerkant items aan te kunnen laten schuiven.
	*/ 
	float					:left;
}
/* 
	Links in het hoofdmenu in verschillende toestanden 
*/
#navbar a:link, 
#navbar a:visited {
	text-decoration 		:none;
	color 					:#FFF;
} 
#navbar a:active,
#navbar a:hover{
	text-decoration 		:none;
	color 					:#FFF;
} 
/* 
	Link naar een pagina in het menu die momenteel actief is 
*/  
#navbar li.active a:link,
#navbar li.active a:visited{
	text-decoration			:underline;
}  
#navbar li.active a:active,
#navbar li.active a:hover{

}
/* 
	Pagina in het hoofdmenu 
*/
#navbar li.page{
	/*
	background-image		:url(../img/page.gif);
	background-repeat		:no-repeat;
	background-position		:.1em .4em;
	*/
}
/* 
	Categorie in het hoofdmenu 
*/
#navbar li.folder{
	/*
	background-image		:url(../img/folder.gif);
	background-repeat		:no-repeat;
	background-position		:.1em .4em;
	*/
}
/* 
	De bodyblock div omsluit de linkerkolom div en de rechterkolom div. 
*/
#bodyblock{
	width					:780px;
	background				:#E0A810;
}
/* 
	Dit is de linkerkolom div (voor het submenu)
*/
#leftcol {
	float					:left;
	width					:150px;
	text-align				:left;
	font-weight				:bold;
	margin					:10px 5px 0px 5px;
}
/* 
	Binnen de ul tag in de div "leftcol" bevind zich het submenu 
*/
#submenu{
	font-weight						:bold;
	float							:none;
	clear							:both;
	margin							:10px 0 0 5px;
}
#submenu ul {
	margin							:0 0 0 0;
	padding							:0 0 0 0;
	list-style						:none;
}
/* 
	Eerste niveau van het submenu 
*/
#submenu li{
	margin							:0;
	padding							:0 0 0 14px;
	list-style						:none;
}
/* 
	Tweede niveau van het submenu 
*/
#submenu li ul li{
	margin							:0;
	padding							:0 0 0 14px;
	font-weight						:normal;
}
#submenu li.active li a:link,
#submenu li.active li a:visited{
	color							:#FFF;
}
/* 
	Links in het submenu 
*/
#submenu a:link, 
#submenu a:visited {
	text-decoration 				:none;
	color 							:#FFF;
} 
/* 
	Links in het submenu met de muis erover 
*/
#submenu a:active,
#submenu a:hover{

}
/* 
	Een pagina in het submenu 
*/ 
#submenu li.page{
	background-image		:url(../img/page.gif);
	background-repeat		:no-repeat;
	background-position		:.1em .4em;
}
/* 
	Een categorie in het submenu 
*/ 
#submenu li.folder{
	background-image		:url(../img/folder.gif);
	background-repeat		:no-repeat;
	background-position		:.1em .4em
}

/* 
	De link naar de pagina die momenteel actief is in het submenu 
*/
#submenu li.active{
	padding					:0 0 0 14px;
	background-image		:url(../img/active.gif);
	background-repeat		:no-repeat;
	background-position		:.1em .4em;
}
#submenu li.active a:link,
#submenu li.active a:visited,
#submenu li.active a:active,
#submenu li.active a:hover{
	color 					:#FF2B01;
}
/* 
	Het loginscherm verschijnt in deze div 
*/
#extranet{
	padding					:10px 0 0 0;
	font-weight				:normal;
	width					:100%
}
/* 
	Het kruimelpad verschijnt in deze div 
*/
#crumbtrail{
	font-weight				:bold;
	padding					:0 0 0px 0;
}

/* 
	Dit is de content div
*/
#content {
	/* 
		De breedte van dit vlak hangt sterk samen met de padding die opgegeven wordt.
		Waneer je bij padding de de marges groter maakt zal je de breedte moeten verkleinen.
	*/
	width					:550px;
	background				:#FFF;
	text-align				:left;
	background-image		:url(../img/achtergrond-content.gif);
	background-repeat		:repeat-y;
	padding					:10px 10px 30px 40px;
}
/* 
	Dit is de voet div
*/
#footer{
	clear					:both;
	text-align				:center;
	height					:20px;
	background				:#FFCC33;
	color					:#FFF;
	padding					:0 10px 0 10px;
}

/*
	Links geplaatst in de footer van de site met de muis er af.
*/
#footer a:link,
#footer a:visited{
	color						:#EAEEEE;
}

/*
	Links geplaatst in de footer van de site met de muis er over.
*/
#footer a:hover,
#footer a:active{
	color						:#EAEEEE;
	text-decoration				:underline;
}
/* 
	Onderin de popup verschijnt een link om een venster te kunnen sluiten. 
	Deze bevindt zich in een div met de id popupClose.
*/
#popupClose{
	clear						:both;
	float						:none;
	text-align					:center;
}
/*
	De class "checkbox" wordt gebruikt voor checkboxen in formulieren.
*/
.checkbox {
	border						:0px;
	width						:auto;
}
/*
	Deze class wordt toegekend aan alle items die verkort worden weergegeven.
*/
.itemShort{
	float						:none;
	padding						:0 0 5px 0;
	border-bottom				:1px solid #CCC;
}
/*
	Deze class wordt toegekend aan alle items die volledig worden weergegeven
	nadat ze verkort zijn weergegeven en er wordt op "lees meer" geklikt.
*/
.itemFull .abstract{
	font-weight					:bold;
}
/*
	Deze class wordt toegekend aan artikelen die standaar al volledig worden weergegeven.
*/
.itemDefault p.abstract{
	font-weight					:bold;
}
/* 
	DE ONDERSTAANDE CLASS WORDT TOEGEKEND AAN DE BODY VAN HET POPUPVENSTER 
	hierdoor is het mogelijk om aan een popup een ander uiterlijk te geven als de site.
	Zo kun je bivoorbeeld de marges, de tekst keur, de tekst uitlijing, de achtergrondkleur enz. 
	opgeven voor een popup.
*/
.popupcontent{
	padding						:10px;
	color						:#000;
	background					:#FFF;
	text-align					:left;
	font						:.8em/1.3 Geneva, Arial, Helvetica, sans-serif;
}
/*
	Deze class wordt gebruikt voor de voetteksten onder artikelen zoals bijv. "lees meer" of "print".
*/
.articleFooter a:link,
.articleFooter a:visited{
	color						:#000;
	text-decoration				:none;
}
.articleFooter a:hover,
.articleFooter a:active{
	color						:#FF2B01;
	text-decoration				:none;
}
form{
	margin						:0px;
}
/* De pgaina titel bevindt zich tussen de h1 tag */
input ,select, textarea {
	font-family					:Verdana, Arial, Helvetica, sans-serif;
	font-size					:.9em;
	border						:1px solid #666;
	margin						:0;
	padding						:0;
	
}
textarea{
	width						:98%;
}
input.text{
	width						:98%;
	text-transform				:none;
	margin						:2px;
}
select.text{
	width						:98%;
}