-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathproblem.html
64 lines (58 loc) · 4.07 KB
/
problem.html
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
<!DOCTYPE>
<html>
<head>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-KK94CHFLLe+nY2dmCWGMq91rCGa5gtU4mk92HdvYe+M/SXH301p5ILy+dN9+nJOZ" crossorigin="anonymous">
<script src="https://unpkg.com/typed.js@2.0.15/dist/typed.umd.js"></script>
<link rel = "stylesheet" href = "problem.css">
<title>CleanCurrent</title>
<script src = "problem.js" defer></script>
</head>
<nav class="navbar navbar-expand-sm">
<div class="container-fluid">
<a id = "home" class="navbar-brand" href="javascript:void(0)"><img src = "./images/logo.png" alt = "Logo" style = "width:40px;"> <strong style="color:gray">CleanCurrent</strong></a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#mynavbar">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="mynavbar">
<ul class="navbar-nav mr-auto">
<li class="nav-item">
<a id = "product"class="nav-link" href="javascript:void(0)"><strong>THE PROBLEM</strong></a>
</li>
<li class="nav-item">
<a id = "product"class="nav-link" href="javascript:void(0)"><strong>PRODUCT</strong></a>
</li>
<li class="nav-item">
<a id = "other" class="nav-link" href="javascript:void(0)"><strong>OTHER</strong></a>
</li>
</ul>
</div>
</div>
</nav>
<div id = "content">
<div class = "container">
<h1 style="font-size: 500%;" id = "problemTitle"><strong>The Problem</strong></h1>
<h3>Differentiating between what is recyclable and what is not is a challenge at times</h3>
<section class="border-bottom mb-4">
</section>
<div id = "desc">
<img src="https://calrecycle.ca.gov/wp-content/uploads/sites/39/2021/12/bevconhome.jpg?emrc=9e9e40" class="img-fluid shadow-2-strong rounded-5 mb-4" id = "blogImg">
<div class = "vertical">
<h1><strong>Recycling</strong></h1>
<p class ="text"><br>Generally, people don't know what's recyclable and what isn't. Even for adults, throwing waste away often results in human error. The average human produces around 6 pounds of trash and recycle per day. A large chunk of plastics with recyclable potential end up in the landfill and these landfills often leak into the ocean. </p>
</div>
</div>
<div id = "desc">
<div class = "vertical">
<h1 class = "problemText"><strong>Continued...</strong></h1>
<p class ="text problemText"><br>These harmful plastics that end up in the ocean spread out due to ocean currents and pollute a variety of ecosystems. Studies have shown that around 100 million marine animals die from plastic waste every year with hundreds of thousands dying from entanglement. Marine biologists have also conducted several studies showing high levels of microplastics in canned tuna. These microplastics roaming through oceanic ecosystems and lifeforms have an effect on humans as well. Since coastal communities often rely on oceanic resources, trash and other pollution would damage the quality of life. This is where CleanCurrent comes in.
</p>
</div>
<img src="https://www.science.org/do/10.1126/science.aaa7848/abs/sn-plasticwasteh.jpg" style="max-width: 50%;border-radius: 10%;">
</div>
</div>
</div>
<div class = "container">
</div>
</div>
</body>
</html>