{{ header }}
<div class="container">
<div id="blog-category">
  <ul class="breadcrumb">
    {% for breadcrumb in breadcrumbs %}
    <li><a href="{{ breadcrumb.href }}">{{ breadcrumb.text }}</a></li>
    {% endfor %}
  </ul>
  <div class="row">{{ column_left }}
    {% if column_left and blog_right %}
    {% set class = 'col-sm-6' %}
    {% elseif column_left or blog_right %}
    {% set class = 'col-sm-8 col-md-9' %}
    {% else %}
    {% set class = 'col-sm-12' %}
    {% endif %}
    <div class="hero-color" style="background-color: #001127; width: 100%; height: 300px; margin-top: -60px; border-top: solid 1px white; position: relative;">
    </div>
    <div id="content" class="{{ class }}">{{ content_top }}
    <div class="blog-title">
          <h4>STAY UP TO DATE</h4>
          <h1>Νέα και άρθρα</h1>
    </div>
     <div class="row">
		{% for blogposts in blogss %}
		<div class="col-md-3 col-lg-3 col-sm-3 col-xs-12">
			<div class="blogpost-layout">
				<div class="blogpost-thumb">
					<div class="image listimg"><a href="{{ blogposts.href }}"><img src="{{ blogposts.thumb }}"  alt="{{ blogposts.title }}" title="{{ blogposts.title }}" class="img-responsive" /></a></div>
					<div class="caption">
            	        <div class="post-date"><p>{{ blogposts.date_added|date("d/m/Y") }}</p></div>
    					<div class="post-title"><h4><a href="{{ blogposts.href }}">{{ blogposts.title }}</a></h4></div>
    					<div class="post-more"><a href="{{ blogposts.href }}">Περισσότερα</a></div>
    				</div>
				</div>
			</div>
		</div>
		{% endfor %}
		</div>

	   <div class="row">
        <div class="col-sm-6 text-left">{{ pagination }}</div>
        <div class="col-sm-6 text-right">{{ results }}</div>
      </div>
    {{ content_bottom }}

	</div>
	{{ blog_right }}
	</div>
	</div>
</div>
{{ footer }}