.headerUserImage, .navMenuOption, .pageTitle { vertical-align: middle; } .detailButton-mobile, .itemLinks, .listPaging, .sectionTabs, .viewSettings { text-align: center; } .headerSelectedPlayer, .itemMiscInfo, .navMenuOptionText { -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden; } .libraryPage { padding-top: 7em !important; } .itemDetailPage { padding-top: 0em !important; } .standalonePage { padding-top: 4.5em !important; } .wizardPage { padding-top: 7em !important; } .libraryPage:not(.noSecondaryNavPage) { padding-top: 7.5em !important; } .absolutePageTabContent { position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; margin: 0 !important; top: 6.9em !important; -webkit-transition: -webkit-transform .2s ease-out; -o-transition: transform .2s ease-out; transition: transform .2s ease-out; } .pageTabContent:not(.is-active) { display: none !important; } .headerUserImage { -webkit-background-size: contain; background-size: contain; background-repeat: no-repeat; background-position: center center; -webkit-border-radius: 100em; border-radius: 100em; display: inline-block; } .headerUserButtonRound div { -webkit-border-radius: 100em; border-radius: 100em; background-size: cover; background-repeat: no-repeat; background-position: center center; } .headerButton { -webkit-flex-shrink: 0; flex-shrink: 0; } .hideMainDrawer .mainDrawerButton { display: none; } .headerLeft, .headerRight { justify-content: center; } .headerRight { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-box-pack: end; -webkit-justify-content: flex-end; justify-content: flex-end; } .noHeaderRight .headerRight, .noHomeButtonHeader .headerHomeButton { display: none !important; } .pageTitle { display: -webkit-inline-box; display: -webkit-inline-flex; display: inline-flex; margin: 0.3em 0 0 0.5em; height: 1.7em; -webkit-box-align: center; -webkit-align-items: center; align-items: center; -webkit-flex-shrink: 1; flex-shrink: 1; } .headerLeft, .skinHeader { display: -webkit-box; display: -webkit-flex } .detailButton-mobile, .skinHeader { flex-direction: column; -webkit-flex-direction: column; -webkit-box-orient: vertical; -webkit-box-direction: normal } .pageTitleWithLogo { background-position: left center; -webkit-background-size: contain; background-size: contain; background-repeat: no-repeat; width: 13.2em; } .skinHeader { position: fixed; right: 0; left: 0; z-index: 999; top: 0; border: 0; display: flex; flex-direction: column; contain: layout style paint; } .headerLeft, .headerRight { -webkit-box-align: center } .hiddenViewMenuBar .skinHeader { display: none; } .headerTop { padding: 0.54em 0; } .headerLeft { display: flex; -webkit-align-items: center; align-items: center; -webkit-box-flex: 1; -webkit-flex-grow: 1; flex-grow: 1; overflow: hidden; justify-content: flex-start; } .sectionTabs { width: 100%; } .selectedMediaFolder { background-color: #f2f2f2 !important; } .navMenuOption { display: -webkit-box !important; display: -webkit-flex !important; display: flex !important; -webkit-box-align: center; -webkit-align-items: center; align-items: center; text-decoration: none; color: inherit; padding: .9em 0 .9em 2.4em !important; -webkit-box-flex: 1; -webkit-flex-grow: 1; flex-grow: 1; font-weight: 400 !important; margin: 0 !important; -webkit-border-radius: 0 !important; border-radius: 0 !important; } .navMenuOptionIcon { margin-right: 1.2em; -webkit-flex-shrink: 0; flex-shrink: 0; } .navMenuOptionText { white-space: nowrap; } .sidebarHeader { padding-left: 1.2em; margin: 1em 0 0.5em; } .dashboardDocument .skinBody { -webkit-transition: left ease-in-out .3s, padding ease-in-out .3s; -o-transition: left ease-in-out .3s, padding ease-in-out .3s; transition: left ease-in-out .3s, padding ease-in-out .3s; position: absolute; top: 0; right: 0; bottom: 0; left: 0; } .layout-desktop .searchTabButton, .layout-mobile .searchTabButton, .layout-tv .headerSearchButton { display: none !important; } .mainDrawer-scrollContainer { padding-bottom: 10vh; } @media all and (min-width: 40em) { .dashboardDocument .adminDrawerLogo, .dashboardDocument .mainDrawerButton { display: none !important; } .dashboardDocument .mainDrawer { z-index: inherit !important; left: 0 !important; top: 0 !important; -webkit-transform: none !important; transform: none !important; -webkit-box-shadow: none !important; box-shadow: none !important; width: 20.205em !important; font-size: 94%; } .dashboardDocument .mainDrawer-scrollContainer { margin-top: 5em !important; } .dashboardDocument .skinBody { left: 20em; } } @media all and (max-width: 60em) { .libraryDocument .mainDrawerButton { display: none; } } @media all and (max-width: 84em) { .withSectionTabs .headerTop { padding-bottom: 0.2em; } .sectionTabs { font-size: 83.5%; } } @media all and (min-width: 84em) { .headerTop { padding: 1.489em 0; } .headerTabs { -webkit-align-self: center; align-self: center; width: auto; -webkit-box-align: center; -webkit-align-items: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; margin-top: -3.34em; position: relative; top: -1.05em; } .libraryPage:not(.noSecondaryNavPage) { padding-top: 4.6em !important; } .pageWithAbsoluteTabs:not(.noSecondaryNavPage) { padding-top: 6.7em !important; } .absolutePageTabContent { top: 5.7em !important; } .dashboardDocument .mainDrawer-scrollContainer { margin-top: 6em !important; } } .headerSelectedPlayer { max-width: 10em; white-space: nowrap; } @media all and (max-width: 37.5em) { .headerSelectedPlayer { display: none; } } .hidingAnimatedTab { visibility: hidden; } .headerArrowImage { height: 20px; margin-left: 0.5em; } .backdropContainer { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: -1; } .libraryPage .header { padding-bottom: 0; } .flexPageTabContent.is-active { display: -webkit-box !important; display: -webkit-flex !important; display: flex !important; } .viewSettings { margin: 0 0 0.25em; } .listTopPaging, .viewControls { display: inline-block; } .viewControls + .listTopPaging { margin-left: 0.5em !important; } .criticReview { margin: 1.5em 0; background: #222; padding: .8em .8em .8em 3em; -webkit-border-radius: .3em; border-radius: .3em; position: relative; } .detailLogo, .itemBackdrop { background-repeat: no-repeat; background-position: center center; } .criticReview:first-child { margin-top: 0.5em; } .criticReview img { width: 2.4em; } .criticRatingScore { margin-bottom: 0.5em; } .itemTag { display: inline-block; margin-right: 1em; } .itemOverview { white-space: pre-wrap; } .itemLinks { padding: 0; } .itemLinks p { margin: 0.5em 0; } .reviewLink, .reviewerName { margin-top: 0.5em; } .reviewerName { color: #ccc; } .reviewDate { margin-left: 1em; } .reviewScore { position: absolute; left: 0.8em; } .itemBackdrop { -webkit-background-size: cover; background-size: cover; background-repeat: no-repeat; background-position: center; height: 50vh; position: relative; } .itemBackdropProgressBar { position: absolute !important; bottom: 0; left: 0; right: 0; } .desktopMiscInfoContainer { position: absolute; bottom: 0.75em; } .detailPagePrimaryContainer { display: flex; align-items: center; align-content: center; position: sticky; background-color: #101010; top: 0; z-index: 2; } .layout-mobile .detailPagePrimaryContainer { display: block; position: relative; } .layout-tv .detailPagePrimaryContainer { position: relative; } .infoWrapper { flex: 1 0 0; } .infoText { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: left; } .detailPageSecondaryContainer { margin: 1.25em 0; display: flex; flex-direction: column; padding-left: 2%; padding-right: 2%; } .detailImageContainer { margin: 1.25em 0; position: sticky; top: 15%; float: left; width: 22.786458333333332vw; } .layout-mobile .detailImageContainer, .layout-tv .detailImageContainer { position: relative; } .detailPagePrimaryContent { position: relative; -webkit-box-flex: 1; -webkit-flex-grow: 1; flex-grow: 1; } .detailLogo { width: 25em; height: 9.375em; position: absolute; top: 14.5%; right: 10.5%; -webkit-background-size: contain; background-size: contain; } @media all and (max-width: 87.5em) { .detailLogo { right: 5%; } } @media all and (max-width: 75em) { .detailLogo { right: 2%; } } @media all and (max-width: 68.75em) { .detailLogo { width: 14.91em; height: 3.5em; right: 5%; bottom: 5%; top: auto; background-position: center right; display: none; } } .itemDetailImage { width: 100% !important; box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37); -webkit-box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37); } @media all and (max-width: 62.5em) { .detailPageContent { position: relative; } .btnPlaySimple { display: none !important; } } @media all and (max-width: 75em) { .lnkSibling { display: none !important; } } .parentName { display: block; margin-bottom: 0.5em; } .emby-button.detailFloatingButton { position: absolute; background-color: rgba(0, 0, 0, 0.5) !important; z-index: 1; top: 50%; left: 50%; margin: -2.2em 0 0 -2.2em; padding: 0.4em !important; color: rgba(255, 255, 255, .76); } .emby-button.detailFloatingButton i { font-size: 3.5em; } @media all and (max-width: 62.5em) { .parentName { margin-bottom: 1em; } .itemDetailPage { padding-top: 0 !important; } .detailimg-hidemobile { display: none; } } @media all and (min-width: 31.25em) { .mobileDetails { display: none; } } @media all and (max-width: 31.25em) { .desktopDetails { display: none !important; } } .detailButton-mobile, .mainDetailButtons { display: flex; display: -webkit-box; display: -webkit-flex } .itemName { margin: 0.5em 0; } .empty { margin: 0; } .detailCollapsibleSection:not(.hide) + .detailCollapsibleSection { margin-top: -2em; } .detailPageCollabsible { margin-top: 0; } .mainDetailButtons { display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; -webkit-flex-wrap: wrap; flex-wrap: wrap; margin: 1em 0; } .recordingFields button { margin-left: 0; margin-right: .5em; -webkit-flex-shrink: 0; flex-shrink: 0; } .mainDetailButtons.hide + .recordingFields { margin-top: 1.5em !important; } .detailButton-mobile { display: flex; flex-direction: column; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; align-items: center; margin: 0 !important; padding: 0.5em 0.7em !important; } .detailButton { margin: 0 0.5em 0 0 !important; } @media all and (min-width: 29em) { .detailButton-mobile { padding-left: 0.75em !important; padding-right: 0.75em !important; } } @media all and (min-width: 32em) { .detailButton-mobile { padding-left: 0.8em !important; padding-right: 0.8em !important; } } @media all and (min-width: 35em) { .detailButton-mobile { padding-left: 0.85em !important; padding-right: 0.85em !important; } } .detailButton-mobile-content { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; align-items: center; } .detailButton-mobile-icon { font-size: 1.6em !important; width: 1em; height: 1em; } .detailImageProgressContainer { margin-left: 6px; width: 21.886458333333332vw; } .detailButton-mobile-text { margin-top: 0.7em; font-size: 80%; font-weight: 400; } @media all and (max-width: 62.5em) { .mainDetailButtons { margin-left: -0.5em; } .detailButton { display: none !important; } } @media all and (min-width: 62.5em) { .detailFloatingButton { display: none !important; } .mainDetailButtons { font-size: 108%; margin: 1.25em 0; } } @media all and (max-width: 50em) { .editorMenuLink { display: none; } } .itemMiscInfo { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -webkit-align-items: center; align-items: center; } @media all and (max-width: 31.25em) { .mobileDetails .itemMiscInfo { text-align: center; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; } .itemMiscInfo .endsAt { display: none; } } .layout-tv .detailVerticalSection { margin-bottom: 3.4em !important; } .detailPageContent { border-spacing: 0; border-collapse: collapse; } @media all and (max-width: 62.5em) { .detailPageContent-nodetailimg { padding-top: 0; } } .mediaInfoStream { margin: 0 3em 0 0; display: inline-block; vertical-align: top; } .mediaInfoStreamType { display: block; margin: 1em 0; } .mediaInfoAttribute, .mediaInfoLabel { display: inline-block; } .mediaInfoLabel { margin-right: 1em; font-weight: 600; } .recordingProgressBar::-moz-progress-bar { background-color: #c33; } .recordingProgressBar::-webkit-progress-value { background-color: #c33; } .recordingProgressBar[aria-valuenow]:before { background-color: #c33; } .timelineHeader { margin-bottom: 0.25em; line-height: 1.25em; line-height: initial; } .itemsContainer { margin: 0 auto; } @media all and (max-height: 31.25em) { .itemBackdrop { height: 52vh; } } @media all and (max-width: 75em) { .listViewUserDataButtons { display: none !important; } } @media all and (max-width: 62.5em) { .detailsHiddenOnMobile { display: none; } } .btnSyncComplete { background: #673ab7 !important; } .btnSyncComplete i { -webkit-border-radius: 100em; border-radius: 100em } .bulletSeparator { margin: 0 0.35em; } .mediaInfoIcons { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; margin: 1em 0; -webkit-flex-wrap: wrap; flex-wrap: wrap; } .verticalSection-extrabottompadding { margin-bottom: 2.7em; } .sectionTitleButton, .sectionTitleIconButton { margin-right: 0 !important; display: inline-block; vertical-align: middle; } .sectionTitleContainer { margin: 1.25em 0; } .sectionTitleContainer > .sectionTitle { margin: 0; display: inline-block; vertical-align: middle; } /* these next two rules are for the scroller element headers */ .sectionTitleContainer-cards { margin: 0; padding-top: 1.25em; } div:not(.sectionTitleContainer-cards) > .sectionTitle-cards { margin: 0; padding-top: 1.25em; } .sectionTitleButton { margin-left: 1.5em !important; -webkit-flex-shrink: 0; flex-shrink: 0; } .sectionTitleButton + .sectionTitleButton { margin-left: 0.5em !important; } .sectionTitleIconButton { margin-left: 1.5em !important; -webkit-flex-shrink: 0; flex-shrink: 0; font-size: 84% !important; padding: 0.5em !important; } .horizontalItemsContainer { display: -webkit-box; display: -webkit-flex; display: flex; } .sectionTitleTextButton { margin: 0 !important; display: -webkit-inline-box !important; display: -webkit-inline-flex !important; display: inline-flex !important; color: inherit !important; } .sectionTitleTextButton:not(.padded-left) { padding: 0 !important; } .sectionTitleTextButton.padded-left { padding-bottom: 0 !important; padding-right: 0 !important; padding-top: 0 !important; } .sectionTitleTextButton > .sectionTitle { margin-bottom: 0; margin-top: 0; } .padded-left { padding-left: 3.3%; } .padded-right { padding-right: 3.3%; } .padded-top { padding-top: 1em; } .padded-bottom { padding-bottom: 1em; } .layout-tv .padded-top-focusscale { padding-top: 1em; margin-top: -1em; } .layout-tv .padded-bottom-focusscale { padding-bottom: 1em; margin-bottom: -1em; } @media all and (min-height: 31.25em) { .padded-left-withalphapicker { padding-left: 7.5%; } .padded-right-withalphapicker { padding-right: 7.5%; } } .searchfields-icon { color: #aaa; } .button-accent-flat { color: #00a4dc !important; } .clearLink { text-decoration: none; font-weight: inherit !important; vertical-align: middle; color: inherit !important; } .itemsViewSettingsContainer { -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; } @media all and (min-width: 40em) { .listIconButton-autohide { display: none !important; } } @media all and (max-width: 40em) { .listTextButton-autohide { display: none !important; } } .itemsViewSettingsContainer > .button-flat { margin: 0; }