<div class="component__inner narrative__inner mr_wrapper_container_narrative" style="background-color: {{bgcolor}};">

  {{!-- {{> component this}} --}}

  <div class="narrative_main_container">
    <div class="narrative-container-title">

      {{#if title}}
      <h2 class="narrative_heading"  style="color:{{titleColor}};">
        {{{title}}}
      </h2>
      {{/if}}

    
      <div class="instruction_text">
        {{#if body}}
        <p>{{{body}}}</p>
         {{/if}}
        {{#if instruction}}
        <p><em>{{instruction}}</em></p>
        {{/if}}      
      </div>


      {{!-- <div
        class="component__widget narrative__widget{{#if _hasNavigationInTextArea}} narrative__text-controls{{/if}}">
        --}}


<div class="main_narrative_wrapper">

    {{#if mugshotImg}}
    <div class="horizontal-mugshot">
    <div><img src="{{mugshotImg}}" alt="{{mugshot_alt}}"></div>
    <div class="text-container">{{{mugshotText-1}}}</div>
  </div>
{{/if}}

    <div class="main_slider_container" style="background-color: {{bgcolor}};">
         
          <div class="main-container">
            <div class="narrative__slide-container">
              <div class="narrative__slider">

                {{#each _items}}
                <div
                  class="narrative__slider-image-container{{#if _isVisited}} is-visited{{/if}}{{#if _graphic.attribution}} has-attribution{{/if}}"
                  style="" data-index="{{@index}}"> 
                                 
                 <div class="myImgCrausal">
                  {{#if callout_top}}
                   <div class ="callout_top {{#if left_top}} left_top {{/if}} {{#if coll_maa}} coll_maa {{/if}} {{#if topCol}} topCol {{/if}} {{#if topColThird}} topColThird {{/if}}">{{{callout_top}}}</div> 
                   {{/if}}
                    <img  class="callout_img" src="{{_graphic.src}}" alt="{{_graphic.alt}}">

                    {{#if callout_bottom}}
                    <div class="callout_bottom {{_classes}} {{#if left_bottom}} left_bottom {{/if}} {{#if topCol}} botCol {{/if}} {{#if botColThird}} botColThird {{/if}} {{#if bottomFlipColl}} bottomFlipColl {{/if}} ">{{{callout_bottom}}}</div> 
                    {{/if}}
            
                    

                 </div>
               
                </div>
                {{/each}}
              </div>
            </div>
            {{!-- <div class="narrative__content">
              <div class="narrative__content-inner">
                {{#each _items}}
                <div class="narrative__content-item{{#if _isVisited}} is-visited{{/if}}" data-index="{{@index}}">
                  <div class="leftBody">
                  {{{body}}}
                </div>
                </div>
                {{/each}}


              </div>
            </div> --}}

            <div class="narrative__indicators narrative__slide-indicators">

              {{#each _items}}
              <div class="narrative__progress js-narrative-progress-click{{#if _isVisited}} is-visited{{/if}}"
                data-index="{{@index}}">
                
                
                </div>
              {{/each}}

            </div>
          </div> 


          
          

            <button data-direction="left"
            class="btn-icon narrative__controls narrative__controls-left js-narrative-controls-click"
            aria-label="{{_globals._accessibility._ariaLabels.previous}}">
            <img src="course\en\images\icon\back.png" />
          </button>

          <button data-direction="right"
            class="btn-icon narrative__controls narrative__controls-right js-narrative-controls-click"
            aria-label="{{_globals._accessibility._ariaLabels.next}}">
            <img src="course\en\images\icon\next.png" />
          </button>
        </div>

        {{#if mugshotImg}}
         <div class="horizontal-mugshot">
            <div><img src="{{mugshotImg}}" alt="{{mugshot_alt}}"></div>
            <div class="text-container">{{{mugshotText-2}}}</div>
          </div>
          {{/if}}
</div>
    
 {{#if istrikel }}
             <div  class ="trickelBtn_inner"><button class ="trickelBtn" data-jump="{{jumpTo}}"  data-block ="{{_parentId}}" ></button></div>            
       {{/if}}




      </div>
    </div>
  </div>
</div>