{{ if .Site.Data.about.enable}}
{{"<!-- Start About Section -->" | safeHTML}}
<section class="bg-one about section" id="requirements">
    <div class="container">
        <div class="row">
            <div class="col-lg-12">
                {{"<!-- section title -->" | safeHTML}}
                <div class="title text-center wow fadeIn" data-wow-duration="1500ms">
                    <h2>{{ .Site.Data.about.requirementsTitle }}</h2>
                    <div class="border-meghna"></div>
                </div>
                {{"<!-- /section title -->" | safeHTML}}
            </div>

            <div class="mx-auto wow fadeInUp" data-wow-duration="500ms">
                <div class="block">
                  {{ range .Site.Data.about.requirementSections }}
                  <p class="req-section-title">{{ .title }}</p>
                  <ul>
                    {{ range .bullets }}
                    <li>{{ .bullet }}</li>
                    {{ end }}
                  </ul>
                  {{ end }}
                </div>
            </div>
        </div>

        <div class="row">
            <div class="col-lg-12">
                {{"<!-- section title -->" | safeHTML}}
                <div class="title text-center wow fadeIn" data-wow-duration="1500ms">
                    <h2>{{ .Site.Data.about.benefitsTitle }}</h2>
                    <div class="border-meghna"></div>
                </div>
                {{"<!-- /section title -->" | safeHTML}}
            </div>

            <div class="mx-auto wow fadeInUp" data-wow-duration="500ms">
                <div class="block">
                  <ul>
                    {{ range .Site.Data.about.benefitsBullets }}
                      <li>{{ .bullet }}</li>
                    {{ end }}
                  </ul>
                </div>
            </div>
        </div>

        <div class="row">
          <a class="mx-auto btn btn-transparent"
            href="/apply" target="_blank">Apply Now</a>
        </div>

        <div class="row">
          <img id="clan-logo" class="img-fluid mx-auto wow fadeInUp"
          src="{{ .Site.Data.about.logo }}" alt="clan-logo"/>
        </div>

    </div>
</section>
{{"<!-- /about -->" | safeHTML}}
{{ end }}

{{ if .Site.Data.about2.enable }}
{{"<!-- about 2 -->" | safeHTML}}
<section class="section section-bg about-2 padding-0" id="about">
    <div class="container-fluid">
        <div class="row">
            <div class="col-lg-6 padding-0 ">
                <img class="img-fluid" src="{{ .Site.Data.about2.image | absURL}}" alt="image">
            </div>
            <div class="col-lg-6">
                <div class="content-block">
                    {{with .Site.Data.about2.title}} <h2>{{ . }}</h2> {{ end }}
                    {{with .Site.Data.about2.description}} <p>{{ . }}</p> {{ end }}
                    {{with .Site.Data.about2.description2}} <p>{{ . }}</p> {{ end }}
                    <div class="row">
                        {{ range .Site.Data.about2.aboutItem }}
                        <div class="col-lg-6">
                            <div class="media">
                                <div class="align-self-start mr-3">
                                    {{with .icon}} <i class="{{ . }}"></i> {{ end }}
                                </div>
                                <div class="media-body">
                                    {{with .title}} <h4 class="media-heading">{{ . }}</h4>{{ end }}
                                    {{ with .content}} <p>{{ . }}</p> {{ end }}
                                </div>
                            </div>
                        </div>
                        {{ end }}
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
{{"<!-- /about 2 -->" | safeHTML}}
{{ end }}