styles to make emby look like netflix

piflix.css

/*
EMBY THEME : piflix

# Table of Contents

  1. ACCENT COLORS
     1.1 Buttons
         1.1.1 Checkboxes
       1.1.2 Rectangles
       1.1.3 Links & Text buttons
       1.1.4 Others
     1.2 Details
         1.2.1 Circles
       1.2.2 Indicators
       1.2.3 Fonts
       1.2.4 Icons
       1.2.5 Dialogs & Action Sheets
       1.2.6 Others
     1.3 Fixes

  2. MISCELLANEOUS MODIFICATIONS
     2.1 Buttons
     2.2 Details
         2.2.1 Scrollbars
         2.2.2 Logos
         2.2.3 Others
     2.3 Fixes
         2.3.1 Dark Colors

*/
/* make the background transparent */
body {
    background-color: rgba(0,0,0,0) !important;
}

/* remove the home screen row with "get emby premiere" stuff */
.appInfoSection {
    display: none;
}
/* ------------------------ 1. ACCENT COLORS ------------------------- */
/* ----- 1.1 Buttons ----- */
/* 1.1.1 Checkboxes */
.emby-checkbox:checked+span+span+.checkboxOutline {
    background-color: #E81123 !important;
}

.checkboxIcon-checked {
    background-color: #E81123 !important;
}

.emby-checkbox:checked+span+span+.checkboxOutline,
.progressring-spiner {
    border-color: #E81123 !important;
}

.emby-checkbox:focus+span+.emby-checkbox-focushelper {
    background-color: #E81123 !important;
    opacity: 0.26 !important;
}

/* 1.1.2 Rectangles */
.raised {
    background: #404040 !important;
    color: #fff !important;
}

.button-submit,
.button-accent {
    background: #E81123 !important;
    color: #fff;
}

.raised-mini.emby-button {
    background: #E81123 !important;
    color: #ffffff !important;
}

/* Restart */
.btnRestartContainer.emby-button {
    background: #E81123 !important;
    color: #fff;
}

/* Play & Resume */
.btnPlaySimple.emby-button {
    background: #E81123 !important;
    color: #fff;
}

.btnResume.emby-button {
    background: #94131E !important;
    color: #fff;
}

/* 1.1.3 Links & Text buttons */
.button-link,
.button-flat-accent,
.button-accent-flat,
.textlink {
    color: #E81123 !important;
}

.button-link:hover,
.button-flat-accent:hover,
.button-accent-flat:hover,
.textlink:hover {
    color: #9b9b9b !important;
}

.button-link:active,
.button-flat-accent:active,
.button-accent-flat:active,
.textlink:active {
    color: #94131E !important;
}

/* Top Header */
.emby-tab-button-active {
    color: #E81123 !important;
}

/* 1.1.4 Others */
/* Alpha Picker */
.alphaPickerButton-selected,
.alphaPickerButton-tv:focus {
    background-color: #E81123 !important;
    color: #fff !important;
}

/* Radio Buttons */
.mdl-radio__inner-circle {
    background: #E81123 !important;
}

.mdl-radio__button:checked+.mdl-radio__label+.mdl-radio__outer-circle {
    border: 2px solid #E81123 !important;
}

.mdl-radio__button:checked:focus+.mdl-radio__label+.mdl-radio__outer-circle+.mdl-radio__inner-circle {
    -webkit-box-shadow: 0 0 0 10px rgba(232, 17, 35, 0.26) !important;
    box-shadow: 0 0 0 10px rgba(232, 17, 35, 0.26) !important;
}

/* Control Group Buttons */
div[data-role="controlgroup"] a.ui-btn-active[data-role='button'] {
    background: #E81123 !important;
    color: #ffffff !important;
}

/* play & shuffle buttons */

/* disable the "play all" button */
.btnPlay {
    display: none;
}

/* disable the shuffle button */
.btnShuffle {
    display: none;
}

.mainDetailButtons>.btnShuffle {
    display: none;
}

