Alongside products and categories, the checkout is a fundamental part of any online store, and it's important to get it right. As with other views in Drupal Commerce, you can customize your checkout through Drupal themes.
You will need to create your own Drupal theme before performing the following steps; see the Creating a new theme for Drupal Commerce recipe.
To style the checkout page, you can edit both CSS and the HTML file that Drupal uses to style and structure these elements:
Navigate to your store's checkout by adding a product to your cart, and clicking on the Checkout button on the Shopping Cart page. As you can see, the checkout page is currently functional, but a little bare:
Open your theme's stylesheet (for example,
/sites/all/themes/defacto/defacto.css
), and apply the following style to alter the style of the Order total block:.field-name-commerce-order-total .field-items { background: #88aa00 !important...