diff --git a/app/Repositories/Tag/TagRepository.php b/app/Repositories/Tag/TagRepository.php
index 8fa5f3cf4f..f4b3e9cdd8 100644
--- a/app/Repositories/Tag/TagRepository.php
+++ b/app/Repositories/Tag/TagRepository.php
@@ -25,6 +25,7 @@ namespace FireflyIII\Repositories\Tag;
 
 
 use Carbon\Carbon;
+use DB;
 use FireflyIII\Helpers\Collector\JournalCollectorInterface;
 use FireflyIII\Helpers\Filter\InternalTransferFilter;
 use FireflyIII\Models\Tag;
@@ -328,39 +329,69 @@ class TagRepository implements TagRepositoryInterface
      */
     public function tagCloud(?int $year): array
     {
+        /*
+         * Some vars
+         */
         $min    = null;
-        $max    = 0;
-        $query  = $this->user->tags();
+        $max    = '0';
         $return = [];
-        Log::debug('Going to build tag-cloud');
+        /*
+         * get tags with a certain amount (in this range):
+         */
+        $query = $this->user->tags()
+                            ->leftJoin('tag_transaction_journal', 'tag_transaction_journal.tag_id', '=', 'tags.id')
+                            ->leftJoin('transaction_journals', 'tag_transaction_journal.transaction_journal_id', '=', 'transaction_journals.id')
+                            ->leftJoin('transactions', 'transaction_journals.id', '=', 'transactions.transaction_journal_id')
+                            ->where('transactions.amount', '>', 0)
+                            ->groupBy('tags.id');
+
+        // add date range (or not):
+        if (is_null($year)) {
+            $query->whereNull('tags.date');
+        }
+        if (!is_null($year)) {
+            $start = $year . '-01-01';
+            $end   = $year . '-12-31';
+            $query->where('tags.date', '>=', $start)->where('tags.date', '<=', $end);
+        }
+        $set             = $query->get(['tags.id', DB::raw('SUM(transactions.amount) as amount_sum')]);
+        $tagsWithAmounts = [];
+        /** @var Tag $tag */
+        foreach ($set as $tag) {
+            $tagsWithAmounts[$tag->id] = strval($tag->amount_sum);
+        }
+
+        /*
+         * get all tags in period:
+         */
+        $query = $this->user->tags();
         if (!is_null($year)) {
-            Log::debug(sprintf('Year is not null: %d', $year));
             $start = $year . '-01-01';
             $end   = $year . '-12-31';
             $query->where('date', '>=', $start)->where('date', '<=', $end);
         }
         if (is_null($year)) {
             $query->whereNull('date');
-            Log::debug('Year is NULL');
         }
         $tags      = $query->orderBy('id', 'desc')->get();
         $temporary = [];
-        Log::debug(sprintf('Found %d tags', $tags->count()));
         /** @var Tag $tag */
         foreach ($tags as $tag) {
-            $amount      = floatval($this->sumOfTag($tag, null, null));
-            $min         = $amount < $min || is_null($min) ? $amount : $min;
-            $max         = $amount > $max ? $amount : $max;
+            $amount = $tagsWithAmounts[$tag->id] ?? '0';
+            if (is_null($min)) {
+                $min = $amount;
+            }
+            $max = bccomp($amount, $max) === 1 ? $amount : $max;
+            $min = bccomp($amount, $min) === -1 ? $amount : $min;
+
             $temporary[] = [
                 'amount' => $amount,
                 'tag'    => $tag,
             ];
-            Log::debug(sprintf('Now working on tag %s with total amount %s', $tag->tag, $amount));
-            Log::debug(sprintf('Minimum is now %f, maximum is %f', $min, $max));
         }
         /** @var array $entry */
         foreach ($temporary as $entry) {
-            $scale          = $this->cloudScale([12, 20], $entry['amount'], $min, $max);
+            $scale          = $this->cloudScale([12, 20], floatval($entry['amount']), floatval($min), floatval($max));
             $tagId          = $entry['tag']->id;
             $return[$tagId] = [
                 'scale' => $scale,
@@ -368,8 +399,6 @@ class TagRepository implements TagRepositoryInterface
             ];
         }
 
-        Log::debug('DONE with tagcloud');
-
         return $return;
     }
 
