Footer Sign Up Delorean {% include 'components/big-quiz-2019/footer-sign-up~delorean' %}
#
HTML 
<section class="bq19-footer-signup bq19-section">
    <div class="bq19-inner">
            <div class="bq19-footer-signup__content">
            <h2 class="bq19-footer-signup__heading bq19-h2 bq19-color-turquoise">hundreds of churches. thousands of people. ONE BIG QUIZ.</h2>
            <a class="button bq19-button" href="#">Sign up to host</a>
        </div>
        
        <img alt="" class="bq19-footer-signup__mandella" src="/images/mainsite5/big-quiz-2019/mandela.gif" srcset="/images/mainsite5/big-quiz-2019/mandela.gif 1x, /images/mainsite5/big-quiz-2019/mandela@2x.gif 2x">
        <img alt="" class="bq19-footer-signup__car " srcset="/images/mainsite5/big-quiz-2019/nearest-quiz/DeLorean@2x.png 1x, /images/mainsite5/big-quiz-2019/nearest-quiz/DeLorean@2x.png 2x">
    
         </div>

    <picture>
        <source media="(min-width: 48em)" srcset="/images/mainsite5/big-quiz-2019/one-big-quiz-background.jpg 1x, /images/mainsite5/big-quiz-2019/one-big-quiz-background@2x.jpg 2x">
        <source srcset="/images/mainsite5/big-quiz-2019/one-big-quiz-background-mobile.jpg 1x, /images/mainsite5/big-quiz-2019/one-big-quiz-background-mobile@2x.jpg 2x">
        <img alt="" class="bq19-footer-signup__background-image bq19-object-fit-image" src="/images/mainsite5/big-quiz-2019/one-big-quiz-background.jpg">
    </picture>
</section>
Twig 
<section class="bq19-footer-signup bq19-section">
    <div class="bq19-inner">
    {% if footer_signup is defined %}
        <div class="bq19-footer-signup__content">
            <h2 class="bq19-footer-signup__heading bq19-h2 bq19-color-turquoise">hundreds of churches. thousands of people. ONE BIG QUIZ.</h2>
            <a class="button bq19-button" href="#">Sign up to host</a>
        </div>
        
        <img alt="" class="bq19-footer-signup__mandella" src="/images/mainsite5/big-quiz-2019/mandela.gif" srcset="/images/mainsite5/big-quiz-2019/mandela.gif 1x, /images/mainsite5/big-quiz-2019/mandela@2x.gif 2x">
        <img alt="" class="bq19-footer-signup__car {{ footer_signup.car_modifier }}" srcset="{{ footer_signup.car_image_src }} 1x, {{ footer_signup.car_image_src }} 2x">
    
     {% else %}
         <div class="bq19-footer-signup__content">
            <h2 class="bq19-footer-signup__heading bq19-h2 bq19-color-turquoise">hundreds of churches. thousands of people. ONE BIG QUIZ.</h2>
            <a class="button bq19-button" href="#">Sign up to host</a>
        </div>
        
        <img alt="" class="bq19-footer-signup__mandella" src="/images/mainsite5/big-quiz-2019/mandela.gif" srcset="/images/mainsite5/big-quiz-2019/mandela.gif 1x, /images/mainsite5/big-quiz-2019/mandela@2x.gif 2x">
        <img alt="" class="bq19-footer-signup__car" src="/images/mainsite5/big-quiz-2019/robin-reliant@2x.png" srcset="/images/mainsite5/big-quiz-2019/robin-reliant@2x.png 1x, /images/mainsite5/big-quiz-2019/robin-reliant@2x.png 2x">
     {% endif %}
    </div>

    <picture>
        <source media="(min-width: 48em)" srcset="/images/mainsite5/big-quiz-2019/one-big-quiz-background.jpg 1x, /images/mainsite5/big-quiz-2019/one-big-quiz-background@2x.jpg 2x">
        <source srcset="/images/mainsite5/big-quiz-2019/one-big-quiz-background-mobile.jpg 1x, /images/mainsite5/big-quiz-2019/one-big-quiz-background-mobile@2x.jpg 2x">
        <img alt="" class="bq19-footer-signup__background-image bq19-object-fit-image" src="/images/mainsite5/big-quiz-2019/one-big-quiz-background.jpg">
    </picture>
</section>

{
    "footer_signup": {
        "car_image_src": "\/images\/mainsite5\/big-quiz-2019\/nearest-quiz\/DeLorean@2x.png"
    }
}