.mainDetailButtons>.btnDeleteItem {
    display: none;
}

.mainDetailButtons>.detailButton {
    background-color: rgba(0,0,0,0) !important;
}

.mainDetailButtons>.detailButton>.detailButton-content {
    background-color: rgba(0,0,0,0) !important;
}

.mainDetailButtons>.detailButton>.detailButton-content>.detailButton-icon {
    background-color: rgba(0,0,0,0) !important;
}

.mainDetailButtons>.detailButton>.detailButton-content>.detailButton-text {
    background-color: rgba(0,0,0,0) !important;
}

/* ----- 1.2 Details ----- */
/* 1.2.1 Circles */
/*.listItemIcon:not(.listItemIcon-transparent) {
    background-color: $accent-color !important; }*/
.dashboardSection i.listItemIcon.md-icon {
    background-color: #E81123 !important;
}

.scheduledTaskPaperIconItem[data-status="Running"] i.listItemIcon.md-icon {
    background-color: #94131E !important;
}


/* Focus Helper circles */
.paper-icon-button-light:focus {
    color: #E81123 !important;
}

/* 1.2.2 Indicators */
.countIndicator,
.playedIndicator {
    background: #E81123 !important;
}

.levelNormal {
    background-color: #E81123 !important;
}

.fullSyncIndicator {
    background: #E81123 !important;
    color: #fff;
}

.playstatebutton-played i,
.ratingbutton-withrating i {
    color: #E81123 !important;
}

p#pUpToDate i.md-icon {
    background-color: #E81123 !important;
}

/* Loading Spinners */
.mdl-spinner__layer-1,
.mdl-spinner__layer-2,
.mdl-spinner__layer-3,
.mdl-spinner__layer-4 {
    border-color: #E81123 !important;
}

.progressring-spiner {
    border: 0.25em solid #E81123 !important;
}

/* 1.2.3 Fonts */
.selectLabelFocused,
.textareaLabelFocused,
.inputLabelFocused {
    color: #E81123 !important;
}

.secondary.listItemBodyText span,
div#divRunningTasks span {
    color: #E81123 !important;
}

/* 1.2.4 Icons */
.starIcon,
.mediaInfoTimerIcon {
    color: #E81123 !important;
}

/* Top Header */
.btnActiveCast {
    color: #E81123 !important;
}

/* Now Playing Bar & Now Playing Page */
.repeatActive,
button.btnCommand.repeatToggleButton.autoSize.nowPlayingPageRepeatActive {
    color: #E81123 !important;
}

/* 1.2.5 Dialogs & Action Sheets */
/* 1.2.6 Others */
/* General Accent Color Modifications */
:focus {
    outline: #E81123 auto 5px;
}

select:focus {
    border-color: #E81123 !important;
}

::selection {
    background-color: #94131E !important;
}

.emby-input:focus,
.emby-textarea:focus {
    border-color: #E81123 !important;
}

/* Google Now Playing Bar & Now Playing Page */
.iconOsdProgressInner,
.mdl-slider__background-lower,
.sliderBubble,
.mdl-slider::-webkit-slider-thumb {
    background: #E81123 !important;
}

.mdl-slider:focus::-webkit-slider-thumb {
    -webkit-box-shadow: 0 0 0 10px rgba(232, 17, 35, 0.26);
    box-shadow: 0 0 0 10px rgba(232, 17, 35, 0.26) !important;
}

/* Firefox Now Playing Bar & Now Playing Page */
.mdl-slider::-moz-range-thumb,
.mdl-slider::-moz-range-progress {
    background: #E81123 !important;
}

.mdl-slider:focus::-moz-range-thumb {
    box-shadow: 0 0 0 10px rgba(232, 17, 35, 0.26) !important;
}

/* Progress Bars */
.itemProgressBarForeground {
    background-color: #E81123 !important;
}

.taskProgressInner {
    background: #E81123 !important;
}

