diff --git a/d2l-offscreen-shared-styles.html b/d2l-offscreen-shared-styles.html
index 43965c6..2551c21 100644
--- a/d2l-offscreen-shared-styles.html
+++ b/d2l-offscreen-shared-styles.html
@@ -12,7 +12,7 @@
 					left: -10000px;
 				};
 			}
-			:host-context([dir="rtl"]) {
+			:host(:dir(rtl)) {
 				--d2l-offscreen: {
 					position: absolute !important;
 					overflow: hidden;
diff --git a/demo/index.html b/demo/index.html
index 0cf7ad8..600ee0d 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -11,7 +11,7 @@
 	<d2l-demo-template title="d2l-offscreen">
 
 		<div slot="d2l-demo-fixture">
-			Some offscreen content: <d2l-offscreen>this should be offscreen</d2l-offscreen>
+			Some offscreen content: <d2l-offscreen>this should be offscreen</d2l-offscreen><d2l-offscreen>this should be offscreen</d2l-offscreen>
 		</div>
 
 	</d2l-demo-template>