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 50f0c0d6b5..cbe032f37c 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
@@ -52,10 +52,10 @@
     }
 
         [is="emby-button"].fab i {
-            height: 4.4vh;
-            width: 4.4vh;
+            height: 40px;
+            width: 40px;
             vertical-align: middle;
-            font-size: 4.4vh;
+            font-size: 40px;
         }
 
     [is="emby-button"].noflex {
@@ -110,6 +110,12 @@
         margin-left: .5em;
     }
 
+    [is="emby-button"]:not(.autoSize) i {
+        font-size: 24px;
+        width: 24px;
+        height: 24px;
+    }
+
 [is=emby-button].autoSize {
     width: auto !important;
     height: auto !important;
diff --git a/dashboard-ui/components/channelmapper/channelmapper.js b/dashboard-ui/components/channelmapper/channelmapper.js
index 4b0936ecd8..37c8fc1db5 100644
--- a/dashboard-ui/components/channelmapper/channelmapper.js
+++ b/dashboard-ui/components/channelmapper/channelmapper.js
@@ -110,7 +110,7 @@ function (dialogHelper, loading, connectionManager, globalize, actionsheet) {
 
             html += '</div>';
 
-            html += '<button class="btnMap" is="paper-icon-button-light" type="button" data-number="' + channel.Number + '" data-providernumber="' + channel.ProviderChannelNumber + '"><iron-icon icon="mode-edit"></iron-icon></button>';
+            html += '<button class="btnMap autoSize" is="paper-icon-button-light" type="button" data-number="' + channel.Number + '" data-providernumber="' + channel.ProviderChannelNumber + '"><i class="md-icon">mode_edit</i></button>';
 
             html += '</div>';
 
diff --git a/dashboard-ui/components/imageeditor/imageeditor.js b/dashboard-ui/components/imageeditor/imageeditor.js
index c452615b16..6b429f87b3 100644
--- a/dashboard-ui/components/imageeditor/imageeditor.js
+++ b/dashboard-ui/components/imageeditor/imageeditor.js
@@ -94,24 +94,24 @@
             if (image.ImageType == "Backdrop" || image.ImageType == "Screenshot") {
 
                 if (i > 0) {
-                    html += '<button is="paper-icon-button-light"" class="btnMoveImage" data-imagetype="' + image.ImageType + '" data-index="' + image.ImageIndex + '" data-newindex="' + (image.ImageIndex - 1) + '" title="' + Globalize.translate('ButtonMoveLeft') + '"><iron-icon icon="chevron-left"></iron-icon></button>';
+                    html += '<button is="paper-icon-button-light" class="btnMoveImage autoSize" data-imagetype="' + image.ImageType + '" data-index="' + image.ImageIndex + '" data-newindex="' + (image.ImageIndex - 1) + '" title="' + Globalize.translate('ButtonMoveLeft') + '"><i class="md-icon">chevron_left</i></button>';
                 } else {
-                    html += '<button is="paper-icon-button-light"" disabled title="' + Globalize.translate('ButtonMoveLeft') + '"><iron-icon icon="chevron-left"></iron-icon></button>';
+                    html += '<button is="paper-icon-button-light" class="autoSize" disabled title="' + Globalize.translate('ButtonMoveLeft') + '"><i class="md-icon">chevron_left</i></button>';
                 }
 
                 if (i < length - 1) {
-                    html += '<button is="paper-icon-button-light"" class="btnMoveImage" data-imagetype="' + image.ImageType + '" data-index="' + image.ImageIndex + '" data-newindex="' + (image.ImageIndex + 1) + '" title="' + Globalize.translate('ButtonMoveRight') + '"><iron-icon icon="chevron-right"></iron-icon></button>';
+                    html += '<button is="paper-icon-button-light" class="btnMoveImage autoSize" data-imagetype="' + image.ImageType + '" data-index="' + image.ImageIndex + '" data-newindex="' + (image.ImageIndex + 1) + '" title="' + Globalize.translate('ButtonMoveRight') + '"><i class="md-icon">chevron_right</i></button>';
                 } else {
-                    html += '<button is="paper-icon-button-light"" disabled title="' + Globalize.translate('ButtonMoveRight') + '"><iron-icon icon="chevron-right"></iron-icon></button>';
+                    html += '<button is="paper-icon-button-light" class="autoSize" disabled title="' + Globalize.translate('ButtonMoveRight') + '"><i class="md-icon">chevron_right</i></button>';
                 }
             }
             else {
                 if (imageProviders.length) {
-                    html += '<button is="paper-icon-button-light"" data-imagetype="' + image.ImageType + '" class="btnSearchImages" title="' + Globalize.translate('ButtonBrowseOnlineImages') + '"><iron-icon icon="search"></iron-icon></button>';
+                    html += '<button is="paper-icon-button-light" data-imagetype="' + image.ImageType + '" class="btnSearchImages autoSize" title="' + Globalize.translate('ButtonBrowseOnlineImages') + '"><i class="md-icon">search</i></button>';
                 }
             }
 
-            html += '<button is="paper-icon-button-light"" data-imagetype="' + image.ImageType + '" data-index="' + (image.ImageIndex != null ? image.ImageIndex : "null") + '" class="btnDeleteImage" title="' + Globalize.translate('Delete') + '"><iron-icon icon="delete"></iron-icon></button>';
+            html += '<button is="paper-icon-button-light" data-imagetype="' + image.ImageType + '" data-index="' + (image.ImageIndex != null ? image.ImageIndex : "null") + '" class="btnDeleteImage autoSize" title="' + Globalize.translate('Delete') + '"><i class="md-icon">delete</i></button>';
 
             html += '</div>';
 
@@ -269,7 +269,7 @@
 
                 var html = '';
                 html += '<h2 class="dialogHeader">';
-                html += '<button type="button" is="emby-button" icon="arrow-back" class="fab mini btnCloseDialog" tabindex="-1"><iron-icon icon="arrow-back"></iron-icon></button>';
+                html += '<button type="button" is="emby-button" icon="arrow-back" class="fab mini btnCloseDialog autoSize" tabindex="-1"><i class="md-icon">arrow_back</i></button>';
                 html += '<div style="display:inline-block;margin-left:.6em;vertical-align:middle;">' + item.Name + '</div>';
                 html += '</h2>';
 
diff --git a/dashboard-ui/components/imageuploader/imageuploader.js b/dashboard-ui/components/imageuploader/imageuploader.js
index cfbab4ed06..35fb93459f 100644
--- a/dashboard-ui/components/imageuploader/imageuploader.js
+++ b/dashboard-ui/components/imageuploader/imageuploader.js
@@ -149,7 +149,7 @@
 
             var html = '';
             html += '<h2 class="dialogHeader">';
-            html += '<button type="button" is="emby-button" icon="arrow-back" class="fab mini btnCloseDialog" tabindex="-1"><iron-icon icon="arrow-back"></iron-icon></button>';
+            html += '<button type="button" is="emby-button" icon="arrow-back" class="fab mini btnCloseDialog autoSize" tabindex="-1"><i class="md-icon">arrow_back</i></button>';
             html += '<div style="display:inline-block;margin-left:.6em;vertical-align:middle;">' + Globalize.translate('HeaderUploadImage') + '</div>';
             html += '</h2>';
 
diff --git a/dashboard-ui/components/remotecontrol.js b/dashboard-ui/components/remotecontrol.js
index a40e1363cf..93b4977d46 100644
--- a/dashboard-ui/components/remotecontrol.js
+++ b/dashboard-ui/components/remotecontrol.js
@@ -97,7 +97,7 @@
         menuItems.unshift({
             id: -1,
             name: Globalize.translate('ButtonOff'),
-            ironIcon: currentIndex == null ? 'check' : null
+            selected: currentIndex == null
         });
 
         require(['actionsheet'], function (actionsheet) {
diff --git a/dashboard-ui/css/librarybrowser.css b/dashboard-ui/css/librarybrowser.css
index 86d2d3a139..5b9713c69f 100644
--- a/dashboard-ui/css/librarybrowser.css
+++ b/dashboard-ui/css/librarybrowser.css
@@ -324,7 +324,7 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
 @media all and (min-width: 540px) {
 
     .detailUserDataIcons {
-        margin-left: 1em;
+        margin-left: .5em;
     }
 }
 
@@ -900,6 +900,10 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
     font-weight: 500;
 }
 
+    .playedIndicator i, .syncIndicator i {
+        font-size: 180%;
+    }
+
 .mediaSourceIndicator {
     display: block;
     position: absolute;
diff --git a/dashboard-ui/css/librarymenu.css b/dashboard-ui/css/librarymenu.css
index 9be47f1f7a..34c497f692 100644
--- a/dashboard-ui/css/librarymenu.css
+++ b/dashboard-ui/css/librarymenu.css
@@ -471,6 +471,16 @@ body:not(.dashboardDocument) .btnNotifications {
     margin-left: 1.6em;
 }
 
+i.sidebarLinkIcon {
+    font-size: 24px;
+    height: 24px;
+    width: 24px;
+}
+
+.darkDrawerPanel i.sidebarLinkIcon {
+    margin-left: 1em;
+}
+
 .darkDrawerPanel .sidebarLinkText, .darkDrawerPanel .sidebarLink {
     color: #fff !important;
     font-weight: normal !important;
diff --git a/dashboard-ui/css/site.css b/dashboard-ui/css/site.css
index 9a24528977..b9242bd8ce 100644
--- a/dashboard-ui/css/site.css
+++ b/dashboard-ui/css/site.css
@@ -416,7 +416,7 @@ paper-input + .fieldDescription {
 .sidebarLinkIcon {
     text-align: center;
     vertical-align: middle;
-    margin-right: 2em;
+    margin-right: 1.2em;
 }
 
     .sidebarLinkIcon + span {
diff --git a/dashboard-ui/itemdetails.html b/dashboard-ui/itemdetails.html
index a20044ffa6..85b3f66b07 100644
--- a/dashboard-ui/itemdetails.html
+++ b/dashboard-ui/itemdetails.html
@@ -3,14 +3,14 @@
     <div id="itemBackdrop" class="itemBackdrop noBackdrop">
         <div class="itemBackdropContent">
         </div>
-        <a href="#" id="lnkPreviousItem" class="lnkPreviousItem lnkSibling hide clearLink"><button is="emby-button" type="button" class="raised subdued notext"><iron-icon icon="arrow-back"></iron-icon></button></a>
-        <a href="#" id="lnkNextItem" class="lnkNextItem lnkSibling hide clearLink"><button is="emby-button" type="button" class="raised subdued notext"><iron-icon icon="arrow-forward"></iron-icon></button></a>
+        <a href="#" id="lnkPreviousItem" class="lnkPreviousItem lnkSibling hide clearLink"><button is="emby-button" type="button" class="raised subdued notext"><i class="md-icon">arrow_back</i></button></a>
+        <a href="#" id="lnkNextItem" class="lnkNextItem lnkSibling hide clearLink"><button is="emby-button" type="button" class="raised subdued notext"><i class="md-icon">arrow_forward</i></button></a>
     </div>
 
     <div class="detailPageContent" style="position:relative;">
 
-        <button is="emby-button" type="button" class="btnPlay detailFloatingButton hide fab" title="${ButtonPlay}"><iron-icon icon="play-arrow"></iron-icon></button>
-        <button is="emby-button" type="button" class="btnFloatingRecord detailFloatingButton hide fab" title="${ButtonRecord}"><iron-icon icon="videocam"></iron-icon></button>
+        <button is="emby-button" type="button" class="btnPlay detailFloatingButton hide fab autoSize" title="${ButtonPlay}"><i class="md-icon">play_arrow</i></button>
+        <button is="emby-button" type="button" class="btnFloatingRecord detailFloatingButton hide fab autoSize" title="${ButtonRecord}"><i class="md-icon">videocam</i></button>
 
         <div class="detailImageContainer">
         </div>
@@ -27,12 +27,12 @@
                 <p class="artist"></p>
                 <p class="itemGenres"></p>
                 <div class="detailButtonsContainer">
-                    <button is="emby-button" type="button" class="raised subdued btnPlayTrailer hide"><iron-icon icon="play-arrow"></iron-icon><span>${ButtonTrailer}</span></button>
-                    <a class="btnPlayExternalTrailer hide clearLink" href="#" target="_blank"><button is="emby-button" type="button" class="raised subdued"><iron-icon icon="play-arrow"></iron-icon><span>${ButtonTrailer}</span></button></a>
-                    <button is="emby-button" type="button" class="raised subdued btnRecord hide"><iron-icon icon="videocam"></iron-icon><span>${ButtonRecord}</span></button>
-                    <button is="emby-button" type="button" class="raised subdued hide btnCancelRecording"><iron-icon icon="delete"></iron-icon><span>${ButtonCancelRecording}</span></button>
-                    <button is="emby-button" type="button" class="raised subdued btnSync hide"><iron-icon icon="sync"></iron-icon><span>${ButtonSync}</span></button>
-                    <button is="emby-button" type="button" class="raised subdued btnMoreCommands hide notext"><iron-icon icon="more-vert"></iron-icon></button>
+                    <button is="emby-button" type="button" class="raised subdued btnPlayTrailer hide"><i class="md-icon">play_arrow</i><span>${ButtonTrailer}</span></button>
+                    <a class="btnPlayExternalTrailer hide clearLink" href="#" target="_blank"><button is="emby-button" type="button" class="raised subdued"><i class="md-icon">play_arrow</i><span>${ButtonTrailer}</span></button></a>
+                    <button is="emby-button" type="button" class="raised subdued btnRecord hide"><i class="md-icon">videocam</i><span>${ButtonRecord}</span></button>
+                    <button is="emby-button" type="button" class="raised subdued hide btnCancelRecording"><i class="md-icon">delete</i><span>${ButtonCancelRecording}</span></button>
+                    <button is="emby-button" type="button" class="raised subdued btnSync hide"><i class="md-icon">sync</i><span>${ButtonSync}</span></button>
+                    <button is="emby-button" type="button" class="raised subdued btnMoreCommands hide notext"><i class="md-icon">more_vert</i></button>
                     <div class="detailUserDataIcons userDataIcons"></div>
                 </div>
             </div>
@@ -45,12 +45,12 @@
         </div>
         <div class="detailButtonsContainer">
             <br />
-            <button is="emby-button" type="button" class="raised subdued btnPlayTrailer hide"><iron-icon icon="play-arrow"></iron-icon><span>${ButtonTrailer}</span></button>
-            <a class="btnPlayExternalTrailer hide clearLink" href="#" target="_blank"><button is="emby-button" type="button" class="raised subdued"><iron-icon icon="play-arrow"></iron-icon><span>${ButtonTrailer}</span></button></a>
-            <button is="emby-button" type="button" class="raised subdued btnRecord hide"><iron-icon icon="videocam"></iron-icon><span>${ButtonRecord}</span></button>
-            <button is="emby-button" type="button" class="raised subdued hide btnCancelRecording"><iron-icon icon="delete"></iron-icon><span>${ButtonCancelRecording}</span></button>
-            <button is="emby-button" type="button" class="raised subdued btnSync hide"><iron-icon icon="sync"></iron-icon><span>${ButtonSync}</span></button>
-            <button is="emby-button" type="button" class="raised subdued btnMoreCommands hide notext"><iron-icon icon="more-vert"></iron-icon></button>
+            <button is="emby-button" type="button" class="raised subdued btnPlayTrailer hide"><i class="md-icon">play_arrow</i><span>${ButtonTrailer}</span></button>
+            <a class="btnPlayExternalTrailer hide clearLink" href="#" target="_blank"><button is="emby-button" type="button" class="raised subdued"><i class="md-icon">play_arrow</i><span>${ButtonTrailer}</span></button></a>
+            <button is="emby-button" type="button" class="raised subdued btnRecord hide"><i class="md-icon">videocam</i><span>${ButtonRecord}</span></button>
+            <button is="emby-button" type="button" class="raised subdued hide btnCancelRecording"><i class="md-icon">delete</i><span>${ButtonCancelRecording}</span></button>
+            <button is="emby-button" type="button" class="raised subdued btnSync hide"><i class="md-icon">sync</i><span>${ButtonSync}</span></button>
+            <button is="emby-button" type="button" class="raised subdued btnMoreCommands hide notext"><i class="md-icon">more_vert</i></button>
             <div class="detailUserDataIcons userDataIcons"></div>
         </div>
     </div>
@@ -146,7 +146,7 @@
                 <h1>
                     ${HeaderScenes}
                     <a class="detailSectionHeaderButton chapterSettingsButton clearLink" style="margin-top: -8px; display: inline-block;" href="metadataadvanced.html" title="${ButtonSettings}" style="display: none;">
-                        <button is="paper-icon-button-light"><iron-icon icon="settings"></iron-icon></button>
+                        <button is="paper-icon-button-light" class="autoSize"><i class="md-icon">settings</i></button>
                     </a>
                 </h1>
                 <div id="scenesContent" class="smallItemsContainer"></div>
diff --git a/dashboard-ui/scripts/itemdetailpage.js b/dashboard-ui/scripts/itemdetailpage.js
index db920bb6ea..1268c08a8e 100644
--- a/dashboard-ui/scripts/itemdetailpage.js
+++ b/dashboard-ui/scripts/itemdetailpage.js
@@ -1075,7 +1075,7 @@
         html += '<span>' + type.name + '</span>';
 
         html += '</h1>';
-        html += '<button class="btnAddToCollection" type="button" is="paper-icon-button-light" style="margin-left:1em;"><iron-icon icon="add"></iron-icon></button>';
+        html += '<button class="btnAddToCollection autoSize" type="button" is="paper-icon-button-light" style="margin-left:1em;"><i class="md-icon" icon="add">add</i></button>';
         html += '</div>';
 
         html += '<div class="detailSectionContent itemsContainer">';
diff --git a/dashboard-ui/scripts/librarybrowser.js b/dashboard-ui/scripts/librarybrowser.js
index 4818ff1b80..b5f92fa1c2 100644
--- a/dashboard-ui/scripts/librarybrowser.js
+++ b/dashboard-ui/scripts/librarybrowser.js
@@ -1406,15 +1406,6 @@
                         html += '</div>';
                     }
 
-                    //html += LibraryBrowser.getSyncIndicator(item);
-
-                    //if (item.Type == 'Series' || item.Type == 'Season' || item.Type == 'BoxSet' || item.MediaType == 'Video') {
-                    //    if (item.UserData.UnplayedItemCount) {
-                    //        //html += '<span class="ui-li-count">' + item.UserData.UnplayedItemCount + '</span>';
-                    //    } else if (item.UserData.Played && item.Type != 'TvChannel') {
-                    //        html += '<div class="playedIndicator"><iron-icon icon="check"></iron-icon></div>';
-                    //    }
-                    //}
                     html += '</a>';
                     html += '</paper-item-body>';
 
@@ -2101,14 +2092,14 @@
                 } else if (item.MediaType == "Audio" || item.Type == "MusicAlbum" || item.Type == "MusicArtist") {
 
                     if (item.Name && showTitle) {
-                        icon = 'library-music';
+                        icon = 'library_music';
                     }
                     cssClass += " defaultBackground";
 
                 } else if (item.Type == "Recording" || item.Type == "Program" || item.Type == "TvChannel") {
 
                     if (item.Name && showTitle) {
-                        icon = 'folder-open';
+                        icon = 'folder_open';
                     }
 
                     cssClass += " defaultBackground";
@@ -2126,7 +2117,7 @@
                     cssClass += " defaultBackground";
                 } else {
                     if (item.Name && showTitle) {
-                        icon = 'folder-open';
+                        icon = 'folder_open';
                     }
                     cssClass += " defaultBackground";
                 }
@@ -2211,7 +2202,7 @@
                 html += '<a' + onclick + transition + ' class="' + anchorCssClass + '" href="' + href + '"' + defaultActionAttribute + '>';
                 html += '<div class="' + imageCssClass + '" style="' + style + '"' + dataSrc + '>';
                 if (icon) {
-                    html += '<iron-icon icon="' + icon + '"></iron-icon>';
+                    html += '<i class="md-icon">' + icon + '</i>';
                 }
                 html += '</div>';
 
@@ -2226,7 +2217,7 @@
                 }
 
                 if (item.SeriesTimerId) {
-                    html += '<iron-icon icon="fiber-smart-record" class="seriesTimerIndicator"></iron-icon>';
+                    html += '<i class="md-icon seriesTimerIndicator">fiber_smart_record</i>';
                 }
 
                 html += LibraryBrowser.getSyncIndicator(item);
@@ -2289,7 +2280,7 @@
 
                 if (options.cardLayout) {
                     html += '<div class="cardButtonContainer">';
-                    html += '<button is="paper-icon-button-light" class="listviewMenuButton btnCardOptions autoSize"><i class="md-icon">' + AppInfo.moreIcon.replace('-','_') + '</i></button>';
+                    html += '<button is="paper-icon-button-light" class="listviewMenuButton btnCardOptions autoSize"><i class="md-icon">' + AppInfo.moreIcon.replace('-', '_') + '</i></button>';
                     html += "</div>";
                 }
 
@@ -2586,7 +2577,7 @@
 
                     if (item.Type != 'TvChannel') {
                         if (item.UserData.PlayedPercentage && item.UserData.PlayedPercentage >= 100 || (item.UserData && item.UserData.Played)) {
-                            return '<div class="playedIndicator"><iron-icon icon="check"></iron-icon></div>';
+                            return '<div class="playedIndicator"><i class="md-icon">check</i></div>';
                         }
                     }
                 }
@@ -2607,17 +2598,17 @@
 
                 if (item.SyncStatus == 'Synced') {
 
-                    return '<div class="syncIndicator"><iron-icon icon="sync"></iron-icon></div>';
+                    return '<div class="syncIndicator"><i class="md-icon">sync</i></div>';
                 }
 
                 var syncPercent = item.SyncPercent;
                 if (syncPercent) {
-                    return '<div class="syncIndicator"><iron-icon icon="sync"></iron-icon></div>';
+                    return '<div class="syncIndicator"><i class="md-icon">sync</i></div>';
                 }
 
                 if (item.SyncStatus == 'Queued' || item.SyncStatus == 'Converting' || item.SyncStatus == 'ReadyToTransfer' || item.SyncStatus == 'Transferring') {
 
-                    return '<div class="syncIndicator"><iron-icon icon="sync"></iron-icon></div>';
+                    return '<div class="syncIndicator"><i class="md-icon">sync</i></div>';
                 }
 
                 return '';
@@ -3030,7 +3021,7 @@
                     return '<' + tagName + ' title="' + tooltip + '" data-itemid="' + itemId + '" icon="' + icon + '" class="' + btnCssClass + '" onclick="LibraryBrowser.' + method + '(this);return false;"></' + tagName + '>';
                 }
 
-                return '<button is="paper-icon-button-light" title="' + tooltip + '" data-itemid="' + itemId + '"  class="' + btnCssClass + '" onclick="LibraryBrowser.' + method + '(this);return false;"><iron-icon icon="' + icon + '"></iron-icon></button>';
+                return '<button is="paper-icon-button-light" title="' + tooltip + '" data-itemid="' + itemId + '"  class="autoSize ' + btnCssClass + '" onclick="LibraryBrowser.' + method + '(this);return false;"><i class="md-icon">' + icon + '</i></button>';
             },
 
             getUserDataIconsHtml: function (item, includePlayed, style) {
diff --git a/dashboard-ui/scripts/librarylist.js b/dashboard-ui/scripts/librarylist.js
index 8c2c72b9e6..445d4dd809 100644
--- a/dashboard-ui/scripts/librarylist.js
+++ b/dashboard-ui/scripts/librarylist.js
@@ -149,16 +149,16 @@
 
             var resumePosition = (item.UserData || {}).PlaybackPositionTicks || 0;
 
-            html += '<button is="paper-icon-button-light" class="btnPlayItem" data-itemid="' + item.Id + '" data-itemtype="' + item.Type + '" data-isfolder="' + item.IsFolder + '" data-mediatype="' + item.MediaType + '" data-resumeposition="' + resumePosition + '"><iron-icon icon="play-circle-outline"></iron-icon></button>';
+            html += '<button is="paper-icon-button-light" class="btnPlayItem autoSize" data-itemid="' + item.Id + '" data-itemtype="' + item.Type + '" data-isfolder="' + item.IsFolder + '" data-mediatype="' + item.MediaType + '" data-resumeposition="' + resumePosition + '"><i class="md-icon">play_circle_outline</i></button>';
             buttonCount++;
         }
 
         if (commands.indexOf('trailer') != -1) {
-            html += '<button is="paper-icon-button-light" class="btnPlayTrailer" data-itemid="' + item.Id + '"><iron-icon icon="videocam"></iron-icon></button>';
+            html += '<button is="paper-icon-button-light" class="btnPlayTrailer autoSize" data-itemid="' + item.Id + '"><i class="md-icon">videocam</i></button>';
             buttonCount++;
         }
 
-        html += '<button is="paper-icon-button-light" class="btnMoreCommands"><iron-icon icon="' + AppInfo.moreIcon + '"></iron-icon></button>';
+        html += '<button is="paper-icon-button-light" class="btnMoreCommands autoSize"><i class="md-icon">more_vert</i></button>';
         buttonCount++;
 
         html += '</div>';
@@ -1097,11 +1097,11 @@
             var html = '';
 
             html += '<div style="float:left;">';
-            html += '<button is="paper-icon-button-light" class="btnCloseSelectionPanel"><iron-icon icon="close"></iron-icon></button>';
+            html += '<button is="paper-icon-button-light" class="btnCloseSelectionPanel autoSize"><i class="md-icon">close</i></button>';
             html += '<span class="itemSelectionCount"></span>';
             html += '</div>';
 
-            html += '<button is="paper-icon-button-light" class="btnSelectionPanelOptions" style="margin-left:auto;"><iron-icon icon="more-vert"></iron-icon></button>';
+            html += '<button is="paper-icon-button-light" class="btnSelectionPanelOptions autoSize" style="margin-left:auto;"><i class="md-icon">more_vert</i></button>';
 
             selectionCommandsPanel.innerHTML = html;
 
@@ -1544,7 +1544,7 @@
                 playedIndicator.classList.add('playedIndicator');
                 card.querySelector('.cardContent').appendChild(playedIndicator);
             }
