My email looks fine as a stand alone content if I just paste the HTML and view it on a browser - but when I send it - it looks compeltely broken.

Here is the HTML code:

http://www.w3.org/TR/html4/loose.dtd">
<html lang="en-US">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Bare Brush - NewH</title>
</head>
<body leftmargin="0" marginwidth="0" topmargin="0" marginheight="0" offset="0">
<div id="wrapper" dir="ltr" style="background-color: #f5f5f5; margin: 0; padding: 70px 0 70px 0; width: 100%; -webkit-text-size-adjust: none;">
<table border="0" cellpadding="0" cellspacing="0" height="100%" width="100%"><tr>
<td align="center" valign="top">
<div id="template_header_image">
</div>
<table border="0" cellpadding="0" cellspacing="0" width="600" id="template_container" style="background-color: #fdfdfd; border: 1px solid #dcdcdc; box-shadow: 0 1px 4px rgba(0,0,0,0.1); border-radius: 3px;">
<tr>
<td align="center" valign="top">
<!-- Header -->
<table border="0" cellpadding="0" cellspacing="0" width="600" id="template_header" style='background-color: #557da1; color: #ffffff; border-bottom: 0; font-weight: bold; line-height: 100%; vertical-align: middle; font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; border-radius: 3px 3px 0 0;'><tr>
<td id="header_wrapper" style="padding: 36px 48px; display: block;">
<h1 style='color: #ffffff; font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; font-size: 30px; font-weight: 300; line-height: 150%; margin: 0; text-align: left; text-shadow: 0 1px 0 #7797b4;'>New Order: #8783</h1>
</td>
</tr></table>
<!-- End Header -->
</td>
</tr>
<tr>
<td align="center" valign="top">
<!-- Body -->
<table border="0" cellpadding="0" cellspacing="0" width="600" id="template_body"><tr>
<td valign="top" id="body_content" style="background-color: #fdfdfd;">
<!-- Content -->
<table border="0" cellpadding="20" cellspacing="0" width="100%"><tr>
<td valign="top" style="padding: 48px 48px 0;">
<div id="body_content_inner" style='color: #737373; font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; font-size: 14px; line-height: 150%; text-align: left;'>

