Move specific sections under each other

In case of the same z-index the order of creation in the DOM is picked
as how to stack. Given that creating the DOM from bottom to top is
unmainable the less worse option is introducing a lot of z-indexes.

Perfect solution would be to put this in a class to remove the inline
styles but that is left for another time.

webapp/templates/partials/scoreboard_table.html.twig

@@ -96,7 +96,7 @@
         {% endif %}
     </tr>
     </thead>
-    <tbody>
+    <tbody style="z-index: 100;">
     {% set previousSortOrder = -1 %}
     {% set previousTeam = null %}
     {% set backgroundColors = {"#FFFFFF": 1} %}
@@ -107,6 +107,8 @@
             {% if previousSortOrder != -1 %}
                 {# Output summary of previous sort order #}
                 {% include 'partials/scoreboard_summary.html.twig' with {sortOrder: previousSortOrder} %}
+                </tbody>
+                <tbody style="z-index: {{ 100-score.team.category.sortorder }};">
             {% endif %}
             {% set classes = classes | merge(['sortorderswitch']) %}
             {% set previousSortOrder = score.team.category.sortorder %}