body {
	/* background-image:	url("images/header.gif");
	background-repeat:	no-repeat;
	padding-top:		150px; */
}

h1 {
	text-transform:		uppercase;
	text-align:		center;
	vertical-align:		middle;
	padding:		0;
	margin:			0;
}

h1 img {
	border: 		0;
	vertical-align:		middle;
	margin-left:		1em;
	margin-right:		1em;
}

#monthcalendar-instruction	{
	margin-left:		auto;
	margin-right:		auto;
	width:				200px;
	height:				20px;
	text-align:			center;
}

/* Calendar layout */

#monthcalendar #left, #monthcalendar #middle, #monthcalendar #right, #monthcalendar table	{
	float:	left;
	clear:	none;
}

#monthcalendar #top, #monthcalendar #bottom	{
	width:				727px;
	background-repeat:	no-repeat;
}

/* Safari and Opera (possibly others) render the calendar */
/* with a different height than mozilla. So they get...   */

.long#monthcalendar #left, .long#monthcalendar #right	{
	height:	618px;
	background-repeat:	repeat-y;
}

.short#monthcalendar #left, .short#monthcalendar #right	{
	height: 515px;
	background-repeat:	repeat-y;
}

/* This is the "real" height of the calendar edges. */
/* This is an evil CSS hack that only works because */
/* Safari and Opera don't recognize the :lang()     */
/* pseudo-class.                                    */

.short#monthcalendar #left:lang(en), .short#monthcalendar #right:lang(en)	{
	height:	505px;
}

.long#monthcalendar #left:lang(en), .long#monthcalendar #right:lang(en) {
	height: 600px;
}

#monthcalendar	{
	width:			727px;
	overflow:		hidden;
	margin-left:	auto;
	margin-right:	auto;
}

#monthcalendar #top {	
	background-image:	url("images/border_top.gif");
	height:				22px;
}

#monthcalendar #left {	
	background-image:	url("images/border_left.gif");	
	width:				11px;
	clear:				left;
}

#monthcalendar #right {	
	background-image:	url("images/border_right.gif");
	width:				9px;
	clear:				right;
}

#monthcalendar #bottom {
	background-image:	url("images/border_bottom.gif");
	height:				18px;
	clear:				both;
}

#monthcalendar #middle {
	background-image:	url("images/calendar-background.jpg");
	background-repeat:	repeat-y;
	width:				707px;
}

#monthcalendar table	{
	width:				707px;
	height:				505px;
	border-collapse:	collapse;		/* FIXME check MSIE! */
}

#monthcalendar td	{
	height:				100px;
	width:				100px;
	border:				solid thin white;
	text-align:			left;
	vertical-align: 	top;
}

#monthcalendar .event	{
	float: left;
	clear: both;
}

#monthcalendar .day	{
	font-size:	12px;
	float:		left;
	clear:		none;
	font-weight:	bold;
}

#monthcalendar .title	{
	float:			left;
	clear:			both;
	font-weight:	bold;
}

#monthcalendar .info	{
	float:		left;
	clear:		both;
}

#monthcalendar .status	{
	float:			right;
	font-weight:	bold;
}

.pending	{ color: #0b8adb; }
.booked		{ color: #e60000; }
.cancelled	{ color: #6e6e6e; }
.private	{ color: #dc5c0b; }

.cancelled a { color: #6e6e6e; }

.month-list	{
	text-align: 	center;
	margin:		0;
	padding:	0;
}