diff --git a/app/templates/search/catalogue/includes/filters-accorion.html b/app/templates/search/catalogue/includes/filters-accorion.html
new file mode 100644
index 0000000..796d78a
--- /dev/null
+++ b/app/templates/search/catalogue/includes/filters-accorion.html
@@ -0,0 +1,253 @@
+<div class="tna-container">
+  <div class="tna-column tna-column--width-1-4 tna-column--width-1-3-medium tna-column--full-small tna-column--full-tiny tna-!--margin-top-l">
+          <div class="tna-accordion" data-multiselectable="true" data-module="tna-accordion">
+            <div class="tna-accordion__item" data-isopen="true">
+              <h3 class="tna-accordion__heading tna-heading-s">
+                Search within results
+              </h3>
+              <div class="tna-accordion__body" id="-content-1">
+                <div class="search-filters__form-block">
+                  {{ tnaTextInput({
+                    'label': '',
+                    'headingLevel': 3,
+                    'headingSize': 's',
+                    'id': 'search-within',
+                    'name': 'search_within',
+                    'value': request.GET.get('search_within') or '',
+                    'attributes': {
+                      'form': 'search-form'
+                    }
+                  }) }}
+                  <div class="tna-button-group tna-!--margin-top-xs">
+                    {{ tnaButton({
+                      'text': 'Submit',
+                      'buttonElement': True,
+                      'buttonType': 'submit',
+                      'small': True,
+                      'attributes': {
+                        'form': 'search-form'
+                      }
+                    }) }}
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div class="tna-accordion__item" data-isopen="true">
+              <h3 class="tna-accordion__heading tna-heading-s">
+                Dates
+              </h3>
+              <div class="tna-accordion__body" id="-content-1">
+                <div class="tna-form__group">
+                  <fieldset class="tna-form__fieldset">
+                    <legend class="tna-form__legend">
+                      For example, 27 3 2007 or 2007
+                    </legend>
+                      {{ tnaDateInput({
+                        "label": "From:",
+                        "headingLevel": 4,
+                        "headingSize": "m",
+                        "id": "date",
+                        "name": "date"
+                      }) }}
+                    {{ tnaDateInput({
+                      "label": "To:",
+                      "headingLevel": 4,
+                      "headingSize": "m",
+                      "id": "date",
+                      "name": "date"
+                    }) }}
+                  </fieldset>
+                </div>
+              </div>
+            </div>
+            <!--collections-->
+            <div class="tna-accordion__item" data-isopen="true">
+              <h3 class="tna-accordion__heading tna-heading-s">
+                Collections
+              </h3>
+              <div class="tna-accordion__body" id="-content-1">
+                <div class="search-filters__form-block">
+              {{ tnaCheckboxes({
+                'label': '',
+                'headingLevel': 4,
+                'headingSize': "m",
+                'id': "categories",
+                'name': "categories",
+                'items': [
+                  {
+                    'text': 'Admiralty, Navy, Royal Marines, and Coastguard',
+                    'value': 'ADM'
+                  },
+                  {
+                    'text': 'Air Ministry and Royal Air Force records',
+                    'value': 'AIR'
+                  },
+                  {
+                    'text': 'Board of Trade and successors',
+                    'value': 'BT'
+                  },
+                  {
+                    'text': 'Chancery, the Wardrobe, Royal Household, Exchequer and various commissions',
+                    'value': 'C'
+                  },
+                  {
+                    'text': 'Colonial Office, Commonwealth and Foreign and Commonwealth Offices',
+                    'value': 'CO'
+                  },
+                  {
+                    'text': 'Exchequer, Office of First Fruits and Tenths, and the Court of Augmentations',
+                    'value':'E'
+                  },
+                  {
+                    'text': 'Foreign Office',
+                    'value': 'FO'
+                  },
+                  {
+                    'text': 'Home Office',
+                    'value': 'HO'
+                  },
+                  {
+                    'text': 'Prerogative Court of Canterbury',
+                    'value': 'PROB'
+                  },
+                  {
+                    'text': 'War Office, Armed Forces, Judge Advocate General, and related bodies',
+                    'value': 'WO'
+                  }
+                ],
+                'small': 'true'
+              }) }}
+              </div>
+              </div>
+            </div>
+
+
+            <div class="tna-accordion__item" data-isopen="false">
+              <h3 class="tna-accordion__heading tna-heading-s">
+                Levels
+              </h3>
+              <div class="tna-accordion__body" id="-content-1">
+                <div class="search-filters__form-block">
+              {{ tnaCheckboxes({
+                'label': '',
+                'headingLevel': 4,
+                'headingSize': "m",
+                'id': "categories",
+                'name': "categories",
+                'items': [
+                  {
+                    'text': ' Division (1,212)',
+                    'value': 'Division'
+                  },
+                  {
+                    'text': ' Item (16,804,232)',
+                    'value': 'Item'
+                  },
+                  {
+                    'text': ' Lettercode (433)',
+                    'value': 'Lettercode'
+                  },
+                  {
+                    'text': 'Piece (7,531,835)',
+                    'value': 'Piece'
+                  },
+                  {
+                    'text': 'Series (20,421)',
+                    'value': 'Series'
+                  },
+                  {
+                    'text': 'Sub-series (68,616)',
+                    'value':'Sub-series'
+                  },
+                  {
+                    'text': 'Sub-sub-series (58,540)',
+                    'value': 'ub-sub-series (58,540)'
+                  },
+                ],
+                'small': 'true'
+              }) }}
+              </div>
+              </div>
+            </div>
+
+            <div class="tna-accordion__item" data-isopen="false">
+              <h3 class="tna-accordion__heading tna-heading-s">
+                Closure status
+              </h3>
+              <div class="tna-accordion__body" id="-content-1">
+                <div class="search-filters__form-block">
+              {{ tnaCheckboxes({
+                'label': '',
+                'headingLevel': 4,
+                'headingSize': "m",
+                'id': "categories",
+                'name': "categories",
+                'items': [
+                  {
+                    'text': ' Closed Or Retained Document, Closed Description (25,386)',
+                    'value': 'Closed'
+                  },
+                  {
+                    'text': ' Closed Or Retained Document, Open Description (376,449)',
+                    'value': 'Open description'
+                  },
+                  {
+                    'text': 'Open Document, Open Description (23,919,391)',
+                    'value': 'Open'
+                  },
+                ],
+                'small': 'true'
+              }) }}
+              </div>
+              </div>
+            </div>
+            
+            
+            <!--opening dates-->
+            <div class="tna-accordion__item" data-isopen="false">
+              <h3 class="tna-accordion__heading tna-heading-s">
+                Record opening dates
+              </h3>
+              <div class="tna-accordion__body" id="-content-1">
+                <div class="tna-form__group">
+                  <fieldset class="tna-form__fieldset">
+                    <legend class="tna-form__legend">
+                      For example, 27 3 2007 or 2007
+                    </legend>
+                      {{ tnaDateInput({
+                        "label": "From:",
+                        "headingLevel": 4,
+                        "headingSize": "m",
+                        "id": "date",
+                        "name": "date"
+                      }) }}
+                    {{ tnaDateInput({
+                      "label": "To:",
+                      "headingLevel": 4,
+                      "headingSize": "m",
+                      "id": "date",
+                      "name": "date"
+                    }) }}
+                  </fieldset>
+                </div>
+              
+              </div>
+                  <div class="tna-column tna-column--width-1-3">
+                    <div class="tna-button-group tna-!--margin-top-xs tna-!--margin-bottom-m">
+                      {{ tnaButton({
+                        'text': 'Update',
+                        'buttonElement': True,
+                        'buttonType': 'submit',
+                        'small': True,
+                        'attributes': {
+                          'form': 'search-form'
+                        }
+                      }) }}
+                    </div>
+                  </div>
+            </div> 
+          </div>
+        </div>
+
+
+        
\ No newline at end of file
diff --git a/app/templates/search/catalogue/index.html b/app/templates/search/catalogue/index.html
index adfe04e..acc490b 100644
--- a/app/templates/search/catalogue/index.html
+++ b/app/templates/search/catalogue/index.html
@@ -6,8 +6,16 @@
 {% from 'components/search-field/macro.html' import tnaSearchField %}
 {% from 'components/select/macro.html' import tnaSelect %}
 {% from 'components/text-input/macro.html' import tnaTextInput %}
