/*
 * File:		Form.css
 * Purpose: 	Controls the formatting of the document's forms
 * Notes:		There are a number of bug-fix declarations used in this file
 *				Which have all been identified with comments. Removing any of 
 *				these declarations is not recommended as it will more than
 *				likely 'break' they layout in one or more user-agents.
 * 
 * Configuration Management
 * CRN	Who			When			Description
 * -----------------------------------------------------------------------------
 * ---	L.Morton	22-Nov-2005		Initial document
 *
 */


form 
{
	clear: both; /* At no time should an element float over a form. */
	width: auto; /* auto for IE. */
	display: inline-block; /* IE peek-a-boo bug fix */
	margin: auto -15px;
	/*padding: 0.5em 1.5em; margin: 0; 
	border: 2px solid #fff; background: #f8f8f6 url("/images/backgrounds/FormBg.png");	*/
}
* > form /* For Opera. */
{
	width: 100%; 
	margin: auto;
}
:root form /* For Gecko. */
{
	width: auto; 
	margin: auto -15px;
}
fieldset 
{
	position: relative; /* Allows legend to be positioned properly in IE. */ 
	padding: 0 12px 1em; /* padding-top must be 0 for IE. */
	margin: 1.5em 0 2em; /* margin-bottom needs to be large for IE. */
	border: 2px solid #fff;	background: #ddd;
}
fieldset fieldset 
{
	margin: 0.5em 0 2em;
	background: #eee;
}
/*
 * Gecko ignores the legend positioning, but IE moves the legend up accordingly.
 * This is necessary to stop the background of the fieldset extending up from 
 * its border in IE.
 */
legend 
{
	position: relative; top: -1.1em;
	margin: 0; padding: 3px 10px;
	border: solid #fff 2px; 
	background: #df6d15 url("/images/backgrounds/OrangeGlossBg.png") repeat-x left 50%;
	font-family: "Trebuchet MS", sans-serif; font-size: 1.2em;
	color: #fff;
}
* > form legend 
{
	margin-bottom: 0.7em; /* Move legend up in Gecko. */
}
select, textarea 
{
	width: 55%;
	font: 1em Arial, sans-serif;
}
/* Make text input fields display with the same width. Does not work in IE. */
input.text
{
	width: 55%;
}
input[type="text"]:focus, input[type="password"]:focus, input[type="file"]:focus, textarea:focus, select:focus
{
	background: #ffc;
}
button
{
	font: bold 1em Arial, sans-serif;
}

/* .label is used on span or p tags to label radio or checkbox groups. */
label
{
	display: block;	
}
span.label
{
	display: block;
	width: 60%;
	padding: 2px; margin-top: 0.4em;
	font-weight: bold;
}
/* Hints that appear next to form controls */
em.hint
{
	float: right; width: 35%;
	margin: -1.5em 0 0 0; padding: 0 0 0 20px;
	font-weight: normal; text-align: left; color: #666;
	background: url("/images/icons/BgLeftBracket.gif") no-repeat 0% 50%;
}

/* .post is for labels that follow controls (radios and checkboxes). */
label.post 
{
	display: inline;
	padding: 2px;
	font-weight: normal;
}
label.post:hover 
{
	background: #e6e6e6;
}
label.post input 
{
	vertical-align: middle;
}
label.line
{
	display: block;
	text-indent: -20px; padding-left: 20px;
}
div.radio
{
	clear: left;
}

/* Form or fieldset instruction paragraph. */
div.instructions 
{
	margin: 0 -28px 1em; 
	padding: 0 70px 0 28px;
	border-top: solid 2px #fff; border-bottom: solid 2px #fff;
	background: #d9ebff url("/images/icons/Information.png") 96% 50% no-repeat;
}
	
/* Field with a validation error */
.error
{
	color: #d11;
}
div.error
{
	margin: 0 -28px; padding: 0 70px 0 28px;
	border-top: solid 2px #fff; border-bottom: solid 2px #fff;
	background: #ffffb2 url("/images/icons/Error.gif") 96% 50% no-repeat;
}
div.error h2
{
	padding-top: 1.25em;
	color: #d11; /* Should be 'inherit', but IE doesn't support it */
}
div.error p 
{
	color: #333;
}
div.error li
{
	font-weight: bold;
}
input.error, textarea.error
{
	background: #ffe1e1;
}
/* Buttons (submit, clear, next, etc) */
.actions 
{
	text-align: center;
}