/************************************************************************************************/
/* Author:			VINCIS Rinse van Dijk         					                   	  		*/
/* Description:		BASIC stylesheet					                              			*/
/* Site name:		Ouderenzorg 2010 Internet				                           	  		*/
/* Date created:	02-02-2010							                               	  		*/
/************************************************************************************************/

/*----------------------------------------------------------------------------------------------*/
/* Colors	                                               										*/
/*----------------------------------------------------------------------------------------------*/
/* 	Grey:			#747576;
/*	Blue (light)	#0095d8;
/*	Blue (dark)		#004494;
/*

/************************************************************************************************/
/* Screen styles                                                                 				*/
/************************************************************************************************/
@media screen 
{
	/********************************************************************************************/
	/* =Global																			     	*/
	/********************************************************************************************/
	body 
	{
		color:					#003F8A;	
		
		font-family: 			Tahoma, Verdana, Arial;
		
		font-size:				1.0em;
		line-height:			150%;
	
		background-color:		#fff;
	}
	
	input
	{
		font-family: 			Tahoma, Verdana, Arial;
	}
	
		
	
	hr.hide,
	.hide,
	#printHeader
	{
		display:				none;
		height:					0;
		width:					0;
		
		padding:				0;
		margin:					0;
		font-size:				0;
		line-height:			0;
	}
	
	.floatCloser
	{
		clear:					both;
	}
	
	h1
	{
		color:					#0095d8;	
		font-size:				1.22em;
		font-family:			Arial, Verdana, Tahoma;
		font-weight:			bold;
	
		margin-bottom:			0.2em;
	}
	
	h2
	{
		color:					#0095d8;	
		font-family:			Arial, Verdana, Tahoma;
		font-size:				1.1em;
		font-weight:			bold;
		
		margin-bottom:			0.1em;
	}
	
	h3, h3 a
	{
		color:					#0095d8;	 
		font-family:			Arial, Verdana, Tahoma;
		font-size:				1.0em;
		font-weight:			bold;
		
		margin-bottom:			0em;
		text-decoration:		none;
	}
	
		h3 a:hover
		{
			color:					#0095d8;	 
		}
	
	
	
	p
	{
		margin:				0 0 20px 0;
	}
	
	ul
	{
	}
	
		li
		{
		}
		
	a
	{
		color:					#0095d8;	
		text-decoration:		underline;
	}
	
		a:hover
		{
			color:					#000;	
			text-decoration:		underline;
		}

		
	.cm_button
	{
		float:					left;
		display:				inline;

	
		color:					#fff;
		
		font-size:				1.2em;
		font-weight:			bold;
		
		margin:					0;
		padding:				1px 1px 2px 1px;
		
		background-color:		#0095d8;
		background-repeat:		no-repeat;
		
		border:					0;
		
		cursor:					pointer;
	}
	
		.cm_button:hover
		{
			color:					#fff;
			background-color:		#004494;
		}


	.cm_textarea, .cm_input, .cm_select, .cm_multi, .cm_button
	{
		font-family: 			Tahoma, Verdana, Arial;
		font-size:				1.0em;
		color:					#003F8A;
	}
	
	.cm_input#email
	{
		float:					left;
		margin:					0 10px 0 0;
	}


	a.readMore, a.readMore:hover
	{
		float:					left;
		display:				block;
		
		font-weight:			normal;
		font-size:				0.85em;
		
		padding:				0 0 0 14px;
		text-decoration:		none;
		color:					#747576;
		
		background-image:		url(/Content/Images/General/arrowLeft.gif);
		background-position:	0 -4px;
		background-repeat:		no-repeat;
	}
	
	#submitForm form
	{
		float:				left;
		display:			block;
		clear:				both;
		width:				100%;
		margin:				0 0 30px 0;
	}
	
	/********************************************************************************************/
	/* =Containers																				*/
	/********************************************************************************************/		
	
	#totalContainer
	{
		position:				relative;
		
		height:					572px;
		
		width:					964px;
		margin:					3px auto;
	}
	*>#totalContainer
	{
		min-height:				572px;
		height:					auto;
	}
	
	
		#logoContainer
		{
			float:					left;
			width:					310px;
			height:					80px;
			
			margin:					0 0 2px 0;
			padding:				0;
			
			background-image:		url(/Content/Images/General/logo.gif);
			background-repeat:		no-repeat;
		}
		
	
		#imageContainer
		{
			position:				absolute;
			left:					0;
			top:					83px;
			display:				inline;
			width:					964px;
			height:					230px;
			
			margin:					0;
			padding:				0;
		}
		
			#menuContainer
			{
				position:				absolute;
				top:					1px;
				left:					1px;
				width:					565px;
				height:					45px;
				
				margin:					0;
				padding:				0;
				
				background-color:		#fff;
			}
			
				
			
		
		#mainContainer
		{
			position:				absolute;
		
			top:					333px;
			left:					0;
			
			width:					964px;
			height:					550px;
			
			margin:					0;
			padding:				0 0 10px 0;
		}
		*>#mainContainer
		{
			min-height:				550px;
			height:					auto;
		}
		
		
		#leftContainer
		{
			position:				absolute;
			left:					0;
			top:					0;
			
			width:					234px;
			height:					550px;
			
			margin:					0;
			padding:				0;
		}
		
			#leftUnder
			{
				float:				left;
				
				position:			absolute;
				bottom:				30px;
				left:				10px;
				
				width:				219px;
			}
		
			#hkz
			{
				
			}
		
		
			ul#shortcuts
			{
	
			}
			
				ul#shortcuts li
				{
					color:					#747576;
					margin:					0;
					padding:				0 0 0 15px;
					background-image:		url(/Content/Images/General/arrowGrey.gif);
					background-repeat:		no-repeat;
					background-position:	0px 6px;
				}
				
					ul#shortcuts li a
					{
						color:				#747576;
						text-decoration:	none;
					}
					
						ul#shortcuts li a:hover
						{
							text-decoration:	underline;
						}
		
		
		#middleContainer
		{
			float:					left;
			display:				inline;
			
			width:					716px;
			height:					550px;
			
			margin:					0 0px 0 248px;
			padding:				0;
			
			background-color:		#fff;
		}
		*>#middleContainer
		{
			min-height:				550px;
			height:					auto;
		}
		
			#content2
			{
				float:					left;
				width:					468px;
			}
		
			#middleContainer #content2.fullWidth 
			{
				width:					702px;
			}
			
			
			#rightContainer
			{
				float:					left;
				display:				inline;
				
				width:					234px;
				height:					550px;
				
				margin:					0px 0 0 11px;
				padding:				0;

			}
			*>#rightContainer
			{
				margin:					0px 0 0 14px;
				min-height:				550px;
				height:					auto;
			}
			
			#middleContainer.fullwidth #rightContainer
			{
				display:				none;
			}
	


	/********************************************************************************************/
	/* =Path																					*/
	/********************************************************************************************/

	#content ul.breadCrumbs 
	{
		float:					left;
		width:					450px;
		height:					28px;
		
		padding:				0;		
		margin:					0;
		
		color:					#004494;
	}
		
			#content ul.breadCrumbs li
			{
				display:			inline;
				float:				left;

				margin:				0;
				padding:			0;
			
				font-size:			0.9em;

				background-image: 	none;
				white-space:		nowrap;
			}
			
				#content ul.breadCrumbs li  a
				{	
					display:			block;
		
					margin:				0 5px 0 0;
					padding:			0 12px 0 0;
					
					color:				#b2b2b2;	/* =103 */
				
					text-decoration:	none;
					
					background-image:	url(/Content/Images/General/bullet_path.gif);
					background-repeat:	no-repeat;
					background-position:right 8px;
				}
				
				
				#content ul.breadCrumbs li.self
				{
					background-image:	none;
				}
				
					#content ul.breadCrumbs li  a:hover
					{
						color:				#0095D8;	/* =103 */
						text-decoration:	underline;
					}
	
	
	/********************************************************************************************/
	/* =Options																					*/
	/********************************************************************************************/
					
				
	/********************************************************************************************/
	/* =QuickSearch																				*/
	/********************************************************************************************/
	
	#quicksearch 
	{
		float:					right;
		width:					304px;
		height:					52px;
		
		margin:					0 0 2px 0;
		padding:				28px 0 0 16px;
	}
	
		#quicksearch #query
		{
			float:					left;
			width:					197px;
			height:					21px;
			
			background-image:		url(/Content/Images/General/quickSearchBox.gif);
			background-repeat:		no-repeat;
			
			border:					0;
			margin:					0;
			padding:				9px 0 0 63px;
			
			color:					#999;
		}
		
		#quicksearch #send
		{
			float:					left;
			display:				inline;

			height:					30px;
			width:					30px;
			
			background-image:		url(/Content/Images/General/quickSearchButton.gif);
			background-repeat:		no-repeat;
					
			margin:					0;			
			border:					0;
			
			font-size:				0;
			line-height:			0;
			text-indent:			-5000px;
			
			cursor:					pointer;
		}
		
	
	/*********************************************************************************************/
	/* =rightContainer							                                      			 */
	/*********************************************************************************************/				
	
	#rightContainer h2
	{
		float:					left;
		display:				block;
		width:					220px;	
		height:					24px;	
		color:					#fff;
		padding:				8px 0 0 14px;
		margin:					0;
	}
	
	
		#rightContainer #uitgelicht1
		{
			float:					left;
			display:				block;
			width:					234px;
			height:					272px;
			margin:					0 0 10px 0;
			
			background-image:		url(/Content/Images/general/bgUitgelicht_1.jpg);
			background-repeat:		no-repeat;
		}
		
		#rightContainer #uitgelicht2
		{
			float:					left;
			display:				block;
			width:					234px;
			height:					272px;
			margin:					0;
			
			background-image:		url(/Content/Images/general/bgUitgelicht_2.jpg);
			background-repeat:		no-repeat;
		}
			
		
			#rightContainer #uitgelicht1 h2,
			#rightContainer #uitgelicht2 h2
			{
				float:					left;
				display:				block;
				clear:					both;
			}
			
			
			#rightContainer #uitgelicht1 img,
			#rightContainer #uitgelicht2 img
			{
				float:					left;
				display:				inline;
				width:					218px;
				height:					136px;
				margin:					0 0 0 8px;
				overflow:				hidden;
			}
			
			
			#rightContainer #uitgelicht1 #red div.text,
			#rightContainer #uitgelicht2 #green div.text
			{
				float:					left;
				display:				inline;

				width:					198px;
				height:					75px;
				margin:					0 5px 0 8px;
				padding:				10px;
				overflow:				hidden;
				
				background-image:		url(/Content/Images/general/bgUitgelichtText.png);
				background-repeat:		no-repeat;
			}
			
				#rightContainer #uitgelicht1 #red div.text .wrapper,
				#rightContainer #uitgelicht2#green div.text .wrapper
				{
					float:					left;
					position:				relative;
				}
			
		
		#rightContainer div#red div a.readMore,
		#rightContainer div#green div a.readMore
		{
			display:				block;
			float:					left;
		
			width:					115px;
			
			text-indent:			-5000px;
			font-size:				0;
			line-height:			0;
			height:					25px;
			
			margin:					2px 0 0 -3px;
			
			background-image:		url(/Content/Images/general/readMoreGrey.gif);
			background-repeat:		no-repeat;
			background-position: 	0 0;
		
		}
		
			#rightContainer div#red div a.readMore:hover,
			#rightContainer div#green div a.readMore:hover
			{
				background-position: 	0 -25px;
			}
		
		
		
}