-            playedIndicator.innerHTML = '<iron-icon icon="check"></iron-icon>';
+            playedIndicator.innerHTML = '<i class="md-icon">check</i>';
         }
         else if (userData.UnplayedItemCount) {
 
diff --git a/dashboard-ui/scripts/librarymenu.js b/dashboard-ui/scripts/librarymenu.js
index fe1175b41a..f2cd3668af 100644
--- a/dashboard-ui/scripts/librarymenu.js
+++ b/dashboard-ui/scripts/librarymenu.js
@@ -7,38 +7,38 @@
         var html = '';
 
         html += '<div class="primaryIcons">';
-        var backIcon = browserInfo.safari ? 'chevron-left' : 'arrow-back';
+        var backIcon = browserInfo.safari ? 'chevron_left' : 'arrow_back';
 
-        html += '<button type="button" is="paper-icon-button-light" class="headerButton headerButtonLeft headerBackButton hide"><iron-icon icon="' + backIcon + '"></iron-icon></button>';
+        html += '<button type="button" is="paper-icon-button-light" class="headerButton headerButtonLeft headerBackButton hide autoSize"><i class="md-icon">' + backIcon + '</i></button>';
 
-        html += '<button type="button" is="paper-icon-button-light" class="headerButton mainDrawerButton barsMenuButton headerButtonLeft"><iron-icon icon="menu"></iron-icon></button>';
-        html += '<button type="button" is="paper-icon-button-light" class="headerButton headerAppsButton barsMenuButton headerButtonLeft"><iron-icon icon="menu"></iron-icon></button>';
+        html += '<button type="button" is="paper-icon-button-light" class="headerButton mainDrawerButton barsMenuButton headerButtonLeft autoSize"><i class="md-icon">menu</i></button>';
+        html += '<button type="button" is="paper-icon-button-light" class="headerButton headerAppsButton barsMenuButton headerButtonLeft autoSize"><i class="md-icon">menu</i></button>';
 
         html += '<div class="libraryMenuButtonText headerButton">' + Globalize.translate('ButtonHome') + '</div>';
 
         html += '<div class="viewMenuSecondary">';
 
         html += '<span class="headerSelectedPlayer"></span>';
-        html += '<button is="paper-icon-button-light" class="btnCast headerButton headerButtonRight hide"><iron-icon icon="cast"></iron-icon></button>';
+        html += '<button is="paper-icon-button-light" class="btnCast headerButton headerButtonRight hide autoSize"><i class="md-icon">cast</i></button>';
 
         if (AppInfo.enableSearchInTopMenu) {
-            html += '<button type="button" is="paper-icon-button-light" class=headerButton headerButtonRight headerSearchButton hide" onclick="Search.showSearchPanel();"><iron-icon icon="search"></iron-icon></button>';
+            html += '<button type="button" is="paper-icon-button-light" class=headerButton headerButtonRight headerSearchButton hide autoSize" onclick="Search.showSearchPanel();"><i class="md-icon">search</i></button>';
             html += '<div class="viewMenuSearch hide">';
             html += '<form class="viewMenuSearchForm">';
             html += '<input type="text" data-role="none" data-type="search" class="headerSearchInput" autocomplete="off" spellcheck="off" />';
-            html += '<button type="button" is="paper-icon-button-light" class="btnCloseSearch"><iron-icon icon="close"></iron-icon></button>';
+            html += '<button type="button" is="paper-icon-button-light" class="btnCloseSearch autoSize"><i class="md-icon">close</i></button>';
             html += '</form>';
             html += '</div>';
         }
 
-        html += '<button is="paper-icon-button-light" class="headerButton headerButtonRight headerVoiceButton hide"><iron-icon icon="mic"></iron-icon></button>';
+        html += '<button is="paper-icon-button-light" class="headerButton headerButtonRight headerVoiceButton hide autoSize"><i class="md-icon">mic</i></button>';
 
         html += '<button is="paper-icon-button-light" class="headerButton headerButtonRight btnNotifications"><div class="btnNotificationsInner">0</div></button>';
 
-        html += '<button is="paper-icon-button-light" class="headerButton headerButtonRight headerUserButton"><iron-icon icon="person"></iron-icon></button>';
+        html += '<button is="paper-icon-button-light" class="headerButton headerButtonRight headerUserButton autoSize"><i class="md-icon">person</i></button>';
 
         if (!browserInfo.mobile && !Dashboard.isConnectMode()) {
-            html += '<button is="paper-icon-button-light" class="headerButton headerButtonRight dashboardEntryHeaderButton" onclick="return LibraryMenu.onSettingsClicked(event);"><iron-icon icon="settings"></iron-icon></button>';
+            html += '<button is="paper-icon-button-light" class="headerButton headerButtonRight dashboardEntryHeaderButton autoSize" onclick="return LibraryMenu.onSettingsClicked(event);"><i class="md-icon">settings</i></button>';
         }
 
         html += '</div>';
@@ -112,11 +112,14 @@
 
         if (src) {
             headerUserButton.classList.add('headerUserButtonRound');
+            headerUserButton.classList.remove('autoSize');
             headerUserButton.innerHTML = '<img src="' + src + '" />';
         } else if (icon) {
             headerUserButton.classList.remove('headerUserButtonRound');
-            headerUserButton.innerHTML = '<iron-icon icon="' + icon + '"></iron-icon>';
+            headerUserButton.classList.add('autoSize');
+            headerUserButton.innerHTML = '<i class="md-icon>' + icon + '</i>';
         } else {
+            headerUserButton.classList.add('autoSize');
             headerUserButton.classList.remove('headerUserButtonRound');
         }
     }
