-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathexplore.html
229 lines (226 loc) · 10.8 KB
/
explore.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
<!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">
<meta name="description"
content="On this page we tell you how you can get closer to us depending on what you are looking for.">
<script>
(function (d) {
var config = {
kitId: 'rvx8jyl',
scriptTimeout: 3000,
async: true
},
h = d.documentElement, t = setTimeout(function () { h.className = h.className.replace(/\bwf-loading\b/g, "") + " wf-inactive"; }, config.scriptTimeout), tk = d.createElement("script"), f = false, s = d.getElementsByTagName("script")[0], a; h.className += " wf-loading"; tk.src = 'https://use.typekit.net/' + config.kitId + '.js'; tk.async = true; tk.onload = tk.onreadystatechange = function () { a = this.readyState; if (f || a && a != "complete" && a != "loaded") return; f = true; clearTimeout(t); try { Typekit.load(config) } catch (e) { } }; s.parentNode.insertBefore(tk, s)
})(document);
</script>
<link rel="stylesheet" href="https://use.typekit.net/wsq8tcu.css">
<link href="styles/global.css" rel="stylesheet">
<link href="styles/variables.css" rel="stylesheet">
<script src="https://kit.fontawesome.com/591f5bf3d7.js" crossorigin="anonymous"></script>
<title>Community Science Museum | Explore</title>
</head>
<body>
<header>
<nav>
<a href="index.html" class="logo-container">
<div>
<img src="images/Logo.png" alt="the community science museum logo" class="logo">
</div>
<p class="motto">"Explore together"</p>
</a>
<div class="nav-icon-container">
<div class="search-button-container">
<i class="fas fa-search activate-search-menu"></i></label>
</div>
<div>
<label for="dropdown-menu" class="hamburger-menu"><i class="fas fa-bars"></i></label>
<input type="checkbox" id="dropdown-menu">
<section class="site-navigation">
<div class="site-navigation-border">
<a href="about.html">
<p class="site-navigation-text">About us</p>
</a>
</div>
<div class="site-navigation-border">
<a href="events.html">
<p class="site-navigation-text">Events</p>
</a>
</div>
<div class="site-navigation-border current-container">
<a href="explore.html">
<p class="site-navigation-text current">Explore</p>
</a>
</div>
<div class="site-navigation-border">
<a href="exhibits.html">
<p class="site-navigation-text">Exhibits</p>
</a>
</div>
<div class="site-navigation-border">
<a href="involved.html">
<p class="site-navigation-text">Get involved</p>
</a>
</div>
<div class="site-navigation-border">
<a href="visit.html">
<p class="site-navigation-text">Visit us</p>
</a>
</div>
<div class="site-navigation-border">
<a href="booking.html">
<p class="booking-text-span site-navigation-text">
<span>Booking and</span>
<span>application</span>
</p>
</a>
</div>
</section>
</div>
</div>
</nav>
</header>
<main>
<section class="top-section">
<div class="section-subcontainer">
<h1>Explore</h1>
</div>
</section>
<section class="section-image-container">
<div>
<img src="images/samuel-zeller-158996-large.jpg" alt="a child wearing a VR headset looking upwards"
class="section-image stretched-images">
</div>
</section>
<section class="standard-section aqua-section">
<div class="section-subcontainer">
<h2>For kids</h2>
<div>
<p>Are you a young person looking to learn more about science? Come on down to our museum, there’s
plenty to see and do.</p>
<p>You can learn about Newtonian physics from our bumper swing, or why not travel back in time and
meet our resident Woolly Mammoth? Our exhibits are designed to be accessible for interested
minds, so make sure you come ready to learn and explore.
</p>
<p>We also have the Young Stars club which meets once a week on a Saturday between 10:00 and 13:00
where you’ll get to explore and experiment with our team of experts.
</p>
<p>
During the school holidays we run special holiday clubs where you can join other children your
age to go on a journey of discovery. Each holiday we pick a new theme to explore. To find out
more about the holiday club and how you can join, send us a message.
</p>
</div>
<div class="side-by-side-button-container">
<a href="booking.html"><button class="button">Join us</button></a>
<a href="visit.html" class="explore-button"><button class="button">Visit us</button></a>
</div>
</div>
</section>
<section class="section-image-container">
<div>
<img src="images/teacher-2816112-large.jpg"
alt="a cartoon teacher standing behind a desk. On the desk there is 2 science flasks"
class="section-image">
</div>
</section>
<section class="standard-section red-section">
<div class="section-subcontainer">
<div>
<h2>For teachers</h2>
<p>As a community-driven museum, we want to work with schools to create places of learning and
exploring. Our team are on hand to give your students guided tours of the museum, teach them in
our learning laboratory, and provide great video presentations that will excite and inspire
them.</p>
<p>Please get in touch with us here to find out more about our facilities and to arrange a time to
bring your students through for a visit.</p>
</div>
<div class="right-button-container contact-button">
<a href="about.html"><button class="button">Contact us</button></a>
</div>
</div>
</section>
<section class="section-image-container">
<div>
<img src="images/people-219985_1280-large.jpg" alt="a man looking through a microscope"
class="section-image">
</div>
</section>
<section class="standard-section orange-section">
<div class="section-subcontainer">
<div>
<h2>For researchers</h2>
<p>Are you looking to get involved with our team of researchers and academics? Our museum offers
various ways for you to use our resources and contribute towards them. We have online records,
laboratory space, and a working relationship with a number of universities around the country.
</p>
</div>
<div class="right-button-container contact-button">
<a href="visit.html"><button class="button get-involved-button">Get involved</button></a>
</div>
</div>
</section>
<section class="standard-section home-button-section">
<div class="right-button-container">
<a href="index.html"><button class="button home-button">Home</button></a>
</div>
</section>
</main>
<footer>
<div class="footer-container">
<section class="hours-section">
<div>
<p class="footer-heading">Opening Hours:</p>
</div>
<div>
<p class="hours-text">
Mon: Closed
</p>
<p class="hours-text">
Tue: 10:00 – 16:00
</p>
<p class="hours-text">
Wed: 10:00 – 16:00
</p>
<p class="hours-text">
Thu: 10:00 – 16:00
</p>
<p class="hours-text">
Fri: 10:00 – 19:00
</p>
<p class="hours-text">
Sat: 9:00 – 16:00
</p>
<p class="hours-text">
Sun: 9:00 – 13:00
</p>
</div>
</section>
<section class="address-section">
<div>
<p class="footer-heading">Address and Contact</p>
</div>
<div class="address-info">
<i class="fas fa-map-pin" alt="map pin"></i>
<p class="address-text">Folke Bernadottes vei 40, 5147 Fyllingsdalen.</p>
</div>
<div class="address-info">
<i class="fas fa-envelope" alt="envelope"></i>
<a href="">
<p class="address-text">[email protected]</p>
</a>
</div>
<div class="address-info">
<i class="fas fa-phone-alt" alt="telephone"></i>
<a href="">
<p class="address-text">(+47) 999 99 999</p>
</a>
</div>
</section>
</div>
</footer>
<script src="js/script.js"></script>
</body>
</html>