-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathreality.html
461 lines (448 loc) · 32.4 KB
/
reality.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
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
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Current Climate Realities</title>
<!-- Import Bootstrap -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css" integrity="sha384-9gVQ4dYFwwWSjIDZnLEWnxCjeSWFphJiwGPXr1jddIhOegiu1FwO5qRGvFXOdJZ4" crossorigin="anonymous">
<link rel="stylesheet" href="resources/css/style.css">
<!-- Import Plotly -->
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
</head>
<body>
<!-- Navbar Section -->
<div class="sticky-top" id="pageHeader">
<h1 id="headerHeader">Climatology</h1>
<nav class="navbar navbar-expand-lg navbar-dark" id="navbar">
<!-- Navbar setup -->
<a class="navbar-brand" href="#">Navbar</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<!-- Navbar links -->
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto nav-justified w-100">
<li class="nav-item">
<a class="nav-link" href="index.html">Home </a>
</li>
<li class="nav-item">
<a class="nav-link" href="history.html">Global History</a>
</li>
<li class="nav-item active">
<a class="nav-link" href="reality.html">Current Realities <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="future.html">Possible Futures</a>
</li>
<li class="nav-item">
<a class="nav-link" href="furtherreading.html">Further Reading</a>
</li>
<li class="nav-item">
<a class="nav-link" href="sources.html">Sources</a>
</li>
<li class="nav-item">
<a class="nav-link" href="team.html">About Project</a>
</li>
</ul>
</div>
</nav>
</div>
<div class="container-fluid">
<div class="row">
<div class="col">
<h2 class="display-2">Current Climate Realities</h2>
</div>
</div>
<div class="row">
<div class="col">
<h3 class="display-3" style='text-align: left'>From Past to Present</h3>
</div>
</div>
<div class="row">
<div class="col">
<h4 class="display-4">Global Average Temperature Over the Last 100 Years</h4>
</div>
</div>
<div class="row">
<div class="col">
<blockquote class="blockquote">
<p class="mb-0">When it comes to the topic of climate change and the realities that we face, there's no better place to start than with temperature. Over the past century, the pace of industrialization has increased, as developing countries around the world rush to catch up to their more developed and affluent peers.
</p>
<br>
<p class="mb-0">From the data it is clear to see that there is a pronounced change in the global average temperatures. In some scenarios, temperatures have increased by over 2 degrees celsius, a change that would otherwise have taken thousands if not millions of years if left to natural processes.</p>
<div class='tableauPlaceholder' id='viz1531109785181' style='position: relative'>
<noscript>
<a href='#'>
<img alt='Dashboard 1 ' src='https://public.tableau.com/static/images/Gl/GlobalAverageTemperatureChange1910v2010/Dashboard1/1_rss.png' style='border: none' />
</a>
</noscript>
<object class='tableauViz' style='display:none;'>
<param name='host_url' value='https%3A%2F%2Fpublic.tableau.com%2F' />
<param name='embed_code_version' value='3' />
<param name='site_root' value='' />
<param name='name' value='GlobalAverageTemperatureChange1910v2010/Dashboard1' />
<param name='tabs' value='no' />
<param name='toolbar' value='yes' />
<param name='static_image' value='https://public.tableau.com/static/images/Gl/GlobalAverageTemperatureChange1910v2010/Dashboard1/1.png' />
<param name='animate_transition' value='yes' />
<param name='display_static_image' value='yes' />
<param name='display_spinner' value='yes' />
<param name='display_overlay' value='yes' />
<param name='display_count' value='yes' />
<param name='filter' value='publish=yes' />
</object>
</div>
<script type='text/javascript'>
var divElement = document.getElementById('viz1531109785181');
var vizElement = divElement.getElementsByTagName('object')[0];
vizElement.style.minWidth = '420px';
vizElement.style.maxWidth = '1800px';
vizElement.style.width = '100%';
vizElement.style.minHeight = '587px';
vizElement.style.maxHeight = '887px';
vizElement.style.height = (divElement.offsetWidth * 0.55) + 'px';
var scriptElement = document.createElement('script');
scriptElement.src = 'https://public.tableau.com/javascripts/api/viz_v1.js';
vizElement.parentNode.insertBefore(scriptElement, vizElement);
</script>
<footer class="blockquote-footer">CO₂ and other Greenhouse Gas Emissions <cite title="Source Title"><a href="https://ourworldindata.org/co2-and-other-greenhouse-gas-emissions">Hannah Ritchie and Max Roser (2018)</a></cite></footer>
</blockquote>
</div>
</div>
</div>
<div class="container-fluid">
<div class="row">
<div class="col">
<h3 class="display-3" style='text-align: left'>Storm Systems: More Storms, More Intense</h3>
</div>
</div>
<div class="row align-items-center">
<div class="col">
<h4 class="display-4">Looking at Storms in the Atlantic</h4>
<p>With the devastation from Hurricanes Harvey, Sandy, and Katrina as virtual household names in the United States, it seems only sensible to review hurricanes as part of our investigation.</p>
<blockquote class="blockquote">
<p class="mb-0">While hurricanes are a natural part of our climate system, recent research suggests that there has been an increase in intense hurricane activity in the North Atlantic since the 1970s. In the future, there may not necessarily be more hurricanes, but there will likely be more intense hurricanes that carry higher wind speeds and more precipitation as a result of global warming. The impacts of this trend are likely to be exacerbated by sea level rise and a growing population along coastlines.</p>
<br>
<p class="mb-0">Scientists are continuing to refine our understanding of how global warming affects hurricane activity. Cutting edge research is beginning to be able to attribute individual hurricanes to global warming. For example, new research estimates that as the Earth has warmed, the probability of a storm with precipitation levels like Hurricane Harvey was higher in Texas in 2017 than it was at the end of the twentieth century. Because of climate change, such a storm evolved from a once in every 100 years event to a once in every 16 years event over this time period.</p>
<footer class="blockquote-footer">Hurricanes and Climate Change, <cite title="Source Title"><a href="https://www.ucsusa.org/global-warming/science-and-impacts/impacts/hurricanes-and-climate-change.html">Union of Concerned Scientists</a></cite></footer>
</blockquote>
</div>
<div class="col">
<img class="img-responsive" src="resources/images/realities/hurricane-andrew.jpg" alt="Photo Credit: NASA" id="hurricaneAndrew">
<br>
<footer class="blockquote-footer">Photo Credit: NASA</footer>
</div>
</div>
<div class="row">
<div class="col">
<h4 class="display-4">Reviewing the Data</h4>
<p>If we look at data from NOAA, two things seem quite clear: </p>
<ol>
<li>The count of depressions, storms, and hurricanes being recorded has been steadily increasing. Even if we assume that data prior to the 1970s is potentially incomplete, we can still see a trend of increase from that point onwards.</li>
<li>The number of storms that can be considered "major hurricanes" has also been steadily increasing. The 2000s in particular showed a startling number of major hurricanes, with its total count resting at exactly 100.</li>
</ol>
</div>
</div>
<div class="row">
<div class="col">
<div class='tableauPlaceholder' id='viz1531019978431' style='position: relative'>
<noscript><a href='#'>
<img alt='Dashboard 1 ' src='https://public.tableau.com/static/images/Re/RecordedStormsbyIntensity/Dashboard1/1_rss.png' style='border: none' /></a></noscript>
<object class='tableauViz' style='display:none;'>
<param name='host_url' value='https%3A%2F%2Fpublic.tableau.com%2F' />
<param name='embed_code_version' value='3' />
<param name='site_root' value='' />
<param name='name' value='RecordedStormsbyIntensity/Dashboard1' />
<param name='tabs' value='no' />
<param name='toolbar' value='yes' />
<param name='static_image' value='https://public.tableau.com/static/images/Re/RecordedStormsbyIntensity/Dashboard1/1.png' />
<param name='animate_transition' value='yes' />
<param name='display_static_image' value='yes' />
<param name='display_spinner' value='yes' />
<param name='display_overlay' value='yes' />
<param name='display_count' value='yes' />
<param name='filter' value='publish=yes' />
</object>
</div>
<script type='text/javascript'>
var divElement = document.getElementById('viz1531019978431');
var vizElement = divElement.getElementsByTagName('object')[0];
vizElement.style.minWidth = '420px';
vizElement.style.maxWidth = '1800px';
vizElement.style.width = '100%';
vizElement.style.minHeight = '587px';
vizElement.style.maxHeight = '1027px';
vizElement.style.height = (divElement.offsetWidth * 0.65) + 'px';
var scriptElement = document.createElement('script');
scriptElement.src = 'https://public.tableau.com/javascripts/api/viz_v1.js';
vizElement.parentNode.insertBefore(scriptElement, vizElement);
</script>
<footer class="blockquote-footer">Source: National Oceanic and Atmospheric Administration, <cite title="Source Title"><a href="https://www.kaggle.com/noaa/hurricane-database">Kaggle</a></cite></footer>
</div>
</div>
<div class="row">
<div class="col">
<h5 class="display-5">Storm Categorization for the North Atlantic</h5>
<p>A tropical depression forms when a low pressure area is accompanied by thunderstorms that produce a circular wind flow with maximum sustained winds below 39 mph. An upgrade to a tropical storm occurs when cyclonic circulation becomes more organized and maximum sustained winds gust between 39 mph and 73 mph.</p>
<footer class="blockquote-footer">Source: NASA, <cite title="Source Title"><a href="https://pmm.nasa.gov/education/content/what-difference-between-tropical-storm-and-tropical-depression">Precipitation Education</a></cite></footer>
<br>
<p>Beyond that, storms are categorized by their sustained wind speed.</p>
<table class="table">
<thead>
<tr>
<th scope="col">Storm Type</th>
<th scope="col">Wind Speed (Knots)</th>
</tr>
</thead>
<tbody>
<tr style="background-color: #d6d4d4">
<td>Tropical Depression</td>
<td>Less than 29</td>
</tr>
<tr style="background-color: #78CBCF">
<td>Tropical Storm</td>
<td>30-55</td>
</tr>
<tr style="background-color: #7B7D4E">
<td>Category 1 Hurricane</td>
<td>56-72</td>
</tr>
<tr style="background-color: #800080">
<td>Category 2 Hurricane</td>
<td>73-83</td>
</tr>
<tr style="background-color: #D40040">
<td>Category 3 Major Hurricane</td>
<td>84-98</td>
</tr>
<tr style="background-color: #DF9D4F">
<td>Category 4 Major Hurricane</td>
<td>99-119</td>
</tr>
<tr style="background-color: #A42C2E">
<td>Category 5 Major Hurricane</td>
<td>Greater than 120</td>
</tr>
</tbody>
</table>
<footer class="blockquote-footer"><a href="https://en.wikipedia.org/wiki/Tropical_cyclone">Wikipedia</a></footer>
</div>
</div>
<div class="row">
<div class="col">
<h5 class="display-5">About the National Hurricane Center & the Dataset</h5>
</div>
</div>
<div class="row">
<div class="col">
<blockquote class="blockquote">
<p class="mb-0">The National Hurricane Center (NHC) conducts a post-storm analysis of each tropical cyclone in the Atlantic basin...and the North Pacific Ocean to determine the official assessment of the cyclone's history. This [dataset] makes use of all available observations, including those that may not have been available in real time.</p>
<br>
<p class="mb-0">In addition, NHC conducts ongoing reviews of any retrospective tropical cyclone analyses brought to its attention and on a regular basis updates the historical record to reflect changes introduced. Content The NHC publishes the tropical cyclone historical database in a format known as HURDAT, short for HURricane DATabase... [which] contain six-hourly information on the location, maximum winds, central pressure, and (starting in 2004) size of all known tropical cyclones and subtropical cyclones.</p>
<footer class="blockquote-footer">NOAA, <cite title="Source Title"><a href="https://www.kaggle.com/noaa/hurricane-database/home">Kaggle</a></cite></footer>
</blockquote>
</div>
</div>
</div>
<div class="container-fluid">
<div class="row">
<div class="col">
<h3 class="display-3" style='text-align: left'>Air Quality & Pollution: A Legislative Success Story</h3>
<h4 class="display-4">The History of the Clean Air Act</h4>
</div>
</div>
<div class="row align-items-center" style="background-color: black; color: white">
<div class="col" style="height:400px; width:auto">
<div id="pollutionQuote">
<blockquote class="blockquote">
<p class="mb-0">
"A blanket of warm air covered the city yesterday, trapping pollutants and sending the air-pollution index close to the danger mark. Officials warned persons with heart, lung or respiratory ailments to stay indoors.
</p>
<br>
<p class="mb-0">
From 6 A.M. to 10 A.M., the amount of sulfur dioxide, carbon monoxide and dust-carrying haze was so high that [they were] on the verge of calling the first-alert stage of the city's air pollution system. [...] [T]he pollution count was possibly the highest in the city's history."
</p>
<br>
<p class="mb-0">
"The health warning came from Dr. Aaron D. Chaves, director of the Health Department's Bureau of Tuberculosis. Mindful of the 10-day period of stagnant weather in November, 1963, when 170 to 260 deaths here were attributed to air pollution..."
</p>
<footer class="blockquote-footer">November 25, 1966; <cite title="Source Title">The New York Times</cite></footer>
</blockquote>
</div>
</div>
<div class="col">
<div class="carousel slide" data-ride="carousel" id="carousel">
<ol class="carousel-indicators">
<li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="3"></li>
</ol>
<div class="carousel-inner" id="carousel">
<div class="carousel-item active">
<img class="d-block" src="resources/images/realities/hudson-river.gif" alt="First slide">
</div>
<div class="carousel-item">
<img class="d-block" src="resources/images/realities/manhattan-skyline.gif" alt="Second slide">
</div>
<div class="carousel-item">
<img class="d-block" src="resources/images/realities/los-angeles-smog.gif" alt="Third slide">
</div>
<div class="carousel-item">
<img class="d-block" src="resources/images/realities/san-gabriel-smog.gif" alt="Third slide">
</div>
</div>
<!-- Controls for carousel-->
<a class="carousel-control-prev" href="#carousel" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carousel" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
<footer class="blockquote-footer">Photo Credit: National Archives Catalog (See Source Page for Full Photo Details)</footer>
</div>
</div>
<div class="row">
<div class="col">
<p>Starting in 1930, a series of deadly events related to air pollution "forced the world to face the dangers of air pollution and inspired an ongoing movement for cleaner air."</p>
<ul id="normalList">
<li><strong>1930: Liege, Belgium --</strong> Deadly smog kills at least 60 people</li>
<li><strong>1948: Donora, Pennsylvania, US --</strong> Deadly smog kills approximately 20 people</li>
<li><strong>1952: London, Great Britian --</strong> Deadly smog later known as the "Great Smog" covers the city for four days, resulting in approximately 12,000 deaths that winter</li>
</ul>
<p>Starting with the Clean Air Act in 1970, the United States passed a series of laws that established government regulations for a variety of pollutants. The Clean Air Act itself was amended a number of times. In addition, the EPA began creating and revising regulations that targeted different sources of pollution.</p>
<footer class="blockquote-footer">Source: Smithsonian Magazine <cite title="Source Title"><a href="https://www.smithsonianmag.com/science-nature/the-long-fight-against-air-pollution-21017286/">Smithsonian.com</a></cite></footer>
</div>
</div>
</div>
<div class="container-fluid">
<div class="row">
<div class="col">
<h4 class="display-4">Reviewing the Last 30 Years in the US</h4>
<p>Since the creation of the EPA and the passing of the Clean Air Act in 1970, we have seen steady declines in unhealthy days and steady increases in good and moderate days in the most highly polluted areas of the United States. Upon reviewing the history of various regulations, it seems reasonable to say that the acceleration of innovation in response to environmental regulations made a positive impact in improving air quality in the United States over the last fifty years.</p>
<p>However, while there seems to be a consistent trend of improvement <b>overall</b>, as can be seen in the trend lines displayed on the chart below, it's important to note that the annual measurements in each county are not always consistent with those trends and the possible reasons why this would happen.</p>
<blockquote class="blockquote">
<p class="mb-0">In many U.S. communities, AQI values are usually below 100, with higher values occurring just a few times a year. Larger cities typically have more air pollution than smaller cities, so their AQI values may exceed 100 more often. AQI values higher than 200 are infrequent, and AQI values above 300 are extremely rare—they generally occur only during events such as forest fires.
</p><br>
<p class="mb-0">AQI values can vary from one season to another. In winter, carbon monoxide may be high in some areas because cold weather makes it difficult for car emission control systems to operate effectively. Ozone is often higher in warmer months, because heat and sunlight increase ozone formation. Particle pollution can be elevated any time of the year. AQI values also can vary depending on the time of day. Ozone levels often peak in the afternoon to early evening. Carbon monoxide may be a problem during morning or evening rush hours. And particle pollution can be high any time of day, and is often elevated near busy roadways, especially during morning or evening rush hours.</p>
<footer class="blockquote-footer">Source: United States Environmental Protection Agency, <cite title="Source Title"><a href="https://airnow.gov/index.cfm?action=aqibasics.aqi">AirNow.gov</a> & <a href="https://www3.epa.gov/airnow/aqi_brochure_02_14.pdf">AQI Brochure</a></cite></footer>
</blockquote>
<p>There are also larger events that can affect air quality. For example, decreases in California air quality in 2017 are more than likely due to the incredible scale and power of <a href="https://www.washingtonpost.com/graphics/2017/national/california-wildfires-comparison/?noredirect=on&utm_term=.11eb67632205">wildfires that year.</a></p>
<p>Beyond air quality itself, however, we must also consider the amount of days that were able to be measured. As an example, the number of days with AQI data in New Orleans during 2005 sharply decreased, likely due to Hurricane Katrina. We have attempted to account for variance in the number of days measured by normalizing the data.</p>
<p><i>Please note that because 2018 is not yet over, the sharp downward turns at the end of the chart are not accurate.</i></p>
<div class='tableauPlaceholder' id='viz1530753727135' style='position: relative'>
<noscript>
<a href='#'><img alt='Air Quality Over Time (1980-2018) ' src='https://public.tableau.com/static/images/AQ/AQIbyStateCountyOverTime-V2_1/Dashboard1/1_rss.png' style='border: none' /></a>
</noscript>
<object class='tableauViz' style='display:none;'>
<param name='host_url' value='https%3A%2F%2Fpublic.tableau.com%2F' />
<param name='embed_code_version' value='3' />
<param name='site_root' value='' />
<param name='name' value='AQIbyStateCountyOverTime-V2_1/Dashboard1' />
<param name='tabs' value='no' />
<param name='toolbar' value='yes' />
<param name='static_image' value='https://public.tableau.com/static/images/AQ/AQIbyStateCountyOverTime-V2_1/Dashboard1/1.png' />
<param name='animate_transition' value='yes' />
<param name='display_static_image' value='yes' />
<param name='display_spinner' value='yes' />
<param name='display_overlay' value='yes' />
<param name='display_count' value='yes' />
<param name='filter' value='publish=yes' />
</object>
</div>
<script type='text/javascript'>
var divElement = document.getElementById('viz1530753727135');
var vizElement = divElement.getElementsByTagName('object')[0];
if (divElement.offsetWidth > 800) {
vizElement.style.minWidth = '420px';
vizElement.style.maxWidth = '1800px';
vizElement.style.width = '100%';
vizElement.style.minHeight = '587px';
vizElement.style.maxHeight = '887px';
vizElement.style.height = (divElement.offsetWidth * 0.50) + 'px';
} else if (divElement.offsetWidth > 500) {
vizElement.style.minWidth = '420px';
vizElement.style.maxWidth = '1800px';
vizElement.style.width = '100%';
vizElement.style.minHeight = '587px';
vizElement.style.maxHeight = '887px';
vizElement.style.height = (divElement.offsetWidth * 0.55) + 'px';
} else {
vizElement.style.width = '100%';
vizElement.style.height = '794px';
}
var scriptElement = document.createElement('script');
scriptElement.src = 'https://public.tableau.com/javascripts/api/viz_v1.js';
vizElement.parentNode.insertBefore(scriptElement, vizElement);
</script>
</div>
</div>
<div class="row">
<div class="col">
<h5 class="display-5">Understanding the EPA AQI Scale</h5>
<p>EPA calculates the AQI for five major air pollutants regulated by the Clean Air Act:</p>
<ol>
<li>ground-level ozone</li>
<li>particle pollution (also known as particulate matter)</li>
<li>carbon monoxide</li>
<li>sulfur dioxide</li>
<li>nitrogen dioxide</li>
</ol>
<p>For each of these pollutants, EPA has established national air quality standards to protect public health.</p>
<p>The AQI is divied into six categories:</p>
<table class="table">
<thead>
<tr>
<th scope="col">AQI</th>
<th scope="col">Numerical Value</th>
<th scope="col">Description</th>
</tr>
</thead>
<tbody>
<tr style="background-color: #6FA754">
<td>Good</td>
<td>0-50</td>
<td>Air quality is considered satisfactory, and air pollution poses little or no risk.</td>
</tr>
<tr style="background-color: #78CBCF">
<td>Moderate</td>
<td>51-100</td>
<td>Air quality is acceptable; however, for some pollutants there may be a moderate health concern for a very small number of people who are unusually sensitive to air pollution.</td>
</tr>
<tr style="background-color: #DF9D4F">
<td>Unhealthy for Sensitive Groups</td>
<td>101-150</td>
<td>Members of sensitive groups may experience health effects. The general public is not likely to be affected.</td>
</tr>
<tr style="background-color: #D40040">
<td>Unhealthy</td>
<td>151-200</td>
<td>Everyone may begin to experience health effects; members of sensitive groups may experience more serious health effects.</td>
</tr>
<tr style="background-color: #800080">
<td>Very Unhealthy</td>
<td>201-300</td>
<td>Health alert: everyone may experience more serious health effects.</td>
</tr>
<tr style="background-color: #A42C2E">
<td>Hazardous</td>
<td>301-500</td>
<td>Health warnings of emergency conditions. The entire population is more likely to be affected.</td>
</tr>
</tbody>
</table>
<footer class="blockquote-footer">Source: United States Environmental Protection Agency, <cite title="Source Title"><a href="https://airnow.gov/index.cfm?action=aqibasics.aqi">AirNow.gov</a> & <a href="https://www3.epa.gov/airnow/aqi_brochure_02_14.pdf">AQI Brochure</a></cite></footer>
</div>
</div>
</div>
<!-- Import stuff that Bootstrap needs-->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js" integrity="sha384-cs/chFZiN24E4KMATLdqdvsezGxaGsi4hLGOzlXwp5UZB1LY//20VyM2taTB4QvJ" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js" integrity="sha384-uefMccjFJAIv6A+rW+L4AHf99KvxDjWSu1z9VI8SKNVmz4sk7buKt/6v9KI65qnm" crossorigin="anonymous"></script>
</body>
</html>