<section class="row adopters-carousel p-0">

  <div id="adopters">
    <div id="carousel-selected-indicator" class="carousel slide" data-ride="carousel" data-interval="6000">
      <div class="carousel-inner">

      {{ $endorsements := $.Site.Data.endorsements.endorsements }}
      {{ range first 1 $endorsements }}
        <div class="carousel-item active">
          <div class="item">
            <div class="logo"><img src="{{ .image }}" alt=""></div>
            <div class="case-study">{{ .text | safeHTML }}<div class="description">{{ .subtitle | safeHTML }}</div></div>
          </div>
        </div>
      {{ end }}
      {{ range after 1 $endorsements }}
        <div class="carousel-item">
          <div class="item">
            <div class="logo"><img src="{{ .image }}" alt=""></div>
            <div class="case-study">{{ .text | safeHTML }}<div class="description">{{ .subtitle | safeHTML }}</div></div>
          </div>
        </div>
      {{ end }}
      </div>

      <a class="carousel-control-prev" href="#carousel-selected-indicator" role="button" data-slide="prev">
        <span class="carousel-control-prev-icon" aria-hidden="true"></span>
        <span class="sr-only">Previous</span>
      </a>
      <a class="carousel-control-next" href="#carousel-selected-indicator" role="button" data-slide="next">
        <span class="carousel-control-next-icon" aria-hidden="true"></span>
        <span class="sr-only">Next</span>
      </a>
    </div>
  </div>
</section>