@@ -199,7 +202,7 @@
             html += '<div class="adminAppsMenuRow">';
 
             html += '<a class="adminAppsButton" href="home.html">';
-            html += '<button is="paper-icon-button-light"><iron-icon icon="home"></iron-icon></button>';
+            html += '<button is="paper-icon-button-light" class="autoSize"><i class="md-icon">home</i></button>';
             html += '<div>' + Globalize.translate('ButtonHome') + '</div>';
             html += '</a>';
 
@@ -208,11 +211,11 @@
             html += '<div class="adminAppsMenuRow">';
 
             html += '<a class="adminAppsButton" href="edititemmetadata.html">';
-            html += '<button is="paper-icon-button-light"><iron-icon icon="mode-edit"></iron-icon></button>';
+            html += '<button is="paper-icon-button-light" class="autoSize"><i class="md-icon">mode_edit</i></button>';
             html += '<div>' + Globalize.translate('ButtonMetadataManager') + '</div>';
             html += '</a>';
             html += '<a class="adminAppsButton" href="reports.html">';
-            html += '<button is="paper-icon-button-light"><iron-icon icon="insert-chart"></iron-icon></button>';
+            html += '<button is="paper-icon-button-light" class="autoSize"><i class="md-icon">insert_chart</i></button>';
             html += '<div>' + Globalize.translate('ButtonReports') + '</div>';
             html += '</a>';
 
