<table bgcolor="{{header.backgroundColor.val}}" style="width: 100%; background-color: {{header.backgroundColor.val}}; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-position: top center; background-repeat: no-repeat; " background="{{header.backgroundImage.val}}" width="100%" cellspacing='0' cellpadding='0' border='0'>
    <tbody>
        <tr>
            <td>
                <table class="full" style="width: 470px; margin: 0px auto; padding: 0px; font-family: 'Open Sans', sans-serif; " align="center" width="470" cellspacing='0' cellpadding='0' border='0'>
                    <tbody>
                        <tr>
                            <td colspan="3" width="470" align="center"></td>
                        </tr>
                        <tr>
                            <td height='42'></td>
                        </tr>
                        <tr>
                            <td width='13' rowspan='10'></td>
                            <td align="center">
                                <a href="{{header.logoUrl.val}}"> <img src='{{header.logo.val}}' alt='Order Mail logo' /></a>   
                            </td>
                            <td width='13' rowspan='10'></td>
                        </tr>
                        <tr>
                            <td height='45'></td>
                        </tr>
                        <tr>
                            <td align="center">
                                <?php if ($this->_preview) { ?>
                                    <div ng-bind-html="header.headerText.val | trusted"></div>
                                <?php } else { ?>
                                    {{header.headerText.val}}
                                <?php } ?> 
                            </td>
                        </tr>
                        <tr>
                            <td height='40'></td>
                        </tr>
                        <tr>
                            <td>
                                <table align="center" style="margin: 0 auto; border: 1px solid #ffffff; " cellspacing='0' cellpadding='0' border="0" background="0">
                                    <tbody>
                                        <tr>
                                            <td height='10' colspan='3'></td>
                                        </tr>
                                        <tr>
                                            <td width='30'></td>
                                            <td align="center" style="color: #ffffff; font-size: 15px; ">
                                                <a style="color: #ffffff; font-size: 15px; text-decoration: none;display: block;" href="{{header.buttonUrl.val}}">{{header.buttonText.val}}</a>
                                            </td>
                                            <td width='30'></td>
                                        </tr>
                                        <tr>
                                            <td height='10' colspan='3'></td>
                                        </tr>
                                    </tbody>
                                </table>
                            </td>
                        </tr>
                        <tr>
                            <td height='70'></td>
                        </tr>
                    </tbody>
                </table>
            </td>
        </tr>
    </tbody>
</table>

<table width="100%" bgcolor="{{appearance.backgroundColor.val}}" style="background: {{appearance.backgroundColor.val}}; width: 100%; " cellspacing='0' cellpadding='0' border='0'>
    <tbody>
        <tr>
            <td>
                <table class="full" style="width: 470px; margin: 0px auto; padding: 0px; font-family: 'Open Sans', sans-serif; " align="center" width="470" cellspacing='0' cellpadding='0' border='0'>
                    <tbody>
                        <tr>
                            <td height='40'></td>
                        </tr>
                        <tr>
                            <td colspan="3" width="470" align="center"></td>
                        </tr>
                        <tr>
                            <td width='10' rowspan='10'></td>
                            <td align="left" style="color: #3a3a3a; font-family: Helvetica, sans-serif; font-weight: 900; font-size: 20px; ">
                                Thank you for your Order! </td>
                            <td width='10' rowspan='10'></td>
                        </tr>
                        <tr>
                            <td height='30'></td>
                        </tr>
                    <td align="left">
                        <?php if ($this->_preview) { ?>
                            <div ng-bind-html="body.orderContent.val | trusted"></div>
                        <?php } else { ?>
                            {{body.orderContent.val}}
                        <?php } ?> 
                    </td>
                    <tr>
                        <td height='40'></td>
                    </tr>
    </tbody>
</table>
</td>
</tr>
</tbody>
</table>

<table width="100%" bgcolor="#f3f3f3" style="background: #f3f3f3; width: 100%; " cellspacing='0' cellpadding='0' border='0'>
    <tbody>
        <tr>
            <td>
                <table class="full" style="width: 470px; margin: 0px auto; padding: 0px; font-family: 'Open Sans', sans-serif; " align="center" width="470" cellspacing='0' cellpadding='0' border='0'>
                    <tbody>
                        <tr>
                            <td height='8'></td>
                        </tr>
                        <tr>
                            <td colspan="3" width="470" align="center"></td>
                        </tr>
                        <tr>
                            <td width='10'></td>
                            <td align="left">
                                <p style="margin: 0; font-size: 14px; font-weight: bold; font-family: Helvetica, sans-serif; color: #2f2f2f; ">
                                    Your order number is: <b style="color: #e66161;font-family: Helvetica, sans-serif;">18720001</b> </p>
                            </td>
                            <td width='10'></td>
                        </tr>
                        <tr>
                            <td height='8'></td>
                        </tr>
                    </tbody>
                </table>
            </td>
        </tr>
    </tbody>
