title: Changing font-family of react-stripe-elements
body: <p>So I'm integrating Stripe elements into my React app and I'm having a time trying to change the font of the elements. I've tried passing the style using a style const but that doesn't change anything</p>
  
  <pre><code>const style = {
    base: {
      fontFamily: '"Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"'
    }
  }
  
  &lt;CardNumberElement style={style} className="form-control" id="cardNumber" placeholder="XXXX XXXX XXXX XXXX" type="text" /&gt;
  </code></pre>
  
  <p>I've tried using the code in this GitHub issue: <a href="https://github.com/stripe/react-stripe-elements/issues/179" rel="nofollow noreferrer">https://github.com/stripe/react-stripe-elements/issues/179</a></p>
  
  <p>I've tried this: <a href="https://wordpress.org/support/topic/change-css-for-checkout-form/" rel="nofollow noreferrer">https://wordpress.org/support/topic/change-css-for-checkout-form/</a></p>
  
  <p>I've tried just using plain inline styling. Please anyone who's had to deal with this help me out</p>