<section class="bq19-text-w-image bq19-section bq19-section--large
             bq19-section--white  
                        ">

        <div class="bq19-inner">
                            <h2 class="bq19-text-w-image__main-header bq19-h2 bq19-align-center bq19-color-green">Main header</h2>
            
            <div class="bq19-text-w-image__content">
                <div class="bq19-text-w-image__text">
                                            <div class="bq19-rich-text">
                                                                                                <h3 class="bq19-h4">
                                                                                    <span class="bq19-text-w-image__preheading">Step 1</span>
                                        
                                                                            </h3>
                                                            

                                                            <p>Get together with your friends, family and church for an epic evening of poverty-fighting fun - last year’s Big Quiz Night was a huge</p>
                            
                                                    </div>
                                            <div class="bq19-rich-text">
                                                                                                <h3 class="bq19-h4">
                                                                                    <span class="bq19-text-w-image__preheading">Step 2</span>
                                        
                                                                            </h3>
                                                            

                                                            <p>Get together with your friends, family and church for an epic evening of poverty-fighting fun - last year’s Big Quiz Night was a huge</p>
                            
                                                    </div>
                                    </div>
                <div class="bq19-text-w-image__image">
                                            <img alt="" src="http://placehold.it/468x453">
                                    </div>
            </div>
        </div>
    </section>

{% for text_with_image in text_with_images %}
    <section class="bq19-text-w-image bq19-section bq19-section--large
            {% if text_with_image.background_color %}bq19-section--{{ text_with_image.background_color }} {% else %} bq19-section--white {% endif %} 
            {% if text_with_image.reverse %}bq19-text-w-image--reverse{% endif %}
            {% if text_with_image.align_top %}bq19-text-w-image--align-top{% endif %}">

        <div class="bq19-inner">
            {% if (text_with_image_header) and (loop.index == 1) %}
                <h2 class="bq19-text-w-image__main-header bq19-h2 bq19-align-center bq19-color-green">{{text_with_image_header}}</h2>
            {% endif %}

            <div class="bq19-text-w-image__content">
                <div class="bq19-text-w-image__text">
                    {% for section in text_with_image.content_sections %}
                        <div class="bq19-rich-text">
                            {% if text_with_image_header %}
                                {% if (section.heading) or (section.preheading) %}
                                    <h3 class="{% if text_with_image.small_headings %}bq19-h4{% else %}bq19-h2{% endif %}">
                                        {% if section.preheading %}
                                            <span class="bq19-text-w-image__preheading">{{section.preheading}}</span>
                                        {% endif %}

                                        {% if section.heading %}
                                            {{section.heading | raw}}
                                        {% endif %}
                                    </h3>
                                {% endif %}
                            {% else %}
                                {% if (section.heading) or (section.preheading) %}
                                    <h2 class="{% if text_with_image.small_headings %}bq19-h3{% else %}bq19-h2{% endif %}">
                                        {% if section.preheading %}
                                            <span class="bq19-text-w-image__preheading">{{section.preheading}}</span>
                                        {% endif %}

                                        {% if section.heading %}
                                            {{section.heading | raw}}
                                        {% endif %}
                                    </h2>
                                {% endif %}
                            {% endif %}


                            {% if section.text %}
                                {{section.text | raw}}
                            {% else %}
                                <p>Get together with your friends, family and church for an epic evening of poverty-fighting fun - last year’s Big Quiz Night was a huge success with <strong>500 churches</strong> and <strong>23,000 people</strong> taking part.</p>

                                <p>On Saturday 16 November, churches and other groups up and down the country will once again take part in the Big Quiz Night - a huge multi-venue, nationwide quiz - and we want it to be even bigger and better.</p>
                            {% endif %}

                            {% if section.button_text %}
                            <a class="button bq19-button" href="#">{{ section.button_text }}</a>
                            {% if section.button_icon_src %}
                                <img alt="{{ section.button_text }}" src="{{ section.button_icon_src }}">
                            {% endif %}
                            {{ section.button_text }}</a>
                            {% endif %}
                        </div>
                    {% endfor %}
                </div>
                <div class="bq19-text-w-image__image">
                    {% if text_with_image.img_src_retina %}
                        <img srcset="{{ text_with_image.img_src }} 1x, {{ text_with_image.img_src_retina }} 2x"
                            src="{{ text_with_image.img_src }}"
                            alt="" />
                    {% else %}
                        <img alt="" src="{{ text_with_image.img_src }}">
                    {% endif %}
                </div>
            </div>
        </div>
    </section>
{% endfor %}