body { margin: 0; } #payment-form .sub-wrapper{ display: flex; flex-direction: row; width: 265px; } #payment-form .form-wrapper { margin: 0; flex-direction: column; } #payment-form .field-lg{ max-width: 256px; min-width: 230px; } #payment-form .input-wrapper { position: relative; margin: 40px 8px 10px 0; } #payment-form .sub-wrapper .input-wrapper:last-child { margin-right: 0; } #payment-form .input-wrapper input, #payment-form div.invalid, #payment-form div.valid { height: 38px; width: 100%; padding: 6px 0 6px 12px; font-size: 1rem; font-weight: 400; line-height: 1.5; color: #444; background-color: #f0f0f0; background-clip: padding-box; border: 1px solid #ddd; border-radius: 0.25rem; transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; } #payment-form div.invalid, #payment-form div.valid { top: -10px; } #payment-form .input-label { border: none; color: black; font-size: 0.9rem; position: absolute; padding: 6px 0; top: -40px; } #payment-form input.invalid, #payment-form div.invalid { border-color: #D9230F; } #payment-form input.invalid:not(#expirationYear):not(#expirationMonth), #payment-form div.invalid { padding-right: calc(0.75em + 0.1875rem); background-image:url("data:image/svg+xml,
") !important; background-repeat: no-repeat; background-position: right calc(0.75em + 0.1875rem) center; background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } #payment-form .input-wrapper input.center { text-align: center !important; padding: 6px 0 6px 0; }
