4 files changed, 22 insertions, 40 deletions
diff --git a/docs/src/less/components/base.less b/docs/src/less/components/base.less
index 05b5fb52..c584b57e 100644
--- a/docs/src/less/components/base.less
+++ b/docs/src/less/components/base.less
@@ -16,10 +16,11 @@
 // Base
 html {
     height: 100%;
-    background: linear-gradient(#fff, @body-background) fixed;
+    background: @body-background fixed;
 }
 body {
-    padding: 0 (@padding-base / 2);
+    margin: 0;
+    padding: (@padding-base / 2);
 }
 
 // Header
diff --git a/docs/src/less/components/buttons.less b/docs/src/less/components/buttons.less
index 7970a861..c99a0836 100644
--- a/docs/src/less/components/buttons.less
+++ b/docs/src/less/components/buttons.less
@@ -93,12 +93,13 @@ nav {
 	vertical-align: middle;
 	border-radius: @border-radius-base;
 	user-select: none;
+	font-weight: @font-weight-bold;
 }
 
 // Buttons
 .btn {
 	padding: (@padding-base / 2) ((@padding-base / 2) + 2);
-	background: linear-gradient(lighten(@body-background, 2%), darken(@body-background, 3%));
+	background: linear-gradient(lighten(@off-white, 2%), darken(@off-white, 3%));
 	border: 1px solid @gray-light;
 	box-shadow: 0 1px 1px rgba(0,0,0, .05);
 	text-shadow: 0 1px 1px #fff;
diff --git a/docs/src/less/components/examples.less b/docs/src/less/components/examples.less
index b57763fd..24bf1e9c 100644
--- a/docs/src/less/components/examples.less
+++ b/docs/src/less/components/examples.less
@@ -7,49 +7,30 @@ section {
     max-width: @example-width-video;
 }
 
-video,
-.plyr__video-embed {
+// For non supported browsers
+video {
     max-width: 100%;
     vertical-align: middle;
 }
-.plyr__video-embed {
-    -webkit-mask-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC);
-}
 
 // Example players
 .plyr {
     margin: 0 auto;
-    border-radius: @border-radius-base;
-
-    &--fullscreen,
-    &--fullscreen-active {
-        max-width: none;
-
-        .plyr-controls,
-        video,
-        iframe {
-            border-radius: 0;
-        }
-        iframe {
-            -webkit-mask-image: none;
-        }
-    }
+    border-radius: @border-radius-large;
 }
 .plyr--audio {
     max-width: @example-width-audio;
-
-    /*.plyr__controls {
-        border-radius: @border-radius-base;
-    }
-    .plyr__progress {
-        border-radius: @border-radius-base @border-radius-base 0 0;
-
-        progress,
-        [type='range'] {
-            border-radius: @border-radius-base @border-radius-base 0 0;
-            overflow: hidden;
-        }
-    }*/
+}
+.plyr--video::after {
+    content: "";
+    pointer-events: none;
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    border: 1px solid fade(#000, 15%);
+    border-radius: inherit;
 }
 
 // Style full supported player
@@ -62,7 +43,7 @@ video,
     }
 }
 
-.plyr--video ~ ul .plyr__cite--video,
+.plyr--video:not(.plyr--youtube):not(.plyr--vimeo) ~ ul .plyr__cite--video,
 .plyr--audio ~ ul .plyr__cite--audio,
 .plyr--youtube ~ ul .plyr__cite--youtube,
 .plyr--vimeo ~ ul .plyr__cite--vimeo {
diff --git a/docs/src/less/components/type.less b/docs/src/less/components/type.less
index d16a8865..951be36d 100644
--- a/docs/src/less/components/type.less
+++ b/docs/src/less/components/type.less
@@ -12,21 +12,20 @@ body {
     text-align: center;
     color: @gray;
     font-weight: @font-weight-base;
+    .font-smoothing();
 }
 
 // Headings
 h1,
 h2 {
     letter-spacing: -.025em;
-    color: #2E3C44;
+    color: @brand-primary;
     margin: 0 0 (@padding-base / 2);
     line-height: 1.2;
-    .font-smoothing();
     font-weight: @font-weight-bold;
 }
 h1 {
     .font-size(@font-size-h1);
-    color: #3498DB;
 }
 
 // Paragraph and small