JSFiddle - React, Tailwind, and code Playground

by Sasá Rafalsky

HTML

<div id="acana-ingredient-transparency">
  <div class="acana-header">
    <div class="acana-desktop-img">
      <img src="https://cdn.shopify.com/s/files/1/0879/2211/4878/files/acana_header_desktop.webp?v=1724005342" alt="acana_header_desktop">
    </div>
    <div class="acana-mobile-img">
      <img src="https://cdn.shopify.com/s/files/1/0879/2211/4878/files/acana_header_mobile.webp?v=1724005342" alt="acana_header_mobile">
    </div>

    <div class="acana-content">
      <h1>ACANA'S™ QUALITY INGREDIENTS FOR PETS</h1>
      <h2>We're Transparent About Our Ingredients</h2>
      <p>With ACANA™ pet food, we’re proud of the fact that we source only quality ingredients from our trusted suppliers, in recipes we control from start to finish. By providing high inclusions of animal protein balanced with fruits, vegetables and botanicals, our ACANA pet food is as nourishing as it is satisfying.</p>

      <h2 class="h-color">WHAT DOES FRESH OR RAW MEAN?</h2>
      <p><strong class="h-color">Fresh:</strong> Our fresh ingredients use refrigeration as the sole method of preservation.</p>
      <p><strong class="h-color">Raw:</strong> Our raw ingredients are frozen at the peak of freshness to preserve nutrients.</p>
    </div>
  </div>

  <div class="acana-quality">
    <h2>Our ACANA recipes include:</h2>
    <div class="acana-quality-inner">
      <div class="acana-quality-left">
        <h1>50-85<sup>﹪</sup><sup>*</sup>
</h1>
        <p>QUALITY ANIMAL INGREDIENTS</p>
      </div>
      <div class="acana-quality-right">
        <h1>25-50<sup>﹪</sup><sup>+</sup>
</h1>
        <p>FRESH WHOLE FRUITS, VEGETABLES &amp; BOTANICALS</p>
      </div>
    </div>
    <p class="disclaimer">* Approximate and derived from the unprocessed state of the ingredients.<br> + We also add vitamins, minerals, natural preservatives and probiotics.</p>
  </div>

  <div class="acana-slate" style="background-color: #333;">
    <div class="acana-slate-img" style="background-image:...