My following HTML tags changes once I save the template!-
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
body {
font-family: Arial, sans-serif;
}
.certificate {
max-width: 800px;
margin: 20px auto;
padding: 20px;
border: 2px solid #3366ff;
text-align: center;
}
h2, p {
color: #3366ff;
}
table {
width: 100%;
border-collapse: collapse;
margin-top: 20px;
}
th, td {
border: 1px solid #ddd;
padding: 10px;
}
th {
background-color: #f2f2f2;
}
</style>
</head>
<body>
<div class="certificate">
<h2>Associate Diploma in Pipefitting Program</h2>
<p>Certificate of Unit Credit is awarded to <strong>[firstname] [lastname]</strong></p>
<p>Who attended National Industrial Training Institute and was successful in the following units:</p>
<table>
<thead>
<tr>
<th>Course Code</th>
<th>Subject</th>
<th>Grade</th>
</tr>
</thead>
<tbody>
<tr>
<td>AAT/L01/180</td>
<td>Basic English Level - 1</td>
<td>Pass</td>
</tr>
<tr>
<td>AAT/L02/150</td>
<td>Basic English Level - 2</td>
<td>Pass</td>
</tr>
<tr>
<td>AAT/L03/180</td>
<td>Basic English Level - 3</td>
<td>Pass</td>
</tr>
<tr>
<td></td>
<td>End of Project – Theory</td>
<td>Pass</td>
</tr>
<tr>
<td>GAT01/30</td>
<td>Basic Health & Safety</td>
<td>Pass</td>
</tr>
<tr>
<td>GAT02/60</td>
<td>Measuring Systems</td>
<td>Pass</td>
</tr>
<tr>
<td>GAT03/120</td>
<td>Hand & Power Tools</td>
<td>Pass</td>
</tr>
<tr>
<td>PAT01/90</td>
<td>Piping system</td>
<td>Pass</td>
</tr>
<tr>
<td>GAT04/60</td>
<td>Oxyacetylene</td>
<td>Pass</td>
</tr>
<tr>
<td>PAT02/60</td>
<td>Non-Metallic Pipe</td>
<td>Pass</td>
</tr>
<tr>
<td>PAT03/60</td>
<td>Threaded Pipe Spools</td>
<td>Pass</td>
</tr>
<tr>
<td>PAT04/120</td>
<td>Welded Pipe Spools</td>
<td>Pass</td>
</tr>
<tr>
<td></td>
<td>End of Project – Practical</td>
<td>Pass</td>
</tr>
</tbody>
</table>
<p>Certificate Number: [course_certificate_number]</p>
<p>Validity: This certificate has an unlimited validity.</p>
<p>Date: [date_complete]</p>
</div>
</body>
</html>
