/* 
	Caps for Kids 
	Calendar Screen CSS
	Alison Endacott
	5/2009
	
 */
 


#calendar {
	position: relative;
	padding: 1em 0;
	margin-left: 17px;
}


	#container #calendar ul {
		padding: 0;
		margin: 0;
	}
	
		#calendar li {
			list-style: none;
		}
	
	/* heading */
	
	#calendar h3 {
		text-align: center;
		font-size:2.2em;
		font-weight:normal;
		line-height:0.7em;
		padding: .5em 0;
		background: transparent;
		color: #034e9b;
	}
	
		#prevnext a {
			position: absolute;
			top: 25px;
			display: block;
			width: 11px;
			height: 12px;
			overflow: hidden;
			text-indent: -9999px;
		}
		
		#prev a {
			left: 249px;
			background: url(/content/v1/us/img/previous.gif) no-repeat;
		}
		#next a {
			left: 485px;
			background: url(/content/v1/us/img/next.gif) no-repeat;
		}
		
	#content p.calendar-view-button,
	#content p.list-view-button {
		display: inline;
		font-size: 1em;
		padding: 0;
		color: #034e9b;
		*margin-top: -1em;
		font-weight: bold;
		padding-left: 20px;
		padding: .1em 0 .1em 20px;
	}
	
	#content p.list-view-button {
		background: url(/content/v1/us/img/list.gif) no-repeat left;
		margin-right: 5px;
	}
	
	#content p.calendar-view-button {
		background: url(/content/v1/us/img/date.gif) no-repeat left;
		cursor: default;
		font-weight: bold;
		
	}
	
	#content p.list-view-button {
		padding-right: 5px;
		border-right: 1px solid;
	}
	#content p.inactive-view {
		cursor: pointer;
		font-weight: normal;
	}
	
		#content p.inactive-view:hover {
			text-decoration: underline;
		}
		
		/* event styles */
		
		dt.eventDescritpion ,
		dt.eventStart{
			text-indent: -9999px;
			overflow: hidden;
			height: 0;
		}
		
		dd.eventStart,
		dd.eventEnd 	{
			display: inline;
		}
		
		dt.eventLocation ,
		dd.eventLocation {
			display: block;
			float: left;
			padding-right: 3px;
		}
		
		dd.eventDescritpion {
			clear: both;
		}
		
			.eventDescritpion ul 
			{
				padding-left: 15px;
			}
				.eventDescritpion li 
				{
					padding: .2em 0;
				}
		
/* list view */

.list-view #cal-head ,
.list-view p.view-all,
.list-view p.closeEvent,
.list-view #cal-days li,
.list-view #cal-days li h4 {
	display: none;
}


	#container .list-view .all-events {
		width: 725px;
		border-bottom: 1px dotted;
		margin-right: 35px;
		background:#f3f0a9 none repeat scroll 0 0;
		border:3px solid #EBE670;
		margin-top: 1em;
		*margin: 0 0 .5em 0;
	}

		#cal-days li.info,
		.list-view #cal-days .all-events h4 {
			display: block;
			
		}
		
		.list-view #cal-days .all-events h4 {
			background: #EBE670;
			padding: .1em 5px;
			
			font-size:1.3em;
			font-weight:normal;
			text-align:left;
		}
		
		#container .list-view .all-events h3 {
			font-family:Arial,Helvetica,sans-serif;
			font-size: 1.1em;
			text-align: left;
			font-weight: bold;
			padding: 0 5px;
			
		}
		
		.list-view h3.toggler {
			cursor: default;
			padding-top: .5em !important;
		}
		
		.list-view dl.element {
			visibility: visible !important;
			overflow: visible !important;
			opacity: 1 !important;
			height: auto !important;
			padding-left: 5px !important;
			padding-top: .3em !important;
			
		}
		
			.list-view dd.eventDescritpion {
				border-bottom: 1px solid #fff;
			}
		

/* calendar view */	

