Rhye template: replacing heading text with image

<div class="swiper-slide">
  <a class="d-inline-block js-change-text-hover" href="project-details-7-fullscreen-left.html" data-pjax-link="fullscreenSlider">
    <!-- small brand logo -->
    <img class="d-inline-block mb-2" src="https://placehold.co/160x80" alt="alt"/>
    <div class="w-100"></div>
    <!-- // -->
    <!-- <h2 class="h1 slider__heading js-split-text" data-split-text-type="lines, words, chars">Silence &amp; Noise</h2> -->
    <div class="slider__wrapper-button mt-0-5">
      <div class="change-text-hover small-caps js-change-text-hover">
        <!-- label by default -->
        <div class="change-text-hover__normal js-split-text split-text js-change-text-hover__normal" data-split-text-type="lines" data-split-text-set="lines">Product Design</div>
        <!-- - label by default -->
        <!-- label on hover -->
        <div class="change-text-hover__hover js-change-text-hover__hover">
          <!-- hover line -->
          <div class="change-text-hover__line js-change-text-hover__line"></div>
          <!-- - hover line --><span class="js-split-text split-text" data-split-text-type="lines" data-split-text-set="lines">Explore Project</span>
        </div>
        <!-- - label on hover -->
      </div>
    </div>
  </a>
</div>