diff --git a/dashboard-ui/bower_components/emby-webcomponents/.bower.json b/dashboard-ui/bower_components/emby-webcomponents/.bower.json
index 7875ebd827..344cfb98e4 100644
--- a/dashboard-ui/bower_components/emby-webcomponents/.bower.json
+++ b/dashboard-ui/bower_components/emby-webcomponents/.bower.json
@@ -14,12 +14,12 @@
   },
   "devDependencies": {},
   "ignore": [],
-  "version": "1.4.475",
-  "_release": "1.4.475",
+  "version": "1.4.476",
+  "_release": "1.4.476",
   "_resolution": {
     "type": "version",
-    "tag": "1.4.475",
-    "commit": "ee9afc32bf7c7da8a40158d556cb217bd2c80ef5"
+    "tag": "1.4.476",
+    "commit": "802991db23eeaba201548ad9987282a2cab2671a"
   },
   "_source": "https://github.com/MediaBrowser/emby-webcomponents.git",
   "_target": "^1.2.1",
diff --git a/dashboard-ui/bower_components/emby-webcomponents/emby-button/emby-button.css b/dashboard-ui/bower_components/emby-webcomponents/emby-button/emby-button.css
index 1627a363d3..913eaddda1 100644
--- a/dashboard-ui/bower_components/emby-webcomponents/emby-button/emby-button.css
+++ b/dashboard-ui/bower_components/emby-webcomponents/emby-button/emby-button.css
@@ -54,8 +54,8 @@
 .emby-button > i {
     /* For non-fab buttons that have icons */
     font-size: 1.36em;
-    width: auto;
-    height: auto;
+    width: 1em;
+    height: 1em;
 }
 
 .fab {
@@ -72,8 +72,8 @@
 }
 
     .fab > i {
-        height: auto;
-        width: auto;
+        height: 1em;
+        width: 1em;
         vertical-align: middle;
         font-size: 2.85em;
     }
@@ -88,8 +88,8 @@
 }
 
     .fab.mini > i {
-        height: auto;
-        width: auto;
+        height: 1em;
+        width: 1em;
         font-size: 1.72em;
     }
 
diff --git a/dashboard-ui/bower_components/emby-webcomponents/itemhovermenu/itemhovermenu.js b/dashboard-ui/bower_components/emby-webcomponents/itemhovermenu/itemhovermenu.js
index c5f41dad4b..6dcc7fb5a8 100644
--- a/dashboard-ui/bower_components/emby-webcomponents/itemhovermenu/itemhovermenu.js
+++ b/dashboard-ui/bower_components/emby-webcomponents/itemhovermenu/itemhovermenu.js
@@ -128,7 +128,7 @@
 
         if (playbackManager.canPlay(item)) {
 
-            html += '<button is="emby-button" class="itemAction autoSize fab cardOverlayFab mini" data-action="playmenu"><i class="md-icon cardOverlayFab-md-icon">&#xE037;</i></button>';
+            html += '<button is="emby-button" class="itemAction autoSize fab cardOverlayFab mini" data-action="resume"><i class="md-icon cardOverlayFab-md-icon">&#xE037;</i></button>';
             buttonCount++;
         }
 
