{% extends 'base.html.twig' %}

{% block title %}The Insiders - Campaignpage Testimonials{% endblock %}

{% block wrapperClass %}campaignpage testimonials{% endblock %}

{% block body %}
<<div class="col-md-12 col-xs-12 p0">

    <div class="col-md-9 col-xs-12 pl0">

        <div class="content col-md-12 col-xs-12 clearfix p0 list-group gallery">
            <h1 class="col-md-12">Testimonials</h1>
            <div class="all-filter col-md-12 p0 clearfix">

                <div class="col-md-4 col-xs-12 filter mb15">
                    <div class="row">
                        <div class="col-sm-3 labelreview mb5">
                            <span>Product</span>
                        </div>
                        <div class="col-md-12 option">
                            <select class="form-control" id="slc_products">
                                <option value="">Selecteer</option>
                                <option value="13636">new product</option>
                                <option value="13538">Test</option>
                            </select>
                        </div>
                    </div>
                </div>

                <div class="col-md-4 col-xs-12 mb15 filter">
                    <div class="row">
                        <div class="col-md-12 labelreview mb5">
                            <span>Sorteer volgens</span>
                        </div>
                        <div class="col-md-12">
                            <select class="form-control" id="slc_sort">
                                <option value="tijd">Datum</option>
                                <option value="useful_yes">Handige review</option>
                                <option value="rating_up">Goede beoordeling</option>
                                <option value="rating_down">Lagere beoordeling</option>
                            </select>
                        </div>
                    </div>
                    <div class="hidden">
                        <input id="slc_campaign" value="292" type="hidden">
                    </div>
                </div>

                <div class="col-md-4 col-xs-12 mb15 filter clearfix">
                    <div class="row">
                        <div class="col-md-12 labelreview mb5">
                            <span>Goedkeuring</span>
                        </div>
                        <div class="col-md-12 option">
                            <div class="stars">
                                <img src="images/reviews/cancel-off.png" alt="x" title="cancel this rating!" class="raty-cancel">&nbsp;
                                <img src="images/reviews/star-off.png" alt="1" title="1">&nbsp;
                                <img src="images/reviews/star-off.png" alt="2" title="2">&nbsp;
                                <img src="images/reviews/star-off.png" alt="3" title="3">&nbsp;
                                <img src="images/reviews/star-off.png" alt="4" title="4">&nbsp;
                                <img src="images/reviews/star-off.png" alt="5" title="5">
                                <input name="score" type="hidden">
                            </div>
                            <input id="score" name="slc_opinion_score" type="hidden">
                        </div>
                    </div>
                </div>

                <!--<a id="btnfilter" class="btn btn-default" href="#" style="margin-top:1.1em">Filter</a>-->

            </div>




            <div class="testimonial m10 clearfix row odd">
                <div class="col-sm-9 col-md-12 col">
                    <div class="user p10">
                        <span class="avatar"> <img src="images/avatar/3.jpg"> </span>
                        <p class="username">
                            Harry Baardmans - Auteur
                        </p>
                        <p class="userinfo">
                            16/06/2015 - 14:00
                        </p>
                    </div>
                    <div class="review_stars pt10 pb15 col-md-12" data-score="5" title="5">
                        <img src="images/reviews/star-on.png" alt="1" title="5">&nbsp;
                        <img src="images/reviews/star-on.png" alt="2" title="5">&nbsp;
                        <img src="images/reviews/star-on.png" alt="3" title="5">&nbsp;
                        <img src="images/reviews/star-on.png" alt="4" title="5">&nbsp;
                        <img src="images/reviews/star-off.png" alt="5" title="5">
                        <input name="score" value="5" readonly="readonly" type="hidden">
                    </div>
                    <p class="col-md-12">
                        <i class="fa fa-quote-left"></i>
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec fringilla luctus eros at molestie. sagittis neque in turpis gravida bibendum. Integer nec velit ante. Quisque tristique, mi in mattis fringilla, eros erat consequat nibh, vitae elementum quam lectus ut eros. Praesent nulla tortor, tincidunt a sodales quis, aliquam quis quam. Nulla
                        <i class="fa fa-quote-left"></i>
                    </p>
                </div>
            </div>
            <div class="testimonial m10 clearfix row even">
                <div class="col-sm-9 col-md-12 col">
                    <div class="user p10">
                        <span class="avatar"> <img src="images/avatar/3.jpg"> </span>
                        <p class="username">
                            Harry Baardmans - Auteur
                        </p>
                        <p class="userinfo">
                            16/06/2015 - 14:00
                        </p>
                    </div>
                    <div class="review_stars pt10 pb15 col-md-12" data-score="5" title="5">
                        <img src="images/reviews/star-on.png" alt="1" title="5">&nbsp;
                        <img src="images/reviews/star-on.png" alt="2" title="5">&nbsp;
                        <img src="images/reviews/star-on.png" alt="3" title="5">&nbsp;
                        <img src="images/reviews/star-on.png" alt="4" title="5">&nbsp;
                        <img src="images/reviews/star-off.png" alt="5" title="5">
                        <input name="score" value="5" readonly="readonly" type="hidden">
                    </div>
                    <p class="col-md-12">
                        <i class="fa fa-quote-left"></i>
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec fringilla luctus eros at molestie. sagittis neque in turpis gravida bibendum. Integer nec velit ante. Quisque tristique, mi in mattis fringilla, eros erat consequat nibh, vitae elementum quam lectus ut eros. Praesent nulla tortor, tincidunt a sodales quis, aliquam quis quam. Nulla
                        <i class="fa fa-quote-left"></i>
                    </p>
                </div>
            </div>
            <div class="testimonial m10 clearfix row odd">
                <div class="col-sm-9 col-md-12 col">
                    <div class="user p10">
                        <span class="avatar"> <img src="images/avatar/3.jpg"> </span>
                        <p class="username">
                            Harry Baardmans - Auteur
                        </p>
                        <p class="userinfo">
                            16/06/2015 - 14:00
                        </p>
                    </div>
                    <div class="review_stars pt10 pb15 col-md-12" data-score="5" title="5">
                        <img src="images/reviews/star-on.png" alt="1" title="5">&nbsp;
                        <img src="images/reviews/star-on.png" alt="2" title="5">&nbsp;
                        <img src="images/reviews/star-on.png" alt="3" title="5">&nbsp;
                        <img src="images/reviews/star-on.png" alt="4" title="5">&nbsp;
                        <img src="images/reviews/star-off.png" alt="5" title="5">
                        <input name="score" value="5" readonly="readonly" type="hidden">
                    </div>
                    <p class="col-md-12">
                        <i class="fa fa-quote-left"></i>
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec fringilla luctus eros at molestie. sagittis neque in turpis gravida bibendum. Integer nec velit ante. Quisque tristique, mi in mattis fringilla, eros erat consequat nibh, vitae elementum quam lectus ut eros. Praesent nulla tortor, tincidunt a sodales quis, aliquam quis quam. Nulla
                        <i class="fa fa-quote-left"></i>
                    </p>
                </div>
            </div>
            <div class="testimonial m10 clearfix row even">
                <div class="col-sm-9 col-md-12 col">
                    <div class="user p10">
                        <span class="avatar"> <img src="images/avatar/3.jpg"> </span>
                        <p class="username">
                            Harry Baardmans - Auteur
                        </p>
                        <p class="userinfo">
                            16/06/2015 - 14:00
                        </p>
                    </div>
                    <div class="review_stars pt10 pb15 col-md-12" data-score="5" title="5">
                        <img src="images/reviews/star-on.png" alt="1" title="5">&nbsp;
                        <img src="images/reviews/star-on.png" alt="2" title="5">&nbsp;
                        <img src="images/reviews/star-on.png" alt="3" title="5">&nbsp;
                        <img src="images/reviews/star-on.png" alt="4" title="5">&nbsp;
                        <img src="images/reviews/star-off.png" alt="5" title="5">
                        <input name="score" value="5" readonly="readonly" type="hidden">
                    </div>
                    <p class="col-md-12">
                        <i class="fa fa-quote-left"></i>
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec fringilla luctus eros at molestie. sagittis neque in turpis gravida bibendum. Integer nec velit ante. Quisque tristique, mi in mattis fringilla, eros erat consequat nibh, vitae elementum quam lectus ut eros. Praesent nulla tortor, tincidunt a sodales quis, aliquam quis quam. Nulla
                        <i class="fa fa-quote-left"></i>
                    </p>
                </div>
            </div>

        </div>
    </div>

    <div class="col-md-3 pr0">

        <div class="content col-md-12 clearfix p0 sidebar hidden-xs">
            <h2 class="col-md-12">Campaign status</h2>
            <nav class="col-md-12 campaignstatus">
                <ul class="nav nav-justified">
                    <li class="active p0">
                        <span class="new active">
                            <i class="fa fa-calendar"></i>
                        </span>
                    </li>
                    <li class="p0">
                        <span class="new p0">
                            <i class="fa fa-user"></i>
                        </span>
                    </li>
                    <li class="p0">
                        <span class="ongoing p0">
                            <i class="fa fa-gift"></i>
                        </span>
                    </li>
                    <li class="p0">
                        <span class="ongoing p0">
                            <i class="fa fa-pencil-square-o"></i>
                        </span>
                    </li>
                    <li class="p0">
                        <span class="previous p0">
                            <i class="fa fa-calendar"></i>
                        </span>
                    </li>
                </ul>
            </nav>
            <div class="col-md-12 mt15 status-info">
                <h3>Campaign<br>announcement</h3>
                <p class="m0">18 December 2016</p>
                <p>(17 days left)</p>
                <img class="mt15 mb15" src="images/campaign/jan-logo.png" alt="logo">
            </div>
            <button type="submit" class="btn btn-primary blue col-md-12 col-xs-12">
                <i class="fa fa-angle-right"></i>
                Subscribe now
            </button>
        </div>

        <div class="content col-md-12 clearfix p0 sidebar hidden-xs">
            <h2 class="col-md-12">Share with friends</h2>
            <ul class="social clearfix mb15">
                <li><a class="clearfix" href="#"><i class="fa fa-facebook"></i></a></li>
                <li><a class="clearfix" href="#"><i class="fa fa-twitter"></i></a></li>
                <li><a class="clearfix" href="#"><i class="fa fa-pinterest"></i></a></li>
                <li><a class="clearfix" href="#"><i class="fa fa-google"></i> </a></li>
            </ul>
        </div>

    </div>
</div>
</div>
{% endblock %}