/* Hide number wheel for number-type elements...we're only using number inputs for the mobile T9 keyboard support */
input[type="number"] {
        -webkit-appearance: none;
        margin: 0; /*<-- Apparently some margin are still there even though it's hidden */
        -moz-appearance: textfield;
}

/* errors at to the top of form */
.formTopError {
	color: #FFF;
	width: 90%;
	background-color: #DD0000;
	padding: 12px;
	padding-left: 36px;
	margin: 10px auto;
	font-size: 13px;
	border-radius: 2px;
	font-weight: bold;
	background-position: 6px 5px;
	background-size: 24px 24px;
	background-repeat: no-repeat;
}

/* row containing a single form element */
.formRow {
	line-height: 50px;
	margin: 20px 0;
}

/* row containing multiple form elements */
.formRow .formRow30 {
	margin: 10px 10px 0 0;
	width: 30%;
}

/* form element containers */
.inputContainer {
        display: block;
        position: relative;
}
.inputContainer.inline {
        display: inline-block;
        width: 33%;
        margin-right: 5%;
        margin-top: 0;
        margin-left: 0;
        float: left;
}

/* form elements */
input[type="text"],
input[type="password"],
input[type="number"],
select,
textarea {
        width: 100%;
        height: 45px;
        display: block;
        margin: 0 auto;
        padding: 10px;
        border: none;
        border-radius: 3px;
        font-size: 14px;
	border: 1px solid #000;
        background-color: #FFF;
        background-image: -moz-linear-gradient(top, #FFF, #FFF);
        background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#FFF), to(#FFF));
        background-image: -webkit-linear-gradient(top, #FFF, #FFF);
        background-image: -o-linear-gradient(top, #FFF, #FFF);
        background-image: linear-gradient(to bottom, #FFF, #FFF);
        background-repeat: repeat-x;
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFF', endColorstr='#FFF', GradientType=0);
}

/*
.formRow input[type="text"].inlineField, 
.formRow input[type="number"].inlineField, 
.formRow input[type="password"].inlineField, 
.formRow select.inlineField {
        //width: 33%;
        margin-top: 0;
        margin-left: 0;
        margin-right: 5%;
        display: inline-block;
        float:left;
}
*/

/* Styles for dynamic placeholders */
.formRow .placeholder {
	position: absolute;
        left: 11px;
        top: -3px;
	font-size: 14px;
	line-height: 50px;
	color: #AAA;
}
.formRow .placeholder.shifted {
	position: absolute;
    	top: -8px;
    	padding: 5px;
    	line-height: 0;
    	font-size: 12px;
	background-color: #FFF;
}


/* Form element focus state */
input[type="text"]:focus, 
input[type="number"], 
input[type="password"]:focus , 
select:focus {
//	outline: none;
}

/* Form element error state (overrides focus) */
input[type="text"].inputError,
input[type="number"].inputError,
input[type="number"].inputError.focus
select.inputError,
select.inlineField.inputError,
input[type="text"].inputError:focus, 
input[type="password"].inputError,
input[type="password"].inputError:focus,
select.inputError:focus,
select.inlineFIeld.inputError {
	border-bottom: 2px solid #DD0000;
	border-radius: 3px 3px 0 0;
	color: #AA0000;
	border-color: #DD0000;
}

/* Form element error message */
.formError {
	display: none;
	color: #FFF;
        width: 90%;
        background-color: #F1AD1C;
        padding: 5px 8px;
        margin: 1px auto 5px;
        font-size: 14px;
	border-radius: 0 0 3px 3px;
	position: relative;
	line-height: 20px;
	text-align: left;
}
.formError p {
	padding: 0;
}


/* Format errors to be displayed below fields */
.formRow .inlineError, .formRow .inlineWarning, .formRow .inlineValid {
        background-color: #ff3a3a;
	padding: 0 20px;
        margin-top: 0;
        background-size: 20px 20px;
        background-repeat: no-repeat;
        display: none;
        width: 100%;
        margin: 0 auto;
	font-size: 15px;
	color: #FFF;
}

.formRow .inlineValid {
        max-height: 0;
        overflow: hidden;
}

.formRow .inlineWarning {
        background-color: #7ac2f7;
        color: #000;
        margin-top: -2px;
        border-top: 2px solid #0094ff;
}

.formRow .inlineError p, .formRow .inlineWarning p, .formRow .inlineError li, .formRow .inlineWarning li {
        margin: 0;
        font-size: 14px;
	padding: 10px 0;
        line-height: 18px;
	list-style: disc;
}

