<!DOCTYPE html>
<html>
<head>
<title>The Water Cycle</title>
</head>
<body>
<header>
<h1>The Water Cycle</h1>
</header>
<section>
<article>
<!-- This is a comment: The main content of the webpage starts here -->
<p>The water cycle, also known as the hydrologic cycle, is the continuous movement of water on, above, and below the surface of the Earth.</p>
<hr>
<!-- Unordered List -->
<h2>Stages of the Water Cycle</h2>
<ul>
<li>Evaporation</li>
<li>Condensation</li>
<li>Precipitation</li>
<li>Collection</li>
</ul>
<!-- Description List -->
<dl>
<dt>Evaporation</dt>
<dd>The process where water changes from a liquid to a gas or vapor.</dd>
<dt>Condensation</dt>
<dd>The conversion of vapor into liquid when the air is cooled.</dd>
</dl>
<!-- Image with attributes -->
<img src="water_cycle.jpg" width="500" height="300" alt="Diagram of the Water Cycle">
</article>
<!-- Form to subscribe to a newsletter -->
<aside>
<h2>Subscribe to Our Science Newsletter</h2>
<form>
<input type="text" placeholder="Enter your email">
<input type="submit" value="Subscribe">
</form>
</aside>
<!-- Audio and Video -->
<section>
<h2>Listen to the Sounds of Rain</h2>
<audio controls>
<source src="rain.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
<h2>Watch a Video on the Water Cycle</h2>
<video width="320" height="240" controls>
<source src="water_cycle.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
</section>
<!-- Table with rowspan and colspan -->
<section>
<h2>Water Cycle Facts</h2>
<table border="1">
<tr>
<th>Fact</th>
<th>Description</th>
</tr>
<tr>
<td>Water Coverage</td>
<td>Approximately 71% of the Earth's surface is water-covered.</td>
</tr>
<tr>
<td>Water in the Atmosphere</td>
<td>Less than 0.001% of the total water on Earth is in the atmosphere at any given time.</td>
</tr>
</table>
</section>
<!-- Links -->
<footer>
<a href="https://www.example.com/more-science" target="_blank">Learn More About Earth Science</a><br/>
<a href="mailto:[email protected]">Contact Our Science Department</a><br/>
</footer>
</section>
</body>
</html>
