<script type="text/template" data-mvc-template="slider-template">
        <div class="text-center bottom-padding-5px">
            <label class="pull-left bottom-margin-5px"><%- title%></label>
            <span class="">
                <span class="js-min"></span> - <span class="js-max"></span>
            </span>
        </div>

        <div class="js-slider custom-slider">
            <div>
                <div class="filter-legend" style="left: 0%;"></div>
                <div class="filter-legend-inner" style="left: 10%;"></div>
                <div class="filter-legend-inner" style="left: 20%;"></div>
                <div class="filter-legend-inner" style="left: 30%;"></div>
                <div class="filter-legend-inner" style="left: 40%;"></div>
                <div class="filter-legend" style="left: 50%;"></div>
                <div class="filter-legend-inner" style="left: 60%;"></div>
                <div class="filter-legend-inner" style="left: 70%;"></div>
                <div class="filter-legend-inner" style="left: 80%;"></div>
                <div class="filter-legend-inner" style="left: 90%;"></div>
                <div class="filter-legend" style="left: 100%;"></div>
            </div>
        </div>

    </script>