{% block page %}
<section id="about{{ page.sub_group ? '_sub_' ~ page.sub_group }}" class="about container-fluid section padding-top-100 no-padding-bottom">
	<div class="container">
		{% block title %}
			<header class="title mobile-center">
				<h1>{{ page.name }}</h1>
				<h2 class="text-center">{{ page.name }}</h2>
				<h3 class="text-center">{{ page.desc }}</h3>
			</header>
		{% endblock %}
		
		{% block content %}
		<div class="row">
			{% for index in [1,2] %}
				{% set about = data.about[index] %}
				{% block contents %}
					<div class="col-sm-6 latest-post {{ index is odd ? 'odd' : 'even' }} matchHeight">
						<div class="row">
							<div class="col-sm-10 col-sm-push-1">
								<header>
									<h2>{{ about.title }}</h2>
								</header>
								<p>{{ about.desc | cleaner_tag | raw }}</p>
							</div>
						</div>
						<div class="background"{# style="background-image: url(http://placehold.it/750x535);" #}></div>
					</div>
				{% endblock contents %}
			{% endfor %}
		</div>
		{% endblock content %}
	</div>
</section>
{% endblock page %}

{% if site.recruit_active %}
	{# recruit #}
	{% block recruit %}
		<section id="recruit" class="testimonials container-fluid dark section padding-30-0">
			<h1>{{ site.recruit_title }}</h1>
			
			{% block recruit_header %}
				<header class="title mobile-center">
					<h1>{{ page.name }}</h1>
					<h2 class="text-center">
						<a href="/recruit.html?lightbox%5Bwidth%5D=320&amp;lightbox%5Bheight%5D=650" class="lightbox">
							{{ site.recruit_title }}
						</a>
					</h2>
					<h3 class="text-center">
						<a href="/recruit.html?lightbox%5Bwidth%5D=320&amp;lightbox%5Bheight%5D=650" class="lightbox">
							{{ site.recruit_desc }}
						</a>
					</h3>
				</header>
			{% endblock %}
			
		</section>
	{% endblock %}
{% endif %}