{{ block content }}

<style>
    .tab {
        display: none;
    }
</style>


<div class="tab">
    <p>
        <h2> <span style="font-size:18pt">Segona Tasca</span> </h2>
        En la segona tasca, rebràs 10€. La teva decisió consistirà en decidir com vols dividir aquests 10€ entre tu i <b> NOM CHARITY </b>.
        És a dir, podràs donar qualsevol quantitat dels 10€ a <b> NOM CHARITY </b>. Per exemple, pots donar 0€ a <b> NOM CHARITY </b> i quedar-te amb els 10€.
        Pots donar 10€ a <b> NOM CHARITY </b> i quedar-te amb 0€. Pots donar qualsevol quantitat entre 0 i 10€ a <b> NOM CHARITY </b> i quedar-te amb la diferència. Tots els individus de la sessió prenen la mateixa decisió.
        <br>
        <br>
       <b> NOM CHARITY </b> (EXPLICAR QUE FA CHARITY)
        <br>
        <br>
        (EXPLICAR EFECTE DONACIÓ EN TERMES CO2)
        <br>
        <br>
         A la primera tasca has donat x€ a l'ONG. Els altres participants de la sessió han donat y€ a l'ONG de mitjana (<b>Missatge si l'individu està a la Condició 2</b>)
        <br>
        <br>
         A la primera tasca has donat x€ a l'ONG. Si tots els altres participants de la teva sessió donessis com tu, la donació total a l'ONG seria de N * x € (<b>Missatge si l'individu està a la Condició 3</b>)
        <br>
        <br>
        &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">Continua</button>
    </p>
</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 }}