/*
Flexible Accessible Form - A Form CSS Framework
An Asp.Net implementation of "Fancy Form Design Using CSS" (http://www.sitepoint.com/fancy-form-design-css/) by deap (http://ondotnet.deap.nu)

The styles you probably want to configure per site has been extracted to this file for convenience
*/

/* Left-aligning Text Labels
	Explained http://articles.faf-sitepoint.faf-com/article/fancy-form-design-css/3 */

.faf-form fieldset label.faf-lbl,
.faf-form fieldset span.faf-lbl,
.faf-form fieldset fieldset legend label.faf-lbl, /* labels of sub-groups */
.faf-form fieldset fieldset legend span.faf-lbl, /* labels of sub-groups */
.faf-form fieldset label.faf-combine-lbl,
.faf-form fieldset.faf-legend-as-lbl legend span.faf-lbl-text,
.faf-form fieldset legend span.faf-lbl-text,
.faf-form fieldset fieldset.faf-legend-as-lbl > legend span.faf-lbl-text
{
	/* This defines Total Label Width to 140px (width+right-margin) */
	/* This affects settings in ".faf-form > fieldset.faf-submit" and ".faf-form > fieldset fieldset ol"  */
	width: 190px; 
	margin-right: 10px;
	text-align:left; /*change to left for left aligned labels*/
}

.faf-form .is-required-field-img
{
	right: -10px;
	margin-left: -10px;
}

.ie6 .faf-form fieldset fieldset.faf-legend-as-lbl legend span.faf-lbl-text
{
	width: 140px; 
	margin-right: 10px;
	text-align:left; /*change to left for left aligned labels*/
}

.faf-form fieldset .cof-list-readonly fieldset legend span.faf-lbl-text /* labels of sub-groups */
{
	text-align:left;
}

.faf-form .faf-buttons,
.faf-form li.faf .faf-lbl + * .information,
.faf-form fieldset li .validation-container .validators,
.faf-form li.faf .mira-file-upload-wrapper .mira-file-upload-table,
.faf-form li.faf .mira-file-upload-wrapper .mira-file-upload
{
	margin-left: 200px; /* margin-left = Label Width + 10px */
}

.faf-form li.faf .faf-lbl + * .validation-error
{
	margin-top:0;
	display:block;
}

.faf-form fieldset.faf-legend-as-lbl li .validation-container .validators,
.faf-form fieldset ol.cof-element-list li .validation-container .validators,
.faf-form li.faf .mira-file-upload-wrapper .mira-file-upload .validation-error,
.faf-form li.faf .mira-file-upload-wrapper .mira-file-upload .information
{
	margin-left:0;	
}

.faf-form .faf-buttons input[type="button"],
.faf-form .faf-buttons input[type="submit"],
.faf-form .faf-buttons button
{
	margin:0 10px 0 0;
}

/* /Left-aligning Text Labels */


/* Sub-groups */

.faf-form fieldset fieldset
{
	padding-top:16px;
}

.faf-form fieldset fieldset.faf-legend-as-lbl
{
	padding-top: 0;
}

.faf-form fieldset ol.cof-list-readonly fieldset.faf-hide-legend
{
	padding-top:15px;
}

.faf-form fieldset.faf-hide-legend ol.cof-list-readonly fieldset.faf-hide-legend
{
	padding-top:30px;
}

.ie6 .faf-form fieldset fieldset.faf-top-lbls ol,
.ie6 .faf-form fieldset fieldset.faf-hide-lbls ol
{          
	margin-left:0px;
}

.ie7 .faf-form fieldset fieldset.faf-hide-lbls ol
{
	margin-left:10px;
}

.faf-form fieldset fieldset ol,
.faf-form fieldset li.faf .faf-indent,
.faf-form fieldset fieldset .faf-list-container,
.faf-form fieldset.faf-legend-as-lbl .faf-content,
.faf-form fieldset ol li.faf-top-lbl.faf-combine,
.faf-form fieldset ol li.faf-top-lbl.faf-combine.faf-br,
.ie6 .faf-form fieldset ol li.faf-top-lbl-and-faf-combine,
.ie6 .faf-form fieldset ol li.faf-top-lbl-and-faf-combine-and-faf-br,
.faf-form fieldset ol li.faf-hide-lbl.faf-combine,
.faf-form fieldset ol li.faf-hide-lbl.faf-combine.faf-br,
.ie6 .faf-form fieldset ol li.faf-hide-lbl-and-faf-combine,
.ie6 .faf-form fieldset ol li.faf-hide-lbl-and-faf-combine-and-faf-br
{          
	margin-left:200px;  /* margin-left = Total Label Width */
}

