/*
--------------------------------------------------------------------------------------------------
 Title:			Homepage Styles
 Created on: 	26-01-2010
 Author:     	Roberto De Vivo
 Client:		Vincis
 Project:		Acantus Corporate Website
 Copyright:  	Vincis B.V. The Netherlands

--------------------------------------------------------------------------------------------------
 Index:
--------------------------------------------------------------------------------------------------

 
--------------------------------------------------------------------------------------------------
 Colors:
--------------------------------------------------------------------------------------------------
 =1 Content Background 	#fff	(white)
 =2	rentHome			#a0c226	(green)
 =3	rentHome Dark		#055a3b	(dark green)
 =4	about				#35a8dc	(blue)
 =5	environment			#f09021	(orange)
 =6	searchHome			#978dbf	(lila)
 =7	searchHome dark		#3b325d	(lila dark)
 =8	environment dark	#753f00	(orange dark)
 =9	about dark			#0d5272	(blue dark)

 
 =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)

*/

@media screen 
{
	/*********************************************************************************************/
	/* =global		  							                                      			 */
	/*********************************************************************************************/

	html
	{
		padding:				0;
		margin:					0;
	}
	
	body 
	{
		height:					auto;
		
		color:					#333;	
		font-family: 			Tahoma, Arial, sans-serif, Helvetica;
		font-size:				0.78em;
		line-height:			1.45em;	
		
		padding:				0;
		margin:					0;
		
		background-color:		#fff	;	/* =1 */
		
	}

	input,
	select,
	textarea
	{
		font-family: 			Tahoma, Arial, sans-serif, Helvetica;
	}

		#totalContainer	
		{
			position:				relative;
			
			height:					554px;
			min-height:				554px;
			width:					976px;
			margin:					0 auto;
			padding:				0;
		}
		*>#totalContainer
		{
			height:					auto;
		}
		
	.hide 
	{
		display:				block;
		position:				absolute;
		left:					-9999px;
		height:					0;
		width:					0;
	}
	
	#printHeader
	{
		display:				none;
	}
	
	.floatCloser
	{
		clear:					both;
	}
	
	h1
	{
		font-size:				1.72em;
		padding:				11px 0 11px 10px;
		font-weight:			bold;
	}
	
		h2
		{
		}
		
			h3
			{
			}
	
	ul
	{
	}
	
		li
		{
		}
	
			li a
			{
				color:					#a0c226;	/* =2 */
				text-decoration:		none;
			}
			
				li a:hover
				{
					color:					#055a3b;	/* =3 */
					text-decoration:		underline;
				}
				
	/*********************************************************************************************/
	/* =misc 											                                		 */
	/*********************************************************************************************/
	
	#slogan
	
	{
		position:				absolute;
		left:					8px;
		top:					35px;
		
		display:				block;
		
		text-indent: 			-5000px;	/* remove text */

		width:					566px;
		height:					168px;
		
		line-height:			1em;		
		
		background-image:		url(/sjablonen/1/images/general/overlay_New.png);
		background-repeat:		no-repeat;
		background-position: 	left top;
	}
	
	#logo span
	{
		position:				absolute;
		right:					4px;
		top:					35px;
		
		display:				block;
		
		text-indent: 			-5000px;	/* remove text */

		width:					185px;
		height:					168px;
		
		line-height:			1em;		
		
		background-image:		url(/sjablonen/1/images/general/logo.png);
		background-repeat:		no-repeat;
		background-position: 	left top;
	}
	
	#content
	{
		clear:					both;
		float:					left;
		display:				inline;
		
		width:					669px;	
		height:					10px;
		min-height:				10px;
		padding:				316px 0 0 0;
	}
	*>#content
	{
		height:					auto;
	}

	#header
	{
		position:				absolute;
		
		left:					8px;
		top:					35px;
		
		width:					964px;
		height:					168px;
		
		background-image:		url(/sjablonen/1/images/general/header_voorbeeld.jpg);
		background-position:	left top;
		background-repeat:		no-repeat;
		
		z-index:				-1;
	}
	/*********************************************************************************************/
	/* =Navigation																				 */
	/*********************************************************************************************/
	#navigation
	{
		position:				absolute;
		top:					228px;
		left:					8px;
		
		width:					964px;
		height:					82px;
	}
	
		#navigation ul
		{
			display:				block;
			
			width:					964px;
			height:					82px;
		}
		
			#navigation ul li
			{
				float:					left;
				display:				inline;
				
				height:					82px;
				width:					225px;
				margin-right:			21px;
			}
			
				#navigation ul li a span
				{
					display:				block;
					
					height:					82px;
					width:					225px;
					
					text-indent:			-50000px;
					
					background-image:		url(/sjablonen/1/images/general/menu_home.gif);
					background-repeat:		no-repeat;
					background-position:	left top;

				}
				
					/* Different buttons*/
					#navigation ul #searchHome a span
					{
						background-position:	left top;
					}
					
						#navigation ul li a:hover span,
						#navigation ul #searchHome a:hover span
						{
							background-position:	left bottom;
							cursor:					pointer;
						}
						
					#navigation ul #generalShortcuts a span
					{
						background-position:	left top;
					}
					
						#navigation ul li a:hover span,
						#navigation ul #generalShortcuts a:hover span
						{
							background-position:	left bottom;
							cursor:					pointer;
						}	
						
					#navigation ul #rentHome a span
					{
						background-position:	-225px top;
					}
					
						#navigation ul #rentHome a:hover span
						{
							background-position:	-225px bottom;
						}
					
					#navigation ul #environment a span
					{
						background-position:	-450px top;
					}
					
						#navigation ul #environment a:hover span
						{
							background-position:	-450px bottom;
						}
					
					#navigation ul #about
					{
						margin-right:		0;
					}
					
					#navigation ul #about a span
					{
						background-position:	-675px top;
					}
					
						#navigation ul #about a:hover span
						{
							background-position:	-675px bottom;
						}
		
	/*********************************************************************************************/
	/* =quickMenu 								                                      			 */
	/*********************************************************************************************/	
	#quickMenu
	{
		position:				relative;
		float:					right;
		display:				inline;
		
		width:					290px;				/* 302 -6 -6 */

		background-color:		#fff;				/* =1 */
		padding:				19px 6px 144px 6px;
		min-height:				120px;					
		height:					120px;
		
		
	}
	*>#quickMenu
	{
		height:					auto;
	}
	
		#quickMenu h2
		{
			display:				block;
			
			width:					110px;
			height:					17px;
			margin:					0 0 12px 9px;
			
			text-indent:			-5000px;
			
			background-image:		url(/sjablonen/1/images/general/txt_directnaar.gif);
			background-repeat:		no-repeat;
			background-position:	left top;
		}
				
		#quickMenu ul 
		{
			clear:					both;
			padding:				0;
		}
		
			#quickMenu ul  li
			{
				display:				block;

				min-height:				1px;
				height:					1px;
				padding:				3px 4px 3px 9px;

				line-height:			1.27em;
				
				
				background-image:		url(/sjablonen/1/images/general/bullet_news.gif);
				background-repeat:		no-repeat;
				background-position:	left 9px;
			}
			*>#quickMenu ul li
			{
				height:					auto;
			}
			
				#quickMenu ul li a
				{
					color:				#333;	
				}
	
					#quickMenu ul li a:hover
					{
						color:					#055a3b;	/* =3 */
						text-decoration:		underline;
					}
					
	/*********************************************************************************************/
	/* =Banners 								                                      			 */
	/*********************************************************************************************/
	#banner1,
	#banner2,
	#banner3
	{
		position:			absolute;
		left:				0;
		bottom:				0;
		display:			block;
		
		padding:			19px 0 0 0;
		
		height:				130px;
		width:				300px;
	}
	
	#banner2
	{
		left:				670px;
		top:				316px;
	}
	
	#banner3
	{
		left:				670px;
		top:				468px;
		padding-bottom:		13px;
	}
	
	/*********************************************************************************************/
	/* =shortCuts 								                                      			 */
	/*********************************************************************************************/	
	
	#shortCutsContainer
	{	
		position:				absolute;
		left:					12px;
		top:					12px;
		
		width:					auto;
	}
	
		#shortCuts 
		{
			padding:				0;
			margin:					0;
		}
		
			#shortCuts  li
			{
				display:				block;
				
				display: 				inline;

				min-height:				1px;
				height:					1px;
				padding:				1px 4px 1px 9px;

				line-height:			1.27em;
				
				background-image:		url(/sjablonen/1/images/general/);
				background-repeat:		no-repeat;
				background-position:	left 9px;
				
				border-right:			1px solid #808080;
			}
			
			
			#shortCuts  li.lastItem
			{
				border-right:			none;
			}
			
			
			*>#shortCuts li
			{
				height:					auto;
			}
			
				#shortCuts li a
				{
					color:				#808080;	
				}
	
					#shortCuts li a:hover
					{
						color:					#333;
						text-decoration:		underline;
					}
					
			/*#shortCuts  .firstItem
			{
				background-image:		url(/sjablonen/1/images/general/bullet_quick_selected.gif);
			}
			
				#shortCuts  .firstItem a
				{
					color:					#333;
					font-weight:			bold;
				}*/

	/*********************************************************************************************/
	/* =news 								                                      			 */
	/*********************************************************************************************/
	#news
	{
		float:					right;
		display:				inline;
		width:					277px;

		padding:				19px 6px 19px 6px;
		margin:					0 36px 0 35px;
		min-height:				120px;					
		height:					120px;
		
		/**
		background-image:		url(/sjablonen/1/images/general/border_dashed.gif);
		background-repeat:		no-repeat;
		background-position:	left top;
		**/
		
		background-color:		#fff;				/* =1 */
	}

		#news h2
		{
			display:				block;
			
			width:					156px;
			height:					17px;
			margin:					0 0 12px 9px;
			
			text-indent:			-5000px;
			
			background-image:		url(/sjablonen/1/images/general/txt_acantusnieuws.gif);
			background-repeat:		no-repeat;
			background-position:	left top;
		}

		#news ul
		{
		}
		
			#news ul  li
			{
				display:				block;

				min-height:				1px;
				height:					1px;
				padding:				3px 4px 12px 9px;

				line-height:			1.27em;
				
				background-image:		url(/sjablonen/1/images/general/bullet_news.gif);
				background-repeat:		no-repeat;
				background-position:	left 25px;
			}
			*>#news ul li
			{
				height:					auto;
			}
			
				#news li span
				{
					color:					#999;	/* =10 */
					font-size:				0.91em;
				}
			
				#news ul  li h3
				{
					padding:				1px 0 3px 0;
					
					font-weight:			bold;
					line-height:			1.1em;
				}
				
				#news ul li a
				{
					color:				#333;	
				}
	
					#news ul li a:hover
					{
						color:					#055a3b;	/* =3 */
						text-decoration:		underline;
					}
					
				#news ul li p a
				{
					padding-right:			16px;
					
					color:					#a0c226;	/* =2 */
					text-decoration:		underline;

					background-image:		url(/sjablonen/1/images/general/arrow_news.gif);
					background-repeat:		no-repeat;
					background-position:	right 2px;
				}
	
					#news ul li p a:hover
					{
						color:					#055a3b;	/* =3 */
						text-decoration:		underline;

					}
					
			#totalContainer #news .readMore span
			{
				display:				block;
				
				width:					95px;
				height:					12px;
				padding:				0;
				margin:					0 0 13px 9px;
				font-size:				0.1em;
				line-height:			0.1em;
				
				text-indent:			-5000px;
				
				background-image:		url(/sjablonen/1/images/general/button_nieuwsarchief.gif);
				background-repeat:		no-repeat;
				background-position:	left top;
			}
			
				#totalContainer  #news .readMore:hover span
				{
					background-position:	left bottom;
					cursor:					pointer;
				}
			
	/*********************************************************************************************/
	/* =quickSearch	 								                                      		 */
	/*********************************************************************************************/
	#quickSearch
	{
		position:				absolute;
		left:					770px;
		top:					8px;
		
		height:					22px;
		width:					204px;
		
		background-image:		url(/sjablonen/1/images/general/background_search.gif);
		background-position:	0 0;
		background-repeat:		no-repeat;
	}
	
		#quickSearch #qs_kw_or,
		#quickSearch #qs_kw_or:focus
		{
			float:					left;
			display:				inline;
			
			width:					132px;
			height:					18px;
			padding:				5px 8px 2px 8px;
			margin:					0;
			
			color:					#3d3c3c;
			font-size:				1em;
			line-height:			1em;
						
			background-color:		transparent;	
			border:					none;
		}
		
		#quickSearch .button
		{
			float:					left;
			display:				inline;
			
			height:					22px;
			width:					50px;
			margin:					0 0 0 4px;
			padding:				0;
			
			background-color:		transparent;	
			border:					0 solid transparent;	
			text-transform: 		capitalize; /* needed for IE*/
			
			cursor:					pointer;

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

			background-image:		url(/sjablonen/1/images/general/button_search.gif);
			background-repeat:		no-repeat;
			background-position: 	left top;
			
			overflow:				hidden;
		}

			#quickSearch .button:hover
			{
				background-position: 	left bottom;
			}
}