{{ block styles }}
<link href="{{ static 'bret/css/custom.css' }}" rel="stylesheet"/>
{{ endblock }}


{{ block title }}
{{ Lexicon.instructions }}
{{ endblock }}

{{ block content }}

<div class="consent">
    <p>
        Next, you will see a {{ NUM_ROWS }} × {{ NUM_COLS }} matrix with a total of
        {{ num_boxes }} boxes on your screen.
    </p><br>

    <div style="text-align:center;">
        <img src="{{ static 'BRET_Blank_Matrix_Copy.png' }}" width="240">
        <p><strong><p style="color: blue;">{{ NUM_ROWS }} × {{ NUM_COLS }} in the Game</p></strong></p>
    </div>
    <br>

    <p>
        To start the game, you may select any of the available boxes. You may select
        as many boxes as you wish. Selected boxes will be marked with a check mark.
        For each box you select, you will earn Rp {{ BOX_VALUE }}.</p><br>

    <div style="text-align:center;">
        <img src="{{ static 'BRET_Chosen_Matrix_2_Copy.png' }}" width="240">
        <p><strong><p style="color: blue;">Selecting a box by clicking the desired box. </p></strong></p>
    </div><br>

    <p>
        If you change your mind, you may click on a selected box again to cancel your
        selection.
   </p>

    <div style="text-align:center;">
        <img src="{{ static 'BRET_Undo_Matrix_2_Copy.png' }}" width="240">
        <p><strong><p style="color: blue;">Undo your selection by reclicking the box.</p></strong></p>
    </div><br>


    <p>
        <span style="color: red;">
            However, behind one of the boxes, <strong>there is a bomb</strong> that will
            destroy all the boxes you have collected.
        </span>
        The bomb will be placed randomly, with equal probability in each box.
        And the position of the bomb will be randomized by the system for each round.
    </p>

    <div style="text-align:center;">
        <img src="{{ static 'BRET_Bomb_Matrix_Copy.png' }}" width="240">
        <p><strong><p style="color: blue;">Bomb got chosen. </p></strong></p>
    </div><br>

    <p>
        Your task is to choose whichever boxes you wish. Once you are satisfied with
        your selections, press the <em>"Stop"</em> button at any time. Then, press the
        <em>"Solve"</em> button to reveal what's behind the boxes.
        If the box containing the bomb is included among your
        selected boxes, the bomb will explode and you will receive nothing.
        However, if you only select boxes without the bomb, you will receive a bonus
        equal to the total amount collected.
    </p>

    <p>There is no time limit for this game, you can take your time and think which boxes do you want to pick.</p>

    <div style="text-align:center;">
        <img src="{{ static 'BRET_Stop_Matrix_Copy.png' }}" width="240">
        <p><strong><p style="color: blue;">After you finish choosing the boxes, click "stop". </p></strong></p>
    </div>

    <div style="text-align:center;">
        <img src="{{ static 'BRET_Solved_Matrix_Copy.png' }}" width="240">
        <p><strong><p style="color: blue;">After you clicked stop, click "Solve" to reveal what's behind the boxes. </p></strong></p>
    </div><br>

    <p>
        You will be given two (2) practice rounds to try this game before starting the game for real.
        Results from the practice rounds will <strong>not</strong> count toward your final payment.
    </p>
    <p>Click 'next' to proceed to the practice rounds.</p>

</div>

<button class="btn btn-primary btn-lg" type="submit">
    Start Practice Rounds
</button>
{{ endblock }}