diff --git a/d2l-navigation-button.js b/d2l-navigation-button.js
index 6b72310d..4282946b 100644
--- a/d2l-navigation-button.js
+++ b/d2l-navigation-button.js
@@ -2,7 +2,7 @@ import 'd2l-button/d2l-button-behavior.js';
 import 'd2l-polymer-behaviors/d2l-focusable-behavior.js';
 import 'd2l-polymer-behaviors/d2l-id.js';
 import { highlightStyles } from './d2l-navigation-highlight-styles.js';
-import 'd2l-offscreen/d2l-offscreen-shared-styles.js';
+import '@brightspace-ui/core/components/offscreen/offscreen.js';
 
 import { PolymerElement, html } from '@polymer/polymer/polymer-element.js';
 import { mixinBehaviors } from '@polymer/polymer/lib/legacy/class.js';
@@ -36,7 +36,7 @@ class D2LNavigationButton extends mixinBehaviors([D2L.PolymerBehaviors.Button.Be
 	static get template() {
 		const template = html`
 				${highlightStyles}
-				<style is="custom-style" include="d2l-offscreen-shared-styles">
+				<style is="custom-style">
 
 					:host {
 						display: inline-block;
@@ -82,14 +82,6 @@ class D2LNavigationButton extends mixinBehaviors([D2L.PolymerBehaviors.Button.Be
 						@apply --d2l-navigation-highlight-border;
 					}
 
-					.d2l-offscreen-description {
-						@apply --d2l-offscreen;
-					}
-
-					:host(:dir(rtl)) .d2l-offscreen-description {
-						@apply --d2l-offscreen-rtl;
-					}
-
 					:host([disabled]) button {
 						@apply --d2l-navigation-highlight-disabled;
 					}
@@ -115,7 +107,7 @@ class D2LNavigationButton extends mixinBehaviors([D2L.PolymerBehaviors.Button.Be
 			<span class$="[[_getTopBorderClass()]]"></span>
 			<slot></slot>
 			</button>
-			<span id="[[_ariaDescriptionId]]" class="d2l-offscreen-description">[[ariaDescribedbyText]]</span>
+			<d2l-offscreen id="[[_ariaDescriptionId]]">[[ariaDescribedbyText]]</d2l-offscreen>
 		`;
 		template.setAttribute('strip-whitespace', '');
 		return template;
diff --git a/package.json b/package.json
index d732cc18..a23b3fca 100644
--- a/package.json
+++ b/package.json
@@ -61,7 +61,6 @@
     "d2l-button": "github:BrightspaceUI/button#semver:^5",
     "d2l-link": "github:BrightspaceUI/link#semver:^5",
     "d2l-localize-behavior": "github:BrightspaceUI/localize-behavior#semver:^2",
-    "d2l-offscreen": "github:BrightspaceUI/offscreen#semver:^4",
     "d2l-polymer-behaviors": "github:Brightspace/d2l-polymer-behaviors-ui#semver:^2",
     "d2l-typography": "github:BrightspaceUI/typography#semver:^7",
     "fastdom": "^1",