diff --git a/CHANGELOG.md b/CHANGELOG.md
index 7a7d24c3a0..8f0bcf5952 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -324,7 +324,7 @@ This project adheres to [Semantic Versioning](http://semver.org/).
 - Fixed a bug where a migration would check an empty table name.
 - Fixed various bugs in the import routine.
 - Fixed various bugs in the piggy banks pages.
-- Fixed a bug in the ``firefly:verify`` routine
+- Fixed a bug in the `firefly:verify` routine
 
 ## [3.10] - 2015-05-25
 ### Added
@@ -353,11 +353,11 @@ This project adheres to [Semantic Versioning](http://semver.org/).
 - Bulk update problems, #280, thanks @stickgrinder
 - Fixed various problems with amount reporting of split transactions.
 
-[3.9.1]
+## [3.9.1]
 ### Fixed
 - Fixed a bug where removing money from a piggy bank would not work. See issue #265 and #269
 
-[3.9.0]
+## [3.9.0]
 ### Added
 - @zjean has added code that allows you to force "https://"-URL's.
 - @tonicospinelli has added Portuguese (Brazil) translations.
diff --git a/public/js/ff/charts.js b/public/js/ff/charts.js
index 0e9ff49d21..d402ab67f8 100644
--- a/public/js/ff/charts.js
+++ b/public/js/ff/charts.js
@@ -244,8 +244,7 @@ function drawAChart(URI, container, chartType, options, colorData) {
 
 
     $.getJSON(URI).done(function (data) {
-
-
+        $('#' + container).removeClass('general-chart-error');
         if (data.labels.length === 0) {
             // remove the chart container + parent
             var holder = $('#' + container).parent().parent();
diff --git a/public/js/ff/reports/default/all.js b/public/js/ff/reports/default/all.js
index 06e374dcee..1f838a0ebc 100644
--- a/public/js/ff/reports/default/all.js
+++ b/public/js/ff/reports/default/all.js
@@ -74,7 +74,8 @@ function loadAjaxPartial(holder, uri) {
 function displayAjaxPartial(data, holder) {
     "use strict";
     var obj = $('#' + holder);
-    obj.removeClass('loading').html(data);
+    obj.html(data);
+    obj.parent().find('.overlay').remove();
 
     // call some often needed recalculations and what-not:
 
@@ -98,7 +99,9 @@ function displayAjaxPartial(data, holder) {
 
 function failAjaxPartial(uri, holder) {
     "use strict";
-    $('#' + holder).removeClass('loading').addClass('general-chart-error');
+    var holder = $('#' + holder);
+    holder.parent().find('.overlay').remove();
+    holder.addClass('general-chart-error');
 
 }
 
diff --git a/public/js/ff/reports/index.js b/public/js/ff/reports/index.js
index d59c0b3d30..77c15f0578 100644
--- a/public/js/ff/reports/index.js
+++ b/public/js/ff/reports/index.js
@@ -60,14 +60,18 @@ $(function () {
 function getReportOptions() {
     "use strict";
     var reportType = $('select[name="report_type"]').val();
-    $('#extra-options').empty();
-    $('#extra-options').addClass('loading');
+    var boxBody = $('#extra-options');
+    var box = $('#extra-options-box');
+    boxBody.empty();
+    box.find('.overlay').show();
 
     $.getJSON('reports/options/' + reportType, function (data) {
-        $('#extra-options').removeClass('loading').html(data.html);
+        boxBody.html(data.html);
         setOptionalFromCookies();
+        box.find('.overlay').hide();
     }).fail(function () {
-        $('#extra-options').removeClass('loading').addClass('error');
+        boxBody.addClass('error');
+        box.find('.overlay').hide();
     });
 }
 
diff --git a/resources/views/reports/default/month.twig b/resources/views/reports/default/month.twig
index 22a7ebe73d..c06a6e75e3 100644
--- a/resources/views/reports/default/month.twig
+++ b/resources/views/reports/default/month.twig
@@ -20,12 +20,16 @@
     </div>
 
     <div class="row">
-        <div class="col-lg-6 col-md-6 col-sm-6 loading">
+        <div class="col-lg-6 col-md-6 col-sm-6">
             <div class="box">
                 <div class="box-header with-border">
                     <h3 class="box-title">{{ 'accountBalances'|_ }}</h3>
                 </div>
-                <div class="box-body table-responsive no-padding loading" id="accountReport">
+                <div class="box-body table-responsive no-padding" id="accountReport">
+                </div>
+                {# loading indicator #}
+                <div class="overlay">
+                    <i class="fa fa-refresh fa-spin"></i>
                 </div>
             </div>
 
@@ -36,7 +40,11 @@
                 <div class="box-header with-border">
                     <h3 class="box-title">{{ 'income'|_ }}</h3>
                 </div>
-                <div class="box-body table-responsive no-padding loading" id="incomeReport">
+                <div class="box-body table-responsive no-padding" id="incomeReport">
+                </div>
+                {# loading indicator #}
+                <div class="overlay">
+                    <i class="fa fa-refresh fa-spin"></i>
                 </div>
             </div>
         </div>
@@ -45,7 +53,11 @@
                 <div class="box-header with-border">
                     <h3 class="box-title">{{ 'expenses'|_ }}</h3>
                 </div>
-                <div class="box-body table-responsive no-padding loading" id="expenseReport">
+                <div class="box-body table-responsive no-padding" id="expenseReport">
+                </div>
+                {# loading indicator #}
+                <div class="overlay">
+                    <i class="fa fa-refresh fa-spin"></i>
                 </div>
             </div>
         </div>
@@ -56,14 +68,15 @@
                 <div class="box-header with-border">
                     <h3 class="box-title">{{ 'incomeVsExpenses'|_ }}</h3>
                 </div>
-                <div class="box-body table-responsive no-padding loading" id="incomeVsExpenseReport">
+                <div class="box-body table-responsive no-padding" id="incomeVsExpenseReport">
+                </div>
+                {# loading indicator #}
+                <div class="overlay">
+                    <i class="fa fa-refresh fa-spin"></i>
                 </div>
             </div>
 
         </div>
-        <div class="col-lg-6 col-md-6 col-sm-6">
-            {% include 'reports/partials/tags' %}
-        </div>
     </div>
     <div class="row">
         <div class="col-lg-8 col-md-8 col-sm-12">
@@ -72,7 +85,11 @@
                 <div class="box-header with-border">
                     <h3 class="box-title">{{ 'budgets'|_ }}</h3>
                 </div>
-                <div class="box-body table-responsive no-padding loading" id="budgetReport">
+                <div class="box-body table-responsive no-padding" id="budgetReport">
+                </div>
+                {# loading indicator #}
+                <div class="overlay">
+                    <i class="fa fa-refresh fa-spin"></i>
                 </div>
             </div>
 
@@ -84,7 +101,11 @@
                 <div class="box-header with-border">
                     <h3 class="box-title">{{ 'categories'|_ }}</h3>
                 </div>
-                <div class="box-body table-responsive no-padding loading" id="categoryReport">
+                <div class="box-body table-responsive no-padding" id="categoryReport">
+                </div>
+                {# loading indicator #}
+                <div class="overlay">
+                    <i class="fa fa-refresh fa-spin"></i>
                 </div>
             </div>
         </div>
@@ -100,7 +121,11 @@
                 <div class="box-header with-border">
                     <h3 class="box-title">{{ 'budgets'|_ }} ({{ 'splitByAccount'|_|lower }})</h3>
                 </div>
-                <div class="box-body table-responsive no-padding loading" id="balanceReport">
+                <div class="box-body table-responsive no-padding" id="balanceReport">
+                </div>
+                {# loading indicator #}
+                <div class="overlay">
+                    <i class="fa fa-refresh fa-spin"></i>
                 </div>
             </div>
 
diff --git a/resources/views/reports/default/multi-year.twig b/resources/views/reports/default/multi-year.twig
index 7b70416735..a24e2b5f27 100644
--- a/resources/views/reports/default/multi-year.twig
+++ b/resources/views/reports/default/multi-year.twig
@@ -31,12 +31,16 @@
 
 
     <div class="row">
-        <div class="col-lg-6 col-md-6 col-sm-6 loading">
+        <div class="col-lg-6 col-md-6 col-sm-6">
             <div class="box">
                 <div class="box-header with-border">
                     <h3 class="box-title">{{ 'accountBalances'|_ }}</h3>
                 </div>
-                <div class="box-body table-responsive no-padding loading" id="accountReport">
+                <div class="box-body table-responsive no-padding" id="accountReport">
+                </div>
+                {# loading indicator #}
+                <div class="overlay">
+                    <i class="fa fa-refresh fa-spin"></i>
                 </div>
             </div>
         </div>
@@ -45,7 +49,11 @@
                 <div class="box-header with-border">
                     <h3 class="box-title">{{ 'income'|_ }}</h3>
                 </div>
-                <div class="box-body table-responsive no-padding loading" id="incomeReport">
+                <div class="box-body table-responsive no-padding" id="incomeReport">
+                </div>
+                {# loading indicator #}
+                <div class="overlay">
+                    <i class="fa fa-refresh fa-spin"></i>
                 </div>
             </div>
         </div>
@@ -54,7 +62,11 @@
                 <div class="box-header with-border">
                     <h3 class="box-title">{{ 'expenses'|_ }}</h3>
                 </div>
-                <div class="box-body table-responsive no-padding loading" id="expenseReport">
+                <div class="box-body table-responsive no-padding" id="expenseReport">
+                </div>
+                {# loading indicator #}
+                <div class="overlay">
+                    <i class="fa fa-refresh fa-spin"></i>
                 </div>
             </div>
         </div>
@@ -65,7 +77,11 @@
                 <div class="box-header with-border">
                     <h3 class="box-title">{{ 'incomeVsExpenses'|_ }}</h3>
                 </div>
-                <div class="box-body table-responsive no-padding loading" id="incomeVsExpenseReport">
+                <div class="box-body table-responsive no-padding" id="incomeVsExpenseReport">
+                </div>
+                {# loading indicator #}
+                <div class="overlay">
+                    <i class="fa fa-refresh fa-spin"></i>
                 </div>
             </div>
         </div>
@@ -92,7 +108,11 @@
                 <div class="box-header with-border">
                     <h3 class="box-title">{{ 'budgets'|_ }}</h3>
                 </div>
-                <div class="box-body no-padding table-responsive loading" id="budgetPeriodReport">
+                <div class="box-body no-padding table-responsive" id="budgetPeriodReport">
+                </div>
+                {# loading indicator #}
+                <div class="overlay">
+                    <i class="fa fa-refresh fa-spin"></i>
                 </div>
             </div>
         </div>
@@ -108,7 +128,6 @@
                 </div>
                 <div class="box-body">
                     <canvas height="400" id="budget_chart" style="width:100%;height:400px;"></canvas>
-
                 </div>
             </div>
         </div>
@@ -121,7 +140,11 @@
                 <div class="box-header with-border">
                     <h3 class="box-title">{{ 'categories'|_ }} ({{ 'expenses'|_ }})</h3>
                 </div>
-                <div class="box-body no-padding table-responsive loading" id="categoryExpense">
+                <div class="box-body no-padding table-responsive" id="categoryExpense">
+                </div>
+                {# loading indicator #}
+                <div class="overlay">
+                    <i class="fa fa-refresh fa-spin"></i>
                 </div>
             </div>
         </div>
@@ -134,7 +157,11 @@
                 <div class="box-header with-border">
                     <h3 class="box-title">{{ 'categories'|_ }} ({{ 'income'|_ }})</h3>
                 </div>
-                <div class="box-body no-padding table-responsive loading" id="categoryIncome">
+                <div class="box-body no-padding table-responsive" id="categoryIncome">
+                </div>
+                {# loading indicator #}
+                <div class="overlay">
+                    <i class="fa fa-refresh fa-spin"></i>
                 </div>
             </div>
         </div>
@@ -149,7 +176,6 @@
                 </div>
                 <div class="box-body">
                     <canvas height="400" id="category_chart" style="width:100%;height:400px;"></canvas>
-
                 </div>
             </div>
         </div>
diff --git a/resources/views/reports/default/year.twig b/resources/views/reports/default/year.twig
index 328536ef03..79d9ea29b3 100644
--- a/resources/views/reports/default/year.twig
+++ b/resources/views/reports/default/year.twig
@@ -35,14 +35,22 @@
                 <div class="box-header with-border">
                     <h3 class="box-title">{{ 'accountBalances'|_ }}</h3>
                 </div>
-                <div class="box-body table-responsive no-padding loading" id="accountReport">
+                <div class="box-body table-responsive no-padding" id="accountReport">
+                </div>
+                {# loading indicator #}
+                <div class="overlay">
+                    <i class="fa fa-refresh fa-spin"></i>
                 </div>
             </div>
             <div class="box">
                 <div class="box-header with-border">
                     <h3 class="box-title">{{ 'incomeVsExpenses'|_ }}</h3>
                 </div>
-                <div class="box-body table-responsive no-padding loading" id="incomeVsExpenseReport">
+                <div class="box-body table-responsive no-padding" id="incomeVsExpenseReport">
+                </div>
+                {# loading indicator #}
+                <div class="overlay">
+                    <i class="fa fa-refresh fa-spin"></i>
                 </div>
             </div>
         </div>
@@ -51,7 +59,11 @@
                 <div class="box-header with-border">
                     <h3 class="box-title">{{ 'income'|_ }}</h3>
                 </div>
-                <div class="box-body table-responsive no-padding loading" id="incomeReport">
+                <div class="box-body table-responsive no-padding" id="incomeReport">
+                </div>
+                {# loading indicator #}
+                <div class="overlay">
+                    <i class="fa fa-refresh fa-spin"></i>
                 </div>
             </div>
         </div>
@@ -60,17 +72,15 @@
                 <div class="box-header with-border">
                     <h3 class="box-title">{{ 'expenses'|_ }}</h3>
                 </div>
-                <div class="box-body table-responsive no-padding loading" id="expenseReport">
+                <div class="box-body table-responsive no-padding" id="expenseReport">
+                </div>
+                {# loading indicator #}
+                <div class="overlay">
+                    <i class="fa fa-refresh fa-spin"></i>
                 </div>
             </div>
         </div>
     </div>
-    <div class="row">
-        <div class="col-lg-6 col-md-6 col-sm-6">
-            {% include 'reports/partials/tags' %}
-        </div>
-    </div>
-
     <div class="row">
         <div class="col-lg-12 col-md-12 col-sm-12">
             <div class="box">
@@ -91,7 +101,11 @@
                 <div class="box-header with-border">
                     <h3 class="box-title">{{ 'budgets'|_ }}</h3>
                 </div>
-                <div class="box-body no-padding table-responsive loading" id="budgetPeriodReport">
+                <div class="box-body no-padding table-responsive" id="budgetPeriodReport">
+                </div>
+                {# loading indicator #}
+                <div class="overlay">
+                    <i class="fa fa-refresh fa-spin"></i>
                 </div>
             </div>
         </div>
@@ -107,7 +121,6 @@
                 </div>
                 <div class="box-body">
                     <canvas height="400" id="budget_chart" style="width:100%;height:400px;"></canvas>
-
                 </div>
             </div>
         </div>
@@ -120,7 +133,11 @@
                 <div class="box-header with-border">
                     <h3 class="box-title">{{ 'categories'|_ }} ({{ 'expenses'|_ }})</h3>
                 </div>
-                <div class="box-body no-padding table-responsive loading" id="categoryExpense">
+                <div class="box-body no-padding table-responsive" id="categoryExpense">
+                </div>
+                {# loading indicator #}
+                <div class="overlay">
+                    <i class="fa fa-refresh fa-spin"></i>
                 </div>
             </div>
         </div>
@@ -133,7 +150,11 @@
                 <div class="box-header with-border">
                     <h3 class="box-title">{{ 'categories'|_ }} ({{ 'income'|_ }})</h3>
                 </div>
-                <div class="box-body no-padding table-responsive loading" id="categoryIncome">
+                <div class="box-body no-padding table-responsive" id="categoryIncome">
+                </div>
+                {# loading indicator #}
+                <div class="overlay">
+                    <i class="fa fa-refresh fa-spin"></i>
                 </div>
             </div>
         </div>
@@ -148,7 +169,6 @@
                 </div>
                 <div class="box-body">
                     <canvas height="400" id="category_chart" style="width:100%;height:400px;"></canvas>
-
                 </div>
             </div>
         </div>
diff --git a/resources/views/reports/index.twig b/resources/views/reports/index.twig
index 70d8fd86db..9d3ddeffe9 100644
--- a/resources/views/reports/index.twig
+++ b/resources/views/reports/index.twig
@@ -84,11 +84,15 @@
 
                     </div>
                 </div>
-                <div class="box">
+                <div class="box" id="extra-options-box">
                     <div class="box-header with-border">
                         <h3 class="box-title">{{ 'reports_extra_options'|_ }}</h3>
                     </div>
-                    <div class="box-body loading" id="extra-options">
+                    <div class="box-body" id="extra-options">
+                    </div>
+                    {# loading indicator #}
+                    <div class="overlay">
+                        <i class="fa fa-refresh fa-spin"></i>
                     </div>
                 </div>