Skip to content
Snippets Groups Projects
home.html 11.08 KiB
{% extends "layout.html" %}

{% block title %}Home{% endblock %}
{% block lead %}<b>Welcome to iGEM 2024!</b> Your team has been approved and you are ready to start the iGEM season!{% endblock %}

{% block page_content %}

<!-- <div class="row">
  <div class="col">
    <h2>Before you start</h2>
    <hr>
    <p>Please read the following pages:</p>
    <ul>
      <li><a href="https://competition.igem.org/deliverables/team-wiki" target="_blank">Wiki Requirements page</a></li>
      <li><a href="https://competition.igem.org/judging/pages-for-awards" target="_blank">Standard URL Pages for Awards</a></li>
    </ul>
  </div>
</div>
<div class="row mt-4">
  <div class="col">
    <h2>Styling your wiki</h2>
    <hr>
    <p>Feel free to customize the page styling according to your preferences, or you can simply leave the style as it is. It's wise to focus on a clear content first, and on a clean design later.</p>
    <p>Be cautious with the size of the assets like images, videos, and more, that you put in your wiki. Large file sizes can hinder the presentation of wikis due to slow internet connections. Remember to compress large files before uploading them to iGEM servers.</p>
    <p>This default wiki meets the requirements, enhances navigability, and provides a user-friendly experience for visitors. You should not feel obligated to go beyond the provided styling.</p>
  </div>
</div>
<div class="row mt-4">
  <div class="col-lg-8">
    <h2>Tips</h2>
    <hr>
    <p>This wiki will be your team's first interaction with the rest of the world, so here are a few tips to help you get started:</p>
    <ul>
      <li>State your accomplishments! Tell people what you have achieved from the start.</li>
      <li>Be clear about what you are doing and how you plan to do this.</li>
      <li>You have a global audience! Consider the different backgrounds that your users come from.</li>
      <li>Make sure information is easy to find; nothing should be more than 3 clicks away.</li>
      <li>Avoid using very small fonts and low contrast colors; information should be easy to read.</li>
      <li>Start documenting your project as early as possible; don't leave anything to the last minute before the Wiki Freeze. For a complete list of deadlines visit the <a href="https://competition.igem.org/calendar" target="_blank">iGEM Competition calendar</a></li>
      <li>Have lots of fun!</li>
    </ul>
  </div>
  <div class="col-lg-4">
    <h2>Inspiration</h2>
    <hr>
    <p>You can also view other team wikis for inspiration! Here are some examples:</p>
    <ul>
      <li><a href="https://2022.igem.wiki/dtu-denmark">2022 DTU-Denmark</a></li>
      <li><a href="https://2022.igem.wiki/virginia">2022 Virginia</a></li>
      <li><a href="https://2022.igem.wiki/crete">2022 Crete</a></li>
      <li><a href="https://2022.igem.wiki/estonia-tuit">2022 Estonia_TUIT</a></li>
      <li><a href="https://2022.igem.wiki/ashesighana">2022 AshesiGhana</a></li>
      <li><a href="https://2021.igem.org/Team:SDU-Denmark">2021 SDU-Denmark</a></li>
      <li><a href="https://2020.igem.org/Team:XMU-China">2020 XMU China </a></li>
      <li><a href="https://2020.igem.org/Team:TAS_Taipei">2020 TAS Taipei </a></li>
    </ul>
  </div>
</div> -->