@@ -327,7 +330,7 @@
         html += Globalize.translate('ButtonHome');
         html += '</a>';
 
-        html += '<a class="sidebarLink lnkMediaFolder" data-itemid="remote" href="nowplaying.html" onclick="return LibraryMenu.onLinkClicked(event, this);"><iron-icon icon="tablet-android" class="sidebarLinkIcon"></iron-icon><span class="sidebarLinkText">' + Globalize.translate('ButtonRemote') + '</span></a>';
+        html += '<a class="sidebarLink lnkMediaFolder" data-itemid="remote" href="nowplaying.html" onclick="return LibraryMenu.onLinkClicked(event, this);"><i class="md-icon sidebarLinkIcon">tablet_android</i><span class="sidebarLinkText">' + Globalize.translate('ButtonRemote') + '</span></a>';
 
         html += '<div class="sidebarDivider"></div>';
 
@@ -344,11 +347,11 @@
             html += Globalize.translate('HeaderAdmin');
             html += '</div>';
 
-            html += '<a class="sidebarLink lnkMediaFolder lnkManageServer" data-itemid="dashboard" href="#"><iron-icon icon="dashboard" class="sidebarLinkIcon"></iron-icon><span class="sidebarLinkText">' + Globalize.translate('ButtonManageServer') + '</span></a>';
-            html += '<a class="sidebarLink lnkMediaFolder editorViewMenu" data-itemid="editor" onclick="return LibraryMenu.onLinkClicked(event, this);" href="edititemmetadata.html"><iron-icon icon="mode-edit" class="sidebarLinkIcon"></iron-icon><span class="sidebarLinkText">' + Globalize.translate('ButtonMetadataManager') + '</span></a>';
+            html += '<a class="sidebarLink lnkMediaFolder lnkManageServer" data-itemid="dashboard" href="#"><i class="md-icon sidebarLinkIcon">dashboard</i><span class="sidebarLinkText">' + Globalize.translate('ButtonManageServer') + '</span></a>';
+            html += '<a class="sidebarLink lnkMediaFolder editorViewMenu" data-itemid="editor" onclick="return LibraryMenu.onLinkClicked(event, this);" href="edititemmetadata.html"><i class="md-icon sidebarLinkIcon">mode_edit</i><span class="sidebarLinkText">' + Globalize.translate('ButtonMetadataManager') + '</span></a>';
 
             if (!browserInfo.mobile) {
-                html += '<a class="sidebarLink lnkMediaFolder" data-itemid="reports" onclick="return LibraryMenu.onLinkClicked(event, this);" href="reports.html"><iron-icon icon="insert-chart" class="sidebarLinkIcon"></iron-icon><span class="sidebarLinkText">' + Globalize.translate('ButtonReports') + '</span></a>';
+                html += '<a class="sidebarLink lnkMediaFolder" data-itemid="reports" onclick="return LibraryMenu.onLinkClicked(event, this);" href="reports.html"><i class="md-icon sidebarLinkIcon">insert_chart</i><span class="sidebarLinkText">' + Globalize.translate('ButtonReports') + '</span></a>';
             }
             html += '</div>';
         }
