---
layout: layout
---
{% include header.html %}

<section class="post container">
	<h1>
		<a href="{{ page.url }}">{{ page.title }}</a>
	</h1>

	<section class="byline">
		{{ page.date | date: "%B %e, %Y" }}
	</section>

  <section class="content{% if page.justify %} justify{% endif %}">
    {{ content }}
  </section>

  <br/>

  <div class="fb-like" data-href="{{ site.url }}{{ page.url }}" data-layout="standard" data-action="like" data-size="small" data-show-faces="true" data-share="true"></div>

  <br/>

  <div class="fb-comments" data-href="{{ site.url }}{{ page.url }}" data-width="100%" data-numposts="5"></div>

</section>

<div id="related-articles-container" class="container-fluid">
  <section id="related-articles" class="row">

  {% for post in site.related_posts limit: 4 %}
    <div class="article col-sm-3">
      <a href="{{ post.url }}">
        <div class="center-fill-container img-container">
          <img src="/images/posts/{{post.image}}" alt=""  class="img-center-fill center-both {% if post.image == null %}hidden{% endif %}">
        </div>
        <div class="details text-center ">
          <h3 class="title">{{ post.title | truncatewords: 4}}</h3>
          <p class="tag">{{ post.tag }}</p>
        </div>
      </a>
    </div>
  {% endfor %}
  </section>
</div>