HTML email - webfonts - editor moves style code to bottom - html

Question

I am adding webfonts to an email template - I add the webfont from google fonts in the head.
The email html editor I paste the code into - takes the style details and moves them to the end of the email - in turn does not use the web font
any solutions?
here is the code -
note - I have used a few different combinations - including the
<style>
#import url('https://fonts.googleapis.com/css?family=Cabin');
</style>
<table style="background-color: rgb(230, 230, 230);" border="0" cellpadding="0" cellspacing="0" align="center" width="100%" bgcolor="#e6e6e6" class="table_full editable-bg-color bg_color_e6e6e6 editable-bg-image">
<tbody>
<tr>
<td height="10">
<tr>
<td>
<table style="margin: 0px auto; background-color: rgb(112, 174, 76);" cellpadding="0" cellspacing="0" border="0" align="center" width="600" bgcolor="#303f9f" class="table1 editable-bg-color bg_color_303f9f">
<tbody>
<tr>
<td height="10"></td>
</tr>
<tr>
<td>
<table style="margin: 0 auto;" cellpadding="0" cellspacing="0" border="0" align="center" width="520" class="table1">
<tbody>
<tr>
</tr>
<tr>
<td style="color: #ffffff; font-size: 30px; font-weight: 700; font-family: 'Cabin', sans-serif;; mso-line-height-rule: exactly;" class="text_color_ffffff" align="center">
<div class="editable-text"><span style="font-family: 'Cabin', sans-serif;"><span style="color:#102743">TITLE</span></span>
</div>
</td>
</tr>
<tr>
<td height="10"></td>
</tr>
<tr>
<td style="color: #ffffff; font-size: 24px; font-weight: 300; font-family: 'Cabin', sans-serif;; mso-line-height-rule: exactly;" class="text_color_ffffff" align="center">
<div class="editable-text"><span style="font-family: 'Cabin', sans-serif;"><span style="color:#102743">SUB HEAD</span></span>
</div>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td height="20"></td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td>
<table style="margin: 0 auto;" cellpadding="0" cellspacing="0" border="0" align="center" width="600" bgcolor="#ffffff" class="table1 editable-bg-color bg_color_ffffff">
<tbody>
<tr>
<td height="10"></td>
</tr>
<tr>
<td>
<table style="margin: 0 auto;" cellpadding="0" cellspacing="0" border="0" align="center" width="520" class="table1">
<tbody>
<tr>
<td height="10"></td>
</tr>
<tr>
<td style="color: #102743; font-size: 14px;line-height: 1.5; font-weight: 500; font-family: 'Cabin', sans-serif;; mso-line-height-rule: exactly;" class="center_content text_color_102743" align="left">
<div style="line-height: 1.5;" class="editable-text"><span style="font-family: 'Cabin', sans-serif;">body</span></div>
</td>
</tr>
<tr>
<td height="10"></td>
</tr>
<tr>
<td style="color: rgb(112, 174, 76); font-size: 14px; font-weight: 700; font-family: 'Cabin', sans-serif;;" class="text_color_282828" align="center">
<div class="editable-text">Interview Date & Time</div>
</td>
</tr>
<tr>
<td height="10"></td>
</tr>
<tr>
<td style="color: rgb(16, 39, 67); font-size: 18px; font-weight: 700; font-family: 'Cabin', sans-serif;;" class="text_color_282828" align="center">
<div class="editable-text">TEXT</div>
</td>
</tr>
<tr>
<td height="10"></td>
</tr>
</tbody>
<tbody>
<tr>
<td height="10"></td>
</tr>
</tbody>
<tbody>
<tr></tr>
<tr>
<td style="color: rgb(112, 174, 76); font-size: 14px; font-weight: 700; font-family: 'Cabin', sans-serif;;" class="text_color_282828" align="center">
<div class="editable-text">text</div>
</td>
</tr>