{{ extends "global/Page.html" }}


{{ block title }}
    Quiz
{{ endblock }}

{{ block content }}

<div class="boxed">


    <p class="quiz">
         <b>Please use the table below to answer the quiz questions.</b>
     </p>
     
     {{ if r_num == 1}}
         {{ include "pooling_baseline/P_1_inst_example_discrete_table.html" }}
     
     
     
        <p class="quiz"><b>Question 1:</b> 
            If you were to spend 5 tokens, which school would you <span style="color:red;">enroll</span> in? 
            
                {{ formfield "quiz_1"  label=""}}
        </p>
        
      <hr style="width:50%;margin-left:25%;">
      
      <p class="quiz"><b>Question 2:</b> 
          How much would it <span style="color:red;">cost</span> to enroll in School D?

             {{ formfield "quiz_2"  label=""}}
      </p>
      
      <hr style="width:50%;margin-left:25%;">
      
      <p class="quiz"><b>Question 3:</b> 
          What would your <span style="color:red;">Additional Payment</span> for this round be if you enrolled in School I?
             {{ formfield "quiz_3"  label=""}}
      </p>
             
    {{ elif r_num == 2}}
        
        {{ include "pooling_baseline/P_1_inst_example_pooling_table.html" }}

        <p class="quiz"><b>Question 1:</b> 
            If you were to spend 30 tokens, which school would you <span style="color:red;">enroll</span> in? 
            
                {{ formfield "quiz_1"  label=""}}
        </p>
        
      <hr style="width:50%;margin-left:25%;">
      
      <p class="quiz"><b>Question 2:</b> 
          How much would it <span style="color:red;">cost</span> to enroll in School D?
             {{ formfield "quiz_2"  label=""}}
      </p>
      
      <hr style="width:50%;margin-left:25%;">
      
      <p class="quiz"><b>Question 3:</b> 
          What would your <span style="color:red;">Additional Payment</span> for this round be if you enrolled in School I?
             {{ formfield "quiz_3"  label=""}}
      </p>
        


    {{ endif }}
  

 
    
    
    <hr style="width:50%;margin-left:25%;">
    
 {{ next_button }}
    
</div>

{{ endblock }}




{{ block styles }}
    <style>
 
        
        p.quiz{
            font-size: 18px; 
            text-align: justify;
            margin:0;
            
                
                }
        
    </style>
    
    <style>
 

  .table_3{
  
    
  border-collapse: separate; 
  background:transparent;
  margin-left: auto; 
  margin-right: auto;
  font-size: 18px; 
  border: 1px solid black;
  padding: 15px;
  border-radius: 15px;
  
  
  
  }
  .table_3 td {
      text-align: center;
    }
    .table_3 th {
          text-align: center;
          width: 33%;
        }
    .table_3 tr:nth-child(even) {
        background-color: #f2f2f2;
        }

         
    
    </style>  
{{ endblock }}