/* Google Progress Bars */
progress::-webkit-progress-value {
    background: #E81123 !important;
}

/* Firefox Progress Bars */
progress::-moz-progress-bar {
    background: #E81123 !important;
}

/* Edge Progress Bars */
progress {
    background: #E81123 !important;
}

/* Main Drawers */
.navMenuDivider {
    background: #262626 !important;
}

.adminDrawerLogo {
    border-bottom: 1px solid #262626 !important;
}

.mainDrawer {
    background: #181818 !important;
}

.sidebarHeader {
    color: #bbbbbb !important;
}

.navMenuOption {
    color: #ffffff !important;
}

.navMenuOption.navMenuOption-selected {
    background: #252528 !important;
    color: #E81123 !important;
}

.navMenuOption:hover {
    background: #252528 !important;
    color: #9b9b9b !important;
}

/* Metadata Editor */
div.jstree-wholerow.jstree-wholerow-clicked:hover,
div.jstree-wholerow.jstree-wholerow-clicked,
div.jstree-wholerow.jstree-wholerow-hovered {
    background: #252528 !important;
}

.jstree-anchor.jstree-clicked,
.jstree-anchor.jstree-clicked.jstree-hovered {
    background: #252528 !important;
    color: #E81123 !important;
}

/* Multi-select */
.itemSelectionPanel {
    border: 1px solid #E81123 !important;
}

.selectionCommandsPanel {
    background: #E81123 !important;
    color: #fff;
}

/* upNextDialog */
.upNextDialog-countdownText {
    color: #E81123 !important;
}

/* Selection Bars */
.emby-select-selectionbar,
.emby-textarea-selectionbar,
.emby-input-selectionbar {
    background-color: #E81123 !important;
}

/* Media Info Detail Image */
.itemDetailImage.loaded:hover {
    border: 1px solid #E81123 !important;
}

/* 1.3 Fixes */
/* ------------------ 2. MISCELLANEOUS MODIFICATIONS ----------------- */
/* ----- 2.1 Buttons ----- */
/* Circles */
.fab {
    background-color: transparent !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    -webkit-transition: none !important;
    -o-transition: none !important;
    transition: none !important;
}

/* ----- 2.2 Details ----- */
/* 2.2.1 Scrollbars */
/* Google Chrome */
::-webkit-scrollbar-corner {
    background-color: #3B3B3B;
}

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
    background-color: #3B3B3B;
}

::-webkit-scrollbar-thumb {
    -webkit-border-radius: 2px;
    border-radius: 2px;
    background: #888888;
}

/* Google Chrome - Dashboard Drawer */
div.scrollContainer.smoothScrollY::-webkit-scrollbar-corner {
    background-color: transparent !important;
}

div.scrollContainer.smoothScrollY::-webkit-scrollbar {
    width: 2px;
    height: 2px;
    background-color: transparent !important;
}

div.scrollContainer.smoothScrollY::-webkit-scrollbar-thumb {
    -webkit-border-radius: 2px;
    border-radius: 2px;
    background: #888888;
}

/* Google Chrome - Filter Dialog */
.dynamicFilterDialog::-webkit-scrollbar-corner {
    background-color: transparent !important;
}

.dynamicFilterDialog::-webkit-scrollbar {
    width: 2px;
    height: 2px;
    background-color: transparent !important;
}

.dynamicFilterDialog::-webkit-scrollbar-thumb {
    -webkit-border-radius: 2px;
    border-radius: 2px;
    background: #888888;
}

/* remove ugly box around the scroll buttons */
.scrollbuttoncontainer>button>.md-icon {
    color: rgb(238,238,238);
    visibility: visible;
    border-radius: 50%;
}

.scrollbuttoncontainer>button>.md-icon:hover {
    background-color: rgba(0, 0, 0, 0.5);
}

.scrollbuttoncontainer>button {
    visibility: hidden;
}

.scrollbuttoncontainer {
    visibility: hidden;
}

/* 2.2.2 Logos */

