{{ block title }}
{{ endblock }}
{{ block content }}
{{ include C.Instructions_PartII}} 
<link rel="stylesheet" href="{{static 'css/css.css'}}">
<link rel="stylesheet" href="{{static 'css/modal.css'}}">
<script type="text/javascript" src="{{ static 'js/Script_modal.js' }}"></script>
<script type="text/javascript" src="{{ static 'js/data_quality.js' }}"></script>

{% for field in form %}
    {% if field.name not in hidden_fields %}
        {{ formfield field.name }}
    {% endif %}
{% endfor %}

<div style="display:none">
    {% for field in form %}
        {% if field.name in hidden_fields %}
            {{ formfield field.name }}
        {% endif %}
    {% endfor %}
</div>

<div class="buttons-container">
    <a id="myBtn" onclick="open_modal(2)"  class="otree-btn-next btn btn-primary">Exit survey (return task)</a>
    <a id="myBtn" onclick="open_modal(1)"  class="otree-btn-next btn btn-primary">Instructions</a>
    <button id="NextButton" class="otree-btn-next btn btn-primary">Next</button>
</div>


<div id="myModal2" class="modal quit-modal">
  <div class="modal-content">
      <div class="modal-header">
        <h2>You are about to quit the study</h2>
      </div>
    <p style="padding: 2px">
 {{include C.Quit_study_text_path}}
    </p>
    <div class="buttons-container">
        <a id="myBtn" onclick="span_click(2)"  class="otree-btn-next btn btn-primary">Cancel</a>
        <a href="{{C.Return_redirect}}" class="otree-btn-next btn btn-primary">OK</a>
  </div>
  </div>
</div>

<div id="myModal1" class="modal">
  <div class="modal-content">
      <div class="modal-header">
        <h2>Instructions</h2>
        <span class="close" onclick="span_click(1)">&times;</span>
      </div>
    <p style="padding: 0px">
   {{include C.Instructions_PartII}}
    </p>
  </div>
</div>

<br><br>
<div style="display: none;">
    {{formfields}}
</div>

{{ endblock }}