Here is our solution. 

In the account.invoice_form view :

<group class="oe_subtotal_footer oe_right  invoice-residual-view">
      <field  name="residual" groups="account.group_account_user" widget="monetary" options="{'currency_field': 'currency_id'}"/>
</group>

In our custom styles.css :

.invoice-residual-view {
    font-size: 24px;
    color: #154734;  !important;
    border: 3px solid #009A44;
    font-weight: bold;
}
.openerp .oe_form .oe_subtotal_footer.invoice-residual-view td.oe_form_group_cell {
    vertical-align: middle;
    padding: 3px 6px 3px 3px !important;
}

And the result :

Hello,

If you added new css class to your custom module. You need to link this new .css by using:

<template id="assets_backend" name="module_name assets" inherit_id="web.assets_backend">
            <xpath expr="." position="inside">
                 <link rel="stylesheet" href="/path/to/s/.css"/>
            </xpath>
        </template>

in your .xml file. 

You can check this question also 

Hope this could help