/*
--------------------------------------------------------------------------------------------------
 Title:			Announcement Styles
 Created on: 	26-01-2010
 Author:     	Roberto De Vivo
 Client:		Vincis
 Project:		Provinsje Fryslân Corporate Website
 Copyright:  	Vincis B.V. The Netherlands

--------------------------------------------------------------------------------------------------
 Index:
--------------------------------------------------------------------------------------------------

 
--------------------------------------------------------------------------------------------------
 Colors:
--------------------------------------------------------------------------------------------------
 =1 Content Background 	#fff	(white)
 =2	Logo Blue			#2b56a1	(blue)
 =3	Logo Red			#c73326	(red)
 =4 Body background		#f3f5f6	(light grey)
 =5 Direct nei Frysk	#e28e8a	(light red)
 
 
 =10	Body text		#777	(medium gray)			- also Resize font
 =11	Shortcuts		#999	(medium light gray)
 =12	Menu underline	#c0c0c0	(light gray)			- also Download-size
 =13	Shortcuts MO	#333	(dark grey)

 * Kleurenblokken *
 =A		Cultuur			#714194	(purple)
 =A1	CultuurFr		#aa8dbf	(purple, 60%)
 =B		Natuur			#c6d746	(green)
 =B1	NatuurFr		#d7e37d	(green, 60%)
 =C		Onderwijs		#1c78be	(blue)
 =C1	OnderwijsFr		#77aed8	(blue, 60%)
 =D		Veiligheid		#850059	(wine)
 =D1	VeiligheidFr	#b6669b	(wine, 60%)
 =E		Verkeer			#df8c31	(orange)
 =E1	VerkeerFr		#e9Ae6f	(orange, 60%)
 =F  	Ondernemen		#4a328e	(dark blue)
 =F1	OndernemenFr	#9284bb	(dark blue, 60%)
 =G		Wonen			#ad006b	(purple)
 =G1	WonenFr			#ce66a6	(purple, 60%)
 =H		Zorg			#f0c341	(light orange)
 =H1	ZorgFr			#f3cf67	(light orange, 60%)
 =I		Internationaal	#25a2e1	(light blue)
 =I1	InternationaalFr	#7cc7ed	(light blue, 60%)
 */
 
