diff --git a/example/src/components/ExampleWrapper/ExampleWrapper.jsx b/example/src/components/ExampleWrapper/ExampleWrapper.jsx
index eecf496..9f16f6b 100644
--- a/example/src/components/ExampleWrapper/ExampleWrapper.jsx
+++ b/example/src/components/ExampleWrapper/ExampleWrapper.jsx
@@ -16,17 +16,17 @@ const ExampleWrapper = ({
   pageHeading,
   timeline
 }) => (
-  <div className="overflow-y-scroll">
+  <div>
     <header className="pt-5">
       <Container className="p-0">
-        <h2 className="h1 mb-4 font-weight-bolder">{pageHeading}</h2>
+        <h2 className="h1 mb-4 fw-bolder">{pageHeading}</h2>
         <p>{description}</p>
       </Container>
     </header>
     {children}
     <div className="timeline-example timeline-example--one mb-5 mt-5 bg-light">
       <Container className="px-0 py-2">
-        <span className="text-uppercase small fw-bold">
+        <span className="text-uppercase small fw-bolder">
           Interactive Example
         </span>
       </Container>
diff --git a/example/src/components/Layout/Layout.jsx b/example/src/components/Layout/Layout.jsx
index 5abe398..9d10b77 100644
--- a/example/src/components/Layout/Layout.jsx
+++ b/example/src/components/Layout/Layout.jsx
@@ -34,21 +34,25 @@ const routes = [
 
 const Layout = () => (
   <>
-    <Navbar bg="light">
+    <Navbar expand="lg" bg="light">
       <Container>
-        <Navbar.Brand href="#">@edsc/timeline Demo</Navbar.Brand>
-        <Navbar.Collapse id="basic-navbar-nav" className="overflow-x-auto">
+        <Navbar.Brand href="/">@edsc/timeline Demo</Navbar.Brand>
+        <Navbar.Toggle aria-controls="navbar-nav" />
+        <Navbar.Collapse id="navbar-nav">
           <Nav className="me-auto">
             <LinkContainer to="/">
               <Nav.Link>Demo</Nav.Link>
             </LinkContainer>
-            <NavDropdown title="Additional Demos">
-              {
-                routes.map(({ title, to }) => (
-                  <LinkContainer key={`link__${to}`} to={to}>
-                    <Nav.Link>{title}</Nav.Link>
-                  </LinkContainer>
-                ))
+            <NavDropdown  id="additional-demos-dropdown" title="Additional Demos">
+            {
+                routes.map(({ title, to }) => {
+                  console.log('🚀 ~ routes.map ~ { title, to }:', { title, to })
+                  return (
+                    <NavDropdown.Item key={`link__${to}`} to={to} as={LinkContainer}>
+                      <Nav.Link>{title}</Nav.Link>
+                    </NavDropdown.Item>
+                  )
+                })
               }
             </NavDropdown>
           </Nav>
diff --git a/example/src/components/Output/Output.jsx b/example/src/components/Output/Output.jsx
index 2bd81e8..3403a42 100644
--- a/example/src/components/Output/Output.jsx
+++ b/example/src/components/Output/Output.jsx
@@ -22,7 +22,7 @@ const OutputItemEntry = ({
   return (
     // eslint-disable-next-line react/jsx-props-no-spreading
     <div data-testid="center" className={classNames} {...props}>
-      <span className="output-item-entry__heading pl-3 font-weight-bold">
+      <span className="output-item-entry__heading pl-3 fw-bold">
         {heading}
       </span>
       <span className="text-monospace pr-3">{value}</span>
diff --git a/package-lock.json b/package-lock.json
index 90d233c..2e13d20 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -42,7 +42,7 @@
         "babel-plugin-transform-class-properties": "^6.24.1",
         "babel-plugin-transform-runtime": "^6.23.0",
         "babel-preset-env": "^1.7.0",
-        "bootstrap": "^4.6.2",
+        "bootstrap": "^5.3.3",
         "css-loader": "^3.6.0",
         "cypress": "^10.11.0",
         "eslint": "^8.14.0",
@@ -6258,9 +6258,9 @@
       "dev": true
     },
     "node_modules/bootstrap": {
-      "version": "4.6.2",
-      "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.6.2.tgz",
-      "integrity": "sha512-51Bbp/Uxr9aTuy6ca/8FbFloBUJZLHwnhTcnjIeRn2suQWsWzcuJhGjKDB5eppVte/8oCdOL3VuwxvZDUggwGQ==",
+      "version": "5.3.3",
+      "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.3.3.tgz",
+      "integrity": "sha512-8HLCdWgyoMguSO9o+aH+iuZ+aht+mzW0u3HIMzVu7Srrpv7EBBxTnrFlSCskwdY1+EOFQSm7uMJhNQHkdPcmjg==",
       "dev": true,
       "funding": [
         {
@@ -6274,8 +6274,7 @@
       ],
       "license": "MIT",
       "peerDependencies": {
-        "jquery": "1.9.1 - 3",
-        "popper.js": "^1.16.1"
+        "@popperjs/core": "^2.11.8"
       }
     },
     "node_modules/brace-expansion": {
@@ -13518,14 +13517,6 @@
         "@sideway/pinpoint": "^2.0.0"
       }
     },
-    "node_modules/jquery": {
-      "version": "3.7.1",
-      "resolved": "https://registry.npmjs.org/jquery/-/jquery-3.7.1.tgz",
-      "integrity": "sha512-m4avr8yL8kmFN8psrbFFFmB/If14iN5o9nw/NgnnM+kybDJpRsAynV2BsfpTYrTRysYUdADVD7CkUUizgkpLfg==",
-      "dev": true,
-      "license": "MIT",
-      "peer": true
-    },
     "node_modules/js-base64": {
       "version": "2.6.4",
       "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.6.4.tgz",
@@ -15789,19 +15780,6 @@
         "node": ">=4"
       }
     },
-    "node_modules/popper.js": {
-      "version": "1.16.1",
-      "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1.tgz",
-      "integrity": "sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ==",
-      "deprecated": "You can find the new Popper v2 at @popperjs/core, this package is dedicated to the legacy v1",
-      "dev": true,
-      "license": "MIT",
-      "peer": true,
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/popperjs"
-      }
-    },
     "node_modules/posix-character-classes": {
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/posix-character-classes/-/posix-character-classes-0.1.1.tgz",
@@ -25634,9 +25612,9 @@
       "dev": true
     },
     "bootstrap": {
-      "version": "4.6.2",
-      "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.6.2.tgz",
-      "integrity": "sha512-51Bbp/Uxr9aTuy6ca/8FbFloBUJZLHwnhTcnjIeRn2suQWsWzcuJhGjKDB5eppVte/8oCdOL3VuwxvZDUggwGQ==",
+      "version": "5.3.3",
+      "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.3.3.tgz",
+      "integrity": "sha512-8HLCdWgyoMguSO9o+aH+iuZ+aht+mzW0u3HIMzVu7Srrpv7EBBxTnrFlSCskwdY1+EOFQSm7uMJhNQHkdPcmjg==",
       "dev": true,
       "requires": {}
     },
@@ -31109,13 +31087,6 @@
         "@sideway/pinpoint": "^2.0.0"
       }
     },
-    "jquery": {
-      "version": "3.7.1",
-      "resolved": "https://registry.npmjs.org/jquery/-/jquery-3.7.1.tgz",
-      "integrity": "sha512-m4avr8yL8kmFN8psrbFFFmB/If14iN5o9nw/NgnnM+kybDJpRsAynV2BsfpTYrTRysYUdADVD7CkUUizgkpLfg==",
-      "dev": true,
-      "peer": true
-    },
     "js-base64": {
       "version": "2.6.4",
       "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.6.4.tgz",
@@ -32864,13 +32835,6 @@
         }
       }
     },
-    "popper.js": {
-      "version": "1.16.1",
-      "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1.tgz",
-      "integrity": "sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ==",
-      "dev": true,
-      "peer": true
-    },
     "posix-character-classes": {
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/posix-character-classes/-/posix-character-classes-0.1.1.tgz",
diff --git a/package.json b/package.json
index 4b94721..fe5b7d4 100644
--- a/package.json
+++ b/package.json
@@ -74,7 +74,7 @@
     "babel-plugin-transform-class-properties": "^6.24.1",
     "babel-plugin-transform-runtime": "^6.23.0",
     "babel-preset-env": "^1.7.0",
-    "bootstrap": "^4.6.2",
+    "bootstrap": "^5.3.3",
     "css-loader": "^3.6.0",
     "cypress": "^10.11.0",
     "eslint": "^8.14.0",