form{
	margin-bottom:1em; 
}

fieldset{ 
	margin-bottom:1em; 
}

select{
	padding: 0; 
}

label, legend { 
	abbr[title]{ 
		outline:none; 
		border:none; 
		color:red; 
	}
	
	display: block;
	font-weight: bold;
	font-size: $font-size;
}


// Make UI consistant across all browsers.
//----------------------------------------------------------------------------------------------------

::-moz-focus-inner {
	border: 0;
	padding: 0; 
}

input[type="search"]::-webkit-search-decoration {
	display: none; 
}

input, button, select, textarea {
	margin: 0;
	vertical-align: middle; 
}

input[type="radio"],
input[type="checkbox"] {
	position: relative;
	vertical-align: top;
	top: 0.5em;
	// IE8, IE9, IE10
	top: 0 \0;
	// IE7
	*top: -3px; 
}

// iPad
@media (-webkit-min-device-pixel-ratio: 1) and (max-device-width: 1024px) {
	input[type="radio"],
	input[type="checkbox"] {
		vertical-align: baseline;
		top: 2px; 
	}
}

// iPhone 3
@media (-webkit-min-device-pixel-ratio: 1) and (max-device-width: 480px) {
	input[type="radio"],
	input[type="checkbox"] {
		vertical-align: baseline;
		top: 0; 
	} 
}

// iPhone 4
@media (-webkit-min-device-pixel-ratio: 2) and (max-device-width: 480px) {
	input[type="radio"],
	input[type="checkbox"] {
    	vertical-align: baseline;
		top: 0; 
	}
}

button, input[type="reset"], input[type="submit"], input[type="button"] {
	-webkit-appearance: none;
	background: #dddddd;
	-moz-background-clip: border-box;
	-webkit-background-clip: border-box;
	background-clip: border-box;
	-webkit-border-radius: $button-border-radius;
	-moz-border-radius: $button-border-radius;
	border-radius: $button-border-radius;
	border: 1px solid;
	border-color: $button-border-color;
	cursor: pointer;
	color: $button-color;
	font: bold 12px / 1.3 "Helvetica Neue", Arial, "Liberation Sans", FreeSans, sans-serif;
	outline: 0;
	overflow: visible;
	padding:$button-padding;
	width: auto;
	user-select:none;
	// IE7
	*padding-top: 2px;
	*padding-bottom: 0px; 
}

button {
	// IE7
	*padding-top: 1px;
	*padding-bottom: 1px; 
}

textarea, select, input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="email"],
input[type="month"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"],
input[type="time"], input[type="url"], input[type="week"] {
	-webkit-appearance: none;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
	-ms-box-sizing:content-box;
	-moz-background-clip: padding;
	-webkit-background-clip: padding;
	background-clip: padding-box;
	background-color: white;
	border: 1px solid;
	-webkit-border-radius: $input-border-radius;
	-moz-border-radius: $input-border-radius;
	border-radius: $input-border-radius;
	border-color: $input-border-color;
	color: $input-color;
	outline: 0;
	height:auto;
	padding: $input-padding;
	font-size: $input-font-size;	
	// Leaving out Helvetica Neue, to not throw off size="..."
	// on inputs. Arial is more reliable, on Windows and OS X.
	font-family: Arial, "Liberation Sans", FreeSans, sans-serif;
	// IE7
	*padding-top: 2px;
	*padding-bottom: 1px;
	*height: auto; 
	min-width:100px;
	
	&[disabled]{ 
		color: $disabled-input-color;
		border-color: $disabled-input-border-color;
		background-color: $disabled-input-background-color; 
	}
	
	&:focus, &:active{
		color:$focus-input-color;
		border-color:$focus-input-border-color;
		background-color:$focus-input-background-color;
	}
}

// Separate rule for Firefox.
// Separate rule for IE, too.
// Cannot stack with WebKit's.
::-webkit-input-placeholder {
	color: #888888;
}

input:-moz-placeholder, textarea:-moz-placeholder{
	color: #888888; 
}

input.placeholder-text, textarea.placeholder-text{
	color: #888888; 
}

:invalid {
  // Suppress red glow that Firefox
  // adds to form fields by default,
  // even when user is still typing.
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow: none; 
}

button:focus, button:active, input:focus, input:active,
select:focus, select:active, textarea:focus, textarea:active {
	z-index: 1; 
	outline: none;
}


button[disabled], input[disabled], select[disabled], select[disabled] option, select[disabled] optgroup, textarea[disabled] {
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
	color: $font-color;
	cursor: default; 
}

textarea, select[size], select[multiple] {
	height: auto;
}

select[size]{ padding:0.35em; }

// Tweaks for Safari + Chrome.
@media (-webkit-min-device-pixel-ratio: 0) {
	select {
		background-image:url($select-arrow-image);
		background-repeat: no-repeat;
		background-position: right center;
		padding-right: 20px; 
	}
	
	select[size], select[multiple] {
		background-image: none;
		padding: 0; 
	}
	::-webkit-validation-bubble-message {
		border: 1px solid;
		border-color: $input-border-color;
		color: white;
		font: 13px / 17px "Lucida Grande", Arial, "Liberation Sans", FreeSans, sans-serif;
		overflow: hidden;
		padding: 15px 15px 17px;
		text-shadow: black 0 0 1px;
		height: 16px; 
	}
	::-webkit-validation-bubble-arrow,
	::-webkit-validation-bubble-top-outer-arrow,
	::-webkit-validation-bubble-top-inner-arrow {
		-webkit-box-shadow: none;
		box-shadow: none;
		background: #666666;
		border: 0; 
	}
}

textarea {
	min-height: 40px;
	overflow: auto;
	resize: vertical;
	width: 100%;
}

optgroup {
	color: black;
	font-style: normal;
	font-weight: normal; 
}

span.field-with-error, span.field-with-errors{ position:relative; @include inline-block; padding-bottom:10px;
	textarea, select, input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="email"],
	input[type="month"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"],
	input[type="time"], input[type="url"], input[type="week"]{
		border-color:$invalid-input-border-color;
		color:$invalid-input-color;
		background-color:$invalid-input-background-color;
	}
	
	span.errors-for-field, span.error-for-field{
		font-size:11px;
		position:absolute; 
		bottom:-5px;
		left:0px;
		display:block;
		color:$error-color;		
	}
}