</table>

<table width="100%" bgcolor="{{appearance.backgroundColor.val}}" style="background: {{appearance.backgroundColor.val}}; width: 100%; " cellspacing='0' cellpadding='0' border='0'>
    <tbody>
        <tr>
            <td>
                <table class="full" style="width: 470px; margin: 0px auto; padding: 0px; font-family: 'Open Sans', sans-serif; " align="center" width="470" cellspacing='0' cellpadding='0' border='0'>
                    <tbody>
                        <tr>
                            <td height='37'></td>
                        </tr>
                        <tr>
                            <td colspan="5" width="470" align="center"></td>
                        </tr>
                        <tr>
                            <td width='10'></td>
                            <td align="left" style="font-weight: bold; font-family: 'Helvetica', sans-serif; font-size: 12px; ">
                                ITEMS </td>
                            <td align="center" style="font-weight: bold; font-family: 'Helvetica', sans-serif; font-size: 12px; ">
                                QTY </td>
                            <td align="center" style="font-weight: bold; font-family: 'Helvetica', sans-serif; font-size: 12px; ">
                                PRICE </td>
                        </tr>
                        <tr>
                            <td height='10'></td>
                        </tr>
                        <tr>
                            <td colspan="5" height="1" bgcolor="#f3f3f3" style="background: #f3f3f3; "></td>
                        </tr>
                        
                        <?php do_action('ma_items_loop', $this->_order, $this->_email, '' ,
                                "<tr ng-repeat-satrt='item in products'><td height='10'></td></tr>", 
                                '<tr ng-repeat-end><td colspan="5" height="1" bgcolor="#f3f3f3" style="background: #f3f3f3; "></td></tr>'); ?>
                        
                        
                        <tr>
                            <td height='10'></td>
                        </tr>
                        <tr>
                            <td height='15'></td>
                        </tr>
                        <tr>
                            <td width='10'></td>
                            <td colspan="3" align="right">
                                <p style="font-weight: bold; font-size: 14px; margin: 0; font-family: Helvetica,sans-serif;">
                                    Total: <b style="color: #e66161;font-family: Helvetica,sans-serif;">$1987.-</b> </p>
                            </td>
                        </tr>
                        <tr>
                            <td height='40'></td>
                        </tr>
                    </tbody>
                </table>
            </td>
        </tr>
    </tbody>
</table>