/* Login Page */
.imgLogoIcon {
    content: url('data:image/svg+xml;charset=US-ASCII,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0A%3Csvg%20width%3D%2294px%22%20height%3D%2243px%22%20viewBox%3D%220%200%2094%2043%22%20version%3D%221.1%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20xmlns%3Axlink%3D%22http%3A//www.w3.org/1999/xlink%22%3E%0A%20%20%20%20%3C%21--%20Generator%3A%20Sketch%2058%20%2884663%29%20-%20https%3A//sketch.com%20--%3E%0A%20%20%20%20%3Ctitle%3Epiflix%3C/title%3E%0A%20%20%20%20%3Cdesc%3ECreated%20with%20Sketch.%3C/desc%3E%0A%20%20%20%20%3Cg%20id%3D%22piflix%22%20stroke%3D%22none%22%20stroke-width%3D%221%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%0A%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M5.744%2C4.4%20L5.744%2C38%20L9.488%2C38%20L9.488%2C24.752%20L12.8%2C24.752%20C18.128%2C24.752%2020.624%2C21.968%2020.624%2C16.64%20L20.624%2C12.608%20C20.624%2C7.52%2018.368%2C4.4%2013.088%2C4.4%20L5.744%2C4.4%20Z%20M9.488%2C21.392%20L9.488%2C7.808%20L13.088%2C7.808%20C15.824%2C7.808%2016.928%2C9.344%2016.928%2C12.416%20L16.928%2C16.88%20C16.928%2C20.096%2015.584%2C21.392%2012.8%2C21.392%20L9.488%2C21.392%20Z%20M23.552%2C4.4%20L23.552%2C38%20L27.296%2C38%20L27.296%2C4.4%20L23.552%2C4.4%20Z%20M34.88%2C20.048%20L34.88%2C7.808%20L44.48%2C7.808%20L44.48%2C4.4%20L31.136%2C4.4%20L31.136%2C38%20L34.88%2C38%20L34.88%2C23.456%20L42.608%2C23.456%20L42.608%2C20.048%20L34.88%2C20.048%20Z%20M60.8%2C38%20L60.8%2C34.592%20L51.2%2C34.592%20L51.2%2C4.4%20L47.456%2C4.4%20L47.456%2C38%20L60.8%2C38%20Z%20M63.632%2C4.4%20L63.632%2C38%20L67.376%2C38%20L67.376%2C4.4%20L63.632%2C4.4%20Z%20M85.136%2C38%20L79.568%2C23.504%20L73.952%2C38%20L70.4%2C38%20L77.168%2C20.672%20L70.832%2C4.4%20L74.72%2C4.4%20L79.904%2C17.84%20L85.136%2C4.4%20L88.64%2C4.4%20L82.352%2C20.672%20L89.072%2C38%20L85.136%2C38%20Z%22%20fill%3D%22%23E50914%22%20fill-rule%3D%22nonzero%22%3E%3C/path%3E%0A%20%20%20%20%3C/g%3E%0A%3C/svg%3E') !important;
}

