diff --git a/gemp-lotr/gemp-lotr-web/src/main/webapp/js/gemp-012/DeckPanel.js b/gemp-lotr/gemp-lotr-web/src/main/webapp/js/gemp-012/DeckPanel.js
index 1294040b4..8cfab1e18 100644
--- a/gemp-lotr/gemp-lotr-web/src/main/webapp/js/gemp-012/DeckPanel.js
+++ b/gemp-lotr/gemp-lotr-web/src/main/webapp/js/gemp-012/DeckPanel.js
@@ -85,7 +85,13 @@ var DeckPanel = Class.extend({
     },
 
     clearDeck: function() {
+        this.ringBearerContainer.removeCards();
+        this.ringContainer.removeCards();
+        this.sitesContainer.removeCards();
+        this.fpContainer.removeCards();
+        this.shadowContainer.removeCards();
 
+        this.updateDeckCounts();
     },
 
     layoutUi: function(x, y, width, height) {
@@ -124,6 +130,23 @@ var DeckPanel = Class.extend({
         return count;
     },
 
+    updateDeckCounts: function() {
+        var that = this;
+
+        var updateGroup = function (groupContainer, titlePrefix, tabHref) {
+            groupContainer.layoutCards();
+            var count = groupContainer.getCardsCount();
+            var title = titlePrefix + " (" + count + ")";
+            $(".ui-tabs-nav a[href='#" + tabHref + "']", that.tabs).html(title);
+        };
+
+        updateGroup(this.ringContainer, "Ring", "ring");
+        updateGroup(this.ringBearerContainer, "Ring-bearer", "ringBearer");
+        updateGroup(this.sitesContainer, "Sites", "sites");
+        updateGroup(this.fpContainer, "Free People", "fp");
+        updateGroup(this.shadowContainer, "Shadow", "shadow");
+    },
+
     addCard: function(cardElem, cardId, cardProps, layoutCardFunc, widthToHeightScaleFunc) {
         var group = cardProps["group"];
 
@@ -147,18 +170,7 @@ var DeckPanel = Class.extend({
     },
 
     finishAddingCards: function() {
-        var updateGroup = function (groupContainer, titlePrefix, tabHref) {
-            groupContainer.layoutCards();
-            var count = groupContainer.getCardsCount();
-            var title = titlePrefix + " (" + count + ")";
-            $(".ui-tabs-nav a[href='#" + tabHref + "']", that.tabs).html(title);
-        };
-
-        updateGroup(this.ringContainer, "Ring", "ring");
-        updateGroup(this.ringBearerContainer, "Ring-bearer", "ringBearer");
-        updateGroup(this.sitesContainer, "Sites", "sites");
-        updateGroup(this.fpContainer, "Free People", "fp");
-        updateGroup(this.shadowContainer, "Shadow", "shadow");
+        this.updateDeckCounts();
     },
 
     addSingleCard: function(cardElem, cardId, cardProps, layoutCardFunc, widthToHeightScaleFunc) {
diff --git a/gemp-lotr/gemp-lotr-web/src/main/webapp/js/gemp-012/deckBuildingUi2.js b/gemp-lotr/gemp-lotr-web/src/main/webapp/js/gemp-012/deckBuildingUi2.js
index 4d7affdf9..15a8751e3 100644
--- a/gemp-lotr/gemp-lotr-web/src/main/webapp/js/gemp-012/deckBuildingUi2.js
+++ b/gemp-lotr/gemp-lotr-web/src/main/webapp/js/gemp-012/deckBuildingUi2.js
@@ -87,6 +87,11 @@ var GempLotrDeckBuildingUI2 = Class.extend({
                 var cardProps = cardElem.data("props");
                 this.deckPanel.addSingleCard(this.createDeckCardElem(cardProps), ""+(this.cardInDeckId++), cardProps, this.layoutCardInDeck, this.widthToHeightScaleInCollection);
                 this.updateCardCount(cardElem, cardProps);
+            } else if (tar.hasClass("cardInDeck")) {
+                // remove card from deck
+                cardElem.remove();
+                this.deckPanel.updateDeckCounts();
+                this.updateCardCounts();
             }
         }
         return true;