/*-------------------------------------------------------------
 CSS TEMPLATE FOR XHTML 1.0 TRANSITIONAL HTML-DOCUMENTS
 Version 1.0
 
 - form elements
 ---------------------------------------------------------------*/

/************************************
* general form elements
*************************************/

form
{
}

legend,
label,
input,
select,
textarea,
fieldset,
div.radio_container,
div.checkbox_container,
div.captcha_img_container,
p.error,
form .error,
form .helptext,
form .fieldinfo
{
	display:block;
	float:left;
}

/************************************
* fieldset
*************************************/

fieldset
{
	float:none;
	clear:left;
}

/************************************
* legend
*************************************/

legend
{
	font-weight:bold;
}

/************************************
* general form building blocks
*************************************/

/* form components that make op form rows 
specify all generic spacing properties here  */
label,
input,
select,
textarea,
.error,
.checkbox_container,
.radio_container,
.captcha_img img
{
	margin-right:8px;
	margin-bottom:12px;
}
/* form label */
label
{
	clear:left;
}
/* form fields that accept user input */
input,
select,
textarea
{
	padding-left:4px;	
	padding-right:4px;		
	border:1px solid #aaaaaa;
}
/* single line form fields */
input,
select
{
}
/* standard input field */
input
{
}
/* hide hidden inputs for FireFox */
input[type=hidden]
{
	display:none;
}

/* textarea */
textarea
{

}

/************************************
* size modifiers
*************************************/

/* default sizes */
label,
input,
select,
textarea,
.checkbox_container,
.radio_container
{
	width:150px; /* = l */
}

/* text area dimensions */
textarea
{
	height:50px;
}

/* default modifiers*/
.xxs {width:30px;}
.xs  {width:60px;}
.s   {width:90px;}
.m   {width:120px;}
.l   {width:150px;}
.xl  {width:180px;}
.xxl {width:210px;}

/************************************
* mandatory fields
*************************************/

input.mandatory,
select.mandatory,
textarea.mandatory
{
	background-color:#eeeeee;
}
label.mandatory
{
	font-weight:bold;
}
span.mandatory_legend
{
}

/************************************
* error state
*************************************/

form.error
{
}
label.error
{
	color:red;
}
input.error,
select.error,
textarea.error
{
	border-color:red;
}
p.error
{
}

/************************************
* radio_container and checkboxes
*************************************/

div.radio_container input,
div.checkbox_container input,
input.checkbox,
input.radio
{
	width:auto;	 		/* reset from generic form field styles */
	border:none; 		/* reset from generic form field styles */
	background:none; 	/* reset from generic form field styles */
}
/* wrappers */
div.radio_container,
div.checkbox_container
{
}
div.radio_container
{
}
div.checkbox_container
{
}
/* wrapper inputs */
div.radio_container input,
div.checkbox_container input
{
	clear:left;
	margin-left:0px;
}
div.radio_container input
{
}
div.checkbox_container input
{
}
/* wrapper labels */
div.radio_container label,
div.checkbox_container label
{
	display:block;
	float:left;
	clear:none;
	width:auto;
	
}
/* alignment modifier */
div.horizontal input
{
	clear:none;
}
div.horizontal br
{
	display:none;
}
/* label width modifier */
div.radio_container label.fixed,
div.checkbox_container label.fixed
{
	width:180px; 
}

/************************************
* image captcha
*************************************/

/* captcha field and image container */
div.captcha_img_container
{
	
}

/* captcha field and image elements */
div.captcha_img_container img,
div.captcha_img_container input
{
	float:left;
	clear:left;
}

/* captcha image element */
div.captcha_img_container img
{
	
}

/* captcha input element */
div.captcha_img_container input
{
}

/************************************
* selection lists
*************************************/

select
{
}
select option
{
}

/************************************
* textarea
*************************************/

textarea
{
	overflow:auto;
	line-height:1em; /* reset to allow default line spacing */
}

/************************************
* break for line clearing
*************************************/

form br
{
	clear:left;
}

/************************************
* form button
*************************************/

button
{
}
div.formbuttonwrapper
{
	width:303px;
	float:left;
	clear:left;
}
div.formbuttonwrapper button
{
	float:right;
	margin-right:0px;
}

/************************************
* field info
*************************************/

div.fieldinfo
{

}

div.fieldinfo div.help,
div.fieldinfo div.error
{
	float:right;
	position:relative;
	overflow:visible;
	height:16px;
	width:20px;
	cursor:pointer;
	margin-right:1em;
}

div.fieldinfo div.help
{
	background: url(../images/help.png) top left no-repeat;
}
div.fieldinfo div.error
{
	background: url(../images/exclamation.png) top left no-repeat;
}


div.fieldinfo div.help span,
div.fieldinfo div.error span
{
	visibility:hidden;
	margin-left:20px;
	width:140px;
	padding:4px;
	padding-left:4px;
	padding-right:8px;
	border:1px solid #000000;
}

div.fieldinfo div.help span
{
	background-color:#168EE1;
}

div.fieldinfo div.error span
{
	background-color:#FFEEEE;
}

div.fieldinfo div.error span,
div.fieldinfo div.help span
{
	display:block;
}


/************************************
* form wizard
*************************************/

ul.stepswrapper
{
	margin-bottom:1em;
}

ul.stepswrapper .step
{
	background-color:#ffffff;
	border:1px solid #000000;
	border-right:none;
}
ul.stepswrapper .visited
{
	background-color:#000000;
	color:#ffffff;
}
ul.stepswrapper .disabled
{
	background-color:#666666;
}

ul.stepswrapper .lead
{
	font-weight:bold;
}

ul.stepswrapper .locked
{
	background-color:#eeeeee;
	color:#aaaaaa;
}

ul.stepswrapper .active
{
	background-color:#168EE1;
	color:#ffffff;
}

ul.stepswrapper .last
{
	border-right:1px solid #000000;
}

.progresswrapper
{
	clear:left;
	margin-bottom:1em;
}