Change the background color of the WooCommerce credit card form?

Themes vary. Please post the url to your site so the styles can be examined with browser tools.

I can see custom styles in the child style.css file, in the theme customiser and in the standard WordPress field at: Appearance > Customise > Additional CSS. I’d put them all in just one place, probably the theme customiser.

Try a service like this to make the styles easier to read:
http://www.cleancss.com/css-beautify/

box background to white:
your css should work, but can’t find it in the page, did you take it out? Try just:

.woocommerce #payment div.payment_box,
.woocommerce-page #payment div.payment_box {
  background-color: #ffffff;
}

bottom border line:
its not in the :after, so try:

.woocommerce-checkout #payment ul.payment_methods {
  border-bottom-width:0;
}

button colours – these are defined in several places. To take precedence, put this at the end of the theme customiser styles:

.woocommerce input.button,
.woocommerce-page input.button {
  color: #ffffff;
  background-color: #444444;
}

That will probably apply to all woocommerce buttons on site. To make it apply to just the payment button, insert the #payment selector:

.woocommerce #payment input.button {

If any of this doesn’t work, leave it in the page so it can be debugged.

I can’t find the css in the page. Where did you put it?

I’m looking at the section starting <style id="theme-customizer-css">, well the whole page really, in the markup, and its not there. Either its not saved or maybe I’m looking at some cached version.

Its still not in with the theme customiser css, but I can now see it in the WP custom css section. The css is having the intended effect on the checkout page – white background, line gone & button colour deeper. Please check.

.woocommerce-checkout #payment {
  background: #fff;
}