@media screen
{

	div.gmap_customPanZoomControl
{
	height:					108px;
	width:					59px;
	
	background-repeat:		no-repeat;
	background-image:		url(/sjablonen/1/images/gmap/customcontrols/customPanZoomControl.gif);
}

	*>div.gmap_customPanZoomControl
	{
		background-image:		url(/sjablonen/1/images/gmap/customcontrols/customPanZoomControl.png);
	}
		div.gmap_customPanZoomControl div.panUp, div.gmap_customPanZoomControl div.panDown, div.gmap_customPanZoomControl div.panLeft, div.gmap_customPanZoomControl div.panRight, div.gmap_customPanZoomControl div.center, div.gmap_customPanZoomControl div.zoomIn, div.gmap_customPanZoomControl div.zoomOut
		{
			cursor:					pointer;
			position:				absolute;
			height:					17px;
			width:					17px;
		}
		
		div.gmap_customPanZoomControl div.panUp
		{
			margin:					0 0 0 20px;
		}
		
		div.gmap_customPanZoomControl div.panDown
		{
			margin:					40px 0 0 20px;
		}
		
		div.gmap_customPanZoomControl div.panLeft
		{
			margin:					20px 0 0 0;
		}
		
		div.gmap_customPanZoomControl div.panRight
		{
			margin:					20px 0 0 40px;
		}
		
		div.gmap_customPanZoomControl div.center
		{
			margin:					20px 0 0 20px;
		}

		div.gmap_customPanZoomControl div.zoomIn
		{
			margin:					65px 0 0 20px;
		}
		
		div.gmap_customPanZoomControl div.zoomOut
		{
			margin:					90px 0 0 20px;
		}


	/* Overrides of main styles */
	#totalContainer #content
	{
		width:					615px; 	

	}

	#totalContainer #content h1
	{
		width:					551px;
	}
	
	#totalContainer #sideBar
	{
		display:				none;
		visibility:				hidden;
	}

	/*Global*/
	#content .message
	{
		float:					left;
		display:				inline;
		
		width:					405px;	/* 455 -20 */
		margin:					0 20px 0 0;
		
		height:					200px;
	}
	
	/*********************************************************************************************/
	/* Google stuff				                                                          		 */
	/*********************************************************************************************/	
	#announcementMap
	{
		float:					left;
		display:				inline;
		
		width:					403px;	/* 455 -20 -1 -1 */
		margin:					0 20px 0 0;
		height:					413px;
		
		border:					1px solid #777;
	}
	
	/* small */
	#announcementItemMap #announcementMap
	{
		float:					left;
		display:				inline;
		
		width:					178px;	
		margin:					0 0 13px 0;
		height:					178px;
		
		border:					1px solid #777;
		overflow:				hidden;
	}
	
		#totalContainer  .gmap_customMapTypeButton  
		{
			display:				block;
			
			padding:				4px 6px 4px 6px;
				
			line-height:			1.48em;
			height:					15px;
			
			font-size:				1em;
			color:					#fff;
			line-height:			1.2em;
			font-weight:			bold;
			text-decoration:		none;
			
			background-color:		#c73326;	/* =2 */
		}
		
			#totalContainer  .gmap_customMapTypeButton:hover
			{
				background-color:		#5e110b;	/* =2 */
				cursor:					pointer;
			}
		
			#totalContainer .gmoprint
			{
				display:				none;
			}
			
			/* Info bubble */
			/* Height is calculated before any subpage or typography styles are applied. */
			/* Therefore apply styles to the class (.gmapInfoWindow) beforehand and specify for the real view as an extra selector (#totalContainer .gmapInfoWindow, ... ) */
			.gmapInfoWindow 
			{
				height:					10px;
				min-height:				10px;
				
				font-size:				1em;
				line-height:			1.4em;	
				
				max-width:				290px;
			}
			*>.gmapInfoWindow 
			{
				height:					auto;
			}
			
				.gmapInfoWindow h3,
				#totalContainer #content .gmapInfoWindow h3
				{
					clear:					both;

					padding:				0 16px 4px 0;
					
					margin-bottom:			0.09em;		

					color:					#2b56a1;	/* =2 */
					font-weight:			bold;
					font-size:				1.18em;		
									
					line-height:			1.09em;		
				}
				
		/* table*/
		.gmapInfoWindow table,
		#totalContainer #content .gmapInfoWindow table
		{
			clear:					none;			
			padding: 				0;
			margin:					0 0 8px 0;

			border-collapse: 		collapse;
		}

			.gmapInfoWindow table tbody
			{
				padding: 				0;
				margin:					0;
			}
		
			.gmapInfoWindow table th,
			#totalContainer #content .gmapInfoWindow table th
			{
				font-weight:			bold;
	
				padding: 				2px 6px 2px 0;
				margin:					0;
			}
			
			.gmapInfoWindow table td,
			#totalContainer #content .gmapInfoWindow table td
			{
				padding: 				2px 6px 2px 0;
				margin:					0;
				
				border-width: 			0;
			}

		/* list */
		.gmapInfoWindow ul,
		#totalContainer #content .gmapInfoWindow ul
		{
			clear:				both;
			display:			block;

			padding:			0 0 8px 0;
			margin:				0;
			min-height:			1em;
			height:				auto;
		}

			.gmapInfoWindow ul li,
			#totalContainer #content .gmapInfoWindow ul li
			{
				position:				relative;
				padding:				0 13px 4px 13px;
				line-height:			1.18em;

				background-image:		url(/sjablonen/1/images/general/bullet_list.gif); 
				background-repeat:		no-repeat;
				background-position:	2px 7px;
			}
	
	/*********************************************************************************************/
	/* announcementOptions		                                                          		 */
	/*********************************************************************************************/	
	#announcementOptions
	{
		float:					left;
		display:				inline;
		
		width:					180px;
	}
	
		#totalContainer #announcementOptions h2,
		#totalContainer #announcementOptions h3
		{
			clear:					none;
			padding-top:			0;
		}
		
		#totalContainer #announcementOptions .cm_input
		{
			width:					161px;				/*180-16 -1 -1*/
		}
			/* postcode */
			#totalContainer #announcementOptions #announcementZipcode
			{
				width:					30px;
			}
			
			#totalContainer #announcementOptions #announcementZipcodeAddon
			{
				width:					20px;
			}
			
			#totalContainer #announcementOptions #announcementRadius
			{
				margin-left:			9px;
				width:					80px;
			}
			
			/* periode van + to*/
			#totalContainer #announcementOptions #fdm,
			#totalContainer #announcementOptions #tdm
			{
				width:					39px;
				margin-right:			2px;
			}
			
			#totalContainer #announcementOptions #fdy,
			#totalContainer #announcementOptions #tdy
			{
				width:					50px;
			}
			
		#totalContainer #announcementOptions .cm_select
		{
			width:					180px;				/*180-16 -1 -1 + 19*/
		}
		
		#totalContainer #announcementOptions .cm_button
		{
			width:					160px;
		}
		
	/*********************************************************************************************/
	/* tabSelector		                                                                   		 */
	/*********************************************************************************************/	
	#totalContainer .tabSelector
	{
		padding-top:			20px;
		height:					30px;
		
		border-bottom:			6px solid #c73326;	/* 3 */
	}
	
		#totalContainer .tabSelector li
		{
			float:					left;
			display:				inline;
			
			margin:					0;
			padding:				0;
			min-width:				10px;
			width:					10px;
			min-height:				30px;
			height:					30px;

			background-image:		none;
			
			white-space:			nowrap;
		}
		*>#totalContainer .tabSelector li
		{
			width:					auto;
		}
		
		#totalContainer #content .tabSelector li a
		{
			float:					left;
			display:				inline;

			margin:					6px 1px 1px 0;
			padding:				5px 12px 0 12px;
			min-width:				10px;
			width:					10px;
			min-height:				18px;
			height:					18px;
			
			color:					#fff;
			font-weight:			bold;
			text-decoration:		none;

			background-image:		none;
			background-color:		#7d170e;	/* unique */
		}
		*>#totalContainer  #content .tabSelector li a
		{
			width:					auto;
		}
		
			#totalContainer #content .tabSelector li a:hover
			{
				margin:					6px 1px 1px 0;
				padding:				5px 12px 0 12px;
			
				min-height:				18px;
				height:					18px;
				
				color:					#fff;
				font-weight:			bold;
				text-decoration:		none;
				background-color:		#5e110b;	/* =unique */
			}
		
		#totalContainer .tabSelector .tabSelected span
		{
			float:					left;
			display:				inline;

			margin:					0 1px 0 0;
			padding:				11px 12px 1px 12px;
			min-width:				10px;
			width:					10px;
			min-height:				18px;
			height:					18px;
			
			color:					#fff;
			font-weight:			bold;
			text-decoration:		none;

			background-image:		none;
			background-color:		#c73326;	/* =2 */
		}
		*>#totalContainer .tabSelector .tabSelected span
		{
			width:					auto;
		}
		
	/*********************************************************************************************/
	/* announcementsList		                                                          		 */
	/*********************************************************************************************/	
	#content #announcementsList
	{
		/* Adjust to #content width (see subpage.css) */
		
		width:				615px;
		
		/* ----------------------------------------- */
		
		margin:				0;
		padding:			0;
		
		border-bottom:		2px solid #999;		/* =11 */
	}
		
		#content #announcementsList th
		{
			color:				#c73326;			/* =2*/
			
			padding:			9px 8px 4px 8px;
			border-bottom:		2px solid #999;		/* =11 */		
			
			white-space:		nowrap;
		}
		
			#announcementsList th a
			{
				color:				#c73326;				/* =2*/
				text-decoration:	none;
			}
			
				#announcementsList th a:hover
				{
					color:				#333;				/*= 100*/
					text-decoration:	underline;
				}
		
		/* data */	
		#announcementsList tr td
		{
			height:				16px;
			padding:			8px 8px 6px 8px;
			
			border-bottom:		1px solid #b2b2b2;	/* =103*/
			line-height:		1.45em;
		}
		
			#announcementsList td a
			{
				font-weight:		normal;
				color:				#333;	/*= 100*/
			}
			
				#announcementsList td span
				{
					font-weight:		bold;
					padding-right:		8px;
				}
			
				#announcementsList td a:hover
				{
					color:				#777;	/*= 101*/
				}
		
			/* Even */		
			#content #announcementsList  td,
			#content #announcementsList .even td
			{
				background-color:					#f9f9f9;	/* unique */
			}
	
				#totalContainer #content #announcementsList .announcementType
				{
					background-color:					#f5f5f5;	/* =104 */
				}

			/*  Odd */
			#content #announcementsList .odd td
			{
				background-color:					#fff;	/* =105 */
			}
			
				#totalContainer  #content #announcementsList .odd .announcementType
				{
					background-color:					#f9f9f9;	/* unique */
				}
				
	/*********************************************************************************************/
	/* announcementItem	             		                                      	     		 */
	/*********************************************************************************************/	
	
	#content #announcementItem
	{
		float:					left;
		display:				inline;
		
		width:					405px;	/* 455 -20 */
		margin:					0 20px 0 0;
	}	
	
	/*********************************************************************************************/
	/* announcementsItemList	                                                   	     		 */
	/*********************************************************************************************/	
	#content #announcementsItemList
	{
		/* Adjust to #content width (see subpage.css) */
		
		width:				405px;
		
		/* ----------------------------------------- */
		
		margin:				0;
		padding:			0;
		
		border-top:			2px solid #999;		/* =11 */
		border-bottom:		2px solid #999;		/* =11 */
	}
		
		#content #announcementsItemList th
		{
			font-weight:		bold;
			width:				135px;
		}

		/* data */	
		#announcementsItemList tr td,
		#announcementsItemList tr th
		{
			height:				16px;
			padding:			8px 8px 6px 8px;
			
			border-bottom:		1px solid #b2b2b2;	/* =103*/
			line-height:		1.45em;
		}
		
			/* Even */		
			#content #announcementsItemList  td,
			#content #announcementsItemList  th,
			#content #announcementsItemList .even td
			{
				background-color:					#f9f9f9;	/* unique */
			}
	
			/*  Odd */
			#content #announcementsItemList .odd td,
			#content #announcementsItemList .odd th
			{
				background-color:					#fff;	/* =105 */
			}
			
				
}
