{% if show_tabs %} {% comment %} Bootstrap requires this markup (ul > li > a) to style and handle tabs properly, but it is not valid from an accessibility point of view without some aria and role tweaks: - the elements with role tab should be owned by the element with role tablist -> because they are not a direct child some screen readers do not list the correct number of tabs. Adding `aria-owns` listing the tabs should correct this. - the

elements have a listitem role by default which doesn't belong in a tablist but an element with role list or group -> we remove the default role by adding `role="presentation"` which actually sets the role for this element to `none` {% endcomment %}

• Key info
• In depth

{% endif %} {# content #}

{% if self.prepared_key_info %}

{{ self.prepared_key_info|safe }}

{% endif %} {% if self.prepared_in_depth %}

{{ self.prepared_in_depth|safe }}

{% endif %}

{% if show_tabs %} {% endif %} {% bibliography self %}

{% if self.faq_items.all %}

Frequently asked questions

{% for item in self.faq_items.all %}

• {{ item.question }}

  {{ item.answer }}

{% endfor %}

{% endif %} {% include "includes/highlight.html" %}