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

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


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


	/********************************************************************************************/
	/* =View Settings					                                   					  	*/
	/********************************************************************************************/
		
	#containerFormTrackingInfo
	{			
		padding:				6px 0 6px 0;
		margin:					0;
		
		border-top:				solid 1px #e0e0e0;
		border-bottom:			solid 1px #e0e0e0;
	}
		.cm_fieldset
		{
			clear:					both;
			width:					458px;

			margin:					0 0 26px 0;
			padding:				0 0 10px 0;
			
			border:					1px solid #ccc;
			filter:					progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#ffffff', EndColorStr='#eeeeee');
		}
		
			legend,
			.cm_fieldset legend
			{		
				font-weight:			bold;
				color:					#004494;
				
				padding:				0 0 3px 0;
				margin:					0 0  0 8px; /* FF fix */
			}
			
			.fieldRow
			{
				float:					left;
				width:					99%;
				clear:					both;
					
				position:				relative;
				margin:					2px 2px 4px 2px;
				padding:				2px 2px 2px 6px;
				height:					10px;
				min-height:				10px;
				min-width:				10px;
			}
			*>.fieldRow
			{
				height:					auto;
				width:					99%;
			}
			
			.fieldRowHidden
			{		
				display:				none;
			}
			
			.fieldRowExtraInfo
			{
				float:					left; /* FF fix */ 
				clear:					both;
				
				height:					20px;
				width:					300px;
				margin:					10px 2px 15px 2px;
				padding:				10px 2px 2px 24px;
				
				color:					#999999;
				
				background-repeat:		no-repeat;
				background-position:	2px 12px;
			}
						
			.fieldLabel
			{
				width:					130px; 
				
				padding-left:			5px;
				float:					left;
				text-align:				left;
			}
			
				.fieldLabel label
				{
					text-align:			left;
				}
			
		
			.fieldContent
			{
				float:					left;
				width:					230px;
				display:				inline;
			}
			
				/*
				.labelLarge .fieldLabel
				{
					float:					none!important;
					width:					140px!important;	
				}
				
				.labelLarge .fieldContent
				{
					margin:					0;
					padding:				0 0 0 0px;	
				}
				*/
				
				.fieldContent span.validationMessage
				{
				    font-size:          0.8em;
				    color:              #fa030b;
				    padding-left:       10px;  
				    clear:              left;
				}

	
			.fieldColumn_10
			{
				float:					left;
				width:					100%;
			}
			
			.fieldColumn_20, .fieldColumn_21
			{
				float:					left;
				width:					50%;
			}
			
			.fieldColumn_30, .fieldColumn_31, .fieldColumn_32
			{
				float:					left;
				width:					33%;
			}
			
			.fieldContent input, .fieldContent span
			{
				float:					left;
				display:				block;
			}
			
			.fieldContent span
			{
				width:					75%;
			}
		
			
		
		.formError
		{
			background-image:		url(/templates/content/images/modules/forms/error_small.gif);
			background-repeat:		no-repeat;
			background-position:	4px 4px;

			color:					#FF0000;
			border: 				solid 1px #FF0000;
			
			padding:				2px 2px 2px 24px;
			margin:					2px;
		}
		
		.formMessage
		{
			float:					left;
		
			background-image:		url(/templates/content/images/modules/forms/info_small.gif);
			background-position:	25px 25px;
			background-repeat:		no-repeat;
			color:					#004494;
			font-weight:            bold;
			background-color:       #eee;
			border:					2px solid #004494;
			
			padding:				25px 25px 25px 50px;
			margin:					12px 2px 2px 70px;
		}
		*>.formMessage
		{
			margin:					12px 2px 2px 140px;
		}
		
		.confirmFieldRow_1
		{
			position:				relative;
			clear:					both;
			
			vertical-align:			top;			
			background-color:		#e0e0e0;			
		}
		
		.confirmFieldRow_2
		{
			position:				relative;
			clear:					both;
			
			vertical-align:			top;		
			background-color:		#efefef;		
		}
		
		.confirmFieldLabel
		{
			width:					120px;		
			float:					left;
		}
		
		.confirmFieldContent
		{
			width:					400px;	
			float:					left;	
		}
		
		.cm_input
		{		
			padding:				2px 8px 0 8px;
			width:					282px;
			border:					1px solid #ccc;
		}
		
			.cm_input.mask_zipcode, 
			.cm_input.mask_phonenl, 
			.cm_input.mask_date, 
			.cm_input.mask_email , 
			.cm_input.mask_url, 
			.cm_input.mask_numerical,
			.cm_input.mask_alphanumerical,
			.cm_input.mask_bankaccountnumbernl,
			.cm_input.mask_iban,
			.cm_input.password
			{
				width:					auto;
			}
	    
		    .cm_input.invalid
			{
		        background-color:       #feeeee;
		        border:                 solid 1px #fa030b;
		    }
			
			#secretValue_202
			{
		        float:					left;
				display:				block;
				width:					150px;

		    }			
			
			
		
		.cm_select
		{
			padding:				0px;
			width:					300px;	
			border:					1px solid #ccc;
		}
		
		.cm_multi
		{
			height:					auto !important;
		}
		
		.cm_textarea
		{
			padding:				2px 8px 0 8px;
			width:					282px;
			height:					auto;
		}
		
		.cm_upload
		{
			height:					20px;
			width:					300px;
			padding:				2px;
		}
		
		.cm_radio, .cm_checkbox
		{
			clear:					left;
			padding:				0;
			margin:					2px 6px 0 4px;
		}
		
		.cm_text
		{
			padding:				10px;
			margin:					10px 0 10px 0;
			width:					432px;
			background-color:		#eee;
			border-top:				1px dashed #ccc;
			border-bottom:			1px dashed #ccc;
		}
		
		.cm_button
		{
			width:					auto;
			height:					22px;
			margin:					10px 0 0 68px;
			padding:				3px 1px 3px 1px;
			background-image:		none;
			background-color:		#0095d8;
			
		}
		*>.cm_button
		{
			margin:					0 0 0 135px;
		}
		
		#requiredMessage
		{
			float:					left;
			clear:					both;
			margin:					40px 0 0 0;
		}
		
		
	
	/*********************************************************************************************/
	/* Captcha Stylng 						                                                                      		    */
	/*********************************************************************************************/	
	
	#captchaImage
	{
		float:						left;
		width:						150px;
		margin:						20px 10px 20px 0px;
	}
	
	#captchaRefresh
	{
		font-size:					0.8em;
	}
		
	
	/*********************************************************************************************/
	/* Help settings                                                                    		 */
	/*********************************************************************************************/
	.fieldHelp
	{
		float:					left;
		
		height:					18px;
		width:					25px;
		padding:				5px 0 0 0;
		margin:					0 0 0 3px;
		
	}
	
	.fieldHelp a
	{	
		display:				block;
		position: 				absolute;
		
		cursor:					help;
	}
	
	/* =Mail2Friend styles  */
	#mailfriendform
	{
		float:					left;
		padding:				10px 0 0 0;
	}
	
		.fieldHelp a img
		{
			padding: 0!important;
			margin: 0!important;
			
			border:	none!important;
		}
	
	
	.fieldHelp a:hover
	{
		display:				block;
		position: 				absolute;
		
		font-weight:			normal!important;
		text-decoration:		none!important;
	}
	
	.fieldHelp a span
	{
		display:				none;	
		position: 				absolute;
	}	
	
	.fieldHelp a:hover span
	{
		display:				block;
		position: 				absolute;
		z-index:				99;
		 		
		width: 					150px; 
		
		padding:				4px;
		margin:					0 0 0 4px;
		
		text-decoration:		none!important;
		
		
		border:					dotted 1px #333;
		color:					#000000;
		background-color:		#e8e8e8;
	}
	
	.fieldHelp strong
	{
		font-size:				8pt;
	}
	
	#fieldRowButtons
	{
		float:					left;
		margin:					10px 0 0 0;
		font-size:				1.05em; /* FF fix */
		*font-size:				1.0em;
	}
	
	#containerConfirm .radiogroup 
	{	
		float:				left;
	}
	
	#containerConfirm .checkboxgroup 
	{	
		float: 				left;
	}
	
	/*********************************************************************************************/
	/* Notification settings                                                                     */
	/*********************************************************************************************/
	#containerFormMail
	{
		width:					500px;
		
		font-family:			Arial, Helvetica, Verdana;
		font-size:				8pt;
		line-height:			160%;
	}
	
	#containerFormMail a
	{
		color:					#802991;
		font-weight:			bold;
		text-decoration:		none;
	}
			
	#containerFormMail a:hover 
	{
		color:					#e8e8e8;
		font-weight:			bold;
		text-decoration:		underline;
	}
	
	#containerFormMail .confirmFieldLabel
	{
		width:					180px;		
		float:					left;
	}
	
	#containerFormMail .confirmFieldContent
	{
		width:					320px;	
		float:					left;		
	}
	
	#containerFormMailContent table
	{
		position:				relative;			 /* to avoid stylingsissues in Outlook 2002 or lower version */
		float:					left; 				/* to avoid stylingsissues in Outlook 2002 or lower version */ 

		border:					solid 1px #e8e8e8;
		
		padding:				0;
		margin:					0 0 12px 0;	
	}
	
	#containerLoketProductaanvraag table
	{
		border:					none;
	}
}

@media print
{
}

@media handheld
{
}