{% block content %}

<style>
    .otree-body {
        max-width:1450px;
         font-size: 23px;
    }
</style>

<div class="tab">

    <p>
        Vous avez ci-dessous une liste des actions possibles disponibles pour Personne A. Pour chacune des actions,
        veuillez indiquer si vous pensez que choisir cette action est Très Inappropriée socialement, Inappropriée
        socialement, Plutôt Inappropriée socialement, Plutôt Appropriée socialement, Appropriée socialement
        ou Très Appropriée socialement. Rappelez-vous que vous gagnerez de l'argent dans cette tâche (7 €)
        si votre évaluation pour une action sélectionnée au hasard est la même que l'évaluation la plus
        courante fournie par les autres participants lors de la session d'aujourd'hui.
        <br>
        <br>
        Au cas où vous en auriez besoin, vous pouvez relire la description de la situation en cliquant sur le bouton Instructions situé en bas de la page.


    </p>

{% formfield player.Konow_B1 label="<span style='font-size:20px;'><b>Personne A donne 0 € à Personne B</b></span>"%}

{% formfield player.Konow_B2 label="<span style='font-size:20px;'><b>Personne A donne 1 € à Personne B</b></span>"%}

{% formfield player.Konow_B3 label="<span style='font-size:20px;'><b>Personne A donne 2 € à Personne B</b></span>"%}

{% formfield player.Konow_B4 label="<span style='font-size:20px;'><b>Personne A donne 3 € à Personne B</b></span>"%}

{% formfield player.Konow_B5 label="<span style='font-size:20px;'><b>Personne A donne 4 € à Personne B</b></span>"%}

{% formfield player.Konow_B6 label="<span style='font-size:20px;'><b>Personne A donne 5 € à Personne B</b></span>"%}

{% formfield player.Konow_B7 label="<span style='font-size:20px;'><b>Personne A donne 6 € à Personne B</b></span>"%}

{% formfield player.Konow_B8 label="<span style='font-size:20px;'><b>Personne A donne 7 € à Personne B</b></span>"%}

{% formfield player.Konow_B9 label="<span style='font-size:20px;'><b>Personne A donne 8 € à Personne B</b></span>"%}

{% formfield player.Konow_B10 label="<span style='font-size:20px;'><b>Personne A donne 9 € à Personne B</b></span>"%}

{% formfield player.Konow_B11 label="<span style='font-size:20px;'><b>Personne A donne 10 € à Personne B</b></span>"%}

    <button type="button" class="btn btn-primary btn-tab" data-offset="1">Instructions</button>
    &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp
    &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp
    &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp
    &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp
    &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp
    &nbsp &nbsp &nbsp
    <button class="btn btn-primary">Suivant</button>

</div>

<div class="tab">
  <h2> <span style="font-size:28pt">Description de la situation</span> </h2>

    <p>
        Dans une étude menée au laboratoire d'économie, Personne A est jumelée au hasard avec un autre participant,
        Personne B. Le jumelage est anonyme, ce qui signifie qu'aucun des participants ne connaîtra
        l'identité de l'autre participant avec lequel il est jumelé.
        <br>
        <br>
        Dans l'expérience, Personne A va faire un choix, l'expérimentateur va enregistrer ce choix.
        Puis, Personne B sera informée du choix de Personne A et elles seront payées en fonction de
        ce choix. En outre, toutes les deux recevront une petite prime de participation. Supposons
        que ni Personne A ni Personne B ne recevront aucune autre somme d'argent pour participer à l'expérience.
        <br>
        <br>
        L'expérience se compose de <b>deux étapes</b>. Dans la première étape, <b>toutes les deux Personne A et Personne B</b> participent à une tâche pendant 30 minutes. Lorsque Personne A et Personne B participent à cette étape, elles ne savent pas de l'existence de la deuxième étape.
        <br>
        <br>
        Dans la tâche de la première étape, Personne A et Personne B sont présentées avec des tables contenant
        uniquement des 1 et des 0. <b>Personne A et Personne B doivent indiquer le nombre de zéros dans chaque table</b>. Personne A et Personne B feront leurs tâches séparément. Elles observeront
        chacune leur propre ensemble de tables avec des 1 et des 0, et fourniront leurs réponses
        en conséquence. Un exemple de table est fourni ci-dessous.
        </p>
         <div style="text-align: center;">
            <img src="https://i.imgur.com/QItetlG.png" width="700" height="350px" />
         </div>
        <br>
        Pour chaque réponse correcte que Personne A et Personne B donnent, elles gagnent <b>0.25 €</b>.
        À la fin de cette tâche, Personne A a correctement indiqué le nombre de zéros dans <b>32 tables</b>.
        Par conséquent, <b>Personne A a gagné (32 x 0.25 =) 8 €</b>. D'autre part, Personne B a correctement
        indiqué le nombre de zéros dans <b>8 tables</b>. Par conséquent, <b>Personne B a gagné (8 x 0.25 =) 2 €</b>.
        <br>
        <br>
        Dans la deuxième étape, l'argent gagné par Personne A et Personne B est <b>regroupé ensemble</b>.
        Ensuite, <b>Personne A a la possibilité de donner n'importe quel montant des (8 + 2 =)10 € gagnés par les
        deux individus à Personne B</b>. C'est-à-dire, Personne A peut donner n'importe quel montant des 10 €,
        par incréments de 1 €, à Personne B. Par exemple, Personne A peut décider de donner 0 € à Personne B et de
        garder 10 € pour elle-même. Ou Personne A peut décider de donner 10 € à Personne B et de garder 0 € pour
        elle-même. Personne A peut également choisir de donner n'importe quel autre montant entre 0 € et 10 € à Personne B,
        par incréments de 1 €. Ce choix déterminera combien d'argent chaque personne recevra, en privé et en espèces, à la fin
        de l'expérience.
        <br>
        <br>
        Vous pouvez trouver un aperçu des actions possibles et des gains correspondants ici :
        <br>
            <div style="text-align: center;">
             <img src="https://i.imgur.com/Eyu856b.png" width="1400px" height="350px" />
            </div>

    </p>
    &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp
    &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp
    &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp
    &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp
    &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp
    &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp
        <button type="button" class="btn btn-primary btn-tab" data-offset="-1">Retour</button>
    </div>


<script>

    let activeTab = 0;

    function showCurrentTabOnly() {
        let tabIndex = 0;
        for (let tab of document.getElementsByClassName('tab')) {
            tab.style.display = tabIndex === activeTab ? 'block' : 'none';
            tabIndex++;
        }
    }

    showCurrentTabOnly();
    for (let btn of document.getElementsByClassName('btn-tab')) {
        btn.onclick = function () {
            activeTab += parseInt(btn.dataset.offset);
            showCurrentTabOnly();
            scroll_Top()
        }
    }
    function scroll_Top() {
        window.scrollTo(0,0)
    }
</script>


{% endblock %}