/*****************************************************************************
**		 __      __  ____     ____     __  __  ________   ________      	**
**		/\ \  __/\ \/\  _`\  /\  _`\  /\ \/\ \/\_____  \ /\_____  \    		**
**		\ \ \/\ \ \ \ \ \L\ \\ \ \L\ \\ \ \ \ \/____//'/'\/____//'/'   		**
**		 \ \ \ \ \ \ \ \  _ <'\ \  _ <'\ \ \ \ \   //'/'      //'/'    		**
**		  \ \ \_/ \_\ \ \ \L\ \\ \ \L\ \\ \ \_\ \ //'/'___   //'/'___  		**
**		   \ `\___x___/\ \____/ \ \____/ \ \_____\/\_______\ /\_______\		**
**			'\/__//__/  \/___/   \/___/   \/_____/\/_______/ \/_______/		**
**																			**
**	This site created by Drew Loomer for the West Bloomfield Township 		**
**	Public Library Youth Department.  										**
**	Completed on 9-14-2009													**
**	loomerdr@wblib.org														**
**	Sorry about the lame ASCII art - it was just too tempting...			**
**																			**
**	These styles are used by the programs pages.							**
**																			**
*****************************************************************************/


#calendar
{
	background-color:			#fff;
	border:						1px solid #5c5c5c;
	border-collapse:			collapse;
	color:						#434F6A;
	margin-left:				5px;
	width:						600px;
}

#calendar td
{
	border:						1px solid #5c5c5c;
}

#calendar img
{
	margin:						1px;
}

#calendarDays
{
	background-color:			#5c5c5c;	
	text-align:					center;
	vertical-align:				middle;
}

#calendarDays td
{
	border:						1px solid #fafafa;
	border-top:					1px solid #5c5c5c;
	height:						30px;
	padding-top:				3px;
	width:						85px;
}

.calendarWeek
{
	height:						100px;
	vertical-align:				top;
}

.calendarBox
{
	padding:					2px;
}

.calendarBoxCurrent
{
	background-color:			#f7f2e2;
	padding:					2px;
}

.calendarNum
{
	float:						right;
	line-height:				10px;
	margin-bottom:				0px;
}

#calendarTitle
{
	font-size:					16px;
	font-weight:				bold;
	margin-left:				auto;
	margin-right:				auto;
	text-align:					center;
}

.nextMonth
{
	clear:						none;
	float:						right;
	margin-right:				10px;
}

.lastMonth
{
	clear:						none;
	float:						left;
	margin-left:				10px;
}

.calendarEntry
{
	cursor:						pointer;
	float:						left;
	font-size:					10px;
	margin:						0px;
	overflow:					hidden;
	text-align:					justify;
	white-space:				nowrap;
	width:						81px;
}

.calendarEntry:hover
{
	text-decoration:			underline;
}

.calendarEntryInfo
{
	display:					none;
}


#calendarBoxContent
{
	background-color:			#eeecd3;
	border:						1px solid #000;
	display:					none;
	left:						103px;
	padding:					10px;
	position:					absolute;
	top:						100px;
	width:						400px;
	z-index:					4;
}

.closeButton
{
	cursor:						pointer;
	float:						right;
}

.closeButton:hover
{
	text-decoration:			underline;
}

#calendarBoxContent h1
{
	color:						#434f6a;
	font-size:					24px;
	font-weight:				bold;
	line-height:				22px;
	margin-bottom:				2px;
	text-align:					left;
}

#calendarBoxContent h2
{
	font-size:					12px;
	font-weight:				bold;
}

#calendarBoxContent h3
{
	font-size:					12px;
	font-weight:				normal;
	margin-bottom:				10px;
}

.calendarMore
{
	clear:						left;
	cursor:						pointer;
	float:						left;
	font-size:					12px;
	margin:						0px;
	overflow:					hidden;
	text-align:					justify;
}

.calendarMore:hover
{
	text-decoration:			underline;
}

.listChoose
{
	float:						right;
	margin-right:				10px;
}

#calendarList
{
	float:						left;
	min-height:					300px;
	width:						610px;
}

#calendarList h2
{
	clear:						left;
	float:						left;
	margin-bottom:				3px;
	margin-top:					10px;
	width:						100%;
}

.listItem
{
	color:						#0b3243;
	cursor:						pointer;
	font-size:					16px;
	font-weight:				bold;
	margin-bottom:				2px;
	margin-left:				20px;
}

.listDate
{
	cursor:						pointer;
	font-size:					12px;
	font-style:					italic;
	margin-left:				40px;
	margin-top:					2px;
}

.listTime:hover
{
	text-decoration:			underline;
}

.listGroup
{
	clear:						left;
	display:					none;
	float:						left;
	width:						100%;
}

.monthHeading
{
	cursor:						pointer;
	float:						left;
	font-size:					22px;
	font-weight:				bold;
	margin-bottom:				3px;
	margin-top:					10px;
	width:						100%;
}