<div class="formInline detailsOverview">

    <div class="checkoutSectionWrap">

        <div class="overviewHeader">
            <h5>Contact Details</h5>
        </div>

        <div class="overviewContent">

            <div class="row">
                <label>Name</label>
                <div class="fakeInput">
                    {{ shop.basket.address.billing.firstname|capitalize }}
                    {{ shop.basket.address.billing.lastname|capitalize }}
                </div>
            </div>

            <div class="row">
                <label>Email</label>
                <div class="fakeInput">
                    {{ shop.basket.info.email }}
                </div>
            </div>

            <div class="row">
                <label>Phone number</label>
                <div class="fakeInput">
                    {{ shop.basket.info.contact_no }}
                </div>
            </div>

        </div> <!-- .overviewContent -->

    </div> <!-- .checkoutSectionWrap -->

    <div class="checkoutSectionWrap">

        <div class="overviewHeader">
            <h5>Billing Details</h5>
        </div>

        <div class="overviewContent">

            <div class="row">
                <label>Address Line 1</label>
                <div class="fakeInput">
                    {{ shop.basket.address.billing.address1|capitalize }}
                </div>
            </div>

            {% if shop.basket.address.billing.address2 is not empty %}
                <div class="row">
                    <label>Address Line 2</label>
                    <div class="fakeInput">
                        {{ shop.basket.address.billing.address2|capitalize }}
                    </div>
                </div>
            {% endif %}

            <div class="row">
                <label>City</label>
                <div class="fakeInput">
                    {{ shop.basket.address.billing.city|capitalize }}
                </div>
            </div>

            <div class="row">
                <label>Postcode</label>
                <div class="fakeInput">
                    {{ shop.basket.address.billing.postcode|upper }}
                </div>
            </div>

            <div class="row">
                <label>Country</label>
                <div class="fakeInput">
                    {{ billing_country|capitalize }}
                </div>
            </div>


            {% if billing_state is not null %}
                <div class="row">
                    <label>State</label>
                    <div class="fakeInput">
                        {{ billing_state|capitalize }}
                    </div>
                </div>
            {% endif %}

        </div>

    </div> <!-- .checkoutSectionWrap -->

        <div class="checkoutSectionWrap">

            <div class="overviewHeader">
                <h5>Delivery Details</h5>
            </div>

            <div class="overviewContent">

                <div class="row">
                    <label>Name</label>
                    <div class="fakeInput">
                        {{ shop.basket.address.shipping.firstname|capitalize }}
                        {{ shop.basket.address.shipping.lastname|capitalize }}
                    </div>
                </div>

                <div class="row">
                    <label>Address Line 1</label>
                    <div class="fakeInput">
                        {{ shop.basket.address.shipping.address1|capitalize }}
                    </div>
                </div>

                {% if shop.basket.address.shipping.address2 is not empty %}
                    <div class="row">
                        <label>Address Line 2</label>
                        <div class="fakeInput">
                            {{ shop.basket.address.shipping.address2|capitalize }}
                        </div>
                    </div>
                {% endif %}

                <div class="row">
                    <label class="city" for="ship-city">City</label>
                    <div class="fakeInput">
                        {{ shop.basket.address.shipping.city|capitalize }}
                    </div>
                </div>

                <div class="row">
                    <label class="postcode" for="shippostcode">Postcode</label>
                    <div class="fakeInput">
                        {{ shop.basket.address.shipping.postcode|upper }}
                    </div>
                </div>

                <div class="row">
                    <label class="country" for="ship-country">Country</label>
                    <div class="fakeInput">
                        {{ shipping_country|capitalize }}
                    </div>
                </div>

                {% if shipping_state is not null %}
                    <div class="row">
                        <label>State</label>
                        <div class="fakeInput">
                            {{ shipping_state|capitalize }}
                        </div>
                    </div>
                {% endif %}

            </div>

        </div> <!-- .checkoutSectionWrap -->

    {% if shop.basket.info.message !='' %}
        <div class="checkoutSectionWrap">

            <div class="row">
                <label>Notes</label>
                <div class="fakeInput">
                    {{ shop.basket.info.message }}
                </div>
            </div>

        </div> <!-- .checkoutSectionWrap -->
    {% endif %}

</div> <!-- .detailsOverview -->
