/* 
 * ** styles for the primary forms ** *
 * - all forms must have form/div class 'form-layout'
 */


/* * * * * * *
 * form styles ...
 * * * * * * */	
 
.form-layout,
 fieldset,
 legend {
	margin: 0;
	padding: 0 ;
	}
	
.form-layout ul,
.form-layout ol {
	margin: 1em 0 0 1em ;
	padding: 0 ;
	},	
	
.form-layout li  {
	margin: 0 ;
	padding: 0 ;
	}
 
.form-layout {
	background: #F0F0F0 ;
	width: 100%;
	max-width: 600px ;
	min-width: 250px ;
	}
	.form-layout-large {
		max-width: 800px ;
	}
	
	.grid_6 .form-layout {
		padding: 0 ;
		width: 100% ;
	}

	.form-header {
		background-color: #4f2f91 ;
		padding: 1em  ;
	}
	.form-title {
		font-size: 1.5em ;
		color: white ;
	}
	.form-required {
		color: white ;
		text-align: right ;
		padding-top: 0.5em ;
	}
	
	.formTitle {
		padding: 1em 0;
		margin-top: 0.5em;
		margin-bottom: 0.5em;
		}
		.formTitle .text-large {
			font-size: 1.3em;
			}

	fieldset.fieldsetBox {
		margin-bottom: 1em ;
		padding: 0;
		}
	
		fieldset.fieldsetBox legend {
			padding: 6px 10px;
			margin-left: 8px;
			font-weight: bold;
			font-size: 1.2em;
			background-color: #0173BC ;
			color: white ;
			}	


	.form-layout ol li {
		list-style: none;
		padding: 0.5em 1em 0.5em 0 ; 
		margin-bottom: 2px;
		}
		.form-layout ol ol li {
			background: none;
			border: none;
			float: left;
			}
			
			.form-layout ul.list-text {
				list-style-type: disc ;

			}
			.form-layout ul.list-text li {
				list-style-type: disc ;
				padding: 0.1em 0.75em 0.1em 0 ;
				margin: 0 ;
				font-size: 0.9em ;
			}

		.form-layout ol li .richtext {
			width: 98% ;
		}

		x.form-layout ol li div {
			display: inline-block;
			margin-left: 0.35em ; 
			}
			.lt-ie8 .form-layout ol li div { /* ie < 8 inline-block fix */
				zoom: 1;
				display: inline;
				}
					
	.form-layout input,
	.form-layout textarea ,
	.form-layout select {
		background: #FFFFFF ;
		border: 1px solid #eeeeee ; 
		outline: none;
		padding: 5px;
		/* width: 250px; */
		width: 100% ;
		max-width: 275px ;
		margin-top: 0.35em ;
		}
	
	.form-layout input.text-large {
		max-width: 75% ;
	}
	
	.form-layout input[type=radio],
	.form-layout input[type=checkbox] {
		width: auto ;
		border-width; 0 ;
		padding: 0 ;
		margin-top: 0 ;
		vertical-align: middle;
		position: relative;
		bottom: 1px;
		margin-right: 0.5em;
		margin-left: 0.5em;
		}
			.div-radio-box ,
			.div-check-box {
				border-width: 1px ; 
				padding: 3px;
				width: 100% ; 
				max-width: 700px; 
				max-height: 250px; 
				overflow: auto;
				background-color: white
			}
		
			.div-radio-box label ,
			.div-check-box label {
				font-weight: normal;	/* radio/checkboxes are wrapped with label tags */
				display: inline-block;
				padding-left: 2.2em;
				padding-right: 0.75em ;
				text-indent: -2em;
				margin: 0.15em 0;
				padding-top: 0.2em ;
				padding-bottom: 0.2em ;
			}
		
		
		.form-layout .label-nb label {
			font-weight: normal ;
			margin-right: 1em ;
			margin-left: 0.25em ;
		}
		
	.form-layout select {
		width: auto ; 
		}
	
	.form-layout input[type=button] ,
	.form-layout input[type=submit] {
		width: auto ;
		}


	.form-layout input.input-size-small {
		width: 90px ;
		}
	.form-layout input.input-size-date {
		width: 115px ;
		}
	
	.form-layout textarea {
		min-width: 200px ;
		max-width: 600px ;
		width: 90% ;
		}
	.form-layout .textarea-size-large {
		width: 95% ;
		height: 16em ;
		}	


		
		.form-layout input.required ,
		.form-layout textarea.required ,
		.form-layout select.required ,
		.form-layout input:valid:required ,
		.form-layout textarea:valid:required 
		.form-layout select:valid:required { 
			background-color: #FFFFFF ;	 
			border-color: #C9C9C9 ; /* #aadaf0 ; */		 
		}	
		
		.form-layout input:focus ,  
		.form-layout textarea:focus ,
		.form-layout select:focus {
			background: #FFFFFF ;
			border-color: orange ; 
		}
			
		.form-layout input.error ,
		.form-layout textarea.error ,
		.form-layout select.error {
			 border: 1px solid #FFAA00 ;
			}

		/* placeholder - mimic html5's placeholder style */
		.placeholder { color: #aaa; }					

	.form-layout label.form-label {
		display: block ;
		}

	.form-layout label.required::after { 
		content: " *"; 
		color: red;
		}
	
	.form-layout label.error {
		/* for non-html5 browsers */
		float: none;
		margin-left: 10px ;
		width: 10px ;
		display: inline-block ;
		font-weight: bold ;
		color: red ;
		}
		
		div.clean,
		div.error {
			margin-left: 10px;
			padding-left: 35px;
			line-height: 30px;
		}
		
		div.clean {
			color: green;
			background: transparent url(/Sectors/IMDA/IMDA.nsf/images/forms/field-results-clean.png) no-repeat center left;
		}
		
		div.error {
			color: red;
			background: transparent url(/Sectors/IMDA/IMDA.nsf/images/forms/field-results-error.png) no-repeat center left;
		}
		

	.form-layout input[type=button],
	.form-layout input[type=submit],						
	.form-layout button,						
	.form-layout submit,
	.button-style {
		display: inline-block ;
		background-color: #00A4CD ;
		border: 0 ;
		margin: 0 1em 1em 1em ;
		padding: 8px 2em 8px 2em ;
		color: white ;
		font-weight: normal ;
		font-family: inherit ;
	}
		.form-layout input[type="submit"]:hover ,
		.form-layout input[type="button"]:hover ,  
		.form-layout button:hover ,					
		.form-layout submit:hover {
			background-color: #4F2F91 ;	
			cursor: pointer;
			}
		
		.form-layout input:[type="submit"]:focus ,
		.form-layout input:[type="button"]:focus ,
		.form-layout submit:focus ,
		.form-layout button:focus {
			background-color: #4F2F91; ;
			border-color: white ;  
			outline: none ;
			}
		
		
p .required {
	color: red ;
	font-weight: bold ;
	}			
	
	
.btnLinkStd ,
.btnLinkStd:link ,
.btnLinkStd:visited  {
	background-color: #0173BC ;
	color: white ;
	}