#container .calendar-view {
	margin-left: 20px;	
}
	#container .calendar-view #cal-head {
		display: block;
		margin: 1.5em 0 .5em 0;
		background: #034e9b;
		width: 725px;
		}
	
		 #container .calendar-view #cal-head li {
			width: 103px;
			margin: .2em 0;
			float: left;
			text-align: center;
			text-transform: uppercase;
			font-size: .9em;
			color: #fff;
			*padding-bottom: .3em;
		 }
	 
	 /* days */
	 
	 
		.calendar-view #cal-days li {
	 		display: block;
			padding: 0;
			margin: 0;
			float: left;
			width: 100px;
			height: 100px;
			_display: inline;
			border: 2px solid #fff;
			background: #eef3f9;
			_overflow: hidden;
		 }
			 
		 
			.calendar-view #cal-days li.today  {
				background: #cbdaeb;
			 }
			 
			 .calendar-view #cal-days li.info  {
				cursor: pointer;
			 }
				#cal-days li.info:hover {
					border-color: #034e9b;
				}
			.calendar-view #cal-days li.selected , .calendar-view #cal-days li.selected:hover  {
				background: #EBE670;
				border-color: #EBE670;
				
			 }
				
			.calendar-view #cal-days h4 {
				color: #034e9b;
				font-size: 1.4em;
				font-weight: normal;
				padding: 6px 0 0 8px;
				text-align: left;
			}
				.calendar-view #cal-days li.today h4 {
					color: #000;
				}
				
				.calendar-view #cal-days li.selected h4 {
					
				}
		 
			#container .calendar-view #cal-days ul li ul {
				padding: 0 8px;
				height: 60px;
				overflow: hidden;
			}
		 
				.calendar-view #cal-days li ul li {
					width: auto;
					height: auto;
					font-size: .9em;
					line-height: 1;
					padding: .2em 0 .2em 0;
					border: 0;
					background: transparent;
				}
				/* days */
				.calendar-view #cal-days li.sunday { margin-left: 0; }
				.calendar-view #cal-days li.monday { margin-left: 104px; }
				.calendar-view #cal-days li.tuesday { margin-left: 208px; }
				.calendar-view #cal-days li.wednesday { margin-left: 312px; }
				.calendar-view #cal-days li.thursday { margin-left: 416px; }
				.calendar-view #cal-days li.friday { margin-left: 520px; }
				.calendar-view #cal-days li.saturday { margin-left: 624px; }
					
					.calendar-view #cal-days li ul li a {
						color: #000;
					}
					
					.calendar-view #cal-days p.view-all {
						position: absolute;
						margin-top: 5px;
						margin-right: 2px;
						text-transform: uppercase;
						font-size: .8em;
						color: #034e9b;
						padding: 0 0 0 5px;
						width: 90px;
						height: 90px;
						text-indent: -9999px;
						overflow: hidden;
						z-index: 999;
						background: url(/content/v1/us/img/view-all.gif) no-repeat bottom right;
					}
					.calendar-view #cal-days .selected p.view-all {
						background: transparent;
					}
						.calendar-view #cal-days p.view-all:hover {
							text-decoration: underline;
						}
					
						
		/* event details */
		
			/* hide show selected */
				.calendar-view .hide {
					display: none;
				}
				
				.calendar-view .selected .hide {
					display: block;
				}
		
		.calendar-view .right .all-events {
			left: 100px;
		}
		.calendar-view .left .all-events {
			left: -318px;
		}
		.calendar-view .all-events {
			position: relative;
			border: 1px solid;	
			top: -85px;
			z-index: 9999;
			width: 310px;
			_overflow: hidden;
			background: #f3f0a9;
			border: 3px solid #EBE670;
			font-size: .9em;
			cursor: default;
		}
		
		.calendar-view #cal-days .all-events  h4 {
			background: #EBE670;
			padding: 0 0 0 5px;
			
		}
		
			.calendar-view .all-events dl {
				margin-bottom: 2px;
				padding: 0 5px;
				
				font-size: 1.1em;
			}
		
				#container .calendar-view .all-events h3 {
					font-family:Arial,Helvetica,sans-serif;
					font-size: 1.1em;
					text-align: left;
					font-weight: bold;
					padding: .5em 15px .5em 5px;
					cursor: pointer;
					width: 290px;
					line-height: 1em;
					background: #fff url(/content/v1/us/img/arrows-down.gif) no-repeat 300px 6px;
				}
				
				#container .calendar-view .all-events h3.active {
					
					background: url(/content/v1/us/img/arrows-up.gif) no-repeat 300px 6px;
				}
					.calendar-view .all-events h3:hover,
					.calendar-view .all-events h3.active:hover {
						background-color: #FFE990;
					}
				
					dd.eventDescritpion {
						height: auto;
					}
					
			/* close button */
			.calendar-view p.closeEvent {
				cursor: pointer;
				position: absolute;
				text-transform: uppercase;
				font-size: .8em;
				
				z-index: 99999;
				width: 40px;
				height: 10px;
				padding-top: 3px;
				/*background: url(/content/v1/us/img/close.gif) no-repeat 0 2px;*/
			}
			
			.calendar-view .left p.closeEvent {
				margin-left: -46px;
			}
			.calendar-view .right p.closeEvent {
				margin-left: 373px;
			}
				.calendar-view p.closeEvent:hover {
					text-decoration: underline;
				}