@@ -358,17 +361,17 @@
         html += '<div class="sidebarDivider"></div>';
 
         if (user.localUser && (AppInfo.isNativeApp && browserInfo.android)) {
-            html += '<a class="sidebarLink lnkMediaFolder lnkMySettings" onclick="return LibraryMenu.onLinkClicked(event, this);" href="mypreferencesmenu.html?userId=' + user.localUser.Id + '"><iron-icon icon="settings" class="sidebarLinkIcon"></iron-icon><span class="sidebarLinkText">' + Globalize.translate('ButtonSettings') + '</span></a>';
+            html += '<a class="sidebarLink lnkMediaFolder lnkMySettings" onclick="return LibraryMenu.onLinkClicked(event, this);" href="mypreferencesmenu.html?userId=' + user.localUser.Id + '"><i class="md-icon sidebarLinkIcon">settings</i><span class="sidebarLinkText">' + Globalize.translate('ButtonSettings') + '</span></a>';
         }
 
-        html += '<a class="sidebarLink lnkMediaFolder lnkMySync" data-itemid="mysync" onclick="return LibraryMenu.onLinkClicked(event, this);" href="mysync.html"><iron-icon icon="sync" class="sidebarLinkIcon"></iron-icon><span class="sidebarLinkText">' + Globalize.translate('ButtonSync') + '</span></a>';
+        html += '<a class="sidebarLink lnkMediaFolder lnkMySync" data-itemid="mysync" onclick="return LibraryMenu.onLinkClicked(event, this);" href="mysync.html"><i class="md-icon sidebarLinkIcon">sync</i><span class="sidebarLinkText">' + Globalize.translate('ButtonSync') + '</span></a>';
 
         if (Dashboard.isConnectMode()) {
-            html += '<a class="sidebarLink lnkMediaFolder" data-itemid="selectserver" onclick="return LibraryMenu.onLinkClicked(event, this);" href="selectserver.html?showuser=1"><iron-icon icon="wifi" class="sidebarLinkIcon"></iron-icon><span class="sidebarLinkText">' + Globalize.translate('ButtonSelectServer') + '</span></a>';
+            html += '<a class="sidebarLink lnkMediaFolder" data-itemid="selectserver" onclick="return LibraryMenu.onLinkClicked(event, this);" href="selectserver.html?showuser=1"><i class="md-icon sidebarLinkIcon">wifi</i><span class="sidebarLinkText">' + Globalize.translate('ButtonSelectServer') + '</span></a>';
         }
 
         if (user.localUser) {
-            html += '<a class="sidebarLink lnkMediaFolder" data-itemid="logout" onclick="return LibraryMenu.onLogoutClicked(this);" href="#"><iron-icon icon="lock" class="sidebarLinkIcon"></iron-icon><span class="sidebarLinkText">' + Globalize.translate('ButtonSignOut') + '</span></a>';
+            html += '<a class="sidebarLink lnkMediaFolder" data-itemid="logout" onclick="return LibraryMenu.onLogoutClicked(this);" href="#"><i class="md-icon sidebarLinkIcon">lock</i><span class="sidebarLinkText">' + Globalize.translate('ButtonSignOut') + '</span></a>';
         }
 
         html += '</div>';
