forked from akshay-anil22/nasa-pace
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
157 lines (147 loc) · 5.06 KB
/
index.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>PACE Mission</title>
<link rel="stylesheet" href="pacehome.css" />
<link rel="stylesheet" href="header.css" />
</head>
<body>
<!-- Header Section -->
<header>
<div class="container">
<h1>P.A.C.E</h1>
<nav class="navbar">
<ul>
<li>
<a href="#overview" class="nav-item">Mission Overview</a>
</li>
<li><a href="#objectives" class="nav-item">Objectives</a></li>
<li><a href="#instruments" class="nav-item">Instruments</a></li>
<li><a href="#data-impact" class="nav-item">Data & Impact</a></li>
<li><a href="#quiz" class="nav-item">Quiz</a></li>
<li><a href="#resources" class="nav-item">Resources</a></li>
</ul>
</nav>
</div>
</header>
<!-- Hero Section -->
<section class="hero">
<div class="text-appear" id="text-appear"></div>
<script src="script.js"></script>
</section>
<!-- Mission Overview -->
<section>
<div class="overview">
<h2 class="overviewheading">
PACE Mission: Bridging Ocean, Air, and Climate
</h2>
<p>
The PACE (Plankton, Aerosol, Cloud, ocean Ecosystem) mission is aimed
at enhancing our understanding of the interactions between the ocean
and atmosphere, particularly concerning how they influence climate and
ecosystems. It plays a critical role in addressing climate change,
ocean health, and atmospheric science.
</p>
</div>
</section>
<!-- Objectives -->
<section id="objectives">
<div class="container">
<h2>Mission Objectives</h2>
<div class="objectives-grid">
<div class="objective">
<h3>Ocean Color</h3>
<p>
Study ocean color to understand phytoplankton distribution and its
role in carbon cycling and marine ecosystems.
</p>
</div>
<div class="objective">
<h3>Aerosol Properties</h3>
<p>
Measure aerosol properties to understand their effect on climate
and air quality.
</p>
</div>
<div class="objective">
<h3>Cloud Properties</h3>
<p>
Analyze cloud properties to reveal their role in Earth's radiation
balance and interactions with aerosols.
</p>
</div>
<div class="objective">
<h3>Ecosystem Dynamics</h3>
<p>
Investigate how marine ecosystems respond to environmental
changes, contributing to a better understanding of ecosystem
health.
</p>
</div>
</div>
</div>
<hr class = "sectionbreak"/>
</section>
<!-- Instruments -->
<section id="instruments">
<div class="container">
<h2>PACE Instruments</h2>
<div class="instruments-grid">
<div class="instrument">
<h3><a href="ocd.html">Ocean Color Radiometer</a></h3>
<p>
Captures detailed ocean color measurements, providing insights
into phytoplankton health and biomass.
</p>
</div>
<div class="instrument">
<h3><a href="mlp.html">Multi-Angle Polarimeter</a></h3>
<p>
Measures light scattering at different angles to study aerosol and
cloud properties.
</p>
</div>
</div>
</div>
<hr class = "sectionbreak"/>
</section>
<!-- Data & Impact -->
<section id="data-impact">
<div class="container">
<h2>Data & Utilization</h2>
<p>
The data collected by PACE will be valuable for improving climate
models, supporting marine ecosystem management, and enhancing weather
forecasting and air quality assessments.
</p>
<button class="quizbtn" style="margin-top: 10px ;"><a href="data.html">ANALYZE DATA</a></button>
</div>
<hr class = "sectionbreak"/>
</section>
<section id="quiz">
<center>
<h2>Test your knowledge about PACE!</h2>
<button class="quizbtn" ><a href="quiz.html">START QUIZ</a></button>
</section>
<!-- Resources -->
<section id="resources">
<div class="container">
<h2>Resources</h2>
<ul>
<li><a href = "https://pace.oceansciences.org/home.html">NASA PACE</a></li>
<li><a href ="https://oceancolor.gsfc.nasa.gov/l3/">Ocean Color: Level 3 & 4 Browser</a></li>
<li><a href ="https://pace.oceansciences.org/work_with_pace_data.html">NASA PACE: Get Ready to Work with PACE Data</a></li>
</ul>
</div>
<hr />
</section>
<!-- Contact & Collaboration -->
<!-- Footer -->
<footer>
<div id="footerclass"></div>
<script src="footer.js"></script>
</footer>
</body>
</html>