{% extends "global/Page.html" %}
{% load otree static %}
{% load staticfiles otree %}
{% block title %}

{% endblock %}
{% block content %}


<style>
.rangeslider {
font-size:10pt;
padding-bottom: 5em;
}
input[type="range"]{
  width:100%;
}
.table{
font-size:10pt;
th, td {
  border-bottom: 1px solid #ddd;
}
}
</style>
    <form id="myForm"  method="post">

            <div align="justify">

            <p>On average, <b>how often</b> do you think the <b><i><font color="mediumseagreen">GREEN</font></b> players in your session have awarded the <b>high payment</b> to:
            </p>
<br><br>
<p>The <b><font color="lightblue"> LIGHT BLUE </font></b> player:     &nbsp;&nbsp;    <input type="number" id="Belief_Light" name="Belief_Light"> %


<br><br>
   <p>        The <b><font color="darkblue"> DARK BLUE </font></b> player:&nbsp;&nbsp; <input type="number" id="Belief_Dark" name="Belief_Dark"> %
<br><br>
            <p>      (It has to sum up 100%)
<br><br><br>
      <p>  <b>Why? Please, explain your answer.</b> <br><br>

<textarea id="FeedBack" name="FeedBack" rows="15" cols="100"></textarea>

                  <input type="submit" class="btn btn-primary btn-large" value="Submit" style="height:50px;width:200px">
</form>


{% endblock %}