/* Main Drawer Mobile */
.adminDrawerLogo img {
    content: url('data:image/svg+xml;charset=US-ASCII,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0A%3Csvg%20width%3D%2294px%22%20height%3D%2243px%22%20viewBox%3D%220%200%2094%2043%22%20version%3D%221.1%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20xmlns%3Axlink%3D%22http%3A//www.w3.org/1999/xlink%22%3E%0A%20%20%20%20%3C%21--%20Generator%3A%20Sketch%2058%20%2884663%29%20-%20https%3A//sketch.com%20--%3E%0A%20%20%20%20%3Ctitle%3Epiflix%3C/title%3E%0A%20%20%20%20%3Cdesc%3ECreated%20with%20Sketch.%3C/desc%3E%0A%20%20%20%20%3Cg%20id%3D%22piflix%22%20stroke%3D%22none%22%20stroke-width%3D%221%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%0A%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M5.744%2C4.4%20L5.744%2C38%20L9.488%2C38%20L9.488%2C24.752%20L12.8%2C24.752%20C18.128%2C24.752%2020.624%2C21.968%2020.624%2C16.64%20L20.624%2C12.608%20C20.624%2C7.52%2018.368%2C4.4%2013.088%2C4.4%20L5.744%2C4.4%20Z%20M9.488%2C21.392%20L9.488%2C7.808%20L13.088%2C7.808%20C15.824%2C7.808%2016.928%2C9.344%2016.928%2C12.416%20L16.928%2C16.88%20C16.928%2C20.096%2015.584%2C21.392%2012.8%2C21.392%20L9.488%2C21.392%20Z%20M23.552%2C4.4%20L23.552%2C38%20L27.296%2C38%20L27.296%2C4.4%20L23.552%2C4.4%20Z%20M34.88%2C20.048%20L34.88%2C7.808%20L44.48%2C7.808%20L44.48%2C4.4%20L31.136%2C4.4%20L31.136%2C38%20L34.88%2C38%20L34.88%2C23.456%20L42.608%2C23.456%20L42.608%2C20.048%20L34.88%2C20.048%20Z%20M60.8%2C38%20L60.8%2C34.592%20L51.2%2C34.592%20L51.2%2C4.4%20L47.456%2C4.4%20L47.456%2C38%20L60.8%2C38%20Z%20M63.632%2C4.4%20L63.632%2C38%20L67.376%2C38%20L67.376%2C4.4%20L63.632%2C4.4%20Z%20M85.136%2C38%20L79.568%2C23.504%20L73.952%2C38%20L70.4%2C38%20L77.168%2C20.672%20L70.832%2C4.4%20L74.72%2C4.4%20L79.904%2C17.84%20L85.136%2C4.4%20L88.64%2C4.4%20L82.352%2C20.672%20L89.072%2C38%20L85.136%2C38%20Z%22%20fill%3D%22%23E50914%22%20fill-rule%3D%22nonzero%22%3E%3C/path%3E%0A%20%20%20%20%3C/g%3E%0A%3C/svg%3E') !important;
}

/* Home Page */
.pageTitleWithLogo {
    background-image: url('data:image/svg+xml;charset=US-ASCII,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0A%3Csvg%20width%3D%2294px%22%20height%3D%2243px%22%20viewBox%3D%220%200%2094%2043%22%20version%3D%221.1%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20xmlns%3Axlink%3D%22http%3A//www.w3.org/1999/xlink%22%3E%0A%20%20%20%20%3C%21--%20Generator%3A%20Sketch%2058%20%2884663%29%20-%20https%3A//sketch.com%20--%3E%0A%20%20%20%20%3Ctitle%3Epiflix%3C/title%3E%0A%20%20%20%20%3Cdesc%3ECreated%20with%20Sketch.%3C/desc%3E%0A%20%20%20%20%3Cg%20id%3D%22piflix%22%20stroke%3D%22none%22%20stroke-width%3D%221%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%0A%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M5.744%2C4.4%20L5.744%2C38%20L9.488%2C38%20L9.488%2C24.752%20L12.8%2C24.752%20C18.128%2C24.752%2020.624%2C21.968%2020.624%2C16.64%20L20.624%2C12.608%20C20.624%2C7.52%2018.368%2C4.4%2013.088%2C4.4%20L5.744%2C4.4%20Z%20M9.488%2C21.392%20L9.488%2C7.808%20L13.088%2C7.808%20C15.824%2C7.808%2016.928%2C9.344%2016.928%2C12.416%20L16.928%2C16.88%20C16.928%2C20.096%2015.584%2C21.392%2012.8%2C21.392%20L9.488%2C21.392%20Z%20M23.552%2C4.4%20L23.552%2C38%20L27.296%2C38%20L27.296%2C4.4%20L23.552%2C4.4%20Z%20M34.88%2C20.048%20L34.88%2C7.808%20L44.48%2C7.808%20L44.48%2C4.4%20L31.136%2C4.4%20L31.136%2C38%20L34.88%2C38%20L34.88%2C23.456%20L42.608%2C23.456%20L42.608%2C20.048%20L34.88%2C20.048%20Z%20M60.8%2C38%20L60.8%2C34.592%20L51.2%2C34.592%20L51.2%2C4.4%20L47.456%2C4.4%20L47.456%2C38%20L60.8%2C38%20Z%20M63.632%2C4.4%20L63.632%2C38%20L67.376%2C38%20L67.376%2C4.4%20L63.632%2C4.4%20Z%20M85.136%2C38%20L79.568%2C23.504%20L73.952%2C38%20L70.4%2C38%20L77.168%2C20.672%20L70.832%2C4.4%20L74.72%2C4.4%20L79.904%2C17.84%20L85.136%2C4.4%20L88.64%2C4.4%20L82.352%2C20.672%20L89.072%2C38%20L85.136%2C38%20Z%22%20fill%3D%22%23E50914%22%20fill-rule%3D%22nonzero%22%3E%3C/path%3E%0A%20%20%20%20%3C/g%3E%0A%3C/svg%3E') !important;
}