diff --git a/dashboard-ui/bower_components/emby-webcomponents/playmenu.js b/dashboard-ui/bower_components/emby-webcomponents/playmenu.js
index ec969fd309..f3fb101799 100644
--- a/dashboard-ui/bower_components/emby-webcomponents/playmenu.js
+++ b/dashboard-ui/bower_components/emby-webcomponents/playmenu.js
@@ -1,8 +1,6 @@
 define(['actionsheet', 'datetime', 'playbackManager', 'globalize', 'appSettings'], function (actionsheet, datetime, playbackManager, globalize, appSettings) {
     'use strict';
 
-    var isMobileApp = window.Dashboard != null;
-
     function show(options) {
 
         var item = options.item;
@@ -17,7 +15,7 @@ define(['actionsheet', 'datetime', 'playbackManager', 'globalize', 'appSettings'
 
         var playableItemId = itemType === 'Program' ? channelId : itemId;
 
-        if (!resumePositionTicks && mediaType !== "Audio" && !isFolder) {
+        if (!resumePositionTicks || isFolder) {
             playbackManager.play({
                 ids: [playableItemId],
                 serverId: serverId
@@ -44,13 +42,6 @@ define(['actionsheet', 'datetime', 'playbackManager', 'globalize', 'appSettings'
             });
         }
 
-        if (itemType === "Audio" || itemType === "MusicAlbum" || itemType === "MusicArtist" || itemType === "MusicGenre") {
-            menuItems.push({
-                name: globalize.translate('sharedcomponents#InstantMix'),
-                id: 'instantmix'
-            });
-        }
-
         if (isFolder || itemType === "MusicArtist" || itemType === "MusicGenre") {
             menuItems.push({
                 name: globalize.translate('sharedcomponents#Shuffle'),
@@ -84,9 +75,6 @@ define(['actionsheet', 'datetime', 'playbackManager', 'globalize', 'appSettings'
                         items: [item]
                     });
                     break;
-                case 'instantmix':
-                    playbackManager.instantMix(item);
-                    break;
                 case 'shuffle':
                     playbackManager.shuffle(item);
                     break;
diff --git a/dashboard-ui/bower_components/emby-webcomponents/shortcuts.js b/dashboard-ui/bower_components/emby-webcomponents/shortcuts.js
index 465e805a51..c413ddf881 100644
--- a/dashboard-ui/bower_components/emby-webcomponents/shortcuts.js
+++ b/dashboard-ui/bower_components/emby-webcomponents/shortcuts.js
@@ -252,7 +252,7 @@ define(['playbackManager', 'inputManager', 'connectionManager', 'embyRouter', 'g
             });
         }
 
-        else if (action === 'play') {
+        else if (action === 'play' || action === 'resume') {
 
             var startPositionTicks = parseInt(card.getAttribute('data-positionticks') || '0');
 
@@ -431,7 +431,7 @@ define(['playbackManager', 'inputManager', 'connectionManager', 'embyRouter', 'g
 
         var cmd = e.detail.command;
 
-        if (cmd === 'play' || cmd === 'record' || cmd === 'menu' || cmd === 'info') {
+        if (cmd === 'play' || cmd === 'resume' || cmd === 'record' || cmd === 'menu' || cmd === 'info') {
             var card = dom.parentWithClass(e.target, 'itemAction');
 
             if (card) {
diff --git a/dashboard-ui/components/remotecontrol.js b/dashboard-ui/components/remotecontrol.js
index df82fbf0cd..2d70e90c21 100644
--- a/dashboard-ui/components/remotecontrol.js
+++ b/dashboard-ui/components/remotecontrol.js
@@ -540,6 +540,22 @@
             });
         }
 
+        function onPlaylistItemRemoved(e, info) {
+
+            var context = dlg;
+
+            var playlistItemIds = info.playlistItemIds;
+
+            for (var i = 0, length = playlistItemIds.length; i < length; i++) {
+
+                var listItem = context.querySelector('.listItem[data-playlistItemId="' + playlistItemIds[i] + '"]');
+
+                if (listItem) {
+                    listItem.parentNode.removeChild(listItem);
+                }
+            }
+        }
+
         function onPlaybackStopped(e, stopInfo) {
 
             console.log('remotecontrol event: ' + e.type);
@@ -627,7 +643,7 @@
             events.on(player, 'playbackstart', onPlaybackStart);
             events.on(player, 'statechange', onPlaybackStart);
             events.on(player, 'repeatmodechange', onRepeatModeChange);
-            events.on(player, 'playlistitemremove', onPlaylistUpdate);
+            events.on(player, 'playlistitemremove', onPlaylistItemRemoved);
             events.on(player, 'playlistitemmove', onPlaylistUpdate);
             events.on(player, 'playbackstop', onPlaybackStopped);
             events.on(player, 'volumechange', onVolumeChanged);
@@ -646,7 +662,7 @@
         function updateCastIcon(context) {
 
             var info = playbackManager.getPlayerInfo();
-            var btnCast = context.querySelector('.nowPlayingCastIcon');
+            var btnCast = context.querySelector('.btnCast');
 
             if (info && !info.isLocalPlayer) {
 
@@ -850,7 +866,7 @@
             context.querySelector('.sendMessageForm').addEventListener('submit', onMessageSubmit);
             context.querySelector('.typeTextForm').addEventListener('submit', onSendStringSubmit);
 
-            context.querySelector('.nowPlayingCastIcon').addEventListener('click', function () {
+            context.querySelector('.btnCast').addEventListener('click', function () {
                 var btn = this;
                 require(['playerSelectionMenu'], function (playerSelectionMenu) {
                     playerSelectionMenu.show(btn);
@@ -866,6 +882,10 @@
             //});
 
             events.on(playbackManager, 'playerchange', onPlayerChange);
+
+            if (appHost.supports('remotecontrol')) {
+                context.querySelector('.btnCast').classList.remove('hide');
+            }
         }
 
         function onDialogClosed(e) {
diff --git a/dashboard-ui/css/librarybrowser.css b/dashboard-ui/css/librarybrowser.css
index 837ca4c4f6..fee7c8da06 100644
--- a/dashboard-ui/css/librarybrowser.css
+++ b/dashboard-ui/css/librarybrowser.css
@@ -250,7 +250,7 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
     background-size: cover;
     background-position: center 15%;
     background-repeat: no-repeat;
-    height: 50vh;
+    height: 45vh;
     position: relative;
 }
 
@@ -491,7 +491,7 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
 }
 
 .mainDetailButtons {
-    padding: 1em 0;
+    padding: .5em 0;
     display: flex;
     align-items: center;
 }
@@ -505,6 +505,12 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
         margin-top: 1.5em !important;
     }
 
+    .mainDetailButtons > .raised {
+        justify-content: center;
+        padding-left: 1.5em;
+        padding-right: 1.5em;
+    }
+
 @media all and (min-width: 800px) {
 
     .mainDetailButtons, .itemDetailPage .recordingFields button {
diff --git a/dashboard-ui/itemdetails.html b/dashboard-ui/itemdetails.html
index 911cc79f01..4afba21f70 100644
--- a/dashboard-ui/itemdetails.html
+++ b/dashboard-ui/itemdetails.html
@@ -39,24 +39,26 @@
 
                     <div class="mainDetailButtons">
                         <button is="emby-button" type="button" class="raised subdued btnPlay btnPlaySimple hide">
-                            <i class="md-icon">play_arrow</i>
                             <span>${ButtonPlay}</span>
                         </button>
+                        <button is="emby-button" type="button" class="raised subdued btnInstantMix hide">
+                            <span>${HeaderInstantMix}</span>
+                        </button>
+                        <button is="emby-button" type="button" class="raised subdued btnShuffle hide">
+                            <span>${ButtonShuffle}</span>
+                        </button>
                         <button is="emby-button" type="button" class="raised subdued btnPlayTrailer hide">
-                            <i class="md-icon">videocam</i>
                             <span>${ButtonTrailer}</span>
                         </button>
                         <button is="emby-button" type="button" class="raised subdued btnCancelSeriesTimer hide">
-                            <i class="md-icon">cancel</i>
                             <span>${ButtonCancelSeries}</span>
                         </button>
-                        <button is="emby-button" type="button" class="raised subdued btnMoreCommands hide notext">
-                            &nbsp;
-                            <i class="md-icon">more_vert</i>
-                            &nbsp;
-                        </button>
-                        <button is="emby-button" type="button" class="btnDeleteItem fab mini hide" title="${DeleteMedia}" style="margin-left:.5em;"><i class="md-icon">&#xE872;</i></button>
-                        <div class="detailUserDataIcons userDataIcons"></div>
+
+                        <div style="margin-left:.5em; display: flex; align-items: center;">
+                            <button is="emby-button" type="button" class="btnMoreCommands fab mini hide" title="${ButtonMore}"><i class="md-icon">more_vert</i></button>
+                            <button is="emby-button" type="button" class="btnDeleteItem fab mini hide" title="${DeleteMedia}"><i class="md-icon">&#xE872;</i></button>
+                            <div class="detailUserDataIcons userDataIcons"></div>
+                        </div>
                     </div>
 
                     <div class="syncLocalContainer hide" style="margin: 1em 0;">
diff --git a/dashboard-ui/nowplaying.html b/dashboard-ui/nowplaying.html
index 2d1476fafe..6f60a0dc46 100644
--- a/dashboard-ui/nowplaying.html
+++ b/dashboard-ui/nowplaying.html
@@ -54,7 +54,7 @@
                         <div class="nowPlayingPageUserDataButtons">
                         </div>
 
-                        <button is="paper-icon-button-light" class="nowPlayingCastIcon">
+                        <button is="paper-icon-button-light" class="btnCast">
                             <i class="md-icon">cast</i>
                         </button>
 
diff --git a/dashboard-ui/scripts/itemdetailpage.js b/dashboard-ui/scripts/itemdetailpage.js
index 52750487db..61ef9f36fc 100644
--- a/dashboard-ui/scripts/itemdetailpage.js
+++ b/dashboard-ui/scripts/itemdetailpage.js
@@ -78,7 +78,9 @@
             positionTo: button,
             cancelTimer: false,
             record: false,
-            deleteItem: item.IsFolder === true
+            deleteItem: item.IsFolder === true,
+            shuffle: false,
+            instantMix: false
         };
 
         if (appHost.supports('sync')) {
@@ -227,13 +229,24 @@
                 } else {
                     hideAll(page, 'btnPlay');
                 }
+                hideAll(page, 'btnInstantMix');
+                hideAll(page, 'btnShuffle');
             }
             else if (playbackManager.canPlay(item)) {
                 hideAll(page, 'btnPlay', true);
+
+                var enableInstantMix = ['Audio', 'MusicAlbum', 'MusicGenre', 'MusicArtist'].indexOf(item.Type) !== -1;
+                hideAll(page, 'btnInstantMix', enableInstantMix);
+
+                var enableShuffle = item.IsFolder || ['MusicAlbum', 'MusicGenre', 'MusicArtist'].indexOf(item.Type) !== -1;
+                hideAll(page, 'btnShuffle', enableShuffle);
+
                 canPlay = true;
             }
             else {
                 hideAll(page, 'btnPlay');
+                hideAll(page, 'btnInstantMix');
+                hideAll(page, 'btnShuffle');
             }
 
             var hasAnyButton = canPlay;
@@ -2184,13 +2197,9 @@
 
     function showPlayMenu(item, target) {
 
-        require(['playMenu'], function (playMenu) {
-
-            playMenu.show({
-
-                item: item,
-                positionTo: target
-            });
+        playbackManager.play({
+            items: [item],
+            startPositionTicks: item.UserData ? item.UserData.PlaybackPositionTicks : 0
         });
     }
 
@@ -2248,6 +2257,14 @@
         playCurrentItem(this);
     }
 
+    function onInstantMixClick() {
+        playbackManager.instantMix(currentItem);
+    }
+
+    function onShuffleClick() {
+        playbackManager.shuffle(currentItem);
+    }
+
     function onDeleteClick() {
 
         require(['deleteHelper'], function (deleteHelper) {
@@ -2295,6 +2312,9 @@
             elems[i].addEventListener('click', onPlayClick);
         }
 
+        view.querySelector('.btnInstantMix').addEventListener('click', onInstantMixClick);
+        view.querySelector('.btnShuffle').addEventListener('click', onShuffleClick);
+
         elems = view.querySelectorAll('.btnPlayTrailer');
         for (i = 0, length = elems.length; i < length; i++) {
             elems[i].addEventListener('click', onPlayTrailerClick);
diff --git a/dashboard-ui/strings/en-US.json b/dashboard-ui/strings/en-US.json
index 23474ba8bb..a3f47a05b7 100644
--- a/dashboard-ui/strings/en-US.json
+++ b/dashboard-ui/strings/en-US.json
@@ -39,6 +39,7 @@
   "HeaderPaths": "Paths",
   "CategorySync": "Sync",
   "TabPlaylist": "Playlist",
+  "HeaderInstantMix": "Instant Mix",
   "HeaderEasyPinCode": "Easy Pin Code",
   "HeaderInstalledServices": "Installed Services",
   "HeaderAvailableServices": "Available Services",