@import url("https://fonts.googleapis.com/css2?family=Cantarell:ital,wght@0,400;0,700;1,400;1,700&display=swap");
:root {
  --primary-r: 0;
  --primary-g: 164;
  --primary-b: 220;
  --primary-accent-color: rgba(var(--primary-r), var(--primary-g), var(--primary-b), 1.0);
  --secondary-accent-color: #00a4dc20;
  --primary-background-color: #101010;
  --secondary-background-color: #181818;
  --primary-background-transparent: rgba(35, 35, 35, 0.5);
  --secondary-background-transparent: rgba(0, 0, 0, 0.6);
  --rounded-cards: 0px;
  --blur: 10px;
  --primary-alt1: rgba(calc(var(--primary-r) - 30), calc(var(--primary-g) - 30), calc(var(--primary-b) - 30), 1);
  --primary-alt2: rgba(calc(var(--primary-r) - 30), calc(var(--primary-g) - 30), calc(var(--primary-b) - 30), 0.85);
  --primary-alt3: rgba(calc(var(--primary-r) - 30), calc(var(--primary-g) - 30), calc(var(--primary-b) - 30), 0.7);
  --primary-alt4: rgba(calc(var(--primary-r) - 30), calc(var(--primary-g) - 30), calc(var(--primary-b) - 30), 0.55);
  --primary-alt5: rgba(calc(var(--primary-r) - 30), calc(var(--primary-g) - 30), calc(var(--primary-b) - 30), 0.4);
}

* {
  scrollbar-color: #093d4e #062630 !important;
}

.backgroundContainer:not(.withBackdrop) {
  background-color: unset !important;
}

.dialog:not(.withBackdrop),
.nowPlayingPlaylist:not(.withBackdrop),
.nowPlayingContextMenu:not(.withBackdrop),
html {
  background-color: #010e18 !important;
}

.detailRibbon {
  background-color: rgba(1, 14, 24, 0.8) !important;
}

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

.skinHeader-withBackground.osdHeader {
  background-color: transparent !important;
}

.mainDrawer, .drawer-open {
  background-color: #010e18 !important;
}

.noBackdropTransparency .detailPageSecondaryContainer {
  background-color: rgba(1, 14, 24, 0.8) !important;
}

.collapseContent, .paperList, .visualCardBox {
  background-color: unset !important;
}

.formDialogFooter:not(.formDialogFooter-clear), .formDialogHeader:not(.formDialogHeader-clear) {
  background-color: #010e18 !important;
}

