body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 9px;
	color: #777;
	text-decoration: none;
	margin: 0px;
	padding: 0px;

	scrollbar-face-color:#fff; 
	scrollbar-arrow-color:#999; 
	scrollbar-track-color:#fff; 
	scrollbar-shadow-color:#ddd; 
	scrollbar-highlight-color:#ddd; 
	scrollbar-3dlight-color:#ddd; 
	scrollbar-darkshadow-Color:#ddd; 
} 


.borderTd { 
padding: 10px 10px 10px 10px;
border: 1px dashed #66cc00;
background-color: #fff; 
}

.borderTd1 { 
padding: 0px 0px 0px 0px;
border: 1px solid #777;
background-color: #fff; 
}

.borderTd2 { 
padding: 0px 0px 0px 0px;
border: 1px solid #777;
background-color: #e0e0e0; 
}

.borderTdblack { 
padding: 10px 10px 10px 10px;
border: 1px dashed #66cc00;
}

.borderTdgrey { 
padding: 5px 5px 5px 5px;
border: 1px solid #66cc00;
background-color: #ccc; 
}

h2 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 16px;
color: #000;
font-weight:bold;
}

h3 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #fff;
	font-weight:bold;
	text-align: center;
	margin: 0px;
	padding: 0px;
}

.green {
color: #b2dd1c;
}

.black {
background-color:#000;
}

.greentitle {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 24px;
color: #b2dd1c;
font-weight: bold;
}

.greentitle1 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 14px;
color: #b2dd1c;
font-weight: bold;
}


.greentext {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #b2dd1c;
font-weight: bold;
}


hr { 
	height:1px; 
	width:100%; 
	background-color: #fff; 
	border:1px solid; 
	border-color: #ddd;
} 

.hr1 { 
	height:1px; 
	width:100%; 
	background-color: #777; 
	border:1px dashed; 
	border-color: #777;
} 

.1pxborderblack {
	border: 1px solid #000;
}

.1pxbordergreen {
	border: 1px solid #b2dd1c;
}

table.1 {
	background-color: #777; 
}

table.announce {width:362px;}
table.announce_m {width:300px;}
table.sml_announce {width:155px;}
td.ann_cont_green {background-image: url(images/squaregreen.gif); padding:10px;color: #fff;}
td.ann_cont_red {background-image: url(images/redbox_bg.jpg); color: #fff; font-size: 13pt; text-align:center;}
.redbox {}
td.schuingroen {width:18px; background-image: url(images/schuingroen.gif);}
.greenbg {background-image: url(images/squaregreen.gif);}
td.ann_cont_grey {background-image: url(images/squaregrey.gif);padding:10px;}
td.schuingrijs {width:18px; background-image: url(images/schuingrijs.gif);}
.greybg {background-image: url(images/squaregrey.gif);}
.moviecat {background-image: url(images/squaregreen.gif); font-size:14px; color:#fff; margin-left:5px;}
td.ann_link {background-color:#fff; text-align: center; width:110px;}

#moviedescr {
	margin-top: 20px;
	width: 450px;
	height: 100px;
	border: 1px dashed #666;
	background-color: #ccc;
	padding: 5px;
	color:#333;
}

table {
	background-color: #fff; 
}

td {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 8pt;
	color: #666;
	text-decoration: none;
}

td.nav {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 8pt;
	color: #000;
	text-decoration: none;
}

td.newsdate {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 8pt;
	color: #777;
	background-color: #eee; 
	text-decoration: none;
}

td.vcard {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10pt;
	color: #777;
	text-decoration: none;
}

td.bold {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10pt;
	color: #000;
	text-decoration: none;
}

td.white {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 8pt;
	color: #fff;
	text-decoration: none;
}

td.copyright {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 7pt;
	color: #000;
	background-color: #ddd; 
	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;
}

li.nostyle {
	list-style: none; 
	margin-top: 0;
	margin-left: 0;	
	padding-left: 0;
	font-size: 8pt;
	font-weight: bold;
}

.title {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #777;
	text-decoration: none;
	font-weight: bold;
	margin-left: 2;
	padding-left: 2em;
}

.title1 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 16px;
	color: #555;
	text-decoration: none;
	font-weight: bolder;
	margin-left: 2;
	padding-left: 1em;
}

.titlexeno {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000;
	background-color: #000
	text-decoration: none;
	font-weight: bold;
	padding-left: 1em;
	padding-right: 1em;
	padding-top: 0.5em;
	padding-bottom: 0.5em;
	border: #000 1px groove;
	background-image: url(images/groen.jpg)
}

font.title1 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 8pt;
	color: #777;
	font-weight: bold;
	text-decoration: none;
}

font.title2 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 8pt;
	color: #000;
	font-weight: bold;
	text-decoration: none;
}