<div class="homepage-holder">

  <div class="homepage-bg-img1"></div>
  <!-- <div class="shelter-for-bg1" id="shelter-for-bg1"></div> -->


  <div class="homepage-maintitle homepage-elements">
      <div class="homepage-maintitle-name">
          NitroBLAST
      </div>
      <div class="homepage-contents-style" style="margin-top:40px;text-align:center;">
          Laying the foundation for nitrogen fixation
      </div>
  </div>

  <div class="homepage-content-img1 homepage-elements reveal" id="homepage-content-img1"></div>
    <div class="homepage-content-img2 homepage-elements reveal" id="homepage-content-img2"></div>
    <div class="shelter-for-canvas-start"></div>

    <div class="homepage-content1 homepage-elements reveal" id="homepage-content1">
      <div class="homepage-subtitle-style" style="width:319px;">
          Nitrogen
      </div>
      <div class="homepage-contents-style" style="width:315.521px;margin-top:50px;">
        Nitrogen gas, comprising 78% of Earth's atmosphere, is the most abundant chemical in the air.<br><br><br>
        Its triple bond is one of the strongest, making N₂ highly inert.<br><br><br>
        This makes it challenging for organisms as well as industries to convert it into useful compounds.
      </div>
  </div>

  <div class="homepage-content2 homepage-elements reveal" id="homepage-content2" style="height:300px;">
    <div class="homepage-subtitle-style" style="width:415px;">
        The Haber-Bosch process
    </div>
    <div class="homepage-contents-style" style="width:415px">
      Nitrogen-containing compounds (ammonia and nitrates) can act as food for plants to meet their nitrogen requirements.<br><br><br>
      In nature, the amound of nitrogen-containing compounds (plant food) is limited, requiring fertiliser.<br><br><br>
      The Haber-Bosch process revolutionized agriculture by industrializing nitrogen fixation, greatly boosting agricultural productivity.<br><br><br>
      However, each year 200 million tonnes of reactive nitrogen is lost to the environment.
    </div>
</div>

<div class="homepage-bg-img2"></div>

    <div class="homepage-content-img3 homepage-elements reveal" id="homepage-content-img3"></div>

    <div class="homepage-content3 homepage-elements reveal">
      The Nitrogen Crisis
    </div>

  <div class="homepage-bg-img3"></div>

  <div class="homepage-content-img4 homepage-elements reveal" id="homepage-content-img4"></div>
  <div class="homepage-content-img5 homepage-elements reveal" id="homepage-content-img5"></div>
  <div class="homepage-content4 homepage-elements reveal" id="homepage-content4">
    <div class="homepage-subtitle-style">
        Over-fertilization
    </div>
    <div class="homepage-contents-style" style="margin-top:10px;">
      The Netherlands grapples with a crippling nitrogen crisis with over 80% of ammonia emissions coming from over-fertilization.
    </div>
</div>
<div class="homepage-content5 homepage-elements reveal" id="homepage-content18">
  <div class="homepage-subtitle-style">
      Eutrophication
  </div>
  <div class="homepage-contents-style" style="margin-top:10px;">
    Excessive ammonia enrichment promotes uncontrolled algal blooms in water bodies causing eutrophication, which leads to loss of biodiversity.
  </div>
</div>


    <div class="homepage-content6 homepage-elements reveal">
      What if plants could fix their own nitrogen?
  </div>
<div class="homepage-bg-img4"></div>
<div class="homepage-content7 homepage-elements reveal">
  <div class="homepage-contents-style" style="margin-top:0px;">
    We could reduce up to 2% of global CO2 emissions from synthetic fertilizer production.
  </div>
</div>
<div class="homepage-content-img6 homepage-elements reveal" id="homepage-content-img6"></div>
<div class="homepage-content8 homepage-elements reveal">
  <div class="homepage-contents-style">
    We could reduce nitrogen emissions, prevent eutrophication, and protect biodiversity while sustaining agricultural productivity.
  </div>
</div>
<div class="homepage-content9 homepage-elements reveal">
  iGEM TU Delft <br>
  introduces
</div>
<div class="homepage-content-img7"></div>

<div class="homepage-content10 homepage-elements">
  <div class="homepage-contents-style2" style="margin-top:0px;text-align:center;">
      Laying the foundation for nitrogen fixation.
  </div>
</div>