@@ -428,6 +431,7 @@
 
                 var title = '';
 
+                link = link.querySelector('span') || link;
                 var secondaryTitle = (link.innerText || link.textContent).trim();
                 title += secondaryTitle;
 
@@ -481,7 +485,7 @@
                 if (view.CollectionType == 'livetv') {
 
                     view.ImageTags = {};
-                    view.icon = 'live-tv';
+                    view.icon = 'live_tv';
                     view.onclick = "LibraryBrowser.showTab('livetv.html', 0);";
 
                     var guideView = Object.assign({}, view);
@@ -558,19 +562,19 @@
                 }
 
                 if (i.CollectionType == "photos") {
-                    icon = 'photo-library';
+                    icon = 'photo_library';
                     color = "#009688";
                 }
                 else if (i.CollectionType == "music" || i.CollectionType == "musicvideos") {
-                    icon = 'library-music';
+                    icon = 'library_music';
                     color = '#FB8521';
                 }
                 else if (i.CollectionType == "books") {
-                    icon = 'library-books';
+                    icon = 'library_books';
                     color = "#1AA1E1";
                 }
                 else if (i.CollectionType == "playlists") {
-                    icon = 'view-list';
+                    icon = 'view_list';
                     color = "#795548";
                 }
                 else if (i.CollectionType == "games") {
@@ -578,7 +582,7 @@
                     color = "#F44336";
                 }
                 else if (i.CollectionType == "movies") {
-                    icon = 'video-library';
+                    icon = 'video_library';
                     color = '#CE5043';
                 }
                 else if (i.CollectionType == "channels" || i.Type == 'Channel') {
@@ -590,14 +594,14 @@
                     color = "#4CAF50";
                 }
                 else if (i.CollectionType == "livetv") {
-                    icon = 'live-tv';
+                    icon = 'live_tv';
                     color = "#293AAE";
                 }
 
                 icon = i.icon || icon;
 
                 var onclick = i.onclick ? ' function(){' + i.onclick + '}' : 'null';
-                return '<a data-itemid="' + itemId + '" class="lnkMediaFolder sidebarLink" onclick="return LibraryMenu.onLinkClicked(event, this, ' + onclick + ');" href="' + getItemHref(i, i.CollectionType) + '"><iron-icon icon="' + icon + '" class="sidebarLinkIcon" style="color:' + color + '"></iron-icon><span class="sectionName">' + i.Name + '</span></a>';
+                return '<a data-itemid="' + itemId + '" class="lnkMediaFolder sidebarLink" onclick="return LibraryMenu.onLinkClicked(event, this, ' + onclick + ');" href="' + getItemHref(i, i.CollectionType) + '"><i class="md-icon sidebarLinkIcon" style="color:' + color + '">' + icon + '</i><span class="sectionName">' + i.Name + '</span></a>';
 
             }).join('');
 
@@ -742,7 +746,7 @@
                 var helpUrl = page.getAttribute('data-helpurl');
 
                 if (helpUrl) {
-                    html += '<a href="' + helpUrl + '" target="_blank" class="clearLink" style="margin-left:2em;" title="' + Globalize.translate('ButtonHelp') + '"><button is="emby-button" type="button" class="accent" style="margin:0;font-weight:normal;font-size:13px;padding:.25em;display:block;align-items:center;"><iron-icon icon="info"></iron-icon><span>' + Globalize.translate('ButtonHelp') + '</span></button></a>';
+                    html += '<a href="' + helpUrl + '" target="_blank" class="clearLink" style="margin-left:2em;" title="' + Globalize.translate('ButtonHelp') + '"><button is="emby-button" type="button" class="accent" style="margin:0;font-weight:normal;font-size:14px;padding:.25em;display:block;align-items:center;"><i class="md-icon">info</i><span>' + Globalize.translate('ButtonHelp') + '</span></button></a>';
                 }
             }
 
@@ -805,14 +809,14 @@
 
         if (info.isLocalPlayer) {
 
-            btnCast.querySelector('iron-icon').icon = 'cast';
+            btnCast.querySelector('i').innerHTML = 'cast';
             btnCast.classList.remove('btnActiveCast');
 
             context.querySelector('.headerSelectedPlayer').innerHTML = '';
 
         } else {
 
-            btnCast.querySelector('iron-icon').icon = 'cast-connected';
+            btnCast.querySelector('i').icon = 'cast_connected';
             btnCast.classList.add('btnActiveCast');
             context.querySelector('.headerSelectedPlayer').innerHTML = info.deviceName || info.name;
         }
@@ -1108,7 +1112,7 @@
     var headerCreated;
     var userRequiresUpdateAfterHeader;
 
