Customised salary slip

@centaur

Can you please guide me on how to call earnings and deductions column in HTML customized format? and also overtime from timesheet

Here is my code:

<html>
<head>
<style>
table{
width: 100%;
border-collapse:collapse;
border: 1px solid black;
}
table td{line-height:8px;padding-left:8px;}
</style>

</head>
<body>
<table border="1">
<center><b><h5.5>Aerotek Design</h5.5><left></b></center>
   <center><h7>Unit No. 3, Plot No. 27A</h7></center>
              <center>Peenya, Bengaluru - 560058</center>
   <center>Karnataka, India</center>
<th>Employee Id:</th>
<td><b>{{ doc.employee }}</b></td>
<th>Name</th>
<td><b>{{ doc.employee_name }}</b></td>
</tr>
<!-----2 row--->
<tr>
<th>Bank</th>
<td><b>{{ doc.bank_name }}</b></td>
<th>Bank A/c No.</th>
<td>{{ doc.bank_account_no }}</td>
</tr>
<!------3 row---->
<tr>
<th>Date of Joining</th>
<td><b>{{ doc.date_of_joining }}</b></td>
<th>Lop Days</th>
<td><b>{{ doc.leave_without_pay }}</b></td>
</tr>
<!------4 row---->
</tr>
<!------5 row---->
<tr>
<th>Location</th>
<td>India</td>
<th>Working Days</th>
<td> {{ doc.total_working_days }} </td>
</tr>
<!------6 row---->
<tr>
<th>Department</th> 
<td> {{ doc.department }} </td>
<th>Designation</th>
<td> {{ doc.designation }} </td>

<br/>
<table border="1">
<tr>
<th >EARNINGS</th>
<th>AMOUNT</th>
<th >DEDUCTIONS</th>
<th>AMOUNT</th>