is there a reason to why sendgrid emails does not read
<style>
.center {
display: block;
margin-left: auto;
margin-right: auto;
}
p.sansserif {
font-family: Arial, Helvetica, sans-serif;
}
body.sansserif {
font-family: Arial, Helvetica, sans-serif;
}
div {
background-color: lightgrey;
width: auto;
border: 1px solid white;
padding: 25px;
margin-left: auto;
margin-right: auto;
}
</style>
<img src="https://i.imgur.com/UyDHDNN.png" alt="Concorde TGA Mauritius" style="width:125px;height:63px;" class="center">
<p class="sansserif" align="center"> <font size="5" color="black">
<br /><strong>Purchase Receipt</strong> <br />
</font> <br /> </p>
<p class="sansserif" align="center"> <font size="3" color="black">
Dear Valued Guest,<br />
<br />
Thank you for purchasing via your Concorde Hotel Representative.<br />
<br />
A receipt of your purchase is below. Be sure to keep it in a safe place for future reference.
</font> <br /> </p>
<div class="sansserif" align="center"> <font size="4" color="black">
<b>Order ID: NCIS998 Order Reference Number: EXSER</b>
</font> </div>
<br/>
<body class="sansserif">
<table border="0" cellpadding="0" cellspacing="0" height="100%" width="100%" id="bodyTable">
<tr>
<td align="center" valign="top">
<table border="0" cellpadding="0" cellspacing="0" width="600" id="emailContainer">
<tr>
<td align="center" valign="top">
<table border="1" bordercolor="White" cellpadding="20" cellspacing="0" width="100%" id="emailHeader" bgcolor="Black">
<tr>
<td align="center" valign="top" width="70%" style="color: White;">
Services Purchased
</td>
<td align="center" valign="top" width="30%" style="color: White;">
Price
</td>
<tr>
<td align="center" valign="top" style="color: Black;" bgcolor="White">
Catamaran Cruise (Adriens Dream) (Lunch Included) 2 Hours Cruise Included
</td>
<td align="center" valign="top" style="color: Black;" bgcolor="White">
245.00 EUR
</tr>
</tr>
</table>
</td>
</tr>
<tr>
<td align="center" valign="top">
<table border="0" cellpadding="15" cellspacing="10" width="auto" id="emailBody" align="center">
<tr>
<td align="center" valign="top">
<font size="3" color="black"><b>Your Pick-up Location</b> </td>
<td align="center" valign="top">
<font size="3" color="black"><b>Your Pick-up Time</b>
</td>
<td align="center" valign="top">
<b>Your Pick-up Date</b>
</td>
<tr>
<td align="center" valign="top">
Maradiva
</td>
<td align="center" valign="top">
08.00 am
</td>
<td align="center" valign="top">
Fri 08 Jul 2018
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td align="center" valign="top">
<table border="1" cellpadding="20" cellspacing="0" width="100%" id="emailFooter">
<tr>
<td align="center" valign="top">
This is where my footer content goes.
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
Nothing in the or “style=” is read