<section class="max-w-[90%] mx-auto px-4 py-10" data-component-type="Content" data-component-slug="sports-template-gallery">

  <!-- files Grid -->
  <div id="gallery" class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-5">

    <!-- file 1 -->
    <div class="overflow-hidden shadow rounded-lg">
      <img data-node="gal_img1" data-node-type="file" data-node-label="Gallery file 1" data-node-default="https://res.cloudinary.com/duukclzsd/image/upload/v1767338012/seltrix/templates/sports-template/gallery/oneI.png" src="{{gal_img1}}" class="w-full h-full object-cover" alt="Gallery file 1">
    </div>

    <!-- file 2 -->
    <div class="overflow-hidden shadow rounded-lg">
      <img data-node="gal_img2" data-node-type="file" data-node-label="Gallery file 2" data-node-default="https://res.cloudinary.com/duukclzsd/image/upload/v1767338016/seltrix/templates/sports-template/gallery/twoI.png" src="{{gal_img2}}" class="w-full h-full object-cover" alt="Gallery file 2">
    </div>

    <!-- file 3 -->
    <div class="overflow-hidden shadow rounded-lg">
      <img data-node="gal_img3" data-node-type="file" data-node-label="Gallery file 3" data-node-default="https://res.cloudinary.com/duukclzsd/image/upload/v1767338015/seltrix/templates/sports-template/gallery/threeI.png" src="{{gal_img3}}" class="w-full h-full object-cover" alt="Gallery file 3">
    </div>

    <!-- file 4 -->
    <div class="overflow-hidden shadow rounded-lg">
      <img data-node="gal_img4" data-node-type="file" data-node-label="Gallery file 4" data-node-default="https://res.cloudinary.com/duukclzsd/image/upload/v1767338010/seltrix/templates/sports-template/gallery/fourI.png" src="{{gal_img4}}" class="w-full h-full object-cover" alt="Gallery file 4">
    </div>

    <!-- file 5 -->
    <div class="overflow-hidden shadow rounded-lg">
      <img data-node="gal_img5" data-node-type="file" data-node-label="Gallery file 5" data-node-default="https://res.cloudinary.com/duukclzsd/image/upload/v1767338009/seltrix/templates/sports-template/gallery/fiveI.png" src="{{gal_img5}}" class="w-full h-full object-cover" alt="Gallery file 5">
    </div>

    <!-- file 6 -->
    <div class="overflow-hidden shadow rounded-lg">
      <img data-node="gal_img6" data-node-type="file" data-node-label="Gallery file 6" data-node-default="https://res.cloudinary.com/duukclzsd/image/upload/v1767338013/seltrix/templates/sports-template/gallery/sixI.png" src="{{gal_img6}}" class="w-full h-full object-cover" alt="Gallery file 6">
    </div>

  </div>
</section>