Web-Page/content_ST3.html at main · AvaneeshKesavan/Web-Page · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Life Below Water - Human Impact </title>
    <link rel="icon" type="image/x-icon" href="/images/global/favicon.ico">
    <link rel="stylesheet" href="css/global.css">
    <link rel="stylesheet" href="css/content.css">
    <style>
        .hero-section {
            background: url("images/content/Cover_humanImpact.jpeg") no-repeat center center/cover;
            position: relative;
            background-attachment: fixed;
            color: rgb(255, 255, 255);
            text-align: center;
            padding: 10% 0;
        }
    </style>
</head>

<body>
    <!-- Main Navigation Bar -->
    <header class="main-nav">
        <div class="nav-top">
            <div class="logo">
                <a href="home.html">
                    <img src="images/global/logo.png" alt="TECHASTRIS">
                </a>
            </div>
            <div class="hamburger-menu" id="hamburger-menu">☰</div>
            <nav id="nav-links">
                <ul>
                    <li><a href="home.html">Home</a></li>
                    <li><a href="about.html">About Us</a></li>
                    <li><a href="home.html#gallery">Overview</a></li>
                    <li><a href="volunteer.html">Volunteer</a></li>
                    <li><a href="teampage.html">Team</a></li>
                    <li><button id="search-expand">🔍</button></li>
                </ul>
            </nav>
        </div>
        <a href="profile.html"><img src="images/global/profile_icon.ico" alt="profile" class="profile-icon"></a>
        <button id="themeToggle" class="theme-button"></button>
        <!-- Search Bar (Hidden Initially) -->
        <div class="search-container" id="search-bar">
            <input type="text" placeholder="Search">
            <button id="search-btn">Search</button>
            <button id="close-search">✖</button>
        </div>
    </header>

    <!-- Hero Section -->
    <div class="hero-section">
        <div class="hero-section-text">
            <div class="heading-section">
                <h1 id="heading">Human Impact</h1>
            </div>
        </div>
    </div>

    <button class="toggle-btn">☰</button>
    <div class="side-navbar">
        <h3>Quick Links</h3>
        <ul>
            <li><a href="#introduction">Introduction</a></li>
            <li><a href="#pollution">Pollution and Contamination of Aquatic Ecosystems</a></li>
            <li><a href="#Overexploitation">Overexploitation of Marine Resources</a></li>
            <li><a href="#climate">Climate Change Impacts on Underwater Environments</a></li>
            <li><a href="#">Back to Top</a></li>
        </ul>
    </div>

    <div id="content">
        <div class="container">

            <h2 id="introduction" class="section">Introduction</h2>
            <p>The Earth's oceans and freshwater ecosystems, covering over 70% of the Earth's surface,
                are valuable but vulnerable resources supporting biodiversity while providing essential services—oxygen,
                climate control, food,
                and economic opportunities for billions. While they are subject to critique, these ecosystems are under attack as never before
                by human activities
                that have been made worse since the industrial revolution. The UN's Sustainable Development Goal 14
                recognizes that safeguarding
                water environments is crucial to human progress. This essay discusses three most critical factors of human
                influence: pollution,
                overexploitation of resources, and the impact of climate change. An understanding of these linked issues is
                important to develop
                solutions that safeguard life underwater and, by association, life on our planet.
                <br><br>
                <img src="images/content/Intro_humanimpact.jpeg" alt="Introduction">
            </p>

            <h2 id="pollution" class="section">Pollution and Contamination of Aquatic Ecosystems</h2>
            <p>Pollution is perhaps the most overt human impact on underwater ecosystems. Approximately 11
                million metric tons
                of plastic enter the oceans annually—a figure set to triple by 2040 if large-scale
                intervention.
                Once they have entered marine ecosystems, plastics disintegrate into microplastics and nanoplastics, which have been
                discovered
                from the deepest ocean trenches to remote Arctic ice. These particles persist for centuries and are
                ingested by marine organisms
                at all trophic levels, inflicting physical harm and serving as carriers of harmful chemicals that can
                bioaccumulate in marine food webs.
                <br><br>
                Chemical pollution injects a cocktail of toxic compounds into aquatic systems.
                Drugs modify reproductive patterns
                in fish and other species even at very low doses. Heavy metals accumulate in ocean
                tissues, causing neurological damage
                and reproductive failures. Agricultural runoff creates coastal "dead zones" through
                eutrophication—excessive nutrient loading that triggers
                harmful algal blooms, reduces oxygen levels, and establishes uninhabitable conditions for most marine life.
                <br><br>
                Oil pollution, though less chronic than plastic or chemical contamination, causes devastating acute
                impacts when spills occur.
                Major disasters like the Deepwater Horizon blowout in 2010 demonstrate the catastrophic potential of
                such activities.
                Less conspicuous threats are shipping, construction, and military noise pollution, which
                interferes
                the essential acoustical communications of many ocean species, and light pollution that disorients
                sea turtles, seabirds
                and other species that are reliant upon natural photic signals to migrate and reproduce.

                .
                <br><br>
                <img src="images/content/pollution.jpeg"
                    alt="Pollution and Contamination of Aquatic Ecosystems">
            </p>

            <h2 id="Overexploitation" class="section">Overexploitation of Marine Resources</h2>
            <p>The human relationship with marine resources has transformed dramatically in recent decades.
                Industrial fishing technologies—including factory trawlers, extensive longlines, and sophisticated
                sonar—have effectively
                industrialized what was once a relatively low-impact activity. Global fish catch increased fivefold
                between 1950
                and 1990 before plateauing and beginning a gradual decline despite increasing fishing effort. According
                to the Food and Agriculture Organization,
                34.2% of fish stocks are now fished at biologically unsustainable levels, with another 59.6% maximally
                sustainably fished.
                <br><br>
                Particularly concerning is the phenomenon of "fishing down the food web," where higher-value predatory
                species are depleted first,
                forcing fishing operations to target progressively smaller species at lower trophic levels. This cascade
                fundamentally alters marine
                ecosystem structure and resilience. The collapse of Atlantic cod in the early 1990s exemplifies these
                dynamics;
                despite a moratorium on commercial fishing since 1992, the population has shown minimal recovery.
                <br><br>
                Deleterious fishing methods add to overfishing through harming sea habitats. Bottom
                trawling—pulling weighted nets
                along the seafloor—effectively clear-cuts underwater terrain, wiping out long-living corals, sponges,
                and other organisms taking part in shaping the habitat.
                Incidental catches—bycatch—of non-target organisms are another challenge, with maybe
                40% of sea catch going to waste worldwide,
                like vulnerable sea turtles, marine mammals, and seabirds.
                <br><br>
                Beyond fishing, emerging industries like deep-sea mining threaten unique benthic ecosystems
                characterized by extremely high endemism
                and low disturbance resilience. Researchers warn that such activities could result in unprecedented
                biodiversity loss in widely unexplored
                environments.

                <br><br>
                <img src="images/content/overexploitation.jpeg"
                    alt="Overexploitation of Marine Resources">
            </p>

            <h2 id="climate" class="section">Climate Change Impacts on Underwater Environments</h2>
            <p>Climate change is arguably the most significant human influence on life in the water, impacting all
                ocean basin
                and aquatic ecosystems on the planet. Over 90% of anthropogenic global warming's excess heat has been
                absorbed by the oceans,
                resulting in an average warming of 0.13°C per decade of the uppermost 75 meters of water since
                1971. This warming forces
                species to extend their range poleward or into deeper waters when able, and sessile organisms and
                mobility-limited species
                face severe adaptation challenges.
                <br><br>
                Coral reef ecosystems are instances of the oceans' destructive force of global warming. When water temperatures exceed corals' thermal tolerance,
                they eject their symbiotic algal partners through a process known as bleaching. The Earth has experienced three planetary
                coral bleaching incidents since 1998,
                with the 2014-2017 incident impacting 70% of coral reefs globally. Models indicate that even if global
                warming is limited to 1.5°C
                compared to preindustrial levels, 70-90% of tropical coral reefs will be gone by 2100.
                <br><br>
                Ocean acidification through uptake of anthropogenic carbon dioxide threatens calcifying
                organisms that build shells
                or calcium carbonate skeletons. Surface ocean pH has already fallen by 0.1 units since the
                pre-industrial era—a 30% increase
                in acidity—and is predicted to drop by a further 0.3-0.4 units by the year 2100 under high-emission scenarios.
                <br><br>
                Deoxygenation is a third major climate-related threat. Hotter water just has less dissolved
                oxygen, with increased thermal
                stratification reduces vertical mixing. Concurrently, warming accelerates metabolic rates in marine
                organisms, elevating their oxygen requirements.
                The area of oxygen minimum zones increased by some million cubic kilometers since mid-20th
                century.
                <br><br>
                The cumulative impact of these multiple climate stressors exceeds what would be expected from any single
                factor,
                creating synergistic effects that may push many marine ecosystems beyond tipping points from which
                recovery becomes impossible.

                <br><br>
                <img src="images/content/climate.jpeg"
                    alt="Climate Change Impacts on Underwater Environments">
            </p>
        </div>
    </div>


    <!-- Footer Section -->
    <footer class="footer">
        <a href="https://sdgs.un.org/" target="_blank">
            <div class="image-container">
                <img src="images/global/image.png" alt="Image 1">
                <img src="images/global/logo2.png" alt="Image 2">
            </div>
        </a>
        <!-- Accessibility Links in the center -->
        <div class="links">
            <a href="home.html">HOME</a>
            <a href="about.html">ABOUT US</a>
            <a href="home.html#gallery">OVERVIEW</a>
            <a href="volunteer.html">VOLUNTEER</a>
            <a href="teampage.html">TEAM</a>
            <a href="sitemap.html">SITEMAP</a>
            <a href="feedback.html">FEEDBACK</a>
            <a href="https://sdgs.un.org/goals/goal14" target="_blank">SDG</a>
        </div>

        <!-- Line below the links -->
        <hr>

        <!-- Bottom sections -->
        <div class="bottom-text">
            <div class="membership">
                <a href="table.html">Membership</a>
            </div>
            <div class="extra-links">
                <a href="#" onclick="redirect('Kevin')" class="btn">Kevin</a>
                <a href="#" onclick="redirect('Avaneesh')" class="btn">Avaneesh</a>
                <a href="#" onclick="redirect('Pangajan')" class="btn">Pangajan</a>
                <a href="#" onclick="redirect('Imayuru')" class="btn">Imayuru</a>
            </div>
            <div class="copyright">
                <p>&copy; 2025 TECHASTRIS.</p>
            </div>
        </div>
    </footer>

    <!-- JavaScript Files -->
    <script src="/js/nav-search.js"></script>
    <script src="/js/side-bar.js"></script>
    <script src="/js/redirect.js" defer></script>

</body>

</html>