+{% from "components/date-input/macro.html" import tnaDateInput %}
+{% from "components/checkboxes/macro.html" import tnaCheckboxes %}
+{% from "components/secondary-navigation/macro.html" import tnaSecondaryNavigation %}
+
+
+
+
 
 {%- set pageTitle = 'Catalogue search results' -%}
+{%- set themeAccent = 'black' -%}
 
 {% block stylesheets %}
 {{ super() }}
@@ -15,8 +23,14 @@
 {% endblock %}
 
 {% block content %}
+
+
 <div class="tna-section tna-background-accent tna-!--no-padding-bottom">
+ 
   <div class="tna-container">
+
+    
+
     <form id="search-form" class="tna-column tna-column--full">
       {{ tnaSearchField({
         'label': pageTitle,
@@ -34,49 +48,39 @@
           'small': True
         }) }}
       </div>
-      <ul class="tna-ul">
-        <li>
-          <a href="#">Records at The National Archives (24,521,292)</a>
-        </li>
-        <li>
-          <a href="#">Online records at The National Archives (9,041,961)</a>
-        </li>
-        <li>
-          <a href="#">Records at other UK archives (10,758,426)</a>
-        </li>
-      </ul>
+
+      <!--secondary navigation-->
+      {{ tnaSecondaryNavigation({
+        'title': "",
+        'headingLevel': 2,
+        'items': [
+          {
+            "name": "Records at The National Archives (24,521,292)",
+            "href": "#",
+            "current":"true"
+          },
+          {
+            "name": "Online records at The National Archives (9,041,961)",
+            "href": "#"
+            
+          },
+          {
+            "name": "Records at other UK archives (10,758,426)",
+            "href": "#"
+          },
+        ],
+        "noUnindentation": "true"
+      }) }}
+      <!--end secondary navigation-->
     </form>
   </div>
 </div>
