{{ block title }}
Spatial questions
{{ endblock }}

{{ block content }}
<style>
    .score-widget {
        display: flex;
        gap: 3rem;
        z-index: 100;
        {#max-width: 990px;#}
    }
    #main {
          display: flex;
          flex-wrap: wrap;
          align-content: center;
          font-size: 18px;
          width: 150px;
          height: 330px;
    }
    #main div {
      width: auto;
      height: auto;
    }

</style>


<div class="score-widget">
    <img src="{{ static image_path }}" width="500px"  alt=""/>
    <div id="main">
        <table class="table" style="width: auto">
            <tr>
                <th>Your score in spatial:</th>
            </tr>
            <tr>
                <td>{{ player.participant.g1_correct_s}}</td>
            </tr>
        </table>
    </div>

</div>


{{ formfields }}

{{ next_button }}

{{ endblock }}