{% load otree static %}

<div class="info_box">
    <div class="header">
        <p class="formatting_header">
            Information:
        </p>
    </div>
    <div class="content">
        <p class="formatting_content">
            Now we will explain to you who the members of your Matching Group are.
            Before participating in this study, each participant answered the same questionnaire.
            This questionnaire contained two types of questions (<b>category 1</b> and <b>category 2</b>).
            The questions included in the two categories differ in that they are concerned with different aspects
            of morality.
            For some people, the considerations expressed in category 1 are more important than those expressed in
            category 2, whereas for other people, the opposite is true.
            Lastly, some people might value both categories equally.
            Your answers indicate that:
        </p>
        <p style="text-align: center">
            <b>For you, the considerations of category 1 are more important to those of category 2!</b>
        </p>
        <p class="formatting_content">
            We call the group of participants, for whom the statements from category 1 were more relevant and agreeable
                than those of category 2, your <b>Matching Group</b>.
            Please read the questions contained in each category carefully and try to understand what both
            categories express.
            It might help you to imagine what kind of person would prefer either category.
            It is crucial that you understand who is in your Matching Group since it will help you to give us
            the same response as to what most people from your Matching Group believe constitutes socially
            appropriate or socially inappropriate behavior.
            Consequently, it will make it more likely for you to receive the additional {{player.NE_bonus}}.
        </p>
        <p class="formatting_content">
            <b> You will be able to reopen these instructions when you make your final decisions! </b>
        </p>
    </div>
</div>

<div class="task_box">
    <div style="border: solid 1px #1d1d1d; border-radius: 7px 7px 0 0;background: rgba(9,11,8,0.86)">
        <p style="font-weight:bold; color: white; margin: 5px auto 5px 25px;">
            Category 1:
        </p>
    </div>
    <div style="margin: 25px">
        <table style="margin: 25px", width="95%">
            <tr class="table">
                <td><b>To what extent are the following considerations relevant to your thinking about right and wrong:</b></td>
            </tr>
            <tr class="table">
                <td>Whether or not someone suffered emotionally</td>
            </tr>
            <tr class="table">
                <td>Whether or not some people were treated differently than others</td>
            </tr>
            <tr class="table">
                <td>Whether or not someone cared for someone weak or vulnerable</td>
            </tr>
            <tr class="table">
                <td>Whether or not someone acted unfairly</td>
            </tr>
            <tr class="table">
                <td>Whether or not someone was cruel</td>
            </tr>
            <tr class="table">
                <td>Whether or not someone was denied his or her rights</td>
            </tr>
            <tr class="table">
                <td><b>Indicate your agreement or disagreement:</b></td>
            </tr>
            <tr class="table">
                <td>Compassion for those who are suffering is the most crucial virtue.</td>
            </tr>
            <tr class="table">
                <td>When the government makes laws, the number one principle should be ensuring that everyone is treated fairly.</td>
            </tr>
            <tr class="table">
                <td>One of the worst things a person could do is hurt a defenseless animal.</td>
            </tr>
            <tr class="table">
                <td>Justice is the most important requirement for a society.</td>
            </tr>
            <tr class="table">
                <td>It can never be right to kill a human being.</td>
            </tr>
            <tr class="table">
                <td>I think it’s morally wrong that rich children inherit a lot of money while poor children inherit nothing.</td>
            </tr>
        </table>
    </div>
</div>


<div class="task_box">
    <div style="border: solid 1px #1d1d1d; border-radius: 7px 7px 0 0;background: rgba(9,11,8,0.86)">
        <p style="font-weight:bold; color: white; margin: 5px auto 5px 25px;">
            Category 2:
        </p>
    </div>
    <div style="margin: 25px">
        <table style="margin: 25px", width="100%">
            <tr class="table">
                <td><b>To what extent are the following considerations relevant to your thinking about right and wrong:</b></td>
            </tr>
            <tr class="table">
                <td>Whether or not someone’s action showed love for his or her country</td>
            </tr>
            <tr class="table">
                <td>Whether or not someone showed a lack of respect for authority</td>
            </tr>
            <tr class="table">
                <td>Whether or not someone violated standards of purity and decency</td>
            </tr>
            <tr class="table">
                <td>Whether or not someone did something to betray his or her group</td>
            </tr>
            <tr class="table">
                <td>Whether or not someone conformed to the traditions of society</td>
            </tr>
            <tr class="table">
                <td>Whether or not someone did something disgusting</td>
            </tr>
            <tr class="table">
                <td>Whether or not someone showed a lack of loyalty</td>
            </tr>
            <tr class="table">
                <td>Whether or not an action caused chaos or disorder</td>
            </tr>
            <tr class="table">
                <td>Whether or not someone acted in a way that God would approve of</td>
            </tr>
            <tr class="table">
                <td><b>Indicate your agreement or disagreement:</b></td>
            </tr>
            <tr class="table">
                <td>I am proud of my country’s history.</td>
            </tr>
            <tr class="table">
                <td>Respect for authority is something all children need to learn.</td>
            </tr>
            <tr class="table">
                <td>People should not do things that are disgusting, even if no one is harmed.</td>
            </tr>
            <tr class="table">
                <td>People should be loyal to their family members, even when they have done something wrong.</td>
            </tr>
            <tr class="table">
                <td>Men and women each have different roles to play in society.</td>
            </tr>
            <tr class="table">
                <td>I would call some acts wrong on the grounds that they are unnatural.</td>
            </tr>
            <tr class="table">
                <td>It is more important to be a team player than to express oneself.</td>
            </tr>
            <tr class="table">
                <td>If I were a soldier and disagreed with my commanding officer’s orders, I would obey anyway
                    because that is my duty.</td>
            </tr>
            <tr class="table">
                <td>Chastity is an important and valuable virtue.</td>
            </tr>
        </table>
    </div>
</div>