-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
287 lines (274 loc) · 14.7 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
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="description" content="Home page Community Science Museum">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600&display=swap"
rel="stylesheet">
<link
href="https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Open+Sans:wght@300;400;500;600&display=swap"
rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" rel="stylesheet">
<link rel="stylesheet" href="css/styles.css">
<title>Home | Community Science Museum</title>
</head>
<body>
<input type="checkbox" id="menu-checkbox">
<header>
<div class="header_center_logo_text">
<div class="logo">
<a href="index.html"><img src="/images/logo.png" alt="Logo for Community Science Museum"></a>
</div>
<div>
<i id="header_text_community">COMMUNITY</i>
<div class="science_museum_wrapper">
<i id="header_text_science">SCIENCE</i>
<i id="header_text_museum">MUSEUM</i>
</div>
<i id="header_text_explore">"Explore Together"</i>
</div>
</div>
<label for="menu-checkbox" class="hamburger-icon"><i class="fas fa-bars"></i><i
class="hamburger-invisible">Toggle
menu</i></label>
<nav>
<menu>
<li class="active"><a href="#">Home</a></li>
<li><a href="visit.html">Visit Info</a></li>
<li><a href="getinvolved.html">Get Involved</a></li>
<li class="separator"></li>
<li class="mobile"><a href="events.html">Special Events</a></li>
<li class="mobile"><a href="explore.html">Explore</a></li>
<li class="mobile"><a href="cosmology.html">Cosmology</a></li>
<li class="mobile"><a href="evolution.html">Evolution</a></li>
<li class="mobile"><a href="biology.html">Biology And Medicine</a></li>
<li class="mobile"><a href="robotics.html">Robotics And AI</a></li>
<li class="mobile"><a href="ecology.html">Ecology</a></li>
</menu>
</nav>
</header>
<main>
<div class="second_navigation">
<ul>
<li><a href="events.html">Special Events</a></li>
<li><a href="explore.html">Explore</a></li>
<li><a href="cosmology.html">Cosmology</a></li>
<li><a href="evolution.html">Evolution</a></li>
<li><a href="biology.html">Biology And Medicine</a></li>
<li><a href="robotics.html">Robotics And AI</a></li>
<li><a href="ecology.html">Ecology</a></li>
</ul>
</div>
<section class="main_wrapper">
<div>
<h1>Welcome!</h1>
<p id="main_wrapper__index_toptext">Come join us at the Community Science Museum where
we’re
committed to making science accessible
to
all.</p>
</div>
<div class="main_grid">
<div class="card main_grid__item">
<div class="card_head"> <!-- Card Head -->
<div class="card_monogram"> <!-- Monogram -->
<i>S</i>
</div>
<div>
<div class="card_header"> <!-- Header -->
Special Events
</div>
<div class="card_sub_header"> <!-- Sub Header -->
Check it out!
</div>
</div>
</div>
<div class="card_image"> <!-- Image placeholder -->
<img src="/images/exhibition-1863344_1920.jpg" alt="Special Events">
</div>
<div class="card_support_text"> <!-- support text -->
<i>Check out what events and exhibits are currently available at the museum.</i>
</div>
<div class="card_button_outline"> <!-- Button -->
<a href="events.html">See More</a>
</div>
</div>
<div class="card main_grid__item">
<div class="card_head"> <!-- Card Head -->
<div class="card_monogram"> <!-- Monogram -->
<i>F</i>
</div>
<div>
<div class="card_header"> <!-- Header -->
Free Entrance
</div>
<div class="card_sub_header"> <!-- Sub Header -->
The entrance is free for all!
</div>
</div>
</div>
<div class="card_image"> <!-- Image placeholder -->
<img src="/images/museum.png" alt="Free Entrance">
</div>
<div class="card_support_text"> <!-- support text -->
<i>Enjoy free entrance to our museum! Immerse yourself in the wonders of science and
discovery without spending a dime. Bring friends and family for an unforgettable,
educational experience.</i>
</div>
<div class="card_button_outline"> <!-- Button -->
<a href="visit.html">See More</a>
</div>
</div>
<div class="main_text main_grid__item"><i id="body_large">The aim of our museum is to create a
space
where everyone
can experience
the wonders of our discoveries and perhaps even ignite a lifelong passion to continue
the
exploration of the world around us.</i>
</div>
<div class="card main_grid__item">
<div class="card_head"> <!-- Card Head -->
<div class="card_monogram"> <!-- Monogram -->
<i>E</i>
</div>
<div>
<div class="card_header"> <!-- Header -->
Explore
</div>
<div class="card_sub_header"> <!-- Sub Header -->
Learn About Science
</div>
</div>
</div>
<div class="card_image"> <!-- Image placeholder -->
<img src="/images/learn-2405206_1920.jpg" alt="Learn About Science">
</div>
<div class="card_support_text"> <!-- support text -->
<i>Are you a young person looking to learn more about science? Come on down to our
museum,
there’s plenty to see and do.</i>
</div>
<div class="card_button"> <!-- Button -->
<a href="explore.html">Explore Now</a>
</div>
</div>
<div class="main_text main_grid__item"><i>“We believe science should not be confined to the
textbook, but brought to
live through
exhibits. This is why we have over 1000 different exhibits on the many varied subjects
of
science to explore. Many of these exhibits are designed for you to interact with and
play
around to see science come to life (apart from the dinosaur exhibits – they only come to
life at night when everyone’s gone home).</i>
<img src="/images/reading-2762010_1280.jpg"
alt="We believe science should not be confined to the textbook">
</div>
<div class="card main_grid__item">
<div class="card_head"> <!-- Card Head -->
<div class="card_monogram"> <!-- Monogram -->
<i>C</i>
</div>
<div>
<div class="card_header"> <!-- Header -->
Cosmology
</div>
<div class="card_sub_header"> <!-- Sub Header -->
Learn About Cosmology
</div>
</div>
</div>
<div class="card_image"> <!-- Image placeholder -->
<img src="/images/celso-405219.jpg" alt="Learn About Cosmology">
</div>
<div class="card_support_text"> <!-- support text -->
<i>Embark on a cosmic journey through Cosmology, unraveling the mysteries of the
universe.
Explore the formation of galaxies, stars, and planets, and learn about the
fascinating
forces shaping our cosmos.</i>
</div>
<div class="card_button"> <!-- Button -->
<a href="cosmology.html">Cosmology</a>
</div>
</div>
<div class="card main_grid__item">
<div class="card_head"> <!-- Card Head -->
<div class="card_monogram"> <!-- Monogram -->
<i>E</i>
</div>
<div>
<div class="card_header"> <!-- Header -->
Evolution
</div>
<div class="card_sub_header"> <!-- Sub Header -->
Where do we come from?
</div>
</div>
</div>
<div class="card_image"> <!-- Image placeholder -->
<img src="/images/mammoth-1257288_1920.jpg" alt="Evolution">
</div>
<div class="card_support_text"> <!-- support text -->
<i>Over the course of human history, science has developed from our early understanding
of
fire, wind, water, and earth to exploring everything from galaxies far away to the
very
building blocks of life itself.</i>
</div>
<div class="card_button"> <!-- Button -->
<a href="evolution.html">Evolution</a>
</div>
</div>
<div class="card main_grid__item">
<div class="card_head"> <!-- Card Head -->
<div class="card_monogram"> <!-- Monogram -->
<i>R</i>
</div>
<div>
<div class="card_header"> <!-- Header -->
Robotics and AI
</div>
<div class="card_sub_header"> <!-- Sub Header -->
The science of the future
</div>
</div>
</div>
<div class="card_image"> <!-- Image placeholder -->
<img src="/images/scientific-2040795_1280.jpg" alt="Robotics and AI">
</div>
<div class="card_support_text"> <!-- support text -->
<i>Discover Robotics and AI, where advanced technology animates machines. Learn how
robots
and AI impact industries, healthcare, and daily life. Experience the awe-inspiring
future of innovation!</i>
</div>
<div class="card_button"> <!-- Button -->
<a href="robotics.html">Robotics and AI</a>
</div>
</div>
</div>
</section>
</main>
<footer>
<div class="footer_links">
<i>SUPPORT</i>
<i>LOCATION</i>
<i id="footer_hours">HOURS</i>
</div>
<div class="footer_social">
<img src="/svg/twitter.svg" alt="Link to Community Science Museum Twitter">
<img src="/svg/fb.svg" alt="Link to Community Science Museum Facebook">
</div>
<div class="footer_logo_copyright">
<img class="logo_footer" src="/images/logo.png" alt="Logo for Community Science Museum">
<i>© 2023 COMMUNITY SCIENCE MUSEUM</i>
</div>
</footer>
</body>
</html>