{{#renderOverlay}}
<div class="overlay js-overlay">
  <div class="overlay__non-clickable"></div>
  <div class="overlay__header">
    <button class="overlay__back js-overlay-back">
      <svg
        width="18"
        height="18"
        viewBox="0 0 18 18"
        xmlns="http://www.w3.org/2000/svg"
      >
        <g
          transform="translate(5.000000, 0.000000) scale(-1.5, 1.5) translate(-5.000000, -0.000000) "
          id="arrow_left"
        >
          <path
            d="M0,1.375 L1.4,1.19904087e-14 L5.6,4.125 L4.2,5.5 L0,1.375 L0,1.375 L0,1.375 Z M0,9.625 L5.6,4.125 L7,5.5 L1.4,11 L0,9.625 L0,9.625 L0,9.625 Z"
            fill="#2A292E"
            fill-rule="evenodd"
          ></path>
        </g>
      </svg>
    </button>
    <button class="overlay__close js-overlay-close">
      <svg
        width="18"
        height="18"
        viewBox="0 0 18 18"
        xmlns="http://www.w3.org/2000/svg"
      >
        <path
          d="M9 7.615L1.385 0 0 1.385 7.615 9 0 16.615 1.385 18 9 10.385 16.615 18 18 16.615 10.385 9 18 1.385 16.615 0z"
          fill="#2A292E"
          fill-rule="evenodd"
        />
      </svg>
    </button>
  </div>
  {{/renderOverlay}} {{#renderYoutube}}
  <div class="overlay__video ar-16/9 js-overlay-video">
    <div class="overlay__video-placeholder" id="youtube-card-{{cardId}}"></div>
  </div>
  {{/renderYoutube}} {{^renderYoutube}}
  <div class="overlay__card js-overlay-card" data-card-id="{{cardId}}">
    <div class="overlay__container">
      <div class="overlay__content js-overlay-content js-main"></div>
    </div>
  </div>
  {{/renderYoutube}} {{#renderOverlay}}
</div>
{{/renderOverlay}}