/************************************************************************************************/
/* =Print styles                           											          	*/
/************************************************************************************************/
@media print
{

	#rightContainer, #leftContainer, #imageContainer, #quicksearch, #logoContainer, .hide
	{
		display:			none;
	}
	
	
	body 
	{
		color:					#747576;	
		
		font-family: 			Tahoma, Verdana, Arial;
		
		font-size:				1.0em;
		line-height:			150%;
	
		background-color:		#fff;
		color:					#4d4d4d;
	}
	
	
	#printHeader
	{
		display: 					block;
		padding:					0 0 20px 0;
		margin:						0 0 30px 0;
		border-bottom:				1px solid #ccc;	
	}
	
	
	#content h1
	{
		color:					#0095d8;	
		font-size:				1.22em;
		font-family:			Arial, Verdana, Tahoma;
		font-weight:			bold;
	
		margin-bottom:			0.2em;
	}

	#content h2 
	{		
		color:					#0095d8;	
		font-size:				1.1em;
		font-family:			Arial, Verdana, Tahoma;
		font-weight:			bold;
	
		margin-bottom:			0.1em;
	}
	
	#content h3 
	{
		color:					#0095d8;	
		font-size:				1.0em;
		font-family:			Arial, Verdana, Tahoma;
		font-weight:			bold;
	
		margin-bottom:			0em;
	}
	
}