{{ block styles}}

<link href="{% static 'global/Intro.css' %}" rel="stylesheet">
<link href="{% static 'global/Choice.css' %}" rel="stylesheet">

{{ endblock }}

{{ block content }}

<div class="game-body">
    <div class="text-container">
        <ul>
            <li> Once you have compared the products, choose the product you want by clicking on the buttons below. </li>
            <li> If you didn't quite get it yet, don't worry! There will be <b>3 practice rounds</b>
                before the real experiment starts. </li>
            <li> Practice rounds will never be selected for payout. </li>
            <li> You will never pay more than what you get, so don't worry, you can't lose money! </li>
        </ul>
    </div>
    <div class="img-container">
        <img class="task-img" class="symbol" src="{% static C.intro_choose %}" />
    </div>
    <button id="next" class="button next-button"> Next </button>
</div>

{{ endblock }}

{{ block scripts }}

<script src="{% static 'global/VT_functionality.js' %}"> </script>
<script src="{% static 'global/FriendlyChecks.js' %}"> </script>

<script>
    const bRequireFS    = 'bRequireFS';
    const bCheckFocus   = 'bCheckFocus';
    const defaultPixel  = 'dPixelRatio';
    var TBlur           = new Date().getTime();
    var TFocus          = new Date().getTime();
</script>

{{ endblock }}