<div class="homepage-content-img8 homepage-elements reveal" id="homepage-content-img8"></div>
<div class="homepage-content-img9 homepage-elements reveal" id="homepage-content-img9"></div>
<div class="homepage-content-img10 homepage-elements reveal" id="homepage-content-img10"></div>
<div class="homepage-content-img11 homepage-elements reveal" id="homepage-content-img11"></div>

<div class="homepage-content11 homepage-elements reveal" id="homepage-content11">
  <div class="homepage-subtitle-style">
      <strong><i>Braarudosphaera bigelowii</i></strong>
  </div>
  <div class="homepage-contents-style">
    Earlier this year, a new organelle, the nitroplast was discovered in the marine alga <strong><i>Braarudosphaera bigelowii</i></strong>.
  </div>
</div>

<div class="homepage-content12 homepage-elements reveal" id="homepage-content12">
  <div class="homepage-subtitle-style">
      UCYN-A
  </div>
  <div class="homepage-contents-style" style="margin-top:10px;">
      This organelle was originally a bacterium named UCYN-A, and eventually became an organelle in <strong><i>B. bigelowii</i></strong> through endosymbiosis.
  </div>
</div>

<div class="homepage-content13 homepage-elements reveal" id="homepage-content13">
  <div class="homepage-subtitle-style">
      Nitrogen fixation
  </div>
  <div class="homepage-contents-style" style="width:304px;">
      What makes it the first of its kind, is its ability to fixate atmospheric nitrogen!
  </div>
</div>

<div class="homepage-content14 homepage-elements reveal" id="homepage-content14">
  <div class="homepage-subtitle-style">
      Nitrogen-fixing eukaryotes
  </div>
  <div class="homepage-contents-style">
      We aim to transplant nitroplasts from <strong><i>B. bigelowii</i></strong> into other cells to create nitrogen-fixing eukaryotes.
  </div>
</div>
<div class="homepage-content15 homepage-elements reveal" style="opacity: 1;">
  <span>The roadmap to nitrogen-fixing eukaryotes</span>
</div>

<div class="homepage-link1 homepage-elements reveal" style="opacity: 1;">
  <a href="software" onmouseover="expandFunc1(document.getElementById('homepage-link-img1'))" onmouseout="reduceFunc1(document.getElementById('homepage-link-img1'))">
      <div class="homepage-link-img1" id="homepage-link-img1" style="background-size: 91%;"></div>
      <span class="homepage-link-style" style="margin-left:30px;">Characterize the UCYN-A transport system in the dry lab</span>
  </a>
</div>
<div class="homepage-link2 homepage-elements reveal" style="opacity: 1;">
  <a onmouseover="expandFunc2(document.getElementById('homepage-link-img2'))" onmouseout="reduceFunc2(document.getElementById('homepage-link-img2'))">
      <div class="homepage-link-img2" id="homepage-link-img2" style="background-size: 91%;"></div>
      <span class="homepage-link-style" style="margin-left:30px;">Express essential proteins in the host</span>
     </a>
</div>

<div class="homepage-link3 homepage-elements reveal" style="opacity: 1;">
  <a onmouseover="expandFunc3(document.getElementById('homepage-link-img3'))" onmouseout="reduceFunc3(document.getElementById('homepage-link-img3'))">
      <div class="homepage-link-img3" id="homepage-link-img3" style="background-size: 91%;"></div>
      <span class="homepage-subtitle-style" style="margin-left:30px;">Regulate cell division</span>
      <span style="width:15px;height:15px;"><img src="https://static.igem.wiki/teams/4594/wiki/link-image4.png" alt=">"></span>
  </a>
</div>


<canvas id="tutorial"></canvas>
</div>
  
<script src="{{ url_for('static', filename = 'homepage.js') }}" type="text/javascript"></script>

<script src="{{ url_for('static', filename = 'homepage-animation.js') }}" type="text/javascript"></script>




{% endblock %}