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

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

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

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

/* Calendar layout */

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

#calendar #top, #calendar #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#calendar #left, .long#calendar #right	{
	height:	618px;
	background-repeat:	repeat-y;
}

.short#calendar #left, .short#calendar #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#calendar #left:lang(en), .short#calendar #right:lang(en)	{
	height:	505px;
}

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

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

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

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

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

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

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

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

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

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

#calendar .day	{
	font-size:	14px;
	float:		left;
	clear:		none;
}

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

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

#calendar .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;
}