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

{% block title %}

{% endblock %}

{% block scripts %}

<script src="{% static 'back_button_v2/js/prev_next_button.js' %}"></script>

{% endblock %}

{% block styles %}

<link href="{% static 'back_button_v2/css/custom.css' %}" rel="stylesheet">

{% endblock %}

{% block content %}
<ul class="nav nav-tabs fixed-top navbar-light bg-light justify-content-center " id="myTab" role="tablist">


  <li class="nav-item" >
    <a class="nav-link active" id="part1-tab" data-toggle="tab" href="#part1" role="tab" aria-controls="part1" onclick="topFunction()"> Tab 1
</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" id="part2-tab" data-toggle="tab" href="#part2" role="tab" aria-controls="part2" onclick="topFunction()">Tab 2</a>
  </li>


    </ul>
<br>
<br>

  <div class="tab-content" id="myTabContent">

  <div class="tab-pane show active" id="part1" role="tabpanel" aria-labelledby="part1-tab">


<div class="card-header bg-transparent mainheader" >
 <h3 class="card-title font-weight-bold"> Description of the game
 </h3>
  </div>
<br>



<p>
    <br/>
    All participants in the experiment will be randomly divided into groups of twelve. So, besides you, there will
    be eleven more members in your group. You have to decide how many Tokens you contribute to a project of your group
    and how many Tokens you keep for yourself.

</p>

<p>
    <br/>
    Every participant receives an “endowment” of 20 Tokens. You then have to decide how many of these 20 Tokens
    you contribute to the project or how many you keep for yourself. Each participant can contribute up to 20 Tokens.
    The eleven other members of your group have to make the same decision.

</p>

<p>
    <br/>
    Every Token that you do not contribute to the project automatically belongs to you.

</p>

<p>
    <br/>
    For every token contributed to the group project, the project’s value will be multiplied by 6.
    If for instance 1 Token is contributed to the project, the Token’s value increases to 6 Tokens.

</p>
<br>
<br>

    <b>
        Making your contribution decision
    </b>
<p>
    <br/>
    One member of the group will randomly be chosen to be the ‘First Mover’. This person makes their decision
    before the others in the group, who are referred to as ‘Second Movers’. If you are chosen to be the First Mover
    you will be asked how many Tokens you want to contribute to the group project. You must choose a number
    between 0 and 20.
</p>

<p>
    <br/>
    If you are a Second Mover, after the First Mover has made the contribution decision, you will be asked how many Tokens you want to contribute to the group project.
    You will be notified how many Tokens the First Mover has contributed.

<p>
    <br/>
    To determine Total contributions to the project we will sum the amount contributed by the First Mover and the amount
    contributed by each of the Second Movers.
</p>

<br>
<br>

    <b>
        Payoff from the Group Project
    </b>


<p>
    <br/>
       Once all group members have made their decision the total contribution to the group project is determined.
    Tokens in the group project will be divided equally among all twelve members of the group.
</p>




<p>
    <br/>
    Thus, for every 1 token contributed to the group project every member of the group receives 0.5 tokens.
    Your income from the project rises by 0.5 Tokens if you contribute one Token more to the project.
    At the same time, the income of the other eleven members of the group also rises by 0.5 Tokens. It
    also holds that your income rises by 0.5 Tokens if another group member contributes one Token more to the project.
</p>

  <button onclick="topFunction()" type="button" class="nexttab btn-primary btn next">Next</button>
  </div>


    <div class="tab-pane" id="part2" role="tabpanel" aria-labelledby="part2-tab">


<div class="card-header bg-transparent mainheader" >
 <h3 class="card-title font-weight-bold"> Income calculation in the experiment </h3>
  </div>
<br>

<p>
    <br/> Your income therefore consists of:
</p>

<p>
    <br/><b>(1)</b> The tokens which you have kept for yourself (“Income from tokens kept”).
</p>
<p>
    <br/><b>(2)</b> The “Income from the project”. This income is calculated as follows: Your income from the
    project = 0.5 times the total contributions to the project made by all twelve group members.
</p>
<center>
<head>
  <title>Frame</title>
  <style>
    .frame {
      border: 1px solid black;
      padding: 10px;
    }
  </style>
</head>
<body>
  <div class="frame">
      <table class="" width="" cellspacing="0">
    <tr>
        <th width=""></th><b>Your Income = Income from tokens kept + Income from the project =
        (20 – your contribution) + 0.5 × (sum of tokens contributed to the project
        by all members of your group)</b>
    </tr>
    </table>
  </div>
</body>
</center>

         <button onclick="topFunction()" type="button" class="prevtab btn-primary btn back">Back</button>
        <button class="nexttab btn-primary btn next">Next</button>
  </div>

    </div>



{% endblock %}