<div ng:controller="HmmMainController" class="row-fluid" id="body-main" qn:fillheight>
    <script type="text/javascript">
        /* Mixitup Portfolio */
        jQuery(document).ready(function ($) {
            "use strict";
            $('#portfolio').mixitup({
                targetSelector: '.item',
                transitionSpeed: 450
            });
        });
    </script>
    <div class="flexslider">
        <div class="slides">
            <section class="flex-active">
                <div class="works" id="2">
                    <div class="page-head">
                        <div class="row">
                            <div class="col-md-5">
                                <h3>Portfolio</h3>
                            </div>
                            <div class="col-md-7">
                                <div class="np-main">
                                    <div class="np-controls">
                                        <a href="#/dashboard" class="previous"><i class="fa fa-arrow-circle-left"></i></a>
                                        <a href="#/resume/" class="next"><i class="fa fa-arrow-circle-right"></i></a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="portfolio-wrap">
                        <div class="row">
                            <ul id="filter-list" class="clearfix">
                                <li class="filter" ><a ng:click="reset()"><i class="icon-asterisk"></i><span data-ng-bind="$resource('articles.all')"></span></a><i class="fa fa-th"></i></li>
                                <li class="filter" ng:class="{active:query.category==category.Alias}" ng:repeat="category in categories.Labels | filter : searchCategories"><a ng:click="search({Category: category.Alias}, true)"><i class="icon-circle-arrow-right" style="color: {{category.Color}}"></i><span data-ng-bind="category.Name"></span></a></li>
                            </ul>
                            <ul id="portfolio">
                                <li ng:repeat="article in articles" class="item col-md-4 webdesign">
                                    <a title="{{article.Title}}" href="#/articles/{{article.ID}}" data-lightbox-gallery="gallery1" class="nivo-lbox">
                                        <div class="folio-img">
                                            <img ng:show="article.Thumb != null" ng:src="/qusion/image/thumb/{{article.Thumb}}?width=300" alt="" width="300" height="175" alt="{{article.Title}}" class="img-responsive" />
                                            <div class="overlay">
                                                <div class="overlay-inner">
                                                    <h4>{{article.Title}}</h4>
                                                </div>
                                            </div>
                                        </div>
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </section>
        </div>
    </div>
</div>

