/*
--------------------------------------------------------------------------------------------------
 Title:			Events Styles
 Created on: 	24-10-2008
 Author:     	Roberto De Vivo
 Client:		Vincis
 Project:		Raadsplein
 Copyright:  	Vincis B.V. The Netherlands


*/
@media screen 
{

	/* Overrides of main styles */
	#totalContainer #content
	{
		float:					left;
		display:				inline;
		
		margin:					0; 
		padding:				0 26px 0 11px;
		width:					400px; /* 377 +237 - 157 -57 */

	}

	#totalContainer #path ul
	{
		margin:					4px 0 0 9px;
	}
	
	
	
	/*********************************************************************************************/
	/* =Misc									                                      			 */
	/*********************************************************************************************/
	#containerCalendarControl
	{
	
		display:				block;

		position:				absolute;
		right:					235px;
		top:					139px;
		
		width:					288px;
		padding:				0 26px 0 11px;
	}


	/*********************************************************************************************/
	/* =containerCalendarNavigation				                                      			 */
	/*********************************************************************************************/
	#containerCalendarNavigation
	{
		position:				relative;
		
		margin-top:				13px;
		padding:				11px;

		background-color:		#fff;
		background-repeat:		repeat-x;
		background-position:	left bottom;
		background-image:		url(/sjablonen/1/images/general/background_news_tab_data.gif);

		border:					1px solid #dadada;
	}
	

		#containerCalendarControl h2
		{
				font-size:					1.45em;
				font-weight:				bold;
				line-height:				150%;
				margin-left:				11px;
				margin-bottom:				19px;
		}
		
		/*#containerCalendarControl h2
		{
			display:				block;
			
			height:					24px;
			
			margin:					0 0 0 11px;
			padding:				0;
			
			text-indent: 			-5000px;
						
			background-repeat:		no-repeat;
			background-position: 	0 2px;
			
			background-image:		url(/sjablonen/1/images/general/text/evenement.gif);
		}*/
		
		#calendarform div
		{
			position: relative;
		}
		
			#calendarform label
			{
			}
	
			#totalContainer #calendarform .cm_select
			{
				margin-right:			13px;
				padding:				0 0 0 8px;
				
				height:					2em;
				line-height:			1.2em;
				width:					130px;	
				
				color:					#666;
				font-size:				1em;
			}
			
			#calendarform .submitButton
			{
				position:				absolute;
				top:					0;
				left:					202px;
		
				width:					70px;
				max-width:				70px;
				max-height:				24px;
				height:					24px;	
				margin:					0;
				padding:				0;
				padding-left:			400px;
	
				text-indent: 			-5000px;	
	
				background-image:		url(/sjablonen/1/images/general/custom/button_show.gif);
				background-repeat:		no-repeat;
				background-position: 	left top;
				background-color:		transparent;
				
				border:					medium none;
				overflow:				hidden;
				cursor:					pointer;
			}

			
				#calendarform .submitButton:hover
				{
					background-position: 	left bottom;
				}
		
		

		
			

		#containerCalendarNavigation ul
		{
			clear:					both;
			margin-top:				11px;
		}

			#containerCalendarNavigation ul li
			{
				padding:				0 13px 0 13px;	
				
				background-image:		url(/sjablonen/1/images/general/bullet_list.gif); 
				background-repeat:		no-repeat;
				background-position:	2px 10px;
			}
			
				#totalContainer #containerCalendarNavigation ul .alternate
				{
					background-color:		#f5f5f5;
				}
			
	/*********************************************************************************************/
	/* =containerCalendarComponent				                                      			 */
	/*********************************************************************************************/
	#containerCalendarComponent
	{
		position:				relative;
		margin:					13px 0 0 0;
		padding:				11px;
		
		width:					266px;

		background-color:		#fff;
		background-repeat:		repeat-x;
		background-position:	left bottom;
		background-image:		url(/sjablonen/1/images/general/background_news_tab_data.gif);

		border:					1px solid #dadada;
	}

		#totalContainer #calendarComponent
		{
			position:				relative;
			
			width:					100%;
			margin:					0;
			padding:				0;
		}

			#totalContainer #calendarComponent caption
			{
				color:					#333;
				text-align:				center;
				text-decoration:		none;
				font-weight:			bold;
			}
			
			
			
				#totalContainer #calendarComponent caption a
				{
					position:				absolute;
					top:					5px;
					
					display:				block;
		
					width:					17px;
					height:					16px;
					
					margin:					0;
		
					text-indent: 			-5000px;	/* remove text */
		
					background-image:		url(/sjablonen/1/images/calendar/paging_arrows.gif);
					background-repeat:		no-repeat;
					background-position: 	left top;
					background-color:		transparent;
					
					border:					medium none;
					overflow:				hidden;
					cursor:					pointer;
				}
				
					/* previous month */
					#totalContainer #calendarComponent caption .previousMonth
					{
						left:					11px;
						background-position: 	left top;
					}
					
						#totalContainer #calendarComponent caption .previousMonth:hover
						{
							background-position: 	0 -17px;
						}
					
					/* next month */
					#totalContainer #calendarComponent caption .nextMonth
					{
						right:					11px;
						background-position: 	right top;
					}
					
						#totalContainer #calendarComponent caption .nextMonth:hover
						{
							background-position: 	-20px -17px;
						}			
				
					/* weekdays */
					#totalContainer #calendarComponent thead th
					{
						font-weight:			bold;
						border-bottom:			1px solid #dadada;
					}
					
						#totalContainer #calendarComponent thead .tableStart
						{
							border-right:			1px solid #dadada;
						}
						
			/* weeknumbers*/
			#totalContainer #calendarComponent tbody th 
			{
				font-weight:			bold;
				width:					35px;
			}
			
				#totalContainer #calendarComponent tbody th a
				{
					font-weight:			bold;
					color:					#777;	/* =10 */
					text-decoration:		none;

					background-color:		#f5f5f5;	/* =14 */
					border-right:			1px solid #dadada;
				}

					#totalContainer #calendarComponent tbody th a:hover
					{
						color:					#333;	/* =13 */
						text-decoration:		underline;
						
						background-color:		#c0c0c0;	/* =12 */
					}
			
			/* generic cell */
			#calendarComponent td, #calendarComponent th
			{
				text-align:				center;
			}
			
				#calendarComponent td a, #calendarComponent th a
				{
					display:				block;
				}
		
			/* generic */
			#totalContainer #calendarComponent td a
			{
				color:					#777;	/* =10 */
			}

				#totalContainer #calendarComponent td a:hover
				{
					color:					#333;	/* =13 */
					background-color:	#c0c0c0;	/*	=12 */
				}
				
			/* other month */
			#totalContainer #calendarComponent .otherMonth
			{
				color:				#c0c0c0	;	/* =12 */
			}
			
			/* today */
			#totalContainer #calendarComponent .today a
			{
				font-weight:		bold;
				background-color:	#f5f5f5;	/*	=14 */
			}
			
				#totalContainer #calendarComponent .today a:hover
				{
					background-color:	#c0c0c0;	/*	=12 */
				}
			
			/* selected */
			#totalContainer #calendarComponent .selectedItem a
			{
				font-weight:		bold;
				text-decoration:	none;
				
				color:				#fff;
				background-color:	#333;	
			}
			
				#totalContainer #calendarComponent .selectedItem a:hover
				{
					background-color:	#777;	/*	=10 */
				}	

			#totalContainer  #calendarComponent  .selectedItem  span 
			{
				background-image:		url(/sjablonen/1/images/event/calendar_selected.gif);
				background-position:	left top;
				background-repeat:		no-repeat;
				font-weight:			bold;
				text-decoration:		none;
			}
			
			#totalContainer #calendarComponent tbody .selectedWeek th a,
			#totalContainer #calendarComponent .selectedWeek td span,
			#totalContainer #calendarComponent .selectedWeek td a
			{
				background-color:		#dadada;	 /* =unique */
				color:					#333;		/* =13 */
			}
			
			
				#totalContainer #calendarComponent .selectedWeek td
				{
					background-color:		#f5f5f5;	 /* =104 */
					background-image:		none;
				}


		/* generic cell */
		#totalContainer #calendarComponent td,
		#totalContainer #calendarComponent th
		{
			color:					#777;		/* =10 */
			text-align:				center;
			padding:				0;
		}
		
			#totalContainer #calendarComponent td a,
			#totalContainer #calendarComponent td span,
			#totalContainer #calendarComponent th a
			{
				display:				block;
				padding:				0;
			}
			
			#totalContainer #calendarComponent td,
			#totalContainer #calendarComponent td span,
			#totalContainer #calendarComponent td a
			{
				width:					24px;
				height:					24px;
			}
			
			#totalContainer #calendarComponent tbody th,
			#totalContainer #calendarComponent tbody th a
			{
				height:					24px;
			}
	
		/* generic */
		#totalContainer #calendarComponent td a
		{
			color:					#777;	/* =10 */
			text-decoration:		none;
			
			background-image:		url(/sjablonen/1/images/event/calendar_selected.gif);
			background-repeat:		no-repeat;
			background-position: 	left -120px;
		}

			#totalContainer #calendarComponent td a:hover
			{
				color:					#333;		/* =13 */
				font-weight:			bold;

				background-image:		url(/sjablonen/1/images/event/calendar_selected.gif);
				background-repeat:		no-repeat;
				background-position: 	left -144px;
			}
			
		/* other month */
		#totalContainer #calendarComponent .otherMonth
		{
			/* Settings, see top of File */
		}
		
		/* today */
		#totalContainer #calendarComponent .today
		{
			/* Settings, see top of File */			
		}
		
			#totalContainer #calendarComponent .today a
			{
				/* Settings, see top of File */
	
				font-weight:		bold;
				
				background-image:	url(/sjablonen/1/images/event/calendar_selected.gif);
				background-repeat:	no-repeat;
				background-position:left -48px;
			}
			
				#totalContainer #calendarComponent .today a:hover
				{
					/* Settings, see top of File */
					
					background-position: 	left -72px;
				}
		
		/* selected item */
		body #totalContainer #calendarComponent .selectedItem a,
		body #totalContainer #calendarComponent .selectedItem span
		{
			font-weight:		bold;
			text-decoration:	none;

			/* Settings, see top of File */
		
			background-image:		url(/sjablonen/1/images/event/calendar_selected.gif);
			background-repeat:		no-repeat;
			background-position: 	left top;
		}
		
			body #totalContainer #calendarComponent .selectedItem a:hover
			{
				background-position: 	left -24px;
			}	
			
	/* selectedWeek */
	#totalContainer #calendarComponent tbody .selectedWeek th a,
	#totalContainer #calendarComponent .selectedWeek td span,
	#totalContainer #calendarComponent .selectedWeek td a
	{
		/* Settings, see top of File */
		
		background-image:		url(/sjablonen/1/images/event/calendar_selected.gif);
		background-repeat:		repeat-x;
		background-position: 	left -96px;
	}
	
	#totalContainer #calendarComponent .selectedWeek td a
	{
		background-position: 	left -168px;
	}
	#totalContainer #calendarComponent .selectedWeek td a:hover
	{
		background-position: 	left -144px;
	}
	
		#totalContainer #calendarComponent .selectedWeek td
		{
			/* Settings, see top of File */

			background-image:		none;
		}
	
		#totalContainer #calendarComponent .selectedWeek .today span,
		#totalContainer #calendarComponent .selectedWeek .today a
		{
			background-image:		url(/sjablonen/1/images/event/calendar_selected.gif);
			background-repeat:		no-repeat;
			background-position: 	left top;
		}
		
		#totalContainer #calendarComponent .selectedWeek .today a
		{
			background-image:		url(/sjablonen/1/images/event/calendar_selected.gif);
			background-repeat:		no-repeat;
			background-position: 	left top;
		}	
			

	

				

	/*********************************************************************************************/
	/* =eventList								                                      			 */
	/*********************************************************************************************/
	
	#content .eventList	
	{
		clear:				both;

		margin:				0;
		padding:			6px 0 0 0 ;
	}

		#content .eventList	li
		{
			position:				relative;
			
			clear:					both;
			float:					left;
			display:				inline;
			
			margin-top:				13px;
			padding:				11px;
			width:					378px;
	
			background-color:		#fff;
			background-repeat:		repeat-x;
			background-position:	left bottom;
			background-image:		url(/sjablonen/1/images/general/background_news_tab_data.gif);
	
			border:					1px solid #dadada;
		}
		*>#content .eventList	li
		{
			height:					auto;
		}
		
		#content .eventList img
		{
			padding:			0;
			margin:				0;
			
			border:				0;
		}
		
			#totalContainer #content .eventList	h2
			{
				margin:				0;
				padding:			0;
				color:			#333;
			}
			
			#totalContainer #content .eventList	.link
			{
				margin-top:		11px;
			}
			
			#content .eventList	h3
			{
				font-size:			1.09em;
				
				margin:				8px 0 0 0;
				padding:			11px 0 8px 0;
				
				line-height:		1.2em;
			
				border-top:			1px solid #dadada;
			}
			
			#content .eventList	p
			{
				margin:				0;
				padding:			0;
			}
			
			#content .eventList	.readMore
			{
				line-height:		1.2em;
			}
			
		
			#content .eventList	table
			{
				width:					100%;
				
				margin:					8px 0 0 0;
				padding:				0;
				
			}
			
				#content .eventList	table th
				{
					width:			12px;
					padding-right:	8px;
				}
}