_layouts/about.html

---
layout: post
---

<section>
    <div class="container">
        <div class="row" style="margin-top: 15px;">
            <div class="col-md-12 col-sm-12">
                <div style="text-align: justify">
                    {{content}}
                </div>
            </div>
        </div>
    </div>
</section>


<section>
    <div class="container">
        <div class="row">
            <div class="col-md-6 col-sm-12 text-center ">
                <img src="{{ page.img-architecture.path | absolute_url }}" style="width: 100%;"/>
                <br>
                <em>{{page.img-architecture.title}}</em>
            </div>
            <div class="col-md-6 col-sm-12 text-center ">
                <img src="{{ page.img-plan.path | absolute_url }}" style="width: 100%;"/>
                <br>
                <em>{{page.img-plan.title}}</em>
            </div>
        </div>
    </div>
</section>

<div class="subtitle-post row d-flex align-items-center mt-5 shadow" >
    <div class="col" style="text-align: center">
        <h1 style="color: white; font-size: 4em">Features</h1>
    </div>
</div>

<section id="feature_about">
    {% assign vec_order = "order-2, order-1" | split: ", " %}
    {% assign row = 1 %}
    {% for item in site.data.features %}
        <div class="row" style="padding: 1em;margin-bottom: 0.3em">
            <div class="container">
                <div class="row d-flex flex-nowrap">
                    <div class="col-sm-12 col-md-3 col-md-push-9 text-center align-self-center p-2 {{vec_order[0]}}">
                        <div class="service-item">
                            <i class="{{item.icon}} fa-5x"></i>
                            <h4>{{item.title}}</h4>
                            <strong>
                                {{item.description-short}}
                            </strong>
                        </div>
                    </div>
                    <div class="col-sm-12 col-md-9 col-md-pull-3 align-self-center p-2 {{vec_order[1]}}">
                        <p class="text-justify">
                            {{item.description}}
                        </p>
                    </div>
                </div>

            </div>

        </div>
        {% assign row = row | plus: 1 %}
        {% if row == 2 %}
            {% assign row = 1 %}
            {% assign vec_order = vec_order | reverse  %}
        {% else %}
            {% assign vec_order = vec_order | reverse %}
        {% endif %}
    {% endfor %}
</section>