.pageTitleWithLogo {
  background-image: url(https://compare.farnkopf.net/assets/bootstrap/fvideo.png);
}

.itemsContainer > .card > .cardBox {
  margin-left: 0;
  margin-right: 1.2em;
  background-color: rgba(0, 0, 0, 0.2117647059) !important;
  box-shadow: 0 0 9px black;
}

.card-hoverable:hover .cardImageContainer {
  background-size: 120%;
}

.cardImageContainer {
  background-size: 105%;
  transition: background-size 0.3s ease;
}

.cardBox-bottompadded {
  padding-bottom: 5px !important;
}

.listItem:hover,
.navMenuOption:hover {
  background: #042238 !important;
}

.navMenuOption-selected {
  background: #093d4e !important;
}

.emby-button.fab, .emby-button.raised {
  background: #062630 !important;
}
.emby-button.fab:hover, .emby-button.raised:hover {
  background: #093d4e !important;
}
.emby-button.button-submit {
  background: #00a4dc !important;
}
.emby-button.button-submit:hover {
  background: #07c0ff !important;
}

a[data-role=button] {
  background: #062630 !important;
}
a[data-role=button]:hover {
  background: #093d4e !important;
}

.emby-input,
.emby-textarea,
.emby-select-withcolor {
  background: #062630 !important;
  border-color: #154b5c !important;
}
.emby-input option,
.emby-textarea option,
.emby-select-withcolor option {
  background: #062630 !important;
}

.cardTextCentered > .textActionButton {
  text-align: center;
  font-size: 16px;
}

.cardText-secondary {
  font-size: 10px;
}

.cardIndicators {
  top: 0;
  right: 0;
}
.cardIndicators .countIndicator, .cardIndicators .playedIndicator {
  border-radius: 0 0 0 20%/0 0 0 20% !important;
}

.MuiDrawer-docked .MuiDrawer-paperAnchorLeft {
  background-color: #010e18 !important;
}

#itemDetailPage .childrenItemsContainer.itemsContainer.vertical-list {
  display: grid;
  gap: 1em;
  grid-template-columns: 1fr 1fr 1fr;
}
@media (max-width: 1024px) {
  #itemDetailPage .childrenItemsContainer.itemsContainer.vertical-list {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 768px) {
  #itemDetailPage .childrenItemsContainer.itemsContainer.vertical-list {
    grid-template-columns: 1fr;
  }
}
#itemDetailPage .childrenItemsContainer.itemsContainer.vertical-list .listItem-content {
  flex-direction: column;
}
#itemDetailPage .childrenItemsContainer.itemsContainer.vertical-list .listItemBody {
  contain: layout style;
  display: -webkit-flex;
  display: flex;
  width: 100%;
  margin: 0 !important;
  padding: 9px 0 0;
}
@media (max-width: 768px) {
  #itemDetailPage .childrenItemsContainer.itemsContainer.vertical-list .listItemBody {
    padding-top: 9px;
  }
}
#itemDetailPage .childrenItemsContainer.itemsContainer.vertical-list .listItem-largeImage {
  contain: layout style;
  display: -webkit-flex;
  display: flex;
  width: 100%;
  margin: 0 !important;
  padding: 0;
  transition: background 0.25s;
  background-color: rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 5px black;
}
#itemDetailPage .childrenItemsContainer.itemsContainer.vertical-list .listItem-largeImage:hover {
  background-color: rgba(0, 0, 0, 0.65) !important;
}
#itemDetailPage .childrenItemsContainer.itemsContainer.vertical-list .listItemBodyText {
  padding-left: 0.8em !important;
}
#itemDetailPage .childrenItemsContainer.itemsContainer.vertical-list .listItemImage-large {
  height: 13vw;
  width: 100%;
  padding: 0 !important;
  margin: 0 !important;
}
@media (max-width: 768px) {
  #itemDetailPage .childrenItemsContainer.itemsContainer.vertical-list .listItemImage-large {
    height: 40vw;
  }
}

.listItem-bottomoverview {
  overflow: hidden;
  white-space: nowrap !important;
  width: 94% !important;
  padding-left: 0.8em !important;
  text-overflow: ellipsis !important;
}

#itemDetailPage .childrenItemsContainer.itemsContainer.vertical-list .listItem-overview {
  overflow: hidden;
  text-align: start;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 90%;
}

@media (max-width: 64em) {
  .listItemImageButton, .listItemIndicators {
    font-size: 1.3em !important;
  }
}
[dir=ltr] .cardIndicators {
  right: 0 !important;
}

.sliderMarkerContainer {
  display: none !important;
}

.upNextContainer {
  z-index: 100000 !important;
}

.featurediframe {
  width: 95vw;
  height: 23.5em;
  display: block;
  border: 0px solid #000;
  margin: 0 auto;
  margin-bottom: 0em;
  margin-top: 1em;
}

@media (min-width: 3158px) {
  .featurediframe {
    height: 50em;
  }
}
@media (min-width: 2601px) and (max-width: 3157px) {
  .featurediframe {
    height: 33em;
  }
}
@media (min-width: 2000px) and (max-width: 2600px) {
  .featurediframe {
    height: 27em;
    font-size: 133%;
  }
  .layout-desktop #homeTab .sections.homeSectionsContainer {
    margin-top: -3em !important;
  }
}
@media (max-width: 1000px) and (orientation: portrait) {
  .featurediframe {
    height: 12em;
    margin-bottom: -4em;
  }
}
@media (max-width: 1000px) and (orientation: landscape) {
  .featurediframe {
    height: 26em;
    margin-bottom: -7em;
  }
}
@media (max-width: 1200px) and (min-width: 1001px) and (orientation: landscape) {
  .featurediframe {
    margin-bottom: -4em;
  }
}
@media (max-width: 400px) and (orientation: portrait) {
  .featurediframe {
    height: 24vh;
    margin-bottom: -4em;
  }
}
@media (max-height: 400px) and (orientation: landscape) {
  .featurediframe {
    height: 100vh;
  }
}
@media screen and (aspect-ratio: 4/3) {
  .featurediframe {
    height: 25em;
  }
}
@media screen and (aspect-ratio: 3/4) {
  .featurediframe {
    height: 25em;
    margin-bottom: -5em;
  }
}
@media screen and (aspect-ratio: 16/10) and (max-height: 1200px) {
  .featurediframe {
    height: 34em;
    margin-bottom: -5em;
  }
}
@media screen and (aspect-ratio: 10/16) and (max-height: 1280px) {
  .featurediframe {
    height: 25em;
    margin-bottom: -5em;
  }
}
@media (min-aspect-ratio: 21/9) and (min-width: 3000px) {
  .featurediframe {
    height: 50em;
  }
}
.layout-desktop .skinHeader,
.layout-tv .skinHeader {
  padding-top: 1.5em !important;
}