/* Drawer */
.drawerLogo {
    background-image: url('data:image/svg+xml;charset=US-ASCII,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0A%3Csvg%20width%3D%2294px%22%20height%3D%2243px%22%20viewBox%3D%220%200%2094%2043%22%20version%3D%221.1%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20xmlns%3Axlink%3D%22http%3A//www.w3.org/1999/xlink%22%3E%0A%20%20%20%20%3C%21--%20Generator%3A%20Sketch%2058%20%2884663%29%20-%20https%3A//sketch.com%20--%3E%0A%20%20%20%20%3Ctitle%3Epiflix%3C/title%3E%0A%20%20%20%20%3Cdesc%3ECreated%20with%20Sketch.%3C/desc%3E%0A%20%20%20%20%3Cg%20id%3D%22piflix%22%20stroke%3D%22none%22%20stroke-width%3D%221%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%0A%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M5.744%2C4.4%20L5.744%2C38%20L9.488%2C38%20L9.488%2C24.752%20L12.8%2C24.752%20C18.128%2C24.752%2020.624%2C21.968%2020.624%2C16.64%20L20.624%2C12.608%20C20.624%2C7.52%2018.368%2C4.4%2013.088%2C4.4%20L5.744%2C4.4%20Z%20M9.488%2C21.392%20L9.488%2C7.808%20L13.088%2C7.808%20C15.824%2C7.808%2016.928%2C9.344%2016.928%2C12.416%20L16.928%2C16.88%20C16.928%2C20.096%2015.584%2C21.392%2012.8%2C21.392%20L9.488%2C21.392%20Z%20M23.552%2C4.4%20L23.552%2C38%20L27.296%2C38%20L27.296%2C4.4%20L23.552%2C4.4%20Z%20M34.88%2C20.048%20L34.88%2C7.808%20L44.48%2C7.808%20L44.48%2C4.4%20L31.136%2C4.4%20L31.136%2C38%20L34.88%2C38%20L34.88%2C23.456%20L42.608%2C23.456%20L42.608%2C20.048%20L34.88%2C20.048%20Z%20M60.8%2C38%20L60.8%2C34.592%20L51.2%2C34.592%20L51.2%2C4.4%20L47.456%2C4.4%20L47.456%2C38%20L60.8%2C38%20Z%20M63.632%2C4.4%20L63.632%2C38%20L67.376%2C38%20L67.376%2C4.4%20L63.632%2C4.4%20Z%20M85.136%2C38%20L79.568%2C23.504%20L73.952%2C38%20L70.4%2C38%20L77.168%2C20.672%20L70.832%2C4.4%20L74.72%2C4.4%20L79.904%2C17.84%20L85.136%2C4.4%20L88.64%2C4.4%20L82.352%2C20.672%20L89.072%2C38%20L85.136%2C38%20Z%22%20fill%3D%22%23E50914%22%20fill-rule%3D%22nonzero%22%3E%3C/path%3E%0A%20%20%20%20%3C/g%3E%0A%3C/svg%3E') !important;
}

