-
Notifications
You must be signed in to change notification settings - Fork 0
/
travel.html
513 lines (472 loc) · 31.9 KB
/
travel.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
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
<!doctype html>
<html lang="en" data-bs-theme="auto">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Wedding J&M - Travel</title>
<meta name="description" content="Travel information for those coming from out of town to attend Julia and Maggie's Wedding at Planet Bluegrass.">
<meta name="author" content="Julia Kent">
<!-- Preload Bootstrap CSS -->
<link rel="preload" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" as="style">
<!-- Load Bootstrap CSS from CDN -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
<!-- Custom CSS -->
<link href="./css/custom.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
<!-- Preload Banner Image -->
<link rel="preload" href="../images/leading.webp" as="image">
<style>
.jumbotron-travel {
background-image: url("../images/leading.webp");
}
body {
display: flex;
min-height: 100vh;
flex-direction: column;
}
.main-content {
flex: 1;
}
@media (min-width: 768px) {
.sidebar {
position: fixed;
top: 3.5rem;
bottom: 0;
left: 0;
width: 250px;
background-color: black;
border-right: 1px solid #dee2e6;
padding-top: 20px;
}
.main-content {
margin-left: 250px;
}
}
.footer-top {
z-index:1000;
}
/* Add a top margin to each header to offset the height of the sticky navbar */
sidebar-anchor {
position: relative;
padding-top: 60px;
margin-top: -60px;
}
ul li {
margin-bottom: 10px;
}
.ridgeline {
--bs-bg-opacity: 0;
}
.lodging-container {
display: flex;
flex-wrap: wrap;
}
.lodging-text {
flex: 1;
min-width: 300px;
}
.lodging-map {
flex: 1;
min-width: 300px;
display: flex;
align-items: center;
justify-content: center;
padding: 3rem;
}
.lodging-map iframe {
width: 100%;
height: 480px;
}
@media (prefers-color-scheme: dark) {
.alert-secondary {
--bs-alert-color: #2b2f32;
--bs-alert-bg:#e2e3e5;
--bs-alert-border-color: #c4c8cb;
--bs-alert-link-color: #2b2f32;
}
}
</style>
<!-- Favicon -->
<link rel="apple-touch-icon" sizes="180x180" href="favicon_io/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="192x192" href="favicon_io/android-chrome-192x192.png">
<link rel="icon" type="image/png" sizes="512x512" href="favicon_io/android-chrome-512x512.png">
<link rel="icon" type="image/png" sizes="32x32" href="favicon_io/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="favicon_io/favicon-16x16.png">
<link rel="manifest" href="favicon_io/site.webmanifest">
<link rel="icon" href="favicon_io/favicon.ico" type="image/x-icon">
</head>
<body>
<nav class="navbar navbar-expand-md fixed-top">
<div class="container-fluid nav-text-container" style="margin: 0; padding: 0;">
<a class="navbar-brand nav-link fw-bold py-1 px-0 active" href="index.html" style="font-size: 1em;">
<img src="images/JandM.svg" alt="J&M" style="height: 1.5em;">
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarCollapse">
<ul class="navbar-nav ms-auto mb-2 mb-md-0">
<li class="nav-item">
<a class="nav-link fw-bold py-1 px-0" href="rsvp.html">R.S.V.P.</a>
</li>
<li class="nav-item">
<a class="nav-link fw-bold py-1 px-0" href="story.html">Story</a>
</li>
<li class="nav-item">
<a class="nav-link fw-bold py-1 px-0" href="schedule.html">Schedule</a>
</li>
<li class="nav-item">
<a class="nav-link fw-bold py-1 px-0" href="travel.html">Travel</a>
</li>
<li class="nav-item">
<a class="nav-link fw-bold py-1 px-0" href="faq.html">F.A.Q.</a>
</li>
<li class="nav-item">
<a class="nav-link fw-bold py-1 px-0" href="thank-you.html">Gratitude</a>
</li>
</ul>
</div>
</div>
</nav>
<div class="sidebar d-none d-md-block col-md-3 p-3">
<nav class="nav flex-column">
<a class="nav-link active" aria-current="page" href="#">Travel</a>
<a class="nav-link" href="#getting-there"><i class="fas fa-compass"></i> Getting There</a>
<a class="nav-link" href="#lodging"><i class="fas fa-home"></i> Lodging</a>
<a class="nav-link" href="#things-to-do"><i class="fas fa-binoculars"></i> Things to Do</a>
<a class="nav-link" href="#places-to-eat"><i class="fas fa-carrot"></i> Places to Eat</a>
</nav>
</div>
<main class="main-content">
<div class="jumbotron jumbotron-fluid jumbotron-travel">
<div class="container">
<h1 class="display-4">Getting There!</h1>
<p class="lead">Plan Your Journey</p>
</div>
</div>
<div class="container" style="padding: 1em">
<div class="d-flex align-items-center">
<div>
<h1 class="mt-3">Travel</h1>
<p class="lead">Your destination for the weekend is <a href="https://bluegrass.com/" class="text-body-secondary">Planet Bluegrass</a> in Lyons, CO!</p>
<div class="container" width="40%">
<p>The Planet Bluegrass Ranch is located off of Highway 36 just
North of the historic town of Lyons, CO. Bordered by the Saint
Vrain Creek, it is about 30 minutes North of Boulder and an
hour from Denver or Fort Collins. There will be plenty of parking at the venue.
</p>
</div>
<p><i class="fas fa-map-marker-alt"></i>
<a href="https://www.google.com/maps/place/500+W+Main+St,+Lyons,+Colorado" class="text-body-secondary" target="_blank">500 W Main St, Lyons</a>
</p>
</div>
<div style="padding-top: 2rem">
<img
sizes="(max-width: 625px) 150px, (max-width: 1000px) 200px, 250px"
srcset="
images/planet_bluegrass_logo_juf8oh/planet_bluegrass_logo_juf8oh_c_scale,w_200.png 200w,
images/planet_bluegrass_logo_juf8oh/planet_bluegrass_logo_juf8oh_c_scale,w_370.png 370w,
images/planet_bluegrass_logo_juf8oh/planet_bluegrass_logo_juf8oh_c_scale,w_498.png 498w,
images/planet_bluegrass_logo_juf8oh/planet_bluegrass_logo_juf8oh_c_scale,w_615.png 615w,
images/planet_bluegrass_logo_juf8oh/planet_bluegrass_logo_juf8oh_c_scale,w_625.png 625w"
src="images/planet_bluegrass_logo_juf8oh/planet_bluegrass_logo_juf8oh_c_scale,w_625.png"
alt="Planet Bluegrass Log">
</div>
</div>
<div id="getting-there" style="padding-top:60px">
<h3 class="mt-3">Getting There</h3>
<h4 class="mt-3"><i class="fas fa-plane"></i> Flying</h3>
<p>We recommend flying into Denver International Airport (DIA).</p>
<div class="alert alert-secondary" role="alert" style="background-color:white">
If coming from sea level, please be mindful of the altitude: wear sunscreen, drink lots of water, and pace your alcohol consumption.
</div>
<h4 class="mt-3"><i class="fas fa-bus"></i> Busses and Shuttles:</h3>
<ul>
<li><b>We are organizing a shuttle service from the Residence Inn Boulder Canyon Boulevard to Planet Bluegrass on our wedding date.</b> More information to come.
<li>The <a href="https://eightblackairportshuttle.com/" class="text-body-secondary">Eight Black Airport Shuttle</a> is a great option for door-to-door (airport to hotel) service from DIA.</li>
<li>Consider taking the <a href="https://rtd-denver.com" class="text-body-secondary">Regional Transportation District</a>. <br>
The (RTD) <a href="https://app.rtd-denver.com/route/AB1/schedule" class="text-body-secondary">AB Line</a> from the airport to downtown Boulder,
and the <a href="https://townoflyons.com/370/Sustainability-Resources-Transportation" class="text-body-secondary">Lyons Flyer</a> goes from downtown Boulder to Lyons.</li>
</ul>
</div>
<div class="text-center">
<img src="images/fantasy_map.png" width="60%" class="mx-auto d-block" alt="Fantasy Map" ondblclick="popImage(this.src)">
</div>
<div class="overlay" onclick="closeOverlay()">
<img src="" alt="Expanded Image">
</div>
<div id="lodging" style="padding-top:60px">
<h3 class="mt-3">Lodging</h3>
<div class="lodging-container">
<div class="lodging-text">
<div>
<h4 class="mt-3"><i class="fas fa-hotel"></i> Hotel Block @ The Residence Inn, Boulder Canyon Boulevard</h4>
<p> We will provide shuttle transportation to the wedding from this hotel.
<p><a href="https://www.marriott.com/event-reservations/reservation-link.mi?id=1728590312704&key=GRP&guestreslink2=true" class="text-body-secondary">Reservation Link</a></p>
<p><i class="fas fa-map-marker-alt"></i>
<a href="https://maps.app.goo.gl/6R9kD1Gucwms5R7C7" class="text-body-secondary" target="_blank">2550 Canyon Blvd, Boulder</a>
</p>
</div>
<div>
<h4 class="mt-3"><i class="fas fa-bed"></i> Stonemountain Lodge</h4>
<p>Straightforward, warm rooms.</p>
<p style="word-wrap: break-word"><a href="https://stonemountainlodgeandcabins.client.innroad.com/" class="text-body-secondary">https://stonemountainlodgeandcabins.client.innroad.com/</a></p>
<p><i class="fas fa-map-marker-alt"></i>
<a href="https://www.google.com/maps/place/18055+N+St+Vrain,+Lyons,+Colorado" class="text-body-secondary" target="_blank">18055 N St Vrain Dr, Lyons</a>
</p>
</div>
<div>
<h4 class="mt-3"><i class="fas fa-bed"></i> Riverside Cabins</h4>
<p>From here, you could float down the St. Vrain Creek right into Planet Bluegrass. How's that for an entrance?</p>
<p><a href="https://riversidecabinslyons.com/" class="text-body-secondary">https://riversidecabinslyons.com/</a></p>
<p><i class="fas fa-map-marker-alt"></i>
<a href="https://www.google.com/maps/place/16190+N+St+Vrain,+Lyons,+Colorado" class="text-body-secondary" target="_blank">16190 N St Vrain Dr, Lyons</a>
</p>
</div>
<div>
<h4 class="mt-3"><i class="fas fa-home"></i> VRBO</h4>
<p>Looking for a BNB in the Lyons area?</p>
<p><a href="https://www.vrbo.com/"" class="text-body-secondary">https://www.vrbo.com/</a></p>
</div>
</div>
<div class="lodging-map">
<iframe src="https://www.google.com/maps/d/u/3/embed?mid=1499qrpAtzWyYo25CpU_nLeA4_1qyED0&ehbc=2E312F"></iframe>
</div>
</div>
<div><p class="lead">There are more lodging options in the surrounding communities: Boulder, Niwot, Longmont, or even Estes Park. Please be sure you have adequate transportation.</p></div>
</div>
<div id="things-to-do" style="padding-top: 60px" class="container">
<div class="row text-center">
<div class="col-4">
<img loading="lazy"
sizes="(max-width: 500px) 120px, (max-width: 900px) 150px, (max-width: 1040px) 200px, (max-width: 1200px) 250px, (max-width: 1350px) 300px, (max-width: 1500px) 350px, 400px"
srcset="
images/goldhillinn_ljmmdn/goldhillinn_ljmmdn_c_scale,w_200.jpg 200w,
images/goldhillinn_ljmmdn/goldhillinn_ljmmdn_c_scale,w_388.jpg 388w,
images/goldhillinn_ljmmdn/goldhillinn_ljmmdn_c_scale,w_541.jpg 541w,
images/goldhillinn_ljmmdn/goldhillinn_ljmmdn_c_scale,w_640.jpg 640w"
src="images/goldhillinn_ljmmdn/goldhillinn_ljmmdn_c_scale,w_640.jpg"
alt="Gold Hill Inn">
</div>
<div class="col-4">
<img loading="lazy"
sizes="(max-width: 500px) 120px, (max-width: 900px) 150px, (max-width: 1040px) 200px, (max-width: 1200px) 250px, (max-width: 1350px) 300px, (max-width: 1500px) 350px, 400px"
srcset="
images/dushanbe_dae799/dushanbe_dae799_c_scale,w_200.jpg 200w,
images/dushanbe_dae799/dushanbe_dae799_c_scale,w_393.jpg 393w,
images/dushanbe_dae799/dushanbe_dae799_c_scale,w_539.jpg 539w,
images/dushanbe_dae799/dushanbe_dae799_c_scale,w_639.jpg 639w,
images/dushanbe_dae799/dushanbe_dae799_c_scale,w_741.jpg 741w,
images/dushanbe_dae799/dushanbe_dae799_c_scale,w_832.jpg 832w,
images/dushanbe_dae799/dushanbe_dae799_c_scale,w_927.jpg 927w,
images/dushanbe_dae799/dushanbe_dae799_c_scale,w_1010.jpg 1010w,
images/dushanbe_dae799/dushanbe_dae799_c_scale,w_1083.jpg 1083w,
images/dushanbe_dae799/dushanbe_dae799_c_scale,w_1200.jpg 1200w"
src="dushanbe_dae799_c_scale,w_1200.jpg"
alt="Dushanbe Tea House">
</div>
<div class="col-4">
<img loading="lazy"
sizes="(max-width: 500px) 120px, (max-width: 900px) 150px, (max-width: 1040px) 200px, (max-width: 1200px) 250px, (max-width: 1350px) 300px, (max-width: 1500px) 350px, 400px"
srcset="
images/indianpeaks_bp853d/indianpeaks_bp853d_c_scale,w_200.jpg 200w,
images/indianpeaks_bp853d/indianpeaks_bp853d_c_scale,w_407.jpg 407w,
images/indianpeaks_bp853d/indianpeaks_bp853d_c_scale,w_549.jpg 549w,
images/indianpeaks_bp853d/indianpeaks_bp853d_c_scale,w_643.jpg 643w,
images/indianpeaks_bp853d/indianpeaks_bp853d_c_scale,w_745.jpg 745w,
images/indianpeaks_bp853d/indianpeaks_bp853d_c_scale,w_890.jpg 890w,
images/indianpeaks_bp853d/indianpeaks_bp853d_c_scale,w_989.jpg 989w,
images/indianpeaks_bp853d/indianpeaks_bp853d_c_scale,w_939.jpg 939w,
images/indianpeaks_bp853d/indianpeaks_bp853d_c_scale,w_1156.jpg 1156w,
images/indianpeaks_bp853d/indianpeaks_bp853d_c_scale,w_1183.jpg 1183w,
images/indianpeaks_bp853d/indianpeaks_bp853d_c_scale,w_1360.jpg 1360w"
src="images/indianpeaks_bp853d/indianpeaks_bp853d_c_scale,w_1360.jpg"
alt="Indian Peaks">
</div>
</div>
</div>
<div style="padding-top:1rem">
<h3 class="mt-3">Things to Do</h3>
<ul>
<li>The <a href="https://www.goldhillinn.com/" class="text-body-secondary">Gold Hill Inn</a> is a very important place to us.
Here is where we had our first kiss and where, 4 years later, Julia proposed to Maggie.
The Inn has an affordable (and delicious) pre-fix dinner and has been the stage for many great bluegrass acts. Check their calendar!
But be warned, driving or biking here is not for the faint of heart. Expect steep windy dirt roads. If you do make it, check out the General Store and the free nearby camping.</li>
<li>Hike 8 miles up and back <a href="https://bouldercolorado.gov/trail/south-boulder-peak" class="text-body-secondary">South Boulder Peak</a>, where Maggie proposed to Julia at 8,549'. </li>
<li><a href="https://www.nps.gov/romo/index.htm" class="text-body-secondary">Rocky Mountain National Park</a> is too close by to miss on your trip.
Check if you need a reservation beforehand.</li>
<li><a href="https://www.fs.usda.gov/recarea/arp/recarea/" class="text-body-secondary">Indian Peaks Wilderness</a> is a great alternative to Rocky Mountain.
It butts up against RMNP, but is significantly less crowded, closer, and cheaper. Just as beautiful though!</li>
<li>Denver's <a href="https://www.meowwolf.com/denver" class="text-body-secondary">Meow Wolf</a> is an immersive art museum worth getting lost in.
The story continues from the Santa Fe and Vegas locations, but you don't need to have visited those first to enjoy it.</li>
<li>Take a tea tour at <a href="https://celestialseasonings.com/pages/tea-tour" class="text-body-secondary">Celestial Seasonings</a> in North Boulder.
The mint room is Julia's happy place.</li>
<li><a href="https://www.redrocksonline.com/" class="text-body-secondary">Red Rocks Park and Amphitheatre</a> is worth visiting day or night.
There are trails, a museum, and if you time it right - maybe see a show!</li>
<li><a href="https://bouldercolorado.gov/locations/chautauqua-park" class="text-body-secondary">Chautauqua Park</a> is your classic Boulder view.
This is where our engagement photos were taken. There are lots of good hikes from here, but it's also a pleasant spot for a picnic.</li>
</ul>
<p>We've compiled a <a href="https://www.alltrails.com/explore/list/local-hikes-for-wedding-guests-d240cb4?b_tl_lat=40.558244270056235&b_tl_lng=-106.51577753950204&b_br_lat=39.419578087877056&b_br_lng=-104.28351747073681" class="text-body-secondary">custom All-Trails list</a>
of hikes to check out for all ability and altitude-aclimation levels.</p>
</div>
<div>
<h3 class="mt-3" id="places-to-eat" style="padding-top:60px">Places to Eat</h3>
<h4 class="mt-3">Lyons</h3>
<ul>
<li>The <a href="https://www.stvrainmarket.com/" class="text-body-secondary">St. Vrain Market</a> has THE best sandwiches.
This is a great stop before your day's adventure. Don't miss out on their Cherry Garcia cookie.</li>
<li>The <a href="https://www.moxiebreadco.com/" class="text-body-secondary">Moxie Bread Company</a> has equally delicious whole wheat and gluten free loaves.
This is a great place to grab morning treats and coffee.</li>
<li><a href="https://oskarblues.com/" class="text-body-secondary">Oscar Blues Brewing</a> is a good stop for beer.</li>
</ul>
<h4 class="mt-3">Boulder</h3>
<ul>
<li>The <a href="https://www.boulderteahouse.com/" class="text-body-secondary">Dushanbe Tea House</a> is our favorite Boulder attraction.
It was built in Tajikistan and boasts beautiful architecture as well as over 100 varieties of tea.</li>
<li><a href="http://flowerpeppereats.com/" class="text-body-secondary">Flower Pepper</a> is Julia's favorite hole-in-the-wall:
authentic Sichuanese food, perfectly bite-sized soup dumplings, yum.</li>
<li><a href="https://www.therayback.com/" class="text-body-secondary">Rayback Collective</a> has any local beer you could dream of.
Check their website for their rotating food truck selection and live music.</li>
<li><a href="https://www.thrive-boulder.com/" class="text-body-secondary">Thrive</a> makes the list for how extremely ~~Boulder~~ it is.
This raw vegan restaurant has a really cool atmosphere (ceiling plants, oracle cards, experimental jazz). Julia likes their "Tacno" salad and smoothies.</li>
</ul>
<h4 class="mt-3">Nederland</h3>
<ul>
<li>If you make it up to Nederland, a post hike stop at <a href="https://www.crosscutpizza.com/" class="text-body-secondary">Crosscut</a> for woodfired pizza is a must.
Julia always orders the extra-special cheese.</li>
</ul>
<h4 class="mt-3">Denver</h3>
<ul>
<li><a href="https://kikesredtacos.com/" class="text-body-secondary">Kiké's Red Tacos</a> has delicious Birria tacos.
Maggie thinks these are the best tacos in Colorado (Julia doesn't disagree).</li>
<li><a href="https://www.cart-driver.com/" class="text-body-secondary">Cart Driver</a> has good woodfired pizza in a classy smart-casual setting.</li>
<li><a href="https://denverbrider.com/" class="text-body-secondary">Brider</a> is one of Maggie's favorite places to get chicken, salad, cookies, or mac n' cheese.
They have good happy hour specials.</li>
<li><a href="https://supermegabien.com/" class="text-body-secondary">Super Mega Bien</a> has Latin American dim-sum style tapas.
Sometimes we order and share the whole menu.</li>
</ul>
<p class="lead">Thank you for making the journey!</p>
</div>
<div class="container" style="padding:1rem">
<div class="row text-center">
<div class="col">
<img loading="lazy"
sizes="(max-width: 1000px) 200px, (max-width: 1200px) 250px, (max-width: 1350px) 300px, (max-width: 1500px) 350px, 400px"
srcset="
images/NY_Rhinebeck_136439_1939_62500_xe9kfu/NY_Rhinebeck_136439_1939_62500_xe9kfu_c_scale,w_200.jpg 200w,
images/NY_Rhinebeck_136439_1939_62500_xe9kfu/NY_Rhinebeck_136439_1939_62500_xe9kfu_c_scale,w_380.jpg 380w,
images/NY_Rhinebeck_136439_1939_62500_xe9kfu/NY_Rhinebeck_136439_1939_62500_xe9kfu_c_scale,w_492.jpg 492w,
images/NY_Rhinebeck_136439_1939_62500_xe9kfu/NY_Rhinebeck_136439_1939_62500_xe9kfu_c_scale,w_601.jpg 601w,
images/NY_Rhinebeck_136439_1939_62500_xe9kfu/NY_Rhinebeck_136439_1939_62500_xe9kfu_c_scale,w_684.jpg 684w,
images/NY_Rhinebeck_136439_1939_62500_xe9kfu/NY_Rhinebeck_136439_1939_62500_xe9kfu_c_scale,w_758.jpg 758w,
images/NY_Rhinebeck_136439_1939_62500_xe9kfu/NY_Rhinebeck_136439_1939_62500_xe9kfu_c_scale,w_827.jpg 827w,
images/NY_Rhinebeck_136439_1939_62500_xe9kfu/NY_Rhinebeck_136439_1939_62500_xe9kfu_c_scale,w_900.jpg 900w,
images/NY_Rhinebeck_136439_1939_62500_xe9kfu/NY_Rhinebeck_136439_1939_62500_xe9kfu_c_scale,w_959.jpg 959w,
images/NY_Rhinebeck_136439_1939_62500_xe9kfu/NY_Rhinebeck_136439_1939_62500_xe9kfu_c_scale,w_1021.jpg 1021w,
images/NY_Rhinebeck_136439_1939_62500_xe9kfu/NY_Rhinebeck_136439_1939_62500_xe9kfu_c_scale,w_1079.jpg 1079w,
images/NY_Rhinebeck_136439_1939_62500_xe9kfu/NY_Rhinebeck_136439_1939_62500_xe9kfu_c_scale,w_1135.jpg 1135w,
images/NY_Rhinebeck_136439_1939_62500_xe9kfu/NY_Rhinebeck_136439_1939_62500_xe9kfu_c_scale,w_1182.jpg 1182w,
images/NY_Rhinebeck_136439_1939_62500_xe9kfu/NY_Rhinebeck_136439_1939_62500_xe9kfu_c_scale,w_1234.jpg 1234w,
images/NY_Rhinebeck_136439_1939_62500_xe9kfu/NY_Rhinebeck_136439_1939_62500_xe9kfu_c_scale,w_1283.jpg 1283w,
images/NY_Rhinebeck_136439_1939_62500_xe9kfu/NY_Rhinebeck_136439_1939_62500_xe9kfu_c_scale,w_1334.jpg 1334w,
images/NY_Rhinebeck_136439_1939_62500_xe9kfu/NY_Rhinebeck_136439_1939_62500_xe9kfu_c_scale,w_1389.jpg 1389w,
images/NY_Rhinebeck_136439_1939_62500_xe9kfu/NY_Rhinebeck_136439_1939_62500_xe9kfu_c_scale,w_1396.jpg 1396w,
images/NY_Rhinebeck_136439_1939_62500_xe9kfu/NY_Rhinebeck_136439_1939_62500_xe9kfu_c_scale,w_1400.jpg 1400w"
src="images/NY_Rhinebeck_136439_1939_62500_xe9kfu/NY_Rhinebeck_136439_1939_62500_xe9kfu_c_scale,w_1400.jpg"
alt="Rhinebeck, NY Historic Map"
ondblclick="popImage(this.src)">
<p>USGS 1939<br>New York - Rhinebeck Quadrangle</p>
</div>
<div class="col">
<img loading="lazy"
sizes="(max-width: 1000px) 200px, (max-width: 1200px) 250px, (max-width: 1350px) 300px, (max-width: 1500px) 350px, 400px"
srcset="
images/VA_Mt_Vernon_189090_1894_125000_vnhvpp/VA_Mt_Vernon_189090_1894_125000_vnhvpp_c_scale,w_200.jpg 200w,
images/VA_Mt_Vernon_189090_1894_125000_vnhvpp/VA_Mt_Vernon_189090_1894_125000_vnhvpp_c_scale,w_369.jpg 369w,
images/VA_Mt_Vernon_189090_1894_125000_vnhvpp/VA_Mt_Vernon_189090_1894_125000_vnhvpp_c_scale,w_476.jpg 476w,
images/VA_Mt_Vernon_189090_1894_125000_vnhvpp/VA_Mt_Vernon_189090_1894_125000_vnhvpp_c_scale,w_569.jpg 569w,
images/VA_Mt_Vernon_189090_1894_125000_vnhvpp/VA_Mt_Vernon_189090_1894_125000_vnhvpp_c_scale,w_657.jpg 657w,
images/VA_Mt_Vernon_189090_1894_125000_vnhvpp/VA_Mt_Vernon_189090_1894_125000_vnhvpp_c_scale,w_729.jpg 729w,
images/VA_Mt_Vernon_189090_1894_125000_vnhvpp/VA_Mt_Vernon_189090_1894_125000_vnhvpp_c_scale,w_799.jpg 799w,
images/VA_Mt_Vernon_189090_1894_125000_vnhvpp/VA_Mt_Vernon_189090_1894_125000_vnhvpp_c_scale,w_864.jpg 864w,
images/VA_Mt_Vernon_189090_1894_125000_vnhvpp/VA_Mt_Vernon_189090_1894_125000_vnhvpp_c_scale,w_924.jpg 924w,
images/VA_Mt_Vernon_189090_1894_125000_vnhvpp/VA_Mt_Vernon_189090_1894_125000_vnhvpp_c_scale,w_983.jpg 983w,
images/VA_Mt_Vernon_189090_1894_125000_vnhvpp/VA_Mt_Vernon_189090_1894_125000_vnhvpp_c_scale,w_1043.jpg 1043w,
images/VA_Mt_Vernon_189090_1894_125000_vnhvpp/VA_Mt_Vernon_189090_1894_125000_vnhvpp_c_scale,w_1100.jpg 1100w,
images/VA_Mt_Vernon_189090_1894_125000_vnhvpp/VA_Mt_Vernon_189090_1894_125000_vnhvpp_c_scale,w_1156.jpg 1156w,
images/VA_Mt_Vernon_189090_1894_125000_vnhvpp/VA_Mt_Vernon_189090_1894_125000_vnhvpp_c_scale,w_1211.jpg 1211w,
images/VA_Mt_Vernon_189090_1894_125000_vnhvpp/VA_Mt_Vernon_189090_1894_125000_vnhvpp_c_scale,w_1264.jpg 1264w,
images/VA_Mt_Vernon_189090_1894_125000_vnhvpp/VA_Mt_Vernon_189090_1894_125000_vnhvpp_c_scale,w_1315.jpg 1315w,
images/VA_Mt_Vernon_189090_1894_125000_vnhvpp/VA_Mt_Vernon_189090_1894_125000_vnhvpp_c_scale,w_1368.jpg 1368w,
images/VA_Mt_Vernon_189090_1894_125000_vnhvpp/VA_Mt_Vernon_189090_1894_125000_vnhvpp_c_scale,w_1395.jpg 1395w,
images/VA_Mt_Vernon_189090_1894_125000_vnhvpp/VA_Mt_Vernon_189090_1894_125000_vnhvpp_c_scale,w_1400.jpg 1400w"
src="images/VA_Mt_Vernon_189090_1894_125000_vnhvpp/VA_Mt_Vernon_189090_1894_125000_vnhvpp_c_scale,w_1400.jpg"
alt="Alexandria, VA Historic Map"
ondblclick="popImage(this.src)">
<p>USGS 1894<br>Virginia-Maryland - Mt. Vernon Sheet</p>
</div>
<div class="col">
<img loading="lazy"
sizes="(max-width: 1000px) 200px, (max-width: 1200px) 250px, (max-width: 1350px) 300px, (max-width: 1500px) 350px, 400px"
srcset="
images/CO_Boulder_402336_1904_62500_cznjtg/CO_Boulder_402336_1904_62500_cznjtg_c_scale,w_200.jpg 200w,
images/CO_Boulder_402336_1904_62500_cznjtg/CO_Boulder_402336_1904_62500_cznjtg_c_scale,w_375.jpg 375w,
images/CO_Boulder_402336_1904_62500_cznjtg/CO_Boulder_402336_1904_62500_cznjtg_c_scale,w_493.jpg 493w,
images/CO_Boulder_402336_1904_62500_cznjtg/CO_Boulder_402336_1904_62500_cznjtg_c_scale,w_583.jpg 583w,
images/CO_Boulder_402336_1904_62500_cznjtg/CO_Boulder_402336_1904_62500_cznjtg_c_scale,w_662.jpg 662w,
images/CO_Boulder_402336_1904_62500_cznjtg/CO_Boulder_402336_1904_62500_cznjtg_c_scale,w_732.jpg 732w,
images/CO_Boulder_402336_1904_62500_cznjtg/CO_Boulder_402336_1904_62500_cznjtg_c_scale,w_797.jpg 797w,
images/CO_Boulder_402336_1904_62500_cznjtg/CO_Boulder_402336_1904_62500_cznjtg_c_scale,w_864.jpg 864w,
images/CO_Boulder_402336_1904_62500_cznjtg/CO_Boulder_402336_1904_62500_cznjtg_c_scale,w_942.jpg 942w,
images/CO_Boulder_402336_1904_62500_cznjtg/CO_Boulder_402336_1904_62500_cznjtg_c_scale,w_956.jpg 956w,
images/CO_Boulder_402336_1904_62500_cznjtg/CO_Boulder_402336_1904_62500_cznjtg_c_scale,w_1208.jpg 1208w,
images/CO_Boulder_402336_1904_62500_cznjtg/CO_Boulder_402336_1904_62500_cznjtg_c_scale,w_1221.jpg 1221w,
images/CO_Boulder_402336_1904_62500_cznjtg/CO_Boulder_402336_1904_62500_cznjtg_c_scale,w_1273.jpg 1273w,
images/CO_Boulder_402336_1904_62500_cznjtg/CO_Boulder_402336_1904_62500_cznjtg_c_scale,w_1323.jpg 1323w,
images/CO_Boulder_402336_1904_62500_cznjtg/CO_Boulder_402336_1904_62500_cznjtg_c_scale,w_1371.jpg 1371w,
images/CO_Boulder_402336_1904_62500_cznjtg/CO_Boulder_402336_1904_62500_cznjtg_c_scale,w_1397.jpg 1397w,
images/CO_Boulder_402336_1904_62500_cznjtg/CO_Boulder_402336_1904_62500_cznjtg_c_scale,w_1400.jpg 1400w"
src="images/CO_Boulder_402336_1904_62500_cznjtg/CO_Boulder_402336_1904_62500_cznjtg_c_scale,w_1400.jpg"
alt="Boulder, CO Historic Map"
ondblclick="popImage(this.src)">
<p>USGS 1904<br>Colorado - Boulder Quadrangle</p>
</div>
</div>
</div>
<div class="overlay" onclick="closeOverlay()">
<img src="" alt="Expanded Image">
</div>
</div>
<script>
function popImage(src) {
const overlay = document.querySelector('.overlay');
overlay.style.display = 'flex';
overlay.querySelector('img').src = src;
}
function closeOverlay() {
const overlay = document.querySelector('.overlay');
overlay.style.display = 'none';
}
</script>
</main>
<footer class="my-4 footer-top">
<img src="images/mountainvista_transparent.png" class="ridgeline" width="100%">
</footer>
<footer class="py-3 my-4 border-top bg-light footer-top">
<div class="container d-flex justify-content-between align-items-center">
<div class="col-md-4 text-center text-md-start">
<p class="mb-0 text-body-secondary"><a href="https://github.com/jukent/maggie-and-julia" class="text-body-secondary">Coded by Julia</a><br>with lots of love for Maggie</p>
</div>
<div id="countdown" class="col-md-4 mb-0 text-body-secondary text-center"></div>
<div class="col-md-4 text-center text-md-end">
<p class="mb-0 text-body-secondary">Banner Photography by<br><a href="https://angiewilderphoto.com/" class="text-body-secondary">Angie Wilder</a></p>
</div>
</div>
</footer>
<script src="./js/custom.js"></script>
<!-- Preload Bootstrap JS -->
<link rel="preload" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" as="script">
<!-- Load Bootstrap JS from CDN -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous" defer></script>
</body>
</html>