/*
.ie6 .faf-form fieldset fieldset.faf-inline-and-hide-lbls
{
	background-color:Blue;
}*/

.ie6 .faf-form fieldset fieldset.faf-inline-and-hide-lbls ol
{
	padding-left:150px;
}

.faf-form ol li.faf-wide-input textarea,
.ie6 .faf-form ol li.faf-wide-input input.faf-input-text,
.ie6 .faf-form ol li.faf-wide-input input.faf-input-password
{
	width:314px !important; /* Total Form Width - Total Label Width */
}

/* dessa måste skrivas för sig pga ie6 */
.faf-form ol li.faf-wide-input input[type=text], 
.faf-form ol li.faf-wide-input input[type=password]
{
	width:314px !important; /* Total Form Width - Total Label Width */
}

.faf-form ol li.faf-wide-input select
{
	width:320px !important; /* Total Form Width - 20px */
}

.faf-form ol li.faf-wide-input.faf-top-lbl textarea,
.ie6 .faf-form ol li.faf-wide-input-and-top-lbl input.faf-input-text,
.ie6 .faf-form ol li.faf-wide-input-and-top-lbl input.faf-input-password
{
	width:464px !important; /* Total Form Width - form-"padding" */
}

/* dessa måste skrivas för sig pga ie6 */
.faf-form ol li.faf-wide-input.faf-top-lbl input[type=text],
.faf-form ol li.faf-wide-input.faf-top-lbl input[type=password]
{
	width:464px !important; /* Total Form Width - form-"padding" */
}

.faf-form ol li.faf-wide-input.faf-top-lbl select
{
	width:470px !important;
}

/*
.faf-form ol li.faf-top-lbl textarea,
.ie6 .faf-form ol li.faf-top-lbl input.faf-input-text,
.ie6 .faf-form ol li.faf-top-lbl input.faf-input-password
{
	width:310px !important; /* Total Form Width - Total Label Width *
}

.faf-form ol li.faf-top-lbl input[type=text],
.faf-form ol li.faf-top-lbl input[type=password]
{
	width:310px !important; /* Total Form Width - Total Label Width *
}
*/
.faf-form ol li.faf-top-lbl select
{
	max-width:none;
	width:314px !important; /* Total Form Width - Total Label Width */
}

.faf-form ol li.faf-top-lbl > label.faf-lbl:first-child,
.faf-form ol li.faf-top-lbl > span.faf-lbl:first-child
{
	margin-bottom:2px;
}

/* /Sub-groups */


/* Required Fields and Error Messages
	Explained http://articles.faf-sitepoint.faf-com/article/fancy-form-design-css/7
	Flexible: changed the usage of em elements to span elements with class validation */

.faf-form > fieldset label.faf-lbl > span.faf-validation,
.faf-form > fieldset span.faf-lbl > span.faf-validation
{      
	left:320px; /* left = Total Label Width + Total Input Width (see faf-config.css) + 20px */
	width:160px; /* width = Total Form Width - (Total Label Width + Total Input Width) */
}

.faf-form > fieldset fieldset.faf-hide-lbls label.faf-lbl span.faf-validation,
.faf-form > fieldset fieldset.faf-top-lbls label.faf-lbl span.faf-validation,
.faf-form > fieldset.faf-top-lbls label.faf-lbl span.faf-validation,
.faf-top-lbls .faf-form > fieldset label.faf-lbl span.faf-validation
{
	left:160px; /* left = Total Input Width (see faf-config.css) + 20px */
}

/* use the following two blocks to position required indicators to the left of the input field */
.faf-form > fieldset label.faf-lbl > span.faf-validation.faf-required,
.faf-form > fieldset span.faf-lbl > span.faf-validation.faf-required
{
	left:150px; /* left = Total input width */
}
.faf-form > fieldset fieldset.faf-hide-lbls label.faf-lbl span.faf-validation.faf-required,
.faf-form > fieldset fieldset.faf-hide-lbls span.faf-lbl span.faf-validation.faf-required
{
	left:-10px;
}

/* /Required Fields and Error Messages */


/* faf: Text and tables in the form */

.faf-form fieldset ol li.faf p,
.faf-form fieldset ol li.faf table
{
	margin-left:150px; /*total label width */
}

.faf-form fieldset ol li.faf .faf-input p,
.faf-form fieldset ol li.faf .faf-input table,
.faf-form fieldset ol li.faf .faf-readonly p,
.faf-form fieldset ol li.faf .faf-readonly table
{
	margin-left:0;
}

.faf-form > fieldset > ol > li.faf > table
{
	width:320px; /* total form width - width of left aligned labels - 30px */	
	/* or use this:
	width:auto;
	max-width:500px; /* total form width - width of left aligned labels */
}

