{{ define "main" }}

{{ partial "page-title.html" . }}

{{ with .Params.about }}
{{ if .enable }}
<section class="about section">
  <div class="container">
    <div class="row">
      <div class="col-md-6">
        <div class="about-img">
          <img class="img-responsive" src="{{ .image | relURL }}">
        </div>
      </div>
      <div class="col-md-6">
        {{ with .title }}<h2 class="mt-40">{{ . | markdownify }}</h2>{{ end }}
        {{ with .content }}{{ . | $.Page.RenderString (dict "display" "block") }}{{ end }}
        {{ with .button }}
        {{ if .enable }}
        <a href="{{ .link | relURL }}" class="btn btn-small mt-20">{{ .label }}</a>
        {{ end }}
        {{ end }}
      </div>
    </div>
    <div class="row counter-box text-center mt-50">
      {{ range .funfacts }}
      <div class="col-md-2">
        <div class="counter-item">
          {{ with .icon }}<i class="{{ . }}"></i>{{ end }}
          {{ with .count }}<h4 class="count" data-count="{{ . }}">0</h4>{{ end }}
          {{ with .name }}<span>{{ . }}</span>{{ end }}
        </div>
      </div>
      {{ end }}
    </div>
  </div>
</section>
{{ end }}
{{ end }}

{{ with .Params.features }}
{{ if .enable }}
<section class="about-feature bg-dark section dark-service">
  <div class="container">
    {{ with .title }}
    <div class="row">
      <div class="col-md-12">
        <div class="title">
          <h2>{{ . | markdownify }}</h2>
        </div>
      </div>
    </div>
    {{ end }}
    <div class="row">
      {{ range .feature_item }}
      <div class="col-md-4">
        <div class="service-item">
          {{ with .icon }}<i class="{{ . }}"></i>{{ end }}
          {{ with .name }}<h4>{{ . | markdownify }}</h4>{{ end }}
          {{ with .content }}{{ . | $.Page.RenderString (dict "display" "block") }}{{ end }}
        </div>
      </div>
      {{ end }}
    </div>
  </div>
</section>
{{ end }}
{{ end }}

<section class="testimonial section-sm">
  <div class="container">
    <div class="row">
      {{ if .Params.testimonial.enable }}
      {{ with .GetPage "/" }}
      <div class="col-md-6">
        <div class="testimonial-carousel text-center">
          <div class="testimonial-slider owl-carousel">
            {{ range .Params.funfacts.testimonial_slider }}
            <div>
              <i class="fas fa-quote-left"></i>
              {{ with .content }}<p>"{{ . | markdownify }}"</p>{{ end }}
              <div class="user">
                {{ with .image }}<img src="{{ . | relURL }}" alt="client">{{ end }}
                <p><span>{{ .name | markdownify }}</span> {{ .designation | markdownify }}</p>
              </div>
            </div>
            {{ end }}
          </div>
        </div>
      </div>
      {{ end }}
      {{ end }}

      {{ with .Params.mission_vision }}
      {{ if .enable }}
      <div class="col-md-6">
        <div class="tabCommon">
          <ul class="nav nav-tabs">
            {{ range $index, $elements := .tabs }}
            <li {{ if eq $index 0 }} class="active" {{ end }}><a href="#{{ .name | urlize }}"
                data-toggle="tab">{{ .name }}</a></li>
            {{ end }}
          </ul>
          <div class="tab-content">
            {{ range $index, $elements := .tabs }}
            <div id="{{ .name | urlize }}" class="tab-pane fade {{ if eq $index 0 }} active in {{ end }}">
              {{ .content | $.Page.RenderString (dict "display" "block") }}
            </div>
            {{ end }}
          </div>
        </div>
      </div>
      {{ end }}
      {{ end }}
    </div>
  </div>
</section>

<!-- Call to action -->
{{ if .Params.cta.enable }}
{{ partial "cta.html" . }}
{{ end }}
<!-- /Call to action -->

{{ end }}