diff --git a/addons/hr_timesheet/views/hr_timesheet_portal_templates.xml b/addons/hr_timesheet/views/hr_timesheet_portal_templates.xml
index 9eecedeb499..8a6376776c7 100644
--- a/addons/hr_timesheet/views/hr_timesheet_portal_templates.xml
+++ b/addons/hr_timesheet/views/hr_timesheet_portal_templates.xml
@@ -153,26 +153,60 @@
                     <span t-else="" t-field="timesheet.unit_amount" t-options='{"widget": "float_time"}'/>
                 </td>
             </tr>
-            <tfoot>
-                <tr>
-                    <th colspan="3"></th>
-                    <th class="text-end">
-                        <t t-set="timesheets_amount" t-value="round(sum(timesheets.mapped('unit_amount')), 2) or 0.0"></t>
-                        <div t-if="is_uom_day"><strong>Days Spent:</strong> <span t-esc="timesheets._convert_hours_to_days(timesheets_amount)" t-options='{"widget": "timesheet_uom"}'/></div>
-                        <div t-else=""><strong>Hours Spent:</strong> <span t-esc="timesheets_amount" t-options='{"widget": "float_time"}'/></div>
-                        <t t-set="timesheets_by_subtask_amount" t-value="round(sum(sum(timesheet_by_subtask.mapped('unit_amount') or 0.0) for timesheet_by_subtask in timesheets_by_subtask.values()), 2) or 0.0"></t>
-                        <div t-if="timesheets_by_subtask">
-                            <div t-if="is_uom_day">Days recorded on sub-tasks: <span t-esc="timesheets._convert_hours_to_days(timesheets_by_subtask_amount)" t-options='{"widget": "timesheet_uom"}'/></div>
-                            <div t-else="">Hours recorded on sub-tasks: <span t-esc="timesheets_by_subtask_amount" t-options='{"widget": "float_time"}'/></div>
-                        </div>
-                        <t t-set="allocated_time" t-value="task.allocated_hours"></t>
-                        <div t-if="allocated_time > 0" name="allocated_time" t-attf-class="{{task.remaining_hours &lt; 0 and 'text-danger' or ''}}">
-                            <div t-if="is_uom_day">Remaining Days: <span t-esc="timesheets._convert_hours_to_days(allocated_time - timesheets_amount - timesheets_by_subtask_amount)" t-options='{"widget": "timesheet_uom"}'/></div>
-                            <div t-else="">Remaining Hours: <span t-esc="allocated_time - timesheets_amount - timesheets_by_subtask_amount" t-options='{"widget": "float_time"}'/></div>
-                        </div>
-                    </th>
-                </tr>
-            </tfoot>
         </table>
