{% extends "global/Page.html" %}
{% load otree static %}


{% block content %}
<link rel="stylesheet" href="{% static 'global/instructions.css' %}"/>

<div id="instructionModal" class="modal fade" role="dialog">
  <div class="modal-dialog modal-lg">

    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
      	<h2> Instructions <h2>
        <button type="button" class="close" data-dismiss="modal">&times;</button>
      </div>
      <div class="modal-body">
        <h4> <b>INTERGROUP COMPETITION</b></h4>
        <ul>
        <li>
        If you (or anyone else) choose to share your assigned letter:
        <ul>
        <li>All group members will be able to see and use the letter in their word construction task. </li><li>You will be able to participate in a chat with other group members who have also choosen to share their assigned letters and help each other in this task. </li></ul>
        </li>

        <li>
        If you choose to keep your letter private:
        <ul>
         <li>Your group members will not be able to use your letter in their word construction task (you will still be able to see the letters that other members of your group have shared).</li> <li>You will also not be able to participate in the chat with your group members nor be able to see the messages that the other members exchange. </li>

        </ul>
        <li>
        The set of letters available to each participant in the word construction task is the same if all members of a group choose to share their letters. </li>
        </ul>
    </div>  
          <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>
<div class="show-modal-button">
  <button type="button" class="btn btn-info instruction-button" data-toggle="modal" data-target="#instructionModal">View Instructions</button>
</div>
<div class="instructions">
<h4> <b>INTERGROUP COMPETITION</b> </h4>
<b><u>Payment In Each Round</b></u>
<ul>
<li> We will sum up the length of the words submitted by each member of your group. We will do the same for the other group. </li>
<li> If this sum for your group is strictly greater than that of the other group then your group wins and each member of your group receives 100 INR; otherwise each of you earn 0 INR.</li>
</ul>
<p>Therefore, your payment in this task depends on the ability of you and your group members to cooperate and to do better than the members of the other group. </p>
</div>
<div class='container-fluid'>
	<div class='row'>
		<div class='col-md text-center'>
			{% next_button %}
		</div>
	</div>
</div>

{% endblock %}