diff --git a/css/style.css b/css/style.css
index c5bf128d1cd436af8eadfca0e27273e53f78d32a..2059bb58f7b950c5876add086274dd17b08e2fa1 100644
--- a/css/style.css
+++ b/css/style.css
@@ -961,13 +961,43 @@ header.navbar-default {
 
 ul.js-facets-checkbox-links {
   list-style-type: none;
+  margin-bottom: 0px;
   padding-left: 0px; }
+  ul.js-facets-checkbox-links .facet-item {
+    padding: 5px;
+    display: flex;
+    align-items: flex-start;
+    border-bottom: 1px solid #ddd; }
+  ul.js-facets-checkbox-links .facet-item:last-child {
+      border-bottom: 0; }
+  ul.js-facets-checkbox-links .facet-item input {
+    margin-top: 7px; }
   ul.js-facets-checkbox-links .facet-item label {
+    margin-bottom: 0px;
     margin-left: 5px;
-    display: inline; }
+    display: flex;
+    flex: 1; }
+  ul.js-facets-checkbox-links .facet-item label .facet-value {
+    flex: 1;
+    font-weight: 400;
+    padding-right: 5px; }
+
+ul.js-facets-links {
+  margin-bottom: 0px; }
+  ul.js-facets-links a {
+      display: flex; }
+  ul.js-facets-links .facet-value {
+    flex: 1; }
+
+.block-facets-summary li {
+  float: left; }
+
+.block-facets-summary a {
+  padding: 5px 15px;
+  font-size: 0.9em; }
 
-.block-facets-summary .clear-filters {
-  margin-top: 15px; }
+.block-facets-summary .glyphicon-remove {
+    font-size: 0.8em; }
 
 .flag a {
   text-decoration: none; }
diff --git a/sass/modules/_facets.scss b/sass/modules/_facets.scss
index 9349180549ef46f856229037a4017de71413df52..e5fc5cdc7b3fa072feca29dd25722f505f484db7 100644
--- a/sass/modules/_facets.scss
+++ b/sass/modules/_facets.scss
@@ -2,17 +2,52 @@
 
 ul.js-facets-checkbox-links {
   list-style-type: none;
+  margin-bottom: 0px;
   padding-left: 0px;
   .facet-item {
+    padding: 5px;
+    display: flex;
+    align-items: flex-start;
+    border-bottom: 1px solid #ddd;
+    &:last-child {
+      border-bottom: 0;
+    }
+    input {
+      margin-top: 7px;
+    }
     label {
+      margin-bottom: 0px;
       margin-left: 5px;
-      display: inline;
+      display: flex;
+      flex: 1;
+      .facet-value {
+        flex: 1;
+        font-weight: 400;
+        padding-right: 5px;
+      }
     }
   }
 }
 
+ul.js-facets-links {
+  margin-bottom: 0px;
+  a {
+    display: flex;
+  }
+  .facet-value {
+    flex: 1;
+  }
+}
+
 .block-facets-summary {
-  .clear-filters {
-    margin-top: 15px;
+  li {
+    float: left;
+  }
+  a {
+    padding: 5px 15px;
+    font-size: 0.9em;
+  }
+  .glyphicon-remove {
+    font-size: 0.8em;
   }
 }
diff --git a/src/Plugin/Setting/Customization/Search/FacetPanelType.php b/src/Plugin/Setting/Customization/Search/FacetPanelType.php
new file mode 100644
index 0000000000000000000000000000000000000000..56a8c992fc9b81c7f1057bb3abb76425881abe79
--- /dev/null
+++ b/src/Plugin/Setting/Customization/Search/FacetPanelType.php
@@ -0,0 +1,44 @@
+<?php
+
+namespace Drupal\wxt_bootstrap\Plugin\Setting\Customization\Search;
+
+use Drupal\bootstrap\Plugin\Setting\SettingBase;
+use Drupal\bootstrap\Utility\Element;
+use Drupal\Core\Form\FormStateInterface;
+
+/**
+ * The "wxt_facets_panel_type" theme setting.
+ *
+ * @ingroup plugins_setting
+ *
+ * @BootstrapSetting(
+ *   id = "wxt_facets_panel_type",
+ *   type = "select",
+ *   title = @Translation("Facet panel type"),
+ *   defaultValue = "panel-default",
+ *   options = {
+ *     "panel-default" = @Translation("Default"),
+ *     "panel-primary" = @Translation("Primary"),
+ *   },
+ *   description = @Translation("Select the panel type to use for facet display if not using collapsible facets."),
+ *   groups = {
+ *     "customization" = @Translation("Customization"),
+ *     "search" = @Translation("Search"),
+ *   }
+ * )
+ */
+class FacetPanelType extends SettingBase {
+
+  /**
+   * {@inheritdoc}
+   */
+  public function alterFormElement(Element $form, FormStateInterface $form_state, $form_id = NULL) {
+    $setting = $this->getSettingElement($form, $form_state);
+    $setting->setProperty('states', [
+      'visible' => [
+        ':input[name="wxt_facets_collapsible"]' => ['checked' => FALSE],
+      ],
+    ]);
+  }
+
+}
diff --git a/src/Plugin/Setting/Customization/Search/Facets.php b/src/Plugin/Setting/Customization/Search/Facets.php
new file mode 100644
index 0000000000000000000000000000000000000000..7cc741b58e6948e39b1a3ad37a08941e17802341
--- /dev/null
+++ b/src/Plugin/Setting/Customization/Search/Facets.php
@@ -0,0 +1,24 @@
+<?php
+
+namespace Drupal\wxt_bootstrap\Plugin\Setting\Customization\Search;
+
+use Drupal\bootstrap\Plugin\Setting\SettingBase;
+
+/**
+ * The "wxt_facets_collapsible" theme setting.
+ *
+ * @ingroup plugins_setting
+ *
+ * @BootstrapSetting(
+ *   id = "wxt_facets_collapsible",
+ *   type = "checkbox",
+ *   title = @Translation("Collapsible facets"),
+ *   defaultValue = FALSE,
+ *   description = @Translation("Check this box to enable collapsible facets."),
+ *   groups = {
+ *     "customization" = @Translation("Customization"),
+ *     "search" = @Translation("Search"),
+ *   }
+ * )
+ */
+class Facets extends SettingBase {}
diff --git a/templates/block/block--facets-summary.html.twig b/templates/block/block--facets-summary.html.twig
index 0e6554a489d101fd662241e0d4c33315fe7bea8c..3287251f7001af1a637df3e11800b7e5415bdd12 100644
--- a/templates/block/block--facets-summary.html.twig
+++ b/templates/block/block--facets-summary.html.twig
@@ -47,8 +47,6 @@
 #}
 {%
   set classes = [
-    'panel',
-    'panel-primary',
     'block',
     'block-' ~ configuration.provider|clean_class,
     'block-' ~ plugin_id|clean_class,
@@ -56,21 +54,19 @@
     'clearfix',
   ]
 %}
-<section{{ attributes.addClass(classes) }}>
+{% set element = label ? 'section' : 'div' %}
+<{{ element }}{{ attributes.addClass(classes) }}>
   {{ title_prefix }}
   {% if label %}
-    <header class="panel-heading">
-      <h2{{ title_attributes.addClass('panel-title') }}>
-        <span class="glyphicon glyphicon-filter"></span>
-        {{ label }}
-      </h2>
-    </header>
+    <h2{{ title_attributes }}>
+      {{ label }}
+    </h2>
   {% endif %}
   {{ title_suffix }}
 
   {% block content %}
-    <div class="panel-body">
+    <div class="search-terms">
       {{ content }}
     </div>
   {% endblock %}
-</section>
+</{{ element }}>
diff --git a/templates/block/block--facets.html.twig b/templates/block/block--facets.html.twig
index 0e6554a489d101fd662241e0d4c33315fe7bea8c..ee28629f11bcf487b795c91cdf452d5724d1bcaa 100644
--- a/templates/block/block--facets.html.twig
+++ b/templates/block/block--facets.html.twig
@@ -48,29 +48,43 @@
 {%
   set classes = [
     'panel',
-    'panel-primary',
+    facet_panel_type,
     'block',
     'block-' ~ configuration.provider|clean_class,
     'block-' ~ plugin_id|clean_class,
-    'mrgn-tp-lg',
     'clearfix',
   ]
 %}
-<section{{ attributes.addClass(classes) }}>
-  {{ title_prefix }}
-  {% if label %}
-    <header class="panel-heading">
-      <h2{{ title_attributes.addClass('panel-title') }}>
-        <span class="glyphicon glyphicon-filter"></span>
-        {{ label }}
-      </h2>
-    </header>
-  {% endif %}
-  {{ title_suffix }}
 
-  {% block content %}
-    <div class="panel-body">
-      {{ content }}
-    </div>
-  {% endblock %}
-</section>
+{% if collapsible_facets %}
+  <details{{ attributes.addClass('mrgn-bttm-0', classes) }}>
+    {{ title_prefix }}
+    {% if label %}
+      <summary class="panel-heading">
+        <h2{{ title_attributes.addClass('panel-title') }}>
+          {{ label }}
+        </h2>
+      </summary>
+    {% endif %}
+    {{ title_suffix }}
+
+    {{ content }}
+  </details>
+{% else %}
+  <section{{ attributes.addClass('mrgn-tp-lg', classes) }}>
+    {{ title_prefix }}
+    {% if label %}
+      <header class="panel-heading">
+        <h2{{ title_attributes.addClass('panel-title') }}>
+          <span class="glyphicon glyphicon-filter"></span>
+          {{ label }}
+        </h2>
+      </header>
+    {% endif %}
+    {{ title_suffix }}
+
+      <div class="panel-body">
+        {{ content }}
+      </div>
+  </section>
+{% endif %}
diff --git a/templates/facets/facets-item-list.html.twig b/templates/facets/facets-item-list.html.twig
index b96cdcd31b1ee3bc2f9c857178b5b77ae8f467c5..1ef37d45619eae6f9f6c693e2846c0a5e9eb5464 100644
--- a/templates/facets/facets-item-list.html.twig
+++ b/templates/facets/facets-item-list.html.twig
@@ -30,7 +30,7 @@
   {%- endif -%}
 
   {%- if items -%}
-    <{{ list_type }}{{ attributes }}>
+    <{{ list_type }}{{ attributes.addClass('list-unstyled') }}>
       {%- for item in items -%}
         <li{{ item.attributes }}>{{ item.value }}</li>
       {%- endfor -%}
diff --git a/templates/facets/facets-result-item--summary.html.twig b/templates/facets/facets-result-item--summary.html.twig
new file mode 100644
index 0000000000000000000000000000000000000000..4247d6ab964db1eb240190329f79e1707ec1c041
--- /dev/null
+++ b/templates/facets/facets-result-item--summary.html.twig
@@ -0,0 +1,16 @@
+{#
+/**
+ * @file
+ * Default theme implementation of a summary facet result item.
+ *
+ * Available variables:
+ * - value: The item value.
+ * - show_count: If this facet provides count.
+ * - count: The amount of results.
+ *
+ * @ingroup themeable
+ */
+#}
+<div class="visually-hidden">{{ 'Remove filter for'|t }} </div>
+{{ value }}
+<span class="glyphicon glyphicon-remove"></span>
diff --git a/templates/facets/facets-result-item.html.twig b/templates/facets/facets-result-item.html.twig
index d3df7c3a77489911f321a0d1bb23e607838a8f36..38c73c3ebf00fbcb870f2da77e7186a968b51cd3 100644
--- a/templates/facets/facets-result-item.html.twig
+++ b/templates/facets/facets-result-item.html.twig
@@ -11,4 +11,19 @@
  * @ingroup themeable
  */
 #}
-{{ value }} {% if show_count %}<span class="facet-count badge">{{ count }}</span>{% endif %}
+
+<span class="facet-value">
+  {{ value }}
+</span>
+
+{% if show_count %}
+  <span class="badge-wrapper">
+    <span class="facet-count badge">{{ count }} <span class="wb-inv">
+      {% if count == 1 %}
+        {% trans %}result available{% endtrans %}
+      {% else %}
+        {% trans %}results available{% endtrans %}
+      {% endif %}
+    </span></span>
+  </span>
+{% endif %}
diff --git a/templates/facets/facets-summary-item-list.html.twig b/templates/facets/facets-summary-item-list.html.twig
index 58b6fc2bb065c7b54cca537a940df2b98ffa1e5e..613628c920ceb627c1ee00b4937b50c9742a4beb 100644
--- a/templates/facets/facets-summary-item-list.html.twig
+++ b/templates/facets/facets-summary-item-list.html.twig
@@ -30,7 +30,7 @@
   {%- endif -%}
 
   {%- if items -%}
-    <{{ list_type }}{{ attributes.addClass('list-unstyled') }}>
+    <{{ list_type }}{{ attributes.addClass('list-unstyled', 'clearfix') }}>
       {%- for item in items -%}
         <li{{ item.attributes }}>{{ item.value }}</li>
       {%- endfor -%}
diff --git a/wxt_bootstrap.theme b/wxt_bootstrap.theme
index 123933b35b62cb8c659219dc625d5df1c68d838f..48439f32a8268d72c7788d4bfceb1fcc0ae7bd18 100644
--- a/wxt_bootstrap.theme
+++ b/wxt_bootstrap.theme
@@ -124,6 +124,14 @@ function wxt_bootstrap_preprocess_block(&$variables) {
     }
   }
 
+  if (strpos($plugin_id, 'facet_block') !== FALSE) {
+    $theme_name = \Drupal::theme()->getActiveTheme()->getName();
+    $collapsible_facets = theme_get_setting('wxt_facets_collapsible', $theme_name);
+    $facet_panel_type = theme_get_setting('wxt_facets_panel_type', $theme_name);
+    $variables['collapsible_facets'] = $collapsible_facets;
+    $variables['facet_panel_type'] = $facet_panel_type;
+  }
+
   $moduleHandler = \Drupal::service('module_handler');
   if (!$moduleHandler->moduleExists('wxt_ext_blocks')) {
     $variables['label_display'] = TRUE;