{{ block title }}
    {# Your chosen Ranking#}
{{ endblock }}

{{ block content }}

<style>
body {
  background-color: white;
  text-align: center;
  color: black;
  font-family: Arial, Helvetica, sans-serif;
}

.left {
  background-color: white;
  text-align: left;
  color: black;
  font-family: Arial, Helvetica, sans-serif;}

.green {
 background-color: #90ee90;
}

.orange {
 background-color: #ff8800;
}

</style>


<style>
.underline {
  width: 100%;
  border-bottom: 1px solid 	#d3d3d3;
  margin-bottom: 20px;
    text-align: left;
  position: relative;
}
</style>

<style>

    table {
  width:80%;
}
table, th, td {
  border: 1px solid black;
  border-collapse: collapse;
  margin-left: auto;
  margin-right: auto;
}

th, td {
  padding: 10px;
  text-align: center;
}

#gray {
 background-color: #eee;
}

#green {
 background-color: #90ee90;
}
}



</style>



<div class="underline">
    <h3>Questions</h3>
</div>

<div >
    <h3>Please answer the following Questions</h3>
</div>

 <table class="table">
        <tr>
            <td>
                {{ formfield 'age' }}
            </td>
        </tr>
        <tr>
            <td>
                {{ formfield 'gender' }}
            </td>
        </tr>
             <tr>
            <td>
                {{ formfield 'country' }}
            </td>
        </tr>
                  <tr>
            <td>
                {{ formfield 'control' }}
            </td>
        </tr>
                       <tr>
            <td>
                <p>In political matters, people talk of “the left” and
                    “the right”. Generally speaking,
                    how would you place your views on this scale? </p>
                    <p>
                        Left &nbsp;
                        {{ for choice in form.politics }}
                            {{ choice }}
                        {{ endfor }}
                        &nbsp; Right
                    </p>
            </td>
        </tr>
    </table>

{{ endblock }}