diff --git a/domain-server/resources/web/css/style.css b/domain-server/resources/web/css/style.css
index 0a3dc3dab5..b66b7df258 100644
--- a/domain-server/resources/web/css/style.css
+++ b/domain-server/resources/web/css/style.css
@@ -37,8 +37,9 @@ body {
     margin-right: auto;
 }
 
-.table .value-category {
+.value-category:not(.inputs) {
   font-weight: bold;
+  background: #f5f5f5;
 }
 
 .table .value-category [message]::after {
@@ -47,8 +48,18 @@ body {
   font-weight: normal;
 }
 
-.table .value-category.inputs {
-  font-weight: normal;
+.table .value-row.contracted,
+.table .inputs.contracted {
+  display: none;
+}
+
+.toggle-category {
+  cursor: pointer;
+}
+
+.toggle-category-icon {
+  padding: 4px;
+  margin-right: 8px;
 }
 
 .glyphicon-remove {
diff --git a/domain-server/resources/web/settings/js/settings.js b/domain-server/resources/web/settings/js/settings.js
index e59405981f..06c6520c26 100644
--- a/domain-server/resources/web/settings/js/settings.js
+++ b/domain-server/resources/web/settings/js/settings.js
@@ -14,6 +14,11 @@ var Settings = {
   DEL_ROW_SPAN_CLASSES: 'glyphicon glyphicon-remove del-row',
   ADD_CATEGORY_BUTTON_CLASS: 'add-category',
   ADD_CATEGORY_SPAN_CLASSES: 'glyphicon glyphicon-plus add-category',
+  TOGGLE_CATEGORY_COLUMN_CLASS: 'toggle-category',
+  TOGGLE_CATEGORY_SPAN_CLASS: 'toggle-category-icon',
+  TOGGLE_CATEGORY_SPAN_CLASSES: 'glyphicon toggle-category-icon',
+  TOGGLE_CATEGORY_EXPANDED_CLASS: 'glyphicon-triangle-bottom',
+  TOGGLE_CATEGORY_CONTRACTED_CLASS: 'glyphicon-triangle-right',
   DEL_CATEGORY_BUTTON_CLASS: 'del-category',
   DEL_CATEGORY_SPAN_CLASSES: 'glyphicon glyphicon-remove del-category',
   MOVE_UP_BUTTON_CLASS: 'move-up',
@@ -184,6 +189,10 @@ $(document).ready(function(){
     deleteTableCategory($(this).closest('tr'));
   });
 
+  $('#' + Settings.FORM_ID).on('click', '.' + Settings.TOGGLE_CATEGORY_COLUMN_CLASS, function(){
+    toggleTableCategory($(this).closest('tr'));
+  });
+
   $('#' + Settings.FORM_ID).on('click', '.' + Settings.MOVE_UP_BUTTON_CLASS, function(){
     moveTableRow($(this).closest('tr'), true);
   });
@@ -937,9 +946,10 @@ $('body').on('click', '.save-button', function(e){
 });
 
 function makeTable(setting, keypath, setting_value, isLocked) {
-  // TODO: enforce category sorting
   var isArray = !_.has(setting, 'key');
-
+  var categoryKey = setting.categorize_by_key;
+  var isCategorized = !!categoryKey && isArray;
+ 
   if (!isArray && setting.can_order) {
     setting.can_order = false;
   }
@@ -1013,8 +1023,6 @@ function makeTable(setting, keypath, setting_value, isLocked) {
     var rowIsObject = setting.columns.length > 1;
 
     _.each(setting_value, function(row, rowIndexOrName) {
-      var categoryKey = setting.categorize_by_key;
-      var isCategorized = !!categoryKey && isArray;
       var categoryPair = {};
       var categoryValue = "";
       if (isCategorized) {
@@ -1118,7 +1126,8 @@ function makeTable(setting, keypath, setting_value, isLocked) {
 function makeTableCategoryHeader(categoryKey, categoryValue, numVisibleColumns, canRemove, message) {
   var html =
     "<tr class='" + Settings.DATA_CATEGORY_CLASS + "' data-key='" + categoryKey + "' data-category='" + categoryValue + "'>" +
-      "<td colspan='" + (numVisibleColumns - 1) + "'>" +
+      "<td colspan='" + (numVisibleColumns - 1) + "' class='" + Settings.TOGGLE_CATEGORY_COLUMN_CLASS + "'>" +
+        "<span class='" + Settings.TOGGLE_CATEGORY_SPAN_CLASSES + " " + Settings.TOGGLE_CATEGORY_EXPANDED_CLASS + "'></span>" +
         "<span message='" + message + "'>" + categoryValue + "</span>" +
       "</td>" +
       ((canRemove) ? (
@@ -1418,7 +1427,7 @@ function addTableCategory($categoryInputRow) {
 
     setTimeout(function () {
       $categoryInputRow.removeClass("has-warning");
-    }, 1000);
+    }, 400);
 
     return;
   }
@@ -1477,6 +1486,25 @@ function deleteTableCategory($categoryHeaderRow) {
     });
 }
 
+function toggleTableCategory($categoryHeaderRow) {
+  var $icon = $categoryHeaderRow.find("." + Settings.TOGGLE_CATEGORY_SPAN_CLASS).first();
+  var categoryName = $categoryHeaderRow.data("category");
+  var wasExpanded = $icon.hasClass(Settings.TOGGLE_CATEGORY_EXPANDED_CLASS);
+  if (wasExpanded) {
+    $icon
+      .addClass(Settings.TOGGLE_CATEGORY_CONTRACTED_CLASS)
+      .removeClass(Settings.TOGGLE_CATEGORY_EXPANDED_CLASS);
+  } else {
+    $icon
+      .addClass(Settings.TOGGLE_CATEGORY_EXPANDED_CLASS)
+      .removeClass(Settings.TOGGLE_CATEGORY_CONTRACTED_CLASS);
+  }
+  $categoryHeaderRow
+    .closest("table")
+    .find("tr[data-category='" + categoryName + "']")
+    .toggleClass("contracted", wasExpanded);
+}
+
 function moveTableRow(row, move_up) {
   var table = $(row).closest('table')
   var isArray = table.data('setting-type') === 'array'