{% load templates %}
<div class="tab">
    <div class="tab-header">
        {% for tab in tabs %}
            {% if tab.selected and tab.id == tab.selected  %}
            <button class="tab-link active" id="tab-link-{{ tab.id  }}" onclick="selectTab(event, '{{ tab.id  }}');">{{ tab.name  }}</button>
            {% elif not tab.selected and forloop.first %}
            <button class="tab-link active" id="tab-link-{{ tab.id  }}" onclick="selectTab(event, '{{ tab.id  }}');">{{ tab.name  }}</button>
            {% else %}
            <button class="tab-link" id="tab-link-{{ tab.id  }}" onclick="selectTab(event, '{{ tab.id  }}');">{{ tab.name  }}</button>
            {% endif %}
        {% endfor %}
    </div>
    {% for tab in tabs %}
    {% if not tab.selected and forloop.first %}
    <div class="tab-content" id="tab-content-{{ tab.id }}" style="display:block;">
    {% elif tab.selected and tab.selected == tab.id  %}
    <div class="tab-content" id="tab-content-{{ tab.id  }}" style="display:block;">
    {% else  %}
    <div class="tab-content" id="tab-content-{{ tab.id  }}" style="display:none;">
    {% endif  %}
        {% if tab.content_template  %}
            {% include tab.content_template|template:theme %}
        {% elif tab.content_template_name   %}
             {% include tab.content_template_name %}
        {% else %}
            {{ tab.content  }}
        {% endif  %}
    </div>
{% endfor  %}
</div>