<table bgcolor="{{appearance.backgroundColor.val}}" style="background: {{appearance.backgroundColor.val}}; width: 100%; " width="100%" cellspacing='0' cellpadding='0' border='0'>
    <tbody>
        <tr>
            <td class="full" width="50%" style="width: 50%; " valign="top">
                <table bgcolor="{{appearance.backgroundColor.val}}" style="background: {{appearance.backgroundColor.val}}; width: 100%; " width="100%" cellspacing='0' cellpadding='0' border='0'>
                    <tbody>
                        <tr>
                            <td width="2000"></td>
                        </tr>
                        <tr>
                            <td height='10' bgcolor='#f3f3f3' style='background: #f3f3f3;'></td>
                        </tr>
                        <tr>
                            <td class="liquid-center" align="right" bgcolor="#f3f3f3" width="100%" style="background: #f3f3f3;font-family: Helvetica, sans-serif; color: #2f2f2f; font-weight: 700; ">Shipping Information:</td>
                        </tr>
                        <tr>
                            <td height='10' colspan='3' bgcolor='#f3f3f3' style='background: #f3f3f3;'></td>
                        </tr>
                        <tr>
                            <td height='15'></td>
                        </tr>
                        <tr>
                            <td align="right" height="28" class="liquid-center" style="font-family: Helvetica, sans-serif; color: #b0b0b0; font-size: 14px; ">At. Sr. Hiro Gordo-Globo</td>
                        </tr>
                        <tr>
                            <td align="right" height="28" class="liquid-center" style="font-family: Helvetica, sans-serif; color: #b0b0b0; font-size: 14px; ">Sumo Informatica S.A.</td>
                        </tr>
                        <tr>
                            <td align="right" height="28" class="liquid-center" style="font-family: Helvetica, sans-serif; color: #b0b0b0; font-size: 14px; ">Calle 39 No 1540</td>
                        </tr>
                        <tr>
                            <td align="right" height="28" class="liquid-center" style="font-family: Helvetica, sans-serif; color: #b0b0b0; font-size: 14px; ">B1000TBU San Sebastian</td>
                        </tr>
                        <tr>
                            <td align="right" height="28" class="liquid-center" style="font-family: Helvetica, sans-serif; color: #b0b0b0; font-size: 14px; ">ARGENTINA</td>
                        </tr>
                        <tr>
                            <td height='30'></td>
                        </tr>
                    </tbody>
                </table>
            </td>
            <td class="full" width="50%" style="width: 50%; " valign="top">
                <table bgcolor="{{appearance.backgroundColor.val}}" style="background: {{appearance.backgroundColor.val}}; width: 100%; " width="100%" cellspacing='0' cellpadding='0' border='0'>
                    <tbody>
                        <tr>
                            <td height='10' colspan='3' bgcolor='#f3f3f3' style='background: #f3f3f3;'></td>
                        </tr>
                        <tr>
                            <td class="erase" width="20" bgcolor="#f3f3f3" style="background: #f3f3f3; "></td>
                            <td class="liquid-center" align="left" bgcolor="#f3f3f3" style="background: #f3f3f3; font-family: Helvetica, sans-serif; color: #2f2f2f; font-weight: 700; ">
                                Ship To: </td>
                        </tr>
                        <tr>
                            <td height='10' colspan='3' bgcolor='#f3f3f3' style='background: #f3f3f3;'></td>
                        </tr>
                        <tr>
                            <td height='15' colspan='3' bgcolor='{{appearance.backgroundColor.val}}' style='background: {{appearance.backgroundColor.val}};'></td>
                        </tr>
                        <tr>
                            <td width="20" class="erase" rowspan="10" bgcolor="{{appearance.backgroundColor.val}}" style="background: {{appearance.backgroundColor.val}}; "></td>
                            <td></td>
                        </tr>
                        <tr>
                            <td height="28" class="liquid-center" style="font-family: Helvetica, sans-serif; color: #b0b0b0; font-size: 14px; ">
                                At. Sr. Hiro Gordo-Globo </td>
                        </tr>
                        <tr>
                            <td height="28" class="liquid-center" style="font-family: Helvetica, sans-serif; color: #b0b0b0; font-size: 14px; ">
                                Sumo Informatica S.A. </td>
                        </tr>
                        <tr>
                            <td height="28" class="liquid-center" style="font-family: Helvetica, sans-serif; color: #b0b0b0; font-size: 14px; ">
                                Calle 39 No 1540 </td>
                        </tr>
                        <tr>
                            <td height="28" class="liquid-center" style="font-family: Helvetica, sans-serif; color: #b0b0b0; font-size: 14px; ">
                                B1000TBU San Sebastian </td>
                        </tr>
                        <tr>
                            <td height="28" class="liquid-center" style="font-family: Helvetica, sans-serif; color: #b0b0b0; font-size: 14px; ">
                                ARGENTINA </td>
                        </tr>
                        <tr>
                            <td height='30'></td>
                        </tr>
                    </tbody>
                </table>
            </td>
        </tr>
    </tbody>
</table>

<table width="100%" bgcolor="{{footer.backgroundColor.val}}" style="background: {{footer.backgroundColor.val}}; width: 100%; " cellspacing='0' cellpadding='0' border='0'>
    <tbody>
        <tr>
            <td>
                <table class="full" width="470" align="center" style="width: 470px; margin: 0px auto; padding: 0px; font-family: 'Open Sans', sans-serif; " cellspacing='0' cellpadding='0' border='0'>
                    <tbody>
                        <tr>
                            <td height='30'></td>
                        </tr>
                        <tr>
                            <td colspan="4" width="470" align="center"></td>
                        </tr>
                        <tr>
                            <td width='10'></td>
                            <td align="left" class="full liquid-center" style="color: #b0b0b0; font-family:Helvetica, sans-serif; font-size: 12px; ">
                                <?php if ($this->_preview) { ?>
                                    <div ng-bind-html="footer.copyrightText.val | trusted"></div>
                                <?php } else { ?>
                                    {{footer.copyrightText.val}}
                                <?php } ?> 
                            </td>
                            <td width='10'></td>
                        </tr>
                        <tr>
                            <td height='30'></td>
                        </tr>
                    </tbody>
                </table>
            </td>
        </tr>
    </tbody>
</table>