/* 2.2.3 Others */
/* CSS Box */
#txtCustomCss {
    height: 300px !important;
    overflow-y: scroll !important;
}

/* Select Box */
select option {
    background-color: #2b2b2b !important;
    color: #ffffff !important;
}

/* Dialogs */
.formDialogHeader:not(.formDialogHeader-clear),
.formDialogFooter:not(.formDialogFooter-clear) {
    background-color: #121212 !important;
    color: #fff;
}

/* Headers */
.skinHeader {
    background-color: #080808 !important;
    color: #fff !important;
}

.skinHeader-withBackground {
    background-color: #080808 !important;
}

@supports (backdrop-filter: blur(1.5em)) or (-webkit-backdrop-filter: blur(1.5em)) {
    .skinHeader-blurred {
        background: rgba(20, 20, 20, 0.7) !important;
        -webkit-backdrop-filter: blur(1.5em) !important;
        backdrop-filter: blur(1.5em) !important;
    }
}

.skinHeader.semiTransparent {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    background-color: rgba(0, 0, 0, 0.4) !important;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(10%, rgba(0, 0, 0, 0.7)), color-stop(10%, transparent)) !important;
    background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.7) 10%, transparent) !important;
    background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.7) 10%, transparent) !important;
    background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.7) 10%, transparent) !important;
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.7) 10%, transparent) !important;
}

.appfooter {
    background: #080808 !important;
    color: #fff !important;
}

@supports (backdrop-filter: blur(10px)) or (-webkit-backdrop-filter: blur(10px)) {
    .appfooter-blurred {
        background: rgba(24, 24, 24, 0.7) !important;
        -webkit-backdrop-filter: blur(20px) !important;
        backdrop-filter: blur(20px) !important;
    }
}

/* TV Global Modifications */
.emby-tab-button-active.emby-button-tv {
    color: #fff !important;
}

.guide-channelHeaderCell,
.guide-channelTimeslotHeader {
    background: #2e2e2e !important;
}

.guide-programTextIcon {
    color: #1e1e1e !important;
    background: #555 !important;
}

.guide-headerTimeslots {
    color: #ccc !important;
}

/* Header Bar Style */
.skinHeader-withBackground {
    background-color: rgba(0, 0, 0, .90) !important;
    border-bottom: transparent !important;
}

.skinHeader.semiTransparent {
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, .9)), to(rgba(0, 0, 0, 0.3))) !important;
    background: -webkit-linear-gradient(rgba(0, 0, 0, .9), rgba(0, 0, 0, 0.3)) !important;
    background: -o-linear-gradient(rgba(0, 0, 0, .9), rgba(0, 0, 0, 0.3)) !important;
    background: linear-gradient(rgba(0, 0, 0, .9), rgba(0, 0, 0, 0.3)) !important;
    border-bottom: none !important;
}

/* remove the "get premiere" button */
.btnHeaderPremiere {
    display: none;
}

/* make cards more boxy */
.cardBox {
    margin: 2px;
    border-radius: 0%;
}

.cardContent {
    /*border: 1px solid rgba(40,40,40,.5);*/
    border: none;
    border-radius: 0%;
}

/* fix the stupid ripple effect */
.paper-icon-button-light>.md-icon {
    visibility: visible;
}

.paper-icon-button-light {
    visibility: hidden;
}

.headerUserButton {
    display: none;
}

.headerManageServerButton {
    display: none;
}

/* give the buttons a hover effect */
.emby-button>i:hover,
.detailButton-content:hover {
    -webkit-transition: all 0.1s ease-out;
    -moz-transition: all 0.1s ease-out;
    -ms-transition: all 0.1s ease-out;
    -o-transition: all 0.1s ease-out;
    transition: all .1s ease-in-out;
    transform: scale(1.2);
    -moz-text-shadow: 0 0 5px #222326;
    -webkit-text-shadow: 0 0 5px #222326;
    text-shadow: 0px 0px 5px #222326;
}

