<?php get_header()?>
    <div id="layout">
        <div class="body_container">
            <div class="pure-g">
                <div class="post-cols">
                    <div id="list_container">
                        <?php
                        $i=1;
                        if( have_posts() ) : while( have_posts() ) : the_post();
                        ?>
                        <article class="post-box pure-u-1 pure-u-sm-1-2 <?php if($i==1){echo "pure-u-md-2-3";}else{ echo "pure-u-md-1-3" ;}?>">
                            <div class="post">
                                <a href="<?php the_permalink()?>" rel="nofollow" class="post-cover-box post-cover-box-wide">
                                    <div style="background-image:url(<?php the4_thumb()?>)" class="post-cover"></div>
                                </a>
                                <div class="post-text">
                                    <h2 class="post-title">
                                        <a href="<?php the_permalink()?>"><?php the_title()?></a>
                                    </h2>
                                    <div class="post-content">
                                        <div class="p_part">
                                            <p><?php echo the4_strimwidth(get_the_content(),40);?></p>
                                        </div>
                                    </div>
                                    <div class="post-meta"><?php  the_time('F d ,Y')?></div>
                                </div>
                            </div>
                        </article>
                        <?php $i++;endwhile;endif;?>
                    </div>
                </div>

                <div class="pure-u-1-1">
                    <div class="paginator pager pagination">
                        <?php the4_pagenavi()?>
                    </div>
                </div>
            </div>
        </div>
    </div>
<?php get_footer()?>
