/* ---------------------- FORM STYLES
*/
/* base styles inherited from Boilerplate - in style.css */

form {}
fieldset{}
legend {padding-bottom: 10px; color: #000; /* color for IE */ font-weight: bold;}
legend span {display: block; width: 300px;} /* fixed width because long legends don't wrap */

/* Text input fields */

input[type="text"], input.text,
input[type="password"], input.password,
select,
textarea {font-size: 100%; font-family: Arial, Helvetica, sans-serif; padding: 2px 3px 3px 3px;}
input[type="text"], input.text,
input[type="password"], input.password,
select,
textarea {border: 1px solid #C7B1B1;}		/* border */
textarea {resize:vertical;}
input:hover,
select:hover,
textarea:hover,
input:focus,
select:focus,
textarea:focus {border-color:#000000;}		/* styles on hover and when input focused */
input[type="text"], input.text,
input[type="password"], input.password,
textarea,
select {width: 300px;}						/* default medium width */


/* Buttons */

input[type="submit"], input.submit,
input[type="reset"], input.reset,
button {
	float: left;
	display: block;
	margin: 5px 10px 0 0;
	padding: 6px 20px 5px 20px;
	width: auto;		/* auto or fixed width; for IE - not for table layout */
	overflow: visible;	/* for IE */
	border: 1px solid #999;
	background-color: #eee;								/* normal state */
	color: #000;
	font-size: 100%;
	font-weight: bold;
	text-transform:uppercase;
	cursor: pointer; /* for IE6 */
	}
input[type="submit"]:hover, input.submit:hover,
input[type="reset"]:hover, input.reset:hover,
button:hover {background-color: #ddd; color:#000;}		/* hover state */
input[type="submit"]:active, input.submit:active,
input[type="reset"]:active, input.reset:active,
button:active {background-color: #333; color:#fff;}		/* press state */

/* Check boxes and radios */

input[type="radio"], input.radio,
input[type="checkbox"], input.checkbox {border-width: 0; position: relative; top: 2px;}

/* Other text */

form p { margin-bottom: 5px;}
/* asterisk (*) for required fields */
form label em,
form label .required{ color: #999999;}
/* extra info, tips next to inputs */
form span.info,
form p.info {color: #7d7d7d; margin-bottom:0;}


/* -------------- Form layout
 */

/* lists for layout - each li containing label and input */
form ul { margin:0; padding:0;}
form ul li { margin:0 0 8px 0; padding:0; background:none; list-style:none; overflow:hidden; /* to contain floats */}
form ul li.hidden { font-size:0px; line-height:0px; height:0px; margin:0; padding:0;}

/* Variation A: label en input side by side, horizontally (= default) */

/* labels and input standalone in containing li */
form label { float: left; display: inline; width: 150px; margin-right: 15px;}	/* labels on the left */
form input { float: left; display: inline; width: 350px;}						/* input on the right */
li.button {padding-left: 165px;}												/* buttons on the right */
label.inline { float:none; width:auto; margin-right:0;}
label.block {display: block; float:none; width:auto; margin-right:0;} 			/* ie. for stacked radio/check boxes, instead of inline */
form input[type="checkbox"], form input.checkbox, form input[type="radio"], form input.radio { float:none; width: auto;}
form .wrap_input input { float:none;}

/* labels and input wrapped with div.wrap_label and div.wrap_input */
form label,
form .wrap_label { float: left; display: inline; width: 150px; margin-right: 15px;}	/* labels on the left */
form .wrap_label label {float: none; display: block; width: auto; margin:0;}
form input,
form .wrap_input { float: left; display: inline; width: 350px;}						/* input on the right */
form .wrap_input input { float:none;}

/* wide label that spans two "columns", but inputs still aligned on the right below label (extra class .wide on .wrap_label) */
form li .wrap_label_wide { float: none; display: block; width: auto; margin-bottom: 0px;}
form li .wrap_input_wide { margin-left: 165px;}

/* Variation B: label and input stacked vertically - add class .vertical to each li or to form or to form container */

form li.vertical,
.vertical li { margin-bottom: 10px;}
form li.vertical .wrap_label,
.vertical li .wrap_label,
.vertical label,
form li.vertical label,
.vertical li label { float: none; display: block; width: auto; margin-bottom: 2px;}
form li.vertical .wrap_input,
.vertical li .wrap_input { float:none; display:block; width:auto;}
.vertical li.button {padding-left:0;}


/* ------------------ Messages after submit */

.message_good,
.form_success {margin: 0 0 10px 0; padding: 7px 9px 9px 9px; border: 1px solid #2A7F22; background: #E3FFE0;}

/* error message on top of form */
.errors,
.message_bad {margin: 0 0 10px 0; padding: 7px 9px 9px 9px; border: 1px solid #b00; background: #ffdfdf;} /* or #errorExplanation */
.errors h2 { font-size: 14px; font-weight: bold; border:none; margin: 10px 0 6px 0;}
.errors p,
.errors ol,
.errors ul { margin-bottom: 0;}
.errors ul { list-style: disc;}
.errors ul li { margin-left: 15px; padding-left: 15px; background:none; list-style: disc;}
.errors a {}

/* error highlight within form (classes added with javascript or php) */
label.error { font-weight: bold; color: #8b0800;}
input.error,
.fieldWithErrors input,
li.error input {border: 1px solid #b00; background: #ffdfdf;}
li.error input:focus {background: #fff;}

input:valid, textarea:valid {  }
input:invalid, textarea:invalid { background-color: #f0dddd; }

/* --------------------- specific forms on public site
*/

/* Search form */

#form_search { margin: 0; padding: 0;}
#form_search label { /*display: block;*/ margin: 0 5px 0px 0;}
#form_search input#search_query {width: 150px; margin: 0 5px 0 0; padding: 2px 4px; font-size: 13px;}
#form_search input.submit,
#form_search input[type="submit"],
#form_search button { margin-top:0; margin-left:0; padding: 1px 2px; letter-spacing: 1px; font-size: 13px;}

/* Login form */

/* Contact form */

/* Newsletter form */


/**/