.faf-form > fieldset > ol > li.faf > table:first-child
{
	width:480px; /* total form width - 20px */	
	/* or use this:
	width:auto;
	max-width:680px; /* total form width - 20px */
}

/* /faf: Text and tables in the form */


/* Reset to top-lbls */

.faf-top-lbls .faf-form > fieldset > ol > li.faf > table,
.faf-top-lbls .faf-form > fieldset > ol > li.faf > table:first-child
{
	width:100%;
	/* or use this:
	width:auto; */
}

.faf-top-lbls .faf-form ol li.faf-top-lbl textarea,
.ie6 .faf-top-lbls .faf-form ol li.faf-top-lbl input.faf-input-text,
.ie6 .faf-top-lbls .faf-form ol li.faf-top-lbl input.faf-input-password
{
	width:150px !important; /* Total Input Width - 4px */
}

/*
.faf-top-lbls .faf-form ol li.faf-top-lbl input[type=text],
.faf-top-lbls .faf-form ol li.faf-top-lbl input[type=password]
{
	width:150px !important; /* Total Input Width - 4px */
}
*/

.faf-top-lbls .faf-form ol li.faf-top-lbl > label.faf-lbl:first-child,
.faf-top-lbls .faf-form ol li.faf-top-lbl > span.faf-lbl:first-child
{
	margin-bottom:0px;
}

.ie6 .faf-top-lbls .faf-form ol li.faf-hide-lbl,
.ie6 .faf-top-lbls .faf-form fieldset fieldset.faf-hide-lbls ol li.faf
{
	height:0;
}

.faf-top-lbls .faf-form fieldset fieldset
{	
	padding-bottom: 0;
}

.ie6 .faf-top-lbls .faf-form fieldset fieldset.faf-inline-and-hide-lbls ol
{
	padding-left:0px;
}

.ie7 .faf-top-lbls .faf-form fieldset fieldset.faf-top-lbls ol,
.ie7 .faf-top-lbls .faf-form fieldset fieldset.faf-hide-lbls ol
{
	margin-left:0px;
}

.faf-top-lbls .faf-form ol li.faf-wide-input input[type=text],
.faf-top-lbls .faf-form ol li.faf-wide-input input[type=password]
{
	width:464px !important;
}

.faf-top-lbls .faf-form ol li.faf-wide-input select
{
	width:470px !important;
}

.faf-top-lbls .faf-form fieldset ol li.faf label
{
	font-size: 11px;
	line-height: 13px;
}
.faf-top-lbls .faf-form fieldset ol li.faf label
{
	vertical-align:middle;
}

.faf-top-lbls .faf-form fieldset ol li.cof-list-item fieldset legend span,
.faf-top-lbls .faf-form fieldset ol li.cof-list-item fieldset legend a
{
	font-size: 11px;
	line-height: 13px;
}

.ie7 .faf-top-lbls .faf-form fieldset ol li.faf.faf-hide-lbl label,
.ie6 .faf-top-lbls .faf-form fieldset ol li.faf.faf-hide-lbl label
{
	line-height: 0px;
}

.faf-top-lbls .faf-form fieldset label.faf-lbl, 
.faf-top-lbls .faf-form fieldset span.faf-lbl,
.faf-top-lbls .faf-form fieldset fieldset legend label.faf-lbl, /* labels of sub-groups */
.faf-top-lbls .faf-form fieldset fieldset legend span.faf-lbl, /* labels of sub-groups */
.faf-top-lbls .faf-form fieldset label.faf-combine-lbl,
.faf-top-lbls .faf-form fieldset.faf-legend-as-lbl legend span.faf-lbl-text,
.faf-top-lbls .faf-form fieldset legend span.faf-lbl-text,
.faf-top-lbls .faf-form fieldset fieldset.faf-legend-as-lbl > legend span.faf-lbl-text,
.faf-top-lbls .faf-form .validators
{
	width:auto;
}

.faf-top-lbls .faf-form fieldset fieldset legend label.faf-lbl, /* labels of sub-groups */
.faf-top-lbls .faf-form fieldset fieldset legend span.faf-lbl, /* labels of sub-groups */
.faf-top-lbls .faf-form fieldset.faf-legend-as-lbl legend span.faf-lbl-text,
.faf-top-lbls .faf-form fieldset legend span.faf-lbl-text,
.faf-top-lbls .faf-form fieldset fieldset.faf-legend-as-lbl > legend span.faf-lbl-text
{
	margin-right: 0px;
	top: 0px;
}

/* /Reset top top-lbls */