.layout-tv .skinHeader {
  padding-bottom: 10px !important;
}

.layout-desktop .headerTabs {
  margin: -58px 0 10px 160px !important;
}

.layout-tv .headerTabs {
  margin-bottom: 10px !important;
}

.headerRight,
.emby-tab-button {
  height: 45px !important;
}

.layout-desktop .headerRight {
  padding: 0 5px !important;
}

.layout-tv .headerRight {
  padding: 20px 10px !important;
}

/* Move left header back up */
.layout-desktop .headerLeft,
.layout-tv .headerLeft {
  position: relative !important;
  top: -17px !important;
}

/* Mobile fixes */
.layout-mobile .headroom--unpinned {
  transform: translateY(-50%);
}

.layout-mobile .sectionTabs {
  margin: 0 auto !important;
  width: auto !important;
  max-width: 100% !important;
}

.layout-mobile .emby-button-foreground {
  top: -2px !important;
}

.layout-mobile .skinHeader {
  transition: 0.1s !important;
}

.layout-mobile .mainDrawer {
  background: var(--secondary-background-color) !important;
}

.layout-mobile .headroom--not-top {
  background: var(--primary-background-transparent) !important;
  backdrop-filter: blur(var(--blur)) !important;
}

.layout-mobile .headroom--top {
  background: transparent !important;
  backdrop-filter: none !important;
}

@media (max-width: 380px) {
  .layout-mobile .pageTitle:not(.pageTitleWithLogo):not(:empty) {
    position: absolute !important;
    margin-left: 50% !important;
    transform: translate(-50%, 0) !important;
    top: 60px !important;
  }
  .layout-mobile .skinHeader:has(.pageTitle:not(.pageTitleWithLogo):not(:empty)) {
    height: 110px !important;
  }
  .layout-mobile .libraryPage:not(.noSecondaryNavPage) {
    padding-top: 9.5em !important;
  }
}
.itemSelectionPanel {
  border: 2px solid var(--primary-accent-color) !important;
}

.itemSelectionPanel .checkboxOutline {
  margin: 7px !important;
}

/* My Media Card size */
.layout-desktop #indexPage .verticalSection.section0 .card.overflowBackdropCard.card-hoverable.card-withuserdata {
  width: 23.4em;
  padding-bottom: 1.5em;
}

#indexPage .raised {
  background: rgba(0, 0, 0, 0.8509803922);
  border: 2px solid #294b57;
  border-radius: 0.5em;
}

.layout-desktop #indexPage .raised:hover {
  background: rgba(160, 2, 2, 0.6196078431);
  border: 2px solid #294b57;
  color: white;
}

.layout-desktop #indexPage .homeLibraryButton {
  min-width: 13.65em;
  margin: 0.5em 1.46em 0.5em 0.5em !important;
}

/* Other layout adjustments */
.layout-desktop .headerRight {
  margin-bottom: 0 !important;
}