P {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 7pt;
	color: #999;
	text-decoration: none;
}	

.input {
	font-family: Verdana, helv, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #ccc;
	text-decoration: none;
	margin: 0px;
	padding: 0px;
	border: 0px solid #999;
	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: #000;
}

.button
{
    BORDER: #99cc33 1px solid;
    FONT-SIZE: 9px;
    BACKGROUND: #fff;
    COLOR: #777;
    font-family: Verdana, Arial, Helvetica, sans-serif;
}

.select {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #0033ff;
	text-decoration: none;
	margin: 0px;
	padding: 0px;
	border: 1px solid #cc0000;
}

fieldset {width:450px; margin-top:10px;padding-left:20px;border:1px solid #99cc33;}
legend {color: #99cc33;font-weight: bold;font-size: 120%;}
input, textarea {
	background-color: #99cc33;
	color: #000;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 90%;
	border: 1px solid #555;
}

.moviecomm {
	background-color: #ccc;
	color: #000;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 90%;
	padding: 5px;
	border: 1px solid #555;
	}

.mandatory {color: #ff0000;}


.selectalbum {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	padding: 5px;
	border: 1px solid #fff;
	background-color: #777; 	
	font-size: 10px;
	color: #fff;
	font-weight:bold;
}

.checkBox {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #333;
	text-decoration: none;
	margin: 0px;
	padding: 0px;
}


		a.A:link{color:#000;font-size:8pt;text-decoration:none}
		a.A:visited{color:#000;font-size:8pt;text-decoration:none}
		a.A:active{color:#FF0000;font-size:8pt;text-decoration: underline}
		a.A:hover{color:#777;font-size:8pt;text-decoration:underline}

		a.B:link{color:#000;font-size:7pt;text-decoration:none}
		a.B:visited{color:#000;font-size:7pt;text-decoration:none}
		a.B:active{color:#FF0000;font-size:7pt;text-decoration: underline}
		a.B:hover{color:#777;font-size:7pt;text-decoration:underline}

		a.C:link{color:#000;font-size:8pt;font-weight:none;text-decoration:underline}
		a.C:visited{color:#000;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:#777;font-size:8pt;font-weight:none;text-decoration:none}

		a.D:link{color:#777;font-size:10pt;text-decoration:none}
		a.D:visited{color:#777;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:#777;font-size:8pt;text-decoration:underline}
		a.D1:visited{color:#777;font-size:8pt;text-decoration:underline}
		a.D1:active{color:#FF0000;font-size:8pt;text-decoration: none}
		a.D1:hover{color:#000;font-size:8pt;text-decoration:none;background-color: #EEEEEE;}

		a.E:link{color:#000;font-size:7pt;text-decoration:underline}
		a.E:visited{color:#000;font-size:7pt;text-decoration:underline}
		a.E:active{color:#FF0000;font-size:7pt;text-decoration: none}
		a.E:hover{color:#777;font-size:7pt;text-decoration:none}

		a.F:link{color:#000;font-size:7pt;text-decoration:none}
		a.F:visited{color:#000;font-size:7pt;text-decoration:none}
		a.F:active{color:#FF0000;font-size:7pt;text-decoration: underline}
		a.F:hover{color:#777;font-size:7pt;text-decoration:underline}

		a.G:link{color:#fff;font-size:10pt;text-decoration:none}
		a.G:visited{color:#fff;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:#777;font-size:7pt;font-style:italic}
		a.H:visited{color:#777;font-size:7pt;font-style:italic}
		a.H:active{color:#777;font-size:7pt;font-style:italic}
		a.H:hover{color:#777;background-color: #EEEEEE;font-size:7pt;font-style:italic}

		a.I:link{color:#fff;font-size:10pt;text-decoration:none}
		a.I:visited{color:#fff;font-size:10pt;text-decoration:none}
		a.I:active{color:#FF0000;font-size:10pt;text-decoration: underline}
		a.I:hover{color:#FF0000;font-size:10pt;text-decoration:underline overline;}

		a.I_on:link{color:#000;background-color: #fff;font-size:7pt;text-decoration:none}
		a.I_on:visited{color:#000;background-color: #fff;font-size:7pt;text-decoration:none}
		a.I_on:active{color:#FF0000;background-color: #fff;font-size:7pt;text-decoration: underline}
		a.I_on:hover{color:#777;background-color: #EEEEEE;font-size:7pt;text-decoration:underline}

		a.I_on2:link{color:#000;background-color: #fff;font-size:10pt;text-decoration:none}
		a.I_on2:visited{color:#000;background-color: #fff;font-size:10pt;text-decoration:none}
		a.I_on2:active{color:#FF0000;background-color: #fff;font-size:10pt;text-decoration: underline}
		a.I_on2:hover{color:#777;background-color: #EEEEEE;font-size:10pt;text-decoration:underline}

		a.I_off:link{color:#777;background-color: #fff;font-size:7pt;font-style:italic}
		a.I_off:visited{color:#777;background-color: #fff;font-size:7pt;font-style:italic}
		a.I_off:active{color:#777;background-color: #fff;font-size:7pt;font-style:italic}
		a.I_off:hover{color:#777;background-color: #EEEEEE;font-size:7pt;font-style:italic}

		a.breadcr:link{color:#000;font-size:7pt;text-decoration:underline}
		a.breadcr:visited{color:#000;font-size:7pt;text-decoration:underline}
		a.breadcr:active{color:#FF0000;font-size:7pt;text-decoration: none}
		a.breadcr:hover{color:#777;font-size:7pt;text-decoration:none}

		a.breadcr-off:link{color:#000;font-size:7pt;text-decoration:none}
		a.breadcr-off:visited{color:#000;font-size:7pt;text-decoration:none}
		a.breadcr-off:active{color:#000;font-size:7pt;text-decoration: none}
		a.breadcr-off:hover{color:#000;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: #99cc33; 
     border-color: #777; 
     border-style: solid; 
     border-width: 1px; 
     } 

/* .calendarlink determines the formatting of those days linked to 
   content. */ 

.calendarlink  
     { 
     color: #fff;
	text-decoration: none;
     } 

.bookedlink  
     { 
     color: #000;
	 text-decoration: none;
     } 

/* .header determines the formatting of the weekday headers at the top 
   of the calendar. */ 

.header  
     { 
    background-color: #99cc33; 
    color: #000;
	font-weight: none;
    font-size=7pt;
    border-color: #fff; 
    border-style: solid; 
    border-width: 1px; 
     } 

/* .day determines the formatting of each day displayed in the 
   calendar. */ 

.day  
     { 
     background-color: #99cc33; 
     color: #fff;
     border-color: #000; 
     border-style: solid; 
     border-width: 1px; 
     text-align: center;
     } 

/* .linkedday determines the formatting of a date to which content is 
   available. */ 

.linkedday  
     { 
     background-color: #99cc33; 
     border-color: #000; 
     border-style: solid; 
     border-width: 1px; 
     text-align: center;
     }