<div class="component__inner hotgraphic__inner mr_wrapper_container" style="background-color: {{bgColor}};">
  <div class="hotgraphic__tile-item-container hotgrapghics_container" role="list">
    <div class="container-title">
      {{#if title}}
      <h2 class="heading" style="color: {{titleColor}}">
        {{{title}}}
      </h2>
      {{/if}}
      <div class="body_content"> {{{body}}}</div>
      <div class="instruction_text">
        {{{_instructionText}}}
      </div>

      <div class="container">
        <div class="hotgraphicsTabs_container">
          <div class="w-100 hotGraphicsTabs_img_container">

            <div class="{{#if bothsidebtn}} bothsidebtn {{/if}}">
              <div class="disabled_Icon_container">
                {{#if disabledBtn}}
                {{#each disablebtnItem}}
                {{!-- <button class="disabled-itm-btn" style="top: {{top}}px; left: {{left}}px;">
                  {{title}} --}}
                  <img src="{{img}}" style="background-color: {{iconbg}}" />
                  {{!-- </button> --}}
                {{/each}}
                {{/if}}
              </div>
              <div class="hotgraphicTabs_button_container">
                {{#each _items}}
                <button
                  class="hotgraphic__tile  item-{{@index}}{{#if _graphic._classes}} {{_graphic._classes}}{{/if}} js-hotgraphic-item-click"
                  data-index="{{@index}}" style="top: {{btnPosition.top}}px; left: {{btnPosition.left}}px">
                  {{#if icon}}
                  <img class="click_icon" src="{{icon}}" style="background-color: {{iconbg}};">
                  {{/if}}
                  {{!-- <span class="aria-label">{{title}}</span> --}}
                  <span class="text button_text_hotspotTabs">{{{title}}}</span>
                </button>
                {{/each}}
              </div>
            </div>



            <img src="{{_graphic.src}}">
          </div>

          <div class="instruction_text">
            {{#if footerText}}
            <p class="footerText">{{{footerText}}}</p>
            {{/if}}
          </div>
          <div class="clicked_container w-100">


            {{!-- <div class="position_button">

            </div> --}}




            <div class="bottom_text">
              {{#each bottomText}}
              <p style="position: relative; top: {{top}}px; left: {{left}}px">{{text}}</p>
              {{/each}}
            </div>
          </div>
        </div>


        <div class="feedback_container_box">
          {{#each _items}}
          <div class="feedback-container" data-id="{{@index}}"
            style="display:none; top: {{feedback_position.top}}px; right: {{feedback_position.right}}px; left: {{feedback_position.left}}px; bottom: {{feedback_position.bottom}}px;">
            <button class="close_btn"><img src="course/en/images/RR_EPL_close.png"></button>
            <div class="feedback" style="background-color: {{bgColor}}">

              <div class="feedback_body">
                {{{body}}}
              </div>
            </div>
          </div>
          {{/each}}
        </div>


      </div>




    </div>

  </div>




</div>