-    require(['paper-icon-button-light', 'emby-icons'], function () {
+    require(['paper-icon-button-light', 'material-icons'], function () {
         renderHeader();
         headerCreated = true;
 
diff --git a/dashboard-ui/scripts/mypreferenceshome.js b/dashboard-ui/scripts/mypreferenceshome.js
index 2928ad085d..0c4251ba8d 100644
--- a/dashboard-ui/scripts/mypreferenceshome.js
+++ b/dashboard-ui/scripts/mypreferenceshome.js
@@ -82,11 +82,11 @@
 
             if (index > 0) {
 
-                currentHtml += '<button type="button" is="paper-icon-button-light" class="btnViewItemUp btnViewItemMove" title="' + Globalize.translate('ButtonUp') + '"><iron-icon icon="keyboard-arrow-up"></iron-icon></button>';
+                currentHtml += '<button type="button" is="paper-icon-button-light" class="btnViewItemUp btnViewItemMove autoSize" title="' + Globalize.translate('ButtonUp') + '"><i class="md-icon">keyboard_arrow_up</i></button>';
             }
             else if (result.Items.length > 1) {
 
-                currentHtml += '<button type="button" is="paper-icon-button-light" class="btnViewItemDown btnViewItemMove" title="' + Globalize.translate('ButtonDown') + '"><iron-icon icon="keyboard-arrow-down"></iron-icon></button>';
+                currentHtml += '<button type="button" is="paper-icon-button-light" class="btnViewItemDown btnViewItemMove autoSize" title="' + Globalize.translate('ButtonDown') + '"><i class="md-icon">keyboard_arrow_down</i></button>';
             }
 
 
diff --git a/dashboard-ui/scripts/selectserver.js b/dashboard-ui/scripts/selectserver.js
index ade5e8aaf5..df19ad5e7d 100644
--- a/dashboard-ui/scripts/selectserver.js
+++ b/dashboard-ui/scripts/selectserver.js
@@ -44,7 +44,7 @@
         html += '</paper-item-body>';
 
         if (server.Id) {
-            html += '<button is="paper-icon-button-light" class="btnServerMenu"><iron-icon icon="' + AppInfo.moreIcon + '"></iron-icon></button>';
+            html += '<button is="paper-icon-button-light" class="btnServerMenu autoSize"><i class="md-icon">' + AppInfo.moreIcon.replace('-', '_') + '</i></button>';
         }
 
         html += '</paper-icon-item>';
@@ -198,8 +198,7 @@
 
             menuItems.push({
                 name: Globalize.translate('ButtonDelete'),
-                id: 'delete',
-                ironIcon: 'delete'
+                id: 'delete'
             });
 
             require(['actionsheet'], function (actionsheet) {
@@ -233,14 +232,12 @@
 
             menuItems.push({
                 name: Globalize.translate('ButtonAccept'),
-                id: 'accept',
-                ironIcon: 'add'
+                id: 'accept'
             });
 
             menuItems.push({
                 name: Globalize.translate('ButtonReject'),
-                id: 'reject',
-                ironIcon: 'cancel'
+                id: 'reject'
             });
 
             require(['actionsheet'], function (actionsheet) {
@@ -283,7 +280,7 @@
 
             html += '</paper-item-body>';
 
-            html += '<button is="paper-icon-button-light" class="btnInviteMenu"><iron-icon icon="' + AppInfo.moreIcon + '"></iron-icon></button>';
+            html += '<button is="paper-icon-button-light" class="btnInviteMenu autoSize"><i class="md-icon">' + AppInfo.moreIcon.replace('-','_') + '</i></button>';
 
             html += '</paper-icon-item>';
 
@@ -361,7 +358,7 @@
                     return s.Id == id;
                 })[0];
 
-                connectToServer(page, server);
+                connectToServer(view, server);
             }
 
             var btnServerMenu = parentWithClass(e.target, 'btnServerMenu');
diff --git a/dashboard-ui/scripts/site.js b/dashboard-ui/scripts/site.js
index 2091e74ef6..ba8ead5930 100644
--- a/dashboard-ui/scripts/site.js
+++ b/dashboard-ui/scripts/site.js
@@ -255,7 +255,7 @@ var Dashboard = {
         var html = '<span style="margin-right: 1em;">' + Globalize.translate('MessagePleaseRestart') + '</span>';
 
         if (systemInfo.CanSelfRestart) {
-            html += '<button is="emby-button" type="button" class="raised submit mini" onclick="this.disabled=\'disabled\';Dashboard.restartServer();"><iron-icon icon="refresh"></iron-icon><span>' + Globalize.translate('ButtonRestart') + '</span></button>';
+            html += '<button is="emby-button" type="button" class="raised submit mini" onclick="this.disabled=\'disabled\';Dashboard.restartServer();"><i class="md-icon">refresh</i><span>' + Globalize.translate('ButtonRestart') + '</span></button>';
         }
 
         Dashboard.showFooterNotification({ id: "serverRestartWarning", html: html, forceShow: true, allowHide: false });
@@ -277,7 +277,7 @@ var Dashboard = {
 
         var html = '<span style="margin-right: 1em;">' + Globalize.translate('MessagePleaseRefreshPage') + '</span>';
 
-        html += '<button is="emby-button" type="button" class="raised submit mini" onclick="this.disabled=\'disabled\';Dashboard.reloadPage();"><iron-icon icon="refresh"></iron-icon><span>' + Globalize.translate('ButtonRefresh') + '</span></button>';
+        html += '<button is="emby-button" type="button" class="raised submit mini" onclick="this.disabled=\'disabled\';Dashboard.reloadPage();"><i class="md-icon">refresh</i><span>' + Globalize.translate('ButtonRefresh') + '</span></button>';
 
         Dashboard.showFooterNotification({ id: "dashboardVersionWarning", html: html, forceShow: true, allowHide: false });
     },
@@ -639,7 +639,7 @@ var Dashboard = {
         if (icon) {
             var style = item.color ? ' style="color:' + item.color + '"' : '';
 
-            menuHtml += '<iron-icon icon="' + icon + '" class="sidebarLinkIcon"' + style + '></iron-icon>';
+            menuHtml += '<i class="md-icon sidebarLinkIcon"' + style + '>' + icon + '</i>';
         }
 
         menuHtml += '<span class="sidebarLinkText">';
@@ -726,16 +726,16 @@ var Dashboard = {
             name: Globalize.translate('TabMetadata'),
             href: "metadata.html",
             pageIds: ['metadataConfigurationPage', 'metadataImagesConfigurationPage', 'metadataNfoPage'],
-            icon: 'insert-drive-file',
+            icon: 'insert_drive_file',
             color: '#FF9800'
         }, {
             name: Globalize.translate('TabSubtitles'),
             href: "metadatasubtitles.html",
             pageIds: ['metadataSubtitlesPage'],
-            icon: 'closed-caption'
+            icon: 'closed_caption'
         }, {
             name: Globalize.translate('TabPlayback'),
-            icon: 'play-circle-filled',
+            icon: 'play_circle_filled',
             color: '#E5342E',
             href: "cinemamodeconfiguration.html",
             pageIds: ['cinemaModeConfigurationPage', 'playbackConfigurationPage', 'streamingSettingsPage', 'encodingSettingsPage']
@@ -771,7 +771,7 @@ var Dashboard = {
             pageIds: ['notificationSettingsPage', 'notificationSettingPage']
         }, {
             name: Globalize.translate('TabPlugins'),
-            icon: 'add-shopping-cart',
+            icon: 'add_shopping_cart',
             color: '#9D22B1',
             href: "plugins.html",
             pageIds: ['pluginsPage', 'pluginCatalogPage']
@@ -1900,7 +1900,7 @@ var AppInfo = {};
         define("fade-in-animation", ["html!" + bowerPath + "/neon-animation/animations/fade-in-animation.html"]);
         define("fade-out-animation", ["html!" + bowerPath + "/neon-animation/animations/fade-out-animation.html"]);
         define("scale-up-animation", ["html!" + bowerPath + "/neon-animation/animations/scale-up-animation.html"]);
-        define("paper-fab", ["html!" + bowerPath + "/paper-fab/paper-fab.html"]);
+        define("paper-fab", ["emby-icons", "html!" + bowerPath + "/paper-fab/paper-fab.html"]);
         define("iron-list", ["html!" + bowerPath + "/iron-list/iron-list.html"]);
         define("iron-scroll-threshold", ["html!" + bowerPath + "/iron-scroll-threshold/iron-scroll-threshold.html"]);
         define("paper-progress", ["html!" + bowerPath + "/paper-progress/paper-progress.html"]);
diff --git a/dashboard-ui/scripts/sync.js b/dashboard-ui/scripts/sync.js
index 49a5d34532..cfc8ad676b 100644
--- a/dashboard-ui/scripts/sync.js
+++ b/dashboard-ui/scripts/sync.js
@@ -258,12 +258,12 @@
 
                 var html = '';
                 html += '<div class="dialogHeader" style="margin:0 0 2em;">';
-                html += '<button is="paper-icon-button-light" class="btnCancel" tabindex="-1"><iron-icon icon="arrow-back"></iron-icon></button>';
+                html += '<button is="paper-icon-button-light" class="btnCancel autoSize" tabindex="-1"><i class="md-icon">arrow_back</i></button>';
                 html += '<div class="dialogHeaderTitle">';
                 html += Globalize.translate('SyncMedia');
                 html += '</div>';
 
-                html += '<a href="https://github.com/MediaBrowser/Wiki/wiki/Sync" target="_blank" class="clearLink" style="margin-top:0;display:inline-block;vertical-align:middle;margin-left:auto;"><button is="emby-button" type="button" class="mini"><iron-icon icon="info"></iron-icon><span>' + Globalize.translate('ButtonHelp') + '</span></button></a>';
+                html += '<a href="https://github.com/MediaBrowser/Wiki/wiki/Sync" target="_blank" class="clearLink" style="margin-top:0;display:inline-block;vertical-align:middle;margin-left:auto;"><button is="emby-button" type="button" class="mini"><i class="md-icon">info</i><span>' + Globalize.translate('ButtonHelp') + '</span></button></a>';
 
                 html += '</div>';
 
@@ -272,7 +272,7 @@
                 html += '<div class="formFields"></div>';
 
                 html += '<p>';
-                html += '<button is="emby-button" type="submit" class="raised submit block"><iron-icon icon="sync"></iron-icon><span>' + Globalize.translate('ButtonSync') + '</span></button>';
+                html += '<button is="emby-button" type="submit" class="raised submit block"><i class="md-icon">sync</i><span>' + Globalize.translate('ButtonSync') + '</span></button>';
                 html += '</p>';
 
                 html += '</form>';
diff --git a/dashboard-ui/scripts/syncactivity.js b/dashboard-ui/scripts/syncactivity.js
index ca0e3b83cf..96c858aeb6 100644
--- a/dashboard-ui/scripts/syncactivity.js
+++ b/dashboard-ui/scripts/syncactivity.js
@@ -133,7 +133,7 @@
         }
 
         html += '<div class="cardText" style="text-align:right; float:right;padding:0;">';
-        html += '<button type="button" is="paper-icon-button-light" class="btnJobMenu"><iron-icon icon="' + AppInfo.moreIcon + '"></iron-icon></button>';
+        html += '<button type="button" is="paper-icon-button-light" class="btnJobMenu autoSize"><i class="md-icon">' + AppInfo.moreIcon.replace('-', '_') + '</i></button>';
         html += "</div>";
 
         for (var i = 0, length = textLines.length; i < length; i++) {
@@ -277,14 +277,12 @@
         if (status == 'Cancelled') {
             menuItems.push({
                 name: Globalize.translate('ButtonDelete'),
-                id: 'delete',
-                ironIcon: 'delete'
+                id: 'delete'
             });
         } else {
             menuItems.push({
                 name: Globalize.translate('ButtonCancelSyncJob'),
-                id: 'cancel',
-                ironIcon: 'delete'
+                id: 'cancel'
             });
         }
 
diff --git a/dashboard-ui/scripts/syncjob.js b/dashboard-ui/scripts/syncjob.js
index f8ff1612f7..6b0a244a06 100644
--- a/dashboard-ui/scripts/syncjob.js
+++ b/dashboard-ui/scripts/syncjob.js
@@ -12,7 +12,7 @@
 
         html += '<br/>';
         html += '<br/>';
-        html += '<button is="emby-button" type="submit" class="raised submit block"><iron-icon icon="check"></iron-icon><span>' + Globalize.translate('ButtonSave') + '</span></button>';
+        html += '<button is="emby-button" type="submit" class="raised submit block"><span>' + Globalize.translate('ButtonSave') + '</span></button>';
 
         $('.syncJobForm', page).html(html);
 
@@ -90,9 +90,9 @@
 
         if (hasActions) {
 
-            html += '<button type="button" is="paper-icon-button-light" class="btnJobItemMenu"><iron-icon icon="' + AppInfo.moreIcon + '"></iron-icon></button>';
+            html += '<button type="button" is="paper-icon-button-light" class="btnJobItemMenu autoSize"><i class="md-icon">' + AppInfo.moreIcon.replace('-', '_') + '</i></button>';
         } else {
-            html += '<button type="button" is="paper-icon-button-light" class="btnJobItemMenu" disabled><iron-icon icon="' + AppInfo.moreIcon + '"></iron-icon></button>';
+            html += '<button type="button" is="paper-icon-button-light" class="btnJobItemMenu autoSize" disabled><i class="md-icon">' + AppInfo.moreIcon.replace('-', '_') + '</i></button>';
         }
 
         html += '</paper-icon-item>';
@@ -144,36 +144,31 @@
         if (status == 'Failed') {
             menuItems.push({
                 name: Globalize.translate('ButtonQueueForRetry'),
-                id: 'retry',
-                ironIcon: 'check'
+                id: 'retry'
             });
         }
         else if (status == 'Cancelled') {
             menuItems.push({
                 name: Globalize.translate('ButtonReenable'),
-                id: 'retry',
-                ironIcon: 'check'
+                id: 'retry'
             });
         }
         else if (status == 'Queued' || status == 'Transferring' || status == 'Converting' || status == 'ReadyToTransfer') {
             menuItems.push({
                 name: Globalize.translate('ButtonCancelItem'),
-                id: 'cancel',
-                ironIcon: 'delete'
+                id: 'cancel'
             });
         }
         else if (status == 'Synced' && remove) {
             menuItems.push({
                 name: Globalize.translate('ButtonUnmarkForRemoval'),
-                id: 'unmarkforremoval',
-                ironIcon: 'check'
+                id: 'unmarkforremoval'
             });
         }
         else if (status == 'Synced') {
             menuItems.push({
                 name: Globalize.translate('ButtonMarkForRemoval'),
-                id: 'markforremoval',
-                ironIcon: 'delete'
+                id: 'markforremoval'
             });
         }
 
diff --git a/dashboard-ui/selectserver.html b/dashboard-ui/selectserver.html
index ce1dd80b3b..7284c3090c 100644
--- a/dashboard-ui/selectserver.html
+++ b/dashboard-ui/selectserver.html
@@ -16,7 +16,7 @@
 
             <div class="serverList paperList"></div>
             <br />
-            <div class="noServersMessage" style="display:none;padding-left:5px;">
+            <div class="noServersMessage hide" style="padding-left:5px;">
                 ${MessageNoServersAvailableToConnect}
                 <br /><br />
             </div>
@@ -30,7 +30,7 @@
                 </a>
             </div>
 
-            <div class="connectLogin" style="margin:1em 0;display:none;">
+            <div class="connectLogin hide" style="margin:1em 0;">
                 <a href="connectlogin.html?mode=connect" class="clearLink">
                     <button is="emby-button" type="button" class="raised accent block">
                         <i class="md-icon">check</i>
@@ -39,7 +39,7 @@
                 </a>
             </div>
 
-            <div class="invitationSection" style="display:none;">
+            <div class="invitationSection hide">
                 <br />
                 <h1 style="margin-bottom:.5em;padding-left:5px;">${HeaderInvitations}</h1>