@media (max-width: 1599px) {
  .layout-desktop .pageTitleWithLogo {
    margin-left: 25px !important;
  }
}
@media (width: 1600px) {
  .layout-desktop .emby-button-foreground {
    top: -4px !important;
  }
}
/* Plugins & Player modifications */
.upNextContainer:not(#skipIntro),
.toastVisible {
  backdrop-filter: blur(var(--blur)) !important;
}

.upNextContainer:not(#skipIntro) {
  border-radius: var(--rounded-cards) !important;
  background-color: rgba(0, 0, 0, 0.6) !important;
}

.sliderBubble {
  border-radius: var(--rounded-cards) !important;
  background-color: var(--secondary-background-transparent) !important;
  backdrop-filter: blur(var(--blur)) !important;
}

#skipIntro .btnSkipIntro {
  transition: 0.2s;
  border-radius: 100px !important;
}

#skipIntro .btnSkipIntro:hover {
  transform: scale(1.05);
  background: var(--primary-accent-color) !important;
}

.cardPadder,
.cardOverlayContainer,
.blurhash-canvas,
.dialog,
.itemSelectionPanel {
  border-radius: var(--rounded-cards) !important;
}

/* Rounded selection menu */
.itemSelectionPanel {
  border: 2px solid var(--primary-accent-color) !important;
}

.itemSelectionPanel .checkboxOutline {
  margin: 7px !important;
}

.sliderMarker {
  opacity: 1 !important;
  transition: 0.2s !important;
  height: 10px !important;
  transform: translate3d(0, 40%, 0) !important;
  -webkit-transform: translate3d(0, 40%, 0) !important;
}

.sliderMarker.watched {
  background-color: rgba(255, 255, 255, 0.5647058824) !important;
  z-index: 10 !important;
}

#skipIntro .upNextContainer {
  padding: 0px !important;
}

#skipIntro .emby-button {
  background: rgba(30, 30, 30, 0.7) !important;
}

#skipIntro .emby-button:hover {
  box-shadow: 0 0 8px rgba(var(--primary-accent-color), 0.6) !important;
}

#skipIntro .emby-button:focus {
  background: rgba(30, 30, 30, 0.7) !important;
  box-shadow: unset !important;
}

/* Support for InPlayerEpisodePreview plugin */
.layout-desktop #popupFocusContainer {
  padding: 10px !important;
}

.layout-desktop #popupTitleContainer {
  margin: 0px !important;
  padding: 10px 0px 10px 0px !important;
}

.layout-desktop #popupContentContainer .previewEpisodeDetails {
  position: unset !important;
  margin: 0px 0px 6px 10px !important;
  /* Rounded selection menu */
  font-size: 13.5px !important;
}
.layout-desktop #popupContentContainer .previewEpisodeDetails .cardContent,
.layout-desktop #popupContentContainer .previewEpisodeDetails .cardPadder,
.layout-desktop #popupContentContainer .previewEpisodeDetails .cardOverlayContainer,
.layout-desktop #popupContentContainer .previewEpisodeDetails .blurhash-canvas,
.layout-desktop #popupContentContainer .previewEpisodeDetails .dialog,
.layout-desktop #popupContentContainer .previewEpisodeDetails .itemSelectionPanel {
  border-radius: var(--rounded-cards) !important;
}
.layout-desktop #popupContentContainer .previewEpisodeDetails .itemSelectionPanel {
  border: 2px solid var(--primary-accent-color) !important;
}
.layout-desktop #popupContentContainer .previewEpisodeDetails .itemSelectionPanel .checkboxOutline {
  margin: 7px !important;
}

.layout-desktop #popupContentContainer .previewEpisodeTitle {
  font-size: 16.5px !important;
}

.layout-desktop #popupContentContainer .listItem {
  padding: 0.25em 0.25em 0.25em 0.5em !important;
}

/* Modify player buttons */
.material-icons.fast_rewind::before {
  content: "\e059";
}

.material-icons.fast_forward::before {
  content: "\e057";
}

.material-icons.audiotrack::before {
  content: "\e91f";
}

/* Support for Jellyscrub plugin */
.chapterThumbContainer {
  background: none !important;
  box-shadow: unset !important;
}

.chapterThumb {
  border-radius: var(--rounded-cards) !important;
  margin-bottom: 47px !important;
  box-shadow: 0 0 1.9vh #000 !important;
}

.chapterThumbTextContainer {
  background: none !important;
}

