{% block app_styles %}
<!--<link rel="stylesheet" href='{{static "global/CM_css.css"}}'>-->
<link rel="stylesheet" href='{{static "global/rulers100.css"}}'>
<link rel="stylesheet" href='{{static "global/CM_css.css"}}'>
<style data="after_click" typt="text/css"></style>
{% endblock %}

{%block content%}


<h1>Task {{participant.task_num}}/11</h1>
<div class="taskcontainer">

    <div class="intro">
        <p>
            <img src="{{ static 'global/Task11.png'}}" style="width:100%"/>
        </p>
    </div>
    <div class="task">

        <table>
            <colgroup>
                <col span="1" style="width: 50%;">
                <col span="1" style="width: 50%;">
            </colgroup>
            <tr>
                <br>
                <br>
                <br>
                <br>
                <td colspan="2">
                    <p><b>Your task is to estimate the percentage of <span style="color: blue">blue</span> dots in percentage are there in the figure [from 0 to 100].</b>
                    </p>
                        <br>
                </td>
            </tr>

           {{include C.CM100}}
            <tr>
                <td colspan="2" style="text-align: center;">
                    <p>The percentage of blue dots: <span id="belief1" style="visibility: hidden"></span>
                </td>

            </tr>

            <tr>
                <td colspan="2">
                    <button style="float: right; visibility: hidden" type="submit" value="Submit" id="next_page" class="otree-btn-next btn btn-primary" onclick="sub_result()">Submit</button>
                </td>
            </tr>

        </table>
    </div>
</div>


<input type="hidden" name="CM" id="point" />
{{ formfield_errors 'CM' }}
{%endblock%}

{% block scripts %}

<script src="{{ static 'global/CM_script.js' }}"></script>

{% endblock %}