{{#imageArray}}
{{^image}}
<li>
    <div class="message">
      <p id="creativeMessage{{number}}" class='creativeMessage'>{{#message}}{{message}}{{/message}}{{^message}}Your Message Goes here.{{/message}}</p>
    </div>
    <a target='_blank' id='creativePreview-previewLink' class='creativePreview-link creativePreview-linkPreview creativePreview-linkPreview-background tw-carousel-creative'>
        <iframe src={{url}} id="creativePreview-previewUpload" name='creative_preview' scrolling='no'></iframe>
    </a>
    <div class="preview-content facebook-content carousel-content">
        <h4 class="ad-link">
          <a class="creativePreview-link" id="creativeTitle{{number}}" target="_blank">
            {{#title}}{{title}}{{/title}}
            {{^title}} Your Headline goes here {{/title}}
          </a>
        </h4> 
        <!-- <p class="creativePreview-link creativePreview-body" id="creativeBody{{number}}">
          {{#bodyText}}{{bodyText}}{{/bodyText}}
          {{^bodyText}}This is the body text. Explain your product or say something clever about your creative.{{/bodyText}}
        </p> -->
        <div class="action-container">
          <div class="actionButton hidden" id="actionButton{{number}}">
            <a role="button" href="" target="_blank" rel="noopener nofollow" data-lynx-mode="async">
              {{#callToActionType}}{{callToActionType}}{{/callToActionType}}
              {{^callToActionType}}No Button{{/callToActionType}}
            </a>
          </div>
          <div class="url">
            <a target="_blank" href="" class="creativePreview-link" id="creativeDomain{{number}}">
              {{#displayUrl}}{{displayUrl}}{{/displayUrl}}
              {{^displayUrl}}Domain Name{{/displayUrl}}
            </a>
          </div>
        </div>
    </div>
</li>
{{/image}}

{{#image}}
<li>
    <div class="message tw-carousel-message">
      <span>
        <i class='bx bxl-twitter' style='color:#1d9bf0;font-size: 4rem;'></i> 
      </span>
      <span style="display: flex;flex-direction: column;margin-top: 9px;">
        <span><span class="display-name" style="font-size: 1.2rem;">Rebid</span><span class="small">@rebid_co <span class="timelabel">15m</span></span></span>
        <span id="creativeMessage{{number}}" class='creativeMessage'>{{message}}</span>
      </span>
    </div>
    <a target='_blank' id='creativePreview-previewLink' class='creativePreview-link creativePreview-linkPreview creativePreview-linkPreview-background'>
        <img src={{url}} id="creativePreview-previewUpload" class='creativePreview-preview tw-carousel-image' style='display:inline-block;width: 280px;max-width: unset !important;' />
    </a>
    <div class="preview-content facebook-content carousel-content tw-carousel-btm">
        <div class="tw-contentWr">

        <h4 class="ad-link">
          <a class="creativePreview-link" id="creativeTitle{{number}}" target="_blank">
            {{#title}}{{title}}{{/title}}
            {{^title}} Headline {{/title}}
          </a>
        </h4> 
        <!-- <p class="creativePreview-link creativePreview-body" id="creativeBody{{number}}">
          {{#bodyText}}{{bodyText}}{{/bodyText}}
          {{^bodyText}}This is the body text. Explain your product or say something clever about your creative.{{/bodyText}}
        </p> -->
        <div class="action-container">
          <!-- <div class="actionButton hidden" id="actionButton{{number}}">
            <a role="button" href="" target="_blank" rel="noopener nofollow" data-lynx-mode="async">
              {{#callToActionType}}{{callToActionType}}{{/callToActionType}}
              {{^callToActionType}}No Button{{/callToActionType}}
            </a>
          </div> -->
          <div class="url" style="margin-top: -16px;">
            <a target="_blank" href="" class="creativePreview-link tw-clear" id="creativeDomain{{number}}" style="text-decoration: none !important; margin-left: 3px;">
              <i class='bx bx-link' style='color:#080808'></i>
              {{#displayUrl}}{{displayUrl}}{{/displayUrl}}
              {{^displayUrl}}Landing URL will appear here.{{/displayUrl}}
            </a>
          </div>
        </div>
        </div>
        <div class="tw-card-lookalike">
          <div class="tw-card-icons">
            <i class='bx bx-comment'></i>
            <i class='bx bx-transfer-alt bx-rotate-90' ></i>
            <i class='bx bx-heart'></i>
            <i class='bx bx-share'></i>
          </div>
          <div class="promoted">
            <i class='bx bx-link-external'></i>
            Promoted
          </div>
        </div>
    </div>
</li>
{{/image}}
{{/imageArray}}