body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 9px;
	color: #000000;
	text-decoration: none;
	margin: 0px;
	padding: 0px;

	scrollbar-face-color:#ffffff; 
	scrollbar-arrow-color:#999999; 
	scrollbar-track-color:#ffffff; 
	scrollbar-shadow-color:#dddddd; 
	scrollbar-highlight-color:#dddddd; 
	scrollbar-3dlight-color:#dddddd; 
	scrollbar-darkshadow-Color:#dddddd; 
} 

.small {
font-size: 9px;
font-style: italic;
}

.borderTd { 
padding: 10px 10px 10px 10px;
border: 1px dashed #FC801C;
background-color: #ffffff; 
}

.borderTd1 { 
padding: 0px 0px 0px 0px;
border: 1px solid #777777;
background-color: #ffffff; 
}

.borderTd2 { 
padding: 0px 0px 0px 0px;
border: 1px solid #000000;
background-color: #ffffff; 
}


.borderTd3 { 
padding: 0px 0px 0px 0px;
margin-left: 50px;
border: 1px solid #777777;
background-color: #ffffff; 
}

.borderTdblack { 
padding: 10px 10px 10px 10px;
border: 1px dashed #66cc00;
background-color: #000000; 
}


hr { 
	height:1px; 
	width:100%; 
	background-color: #ffffff; 
	border:1px solid; 
	border-color: #dddddd
} 

.1pxborderblack {
	border: 1px solid #000000;
}

table.1 {
	background-color: #777777; 
}

table {
	background-color: #ffffff; 
}

td {
	font-size: 8pt;
	color: #666666;
	text-decoration: none;
}

td.nav {
	font-size: 8pt;
	color: #000000;
	text-decoration: none;
}

td.newsdate {
	font-size: 8pt;
	color: #777777;
	background-color: #eeeeee; 
	text-decoration: none;
}

td.grey {
	background-color: #cccccc; 
}

td.grey1 {
	background-color: #cccccc; 
border-bottom: 1px solid #777777;
}

td.white1 {
border-bottom: 1px solid #777777;
}

td.title {
	font-size: 9pt;
	font-weight: bold;
	color: #ff6600;
	background-color: #333333; 
padding: 5px 20px;
border-bottom: 1px solid #777777;
text-align: center;

}

td.subtitle {
	font-size: 8pt;
	color: #ffcc33;
 padding: 3px 0;
	background-color: #777777; 
	font-weight: bold;
}

td.vcard {
	font-size: 10pt;
	color: #777777;
	text-decoration: none;
}

td.bold {
	font-size: 10pt;
	color: #000000;
	text-decoration: none;
}

td.white {
	font-size: 8pt;
	color: #FFFFFF;
	text-decoration: none;
}

td.copyright {
	font-size: 7pt;
	color: #000000;
	background-color: #dddddd;
	background-image: url(images/footerbottom.jpg); 
	text-decoration: none;
}


ul {
	list-style-image: url(images/vierkantje.gif); 
	margin-left: 0;
	padding-left: 1em;
	font-size: 10pt;
	font-weight: bold;
}

ul ul {
	list-style-image: url(images/left-arrow.gif); 
	font-size: 10pt;
	font-weight: normal;
}

ul.features {
	list-style-image: url(images/left-arrow.gif); 
	margin-top: 0;
	margin-left: 2;
	padding-left: 2em;
	font-size: 8pt;
	font-weight: normal;
}


ul.small {
	list-style-image: url(images/vierkantje_sml.gif); 
	margin-top: 0;
	margin-left: 2;	
	padding-left: 2em;
	font-size: 8pt;
	font-weight: normal;
}

ul.small1 {
	list-style-image: url(images/vierkantje_sml1.jpg); 
	margin-top: 2;
	margin-left: 2;	
	padding-left: 2em;
	font-size: 8pt;
	font-weight: normal;
}

.title {
	font-size: 12px;
	color: #777777;
	text-decoration: none;
	font-weight: bold;
	margin-left: 0;
	padding-left: 0em;
}

.title2 {
		font-size: 12px;
	color: #777777;
	text-decoration: underline;
	font-weight: bold;
	margin-left: 2;
	padding-left: 2em;
 text-align: center;
}

