diff --git a/dashboard/static/css/style.css b/dashboard/static/css/style.css
index 445fdad40..25d1b2a3e 100644
--- a/dashboard/static/css/style.css
+++ b/dashboard/static/css/style.css
@@ -341,16 +341,16 @@ a[href^="https://launchpad"]:after {
 }
 
 .kpi_title_block {
-    margin-left: 50px;
+    margin-left: 40px;
 }
 
 .kpi_title {
-    font-size: 16pt;
+    font-size: 13pt;
     font-weight: bold;
 }
 
 .kpi_marker {
-    font-size: 19pt;
+    font-size: 16pt;
     font-weight: bold;
     text-align: center; vertical-align: middle;
     color: lightgray;
diff --git a/dashboard/templates/kpi/base_kpi.html b/dashboard/templates/kpi/base_kpi.html
index 186caef60..97b234b92 100644
--- a/dashboard/templates/kpi/base_kpi.html
+++ b/dashboard/templates/kpi/base_kpi.html
@@ -37,6 +37,87 @@
     <script type="text/javascript" src="{{ url_for('static', filename='js/jquery.tmpl.js') }}"></script>
     <script type="text/javascript" src="{{ url_for('static', filename='js/stackalytics-ui.js') }}"></script>
 
+    <script type="text/javascript">
+
+        function process_stats(container_id, url, query_options, item_id, goal, comparator) {
+            $.ajax({
+                url: make_uri(url, query_options),
+                dataType: "jsonp",
+                success: function (data) {
+                    data = data["stats"];
+                    var index = -1;
+                    var sum = 0;
+
+                    for (var i = 0; i < data.length; i++) {
+                        sum += data[i].metric;
+                        if (data[i].id == item_id) {
+                            index = i;
+                        }
+                    }
+
+                    var result = {
+                        mark: false,
+                        goal: goal
+                    };
+
+                    if (index < 0) {
+                        result.info = "Item " + item_id + " is not found in the stats";
+                    }
+                    else {
+                        var comparison_result = comparator(data[index], sum);
+                        result.mark = comparison_result.mark;
+                        result.info = comparison_result.info;
+                    }
+                    $("#kpi_block_template").tmpl(result).appendTo("#" + container_id);
+                }
+            });
+        }
+
+        function goal_position_in_top(container_id, query_options, item_type, item_id, position, goal) {
+            $(document).ready(function () {
+                process_stats(container_id, "/api/1.0/stats/" + item_type, query_options, item_id, goal,
+                        function(item, sum) {
+                            var mark = item.index <= position;
+                            return {
+                                mark: mark,
+                                info: mark? "Achieved position is " + position:
+                                            "Position " + item.index + " is worse than target position " + position,
+                                value: item.index
+                            }
+                        });
+            });
+        }
+
+        function goal_percentage_in_top_less_than(container_id, query_options, item_type, item_id, goal_percentage, goal) {
+            $(document).ready(function () {
+                process_stats(container_id, "/api/1.0/stats/" + item_type, query_options, item_id, goal,
+                        function(item, sum) {
+                            var percentage = item.metric / sum;
+                            var mark = percentage < goal_percentage;
+                            var percentage_formatted = Math.round(percentage * 100) + "%";
+                            var goal_percentage_formatted = Math.round(goal_percentage * 100) + "%";
+                            return {
+                                mark: mark,
+                                info: mark? "Achieved percentage " + goal_percentage_formatted:
+                                            "Value " + percentage_formatted + " is more than the goal " + goal_percentage_formatted,
+                                value: percentage_formatted
+                            }
+                        });
+            });
+        }
+
+    </script>
+
+    <script id="kpi_block_template" type="text/x-jquery-tmpl">
+    <div class="kpi_block">
+        <div class="kpi_marker ${(mark ? "kpi_good" : "kpi_bad")} ">${(mark ? "&#x2714;" : "&#x2716;")}</div>
+        <div class="kpi_title_block">
+            <div class="kpi_title">Goal: ${goal}</div>
+            <div class="kpi_info">Result: ${info}</div>
+        </div>
+    </div>
+    </script>
+
     {% block scripts %}{% endblock %}
 {% endblock %}
 
diff --git a/dashboard/templates/kpi/kpi.html b/dashboard/templates/kpi/kpi.html
index ec8294d42..9a91e40a4 100644
--- a/dashboard/templates/kpi/kpi.html
+++ b/dashboard/templates/kpi/kpi.html
@@ -1,111 +1,35 @@
 {% extends "kpi/base_kpi.html" %}
 
 {% block title %}
-    Group KPI
+    Example of KPI report
 {% endblock %}
 
 {% block scripts %}
-    <script type="text/javascript">
-
-        function process_stats(url, query_options, item_id, goal, comparator) {
-            $.ajax({
-                url: make_uri(url, query_options),
-                dataType: "jsonp",
-                success: function (data) {
-                    data = data["stats"];
-                    var index = -1;
-                    var sum = 0;
-
-                    for (var i = 0; i < data.length; i++) {
-                        sum += data[i].metric;
-                        if (data[i].id == item_id) {
-                            index = i;
-                        }
-                    }
-
-                    var result = {
-                        mark: false,
-                        goal: goal
-                    };
-
-                    if (index < 0) {
-                        result.info = "Item " + item_id + " is not found in the stats";
-                    }
-                    else {
-                        var comparison_result = comparator(data[index], sum);
-                        result.mark = comparison_result.mark;
-                        result.info = comparison_result.info;
-                    }
-                    $("#kpi_block_template").tmpl(result).appendTo("#kpi_container");
-                }
-            });
-        }
-
-        function goal_position_in_top(query_options, item_type, item_id, position, goal) {
-            $(document).ready(function () {
-                process_stats("/api/1.0/stats/" + item_type, query_options, item_id, goal,
-                        function(item, sum) {
-                            var mark = item.index <= position;
-                            return {
-                                mark: mark,
-                                info: mark? "Achieved position is " + position:
-                                            "Position " + item.index + " is worse than target position " + position,
-                                value: item.index
-                            }
-                        });
-            });
-        }
-
-        function goal_percentage_in_top_less_than(query_options, item_type, item_id, goal_percentage, goal) {
-            $(document).ready(function () {
-                process_stats("/api/1.0/stats/" + item_type, query_options, item_id, goal,
-                        function(item, sum) {
-                            var percentage = item.metric / sum;
-                            var mark = percentage < goal_percentage;
-                            var percentage_formatted = Math.round(percentage * 100) + "%";
-                            var goal_percentage_formatted = Math.round(goal_percentage * 100) + "%";
-                            return {
-                                mark: mark,
-                                info: mark? "Achieved percentage " + goal_percentage_formatted:
-                                            "Value " + percentage_formatted + " is more than the goal " + goal_percentage_formatted,
-                                value: percentage_formatted
-                            }
-                        });
-            });
-        }
-
-    </script>
-
-    <script id="kpi_block_template" type="text/x-jquery-tmpl">
-    <div class="kpi_block">
-        <div class="kpi_marker ${(mark ? "kpi_good" : "kpi_bad")} ">${(mark ? "&#x2714;" : "&#x2716;")}</div>
-        <div class="kpi_title_block">
-            <div class="kpi_title">Goal: ${goal}</div>
-            <div class="kpi_info">Result: ${info}</div>
-        </div>
-    </div>
-    </script>
-
-{% endblock %}
-
-
-{% block content %}
-    <h1>Metrics</h1>
-
-    <div id="kpi_container"></div>
-
     <script type="text/javascript">
         $(document).ready(function () {
 
-             goal_position_in_top({release: "icehouse", metric: "commits", project_type: "openstack"}, "companies", "Mirantis", 5, "Be in top 5 by commits");
-             goal_position_in_top({release: "icehouse", metric: "marks", project_type: "openstack"}, "engineers", "boris-42", 5, "Be in top 5 by reviews");
-             goal_position_in_top({release: "icehouse", metric: "marks", project_type: "openstack", module: "glance", exclude: "core"},
+             goal_position_in_top("kpi_container_position", {release: "icehouse", metric: "commits", project_type: "openstack"},
+                     "companies", "Mirantis", 5, "Be in top 5 by commits");
+             goal_position_in_top("kpi_container_position", {release: "icehouse", metric: "marks", project_type: "openstack"},
+                     "engineers", "boris-42", 5, "Be in top 5 by reviews");
+             goal_position_in_top("kpi_container_position", {release: "icehouse", metric: "marks", project_type: "openstack", module: "glance", exclude: "core"},
                      "engineers", "boris-42", 3, "Be in top 3 among non-core reviewers");
 
-             goal_percentage_in_top_less_than({release: "all", metric: "commits", project_type: "stackforge", module: "stackalytics"},
+             goal_percentage_in_top_less_than("kpi_container_percentage",
+                     {release: "all", metric: "commits", project_type: "stackforge", module: "stackalytics"},
                      "companies", "Mirantis", 0.8, "Mirantis contribution is less than 80%");
 
         });
     </script>
-
+{% endblock %}
+
+
+{% block content %}
+    <h1>Example of KPI report</h1>
+
+    <h2>Position in top</h2>
+    <div id="kpi_container_position"></div>
+
+    <h2>Percentage in top</h2>
+    <div id="kpi_container_percentage"></div>
 {% endblock %}