-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathsustainability.html
138 lines (118 loc) · 6.93 KB
/
sustainability.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
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>CliMATES</title>
<link rel="stylesheet" href="style.css">
<link rel="icon" href="gif/global-warming.gif">
</head>
<body>
<nav>
<span class="logo-container">
<a href="index.html"><img src="img/logo.png" alt="CliMATES Logo"></a>
</span>
<div class="nav-items">
<ul>
<li><a href="index.html">home</a></li>
<li><a href="about.html">about</a></li>
<li>
<a href="information.html">information</a>
<div class="dropdown">
<ul>
<li><a href="climate-change.html">🌍🌡️climate change </a></li>
<li><a href="carbon-footprint.html">👣 carbon footprint </a></li>
<li><a href="sustainability.html">♻️ sustainability </a></li>
</ul>
</div>
</li>
<li><a href="donation.html">donation</a></li>
</ul>
</div>
</nav>
<div class="mobile-nav">
<div class="mobile-nav-logo">
<img src="img/logo.png" alt="">
</div>
<div class="mobile-links">
<ul>
<li><a href="index.html">home</a></li>
<li><a href="about.html">about</a></li>
<li><a href="information.html">information</a></li>
<li><a href="donation.html">donation</a></li>
</ul>
</div>
</div>
<div class="sustain-section">
<div class="sustain-section-img">
<img src="gif/Sustain.gif" alt="">
</div>
<div class="sustain-section-header">
<h2>Sustainability</h2>
</div>
<div class="sustain-section-img">
<img src="gif/Sustain.gif" alt="">
</div>
</div>
<div class="sustain-section-one">
<div class="sustain-section-one-text">
<p>
We burn fossil fuels to get energy which pollutes the air and causes acid rain, pollution, and damage to plants and animals.
</p>
</div>
<div class="sustain-section-one-img">
<img src="img/oil rig.jpg" alt="" style="border-radius: 30px;">
</div>
</div>
<div class="sustain-section-two">
<div class="sustain-section-two-img">
<img src="gif/water mill.gif" alt="" ">
</div>
<div class="sustain-section-two-text">
<p>
Hydro Power is the most widely used sustainable power source and has a global installed hydroelectric capacity of 1,295 gigawatts in 2020. It generates energy by driving turbines using the water flow from rivers or making water fall through them with a pumped-storage.
</p>
</div>
</div>
<div class="sustain-section-three">
<div class="sustain-section-one-text">
<p>
Wind Power is the second most widely used sustainable energy source and has a global installed wind power capacity of 837 gigawatts in 2022. Instead of using energy to make wind like a fan, we generate energy from the wind using wind turbines.
</p>
</div>
<div class="sustain-section-one-img">
<img src="gif/wind turbine.gif" alt="">
</div>
</div>
<div class="sustain-section-four">
<div class="sustain-section-four-img">
<img src="gif/solar energy.gif" alt="">
</div>
<div class="sustain-section-two-text">
<p>
Solar energy is third most widely used energy source and has more than 486 gigawatts back in 2020. It works by converting sunlight from the sun into electricity through photovoltaic (PV) panels or mirrors which concentrate the rays. Nowadays, Solar Power is trending and is seeing more popularity than other methods.
</p>
</div>
</div>
<div class="footer-container">
<div class="footer-logo">
<img src="img/logo purple.png" alt="">
</div>
<div class="footer-text">
<p>copyright© climates.com 2022</p>
</div>
<div class="footer-icon">
<a href="#">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.1.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M504 256C504 119 393 8 256 8S8 119 8 256c0 123.78 90.69 226.38 209.25 245V327.69h-63V256h63v-54.64c0-62.15 37-96.48 93.67-96.48 27.14 0 55.52 4.84 55.52 4.84v61h-31.28c-30.8 0-40.41 19.12-40.41 38.73V256h68.78l-11 71.69h-57.78V501C413.31 482.38 504 379.78 504 256z"/></svg>
</a>
<a href="#">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Pro 6.1.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M224.1 141c-63.6 0-114.9 51.3-114.9 114.9s51.3 114.9 114.9 114.9S339 319.5 339 255.9 287.7 141 224.1 141zm0 189.6c-41.1 0-74.7-33.5-74.7-74.7s33.5-74.7 74.7-74.7 74.7 33.5 74.7 74.7-33.6 74.7-74.7 74.7zm146.4-194.3c0 14.9-12 26.8-26.8 26.8-14.9 0-26.8-12-26.8-26.8s12-26.8 26.8-26.8 26.8 12 26.8 26.8zm76.1 27.2c-1.7-35.9-9.9-67.7-36.2-93.9-26.2-26.2-58-34.4-93.9-36.2-37-2.1-147.9-2.1-184.9 0-35.8 1.7-67.6 9.9-93.9 36.1s-34.4 58-36.2 93.9c-2.1 37-2.1 147.9 0 184.9 1.7 35.9 9.9 67.7 36.2 93.9s58 34.4 93.9 36.2c37 2.1 147.9 2.1 184.9 0 35.9-1.7 67.7-9.9 93.9-36.2 26.2-26.2 34.4-58 36.2-93.9 2.1-37 2.1-147.8 0-184.8zM398.8 388c-7.8 19.6-22.9 34.7-42.6 42.6-29.5 11.7-99.5 9-132.1 9s-102.7 2.6-132.1-9c-19.6-7.8-34.7-22.9-42.6-42.6-11.7-29.5-9-99.5-9-132.1s-2.6-102.7 9-132.1c7.8-19.6 22.9-34.7 42.6-42.6 29.5-11.7 99.5-9 132.1-9s102.7-2.6 132.1 9c19.6 7.8 34.7 22.9 42.6 42.6 11.7 29.5 9 99.5 9 132.1s2.7 102.7-9 132.1z"/></svg>
</a>
<a href="#">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><!--! Font Awesome Pro 6.1.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M549.655 124.083c-6.281-23.65-24.787-42.276-48.284-48.597C458.781 64 288 64 288 64S117.22 64 74.629 75.486c-23.497 6.322-42.003 24.947-48.284 48.597-11.412 42.867-11.412 132.305-11.412 132.305s0 89.438 11.412 132.305c6.281 23.65 24.787 41.5 48.284 47.821C117.22 448 288 448 288 448s170.78 0 213.371-11.486c23.497-6.321 42.003-24.171 48.284-47.821 11.412-42.867 11.412-132.305 11.412-132.305s0-89.438-11.412-132.305zm-317.51 213.508V175.185l142.739 81.205-142.739 81.201z"/></svg>
</a>
</div>
</div>
</body>
</html>