diff --git a/index.html b/index.html new file mode 100644 index 0000000..d23ad04 --- /dev/null +++ b/index.html @@ -0,0 +1,144 @@ + + + + + + + Document + + + + + + + + +
+ +
+

The Deepest Part of the Ocean is Deeper Than Mount Everest is Tall

+
+ +
+ most likely a picture of Mount-Everest + +

+ The Mariana Trench, the deepest part of the ocean, plunges to about 36,000 feet (nearly 11,000 meters) below + sea level. That’s deeper than Mount Everest's height, which stands at 29,032 feet (8,849 meters). If Mount + Everest + were placed inside the trench, there would still be over 7,000 feet (2,100 meters) of water above it. The trench + is + located in the western Pacific Ocean and was first explored in 1960 by the bathyscaphe Trieste, reaching its + deepest + known point, Challenger Deep. +

+
+
+ + +
+ +
+

There’s a Hidden Ocean Underneath the Earth’s Crust

+
+ +
+ most likely a picture of an underground ocean maybe +

Scientists have discovered what appears to be a vast underground ocean trapped between layers of rock + about 400 miles (640 kilometers) below the Earth's surface. This hidden reservoir is thought to contain more + water than all the oceans on the surface combined. The water is stored in a mineral called ringwoodite, which + acts like a sponge, holding the water under immense pressure. This discovery suggests that Earth's water cycle + extends far deeper than previously believed.

+
+
+ + +
+ +
+

Oceans Hold Around 97% of Earth’s Water

+
+ +
+ most likely a picture of Earth in map from +

+ While many people associate Earth's water supply with freshwater lakes and rivers, the vast majority of the + planet’s + water—around 97%—is actually contained in the oceans. These immense bodies of saltwater serve as Earth's largest + reservoir, playing a crucial role in climate regulation, weather patterns, and supporting marine life. The + remaining + 3% of Earth's water is mostly locked in glaciers and ice caps, with only a tiny fraction available as freshwater + for + human consumption. +

+
+
+ + +
+ +
+

There Are "Ghost" Species in the Deep Ocean

+
+ +
+ Picture of a cute ghost fish thing +

In the deepest and darkest parts of the ocean, scientists have discovered fascinating life forms that seem + almost + invisible. These creatures, often called "ghost fish," lack pigmentation, making them appear translucent. They + have + evolved to survive extreme pressure and total darkness, relying on slow metabolisms and highly sensitive sensory + organs. + Some species use bioluminescence to communicate or attract prey, while others have developed elongated bodies to + move + efficiently in the deep. The deep sea remains one of Earth's most mysterious and least explored environments. +

+
+
+ + +
+ +
+

Oceans Produce Half of the World’s Oxygen

+
+ +
+ A human breathing fresh air +

+ Oceans, particularly through the activity of microscopic organisms called phytoplankton, generate over 50% of + the + Earth’s oxygen. These tiny plants float near the ocean’s surface and use sunlight to photosynthesize, releasing + oxygen as a byproduct. This process, known as oceanic photosynthesis, is essential for maintaining Earth's + atmosphere + and supporting marine ecosystems. Without phytoplankton, oxygen levels in the air would drop significantly, + affecting + all life on the planet. +

+
+
+ + + + + + + \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..5151a4b --- /dev/null +++ b/style.css @@ -0,0 +1,91 @@ +body { + font-family: Helvetica, sans-serif; + margin: 0; + background-color: #b4cee1; +} + +/*https://coolors.co. Good tool for picking color themes for websites*/ + +#header { + text-align: center; + background-color: #16324f; + padding: 40px; +} + +h1 { + background-image: linear-gradient(to left, #129490, #95cba0); + /*Makes the heading two coloured with a gradient*/ + color: transparent; + background-clip: text; + -webkit-background-clip: text; + font-size: 70px; +} + +.fact-left { + width: 80%; + height: 260px; + /* + Needed to set a fixed height to cantain the images inside the div box. + Other solution?? + */ + background-color: #3E92CC; + padding: 20px; + margin-top: 20px; + margin-bottom: 20px; + margin-left: 20px; + /*rounded corners of the box*/ + border-radius: 5px; +} + +h2 { + color: #13293D; + font-size: 30px; +} + +p { + color: whitesmoke; + font-size: 18px; +} + +.fact-right { + width: 80%; + height: 260px; + /* + Needed to set a fixed height to cantain the images inside the div box. + Other solution?? + */ + background-color: #2a628f; + padding: 20px; + margin-left: auto; + /*To align the boxes to the right*/ + margin-top: 20px; + margin-bottom: 20px; + margin-right: 20px; + /*rounded corners of the box*/ + border-radius: 5px; +} + +img { + width: 270px; + border-radius: 5px; +} + +#footer { + background-color: #16324f; + padding: 10px; +} + +#footer h2 { + text-align: center; + color: whitesmoke; +} + +#footer h2 a { + color: #95cba0; + +} + +/*To create a color change on hover*/ +#footer h2 a:hover { + color: #129490; +} \ No newline at end of file