Ссылка поверх ссылки на изображение

Question

Я создаю целевую страницу и столкнулся с проблемой. У меня есть изображение проекта, которое при нажатии будет масштабироваться в режиме галереи, а поверх этого изображения это ссылка на страницу проекта Behance. Но то, что я делаю, когда нажимаю на ссылку проекта, открывает галерею изображений. Это мой код:

<div class="row masonry-wrap">
  <div class="masonry">

    <div class="masonry__brick" data-aos="fade-up">
      <div class="item-folio">


        <div class="item-folio__thumb">

          <a href="images/portfolio/gallery/LiveStreaming.png" class="thumb-link" title="Live" data-size="1617x1440">
            <img src="images/portfolio/LiveStream500x625.jpg" srcset="images/portfolio/LiveStream500x625.jpg 1x, images/portfolio/LiveStream1000x1250.jpg 2x" alt=""></a>
        </div>

        <a href="https://www.behance.net/gallery/77261419/Live-Streaming-Landing-Page-Design" class="item-folio__project-link" title="Project link">
                            Project Link
                        </a>

        <div class="item-folio__text">
          <h3 class="item-folio__title">
            Live Streaming Landing Page
          </h3>
          <p class="item-folio__cat">
            UI Design
          </p>
        </div>

        <div class="item-folio__caption">
          <p>A modern touch to a simple service. UI design made in Sketch for a Live Streaming Landing Page.</p>
        </div>

      </div>
      <!-- end item-folio -->
    </div>
    <!-- end masonry__brick -->

  </div>
  <!-- end masonry -->
</div>
<!-- end masonry-wrap -->

Что я делаю не так?