/*
--------------------------------------------------------------------------------------------------
 Title:			Form Styles
 Created on: 	11-05-2009
 Author:     	Roberto De Vivo
 Client:		Vincis Internal
 Project:		CastManage 3.8 Template
 Copyright:  	Vincis B.V. The Netherlands

--------------------------------------------------------------------------------------------------
 Index:
--------------------------------------------------------------------------------------------------
 =global


 
 =Print 
 
--------------------------------------------------------------------------------------------------
 Colors:
--------------------------------------------------------------------------------------------------


 ***** Standard Module colours *****
 =10	Newshead text	#777	(medium gray)
 =11	Shortcuts		#999	(medium light gray)
 =12	date			#b2b2b2	(light gray)
 =13	body text		#333	(dark grey)
 =14	calendar alt	#f5f5f5	(ultra light gray)
 =15	body background #fff	(white)

*/
@media screen 
{	
	/*********************************************************************************************/
	/* View settings                                                                             */
	/*********************************************************************************************/
	#content form
	{
	}

		.cm_input,
		.cm_textarea,
		.cm_upload,
		.cm_select
		{
			font-size:				1em;
		}

	
		/* Fieldset */
		.cm_fieldset
		{
			margin:					6px 0 10px 0;
			padding:				10px 0 8px 0;

			border-bottom:			1px solid #ccc;	/* =unique */
		}
		
			.cm_fieldset legend span
			{		
				clear:					both;
				float:					left;
				display:				inline;

				margin:					0;
				padding:				8px 0 0 0;
				
				font-weight:			bold;
				font-size:				1.27em;	/* 15px*/
				line-height:			1.18em;	/* 20px */
			}
		
		/* Rows */
		.fieldRow
		{
			position:				relative;
			clear:					both;

			margin:					0;
			padding:				0 0 13px 0;
		}
		
		.cm_fieldset .fieldRow
		{
			padding-left:			10px;	/* inside fieldset */
		}

			.fieldRow label,
			.fieldRow .nonLableTitle
			{
				clear:					both;
				
				min-height:				10px;
				height:					10px;
				
				font-weight:			bold;
				line-height:			1.27em;
			}
			*>.fieldRow  label,
			*>.fieldRow .nonLableTitle
			{
				height:					auto;
			}
			
				.fieldRow label .requiredField,
				.fieldRow .nonLableTitle .requiredField,
				p .requiredField
				{
					font-weight:		normal;
					color:				#080;
				}
		
			.fieldRow .fieldContent 
			{
				clear:					both;
				
				min-height:				10px;
				height:					10px;
			}
			*>.fieldRow .fieldContent
			{
				height:					auto;
			}

				.fieldRow .fieldContent  label
				{
					font-weight:			normal;
				}
			
		/* Formfields */
		.cm_input,
		.cm_textarea,
		.cm_upload
		{	
			float:					left;
			display:				inline; 
			
			margin:					1px;
			padding:				5px 8px 0 8px;
			
			width:					230px;
			height:					18px;
			min-height:				18px;

			border:					1px solid #ccc;	/* =unique*/ 
		}
		*>.cm_input,
		*>.cm_textarea,
		*>.cm_upload
		{
			height:					auto;
		}
		
		.cm_textarea
		{
			height:					150px;
			min-height:				150px;
		}
		
			/* Fieldset*/
			.cm_fieldset .cm_input,
			.cm_fieldset .cm_textarea,
			.cm_fieldset .cm_upload
			{
				width:					220px;	/* inside fieldset (-padding fieldrow) */
			}
			
			.cm_input:focus,
			.cm_textarea:focus,
			.cm_upload:focus
			{
				margin:					0;
				border:					2px solid #777;	/* =10 */
				background-color:		#f8f8f8;		/* =15 */
			}

			.cm_input_zipcode
			{		
				width:					35px;
			}
			
			.cm_input_zipcode_char
			{		
				width:					25px;
			}
		
		/*	Select */
		.cm_select
		{
			float:					left;
			display:				inline; 
			
			width:					249px;	/* Width .cm_input +5px */
			height:					20px;		
		}
		
		.cm_fieldset .cm_select
		{
			width:					239px;	/* inside fieldset (-padding fieldrow) */
		}
			
			.cm_select_month
			{
				width:					40px;
			}
			
			.cm_select_year
			{
				width:					55px;
			}
			
			.cm_select_zipcode_radius
			{
				width:					55px;
			}
		
		#totalContainer .cm_multi
		{
			height:					auto;
		}

		.cm_upload
		{		
			height:					26px;
			min-height:				26px;
		}
		
		.cm_radio
		{
			padding:				0;
			margin:					0 6px 0 0;
		}
		
		
		#totalContainer .cm_button
		{
			display:				block;
			padding:				4px 21px 4px 6px;
			margin-right:			8px;
			
			height:					24px;
			
			font-size:				1em;
			color:					#fff;
			line-height:			1.2em;
			font-weight:			bold;
			text-decoration:		none;
			
			background-color:		#c73326;	/* =2 */
			
			background-image:		url(/sjablonen/1/images/general/button_search.gif);
			background-repeat:		no-repeat;
			background-position: 	right top;
			
			border:					0 solid transparent;	
		}
		
			#totalContainer .cm_button:hover
			{
				text-decoration:		none;
				color:					#fff;
				
				background-color:		#7d0800;	/* =unique */
				
				background-position: 	right -21px;
				
				cursor:					pointer;
			}
		
	/*********************************************************************************************/
	/* Captcha			                                                                   		 */
	/*********************************************************************************************/		
	.captchaQuestion
	{
	}
	
	/*********************************************************************************************/
	/* Help settings                                                                    		 */
	/*********************************************************************************************/
	#totalContainer  .fieldHelp 
	{
		clear:					none;
		float:					right;
		display:				inline;
		
		padding:				3px 0 0 32px;
		margin:					4px 0 0 0;
		width: 					150px; 
		height:					18px;
		min-height:				18px;

		line-height:			1.36em;
		
		font-size:				0.91em;	
		color:					#777;	/* =10 */
		
		background-image:		url(/sjablonen/1/images/general/icon_forminfo.gif);
		background-repeat:		no-repeat;
		background-position: 	9px top;
	}
	*>	#totalContainer  .fieldHelp 
	{
		height:					auto;
	}
	
		.fieldHelp strong
		{
			position:				absolute;
			left:					-9999px;
			height:					0;
			width:					0;
		}

	
	
	
	
	
	
	
	
	/* LATER DOEN */
	
	
	/*********************************************************************************************/
	/* Notification settings                                                                     */
	/*********************************************************************************************/
	#containerFormMail
	{
		width:					500px;
			
		font-family:			Arial, Helvetica;
		font-size:				8pt;
		line-height:			160%;		
	}
	
	#containerFormMail a
	{
		color:					#842D93;
		font-weight:			bold;
		text-decoration:		none;
	}
			
	#containerFormMail a:hover 
	{
		color:					#AE83BB;
		font-weight:			bold;
		text-decoration:		underline;
	}
	
	#containerFormMail .confirmFieldLabel
	{
		width:					180px;		
		float:					left;
	}
	
	#containerFormMail .confirmFieldContent
	{
		width:					320px;	
		float:					left;		
	}
	
	#containerFormMailContent table
	{
		border:					solid 1px #AE83BB;
		
		padding:				0;
		margin:					0px 0px 12px 0px;	
	}
	
	#containerLoketProductaanvraag table
	{
		border:					none;
	}

	
	
	/* Error */
	.formError
	{
		padding:				2px 2px 2px 24px;
		margin:					2px;
		
		color:					#FF0000;
		
		background-image:		url(/sysimgs/formulier/error_small.gif);
		background-repeat:		no-repeat;
		background-position:	4px 4px;
		
		border: 				solid 1px #FF0000;
	}
	
	/* Unknown */
	
.fieldColumn_0
	{
		width:					100px;
		float:					left;
	}
	
	.fieldColumn_1
	{
		width:					100px;
		float:					left;		
	}
	
	.fieldColumn_2
	{
		width:					100px;		
	}
	
		
	.fieldRowHidden
	{		
		display:				none;								
	}
	
	.confirmFieldRow_1
	{
		position:				relative;
		clear:					both;
		
		vertical-align:			top;			
		background-color:		#E8DCEA;			
	}
	
	.confirmFieldRow_2
	{
		position:				relative;
		clear:					both;
		
		vertical-align:			top;		
		background-color:		#FAE9FF;		
	}
	
	.confirmFieldLabel
	{
		width:					200px;		
		float:					left;
	}
	
	.confirmFieldContent
	{
		width:					280px;	
		float:					left;	
	}
	
}
