/* 
	LAYOUT.CSS
	
	Versie						   :1.6.0
	Datum laatst gewijzigd		:20080911
	Behoort toe aan pakket		:Taalwerkplaats
	Opmerkingen					   :Dit bestand bepaalt de layout van de site. Het bestand kan niet gebruikt worden voor sites 
								       op basis van andere template pakketten.
								       

*/ Te gebruiken kleuren:
   hoofdkleur: PMS186, rgb (204,0,0), #CC0000
   hoofdachtergrondkleur: wit, rgb(255,255,255), #FFFFFF
   ondersteunende kleur: Process Cyan rgb(0,156,239) #009CEF
*/


								       
*/
body {
	margin					:20px 0 20px 0;
	background				:#FFF;
	text-align				:center;
	padding					:0;
	font-family: Georgia, Verdana, Arial, Helvetica, sans-serif;
}

/* 
	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 #0C479D;
	width					   :780px;
	margin					:auto;
}
/* 
	Dit is de hoofd div (boven aan de pagina)
*/
#header {
	height					:100px;
	background-image		:url(../img/newHeader.gif);
	background-position: 0px 0px;
	background-repeat : no-repeat;
}
/* 
	Dit is de hoofdnavigatie div (boven aan de pagina)
*/
#navbar {
	height					:19px;
	color					   :#FFF;
	background				:#CC0000;
	font-weight				:bold;
	text-transform			:capitalize;
	padding					:0px 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;
	height:19px;

	/* 
		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 verschijnen. 
		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 {
   position: relative;
   top:2px;
   border:2px solid #CC0000;
   
}


#navbar a:link, 
#navbar a:visited {
	text-decoration 		:none;
	color 					:#FFF;
} 
#navbar a:active,
#navbar a:hover{
	text-decoration			:none;
	background-color: rgb(87,87,87);
	border:2px solid rgb(87,87,87);
	color: white;
} 
/* 
	Link naar een pagina in het menu die momenteel actief is 
*/  
#navbar li.active a {
	text-decoration			:none;
	background-color: rgb(87,87,87);
	border:2px solid rgb(87,87,87);
	color: white;
}
/* 
	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			:#FFFFFF;
}
/* 
	Dit is de linkerkolom div (voor het submenu)
*/
#leftcol {
	float					:left;
	width					:150px;
	text-align				:left;
	font-weight				:bold;
	padding					:10px 10px 0px 5px;
	
	
}
/* 
	Binnen de ul tag in de div "leftcol" bevind zich het submenu 
*/
#submenu{
	font-weight						:bold;
	float							:none;
	clear							:both;
	padding							:0px 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;
	background-image				:url(../img/foldera.gif);
	background-repeat				:no-repeat;
	background-position				:.1em .4em
}
/* 
	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							:#0C479D;
}
/* 
	Links in het submenu 
*/
#submenu a:link, 
#submenu a:visited {
	text-decoration 				:none;
	/*color 							:#0C479D;*/
	color 							:rgb(125,125,125);
} 
/* 
	Links in het submenu met de muis erover 
*/
#submenu a:active,
#submenu a:hover{
   background-color: rgb(125,125,125);
   color: white;

}

/* 
	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 {
   color: rgb(0,156,239);
   background-color: white;
}
/* 
	Het loginscherm verschijnt in deze div 
*/
#extranet{
	padding						:10px 0 0 0;
	font-weight					:normal;
	width						:100%;
}
/* 
	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;
	float						:right;
	background					:#FFF;
	text-align					:left;
	background-repeat			:repeat-y;
	padding						:10px 10px 30px 40px;
	border-left:  1px solid rgb(125,125,125);
}
/* 
	Het kruimelpad verschijnt in deze div 
*/
#crumbtrail{
	font-weight					:bold;
	padding						:0 0 0px 0;
}
/* 
	Dit is de voet div
*/
#footer{
	clear						:both;
	text-align					:center;
	height						:20px;
	background					:#CC0000;
	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;
}
.itemShort .abstract{
	float						:none;
}
/*
	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 .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;
	margin						:0;
	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%;
}

/* BEGIN NIEUW SINDS 1.5 */
.readmorebtn,
.backbtn{
	vertical-align				:middle;
}
/* Zorgt ervoor dat de "lees meer" tekst altijd onder de kopafbeelding komt */
.itemShort .articleFooter{
	clear						:both;
	/* Plaatst de "lees meer" tekst rechts */
	text-align					:right;
}
/* Zorgt ervoor dat de kop afbeelding rechts van de koptekst komt */
.headerImage{
	padding						:0 0 10px 10px;
	float						:right;
}
/* 
	Streep onde een artikel in verkorte weergave. 
	In versie 1.4 was dit gedefineerd met .itemShort Dit geeft echter problemen met 
	de kopafbeelding die sinds 1.5 mogelijk is. De border wordt nu aan de footer 
	van een verkort weergegeven artikel toegevoegd.
*/
.itemShort .articleFooter{
	border-bottom				:1px solid #CCC;
}
/* EINDE NIEUW SINDS 1.5 */