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

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

form
{
}
legend,
label,
input,
select,
textarea,
fieldset,
a.info,
div.radiobuttons,
div.checkboxes
{
	display:block;
	float:left;
}

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

fieldset
{
	float:none;
	clear:left;
}

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

legend
{
	font-weight:bold;
}

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

/* form components */
label,
input,
select,
textarea
{
	margin-right:8px;
	margin-bottom:8px;
}
/* form label */
label
{
	padding-top:2px;
	clear:left;
}
/* form fields */
input,
select,
textarea
{
	padding:2px;	
	padding-left:4px;	
	padding-right:4px;		
	border:1px solid #aaaaaa;
}
/* single line fields */
input,
select
{
}
/* standard field */
input
{
}
/* hide hidden inputs for FireFox */
input[type=hidden]
{
	display:none;
}

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

/* default sizes */

label,
input,
select,
textarea
{
	width:150px; /* = l */
}

input,
select,
textarea
{
	width:220px; /* = l */
}
select
{
	width:230px; /* = l */
}

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

/* date modifiers*/
select.day   {width:40px;}
select.month {width:70px;}
select.year  {width:56px;}

/* telephone modifiers*/
input.tel_area  {width:60px;}
input.tel_local {width:100px;}

/************************************
* 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;
}


/************************************
* radiobuttons and checkboxes
*************************************/

div.radiobuttons input,
div.check_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.radiobuttons,
div.check_container
{
}
div.radiobuttons
{
}
div.check_container
{
}
/* wrapper inputs */
div.radiobuttons input,
div.check_container input
{
	clear:left;
	margin-left:0px;
}
div.radiobuttons input
{
}
div.check_container input
{
}
/* wrapper labels */
div.radiobuttons label,
div.check_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.radiobuttons label.fixed,
div.check_container label.fixed
{
	width:180px; 
}

/************************************
* 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
*************************************/

a.info:link,
a.info:visited,
a.info:active,
a.info:hover
{
	position:relative;
	padding-left:20px;
	background-color:red;
	background:url(../images/form_info.gif) no-repeat top left;
	text-decoration:none;	
}
a.info:link span,
a.info:visited span,
a.info:active span,
a.info:hover span
{
	position:absolute;
	top:0px;
	left:20px;
	display:none;
	background-color:green;
	width:100px;
}
a.info:hover span
{
	display:block;
}

/************************************
* submit button
*************************************/

div.button_submit
{
	float:left;
	padding-right:26px;
	background:url(../images/submit.gif) no-repeat top right;
	cursor:pointer;
}
div.button_submit div
{
	background-color:#CCCCCC;
	display:block;
	text-transform:uppercase;
	padding-left:10px;
	padding-right:10px;	
	line-height:24px;
}