<div class="container-fluid anchor" id="experiences">
  <h1 class="text-center">{{ .section.name }}</h1>

  <div class="container timeline text-justify">
    {{ $totalExperiences:= len .experiences }}
    {{ range $index,$experience:= .experiences }}
      {{ if eq (mod $index 2) 0 }}
        <div class="row align-items-center  d-flex">
          {{ partial "experiences/vertical-line.html" $index }}
          {{ partial "experiences/experience-info.html" $experience }}
        </div>
      {{else}}
        <div class="row align-items-center justify-content-end d-flex">
          {{ partial "experiences/experience-info.html" $experience }}
          {{ partial "experiences/vertical-line.html" $index }}
        </div>
      {{ end }}
      {{ if lt $index (sub $totalExperiences 1) }}
        {{ partial "experiences/horizontal-line.html" $index }}
      {{ end }}
    {{ end }}
  </div>
</div>
