3 files changed, 24 insertions, 0 deletions
diff --git a/demo/src/js/demo.js b/demo/src/js/demo.js
index 91649b6e..8db7910c 100644
--- a/demo/src/js/demo.js
+++ b/demo/src/js/demo.js
@@ -51,6 +51,9 @@ document.addEventListener('DOMContentLoaded', () => {
         keys: {
             google: 'AIzaSyDrNwtN3nLH_8rjCmu5Wq3ZCm4MNAVdc0c',
         },
+        ads: {
+            adTagUrl: 'http://go.aniview.com/api/adserver6/vast/?AV_PUBLISHERID=58c25bb0073ef448b1087ad6&AV_CHANNELID=5a0458dc28a06145e4519d21&AV_URL=127.0.0.1:3000&cb=1&AV_WIDTH=640&AV_HEIGHT=480',
+        },
     });
 
     // Expose for testing
diff --git a/demo/src/sass/bundles/demo.scss b/demo/src/sass/bundles/demo.scss
index 96438483..d75464fa 100644
--- a/demo/src/sass/bundles/demo.scss
+++ b/demo/src/sass/bundles/demo.scss
@@ -39,3 +39,6 @@
 
 // Plyr
 @import '../../../../src/sass/plyr';
+
+// Ads Plugin
+@import '../plugins/ads/ads';
diff --git a/demo/src/sass/plugins/ads/ads.scss b/demo/src/sass/plugins/ads/ads.scss
new file mode 100644
index 00000000..63330d25
--- /dev/null
+++ b/demo/src/sass/plugins/ads/ads.scss
@@ -0,0 +1,18 @@
+.plyr--ready {
+    position: relative;
+}
+
+.plyr__ads {
+    bottom: 0;
+    cursor: pointer;
+    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
+    left: 0;
+    position: absolute;
+    right: 0;
+    top: 0;
+    z-index: 10;
+
+    video {
+        left: 0;
+    }
+}