@@ -402,13 +431,10 @@ class TagRepository implements TagRepositoryInterface
      */
     private function cloudScale(array $range, float $amount, float $min, float $max): int
     {
-        Log::debug(sprintf('Now in cloudScale with %s as amount and %f min, %f max', $amount, $min, $max));
         $amountDiff = $max - $min;
-        Log::debug(sprintf('AmountDiff is %f', $amountDiff));
 
         // no difference? Every tag same range:
         if ($amountDiff === 0.0) {
-            Log::debug(sprintf('AmountDiff is zero, return %d', $range[0]));
 
             return $range[0];
         }
diff --git a/resources/views/accounts/reconcile.twig b/resources/views/accounts/reconcile/index.twig
similarity index 88%
rename from resources/views/accounts/reconcile.twig
rename to resources/views/accounts/reconcile/index.twig
index 1cb62fc343..e111c69190 100644
--- a/resources/views/accounts/reconcile.twig
+++ b/resources/views/accounts/reconcile/index.twig
@@ -67,12 +67,17 @@
                         </tr>
                         </tbody>
                         <tfoot>
-                        <tr class="update_date_button" style="display:none;">
-                            <td colspan="4">
-                                <a href="#" class="btn btn-default update_view">
-                                    {{ 'update_view'|_ }}
-                                </a>
-                                <span class="text-muted">(unsaved progress will be lost!)</span>
+                        <tr>
+                            <td colspan="3">
+                                <div class="update_balance_instruction">
+                                    {{ 'update_balance_dates_instruction'|_ }}
+                                </div>
+                                <div class="select_transactions_instruction" style="display:none;">
+                                    {{ 'select_transactions_instruction'|_ }}
+                                </div>
+                            </td>
+                            <td>
+                                <a href="#" class="btn btn-default start_reconcile">{{ 'start_reconcile'|_ }}</a>
                             </td>
                         </tr>
                         </tfoot>
@@ -96,12 +101,11 @@
                         <tbody>
                         <tr>
                             <td>
-                                <span id="difference"></span>
+                                <p class="lead" id="difference"></p>
                             </td>
                             <td>
                                 <div class="btn-group">
-                                    <a href="#" class="btn btn-default">Reconcile</a>
-                                    <a href="#" class="btn btn-default">Reconcile with transaction</a>
+                                    <button class="btn btn-default store_reconcile" disabled><i class="fa fa-fw fa-check"></i> {{ 'store_reconcile'|_ }}</button>
                                 </div>
                             </td>
                         </tr>
@@ -157,6 +161,25 @@
                                 </tr>
                                 {% set startSet = true %}
                             {% endif %}
+
+                            {# end marker #}
+                            {% if transaction.date <= end and endSet == false %}
+                                <tr>
+                                    <td colspan="5">
+                                        &nbsp;
+                                    </td>
+                                    <td colspan="3">
+                                        <span class="label label-default">
+                                            {{ trans('firefly.end_of_reconcile_period', {period: end.formatLocalized(monthAndDayFormat) }) }}
+                                        </span>
+                                    </td>
+                                    <td colspan="2">
+                                        &nbsp;
+                                    </td>
+                                </tr>
+                                {% set endSet = true %}
+                            {% endif %}
+
                             <tr data-date="{{ transaction.date.format('Y-m-d') }}" data-id="{{ transaction.journal_id }}"
                                 data-transaction-id="{{ transaction.id }}">
                                 <td class="hidden-xs">
@@ -185,7 +208,13 @@
                                 </td>
                                 <td style="text-align: right;"><span style="margin-right:5px;">{{ transaction|transactionAmount }}</span></td>
                                 <td>
-                                    <input type="checkbox" name="reconciled[]" value="{{ transaction.amount }}" class="reconcile_checkbox">
+                                    {% if transaction.reconciled %}
+                                        {{ transaction|transactionReconciled }}
+                                    {% else %}
+                                        <input type="checkbox" name="reconciled[]"
+                                               data-younger="{% if transaction.date > end %}true{% else %}false{% endif %}"
+                                               value="{{ transaction.transaction_amount }}" data-id="{{ transaction.id }}" disabled class="reconcile_checkbox">
+                                    {% endif %}
                                 </td>
                                 <td class="hidden-sm hidden-xs">
                                     {{ transaction.date.formatLocalized(monthAndDayFormat) }}
@@ -205,23 +234,7 @@
                                     {{ transaction|transactionCategories }}
                                 </td>
                             </tr>
-                            {# end marker #}
-                            {% if transaction.date <= end and endSet == false %}
-                                <tr>
-                                    <td colspan="5">
-                                        &nbsp;
-                                    </td>
-                                    <td colspan="3">
-                                        <span class="label label-default">
-                                            {{ trans('firefly.end_of_reconcile_period', {period: end.formatLocalized(monthAndDayFormat) }) }}
-                                        </span>
-                                    </td>
-                                    <td colspan="2">
-                                        &nbsp;
-                                    </td>
-                                </tr>
-                                {% set endSet = true %}
-                            {% endif %}
+
                         {% endfor %}
                         </tbody>
                     </table>