.chapterThumbText {
  text-align: center !important;
} /* Fix for header buttons */
.layout-desktop .emby-button-foreground {
  top: -9px !important;
}

.layout-tv .emby-button-foreground {
  top: -14px !important;
}

.chapterThumbText-dim {
  display: none !important;
}

/* Player modifications */
.upNextContainer:not(#skipIntro), .toastVisible {
  backdrop-filter: blur(var(--blur)) !important;
}

.upNextContainer:not(#skipIntro) {
  border-radius: var(--rounded-cards) !important;
  background-color: rgba(0, 0, 0, 0.6) !important;
}

.upNextContainer {
  margin: 4% !important;
}

.toastVisible {
  border-radius: 30px !important;
  background-color: var(--primary-background-transparent) !important;
}

.sliderBubble {
  border-radius: var(--rounded-cards) !important;
  background-color: var(--secondary-background-transparent) !important;
  backdrop-filter: blur(var(--blur)) !important;
}

.sliderBubble:not(.osdVolumeSliderContainer .sliderBubble):has(.chapterThumbContainer) {
  background-color: rgba(255, 255, 255, 0) !important;
  top: 25px !important;
  backdrop-filter: unset !important;
}

.mdl-slider-background-flex {
  height: 10px !important;
  margin-top: -5px !important;
  border-radius: 100px !important;
  background: hsla(0, 0%, 100%, 0.2) !important;
}

.mdl-slider-background-lower {
  border-radius: 100px !important;
  background-color: var(--primary-accent-color) !important;
}

/* Fix for header buttons */
.layout-desktop .emby-button-foreground {
  top: -9px !important;
}

.layout-tv .emby-button-foreground {
  top: -14px !important;
}

.itemSelectionPanel .checkboxOutline {
  margin: 7px !important;
}

.skip-button {
  right: 4% !important;
  border-radius: 3px;
}

.layout-desktop #loginPage {
  display: flex;
  justify-content: center;
  align-items: center;
}

.layout-desktop #loginPage .padded-left.padded-right.padded-bottom-page.margin-auto-y {
  background: #011e27 !important;
  width: 400px !important;
  border-radius: 10px !important;
  padding: 50px !important;
}

.layout-desktop #loginPage .manualLoginForm .btnCancel {
  position: absolute !important;
  background: none !important;
  width: 100px !important;
  margin-left: -10px !important;
  margin-top: 70px !important;
  text-align: left !important;
}

.layout-desktop #loginPage .visualLoginForm {
  position: relative !important;
  background: var(--secondary-background-color) !important;
  z-index: 1000 !important;
}

.layout-desktop #loginPage .btnForgotPassword {
  background: none !important;
  font-weight: normal !important;
  width: 150px !important;
  text-align: right !important;
  position: absolute !important;
  margin-left: 255px !important;
  margin-top: -195px !important;
  font-size: smaller !important;
  color: rgba(255, 255, 255, 0.5) !important;
  z-index: 1 !important;
}

.layout-desktop #loginPage .loginDisclaimerContainer {
  top: 130px !important;
  position: relative !important;
  left: -50px !important;
  width: 500px !important;
  margin-top: -35px !important;
}

.layout-desktop #loginPage .squareCard {
  width: 25% !important;
  font-size: smaller !important;
}

@media (max-width: 100em) {
  .layout-desktop #loginPage .squareCard {
    width: 20% !important;
  }
  .layout-desktop #loginPage .padded-left.padded-right.padded-bottom-page.margin-auto-y {
    width: 600px !important;
  }
  .layout-desktop #loginPage .btnForgotPassword {
    margin-left: 450px !important;
  }
  .layout-desktop #loginPage .disclaimerContainer {
    width: 700px !important;
  }
}
@media (max-width: 87.5em) {
  .layout-desktop #loginPage .squareCard {
    width: 20% !important;
  }
}
@media (max-width: 75em) {
  .layout-desktop #loginPage .squareCard {
    width: 20% !important;
  }
}
@media (max-width: 43.75em) {
  .layout-desktop #loginPage .squareCard {
    width: 20% !important;
  }
}
.homeLibraryIcon {
  display: none;
}

.homeLibraryText {
  margin: 0 auto;
}

/*# sourceMappingURL=main.css.map */
