diff --git a/src/patterns/04-components/facts-and-figures/_facts-and-figures.scss b/src/patterns/04-components/facts-and-figures/_facts-and-figures.scss
index d1fe2a6767f786a1ce9deb2d9dd5e667a188bce5..cbae0113d3f5f4313e8668726c45dda47eefe91e 100644
--- a/src/patterns/04-components/facts-and-figures/_facts-and-figures.scss
+++ b/src/patterns/04-components/facts-and-figures/_facts-and-figures.scss
@@ -870,6 +870,11 @@ are the same height. */
       }
 
       .flickity-page-dots {
+        .uw-hide-ff-nav & {
+          @media(min-width: $screen-lg) {
+            visibility: hidden;
+          }
+        }
         bottom: -3.125rem;
 
         .dot {
@@ -906,6 +911,11 @@ are the same height. */
   width:100%;
   justify-content: center;
   margin-top: var(--size-8);
+  .uw-hide-ff-nav & {
+    @media(min-width: $screen-lg) {
+      visibility: hidden;
+    }
+  }
   button {
     background: var(--gray-2);
     color: var(--uw-black);
diff --git a/src/patterns/04-components/facts-and-figures/facts-and-figures.twig b/src/patterns/04-components/facts-and-figures/facts-and-figures.twig
index c123253d794ea25cb72458b2ac5087fcba05a78e..bd8434a0c69d07ffa4a6c9501ac503e27ffbfe26 100644
--- a/src/patterns/04-components/facts-and-figures/facts-and-figures.twig
+++ b/src/patterns/04-components/facts-and-figures/facts-and-figures.twig
@@ -1,14 +1,11 @@
-<div id="uw-ff-{{ ffs.id }}" class="uw-ff {% if ffs.show %}uw-ff--with-bubbles uw-ff--with-bubbles__{{ ffs.bg_colour}}{% else%}uw-ff__{{ ffs.bg_colour}}{% endif %}" data-carousel="{{ ffs.num_per_carousel ? 'yes' :'no' }}" data-num-per-carousel="{{ ffs.num_per_carousel }}" data-id="{{ ffs.id }}">
+<div id="uw-ff-{{ ffs.id }}" class="uw-ff {% if ffs.show %}uw-ff--with-bubbles uw-ff--with-bubbles__{{ ffs.bg_colour}}{% else%}uw-ff__{{ ffs.bg_colour}}{% endif %} {% if ffs.num_per_carousel == ffs.details|length %} uw-hide-ff-nav{% endif %} " data-carousel="{{ ffs.num_per_carousel ? 'yes' :'no' }}" data-num-per-carousel="{{ ffs.num_per_carousel }}" data-id="{{ ffs.id }}">
   <div class="uw-ff--wrapper uw-ff--wrapper__text-{{ ffs.text_align }} {{ ffs.num_per_carousel ? 'uw-ff--carousel' : 'uw-ff--no-carousel' }} {{ ffs.theme }}">
     {% if ffs.num_per_carousel >= 1%}
-
       {% embed '@layouts/carousel/carousel.twig' %}
         {% block content %}
           {% for details in ffs.details %}
             <div class="uw-ff--fact">
-
               {% for detail in details %}
-
                 {% if detail.type == 'infographic' %}
                   {% include '@components/facts-and-figures/_infographics.twig' with {
                     'infographics': detail,
@@ -57,12 +54,11 @@
         {% endfor %}
         </div>
       {% endfor %}
-
     {% endif %}
   </div>
 
 {% if ffs.num_per_carousel %}
-  <div class="uw-button--wrap">
+    <div class="uw-button--wrap">
     <button tabindex="0" class="uw-button--previous"> < Prev</button>
     <button tabindex="0" class="uw-button--next">Next ></button>
   </div>