{% load otree static %}

{% block content %}
<p>
    <b><u>Raven IQ-test:</u></b>
</p>
<p>
Please choose an answer by selecting one of the options.
</p>
<p>
    <div style="text-align:center">
        {% load static %}
        <img src="{% static 'images/Raven1.jpg' %}" alt="" width="400" height="380"/>
        {% formfield player.answer_IQ_1 label="Please select the element that completes the pattern:"%}
    </div>

    <div style="text-align:center">
        {% load static %}
        <img src="{% static 'images/Raven2.jpg' %}" alt="" width="400" height="380"/>
        {% formfield player.answer_IQ_2 label="Please select the element that completes the pattern:"%}
    </div>

    <div style="text-align:center">
        {% load static %}
        <img src="{% static 'images/Raven3.jpg' %}" alt="" width="400" height="380"/>
        {% formfield player.answer_IQ_3 label="Please select the element that completes the pattern:"%}
    </div>

    <div style="text-align:center">
        {% load static %}
        <img src="{% static 'images/Raven4.jpg' %}" alt="" width="400" height="380"/>
        {% formfield player.answer_IQ_4 label="Please select the element that completes the pattern:"%}
    </div>

    <div style="text-align:center">
        {% load static %}
        <img src="{% static 'images/Raven5.jpg' %}" alt="" width="400" height="380"/>
        {% formfield player.answer_IQ_5 label="Please select the element that completes the pattern:"%}
    </div>

    <div style="text-align:center">
        {% load static %}
        <img src="{% static 'images/Raven6.jpg' %}" alt="" width="400" height="380"/>
        {% formfield player.answer_IQ_6 label="Please select the element that completes the pattern:"%}
    </div>

       <div style="text-align:center">
        {% load static %}
        <img src="{% static 'images/Raven7.jpg' %}" alt="" width="400" height="380"/>
        {% formfield player.answer_IQ_7 label="Please select the element that completes the pattern:"%}
    </div>

    <div style="text-align:center">
        {% load static %}
        <img src="{% static 'images/Raven8.jpg' %}" alt="" width="400" height="380"/>
        {% formfield player.answer_IQ_8 label="Please select the element that completes the pattern:"%}
    </div>

    <div style="text-align:center">
        {% load static %}
        <img src="{% static 'images/Raven9.jpg' %}" alt="" width="400" height="380"/>
        {% formfield player.answer_IQ_9 label="Please select the element that completes the pattern:"%}
    </div>

    <div style="text-align:center">
        {% load static %}
        <img src="{% static 'images/Raven10.jpg' %}" alt="" width="400" height="380"/>
        {% formfield player.answer_IQ_10 label="Please select the element that completes the pattern:"%}
    </div>

    <br>

        {% next_button %}

    <br>

<br>
{% endblock %}