140 lines
7.4 KiB
HTML
140 lines
7.4 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<meta name="description" content="Dangerous Wonder — A Field Guide to Everything Worth Knowing. Exploring the natural world, inventions, strange phenomena, maps, the human body, and the cosmos.">
|
|
<title>Dangerous Wonder — A Field Guide to Everything Worth Knowing</title>
|
|
<link rel="stylesheet" href="css/style.css">
|
|
</head>
|
|
<body>
|
|
<div class="page-wrapper-wide">
|
|
|
|
<header class="site-header">
|
|
<h1 class="site-title"><a href="index.html">Dangerous Wonder</a></h1>
|
|
<p class="site-subtitle">A Field Guide to Everything Worth Knowing</p>
|
|
</header>
|
|
|
|
<nav class="site-nav">
|
|
<ul>
|
|
<li><a href="index.html" class="active">Home</a></li>
|
|
<li><a href="natural-world.html">Natural World</a></li>
|
|
<li><a href="inventions.html">Inventions</a></li>
|
|
<li><a href="phenomena.html">Phenomena</a></li>
|
|
<li><a href="maps.html">Maps & Places</a></li>
|
|
<li><a href="human-body.html">Human Body</a></li>
|
|
<li><a href="space.html">Space</a></li>
|
|
<li><a href="about.html">About</a></li>
|
|
</ul>
|
|
</nav>
|
|
|
|
<div style="margin: 28px 0 24px; text-align: center;">
|
|
<img src="photos/1506905925346-21bda4d32df4_900x300.png" alt="A vast mountain landscape stretching toward the horizon" style="width:100%; max-width:900px; border: 3px solid #fff; box-shadow: 3px 4px 8px rgba(0,0,0,0.28);">
|
|
<p class="figure-caption">The world is vast. Most of it remains undiscovered — by you. Its Maker set no boundary on wonder.</p>
|
|
</div>
|
|
|
|
<div class="content-section">
|
|
<p class="drop-cap">Welcome to <strong>Dangerous Wonder</strong>, a compendium of the curious, the marvellous, and the quietly astonishing. Since 1999, we have been cataloguing the overlooked corners of knowledge — the things your textbooks forgot, the phenomena your teachers never mentioned, the maps of places that exist only in the margins.<br><br>This site is a map of wonders. Follow any path that calls to you. There are no wrong turns. Every trail leads back to the same astonishment: that all of this was spoken into being.</p>
|
|
</div>
|
|
|
|
<hr class="dk-rule">
|
|
|
|
<h2 class="section-header" style="text-align:center;">Where Shall You Begin?</h2>
|
|
|
|
<img src="img/compass-metal-vintage.png" alt="" class="clipart-divider">
|
|
|
|
<div class="card-grid">
|
|
|
|
<a href="natural-world.html" class="card">
|
|
<span class="card-header-bar" style="background:#2d6a2d; height:6px; display:block;"></span>
|
|
<img src="photos/1470071459604-3b5ec3a7fe05_500x300.png" alt="A sun-dappled forest" class="card-image">
|
|
<div class="card-body">
|
|
<img src="img/fern-leaf-vein-pattern.png" alt="" style="max-width:50px; margin-bottom:4px;">
|
|
<div class="card-title">The Natural World</div>
|
|
<div class="card-text">Forests, oceans, creatures, and the hidden logic of living things</div>
|
|
</div>
|
|
</a>
|
|
|
|
<a href="inventions.html" class="card">
|
|
<span class="card-header-bar" style="background:#b8860b; height:6px; display:block;"></span>
|
|
<img src="photos/photo-1633451238042-85d93d267866_500x300.png" alt="Gears and mechanisms" class="card-image">
|
|
<div class="card-body">
|
|
<img src="img/lit-gold-bulb-icon.png" alt="" style="max-width:50px; margin-bottom:4px;">
|
|
<div class="card-title">Inventions & Ideas</div>
|
|
<div class="card-text">The machines and notions that reshaped the world</div>
|
|
</div>
|
|
</a>
|
|
|
|
<a href="phenomena.html" class="card">
|
|
<span class="card-header-bar" style="background:#5c2d6e; height:6px; display:block;"></span>
|
|
<img src="photos/1534274988757-a28bf1a57c17_500x300.png" alt="Strange northern lights" class="card-image">
|
|
<div class="card-body">
|
|
<img src="img/crystal-rock-gemstone.png" alt="" style="max-width:50px; margin-bottom:4px;">
|
|
<div class="card-title">Strange Phenomena</div>
|
|
<div class="card-text">Optical illusions, weird science, and things that shouldn't be</div>
|
|
</div>
|
|
</a>
|
|
|
|
<a href="maps.html" class="card">
|
|
<span class="card-header-bar" style="background:#8b4513; height:6px; display:block;"></span>
|
|
<img src="photos/photo-1520299607509-dcd935f9a839_500x300.png" alt="An old map on a weathered table" class="card-image">
|
|
<div class="card-body">
|
|
<img src="img/world-map-compass-drawing.png" alt="" style="max-width:50px; margin-bottom:4px;">
|
|
<div class="card-title">Maps & Places</div>
|
|
<div class="card-text">Real and imagined geographies, faraway lands</div>
|
|
</div>
|
|
</a>
|
|
|
|
<a href="human-body.html" class="card">
|
|
<span class="card-header-bar" style="background:#a0522d; height:6px; display:block;"></span>
|
|
<img src="photos/1559757175-5700dde675bc_500x300.png" alt="An anatomical illustration" class="card-image">
|
|
<div class="card-body">
|
|
<img src="img/brain-hemisphere-artwork.png" alt="" style="max-width:50px; margin-bottom:4px;">
|
|
<div class="card-title">The Human Body</div>
|
|
<div class="card-text">The most remarkable machine you will ever inhabit</div>
|
|
</div>
|
|
</a>
|
|
|
|
<a href="space.html" class="card">
|
|
<span class="card-header-bar" style="background:#1a3a5c; height:6px; display:block;"></span>
|
|
<img src="photos/1462332420958-a05d1e002413_500x300.png" alt="A spiral galaxy" class="card-image">
|
|
<div class="card-body">
|
|
<img src="img/solar-system-planets-orbit-illustration.png" alt="" style="max-width:50px; margin-bottom:4px;">
|
|
<div class="card-title">Space & Beyond</div>
|
|
<div class="card-text">Stars, planets, and the deep emptiness between everything</div>
|
|
</div>
|
|
</a>
|
|
|
|
</div>
|
|
|
|
<hr class="dk-rule">
|
|
|
|
<div class="did-you-know">
|
|
<strong>Did You Know?</strong><br>
|
|
The oldest known living organism is a bristlecone pine tree in the White Mountains of California. It is over 5,000 years old — older than the Great Pyramid of Giza. It has no name, and its exact location is kept secret to protect it from those who might do it harm. Five thousand years of roots drinking snowmelt, and every spring it still puts on new growth — as though the command to cover the earth has never been revoked.
|
|
</div>
|
|
|
|
<div class="ornament">§ § §</div>
|
|
|
|
<img src="img/ancient-greek-heroes-relief-carving.png" alt="" class="clipart-divider">
|
|
|
|
<p class="text-center text-small" style="color:#8b7355; font-style:italic;">
|
|
<span class="easter-egg"> You found something hidden. The world rewards the attentive. </span>
|
|
"The heavens declare the glory of God," the psalmist wrote, and so does everything else — if you know how to listen. There are wonders here that do not announce themselves. <a href="about.html">Learn more about this site.</a>
|
|
</p>
|
|
|
|
</div>
|
|
|
|
<footer class="site-footer">
|
|
<div class="page-wrapper">
|
|
<p id="visitor-count" class="visitor-counter">You are visitor #000,000</p>
|
|
<p><small>Last updated: <span id="last-updated"></span></small></p>
|
|
<p>© 1999–2026 Dangerous Wonder. All rights reserved.</p>
|
|
<p class="footer-badge">Best viewed at 1024×768. Made with care, not with frameworks.</p>
|
|
</div>
|
|
</footer>
|
|
|
|
<script src="js/main.js"></script>
|
|
</body>
|
|
</html>
|