/************************************************************************************************/
/* Author:			VINCIS Rinse van Dijk         					                         	*/
/* Description:		SUBPAGE stylesheet					                                     	*/
/* Site name:		GHOR Extranet								                            	*/
/* Date created:	07-04-2010						                                     		*/
/************************************************************************************************/

/*
--------------------------------------------------------------------------------------------------
 Standard Colors:
--------------------------------------------------------------------------------------------------
 =1 Headers					#76a000	(also topgraphic background and hyperlinks)
 =2 Mouse over				#9dbd15	(light green grey)
 
 =3 Content borders			#e8e8e8	(Very light grey) 
 =4 Content text			#333	(dark grey)
 =5 Content light text		#c0c0c0	(light grey) 
 
 =6 Header graphic text		#fff	(white) 
 
--------------------------------------------------------------------------------------------------
 Custon Colors:
--------------------------------------------------------------------------------------------------
Blue						=	#0065a4
Green						=	#008b60
Grey						= 	#666666
Standard text				=	#333333

*/

/************************************************************************************************/
/* SCREEN STYLES																				*/
/************************************************************************************************/
@media screen 
{
	/*********************************************************************************************/
	/* =Override styles							                                     			 */
	/*********************************************************************************************/
	
	/*********************************************************************************************/
	/* =General									                                     			 */
	/*********************************************************************************************/
	
	#readSpeakerHolder
	{
		position:			absolute;
		top:				240px;
		left: 				768px;
	}
	#readSpeakerHolder img
	{
		display:block;
	}

	
	
	#contentContainer
	{
		float:				left;
		width:				640px;
	}
	
		#contentContainer h1,
		#contentContainer h2
		{
			text-indent:		0;
		}
		
		.cufon-active #totalContainer h2
		{
			font-size:			1.5em;
			line-height:		1.5em;
		}
		
		.cufon-active #totalContainer h3
		{
			font-size:			1.3em;
			line-height:		1.5em;
		}
		
		#contentContainer .hide
		{	
			display:			none;
		}
	
		#content
		{
			float:				left;
			display:			inline;
			width:				640px;
			margin:				0;
			padding:			0;
	
		}
		
			#content h1
			{
				float:				left;
				clear:				both;
				
				font-size:			1.7em;
				
				width:				475px;
				margin:				0 0 18px 0;
			}
	


	/*********************************************************************************************/
	/* =Paging									                                     			 */
	/*********************************************************************************************/
	#totalContainer .paging
	{
		float:				left;
		padding:			0;
		margin:				13px 0 0 0;
	}
	
		#totalContainer .paging li
		{
			float:				left;
			display:			block;
			
			
			padding:			0;
			margin:				0 8px 0 0;
			
			color:				#000;	/* =102 */
			line-height:		1.2em;
			
			background-image:	none;
		}
		
			#totalContainer .paging li a
			{
				display:			block;
				
				padding:			6px;
				
				color:				#000;	/* =100 */
				text-decoration:	none;
			}
			
				#totalContainer .paging li a:hover
				{
					padding:			6px 6px 4px 6px;
					
					color:				#16216c;			/* =100 */
									
					border-bottom:		2px solid #bcd600;	/* =100 */
					
					background-color:	#f5f5f5;		/* =104 */
				}
		
		#totalContainer .paging .info
		{
			padding:			6px 6px 6px 0;
			margin-right:		26px;
		
			color:				#999;	/* =102 */
		}
		
		#totalContainer .paging .inBetween
		{
			padding:			6px;
		
			color:				#b2b2b2;	/* =103 */
		}
		
		#totalContainer .paging .currentPage span
		{
			display:			block;
			
			padding:			6px;
			
			color:				#fff;	/* =105 */
			font-weight:		bold;
			
			background-color:	#16216c;	/* =101 */					
		}
		
		/* First and last pagenumber*/
		#totalContainer .paging .firstItem
		{
		}
		
		#totalContainer .paging .lastItem
		{
		}
		
		/* Next previous selectors*/
		#totalContainer .paging .previousPage a,
		#totalContainer .paging .nextPage a,
		#totalContainer .paging .previousPage a:hover,
		#totalContainer .paging .nextPage a:hover,
		#totalContainer .paging .previousPage.noPreviousPage,
		#totalContainer .paging .nextPage.noNextPage
		{
			padding:				2px 0 2px 0;
			border-bottom:			none;
			
			background-color:		transparent;
		}
	
		#totalContainer .paging .previousPage a span,
		#totalContainer .paging .nextPage a span,
		#totalContainer .paging .previousPage.noPreviousPage span,
		#totalContainer .paging .nextPage.noNextPage span
		{
			display:				block;

			width:					20px;
			height:					20px;
			
			margin:					0;
			padding:				0;

			text-indent: 			-5000px;	/* remove text */

			background-image:		url(/sjablonen/4/images/general/navigation_small.gif);
			background-repeat:		no-repeat;
			background-position: 	left top;
			background-color:		transparent;
			
			border:					medium none;
			overflow:				hidden;

			cursor:					pointer;
		}
		
			/* previous */
			#totalContainer .paging .previousPage a span
			{
				float:					left;
				display:				inline;
				
				background-position: 	left top;
			}
			
				#totalContainer .paging .previousPage a:hover span
				{
					background-position: 	left -20px;
				}
				
					#totalContainer .paging .previousPage.noPreviousPage span
					{
						background-position: 	left -40px;
					}
				
			/* next */
			#totalContainer .paging .nextPage, #totalContainer .paging .previousPage
			{
				width:				20px;
				border:				none;
			}
			
			
			#totalContainer .paging .nextPage a span
			{
				float:					right;
				display:				inline;
				
				background-position: 	-20px top;
			}
			
				#totalContainer .paging .nextPage a:hover span
				{
					background-position: 	-20px -20px;
				}
				
					#totalContainer .paging .nextPage.noNextPage span
					{
						background-position: 	-20px -40px;
					}
					
	/*********************************************************************************************/
	/* =path 							            		                          			 */
	/*********************************************************************************************/

	#path
	{
		float:					left;
		display:				inline;
		width:					640px;
		height:					20px;
		margin:					1px 0 11px 282px;
	}
	
		#path ul
		{
			float:					left;
			
		}
		
			#path ul li
			{
				float:					left;
				
				padding:				0 10px 0 0;
				margin:					0 6px 0 0;
				
				font-size:				0.97em;
				
				color:					#b2b2b2;
				background-image:		url(/sjablonen/4/images/general/bullet_path.gif);
				background-repeat:		no-repeat;
				background-position:	right 8px; 
			}
			
				#path ul li.selected
				{
					background-image:		none;
				}
			
				#path ul li a
				{
					color:					#808080;
					text-decoration:		none;
				}
				
					#path ul li a:hover
					{
						text-decoration:		underline;
					}
	
	
	/*********************************************************************************************/
	/* =Errors & Warnings				  			                                      	     */
	/*********************************************************************************************/
				
	#content span#m2f_fail ,
	#content span#m2f_success,
	#content span#notfound_404,
	#content span#error,
	#content span#warning
	{	
		display:				block;
		margin:					32px 0 32px 0;
		width:					80%;
		padding: 				13px 0 13px 80px;
		height:					38px;
	
		color: 					#f00;
		font-weight:			bold;
	
		border:					solid 2px #f00;
	}	
	
	#content span#m2f_fail
	{
		background: 			url(/sjablonen/4/images/general/m2f_fail.png) no-repeat 8px 8px #ffe0e1;
	}
	
	
	#content span#m2f_success
	{
		color: 					#7ebd27;
		background: 			url(/sjablonen/4/images/general/m2f_success.png) no-repeat 8px 8px #e3ffe0;
		border:					solid 2px #7ebd27;
	}
	
	
	#content span#notfound_404
	{
		background: 			url(/sjablonen/4/images/general/notfound_404.png) no-repeat 8px 8px #ffe0e1;
	}
	
	
	#content span#error
	{
		background: 			url(/sjablonen/4/images/general/error.png) no-repeat 8px 8px #ffe0e1;
	}
	
	#content span#warning
	{
		color:					#ff7300;
		background: 			url(/sjablonen/4/images/general/warning.png) no-repeat 8px 8px #fff7e0;
		border:					solid 2px #ff7300;
	}


	

	/********************************************************************************************/
	/* =downloads																				*/
	/********************************************************************************************/
	
	#downloads,
	#relevant,
	#contact
	{
		float:					left;
		display:				inline;
		width:					305px;
		margin:					36px 30px 0 0px;
	}
	
	#relevant
	{
		margin:					36px 0 0 0;
	}
	

		#downloads h2 img,
		#relevant h2 img,
		#contact h2 img
		
		{
			display:			block;
			margin:0;
			padding:0;
		}
		
		#downloads ul,
		#relevant ul,
		#contact dl
		{
			float:					left;
			display:				block;
			clear:					both;
		
			font-family:			Tahoma, Arial, Verdana;
			width:					305px;
		}
			
			#downloads li,
			#relevant li,
			#contact dt,
			#contact dd
			{
				float:					left;
				position:				relative;
				clear:					both;
				padding:				0 0 5px 25px;
				width:					280px;
				font-size:				0.96em;
								
				background-image:		url(/sjablonen/4/images/general/bullet_list.gif); 
				background-repeat:		no-repeat;
				background-position:	2px 10px;
			}
			
			#relevant li
			{
				padding:				0 0 3px 13px;	
				background-position:	2px 9px;
			}
			
			#contact dt,
			#contact dd
			{
				padding:				0 0 3px 0;	
				background-image:		none;
			}

				#downloads li a,
				#relevant li a,
				#contact a:hover
				{
					color:					#333;
					text-decoration:		none;
				}
				
					#downloads li a:hover,
					#relevant li a:hover,
					#contact a
					{
						color:					#008b60;
						text-decoration:		underline;	
					}
			
					#downloads li span,
					#relevant li span,
					#contact span
					{
						display:				block;
						clear:					left;
						
						padding:				0;
						
						color:					#808080;	/* =102 */
				
							
						white-space:			nowrap;
					}
					
					/* =Filetypes */
					#downloads .doc,
					#downloads .docx,
					#downloads .rtf
					{
						background-image:		url(/sjablonen/4/images/doctypes/doc.gif);
						background-position:	0 0.25em;
					}
				
					#downloads .pdf
					{	
						background-image:		url(/sjablonen/4/images/doctypes/pdf.gif);
						background-position:	0 0.35em;
					}
					
					#downloads .txt
					{
						background-image:		url(/sjablonen/4/images/doctypes/txt.gif);
						background-position:	0 0.25em;
					}
					
					#downloads .xls,
					#downloads .xlsx
					{
						background-image:		url(/sjablonen/4/images/doctypes/xls.gif);
						background-position:	0 0.25em;
					}
					
					#downloads .ppt,
					#downloads .pptx
					{
						background-image:		url(/sjablonen/4/images/doctypes/ppt.gif);
						background-position:	0 0.25em;
					}
			
					#downloads .jpg,
					#downloads .jpeg
					{
						background-image:		url(/sjablonen/4/images/doctypes/jpg.gif);
						background-position:	0 0.25em;
					}
					
					#downloads .gif
					{
						background-image:		url(/sjablonen/4/images/doctypes/gif.gif);
						background-position:	0 0.25em;
					}
	

	/********************************************************************************************/
	/* =options																					*/
	/********************************************************************************************/	
	
	ul#options li
	{
		float:					left;
		display:				inline;
		
		padding:				28px 24px 0 0px;			
	}
	
		ul#options li a
		{
			color:					#008b60;	/* =12 */
			text-decoration:		none;
			font-weight:			bold;
		}
		
			ul#options li a:hover
			{
				color:					#0065a4;	/* =13 */
				text-decoration:		underline;
			}

			ul#options a:hover span
			{
				cursor:					hand;
			}
			*>ul#options a:hover span
			{
				cursor:					pointer;
			}
			
			ul#options span
			{
				display:				block;
				height:					20px;
				width:					120px;
				
				text-indent: 			-5000px;	/* remove text */
							
				background-repeat:		no-repeat;
			}

			
			ul#options li.print span
			{
				background-image:		url(/sjablonen/4/images/general/text/print.gif);	
			}
			

			ul#options li.mail span
			{
				
				background-image:		url(/sjablonen/4/images/general/text/doorsturen.gif);	
			}

	/*********************************************************************************************/
	/* =pageIndex									                                      		 */
	/*********************************************************************************************/	
	#leftMenu
	{
		float:				left;
		display:			inline;
		width:				226px;
		min-height:100px;
		height:				100px;
		margin:				0 40px 0 16px;

		line-height:			1em;
		font-size:				1em;
	}
	*>	#leftMenu
	{
		height:auto;
	}
		#leftMenu li
		{
			display:				block;
			
			height:					1px;
			min-height:				1px;
			margin:					0;
			padding:				0;
		}
		*>#leftMenu li
		{
			height:					auto;
		}
			
			#leftMenu li a
			{
				display:				block;
				
				padding:				10px 15px 11px 15px;
				height:					1px;
				min-height:				1px;
				
				color:					#333;	
				font-weight:			normal;
				text-decoration:			none;
				
				background-repeat:		repeat-x;
				background-position:	-1px bottom;
				background-image:		url(/sjablonen/4/images/general/border_bottom1.gif); 

			}
			*>#leftMenu li a
			{
				height:					auto;
			}
				#leftMenu .selectedPath a:hover,
				#leftMenu li a:hover
				{
					color:						#111;	
					text-decoration:			none;
					
					background-color:			#f8f8f8;
				}

				
				#leftMenu li a:hover
				{
					color:						#008b60;	/* =4*/
				}

				/* selected selectedPath*/
				#leftMenu .selected span,
				#leftMenu .selectedPath a
				{
					display:				block;
					
					padding:				10px 15px 11px 15px;
					height:					1px;
					min-height:				1px;
					
					color:					#333;	
					font-weight:			bold;
					
					background-repeat:		repeat-x;
					background-position:	-1px bottom;
					background-image:		url(/sjablonen/4/images/general/border_bottom1.gif);
				}
				*>#leftMenu .selected span,
				*>#leftMenu .selectedPath a
				{
					height:					auto;
				}
					
					#leftMenu .selected li a:hover,
					#leftMenu .selectedPath li a:hover
					{
						background-color:			transparent;
					}
				
					
					#leftMenu .selected span
					{
						color:						#008b60;	/* =4*/
					}
	
				/* level 2*/
				
				/* selectedPath*/
				#leftMenu .selected ul li,
				#leftMenu .selectedPath ul li 
				{
					padding-left:			21px;
					
					background-repeat:		no-repeat;
					background-position:	25px 14px;
					background-image:		url(/sjablonen/4/images/general/bullet_list.gif);
				}

				
				/* selected*/
				#leftMenu .selectedPath ul .selected 
				{
					background-repeat:		no-repeat;
					background-position:	20px 10px;
					background-image:		url(/sjablonen/4/images/general/arrow.gif);
				}
					
					
				#leftMenu .selected ul li a,
				#leftMenu .selectedPath ul li a
				{
					font-weight:			normal;
				}
				
					#leftMenu .selectedPath ul  li a:hover,
					#leftMenu .selected li a:hover
					{
						text-decoration:		underline;
					}

			/* *** level 3*
		/* selected selectedPath*/
				#leftMenu .selectedPath ul .selected span,
				#leftMenu .selectedPath ul .selectedPath a
				{
					display:				block;
					
					padding:				10px 15px 11px 15px;
					height:					1px;
					min-height:				1px;
					
					color:					#333;	
					font-weight:			bold;
					
					background-repeat:		repeat-x;
					background-position:	-1px bottom;
					background-image:		url(/sjablonen/4/images/general/border_bottom1.gif);
				}
				*>#leftMenu .selectedPath ul .selected span,
				*>#leftMenu .selectedPath ul .selectedPath a
				{
					height:					auto;
				}
				
					#leftMenu .selectedPath ul .selected span
					{
						color:						#008b60;	/* =4*/
					}
					
				/* selectedPath*/
				#leftMenu .selectedPath ul .selected ul li,
				#leftMenu .selectedPath ul .selectedPath ul li 
				{
					padding-left:			21px;
					
					background-repeat:		no-repeat;
					background-position:	25px 14px;
					background-image:		url(/sjablonen/4/images/general/bullet_list.gif);
				}
					
			
				
				/* selected*/
				#leftMenu .selectedPath ul .selectedPath ul .selected 
				{
					background-repeat:		no-repeat;
					background-position:	20px 10px;
					background-image:		url(/sjablonen/4/images/general/arrow.gif);
				}
				
									
					
				#leftMenu .selectedPath ul .selected ul li a,
				#leftMenu .selectedPath ul .selectedPath ul li a
				{
					font-weight:			normal;
				}
				
				 #leftMenu .selectedPath ul .selected li a:hover
				{
					color:						#008b60;	/* =4*/
				}
				
				/* Level 3 */
							
				 #leftMenu .selectedPath ul .selectedPath a:hover
				{
					color:						#35a8dc;	/* =4*/
				}

}