---
specific_css: /assets/css/blog-pages.css
layout: empty
---
<div class="container-fluid">

{% if page.featured_image %}
<div class="row" class="blog-featured-img" style="background-color: white;">
        <div class="img-blog" style="background: linear-gradient(
                     rgba(20,20,20, .5),
                     rgba(20,20,20, .5)),
                     url('/images/blog/{{page.featured_image}}') no-repeat center center fixed;
            background-size: cover;
            -webkit-background-size: cover;
            -moz-background-size: cover;
            -o-background-size: cover;">
            <div class="blog-full-page-image-info">
                <h1 class="blog-title text-center">{{page.title}}</h1>
                {% if page.author %}
                    {% assign author_object = site.data.authors.entries | where: "shortname", "page.author" %}
                    <img class="blog-author-image" src="
                    {% if author_object.avatar %}{{author_object.avatar}}{% else %}/assets/images/avatar-placeholder.png{% endif %}" /><br />
                    <small class="blog-author text-center">By <em>{% if author_object.name %}{{author_object.name}}{% else %}{{page.author}}{% endif %}</em></small><br />
                {% endif %}
                {% if page.date %}<small class="blog-date text-center"><em>{{page.date |  date: "%A, %B %-d, %Y"}}</em></small>{% endif %}
            </div>
        </div>
</div>
{% endif %}

</div>
<div class="container-fluid content-container">

<div class="row">
    <div class="container">
        <div class="row">
            <div class="col-md-9">
                <article class="post-content">
                    {{ content }}
                </article>
                <hr />
                {% if page.tags %}
                <h3>Tags</h3>
                      {% assign tags = page.tags %}
                      {% if page.tags %}
                          {% for tag in tags %}
                              <a class="btn btn-blog btn-xs post_tag" href="/blog/tag#{{tag | slugify }}">{{tag}}</a>
                          {% endfor %}
                      {% else %}
                         <p>
                             No tags found.
                         </p>
                      {% endif %}
                {% endif %}

                <section id="comments-section">
                    {% if page.comments %}
                        <h3>Comments</h3>
                        {% include _theme-includes/_third-party/disqus.html %}
                        <br />
                    {% endif %}
                </section>
            </div>
            <div class="col-md-3">

                <div class="panel panel-default" class="blog-panel">
                  <div class="panel-heading">
                    <h3 class="panel-title">Recent Posts</h3>
                    <i class="glyphicon glyphicon-calendar pull-right" style="margin-top:-15px;"></i>
                  </div>
                  <div class="panel-body">
                      {% for recent_post in site.posts limit: 3 %}
                          <div class="featured_blog_post">
                              <div class="row">
                                  <div class="col-md-9 col-sm-9 col-xs-9 no-padding">
                                     <a href="{{recent_post.url}}">{{recent_post.title | truncate: 40}}</a>
                                     <br /><small><em>{{recent_post.date | date: "%A, %B %-d, %Y" }}</em></small>
                                 </div>
                                 <div class="col-md-3 col-sm-3 col-xs-3 no-padding">
                                    <img src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="
                                    {% if recent_post.image %}
                                    data-src="/assets/images/{{recent_post.featured_image}}"
                                    {% else %}
                                    data-src="{% if site.data.company.placeholder %}{{site.data.company.placeholder}}{% else %}/assets/images/placeholder.png{% endif %}"
                                    {% endif %}
                                     alt="{{recent_post.title}}" class="img-responsive lazyload"/>
                                 </div>
                              </div>
                          </div>
                      {% endfor %}
                      <div class="panel-view-more text-right"><a href="/blog/">View Blogs</a></div>
                  </div>
                </div>


                <div class="panel panel-default">
                  <div class="panel-heading">
                    <h3 class="panel-title">Other Posts</h3>
                    <i class="glyphicon glyphicon-list-alt pull-right" style="margin-top:-15px;"></i>
                  </div>
                  <div class="panel-body">
                      {% assign posts = site.posts | sample:5 %}
                      {% for post in posts %}
                          <div class="featured_blog_post">
                              <div class="row">
                                  <div class="col-md-9 col-sm-9 col-xs-9  no-padding">
                                     <a href="{{post.url}}">{{post.title | truncate: 40}}</a>
                                     <br /><small><em>{{post.date | date: "%A, %B %-d, %Y" }}</em></small>
                                 </div>
                                 <div class="col-md-3 col-sm-3 col-xs-3 no-padding">
                                     <img src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="
                                     {% if post.featured_image %}
                                     data-src="/assets/images/blog/thumbnails/{{post.featured_image}}"
                                     {% else %}
                                     data-src="{% if site.data.company.placeholder %}{{site.data.company.placeholder}}{% else %}/assets/images/placeholder.png{% endif %}"
                                     {% endif %}
                                      alt="{{post.title}}" class="img-responsive lazyload"/>
                                 </div>
                              </div>
                          </div>
                      {% endfor %}
                      <div class="panel-view-more text-right"><a href="/blog/">View Blogs</a></div>
                  </div>
                </div>

                <div class="panel panel-default">
                      <div class="panel-heading">
                        <h3 class="panel-title">Follow Us</h3>
                        <i class="glyphicon glyphicon-thumbs-up pull-right" style="margin-top:-15px;"></i>
                      </div>
                      <div class="panel-body">
                          <a href="http://facebook.com/{{site.facebook_username}}" class="blog-icons"><i class="icon-facebook"></i></a>
                          <a href="https://github.com/{{site.github_username}}" class="blog-icons"><i class="icon-github-circled"></i></a>
                          <a href="https://plus.google.com/{{site.google_plus_username}}/posts" class="blog-icons"><i class="icon-gplus"></i></a>
                          <a href="https://www.linkedin.com/company/{{site.linkedin_username}}" class="blog-icons"><i class="icon-linkedin"></i></a>
                          <a href="https://twitter.com/{{site.twitter_username}}" class="blog-icons"><i class="icon-twitter"></i></a>
                          <a href="https://www.youtube.com/{{site.youtube_username}}" class="blog-icons"><i class="icon-youtube"></i></a>
                      </div>
                  </div>


            </div>

        </div>
    </div>
</div>


</div>