.titlexeno {
		font-size: 12px;
	color: #000000;
	background-color: #000000
	text-decoration: none;
	font-weight: bold;
	padding-left: 1em;
	padding-right: 1em;
	padding-top: 0.5em;
	padding-bottom: 0.5em;
	border: #000000 1px groove;
	background-image: url(images/groen.jpg)
}

font.title1 {
	font-size: 8pt;
	color: #777777;
	font-weight: bold;
	text-decoration: none;
}

font.title2 {
	font-size: 8pt;
	color: #000000;
	font-weight: bold;
	text-decoration: none;
}


p {
	font-size: 7pt;
	color: #999999;
	text-decoration: none;
}	

p.text {
	font-size: 8pt;
	color: #666666;
	text-decoration: none;
}

.input {
	font-size: 11px;
	color: #CCCCCC;
	text-decoration: none;
	margin: 0px;
	padding: 0px;
	border: 0px solid #999999;
	border-top-width: 1px;
	border-top-style: dashed;
	border-top-color: #cc0000;
	border-bottom-width: 1px;
	border-bottom-style: dashed;
	border-bottom-color: #cc0000;
	border-left-width: 1px;
	border-left-style: dashed;
	border-left-color: #cc0000;
	border-right-width: 1px;
	border-right-style: dashed;
	border-right-color: #cc0000;
	background-color: #000000
}

.button
{
    BORDER: #fc801c 1px solid;
    FONT-SIZE: 9px;
    BACKGROUND: #ffffff;
    COLOR: #777777;
}

.select {
	font-size: 10px;
	color: #0033ff;
	text-decoration: none;
	margin: 0px;
	padding: 0px;
	border: 1px solid #cc0000;
}