.paper-icon-button-light:focus {
    color: #222326 !important;
    background-color: rgba(34, 35, 38, .3) !important;
}

.paper-icon-button-light:hover {
    -webkit-transition: all 0.1s ease-out;
    -moz-transition: all 0.1s ease-out;
    -ms-transition: all 0.1s ease-out;
    -o-transition: all 0.1s ease-out;
    transition: all 0.1s ease-in-out;
    transform: scale(1.2);
    -moz-text-shadow: 0 0 5px #222326;
    -webkit-text-shadow: 0 0 5px #222326;
    text-shadow: 0px 0px 5px #222326;
}

/* ----- 2.3 Fixes ----- */
/* 2.3.1 Dark Colors */
.autoorganizetable tbody tr:nth-child(odd) td,
.autoorganizetable tbody tr:nth-child(odd) th {
    background-color: #222326 !important;
}

.autoorganizetable>.table>tbody>tr {
    border: 1px solid #222326 !important;
}

/*
_____________________________________________________________________

    Emby Dark Themes is maintained by Ben Z (BenZuser)
    with the contribution of Happy2Play.
_____________________________________________________________________

*/
/* TEMPORARY FIXES */
/* Links */
.searchSuggestionsList a,
.noItemsMessage a,
a.lnkPremiere {
    color: #E81123 !important;
}

.searchSuggestionsList a:hover,
.noItemsMessage a:hover,
a.lnkPremiere:hover {
    color: #9b9b9b !important;
}

.searchSuggestionsList a:active,
.noItemsMessage a:active,
a.lnkPremiere:active {
    color: #94131E !important;
}

/* change the progress bar and ball color */
.emby-slider-background-lower,
.sliderBubble,
.emby-slider::-webkit-slider-thumb {
    background: #E81123 !important;
}

/*Chrome*/

.emby-slider::-moz-range-thumb,
.mdl-slider:active::-moz-range-thumb,
.emby-slider::-moz-range-progress,
.sliderBubble {
    background: #E81123 !important;
}

/*FireFox*/

/* ? */
.subtitleappearance-preview {
    background: #E81123 !important;
}

/* Add checkbox color in parameters Menu */
.emby-checkbox:checked+span+span+.checkboxOutline,
.itemProgressBarForeground {
    background-color: #E81123 !important;
}

/* Add color to icon in home page parameters */
.listItemIcon:not(.listItemIcon-transparent) {
    background-color: #E81123 !important;
}

/*Library Show Advanced setting switch*/
.mdl-switch__input:checked+.mdl-switch__label+.mdl-switch__trackContainer>.mdl-switch__track {
    background: rgba(232, 17, 35, .5) !important;
}

.mdl-switch__input:checked:focus+.mdl-switch__label+.mdl-switch__trackContainer .mdl-switch__focus-helper {
    -webkit-box-shadow: 0 0 0 1.39em rgba(232, 17, 35, .26) !important;
    box-shadow: 0 0 0 1.39em rgba(232, 17, 35, .26) !important;
    background-color: rgba(232, 17, 35, .26) !important;
}

.mdl-switch__input:checked+.mdl-switch__label+.mdl-switch__trackContainer>.mdl-switch__thumb {
    background: #E81123 !important;
}

Is there anyway to get this to work on the mobile app?

Is there a way to edit the "Logo"?

Is there a way to edit the "Logo"?

.pageTitleWithLogo {
background-image: url('https://upload.wikimedia.org/wikipedia/commons/0/08/Netflix_2015_logo.svg') !important;
}
You need to remove the existing code

Be very careful installing this CSS. Once you apply it, you'll lose the ability to access your settings page from Emby. Make a copy of the URL to go to your settings.