+        <div class="container_subtotal">
+            <div class="row justify-content-end">
+                <div t-attf-class="{{'col-auto' if report_type != 'html' else 'col-sm-2'}}">
+                    <table class="table table-sm">
+                        <tr>
+                            <t t-set="timesheets_amount" t-value="round(sum(timesheets.mapped('unit_amount')), 2)"></t>
+                            <td><strong>Total: </strong></td>
+                            <td class="text-end">
+                                <t t-if="is_uom_day">
+                                    <span t-esc="timesheets._convert_hours_to_days(timesheets_amount)" t-options="{'widget': 'timesheet_uom'}"/>
+                                </t>
+                                <t t-else="">
+                                    <span t-esc="timesheets_amount" t-options='{"widget": "float_time"}'/>
+                                </t>
+                            </td>
+                        </tr>
+                        <t t-set="timesheets_by_subtask_amount" t-value="round(sum(sum(timesheet_by_subtask.mapped('unit_amount') or 0.0) for timesheet_by_subtask in timesheets_by_subtask.values()), 2) or 0.0"></t>
+                        <tr>
+                            <div t-if="timesheets_by_subtask">
+                                <t t-if="is_uom_day">
+                                    <td><strong>Days recorded on sub-tasks: </strong></td>
+                                    <td class="text-end">
+                                        <span t-esc="timesheets._convert_hours_to_days(timesheets_by_subtask_amount)" t-options='{"widget": "timesheet_uom"}'/>
+                                    </td>
+                                </t>
+                                <t t-else="">
+                                    <td><strong>Hours recorded on sub-tasks: </strong></td>
+                                    <td class="text-end">
+                                        <span t-esc="timesheets_by_subtask_amount" t-options='{"widget": "float_time"}'/>
+                                    </td>
+                                </t>
+                            </div>
+                        </tr>
+                        <t t-set="allocated_time" t-value="task.allocated_hours"></t>
+                        <tr t-attf-class="{{task.remaining_hours &lt; 0 and 'text-danger' or ''}}">
+                            <div t-if="allocated_time > 0" name="allocated_time">
+                                <t t-if="is_uom_day">
+                                    <td><strong>Remaining Days: </strong></td>
+                                    <td class="text-end">
+                                        <span t-esc="timesheets._convert_hours_to_days(allocated_time - timesheets_amount - timesheets_by_subtask_amount)" t-options='{"widget": "timesheet_uom"}'/>
+                                    </td>
+                                </t>
+                                <t t-else="">
+                                    <td><strong>Remaining Hours: </strong></td>
+                                    <td class="text-end">
+                                        <span t-esc="allocated_time - timesheets_amount - timesheets_by_subtask_amount" t-options='{"widget": "float_time"}'/>
+                                    </td>
+                                </t>
+                            </div>
+                        </tr>
+                    </table>
+                </div>
+            </div>
+        </div>
     </template>
 </odoo>
diff --git a/addons/hr_timesheet/views/project_task_portal_templates.xml b/addons/hr_timesheet/views/project_task_portal_templates.xml
index 930350fd772..53b136606cd 100644
--- a/addons/hr_timesheet/views/project_task_portal_templates.xml
+++ b/addons/hr_timesheet/views/project_task_portal_templates.xml
@@ -19,7 +19,7 @@
         </xpath>
         <xpath expr="//div[@id='card_body']" position="inside">
             <div class="container" t-if="timesheets and allow_timesheets">
-                <hr class="mt-4 mb-1"/>
+                <hr class="mt-4 mb-4"/>
                 <h5 id="task_timesheets" class="mt-2 mb-2" data-anchor="true">Timesheets</h5>
                 <t t-call="hr_timesheet.portal_timesheet_table"/>
             </div>
diff --git a/addons/sale_timesheet/views/project_portal_templates.xml b/addons/sale_timesheet/views/project_portal_templates.xml
index 0ebed290f8b..7bea5d46f1a 100644
--- a/addons/sale_timesheet/views/project_portal_templates.xml
+++ b/addons/sale_timesheet/views/project_portal_templates.xml
@@ -17,10 +17,6 @@
 		<t t-else=""><t t-out="timesheet.so_line.display_name"/></t>
 	    </td>
         </xpath>
-        <xpath expr="//tfoot/tr/th[@colspan='3']" position="replace">
-            <t t-if="display_sol"><th colspan="4"></th></t>
-            <t t-else=""><th colspan="3"></th></t>
-        </xpath>            
     </template>
 
 </odoo>
diff --git a/addons/sale_timesheet/views/sale_timesheet_portal_templates.xml b/addons/sale_timesheet/views/sale_timesheet_portal_templates.xml
index 9a237798f43..58f97479c6c 100644
--- a/addons/sale_timesheet/views/sale_timesheet_portal_templates.xml
+++ b/addons/sale_timesheet/views/sale_timesheet_portal_templates.xml
@@ -125,7 +125,7 @@
                 <div t-if="task.sale_line_id.untaxed_amount_invoiced > 0"><strong>Invoiced:</strong>
                     <span t-field="task.sale_line_id.untaxed_amount_invoiced"/>
                 </div>
-                <div t-if="task.sale_line_id.untaxed_amount_to_invoice > 0"><strong>To invoice:</strong>
+                <div name="amount_due" t-if="task.sale_line_id.untaxed_amount_to_invoice > 0"><strong>Amount Due:</strong>
                     <span t-field="task.sale_line_id.untaxed_amount_to_invoice"/>
                 </div>
             </t>