{%
set node_classes = [
  'node',
  node.isPromoted() ? 'node-promoted',
  node.isSticky() ? 'node-sticky',
  not node.isPublished() ? 'node-unpublished',
  view_mode ? 'node-view-mode-' ~ view_mode|clean_class,
]
%}
<article{{ attributes.addClass(node_classes) }}>
{{ title_prefix }}
  {% if not page %}
    <h2{{ title_attributes.addClass('node-title') }}>
      <a href="{{ url }}" rel="bookmark">{{ label }}</a>
    </h2>
  {% endif %}
{{ title_suffix }}

{% if display_submitted %}
  <header class="node-header clear">
    {% if node_author_pic %}
      <div class="author-picture">{{ author_picture }}</div>
    {% endif %}
    <div{{ author_attributes.addClass('node-submitted-details') }}>
      {% set createdDate = node.getCreatedTime|date('j F Y') %}
      {% trans %}<span><i class="ficon-user submitted-icons"></i> {{ author_name }}</span><span><i class="ficon-calendar submitted-icons"></i> {{ createdDate }}</span>{% endtrans %}
      {% if node_tags %}
      {% if content.field_tags %}
        <span><i class="ficon-tag submitted-icons"></i>
        {% for item in content.field_tags %}
          {% if item['#title'] %}
            <a href="{{ item['#url']}}">{{ item['#title']  }}</a>{{ ',' }}
          {% endif %}
        {% endfor %}
      </span>
      {% endif %}
      {% endif %}
      {{ metadata }}
    </div>
  </header>
{% endif %}
  <div{{ content_attributes.addClass('node-content clear') }}>
{#=============#}
{#Dummy Content#}
{#=============#}
<section class="citation-block">
  <div class="icon"><i class="ficon-file"></i></div>
  <div class="data-citation"><h2>Title</h2>
    <span>
      Elit consequatur quasi expedita sint consectetur. Ipsa obcaecati sed dolores exercitationem iste Voluptate ipsam nihil aperiam numquam asperiores Sequi iste ad commodi eligendi sunt? Amet possimus ratione est exercitationem blanditiis?
    </span></div>
</section>
<hr>
<h3>Rob's dummy content</h3>
{#Table#}
<table class="metadata">
  <tbody>
    <tr id="row_id">
      <th scope="row">Description</th>
      <td>
        <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
        </div>
      </td>
    </tr>
    <tr id="row_id">
      <th scope="row">Subject</th>
      <td>
        <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
        </div>
      </td>
    </tr>
    <tr id="row_id">
      <th scope="row">Keywords</th>
      <td>
        <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
        </div>
      </td>
    </tr>
    <tr id="row_id">
      <th scope="row">Related Publications</th>
      <td>
        <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
        </div>
      </td>
    </tr>
  </tbody>
</table>
{#/table#}
<!-- dummy tabs -->
<!-- Tab links -->
<div class="tab">
  <button id="defaultOpen" class="tablinks" onclick="openTab(event, 'Tab01')">Tab01</button>
  <button class="tablinks" onclick="openTab(event, 'Tab02')">Tab02</button>
  <button class="tablinks" onclick="openTab(event, 'Tab02')">Tab02</button>
</div>

<!-- Tab content -->
<div id="Tab01" class="tabcontent">
  <h3>Tab01</h3>
  <p>Adipisicing consectetur dolorem tempora quibusdam ad at! Eius consectetur consequuntur omnis tenetur repudiandae. Iure laudantium optio magni laboriosam rerum Commodi quisquam tempora eaque minima nemo! Distinctio earum dolores aliquid facere</p>
</div>

<div id="Tab02" class="tabcontent">
  <h3>Tab02</h3>
  <p>Dolor quam quo vero perspiciatis vel. Odit ut delectus doloribus illum culpa? Nobis culpa aperiam omnis quae cupiditate ipsam libero iure vero. Unde sequi eligendi eaque eum repellendus Animi ullam.</p>
</div>

<div id="Tab02" class="tabcontent">
  <h3>Tab02</h3>
  <p>Adipisicing ea dolorum eos excepturi nobis Ipsa officia accusamus omnis iure at Repudiandae quaerat ratione provident quos quae dolor Est voluptatibus aliquam fuga enim nostrum? Necessitatibus magni earum quo esse.</p>
</div>
<!-- /dummy tabs -->

    {{ content.field_rdm_creator }}
    {{ content.field_rdm_organization_name }}
<hr>

    {{ content }}
  </div>
</article>
{#==========#}
{#JS for Tabs#}
{#==========#}
<script>
function openTab(evt, tabName) {
  // Declare all variables
  var i, tabcontent, tablinks;

  // Get all elements with class="tabcontent" and hide them
  tabcontent = document.getElementsByClassName("tabcontent");
  for (i = 0; i < tabcontent.length; i++) {
    tabcontent[i].style.display = "none";
  }

  // Get all elements with class="tablinks" and remove the class "active"
  tablinks = document.getElementsByClassName("tablinks");
  for (i = 0; i < tablinks.length; i++) {
    tablinks[i].className = tablinks[i].className.replace(" active", "");
  }

  // Show the current tab, and add an "active" class to the button that opened the tab
  document.getElementById(tabName).style.display = "block";
  evt.currentTarget.className += " active";
}

document.getElementById("defaultOpen").click();
</script>