/************************************************************************************************/
/* Author:			VINCIS Rinse van Dijk         					                   	  		*/
/* Description:		NEW LOKET stylesheet			                                  			*/
/* Site name:		Internet 2009 Gemeente Ooststellingwerf		                       	  		*/
/* Date created:	02-12-2009							                               	  		*/
/************************************************************************************************/


/************************************************************************************************/
/* Screen styles                                                                 				*/
/************************************************************************************************/
@media screen 
{	

	/*******************************************************************************************/
	/* =Home loket styling																	   */
	/*******************************************************************************************/
	#bannerMijnOverheid
	{
		float:			left;
		display:		block;
		width:			231px;
		margin:			5px 0 5px 0; 
	}
	
	.clearBoth
	{
		clear:					both;
	}
	
	#loketBody{
		margin: 				0 5px 5px 5px;
	}
	
	table th, .hide
	{
		display:				none;
	}
	
	
	
	#table01
	{
		margin-bottom:			8px;
		
	}

		table#table01 td
		{
		}
		
	#table02
	{
		background-color:			#ECE4C7;
		background-image:			url(/sjablonen/2/images/dynamic/digitaal_loket.jpg);
		background-repeat:			no-repeat; 
		border:						solid 1px #666666; 
	}	
	
		#table02 #tableHeader02_1
		{
			height:						120px;
		}
	
	#logo
	{
		float:						right;
		background-image:			url(/sjablonen/1/images/general/logo.png);
		background-repeat:			no-repeat;
	}
	
	td#mostViewed
	{
		background-color:			#ece4c7;
		border-left:				solid 1px #fff;
	}

		td#mostViewed #mostViewed_1
		{
			border-bottom:			solid 1px #fff; 
			height:					178px;	
		}
		*>td#mostViewed #mostViewed_1
		{
			border-top:				solid 1px #fff; 
			height:					177px;
		}
		
		td#mostViewed #mostViewed_2
		{
			float:					left;
			width:					273px; 
			height:					177px; 
			background-color:		#f1ebd5; 
		}
		
		td#mostViewed #mostViewed_3
		{
			margin:					5px 10px 5px 10px;
		}
		
			 #mostViewed_3 ul
			 {
				margin:				0 0 0 15px;
				padding:			0;
			 }
		
		img#meestBekeken
		{
			margin-bottom:			5px;
		}
		
		td#mostViewed #alphabet_4
		{
			float:					right;
			background-color:		#dfd7ba; 
			width:					266px; 
			height:					177px; 
		}
		
		td#mostViewed #alphabet_5
		{
			margin:					5px 10px 0px 10px; 
			color:					#999;
		}
		
			td#mostViewed img#alphabet_5_1
			{
				display:				block;
				clear:					both;
				margin:					0 0 8px 0;
				
			}
		
		td#mostViewed #alphabet_6
		{
			clear:					left; 
			padding-top:			5px;
		}
		
		td#mostViewed #alphabet_7
		{
			 float:					left;
		}		
		
		td#mostViewed #alphabet_8
		{
			float:					right;
		}
		
		td#mostViewed #alphabet_9
		{
			border-bottom:			solid 1px #fff; 
			height:					28px; 
			background-color:		#07ac6b;
		}
		
		img#themas
		{
			margin:					7px 0 0 10px;
			
		}
		
		td#mostViewed .themas_1
		{
			float:					left;
			width:					272px; 
			height:					84px; 
			background-color:		#F1EBD5; 
			border-right:			1px solid #dbd3b6;
			border-bottom:			1px solid #fff;			
		}
		
		
		td#mostViewed .themas_2
		{
			margin:					5px 5px 0px 10px;
		}
		
			td#mostViewed .themas_2 .green, td#mostViewed .themas_4 .green
			{
				font-weight:		bold;
				
			}	
			
				ul.green
				{
					margin:				0 0 0 15px;
					padding:			0;
				}

				.green li
				{
					margin:				0;
				}
			
				td#mostViewed .themas_2 .green span, td#mostViewed .themas_4 .green span
				{
					color:				#999;
				}
			
		td#mostViewed .themas_3
		{				
			float:					right;
			background-color:		#F1EBD5; 
			width:					266px; 
			height:					84px; 
			border-bottom:			1px solid #fff;			
		}
		
		td#mostViewed .themas_4
		{
			margin:					5px 5px 0px 10px;
		}
		
		.themas_5
		{
			border-left:			solid 1px #fff; 
			border-top:				solid 1px #fff;
			width:					231px!important;
		}
		
		#search_0
		{
			border-bottom:			solid 1px #fff; 
			height:					177px; 
			background-color:		#e91c3d; 
			background-image:		url(/sjablonen/2/images/loket/bg_zoek.gif); 
			background-repeat:		no-repeat; 
			background-position:	8px 20px;
		}
		
			#search_0 fieldset
			{
				border:				0;
				padding:			10px 0 0 10px;
			}
		
		#search_1
		{
			border-bottom:			solid 1px #fff; 
			height:					177px; 
			overflow:				hidden; 
			
			background-color:		#e91c3d; 
			
			background-image:		url(/sjablonen/2/images/loket/bg_zoek.gif); 
			background-repeat:		no-repeat; 
			background-position:	8px 20px;
		}
		
		#search_2
		{
			margin:					5px 10px 5px 10px;
		}
		
			#search_2 form
			{
				margin:					0;
			}
			
				#searchfield, #searchbutton
				{
					float:					left;
				}			

				#searchfield
				{
					margin:					0px 0 0 -3px;		
				}
				*>#searchfield	
				{
					margin:					0;
				}
				
				 #searchbutton
				 {
					margin:					1px 0 0 -5px;		
				 }
				 *>#searchbutton
				 {
					margin:					0 0 0 5px;		
				 }
			
			#search_2 .inpB
			{
				width:					140px;
			}
			
			#search_2 .image
			{
				border:					0;
			}
			
			#search_2 .refW
			{
				margin-left:			36px;
				clear:					both;
			}
			
		#search_3
		{
			padding-left:			10px; 
			margin-top:				10px;	
		}
		
		img#doelgroep
		{
			margin-bottom:			4px;
		}
		
		#Seldoelgroep
		{
			width:					200px;
		}
		
		#search_4
		{
			padding-left:			10px; 
			margin-top:				10px;
		}
		
		img#onderwerp
		{
			margin-bottom:			4px;
		}
		
		#selRubrieken
		{
			width:					200px;
		}
		
		#search_5
		{
			border-bottom:			solid 1px #fff; 
			height:					28px; 
			background-color:		#007b52;
		}
		
		#search_6
		{
			float:					left; 
			border-bottom: 			1px solid #fff;
			height:					58px;
			
		}
		
		#search_7
		{
			float:					right; 
			border-bottom: 			1px solid #fff;
			height:					116px;
		}
		
		#homeLink 
		{
			float:					right;
			display:				block;
			
			margin:					10px 10px 30px 10px;
		}
		
			#homeLink img
			{
				float:					right;
			}
		 
		
		#search_8
		{
			background-color:		#ece4c7; 
			border-left:			solid 1px #fff;
		}
		
		#productStyle
		{
			padding:				10px; 
			background-color:		#dcd2af; 
			border-bottom:			solid 1px #fff;
		}
		
		.moreLink
		{
			float:					right;
		}
		
	/*******************************************************************************************/
	/* =Thema view styling																	   */
	/*******************************************************************************************/	
	
	
	#thema1
	{
		border-bottom:				solid 1px #fff; 
		border-top:					solid 1px #fff; 
		height:						177px;
	}
		
	#path
	{
		padding:					5px 10px 5px 10px;
	}	
	
	#thema2
	{
		padding:					20px 10px 5px 10px;
	}
	
	#thema3
	{
		font-weight:				bold;
	}
	
	#thema4, .thema5
	{
		float:						left;
		width:						250px; 
	}
	
	#thema6
	{
		border-bottom:				solid 1px #ffffff; 
		height:						28px; 
		background-color:			#07ac6b;
	}
	
	#thema7
	{
		margin-left:				10px; 
		
		color:						#ffffff; 
		font-weight:				bold;
	}
	
	#thema8
	{
		padding:					5px 10px 5px 10px;
	}
	
	
	/*******************************************************************************************/
	/* =Rubriek view styling																   */
	/*******************************************************************************************/
	
	#rubriek1
	{
		border-bottom:				solid 1px #efebda; 
		border-top:					solid 1px #ffffff;
	}
	
	#rubriek2
	{
		padding:					5px 10px 5px 10px;
	}
	
	#rubriek3
	{
		border-bottom:				solid 1px #efebda; 
		height:						28px; 
		background-color:			#dfd7ba;
	}

	#rubriek4
	{
		margin-left:				10px; 
		margin-top:					7px; 
		font-weight:				bold;	
	}	
	
	#rubriek5
	{
		padding:					5px 10px 5px 10px;	
	}
	
	
	/*******************************************************************************************/
	/* =Alfabet view styling																   */
	/*******************************************************************************************/
	
	#alphabet1
	{
		border-bottom:				solid 1px #efebda; 
		height:						60px;
	}
	
	#path
	{
		border-top:					solid 1px #fff;
		
	}
	
	#alphabet2
	{
		height:						63px; 
		background-color:			#dfd7ba;
	}	
	
	
	.alphabet3
	{
		padding:					5px 10px 5px 10px;
	}
	
	.alphabet4
	{
		text-align:					right;
		margin-bottom:				10px;
	}
	
	.alphabet5
	{
		background-color:			#F1EBD5;
		padding:					5px 10px 5px 10px;
		border-top:					1px solid #fff;
	}
	
	.alphabet6
	{
		font-size:					15px; 
		font-weight:				bold;
	}
	
	.alfabet
	{
		margin-left:				15px;
	}

	.alphabet7
	{	
		margin-bottom:				10px;
		text-align:					right;
	}	
	
	.alphabet7 a img
	{
		text-align:					right;
	}
	
	/********************************************************************************************/
	/* =RechterColom styling (alleen layout2_loket2.asp)  								   		*/
	/*******************************************************************************************/	
	
	#rightColumn1
	{
		width:						231px;
		border-left:				solid 1px #fff; 
		border-top:					solid 1px #fff;
	}
	
	#rightColumn2
	{
		margin-top:					60px; 
		padding-bottom:				0px; 
		border-bottom:				solid 1px #fff; 
		height:						63px; 
		background-color:			#e91c3d; 
		
		background-image:			url(/sjablonen/1/images/general/bg_zoek.gif); 
		background-repeat:			no-repeat;
	}
	
	
	#rightColumn3
	{
		margin:						0px;
	}
	
	#rightColumn4
	{
		float:						left;
		display:					inline;
		margin-left:				45px;
		padding-top:				25px;
	}
	
		#rightColumn4 div
		{
			float:						left;
		}
	
	
	.inputText
	{
		float:						left;
		margin:						2px 0 0 0;
		padding:					2px 0 1px 3px;
		width:						170px;
	}
	
	
	#rightColumn5
	{
		float:						left;
		height:						17px;
		width:						17px;
		margin:						3px 0 0 5px;
		padding:					10px 0 0 0;
		background-color:			#e91c3d;
		border:						none;
		background-image:			url(/sjablonen/algemeen/images/general/zoek.gif);
		
	}
	
	
	#rightColumn6
	{
		float:						right;
		text-align:					right;
		margin-top:					4px; 
		margin-right:				8px;
	}
	
	#rightColumn7
	{
		background-color:			#e7dfbf; 
		border-bottom:				solid 1px #fff; 
		padding:					8px 0px 5px 10px;
	}
	
	#rightColumn8
	{
		background-color:			#ece4c7; 
		border-bottom:				solid 1px #ffffff; 
		padding:					8px 0px 5px 10px;
	}
	
	#rightColumn9
	{
		margin-top:					3px; 
		list-style-image:			url(/sysimgs/general/file.gif);
	}
	
	#rightColumn10
	{
		background-color:			#c2b587; 
		padding:					8px 0px 5px 10px; 
		border-bottom:				solid 1px #fff;
	}
	
	#printImage
	{
		margin:						3px 5px 3px 5px;
	}
	
	#rightColumn11
	{
		float:						right;
		margin:						10px 10px 30px 10px;
	}
	
	#rightColumn12
	{
		background-color:			#ece4c7; 
		border-left:				solid 1px #fff;
	}

	/********************************************************************************************/
	/* =Product view styling							  								   		*/
	/*******************************************************************************************/		
	
	#product1
	{
	
	}
	
	#product2
	{
		padding:					5px 10px 5px 10px;
	}
	
	
		#product2Img
		{
			margin-bottom:				4px;
		}
	
	#product3
	{
		text-align:					right;
		margin-top:					10px;
	}
	
	
	#containerLoketForm
	{
		display:					none;
	}


	#product4
	{	
		margin-bottom:				4px;
	}

	#product5
	{
		float:						right;
		margin-top:					10px;	
	}
	
		#formulier2
		{
			display:					none;
		}
	
	#product6
	{
		background-color:			#ece4c7; 
		border-bottom:				solid 1px #fff; 
		padding:					8px 0px 5px 10px;
	}
	
	
	.product7
	{
		margin-top:					3px; 
		list-style-image:			url(/sysimgs/general/file.gif);
	}
	
	#product8
	{
		border:						solid 1px #666666; 
		margin:						10px;
	}
	
	
	.product9
	{
		background-color:			#fff; 
		padding:					5px 10px 5px 10px;
		border-bottom:				2px solid #F1EFE6;
	}
	
	
		.product9Img
		{
			margin-bottom:				4px;
		}
	/********************************************************************************************/
	/* =Typography styling								  								   		*/
	/*******************************************************************************************/		
	
	#product2
	{
		line-height:			140%;
	}
	
	#product2 h2, h3
	{
		clear:					both;
		
		padding:				0;
		margin:					0;
		
		font-weight:			bold;
		font-size:				1.3em;	
		
		color:					#007b52;
	}
	
	
	#product2 h3
	{
		font-size:				1.2em;	
	}
	
	
	#product2 p
	{
		margin:					0 0 1.0em 0;
		padding:				0;
		
		font-size:				1.0em;
	}
	
	
	#product2 a
	{
		color:					#e91c3d;	/* =2 */
		text-decoration:		underline;
	}
	
		#product2 a:hover  
		{
			color:					#990f24;	/* =3 */
			text-decoration:		underline;
		}
		
		#product2 a:visited
		{
		/*	color:					#c728af; */	/* =2 */
			text-decoration:		underline;
		}
		
		
		#product2 .rood 
		{
			color:		#e91c3d;	
		}
		
		#product2 .groen 
		{
			color:		#007b52;
		}	
	
	/*********************************************************************************************/
	/* =Typography Image Styling				                                  	 			 */
	/*********************************************************************************************/	
	#product2 img
	{
		display:				block;
		margin:					2px 2px 2px 0px;
		padding:				0;
	}
	
		#product2 img.linksUitlijnen
		{
			margin:				2px 2px 2px 0;
		}
	
		
		#product2 img.rechtsUitlijnen
		{
			margin:				2px 0 2px 2px;
		}
		
	
	/*********************************************************************************************/
	/* =Typography Attributes 						                                  			 */
	/*********************************************************************************************/			
	#product2 .rechtsUitlijnen
	{
		float: 				right;
		padding-left:		8px;
	}
	
	#product2 .linksUitlijnen
	{
		float: 				left;
		padding-right:		8px;
	}
	
	#product2 strong
	{
		font-weight:		bold;
	}
	
	#product2 em
	{
		font-style:			italic;
	}

	#product2 .Samenvatting
	{
		font-weight:		bold;
		margin-bottom:		2em;
	}	
	
	/*********************************************************************************************/
	/* =Typography Lists 							                                   			 */
	/*********************************************************************************************/
	#product2 ul,
	#product2 ol
	{
		clear:				both;
		display:			block;

		padding:			0;
		margin:				0 0 1.0em 15px;

	}

		#product2 ul li
		{
			position:				relative;
			padding:				0 13px 0 9px;	

			background-image:		url(/sjablonen/algemeen/images/general/bullet.gif); 
			background-repeat:		no-repeat;
			background-position:	0px 0px;
		}
	
	#product2 ol
	{
		list-style-type: 		decimal;
		margin:					0 0 1.0em 20px;
	}
	
		#product2 ol li
		{
			display:			list-item;  /* work around for IE ordered list bug */ 
			
			padding:			0;
			min-height:			1em;
		}
	
	/*********************************************************************************************/
	/* =Typography Blockquote 								                                 	 */
	/*********************************************************************************************/		
	/* Blockquote Webkant  */		
	#product2 blockquote
	{
		padding:			0 13px 0 9px;
		margin:				0 0 0 9px;
	}

		#product2 blockquote blockquote
		{
			width:				auto;	
	
			padding:			0 0 0 9px;
			margin:				0 0 0 9px;
		}

	/* Blockquote in de editor		
		blockquote
		{
			border:				1px dashed #e5e5e5;
		}
	*/

	#product2 hr
	{
	 	float:				left;
	}
			
	/*********************************************************************************************/
	/* =Typography Pre 								        	                       			 */
	/*********************************************************************************************/
	#product2 pre
	{
		clear:				both;


		min-height:			1em;
		height:				auto;
		margin:				11px 0 11px 0;
		
		padding:			13px;
				
		font-size:			1.18em;		
		color:				#777;		/* =10 */ 
		font-family:		Courier;
		
		background-color:	#f5f5f5;	/* =14 */
	}

		#product2 pre pre
		{
			font-size:			1em;
		}
		
		#product2 pre a
		{
			color:				#777;	/* =10 */
			text-decoration:	underline;
		}
		
			#product2 pre a:hover
			{
				color:					#333;	/* =13 */
				text-decoration:		underline;
			}
			
				#product2 pre a:visited
				{
				/*	color:				#802f80;*/
				}
			
		#product2 pre h2,
		#product2 pre h3
		{
			margin-top:			0;

			color:				#777;	/* =10 */
			font-variant:		normal;
		}

	/*********************************************************************************************/
	/* =Typography Text attributes					                                   			 */
	/*********************************************************************************************/
	/* =Alignment */
	#product2 .textAlignRight
	{
		text-align:			right;
	}
	
	#product2 .textAlignCenter
	{
		text-align:			center;
	}
	
	#product2 .textAlignJustify
	{
		text-align:			justify;
	}

	#product2 .textAlignLeft
	{
		text-align:			left;
	}	

	/* =Underline */
	#product2 .textUnderline	
	{
		text-decoration:	underline;
	}	
	
	/*********************************************************************************************/
	/* =Typography Tables							                                   			 */
	/*********************************************************************************************/
	#product2 table,
	#product2 .layouttabel 
	{
		clear:					both;
		
		padding: 				0;
		margin:					0 0 18px 0;
		/*width:					276px;*/
		/*width:					609px;*/

		border-collapse: 		collapse;
	}

		#product2 table caption,
		#product2 .layouttabel
		{
			padding:			8px 0 2px 4px;

			font-weight:		bold;
			text-align:			left;
		}
		
			#product2 table tbody,
			#product2 .layouttabel tbody
			{
				padding: 				0;
				margin:					0;
			}
		
			#product2 table th,
			#product2 .layouttabel th
			{
				font-weight:			bold;
	
				padding: 				1px;
				margin:					0;
			}
			
			#product2 table td,
			#product2 .layouttabel td
			{
				padding: 				1px;
				margin:					0;
				
				border-width: 			0;
			}
		
		#product2 table .tableRowOdd,
		#product2 .layouttabel .tableRowOdd
		{
		}
		
			#product2 table tr:hover,
			#product2 .layouttabel tr:hover
			{

			}

	/* =Data */
	#product2 .gegevenstabel 
	{
		border-top:				1px solid #b2b2b2;	/* =12 */
		border-left:			1px solid #b2b2b2;	/* =12 */
	}
	
		#product2 .gegevenstabel th 
		{
			border-bottom:			1px solid #b2b2b2;	/* =12 */
			border-right:			1px solid #b2b2b2;	/* =12 */
		}
		
		#product2 .gegevenstabel td
		{
			border-bottom:			1px solid #b2b2b2;	/* =12 */
			border-right:			1px solid #b2b2b2;	/* =12 */
		}
		
		#product2.gegevenstabel .tableRowOdd
		{
			background-color: 		#f5f5f5;	/* =14 */
		}
		
			#product2 .gegevenstabel tr:hover
			{
				/*background-color: 		#f0f0f0;	/* =unique */
				color:					#333;		/* =13 */
			}
			
				#product2 .gegevenstabel tr:hover .tableRowOdd 
				{
					background-color: 		#e8e8e8; /* =unique */
				}
		
}