JSFiddle - React, Tailwind, and code Playground

HTML

<table border="0">
<tbody>
<tr>
<td>
<h2>Styling</h2>
</td>
<td>asd</td>
</tr>
<tr>
<td><h2>Cut and Blow Dry
</h2></td>
<td>£7</td>
</tr>
<tr>
<td>Blow Dry</td>
<td>£5</td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td>
<h2>Colouring</h2>
</td>
<td></td>
</tr>
<tr>
<td>gloss Colour</td>
<td>£12</td>
</tr>
<tr>
<td>Tint Application</td>
<td>£17</td>
</tr>
<tr>
<td>Re-Growth and Gloss Colour</td>
<td>£25</td>
</tr>
<tr>
<td>Maji Lights (Box Section)</td>
<td>£25</td>
</tr>
<tr>
<td>Maji Lights (T-Section)</td>
<td>£30</td>
</tr>
<tr>
<td>Half Head Highlights</td>
<td>£20</td>
</tr>
<tr>
<td>Full Head Highlights</td>
<td>£25</td>
</tr>
<tr>
<td>Gloss Lights (T-Section)</td>
<td>£25</td>
</tr>
<tr>
<td>Gloss Lights (Box Section)</td>
<td>£20</td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td>
<h2>Texture</h2>
</td>
<td></td>
</tr>
<tr>
<td>Spray</td>
<td>£7</td>
</tr>
<tr>
<td>Masque</td>
<td>£5</td>
</tr>
<tr>
<td colspan="2">For any queries, please contact seanhanna Academy on 0208 946 8710</td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
</tbody>
</table>

CSS

h2 {
  color:green;  
}
table h2:nth-of-type(1) {
    color:red;
}

td {
        padding-left: 20px;
        line-height: 30px;
        font-size: 115%;
        color: black;
    }
    
    td h2 {
        margin-top: 28px;
        margin-bottom: 17px;
        background: none;
    }
            
    #form {
        max-width: 775px;
        margin: auto;
    }