-
Mohammed Elmir authoredMohammed Elmir authored
home.html 8.67 KiB
{% extends "layout.html" %}
{% block title %}Home{% endblock %}
{% block lead %}<b>Welcome to iGEM 2023!</b> Your team has been approved and you are ready to start the iGEM season!{% endblock %}
{% block page_content %}
<!-- Body of Home Page -->
<!-- Banner section -->
<link href="{{ url_for('static', filename = 'home.css') }}" rel="stylesheet">
<section class="body_section">
<div class="banner">
<div class="animated-title">
<div class="text-top">
<div>
<span>IMPROVED DETECTION</span>
<span>CLEAN MINING</span>
</div>
</div>
<div class="text-bottom">
<div>RECYC<b style="color: #6497b1">Li</b>NG</div>
</div>
</div>
</div>
</section>
<!-- End of Banner section -->
<div class="body-container">
<div class="story-content">
<div class="line1">
<div class="img" data-aos="fade-right" data-aos-delay="900">
<img src="https://static.igem.wiki/teams/4746/wiki/boy.png" alt="">
</div>
<div data-aos="fade-left" data-aos-delay="1000" class="p1">
<h3>The Dream...</h3>
<p>In a world brimming with imagination and possibility, there lived a young boy whose spirit was fueled by boundless dreams. Meet Ethan, a curious and bright-eyed adventurer, whose mind soared with fantastical visions of a future where sleek cars glided silently along the streets, powered solely by the magic of electricity.</p>
</div>
</div>
<h3 class="breaker" data-aos="zoom-out-down" data-aos-delay="900">What Next....</h3>
<div data-aos="zoom-out-right" data-aos-delay="1000">
<div class="line2 dashed">
<p>Driven by his unwavering passion, Ethan embarked on a journey of discovery, delving into books, conducting experiments, and exploring the limitless possibilities of harnessing electricity. He spent countless hours in his makeshift laboratory, tinkering with wires, batteries, and motors, determined to unravel the secrets that lay dormant within the world of science.</p>
<div class="line2-images">
<div>
<img class="lab"src="https://static.igem.wiki/teams/4746/wiki/lab.jpg" alt="">
</div>
<div>
<img src="https://static.igem.wiki/teams/4746/wiki/lab.png" alt="">
</div>
</div>
</div>
</div>
<div class="line3" style="display: none;">
<div class="line3-content">
<div data-aos="fade-right"
data-aos-offset="300"
data-aos-easing="ease-in-sine" class="p2">
<div class="line3-header">
<h3 class="breaker2" data-aos="fade-up"
data-aos-anchor-placement="bottom-bottom">Research Research Research...</h3>
<div>
<img src="https://static.igem.wiki/teams/4746/wiki/search.png" alt="">
</div>
</div>
<p class="p-style ">Years of education and reasearch, Ethan discovered that lithium, a silvery-white alkali metal which has the capabilities of powering electric cars. The element Li was predominantly extracted from mineral-rich regions around the globe. From the arid salt flats of South America to the ancient mineral deposits in Australia, he embarked on a virtual voyage, exploring the far-reaching landscapes where lithium reserves lay hidden beneath the Earth's surface.</p>
</div>
<div class="line3-main-img" data-aos="fade-left"
data-aos-offset="300" data-aos-easing="ease-in-sine">
<img src="https://static.igem.wiki/teams/4746/wiki/research.png" alt="">
</div>
</div>
</div>
<div class="mine-animation">
<div class="container">
<div class="anim-content">
<div>
<img class="tool" src="https://static.igem.wiki/teams/4746/wiki/tool.png" alt="">
</div>
<div>
<img class="rocks" src="https://static.igem.wiki/teams/4746/wiki/rocks.png" alt="">
</div>
</div>
</div>
</div>
<h3 class="breaker" data-aos="fade-up"
data-aos-anchor-placement="bottom-bottom">Is Mining Lithium Safe...</h3>
<div class="line2 line4" data-aos="fade-left" >
<p >As the sun's gentle rays crept through Ethan's bedroom window, he awoke to a rustling sound outside his door. Curiosity piqued, he hurriedly made his way downstairs, where he discovered a neatly folded newspaper lying on the doormat. Its headline read,<b>"THE DARK SIDE OF MINING LITHIUM"</b>
With a mix of anticipation and concern, Ethan unfolded the paper, his eyes scanning the detailed exposé that painted a somber picture of the dark side of lithium extraction. The investigative report unveiled tales of devastated landscapes, polluted water sources, and dwindling biodiversity in regions scarred by rampant mining operations.</p>
<div class="line4-images" data-aos="fade-right">
<div>
<img src="./images/news.gif" alt="">
</div>
</div>
</div>
<div class="line5" style="display: none;">
<div class="img">
<img class="" src="https://static.igem.wiki/teams/4746/wiki/move.png" alt="">
</div>
<div class="sides border notes">
<h3>Let The Games Begin</h3>
<p>Empowered by a sense of purpose, Ethan's heart resonated with a calling to take action. Determined to make a meaningful impact, he set his sights on the African continent, specifically Ghana, where a beacon of hope awaited: Ashesi University.Guided by renowned professors and surrounded by like-minded researchers, Ethan embarked on an intensive exploration of synthetic biology, aiming to engineer a sustainable solution to lithium mining. Inspired by nature's own mechanisms, he envisioned harnessing the power of microorganisms to extract lithium from ores in an eco-friendly and efficient manner.</p>
</div>
</div>
<div class="line6">
<div class="">
<h3>The Mine Visit</h3>
<p class="">Ethan and the Ashesi <b>Bio Lith</b> team visited a lithium mining site in Ghana surrounded by beautiful mountains and trees. They heard a loud explosion as part of the mining process, which created a massive hole in the earth's crust, leaving the land barren and difficult to recover. Witnessing the devastating impact, they became committed to promoting sustainable mining practices and finding eco-friendly methods for lithium extraction. They aimed to ensure that technological progress and renewable energy didn't harm the environment, working towards a future where mining and nature coexist harmoniously.</p>
</div>
</div>
</div>
</div>
<div id="page">
<div class="wrapper">
<div class="bottom">
<img src="https://static.igem.wiki/teams/4746/wiki/minehole.jpg" draggable="false"/>
</div>
<div class="middle">
<img src="https://static.igem.wiki/teams/4746/wiki/bomb2.gif" alt="">
</div>
<div class="scroller scroller-middle">
<svg class="scroller__thumb" xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><polygon points="0 50 37 68 37 32 0 50" style="fill:#FFCCBC"/><polygon points="100 50 64 32 64 68 100 50" style="fill:#FFCCBC"/></svg>
</div>
<div class="top">
<img src="https://static.igem.wiki/teams/4746/wiki/lithium-mining-site.png" draggable="false"/>
</div>
<div class="scroller scroller-top">
<svg class="scroller__thumb" xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><polygon points="0 50 37 68 37 32 0 50" style="fill:#FFAB91"/><polygon points="100 50 64 32 64 68 100 50" style="fill:#FFAB91"/></svg>
</div>
</div>
</div>
{% endblock %}