.checkBox {
	font-size: 12px;
	color: #333333;
	text-decoration: none;
	margin: 0px;
	padding: 0px;
}


		a.A:link{color:#000000;font-size:8pt;text-decoration:none}
		a.A:visited{color:#000000;font-size:8pt;text-decoration:none}
		a.A:active{color:#FF0000;font-size:8pt;text-decoration: underline}
		a.A:hover{color:#777777;font-size:8pt;text-decoration:underline}

		a.B:link{color:#000000;font-size:7pt;text-decoration:none}
		a.B:visited{color:#000000;font-size:7pt;text-decoration:none}
		a.B:active{color:#FF0000;font-size:7pt;text-decoration: underline}
		a.B:hover{color:#777777;font-size:7pt;text-decoration:underline}

		a.C:link{color:#000000;font-size:8pt;font-weight:none;text-decoration:underline}
		a.C:visited{color:#000000;font-size:8pt;font-weight:none;text-decoration:underline}
		a.C:active{color:#FF0000;font-size:8pt;font-weight:none;text-decoration: none}
		a.C:hover{color:#777777;font-size:8pt;font-weight:none;text-decoration:none}

		a.D:link{color:#777777;font-size:10pt;text-decoration:none}
		a.D:visited{color:#777777;font-size:10pt;text-decoration:none}
		a.D:active{color:#FF0000;font-size:10pt;text-decoration: underline}
		a.D:hover{color:#C0C0C0;font-size:10pt;text-decoration:underline}

		a.D1:link{color:#777777;font-size:8pt;text-decoration:underline}
		a.D1:visited{color:#777777;font-size:8pt;text-decoration:underline}
		a.D1:active{color:#FF0000;font-size:8pt;text-decoration: none}
		a.D1:hover{color:#000000;font-size:8pt;text-decoration:none;background-color: #EEEEEE;}

		a.E:link{color:#000000;font-size:7pt;text-decoration:underline}
		a.E:visited{color:#000000;font-size:7pt;text-decoration:underline}
		a.E:active{color:#FF0000;font-size:7pt;text-decoration: none}
		a.E:hover{color:#777777;font-size:7pt;text-decoration:none}

		a.F:link{color:#000000;font-size:7pt;text-decoration:none}
		a.F:visited{color:#000000;font-size:7pt;text-decoration:none}
		a.F:active{color:#FF0000;font-size:7pt;text-decoration: underline}
		a.F:hover{color:#777777;font-size:7pt;text-decoration:underline}

		a.G:link{color:#FFFFFF;font-size:10pt;text-decoration:none}
		a.G:visited{color:#FFFFFF;font-size:10pt;text-decoration:none}
		a.G:active{color:#FF0000;font-size:10pt;text-decoration: underline}
		a.G:hover{color:#C0C0C0;font-size:10pt;text-decoration:underline}

		a.H:link{color:#777777;font-size:7pt;font-style:italic}
		a.H:visited{color:#777777;font-size:7pt;font-style:italic}
		a.H:active{color:#777777;font-size:7pt;font-style:italic}
		a.H:hover{color:#777777;background-color: #EEEEEE;font-size:7pt;font-style:italic}

		a.I_on:link{color:#000000;background-color: #FFFFFF;font-size:7pt;text-decoration:none}
		a.I_on:visited{color:#000000;background-color: #FFFFFF;font-size:7pt;text-decoration:none}
		a.I_on:active{color:#FF0000;background-color: #FFFFFF;font-size:7pt;text-decoration: underline}
		a.I_on:hover{color:#777777;background-color: #EEEEEE;font-size:7pt;text-decoration:underline}

		a.I_on2:link{color:#000000;background-color: #FFFFFF;font-size:10pt;text-decoration:none}
		a.I_on2:visited{color:#000000;background-color: #FFFFFF;font-size:10pt;text-decoration:none}
		a.I_on2:active{color:#FF0000;background-color: #FFFFFF;font-size:10pt;text-decoration: underline}
		a.I_on2:hover{color:#777777;background-color: #EEEEEE;font-size:10pt;text-decoration:underline}

		a.I_off:link{color:#777777;background-color: #FFFFFF;font-size:7pt;font-style:italic}
		a.I_off:visited{color:#777777;background-color: #FFFFFF;font-size:7pt;font-style:italic}
		a.I_off:active{color:#777777;background-color: #FFFFFF;font-size:7pt;font-style:italic}
		a.I_off:hover{color:#777777;background-color: #EEEEEE;font-size:7pt;font-style:italic}

		a.breadcr:link{color:#000000;font-size:7pt;text-decoration:underline}
		a.breadcr:visited{color:#000000;font-size:7pt;text-decoration:underline}
		a.breadcr:active{color:#FF0000;font-size:7pt;text-decoration: none}
		a.breadcr:hover{color:#777777;font-size:7pt;text-decoration:none}

		a.breadcr-off:link{color:#000000;font-size:7pt;text-decoration:none}
		a.breadcr-off:visited{color:#000000;font-size:7pt;text-decoration:none}
		a.breadcr-off:active{color:#000000;font-size:7pt;text-decoration: none}
		a.breadcr-off:hover{color:#000000;font-size:7pt;text-decoration:none}




Listing 1: The Calendar CSS (stylesheet.css)
/* caption determines the style of 
   the month/year banner above the calendar. */ 

caption  
     { 
     font-family:arial,helvetica;  
     font-size:14px;  
     color: black; 
     font-weight: bold; 
     } 

/* .calendar determines the overall formatting style of the calendar,   
   acting as the default unless later overruled. */ 

.calendar  
     { 
     font-family:arial,helvetica;  
     font-size:14px;  
     color: white; 
     background-color: #fc801c; 
     border-color: #777777; 
     border-style: solid; 
     border-width: 1px; 
     } 

/* .calendarlink determines the formatting of those days linked to 
   content. */ 

.calendarlink  
     { 
     color: #ffffff;
	text-decoration: none;
     } 

.bookedlink  
     { 
     color: #000000;
	text-decoration: none;
     } 

/* .header determines the formatting of the weekday headers at the top 
   of the calendar. */ 

.header  
     { 
     background-color: #fc801c; 
     color: #000000;
						font-weight: none;
    font-size=7pt;
     border-color: #ffffff; 
     border-style: solid; 
     border-width: 1px; 
     } 

/* .day determines the formatting of each day displayed in the 
   calendar. */ 

.day  
     { 
     background-color: #fc801c; 
     color: #ffffff;
     border-color: #000000; 
     border-style: solid; 
     border-width: 1px; 
     text-align: center 
     } 

/* .linkedday determines the formatting of a date to which content is 
   available. */ 

.linkedday  
     { 
     background-color: #fc801c; 
     border-color: #000000; 
     border-style: solid; 
     border-width: 1px; 
     text-align: center 
     } 

