<table width="656" align="center" border="0" cellspacing="0"
       cellpadding="0" style="{{ font_family }}{{ main_body_text }}margin:0 auto;{{ separator_top }}"
>
    
    {# Order items #}
    <tr>
        <td colspan="3" height="30"></td>
    </tr>
    
    <tr>
        <td colspan="3" width="100%" align="center">
            
            <table 
                    width="656" 
                    align="center" 
                    border="0" 
                    cellspacing="0"
                    cellpadding="0" 
                    style="{{ font_family }}{{ main_body_text }}margin:0 auto;{{ separator }}"
                >
    
                {% for line_item in items %}

                    <tr>
                        
                        {% if line_item.item_image is not empty %}
                            <td class="itemImage" align="left" width="72" height="60" colspan="1">
                                <img src="{{ line_item.item_image }}" alt="{{ line_item.name|striptags }}"
                                     style="{{ image_reset }}width:60px;height:auto;" width="60">
                            </td>
                        {% endif %}
    
                        <td align="left" colspan="{% if hide_pricing is not empty %}4{% else %}3{% endif %}">
                            <p style="{{ link_styles }}font-size:14px;{{ text_reset }}">
                                <strong>
                                    {{ line_item.name }}
                                </strong>
                            </p>
    
                            <p style="{{ small_body_text }}{{ text_reset }}">
                                <strong>

                                    {{ line_item.size.strength }} x {{ line_item.size.size }} Qty x 1
                                </strong>
                            </p>
                        </td>

                        <td align="right" colspan="1">
                            <p style="{{ text_reset }}">
                                <strong>
                                    {{ line_item.size.price|currency_format(2) }}
                                </strong>
                            </p>
                        </td>

                    </tr>
    
                    {% if not loop.last %}
                        
                        <tr>
                            <td height="20"></td>
                        </tr>
                        
                    {% endif %}
    
                {% endfor %}
    
                <tr>
                    <td height="30"></td>
                </tr>
                
            </table>
            
        </td>
        
    </tr>
    
</table>


<!-- New Basket Area -->
<table width="656" align="center" border="0" cellspacing="0"
       cellpadding="0" style="{{ font_family }}{{ main_body_text }}margin:0 auto;"
>

    <tr>
        <td colspan="2" height="30"></td>
    </tr>

    <tr>

        <td style="width:50%;vertical-align:top;" {% if hide_pricing is empty %}colspan="2"{% endif %}>

            {% if hide_delivery is empty %}
                <table width="100%" align="center" border="0" cellspacing="0"
                   cellpadding="0" style="{{ main_body_text }}margin:0 auto;"
            >

                <tr>
                    <td>
                        <p style="{{ text_reset }}">
                            Delivery Address:
                        </p>
                    </td>
                </tr>

                <tr>
                    <td height="10"></td>
                </tr>

                <tr>
                    <td>
                        <p style="{{ small_body_text }}line-height:19px;">
                            <strong>
                                {{ order.address.shipping.title ~ ' ' ~
                                order.address.shipping.firstname ~ ' ' ~
                                order.address.shipping.lastname }}
                            </strong>

                            <br />

                            {% if order.info['email'] is not empty %}
                                <a href="mailto:{{ order.info['email'] }}" style="{{ link_styles }}font-weight:bold;">{{ order.info['email'] }}</a>
                                <br />
                            {% endif %}

                            {{ order.address.shipping.address1 }}

                            <br />

                            {% if order.address.shipping.address2 is not empty %}
                                {{ order.address.shipping.address2 }}
                                <br />
                            {% endif %}

                            {% if state_list[order.address.shipping.country] is defined %}
                                {{ state_list[order.address.shipping.country][order.address.shipping.state] }}
                                <br />
                            {% endif %}

                            {{ countries[order.address.shipping.country] }}

                            <br />

                            {{ order.address.shipping.postcode }}
                        </p>
                    </td>
                </tr>

            </table>
            {% endif %}

        </td>

        {% if hide_pricing is empty %}
            <td style="width:50%;vertical-align:top;">
    
                <table width="100%" align="right" border="0" cellspacing="0"
                       cellpadding="0" style="{{ font_family }}{{ main_body_text }}"
                >
                    <tr>
                        <td>
                            <p style="{{ text_reset }}">
                                Subtotal
                            </p>
                        </td>
    
                        <td align="right">
                            <p style="{{ text_reset }}">
                                {{ order_subtotal|currency_format(2) }}
                            </p>
                        </td>
                    </tr>
    
                    <tr>
                        <td height="15"></td>
                    </tr>
    
                    {% if settings.COUPON_ENABLED and order.coupon_deduct is not empty %}
                        <tr>
                            <td>
                                <p style="{{ text_reset }}">
                                    Coupon Discount
                                </p>
                            </td>
    
                            <td align="right">
                                <p style="{{ text_reset }}">
                                    {{ order.coupon_deduct|currency_format(2) }}
                                </p>
                            </td>
                        </tr>
    
                        <tr>
                            <td height="15"></td>
                        </tr>
                    {% endif %}
    
                    <tr>
                        <td>
                            <p style="{{ text_reset }}">
                                Delivery
    
                                <br />
    
                                <span style="font-size:12px;">
                                                        {% if order.coupon_freedelivery %}
                                                            FREE
                                                        {% else %}
                                                            {{ delivery_name }}
                                                        {% endif %}
                                                    </span>
                            </p>
                        </td>
    
                        <td align="right">
                            <p style="{{ text_reset }}">
                                {% if delivery_cost > 0 %}
                                    {{ delivery_cost|currency_format(2) }}
                                {% else %}
                                    FREE
                                {% endif %}
                            </p>
                        </td>
                    </tr>
    
                    <tr>
                        <td height="15"></td>
                    </tr>
    
                    {% if settings.BASKET_SHOW_VAT %}
                        <tr>
                            <td>
                                <p style="{{ text_reset }}">
                                    VAT {% if order.type is not empty %} (inclusive) {% endif %} at
                                    {{ settings.VAT_RATE}}%
                                </p>
                            </td>
    
                            <td align="right">
                                <p style="{{ text_reset }}">
                                    {% if vat_cost > 0 %}
                                        {{ vat_cost|currency_format(2) }}
                                    {% else %}
                                        NO VAT
                                    {% endif %}
                                </p>
                            </td>
                        </tr>
    
                        <tr>
                            <td height="15"></td>
                        </tr>
                    {% endif %}
    
                    <tr>
                        <td style="{{ total_text }}">
                            <p style="{{ text_reset }}">
                                <strong>
                                    Total
                                </strong>
                            </p>
                        </td>
    
                        <td align="right" style="{{ total_text }}">
                            <p style="{{ text_reset }}">
                                <strong>
                                    {{ order_total|currency_format(2) }}
                                </strong>
                            </p>
                        </td>
                    </tr>
                </table>
            </td>
        {% endif %}
    </tr>

    <tr>
        <td colspan="2" height="30"></td>
    </tr>

</table>

<!-- Footer content -->
<table
        width="100%"
        align="center"
        border="0"
        cellspacing="0"
        bgcolor="{{ light_background_color }}"
        cellpadding="0"
        style="{{ font_family }}{{ small_body_text }}"
>
    <tr>
        <td height="30"></td>
    </tr>

    <tr>
        
        <td>
            
            <table width="656" align="center" border="0" cellspacing="0" style="margin:0 auto;">
                
                <tr>
                    
                    <td class="threeColumn" style="text-align: left;font-size: 0;">

                        <!--[if (gte mso 9)|(IE)]>
                        <table width="100%">
                            <tr>
                                <td width="326" valign="top">
                        <![endif]-->

                        <div class="column" style="width: 100%;max-width: 326px;display: inline-block;vertical-align: top;">
                            <table width="280" align="left" border="0" cellspacing="0"
                                   cellpadding="0" style="{{ font_family }}{{ main_body_text }}margin:0 auto;"
                            >
                                <tr>
                                    <td>
                                        <p style="{{ text_reset }}font-size:14px;font-weight:bold;">
                                            Delivery information
                                        </p>
                                    </td>
                                </tr>

                                <tr>
                                    <td height="12"></td>
                                </tr>

                                <tr>
                                    <td style="{{ small_body_text }}padding-right:15px;">
                                        <p style="{{ text_reset }}">
                                            For more information about delivery estimates please visit our
                                            <a href="{{ settings.SITE_URL }}/customer-care/delivery/" style="{{ link_styles }}"><strong>Delivery Information</strong></a> page.
                                        </p>
                                    </td>
                                </tr>
                            </table>
                        </div> <!-- .column -->

                        <!--[if (gte mso 9)|(IE)]>
                        </td>
                     
                        <![endif]-->
                        
                        <!--[if (gte mso 9)|(IE)]>
                        <td width="326" valign="top">
                        <![endif]-->

                        <div class="column" style="width: 100%;max-width: 326px;display: inline-block;vertical-align: top;">
                            <table width="280" align="left" border="0" cellspacing="0"
                                   cellpadding="0" style="{{ font_family }}{{ main_body_text }}margin:0 auto;"
                            >
                                <tr>
                                    <td>
                                        <p style="{{ text_reset }}font-size:14px;font-weight:bold;">
                                            Any Questions?
                                        </p>
                                    </td>
                                </tr>

                                <tr>
                                    <td height="12"></td>
                                </tr>

                                <tr>
                                    <td style="{{ small_body_text }}">
                                        <p style="{{ text_reset }}">
                                            If you have any questions, please
                                            <a href="{{ settings.SITE_URL }}/contact/"
                                               style="{{ link_styles }}"><strong>Contact Us</strong>
                                            </a> and we'll be happy to help!
                                        </p>
                                    </td>
                                </tr>

                                <tr>
                                    <td height="35"></td>
                                </tr>
                            </table>
                        </div> <!-- .column -->

                        <!--[if (gte mso 9)|(IE)]>
                                </td>
                            </tr>
                        </table>
                        <![endif]-->

                    </td>
                    
                </tr>
                
            </table>
            
        </td>
        
    </tr>
    
</table>

