@charset "UTF-8";
/* These are the classes applied on the error messages which prevent them from being displayed by default. */ 
.textfieldRequiredMsg, 
.textfieldInvalidFormatMsg, 
.textfieldMinValueMsg,
.textfieldMaxValueMsg,
.textfieldMinCharsMsg,
.textfieldMaxCharsMsg,
.textfieldValidMsg, 
.textareaRequiredMsg,
.textareaMinCharsMsg,
.textareaMaxCharsMsg,
.textareaValidMsg,
.selectRequiredMsg, 
.selectInvalidMsg,
.radioRequiredMsg, 
.radioInvalidMsg,
.passwordRequiredMsg, 
.passwordInvalidStrengthMsg, 
.passwordMinCharsMsg,
.passwordMaxCharsMsg,
.passwordCustomMsg,
.passwordValidMsg,
.confirmRequiredMsg, 
.confirmInvalidMsg, 
.confirmValidMsg,
.checkboxRequiredMsg, 
.checkboxMinSelectionsMsg,
.checkboxMaxSelectionsMsg {display: none;}

/* These selectors change the way messages look when the widget is in one of the error states. */
.textfieldRequiredState .textfieldRequiredMsg, 
.textfieldInvalidFormatState .textfieldInvalidFormatMsg, 
.textfieldMinValueState .textfieldMinValueMsg,
.textfieldMaxValueState .textfieldMaxValueMsg,
.textfieldMinCharsState .textfieldMinCharsMsg,
.textfieldMaxCharsState .textfieldMaxCharsMsg, 
.textareaRequiredState .textareaRequiredMsg,
.textareaMinCharsState .textareaMinCharsMsg,
.textareaMaxCharsState .textareaMaxCharsMsg, 
.selectRequiredState .selectRequiredMsg,
.selectInvalidState .selectInvalidMsg,
.radioRequiredState .radioRequiredMsg,
.radioInvalidState .radioInvalidMsg,
.passwordRequiredState .passwordRequiredMsg,
.passwordMinCharsState .passwordMinCharsMsg,
.passwordMaxCharsState .passwordMaxCharsMsg,
.passwordInvalidStrengthState .passwordInvalidStrengthMsg,
.passwordCustomState .passwordCustomMsg,
.confirmRequiredState .confirmRequiredMsg,
.confirmInvalidState .confirmInvalidMsg,
.checkboxRequiredState .checkboxRequiredMsg,
.checkboxMinSelectionsState .checkboxMinSelectionsMsg,
.checkboxMaxSelectionsState .checkboxMaxSelectionsMsg {margin-left:6px; display: inline; color: #CC3333;}

/* When the widget is in the valid state it has a green background applied on it. */
.textfieldValidState input, input.textfieldValidState,
.textareaValidState textarea, textarea.textareaValidState,
.selectValidState select, select.selectValidState,
.passwordValidState input, input.passwordValidState,
.confirmValidState input, input.confirmValidState {background-color: #B8F5B1;}

/* When the widget is in an invalid state it has a red background applied on it. */
input.textfieldRequiredState, .textfieldRequiredState input, 
input.textfieldInvalidFormatState, .textfieldInvalidFormatState input, 
input.textfieldMinValueState, .textfieldMinValueState input, 
input.textfieldMaxValueState, .textfieldMaxValueState input, 
input.textfieldMinCharsState, .textfieldMinCharsState input, 
input.textfieldMaxCharsState, .textfieldMaxCharsState input, 
textarea.textareaRequiredState, .textareaRequiredState textarea, 
textarea.textareaMinCharsState, .textareaMinCharsState textarea, 
textarea.textareaMaxCharsState, .textareaMaxCharsState textarea,
select.selectRequiredState, .selectRequiredState select,
select.selectInvalidState, .selectInvalidState select,
input.passwordRequiredState, .passwordRequiredState input, 
input.passwordInvalidStrengthState, .passwordInvalidStrengthState input, 
input.passwordMinCharsState, .passwordMinCharsState input, 
input.passwordCustomState, .passwordCustomState input, 
input.passwordMaxCharsState, .passwordMaxCharsState input,
input.confirmRequiredState, .confirmRequiredState input, 
input.confirmInvalidState, .confirmInvalidState input {background-color: #FF9F9F;}

/* When the widget has received focus, it has a yellow background applied on it. */
.textfieldFocusState input, input.textfieldFocusState,
.textareaFocusState textarea, textarea.textareaFocusState,
.selectFocusState select, select.selectFocusState,
.passwordFocusState input, input.passwordFocusState,
.confirmFocusState input, input.confirmFocusState {background-color: #FFFFCC;}

/* This class applies only when the widget has character masking enabled and the user tries to type in an invalid character. */
.textfieldFlashText input, input.textfieldFlashText, 
.textareaFlashState textarea, textarea.textareaFlashState {color: red !important;}

/* When the widget has the hint message on, the hint text can be styled differently than the user typed text. */
.textfieldHintState input, input.textfieldHintState,
textarea.textareaHintState, .textareaHintState textarea {color: gray !important;/**/}