<div class="component__inner text__inner mr_wrapper_container_text" style="background-color: {{bgColor}};">


  {{!-- Template 01 --}}

  {{#if isIntro }}
  <div class="staticPageWrapper padding_topIntro">
    <div class="textHeading">
      <p >{{{displayTitle}}}</p>
    </div>
    <div class="container-title" style="">
      {{!-- {{> component this}} --}}

      <div class="contentpart_intro w-50" style=" ">
        <div class="component__body text__body">
          <div class="component__body-inner text__body-inner" >
            {{!-- <div class="display_icon"></div> --}}
            {{{compile body}}}
            {{!-- <div style="width:100%;"><img src=" course/en/images/icon_left.png"></div> --}}
          </div>
        </div>

      </div>
      <div class="mrImgContainer w-50 introImgP" style="max-width: {{max-width}};">
        <img src="{{displayImange}}"  alt="{{imgalt}}" >
      </div>
    </div>

    
  </div>
  {{/if}}

  {{!-- Template02 --}}

    {{#if isIntro1 }}
  <div class="staticPageWrapper" style="padding-top: {{padding}};">
    {{#if displayTitle}}
    <div class="textHeading" style="color: {{titleColor}};">
      <p >{{{displayTitle}}}</p>
    </div>
    {{/if}}
    <div class="container-title">
      {{!-- {{> component this}} --}}
      <div class="contentpart w-50" style="">
        <div class="component__body text__body">
          <div class="component__body-inner text__body-inner" >
            {{!-- <div class="display_icon"><img src=" course/en/images/icon_left.png"></div> --}}
            {{{compile body}}}
          </div>
        </div>
      </div>
   {{#if displayImange}}
      <div class="mrImgContainer {{#if imgLeft}} imgLeft {{/if}} {{#if textBlock}} w-40 {{else}} w-50 {{/if}} isIntro1" style="max-width: {{imgWidth}}; padding: {{imgPadding}}">
        <img src="{{displayImange}}" alt="{{imgalt}}" >
      </div>
      {{/if}}
    </div>
  </div>
  {{/if}}

  {{#if isIntro2 }}
  <div class="staticPageWrapper">
    <div class="textHeading">
      {{#if displayTitle}}
      <p  style="color: {{titleColor}}">{{{displayTitle}}}</p>
      {{/if}}
    </div>
    <div class="container-title" style="background-color: {{bgcolor}};">
      {{!-- {{> component this}} --}}
      <div class="contentpart w-50" style="">
        <div class="component__body text__body" style="">
          <div class="component__body-inner text__body-inner" >
            {{{compile body}}}
          </div>
        </div>
      </div>
      <div class="mrImgContainer w-50 isIntro1">
        <img src="{{displayImange}}" alt="" >

      </div>
    </div>
  </div>
  {{/if}}

  {{#if isIntro3 }}
  <div class="staticPageWrapper"> 
    <div class="textHeading2 ">
      <p role="heading"  class="" style="color: {{titleColor}}">{{{displayTitle}}}</p>
    </div>
    <div class="headingPara component__body text__body" >
    {{{body}}}
    </div>
    
    <div class="container-title_intro02"  style="height:auto">
          {{!-- {{> component this}} --}}     
       <div class="mrImgContainer w-25" style="max-width:370px; padding:20px">
          <img src="{{displayImange}}" alt="{{imagetitle}}" >
          <div class="imgTitle">{{imagetitle}}</div>
        </div>
       <div class="mrImgContainer w-25" style="max-width:370px; padding:20px">
          <img src="{{displayImange1}}" alt="{{imagetitle1}}" >
           <div class="imgTitle" >{{imagetitle1}}</div>
      </div>
      <div class="mrImgContainer w-25" style="max-width:370px; padding:20px">
          <img src="{{displayImange2}}" alt="{{imagetitle2}}" >
           <div class="imgTitle" >{{imagetitle2}}</div>
      </div>
  </div>

  <div class="component__body-inner text__body-inner" >
      {{{instruction}}}
    </div>

    {{#if footerText}}
          <p class="footerTexts"> 
            {{{footerText}}}
          </p>
      {{/if}} 

  </div>
  {{/if}}

    {{#if isIntro4 }}
    <div class="staticPageWrapper" style="margin-top: -1rem;">

      <div class="text_intro04" style="background-color: {{topModuleBgcolor}};">
        <div class="reflection_icon_container" style="background-color: {{iconBgcolor}};">
          <img src="{{displayImage1}}" alt="{{imgalt}}">
        </div>
        <div class="reflectionWrapper">
          <h2  class="reflection_heading" style="color: {{bodytitleColor}};"> {{{displayTitle}}}</h2>
          <div class="headBody" >{{{body1}}}</div>
          <div class="headIns" >{{{instruction}}}</div>
          <div class="note_text" >{{{note_text}}}</div>
          <button type="submit" class="select_button">{{{btntext2}}}</button>
        </div>
      </div>


      <div class="showDive" id="shohid" style="">
        <div class="showDive_content" id="" style="background-color: {{bgcolor}}">

          <div class="showDive_content_inner">
            <div class="contentpart w-60">
              <div class="component__body text__body">
                <div class="component__body-inner text__body-inner" >
                  <div>
                    <img src='course/en/images/icon_left.png' class='qoutIcon' aria-hidden="true">
                      {{{compile body}}}
                    <img src='course/en/images/icon_right.png' class=' ' aria-hidden="true" style='margin-bottom: -10px;'>
                  </div>
                </div>
              </div>
            </div>
            <div class="mrImgContainer w-40 text_intro04_Popimg text-center" style="">
              <img src="{{displayImange}}" alt="{{imgalt-Anna}}" style="" >
            </div>
          </div>
        </div>
        <div class="textHeadingMedia" style="background-color: transparent; text-align: center !important">
          {{#if endLessonText}}
          <p class="endText">
            {{endLessonText}}</p>
          {{/if}}
        </div>
      </div>
    </div>
    {{/if}}
    {{#if isIntro6}}
    <div class="staticPageWrapper">
      <div class="textHeading2">
        {{#if displayTitle}}
        <p  style="color: {{titleColor}}">{{{displayTitle}}}</p>
        {{/if}}
      </div>
      {{#if bodyTitle}}
      <span class="bodyTitle" >{{{bodyTitle}}}</span>
      {{/if}}
      <div class="container-title" style="background-color: {{bgColor}}; gap: unset">
        <div class="contentpart w-50" style="">
          <div class="component__body text__body">
            <div class="component__body-inner text__body-inner" >
              {{{compile body}}}
              {{#if footerText}}
              <p class="footerText" >{{footerText}}</p>
              {{/if}}
            </div>
          </div>
        </div>
        <div class="mrImgContainer w-50  introImgP">
          <img src="{{displayImange}}" alt="" >
        </div>
      </div>
      {{#if endText}}
      <p class="text-center">
        {{endText}}
      </p>
      {{/if}}
    </div>
    {{/if}}


    {{#if isIntro10}}
    <div class="staticPageWrapper">
      <div class="textHeading" style="">
        <p  style="color: {{titleColor}}"> <img src="{{displayImage1}}"> {{{displayTitle}}}</p>
      </div>
      <div class="text_intro04">
        <div class="headBody" >{{{body1}}}</div>
        {{#if instruction}}
        <div class="headIns" >{{{instruction}}}</div>
        {{/if}}

        {{#if note_text}}
        <div class="note_text" >{{{note_text}}}</div>
        {{/if}}
        <div class="headIns">{{{body3}}}</div>
        <button type="submit" class="select_button" id="submit_pdf">{{{btntext2}}}</button>
        <button type="submit" class="btn1">{{{btntext1}}}</button>
      </div>
      <div class="showDive" id="shohid" style="">
        <div class="showDive_content" id="" style="background-color: {{bgcolor}}">
          <div class="showDive_content_inner">
            <div class="contentpart w-60">
              <div class="component__body text__body">
                <div class="component__body-inner text__body-inner" >
                  {{{compile body}}}
                </div>
              </div>
            </div>
            <div class="mrImgContainer w-40 text_intro04_Popimg text-center" style="">
              <img src="{{displayImange}}" alt="" style="" >
            </div>
          </div>
        </div>
      </div>
    </div>
    {{/if}}

    {{!-- --------------------------------- --}}

  {{#if isIntro11}}
  <div class="staticPageWrapper padding_topIntro">
    <div class="textHeading">
      <p  style="color: {{titleColor}}">{{{displayTitle}}}</p>
    </div>
    <div class="container-title" style="">
      {{!-- {{> component this}} --}}

      <div class="contentpart_intro w-50" style=" ">
        <div class="component__body text__body">
          <div class="component__body-inner text__body-inner" >
            {{!-- <div class="display_icon"></div> --}}
            {{{compile body}}}
            {{!-- <div style="width:100%;"><img src=" course/en/images/icon_left.png"></div> --}}
          </div>
        </div>

      </div>
    </div>
  </div>
  {{/if}}

    {{!-- --------------------------------- --}}


    {{!-- Template11 --}}
    {{#if assessment_Algorithm }}
    <div class="staticPageWrapper">
     {{#if displayTitle}}
      <div class="textHeading" style="background-color: {{bgColor}};">
        <p role="heading" style="color: {{titleColor}};">{{{displayTitle}}}</p>
      </div>
      {{/if}}
      <div class="textPara" style="background-color: {{bgColor}};">
        <div class="component__body text__body">
          <div class="component__body-inner text__body-inner">
            {{{compile body}}}</div>
        </div>
      </div>


      {{#if assessment_image}}
      <div class="container-title" style="">
        <div class="contentpart_intro w-90" style=" ">
          <div class="component__body text__body">
            <div class="component__body-inner text__body-inner" style="max-width: {{max-width}}">
              <img class="intro_images" src="{{assessment_image}}" alt="{{imgalt}}">
              {{#if body01_text}}
              {{{body01_text}}}
              {{/if}}
            </div>

          </div>
        </div>

      </div>
      {{/if}}
    </div>
  </div>
  {{/if}}

      {{#if isIntroSpeechBubble }} <div class="staticPageWrapper_speechbubble">
      {{#if displayTitle}}
      <div class="textHeading" style="color: {{titleColor}}">
        <p>{{{displayTitle}}}</p>
      </div>
      {{/if}}
      {{#if bodyTitle}}
      <div class="bodynum">{{{bodyTitle}}}</div>
      {{/if}}
      <div class="container-title" style="background-color: {{bgcolor}};">{{!-- {{> component this}} --}}
        {{#if bodyTitle01}}
        <span class="bodyTitle">{{{bodyTitle01}}}</span>
        {{/if}}       
      </div>
       <div class="contentpart w-100" style="padding: 15px">
          <div class="component__body text__body">
            <div class="component__body-inner text__body-inner callout_area">
              <div class="callout_top">{{{body}}}</div>
              <div><img src="{{image.src}}" alt="{{image.alt}}"></div>
            </div>
          </div>
        </div>
    </div>
    {{/if}}

</div>


<style>
  {
      {
      #if listTextColor
    }
  }

  . {
      {
      _id
    }
  }

  .text__body-inner ul {
    color: {
        {
        listTextColor
      }
    }

    ;
    font-weight: 500;
  }

    {
      {
      /if
    }
  }

    {
      {
      #if _componentTitleColor
    }
  }

  . {
      {
      _id
    }
  }

  .text__body-inner a {
    color: {
        {
        _componentTitleColor
      }
    }

    ;
    font-size:1em;
  }

    {
      {
      /if
    }
  }

    {
      {
      #if listBullatColor
    }
  }

  . {
      {
      _id
    }
  }

  .text__body-inner ul>li:before {
    color: {
        {
        listBullatColor
      }
    }

    ;
  }

    {
      {
      /if
    }
  }

  .text_ {
    margin-left: 6%;
    margin-bottom: 10px;

  }

  .text_ p {
    margin: 8px 0 8px 0;
  }
</style>