.form-field{align-items:center;display:flex;flex-flow:column;margin-bottom:1em;position:relative;text-align:center;width:100%}.form-field.required .form-label-text:after{content:"*";display:inline;margin-left:.2em}.form-field.required.is-valid .form-input,.form-field.required.is-valid .form-textarea{border-color:var(--field-bd-valid)}.form-field.is-empty.is-required .form-input,.form-field.is-empty.is-required .form-textarea,.form-field.is-invalid .form-input,.form-field.is-invalid .form-textarea{border-color:var(--field-bd-error)}.form-field.is-empty.form-t:not(:focus-within) .form-label-text{transform:translateY(2.45rem);transition:transform var(--transition)}.form-field.has-hint .form-label-text{transform:none}.form-label{width:100%}.form-label-text{color:var(--field-legend);font-family:var(--font-emph);font-size:.8rem;font-weight:700;line-height:.8;margin-bottom:.6rem;padding:0 1rem;pointer-events:none;text-transform:uppercase;transition:transform var(--transition)}.form-hint{font-size:1rem;font-style:italic}.form .form-card,.form .form-input,.form .form-textarea{border:2px solid var(--field-bd);border-radius:1rem;color:var(--field-cl);transition:transform var(--transition),color var(--transition),background var(--transition),background-color var(--transition),background-image var(--transition),border-color var(--transition)}.form .form-card:focus,.form .form-card:focus-within,.form .form-card:hover,.form .form-input:focus,.form .form-input:focus-within,.form .form-input:hover,.form .form-textarea:focus,.form .form-textarea:focus-within,.form .form-textarea:hover{background:var(--field-bg-hov);border-color:var(--field-bd-hov);color:var(--field-cl-hov)}