<p style="margin: 0 0 16px;">You’ve received the following order from Kosta Kondratenko:</p>
<h2 style='color: #557da1; display: block; font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; font-size: 18px; font-weight: bold; line-height: 130%; margin: 0 0 18px; text-align: left;'>
<a class="link" href="https://staging1.barebrush.com.au/wp-admin/post.php?post=8783&amp;action=edit" style="color: #557da1; font-weight: normal; text-decoration: underline;">[Order #8783]</a> (February 13, 2019)</h2>

<div style="margin-bottom: 40px;">
<table class="td" cellspacing="0" cellpadding="6" border="1" style="color: #737373; border: 1px solid #e4e4e4; vertical-align: middle; width: 100%; font-family: 'Helvetica Neue', Helvetica, Roboto, Arial, sans-serif;">
<thead><tr>
<th class="td" scope="col" style="color: #737373; border: 1px solid #e4e4e4; vertical-align: middle; padding: 12px; text-align: left;">Product</th>
<th class="td" scope="col" style="color: #737373; border: 1px solid #e4e4e4; vertical-align: middle; padding: 12px; text-align: left;">Quantity</th>
<th class="td" scope="col" style="color: #737373; border: 1px solid #e4e4e4; vertical-align: middle; padding: 12px; text-align: left;">Price</th>
</tr></thead>
<tbody><tr class="order_item">
<td class="td" style="color: #737373; border: 1px solid #e4e4e4; vertical-align: middle; padding: 12px; text-align: left; font-family: 'Helvetica Neue', Helvetica, Roboto, Arial, sans-serif; word-wrap: break-word;">
brush aqua-green soft </td>
<td class="td" style="color: #737373; border: 1px solid #e4e4e4; vertical-align: middle; padding: 12px; text-align: left; font-family: 'Helvetica Neue', Helvetica, Roboto, Arial, sans-serif;">
1 </td>
<td class="td" style="color: #737373; border: 1px solid #e4e4e4; vertical-align: middle; padding: 12px; text-align: left; font-family: 'Helvetica Neue', Helvetica, Roboto, Arial, sans-serif;">
<span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>0.00</span> </td>
</tr></tbody>
<tfoot>
<tr>
<th class="td" scope="row" colspan="2" style="color: #737373; border: 1px solid #e4e4e4; vertical-align: middle; padding: 12px; text-align: left; border-top-width: 4px;">Subtotal:</th>
<td class="td" style="color: #737373; border: 1px solid #e4e4e4; vertical-align: middle; padding: 12px; text-align: left; border-top-width: 4px;"><span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>0.00</span></td>
</tr>
<tr>
<th class="td" scope="row" colspan="2" style="color: #737373; border: 1px solid #e4e4e4; vertical-align: middle; padding: 12px; text-align: left;">Shipping:</th>
<td class="td" style="color: #737373; border: 1px solid #e4e4e4; vertical-align: middle; padding: 12px; text-align: left;">Free shipping</td>
</tr>
<tr>
<th class="td" scope="row" colspan="2" style="color: #737373; border: 1px solid #e4e4e4; vertical-align: middle; padding: 12px; text-align: left;">Total:</th>
<td class="td" style="color: #737373; border: 1px solid #e4e4e4; vertical-align: middle; padding: 12px; text-align: left;"><span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">$</span>0.00</span></td>
</tr>
</tfoot>
</table>
</div>

<table id="addresses" cellspacing="0" cellpadding="0" border="0" style="width: 100%; vertical-align: top; margin-bottom: 40px; padding: 0;"><tr>
<td valign="top" width="50%" style="padding: 0; text-align: left; font-family: 'Helvetica Neue', Helvetica, Roboto, Arial, sans-serif; border: 0;">
<h2 style='color: #557da1; display: block; font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; font-size: 18px; font-weight: bold; line-height: 130%; margin: 0 0 18px; text-align: left;'>Billing address</h2>

<address class="address" style="padding: 12px 12px 0; color: #737373; border: 1px solid #e4e4e4;">
Kosta Kondratenko<br>123 Fake Street<br>Sydney New South Wales 2000 <br>0415932797 <p style="margin: 0 0 16px;">kostakondratenko@gmail.com</p>
</address>
</td>
<td valign="top" width="50%" style="padding: 0; text-align: left; font-family: 'Helvetica Neue', Helvetica, Roboto, Arial, sans-serif;">
<h2 style='color: #557da1; display: block; font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; font-size: 18px; font-weight: bold; line-height: 130%; margin: 0 0 18px; text-align: left;'>Shipping address</h2>

<address class="address" style="padding: 12px 12px 0; color: #737373; border: 1px solid #e4e4e4;">Kosta Kondratenko<br>123 Fake Street<br>Sydney New South Wales 2000</address>
</td>
</tr></table>
</div>
</td>
</tr></table>
<!-- End Content -->
</td>
</tr></table>
<!-- End Body -->
</td>
</tr>
<tr>
<td align="center" valign="top">
<!-- Footer -->
<table id="Table_01" width="601" height="224" cellspacing="0" cellpadding="0" border="0">
<tr>
<td colspan="20">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_01.jpg" alt="" width="600" height="11" style="background-color: #FBD66E;">
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="1" height="11" style="background-color: #FBD66E;">
</td>
</tr>
<tr>
<td rowspan="9">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_02.jpg" alt="" width="32" height="212" style="background-color: #FBD66E;">
</td>
<td rowspan="3">
<a href="https://barebrush.com.au/about-bare/" style="color: black; font-weight: normal; text-decoration: underline;">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/about_barebrush.jpg" alt="" width="111" height="44" border="0" style="background-color: #FBD66E;"></a>
</td>
<td rowspan="9">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_04.jpg" alt="" width="28" height="212" style="background-color: #FBD66E;">
</td>
<td colspan="3">
<a href="https://barebrush.com.au/origins/" style="color: black; font-weight: normal; text-decoration: underline;">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_05.jpg" alt="" width="69" height="42" border="0" style="background-color: #FBD66E;"></a>
</td>
<td colspan="2" rowspan="4">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_06.jpg" alt="" width="26" height="83" style="background-color: #FBD66E;">
</td>
<td colspan="3">
<a href="https://barebrush.com.au/shop/" style="color: black; font-weight: normal; text-decoration: underline;">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_07.jpg" alt="" width="57" height="42" border="0" style="background-color: #FBD66E;"></a>
</td>
<td rowspan="4">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_08.jpg" alt="" width="23" height="83" style="background-color: #FBD66E;">
</td>
<td colspan="3" rowspan="2">
<a href="https://barebrush.com.au/faq/" style="color: black; font-weight: normal; text-decoration: underline;">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_09.jpg" alt="" width="45" height="43" border="0" style="background-color: #FBD66E;"></a>
</td>
<td rowspan="9">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_10.jpg" alt="" width="25" height="212" style="background-color: #FBD66E;">
</td>
<td>
<a href="https://barebrush.com.au/contact/" style="color: black; font-weight: normal; text-decoration: underline;">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_11.jpg" alt="" width="74" height="42" border="0" style="background-color: #FBD66E;"></a>
</td>
<td rowspan="9">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_12.jpg" alt="" width="29" height="212" style="background-color: #FBD66E;">
</td>
<td>
<a href="https://barebrush.com.au/category/blog/" style="color: black; font-weight: normal; text-decoration: underline;">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_13.jpg" alt="" width="52" height="42" border="0" style="background-color: #FBD66E;"></a>
</td>
<td rowspan="9">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_14.jpg" alt="" width="29" height="212" style="background-color: #FBD66E;">
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="1" height="42" style="background-color: #FBD66E;">
</td>
</tr>
<tr>
<td colspan="3" rowspan="3">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_15.jpg" alt="" width="69" height="41" style="background-color: #FBD66E;">
</td>
<td colspan="3" rowspan="3">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_16.jpg" alt="" width="57" height="41" style="background-color: #FBD66E;">
</td>
<td rowspan="8">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_17.jpg" alt="" width="74" height="170" style="background-color: #FBD66E;">
</td>
<td rowspan="8">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_18.jpg" alt="" width="52" height="170" style="background-color: #FBD66E;">
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="1" height="1" style="background-color: #FBD66E;">
</td>
</tr>
<tr>
<td colspan="3" rowspan="2">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_19.jpg" alt="" width="45" height="40" style="background-color: #FBD66E;">
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="1" height="1" style="background-color: #FBD66E;">
</td>
</tr>
<tr>
<td rowspan="6">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_20.jpg" alt="" width="111" height="168" style="background-color: #FBD66E;">
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="1" height="39" style="background-color: #FBD66E;">
</td>
</tr>
<tr>
<td colspan="2">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_21.jpg" alt="" width="58" height="65" style="background-color: #FBD66E;">
</td>
<td colspan="4">
<a href="https://www.instagram.com/bare.brush" style="color: black; font-weight: normal; text-decoration: underline;">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_22.jpg" alt="" width="66" height="65" border="0" style="background-color: #FBD66E;"></a>
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_23.jpg" alt="" width="11" height="65" style="background-color: #FBD66E;">
</td>
<td colspan="4">
<a href="https://www.facebook.com/barebrush.com.au/" style="color: black; font-weight: normal; text-decoration: underline;">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_24.jpg" alt="" width="66" height="65" border="0" style="background-color: #FBD66E;"></a>
</td>
<td rowspan="5">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_25.jpg" alt="" width="19" height="129" style="background-color: #FBD66E;">
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="1" height="65" style="background-color: #FBD66E;">
</td>
</tr>
<tr>
<td rowspan="4">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_26.jpg" alt="" width="57" height="64" style="background-color: #FBD66E;">
</td>
<td colspan="10">
<a href="https://barebrush.com.au/" style="color: black; font-weight: normal; text-decoration: underline;">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_27.jpg" alt="" width="144" height="22" border="0" style="background-color: #FBD66E;"></a>
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="1" height="22" style="background-color: #FBD66E;">
</td>
</tr>
<tr>
<td colspan="10">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_28.jpg" alt="" width="144" height="6" style="background-color: #FBD66E;">
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="1" height="6" style="background-color: #FBD66E;">
</td>
</tr>
<tr>
<td colspan="3" rowspan="2">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_29.jpg" alt="" width="17" height="36" style="background-color: #FBD66E;">
</td>
<td colspan="6">
<a href="mailto:help@barebrush.com.au" style="color: black; font-weight: normal; text-decoration: underline;">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_30.jpg" alt="" width="107" height="16" border="0" style="background-color: #FBD66E;"></a>
</td>
<td rowspan="2">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_31.jpg" alt="" width="20" height="36" style="background-color: #FBD66E;">
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="1" height="16" style="background-color: #FBD66E;">
</td>
</tr>
<tr>
<td colspan="6">
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/footer_32.jpg" alt="" width="107" height="20" style="background-color: #FBD66E;">
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="1" height="20" style="background-color: #FBD66E;">
</td>
</tr>
<tr>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="32" height="1" style="background-color: #FBD66E;">
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="111" height="1" style="background-color: #FBD66E;">
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="28" height="1" style="background-color: #FBD66E;">
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="57" height="1" style="background-color: #FBD66E;">
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="1" height="1" style="background-color: #FBD66E;">
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="11" height="1" style="background-color: #FBD66E;">
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="5" height="1" style="background-color: #FBD66E;">
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="21" height="1" style="background-color: #FBD66E;">
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="29" height="1" style="background-color: #FBD66E;">
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="11" height="1" style="background-color: #FBD66E;">
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="17" height="1" style="background-color: #FBD66E;">
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="23" height="1" style="background-color: #FBD66E;">
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="6" height="1" style="background-color: #FBD66E;">
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="20" height="1" style="background-color: #FBD66E;">
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="19" height="1" style="background-color: #FBD66E;">
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="25" height="1" style="background-color: #FBD66E;">
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="74" height="1" style="background-color: #FBD66E;">
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="29" height="1" style="background-color: #FBD66E;">
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="52" height="1" style="background-color: #FBD66E;">
</td>
<td>
<img src="http://staging1.barebrush.com.au/wp-content/uploads/email_img/spacer.gif" alt="" width="29" height="1" style="background-color: #FBD66E;">
</td>
<td></td>
</tr>
</table>
<!-- End Footer -->
</td>
</tr>
</table>
</td>
</tr></table>
</div>
</body>
</html>

If I send that as a test to myself the footer is broken in ALL clients - why?
https://cl.ly/c4b8113bd5f4/Image%2525202019-02-13%252520at%25252011.35.29%252520PM.png

Looks fine as stand alone:
https://cl.ly/3682551d1f21/Image%2525202019-02-13%252520at%25252011.37.52%252520PM.png

Best,
Kosta