-<div class="tna-container">
-  <div class="tna-column tna-column--width-1-4 tna-column--width-1-3-medium tna-column--full-small tna-column--full-tiny tna-!--margin-top-l">
-    <h2 class="tna-heading-m">Filters</h2>
-    {{ tnaTextInput({
-      'label': 'Search within results',
-      'headingLevel': 3,
-      'headingSize': 's',
-      'id': 'search-within',
-      'name': 'search_within',
-      'value': request.GET.get('search_within') or '',
-      'attributes': {
-        'form': 'search-form'
-      }
-    }) }}
-    <div class="tna-button-group tna-!--margin-top-xs">
-      {{ tnaButton({
-        'text': 'Submit',
-        'buttonElement': True,
-        'buttonType': 'submit',
-        'small': True,
-        'attributes': {
-          'form': 'search-form'
-        }
-      }) }}
-    </div>
-  </div>
+    <!--accordion element-->
+    {% include "search/catalogue/includes/filters-accorion.html" %}
+    <!--end accordion element-->
   <div class="tna-column tna-column--width-3-4 tna-column--width-2-3-medium tna-column--full-small tna-column--full-tiny tna-!--margin-top-l">
     <div class="tna-container tna-container--nested">
-      <div class="tna-column tna-column--flex-1 tna-column--full-tiny">SHOWING...</div>
+      <div class="tna-column tna-column--flex-1 tna-column--full-tiny">Showing 1-20 (of 10,000) results</div>
       <div class="tna-column tna-column--full-tiny">
         {{ tnaSelect({
           'label': 'Sort by',
@@ -182,16 +186,16 @@ <h2 class="tna-visually-hidden">Results</h2>
       {% for result in range(0, 12) %}
       <article class="search-result-list-item tna-!--margin-top-s">
         <h3 class="tna-heading-m">
-          <a href="#">Result title</a>
+          <a href="#">Court for Divorce and Matrimonial Causes, later Supreme Court of Judicature: Divorce </a>
         </h3>
-        <p>Stuff</p>
+        <p>Files of papers arising from petitions for divorce,... legitimacy, applications for protection of a wife's earnings, etc, in the Court for Divorce... and Matrimonial Causes and Probate, Divorce and Admiralty Division of the High Court... Between 1858 and 1927 almost all divorce files survive.</p>
         <dl class="tna-dl tna-dl--plain tna-!--margin-top-s">
-          <dt>Alpha</dt>
-          <dd>Lorem ipsum</dd>
-          <dt>Beta</dt>
-          <dd>Lorem ipsum</dd>
-          <dt>Gamma</dt>
-          <dd>Lorem ipsum</dd>
+          <dt>Held by:</dt>
+          <dd>The National Archives, Kew</dd>
+          <dt>Date:</dt>
+          <dd>1935</dd>
+          <dt>Reference:</dt>
+          <dd>J 77/34174284</dd>
         </dl>
       </article>
       <hr class="tna-!--margin-top-s">
diff --git a/package-lock.json b/package-lock.json
index b60f6ab..e416e86 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -5,14 +5,14 @@
   "packages": {
     "": {
       "dependencies": {
-        "@nationalarchives/frontend": "0.3.0"
+        "@nationalarchives/frontend": "^0.8.1"
       },
       "devDependencies": {
         "@babel/core": "^7.22.11",
         "@babel/preset-env": "^7.22.10",
         "babel-loader": "^9.1.3",
         "eslint": "^8.47.0",
-        "prettier": "^3.0.2",
+        "prettier": "^3.4.2",
         "sass": "^1.69.4",
         "stylelint": "^16.1.0",
         "stylelint-config-standard-scss": "^13.0.0",
@@ -1827,10 +1827,9 @@
       }
     },
     "node_modules/@nationalarchives/frontend": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/@nationalarchives/frontend/-/frontend-0.3.0.tgz",
-      "integrity": "sha512-9NcS/GccZD1AzjxzrRfWwkqgE29V8fh7FHaZOhol2OGUuus/bRjG0ExjfaEZoJjkiEdZiteGw6os0RtdpLJOag==",
-      "license": "MIT"
+      "version": "0.8.1",
+      "resolved": "https://registry.npmjs.org/@nationalarchives/frontend/-/frontend-0.8.1.tgz",
+      "integrity": "sha512-hiGVOrZQpNxJZkawHN2oHzFgdxvOYn0UjiG8BcaH9OQBVXJBv9WMjLtuiH3D6RBImQbUPwyJiRf6wnexge0xvA=="
     },
     "node_modules/@nodelib/fs.scandir": {
       "version": "2.1.5",
@@ -1907,48 +1906,6 @@
         "@parcel/watcher-win32-x64": "2.5.0"
       }
     },
-    "node_modules/@parcel/watcher-android-arm64": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-android-arm64/-/watcher-android-arm64-2.5.0.tgz",
-      "integrity": "sha512-qlX4eS28bUcQCdribHkg/herLe+0A9RyYC+mm2PXpncit8z5b3nSqGVzMNR3CmtAOgRutiZ02eIJJgP/b1iEFQ==",
-      "cpu": [
-        "arm64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "android"
-      ],
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-darwin-arm64": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-darwin-arm64/-/watcher-darwin-arm64-2.5.0.tgz",
-      "integrity": "sha512-hyZ3TANnzGfLpRA2s/4U1kbw2ZI4qGxaRJbBH2DCSREFfubMswheh8TeiC1sGZ3z2jUf3s37P0BBlrD3sjVTUw==",
-      "cpu": [
-        "arm64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "darwin"
-      ],
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
     "node_modules/@parcel/watcher-darwin-x64": {
       "version": "2.5.0",
       "resolved": "https://registry.npmjs.org/@parcel/watcher-darwin-x64/-/watcher-darwin-x64-2.5.0.tgz",
@@ -1970,216 +1927,6 @@
         "url": "https://opencollective.com/parcel"
       }
     },
-    "node_modules/@parcel/watcher-freebsd-x64": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-freebsd-x64/-/watcher-freebsd-x64-2.5.0.tgz",
-      "integrity": "sha512-syvfhZzyM8kErg3VF0xpV8dixJ+RzbUaaGaeb7uDuz0D3FK97/mZ5AJQ3XNnDsXX7KkFNtyQyFrXZzQIcN49Tw==",
-      "cpu": [
-        "x64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "freebsd"
-      ],
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-linux-arm-glibc": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm-glibc/-/watcher-linux-arm-glibc-2.5.0.tgz",
-      "integrity": "sha512-0VQY1K35DQET3dVYWpOaPFecqOT9dbuCfzjxoQyif1Wc574t3kOSkKevULddcR9znz1TcklCE7Ht6NIxjvTqLA==",
-      "cpu": [
-        "arm"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-linux-arm-musl": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm-musl/-/watcher-linux-arm-musl-2.5.0.tgz",
-      "integrity": "sha512-6uHywSIzz8+vi2lAzFeltnYbdHsDm3iIB57d4g5oaB9vKwjb6N6dRIgZMujw4nm5r6v9/BQH0noq6DzHrqr2pA==",
-      "cpu": [
-        "arm"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-linux-arm64-glibc": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm64-glibc/-/watcher-linux-arm64-glibc-2.5.0.tgz",
-      "integrity": "sha512-BfNjXwZKxBy4WibDb/LDCriWSKLz+jJRL3cM/DllnHH5QUyoiUNEp3GmL80ZqxeumoADfCCP19+qiYiC8gUBjA==",
-      "cpu": [
-        "arm64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-linux-arm64-musl": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm64-musl/-/watcher-linux-arm64-musl-2.5.0.tgz",
-      "integrity": "sha512-S1qARKOphxfiBEkwLUbHjCY9BWPdWnW9j7f7Hb2jPplu8UZ3nes7zpPOW9bkLbHRvWM0WDTsjdOTUgW0xLBN1Q==",
-      "cpu": [
-        "arm64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-linux-x64-glibc": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-x64-glibc/-/watcher-linux-x64-glibc-2.5.0.tgz",
-      "integrity": "sha512-d9AOkusyXARkFD66S6zlGXyzx5RvY+chTP9Jp0ypSTC9d4lzyRs9ovGf/80VCxjKddcUvnsGwCHWuF2EoPgWjw==",
-      "cpu": [
-        "x64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-linux-x64-musl": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-x64-musl/-/watcher-linux-x64-musl-2.5.0.tgz",
-      "integrity": "sha512-iqOC+GoTDoFyk/VYSFHwjHhYrk8bljW6zOhPuhi5t9ulqiYq1togGJB5e3PwYVFFfeVgc6pbz3JdQyDoBszVaA==",
-      "cpu": [
-        "x64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-win32-arm64": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-win32-arm64/-/watcher-win32-arm64-2.5.0.tgz",
-      "integrity": "sha512-twtft1d+JRNkM5YbmexfcH/N4znDtjgysFaV9zvZmmJezQsKpkfLYJ+JFV3uygugK6AtIM2oADPkB2AdhBrNig==",
-      "cpu": [
-        "arm64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "win32"
-      ],
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-win32-ia32": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-win32-ia32/-/watcher-win32-ia32-2.5.0.tgz",
-      "integrity": "sha512-+rgpsNRKwo8A53elqbbHXdOMtY/tAtTzManTWShB5Kk54N8Q9mzNWV7tV+IbGueCbcj826MfWGU3mprWtuf1TA==",
-      "cpu": [
-        "ia32"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "win32"
-      ],
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
-    "node_modules/@parcel/watcher-win32-x64": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/@parcel/watcher-win32-x64/-/watcher-win32-x64-2.5.0.tgz",
-      "integrity": "sha512-lPrxve92zEHdgeff3aiu4gDOIt4u7sJYha6wbdEZDCDUhtjTsOMiaJzG5lMY4GkWH8p0fMmO2Ppq5G5XXG+DQw==",
-      "cpu": [
-        "x64"
-      ],
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "win32"
-      ],
-      "engines": {
-        "node": ">= 10.0.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/parcel"
-      }
-    },
     "node_modules/@types/eslint": {
       "version": "9.6.1",
       "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-9.6.1.tgz",
diff --git a/package.json b/package.json
index 3ff5c5c..c0588ce 100644
--- a/package.json
+++ b/package.json
@@ -11,14 +11,14 @@
     "test:lint": "prettier --check . && stylelint 'src/styles/**/*.scss' && eslint 'src/scripts/**/*.js'"
   },
   "dependencies": {
-    "@nationalarchives/frontend": "0.3.0"
+    "@nationalarchives/frontend": "^0.8.1"
   },
   "devDependencies": {
     "@babel/core": "^7.22.11",
     "@babel/preset-env": "^7.22.10",
     "babel-loader": "^9.1.3",
     "eslint": "^8.47.0",
-    "prettier": "^3.0.2",
+    "prettier": "^3.4.2",
     "sass": "^1.69.4",
     "stylelint": "^16.1.0",
     "stylelint-config-standard-scss": "^13.0.0",
diff --git a/poetry.lock b/poetry.lock
index 0890c7e..6290f6f 100644
--- a/poetry.lock
+++ b/poetry.lock
@@ -175,13 +175,13 @@ files = [
 
 [[package]]
 name = "django"
-version = "5.1.4"
+version = "5.1.5"
 description = "A high-level Python web framework that encourages rapid development and clean, pragmatic design."
 optional = false
 python-versions = ">=3.10"
 files = [
-    {file = "Django-5.1.4-py3-none-any.whl", hash = "sha256:236e023f021f5ce7dee5779de7b286565fdea5f4ab86bae5338e3f7b69896cf0"},
-    {file = "Django-5.1.4.tar.gz", hash = "sha256:de450c09e91879fa5a307f696e57c851955c910a438a35e6b4c895e86bedc82a"},
+    {file = "Django-5.1.5-py3-none-any.whl", hash = "sha256:c46eb936111fffe6ec4bc9930035524a8be98ec2f74d8a0ff351226a3e52f459"},
+    {file = "Django-5.1.5.tar.gz", hash = "sha256:19bbca786df50b9eca23cee79d495facf55c8f5c54c529d9bf1fe7b5ea086af3"},
 ]
 
 [package.dependencies]
@@ -768,13 +768,13 @@ fixture = ["fixtures"]
 
 [[package]]
 name = "responses"
-version = "0.25.3"
+version = "0.25.6"
 description = "A utility library for mocking out the `requests` Python library."
 optional = false
 python-versions = ">=3.8"
 files = [
-    {file = "responses-0.25.3-py3-none-any.whl", hash = "sha256:521efcbc82081ab8daa588e08f7e8a64ce79b91c39f6e62199b19159bea7dbcb"},
-    {file = "responses-0.25.3.tar.gz", hash = "sha256:617b9247abd9ae28313d57a75880422d55ec63c29d33d629697590a034358dba"},
+    {file = "responses-0.25.6-py3-none-any.whl", hash = "sha256:9cac8f21e1193bb150ec557875377e41ed56248aed94e4567ed644db564bacf1"},
+    {file = "responses-0.25.6.tar.gz", hash = "sha256:eae7ce61a9603004e76c05691e7c389e59652d91e94b419623c12bbfb8e331d8"},
 ]
 
 [package.dependencies]
@@ -857,13 +857,13 @@ doc = ["sphinx"]
 
 [[package]]
 name = "tna-frontend-jinja"
-version = "0.3.0"
+version = "0.8.1"
 description = "TNA Frontend Jinja templates"
 optional = false
 python-versions = ">=3.8"
 files = [
-    {file = "tna_frontend_jinja-0.3.0-py3-none-any.whl", hash = "sha256:f2d3accff4c2afcc3a03c5702157ea631c519cd968ace9750184c1ecbc387785"},
-    {file = "tna_frontend_jinja-0.3.0.tar.gz", hash = "sha256:5ab42dffa8ef2462aac8024422993c914d37e417b4506ccd6cff10a07f8965cd"},
+    {file = "tna_frontend_jinja-0.8.1-py3-none-any.whl", hash = "sha256:567cf3e8b025a0d0def8ad53d47c78554f08eb97a04e61f3fa4a7c95b57498e2"},
+    {file = "tna_frontend_jinja-0.8.1.tar.gz", hash = "sha256:dc89fc86f44b98ba64fb464dd19a358acc60246c93341011dfa69a7ab1256f51"},
 ]
 
 [package.dependencies]
@@ -871,13 +871,13 @@ flask = ">=2"
 
 [[package]]
 name = "tzdata"
-version = "2024.2"
+version = "2025.1"
 description = "Provider of IANA time zone data"
 optional = false
 python-versions = ">=2"
 files = [
-    {file = "tzdata-2024.2-py2.py3-none-any.whl", hash = "sha256:a48093786cdcde33cad18c2555e8532f34422074448fbc874186f0abd79565cd"},
-    {file = "tzdata-2024.2.tar.gz", hash = "sha256:7d85cc416e9382e69095b7bdf4afd9e3880418a2413feec7069d533d6b4e31cc"},
+    {file = "tzdata-2025.1-py2.py3-none-any.whl", hash = "sha256:7e127113816800496f027041c570f50bcd464a020098a3b6b199517772303639"},
+    {file = "tzdata-2025.1.tar.gz", hash = "sha256:24894909e88cdb28bd1636c6887801df64cb485bd593f2fd83ef29075a81d694"},
 ]
 
 [[package]]
@@ -931,4 +931,4 @@ brotli = ["brotli"]
 [metadata]
 lock-version = "2.0"
 python-versions = "^3.12"
-content-hash = "5ac66217c0b9538cb688345bbb71cacd3aba8b164da597e1ed282ab3d7cff275"
+content-hash = "4fb7afb2e24369cbdb3e49a3d06ec41c29d15f661441341ad166eb1e9aeb0c55"
diff --git a/pyproject.toml b/pyproject.toml
index 54424b3..0fef6ec 100644
--- a/pyproject.toml
+++ b/pyproject.toml
@@ -10,7 +10,7 @@ package-mode = false
 [tool.poetry.dependencies]
 python = "^3.12"
 requests = "^2.31.0"
-tna-frontend-jinja = "0.3.0"
+tna-frontend-jinja = "0.8.1"
 django = "^5.0.7"
 psycopg2-binary = "^2.9.9"
 django-csp = "^3.8"
diff --git a/src/styles/main.scss b/src/styles/main.scss
index f1a6f47..d64bd26 100644
--- a/src/styles/main.scss
+++ b/src/styles/main.scss
@@ -1 +1,25 @@
 @use "@nationalarchives/frontend/nationalarchives/all";
+
+.tna-secondary-navigation__items {
+  gap: 20px;
+}
+
+.tna-form__legend {
+  margin-bottom: 0;
+}
+
+.tna-form__heading--m {
+  font-size: 1rem;
+  font-weight: 100;
+}
+
+.search-filters__search {
+  padding-top: 0.3em;
+  padding-bottom: 0.3em;
+}
+
+.search-filters__search,
+.update-filters {
+  margin-top: 1em;
+  margin-bottom: 1em;
+}