<section class="text">
    <h2>Weird Fishes</h2>
    <p>In the deepest ocean, the bottom of the sea. Your eyes, they turn me<br>
      Why should I stay here? Why should I stay? I'd be crazy not to follow,
      follow where you lead.</p>
    <p>Your eyes,
      they turn me turn me on to phantoms (way out). 
      I follow to the edge of the Earth (way out, way out). And fall off.</p>
    <p>Yeah, everybody leaves if they get the chance and this is my chance.<br>
     I get eaten by the worms and weird fishes. Picked over by the worm and weird fishes, weird fishes, weird fishes.</p>
    <p>I'll hit the bottom, hit the bottom and escape. Escape. I'll hit the bottom, hit the bottom and escape.
      Escape.</p>
  <p>In the deepest ocean, the bottom of the sea. Your eyes, they turn me<br>
      Why should I stay here? Why should I stay? I'd be crazy not to follow,
      follow where you lead.</p>
    <p>Your eyes,
      they turn me turn me on to phantoms (way out). 
      I follow to the edge of the Earth (way out, way out). And fall off.</p>
    <p>Yeah, everybody leaves if they get the chance and this is my chance.<br>
     I get eaten by the worms and weird fishes. Picked over by the worm and weird fishes, weird fishes, weird fishes.</p>
    <p>I'll hit the bottom, hit the bottom and escape. Escape. I'll hit the bottom, hit the bottom and escape.
      Escape.</p>
      <img src="https://marianabeldi.github.io/scroll-driven-sardinas/img/porto1.svg" alt="sardinas bajo en sodio">
  <p>In the deepest ocean, the bottom of the sea. Your eyes, they turn me<br>
      Why should I stay here? Why should I stay? I'd be crazy not to follow,
      follow where you lead.</p>
    <p>Your eyes,
      they turn me turn me on to phantoms (way out). 
      I follow to the edge of the Earth (way out, way out). And fall off.</p>
    <p>Yeah, everybody leaves if they get the chance and this is my chance.<br>
     I get eaten by the worms and weird fishes. Picked over by the worm and weird fishes, weird fishes, weird fishes.</p>
    <p>I'll hit the bottom, hit the bottom and escape. Escape. I'll hit the bottom, hit the bottom and escape.
      Escape.</p>
  <p>In the deepest ocean, the bottom of the sea. Your eyes, they turn me<br>
      Why should I stay here? Why should I stay? I'd be crazy not to follow,
      follow where you lead.</p>
    <p>Your eyes,
      they turn me turn me on to phantoms (way out). 
      I follow to the edge of the Earth (way out, way out). And fall off.</p>
    <p>Yeah, everybody leaves if they get the chance and this is my chance.<br>
     I get eaten by the worms and weird fishes. Picked over by the worm and weird fishes, weird fishes, weird fishes.</p>
    <p>I'll hit the bottom, hit the bottom and escape. Escape. I'll hit the bottom, hit the bottom and escape.
      Escape.</p>
    </section>
*, *::before, *::after { box-sizing: border-box; }
body {
  background-color: #3848a0;
  color: #f5dbc8;
  font-family: "Open Sans", arial, sans-serif, system-ui;
  margin: 0 auto;
}
h2 {
    line-height: 1;
    text-transform: uppercase;
}
.text {
  margin: 5rem auto;
  max-width: 60ch;
}
img {
  margin: 2rem;
  animation: fadeIn;
  animation-timeline: view();
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.