{include file="includes/header.html"} 
{include file="includes/header-holder.html"}

<main class="main" id="main">
  {include file="includes/menu.html"}

  <!-- <div id="fullpagePrimary"> -->
    <section class="section page blog">
      <div class="wrapper">
        <div class="content">
    
          <div class="content-wrapper">
            {include file="includes/breadcrumbs.html"}

            <div class="banner">
              <h1 class="h1 title">blog</h1>

              <div id="blogPostListYears" class="years">
                {foreach $blogYears as $by}
                    <a href="javascript:void(0);" class="year year{$by.year} {if $by.selected == 1}active{/if}" {if isset($by.xajaxParams)}onclick="xajax_exe({foreach $by.xajaxParams as $by_xp}'{$by_xp}', {/foreach} 1);"{/if}>{$by.year}</a>
                {/foreach}
              </div>
            </div>          

            {if $blogPostsMarked|@count>0}
            {capture assign=blogPostMarkedLink}{seoLink id_element=$blogPostsMarked[0].id parentLink="{seoParentLink module=$blogPostsMarked[0].module id_element=$blogPostsMarked[0].id id_category=$blogPostsMarked[0].id_blog_category}"}{/capture}
            <div class="articles-top hidden-xs" id="articles-top">
                <div class="col col-1">
                  <article class="blog-article {if $blogPostsMarked[0].secondMainImageFilename}article-bg{/if}">
                    <div class="article-img">
                      {if $blogPostsMarked[0].mainImageFilename}
                        <div class="article-img-wrapper">
                          <img src="{image f=$blogPostsMarked[0].secondMainImageFilename m='cr' return='path'}" alt="{$blogPostsMarked[0].secondMainImageAlt}" class="img object-fit">
                        </div>
                      {/if}
                    </div>
                    <div class="article-text">
                      <a href='{seoLink id_element=$blogPostsMarked[0].id_blog_category withParents=1 parentLink="{seoParentLink module="BlogCategoryModule" id_element=$blogPostsMarked[0].id_blog_category}"}' class="category underline">{$blogPostsMarked[0].blog_category_name}</a>
                      <h2 class="h1 heading"><a href='{$blogPostMarkedLink}'>{$blogPostsMarked[0].name}</a></h2>
                      <div class="excerpt">{$blogPostsMarked[0].short_content}</div>
                    </div>
                    <a href='{$blogPostMarkedLink}' class="link btn btn--arrow"></a>
                  </article>
                </div>
                <div class="col col-2">
                  {if $blogPostsMarked|@count>1}
                    {foreach $blogPostsMarked as $bpm}
                        {if !$bpm@first}
                        {capture assign=blogPostMarkedLink}{seoLink id_element=$bpm.id parentLink="{seoParentLink module=$bpm.module id_element=$bpm.id id_category=$bpm.id_blog_category}"}{/capture}
                        <article class="blog-article {if $bpm.secondMainImageFilename}article-bg{/if}">
                          <div class="article-img">
                            {if $bpm.secondMainImageFilename}
                            <div class="article-img-wrapper">
                              <img src="{image f=$bpm.secondMainImageFilename m='cr' return='path'}" alt="{$bpm.secondMainImageAlt}" class="img object-fit">
                            </div>
                            {/if}
                          </div>
                          <div class="article-text">
                            <a href='{seoLink id_element=$bpm.id_blog_category withParents=1 parentLink="{seoParentLink module="BlogCategoryModule" id_element=$bpm.id_blog_category}"}' class="category underline">{$bpm.blog_category_name}</a>
                            <h2 class="h1 heading"><a href='{$blogPostMarkedLink}'>{$bpm.name}</a></h2>
                            <div class="excerpt">{$bpm.short_content}</div>
                          </div>
                          <a href='{$blogPostMarkedLink}' class="link btn btn--arrow"></a>
                        </article>
                        {/if}
                    {/foreach}
                  {/if}
                </div>
            </div>

            <div class="carousel articles-top articles-top-carousel visible-xs-block dots--dark" id="articles-top-carousel"></div>
            {/if}

            <div class="sidebar-xs visible-xs-block" id="sidebar-xs"></div>

            <div class="articles-bottom">
              <div id="blogPostListWrapper" class="articles-wrapper">
              {include file="includes/blog-item.html" blogPostsList=$blogPosts}
              </div>

              {include file="includes/blog-sidebar.html"}

            </div>
            <!-- /.articles-bottom -->

            {if isset($blogPosts_xajaxParams)}
            <div id="blogPostListPagination">
                {include file="includes/pagination_xajax.html" paginOptions=$blogPostsOptions xajaxParams=$blogPosts_xajaxParams}
            </div>
            {else}
                {include file="includes/pagination.html"}
            {/if}
          </div>  
        </div>
      </div>
    </section>
  <!-- </div> -->
  <!-- /#fullpage -->
</main>

{include file="includes/footer-holder.html"} 
{include file="includes/footer.html"}