Citizen science and New technological approaches.html

---
layout: default_style
permalink: /CitizenscienceandNewtechnologicalapproaches
published: true
---
<div class="container">
   <div class="row">
      <div class="services-header">
      <h2 align="center" class="services-header-title">Citizen science & new technological approaches</h2><hr>
      </div>
   </div>
</div>

<div class="container">
  <b>Menu:</b>
      <div id="navigation">
  <div class="navigation-column">
    <ul id="navigation-list-left"></ul>
  </div>
  <div class="navigation-column">
    <ul id="navigation-list-right"></ul>
  </div>
</div>

<style>
  .navigation-column {
    width: 50%;
    float: left;
  }
</style>

<script>
  document.addEventListener('DOMContentLoaded', function() {
    const headings = document.querySelectorAll('h4');
    const navigationListLeft = document.getElementById('navigation-list-left');
    const navigationListRight = document.getElementById('navigation-list-right');

    headings.forEach(function(heading, index) {
      const title = heading.textContent;
      const anchor = 'section-' + index;

      heading.setAttribute('id', anchor);

      // Check if the heading is within the footer
      if (!heading.closest('footer')) {
        const listItem = document.createElement('li');
        const link = document.createElement('a');
        link.textContent = title;
        link.setAttribute('href', '#' + anchor);
        listItem.appendChild(link);

        // Alternate between left and right columns
        if (index % 2 === 0) {
          navigationListLeft.appendChild(listItem);
        } else {
          navigationListRight.appendChild(listItem);
        }
      }
    });
  });
</script>
</div>
      
<div class="container">
   <div class="row">  
    <h4 align="center" class="services-header-title"><em> <b></b>Coming Soon</b></em></h4>

<div class="container">
   <div class="row">   
       <img src="../assets/img/photo/Polynesia  water air view PA120412.JPG" alt="Feature-img" width="100%"> 
   </div> 
</div>
   </div> 
   
</div>

<br>
<div class=" blockquote-box animated wow fadeInLeft clearfix">
    <div class="square pull-left">
    <img src="../assets/ico/Logo mixte reef3.png" width="90">
    <a href="/projects.html">Project page</a>
    </div> 
</div>