/* @override http://f15.site/ui/css/forms.css */

/* @group Forms */

/* @group Defaults */

	
/*  Override Blueprint CSS defaults. */
/*  Vertical padding and line-heights have been adjusted to maintain vertical rhythm
	and align labels to vertical centre of input fields.
	NOTE: label line-heights include allowances for 1px border around inputs. */
input.text, input.title,
textarea, select {
 	margin: 0;
	}
input.text,
input.title {
	width: 240px;
	padding: 0.4166em 5px;
	border: 1px solid #C7BFBD;
	}
input.title   {
	font-size:1.5em;
	line-height: 1;
	padding: 0.277em 5px;
	}
textarea {
	padding: 0.4166em 5px;
	width: 240px;
	height: 60px;
	border: 1px solid #C7BFBD;
	}
select {
	/*margin: 0.277em 0;*/
	}	
label {
	line-height: 2em;
	}
label.title {
	line-height: 2.5em;
	}


/*	Establish basic, minimal conventions. */
fieldset {   
	margin: 0;   
	padding: 0;
	}  
legend {   
	margin-left: 1em;   
	}  
fieldset ol {   
	margin: 0;   
	padding: 0;  
	list-style: none;  
	}  
fieldset li {
	position: relative;
	padding: 0.5em 0;
	}  
fieldset.actions {
	clear: both;
	border-style: none;
	}
	
	
/*  These styles position the legend within the fieldset bounds.
	The fieldset padding-top keeps fieldset content clear of
	the legend element. Adjust as necessary. */
/*	Note: There are IE-specific rules in accompanying ie.css file. */
fieldset legend span {
	position: absolute;
	left: 0;
	}
fieldset {
	padding-top: 2em;
	position: relative;
	}	
	
	
/*	Block-level label style.
	Delete the following sets of inline styles if using labels
	left-aligned, above fields. This is all that's required. */
label {
	display: block;
	position: relative;
	}	

label img.required {
	position: absolute;
	right: -8px;
	}

/*	Inline label style (left-aligned). */
/*	Fieldset.actions left margin should be the same as label width (+ padding & margins). */
/*	When using a 12px em, the standard for Blueprint CSS, 12.5ems = 150px! */
label {    
	float: left;    
	width: 11.5em;    
	margin-right: 1em;   
	}	
fieldset li {
	float: left;    
	clear: left;    
	width: 100%;    
	}
fieldset ol {    
	float: left;    
	clear: left;    
	width: 100%;    
	}
fieldset.actions {
	padding-top: 1em;
	padding-left: 12.5em;
	}
	
/*	Inline label style (right-aligned). */
label {
	text-align: right;
	}

form .instructions {
	font-size: 1.1667em;
	line-height: 1.286em;
	color: #75625C;
	}
form .note {
	font-size: 0.833em;
	line-height: 1.8em;
	color: #75625C;
	}


form {
	/*padding-top: 2em;*/
	}

fieldset {
	padding-top: 3em;
	border: none;
	border-bottom: 1px dotted #C7BFBD;
	padding-bottom: 2em;
	margin-bottom: 0.5em;
	}
	
legend span {
	font-size: 1.2em;
	font-weight: normal;
	color: #14B1E7;
	}
	
label {
	color: #442B23;
	font-weight: normal;
	}
	
/* @end */

/* @group Validation */

/* Float form fields so that markers can naturally follow-on. */	
input,
select,
textarea {
	float: left;
	}
select {
	margin-right: 5px;
	}	
.invalid label {
	/*color: #CE0C13;*/
	color: #C52B4D;
	}
.invalid input,
.invalid textarea {
	/*border: 1px solid #CE0C13;*/
	border: 1px solid #C52B4D;
	}
	
.validation .marker {
	display: block;
	float: left;
	
	/*width: 24px;
	height: 24px;*/
	width: 18px;
	height: 18px;
	
	margin-left: 5px;

	text-indent: -9999em;
	}
.valid .marker {
	/*background: url(/ui/assets/forms/valid-marker.png);*/
	background: url(/ui/assets/forms/correct-marker.png);
	}	
.invalid .marker {
	/*background: url(/ui/assets/forms/invalid-marker.png);*/
	background: url(/ui/assets/forms/incorrect-marker.png);
	}	

/*	Left margin should be the same as label width (+ padding & margins).
	Width should be same as input fields. */
/*	If using block-level labels, width and left margin will need to be adjusted to suit. */
.validation .message {
	clear: left;
	display: block;
	margin-left: 150px;
	padding-top: 0.5em;
	width: 250px;
	
	font-size: 0.833em;
	}	
.invalid .message {
	/*color: #CE0C13;*/
	color: #C52B4D;
	}
	
/* @end */

/* @group Buttons */

/*
form button[name="submit"] {
	width: 100px;
	height: 28px;
	padding: 0;
	margin: 0;
	border: none;
	background: transparent;
	
	background-repeat: no-repeat;
	background-position: left top;
	}
form button[name="submit"]:hover {
	background-position: 0 -28px;
	}
form button[name="submit"] span {
	display: none;
	}
	
	
form button[name="submit"]#submit {
	background-image: url(/ui/assets/forms/button-submit.png);
	}
form button[name="submit"]#next {
    background-image: url(/ui/assets/forms/button-next.png);
	}
*/

/* @end */
/* @end */