/* LateNight 2.3 // PaleMoon theme

* containers
  * colors, borders, background tiles
  * layout spacing

* colors & icons
  * font colors
  * button styles
  * button icons

* library
* menu & special widget styles


/**********************************************************************
************** container background colors & borders *****************/
#SkinContainer {
  background-color: #080808;
}

#Deck1, #DeckCompact1, #DeckMini1,
#Deck2, #DeckCompact2, #DeckMini2,
#Deck3, #DeckCompact3, #DeckMini3,
#Deck4, #DeckCompact4, #DeckMini4,
#MixerDecks,
#FxUnitControlsExpanded,
#FxUnitControlsCollapsed,
#FxSlotsExpanded,
#FxSlotsCollapsed,
#MicDuckingContainer, #MicAuxUnit, #MicAuxAddFrame,
#Sampler, #SamplerMini {
  background-color: #1e1e20;
}

/* 1st-level containers */
#Deck1, #DeckCompact1, #DeckMini1,
#Deck2, #DeckCompact2, #DeckMini2,
#Deck3, #DeckCompact3, #DeckMini3,
#Deck4, #DeckCompact4, #DeckMini4,
#MixerDecks,
#FxUnitControlsCollapsed,
#FxUnitControlsExpanded,
#FxSlotsCollapsed,
#FxSlotsExpanded,
#MicDuckingContainer, #MicAuxUnit, #MicAuxAddFrame,
#Sampler, #SamplerMini {
  border-top: 1px solid #333;
  border-left: 1px solid #282828;
  border-bottom: 1px solid #0c0c0c;
  border-right: 1px solid #181818;
  border-radius: 1px;
  border-bottom-left-radius: 2px;
  }
  #MixerDecks[highlight="1"] {
    border-top-right-radius: 0px;
    border-bottom-right-radius: 1px;
    border-right: 1px solid #0c0c0c;
  }

/* dim 1st-level containers */
#ToolBar,
#WaveformsContainer,
#MasterControls,
#HeadphoneControls,
#VuMeterDeck1_Compact,
#VuMeterDeck2_Compact,
#VuMeterDeck3_Compact,
#VuMeterDeck4_Compact,
#VuMeterMaster_Compact,
#FxUnitHeaderCollapsed,
#FxUnitHeaderExpanded,
#SamplerExpandBox,
#SearchLineBox,
#LibExpandBox,
#SidebarBox,
#PreviewDeck,
#SidebarCoverSplitter,
#SidebarCoverSplitter:handle,
#LibrarySplitter::handle,
#LibraryFeatureControls,
QAbstractScrollArea::corner {
  border-top: 1px solid #212123;
  border-right: 1px solid #111;
  border-bottom: 1px solid #020202;
  border-left: 1px solid #191919;
  border-radius: 1px;
  background-color: #151517;
  }
  #ToolBar {
    border-width: 0px 0px 1px 0px;
  }
  #WaveformsContainer {
    border-width: 1px 0px;
    border-radius: 0px;
  }

  #LibSidebarContainer {
    margin-top: 1px;
  }
  #SidebarBox {
    padding: 2px 0px 0px 2px;
    }
    #SidebarBox {
      border-width: 1px 0px 0px 0px;
      border-bottom-right-radius: 0px;
      border-bottom-left-radius: 0px;
      border-top-left-radius: 0px;
    }
  #SidebarCoverSplitter,
  #SidebarCoverSplitter::handle,
  #LibrarySplitter,
  #LibrarySplitter::handle {
    border-radius: 0px;
    }
    #SidebarCoverSplitter,
    #SidebarCoverSplitter::handle {
      border-width: 0px;
    }
    /* Some tweaks to create a frameless library table */
    #LibrarySplitter {
      border-width: 0px;
      }
      #LibrarySplitter::handle {
        border-width: 1px 0px 0px 0px;
      }
    WLibrary {
      border-width: 1px 0px 0px 0px;
    }
    #PreviewDeckRightSpacer,
    #SearchTreeSpacer {
      border-right: 1px solid #222;
      background-color: transparent;
      }
      #PreviewDeckRightSpacer {
        min-width: 3px;
        max-width: 3px;
      }
      #SearchTreeSpacer {
        min-height: 3px;
        max-height: 3px;
      }
  /* Controls row in AutoDJ, Recording and other library features */
  #LibraryFeatureControls {
    border-width: 1px 0px 0px 0px;
    border-radius: 0px;
    margin-top: 1px;
  }

#LibraryContainer {}

  #LibraryContainer QScrollBar::handle:horizontal,
  #LibraryContainer QScrollBar::handle:vertical,
  WEffectSelector QAbstractScrollArea QScrollBar::handle:horizontal,
  WEffectSelector QAbstractScrollArea QScrollBar::handle:vertical {
    background-color: #333338;
    }
    QAbstractScrollArea::corner {
      border: 0px;
    }

/* recessed regions */
#WaveformBox1,
#WaveformBox2,
#WaveformBox3,
#WaveformBox4,
#WaveformsFrame,
#OverviewBox,
#OverviewBoxMini,
#KeyText,
WCueMenuPopup #CueLabelEdit {
  border-top: 1px solid #0d0d0d;
  border-left: 1px solid #121212;
  border-bottom: 1px solid #2a2a2a;
  border-right: 1px solid #252525;
  background-color: #19191a;
  }
WTrackTableView,
WLibraryTextBrowser,
WLibrarySidebar,
WSearchLineEdit {
  border-top: 1px solid #000;
  border-left: 1px solid #000;
  border-bottom: 1px solid #1e1e1e;
  border-right: 1px solid #222;
  }
  WLibraryTextBrowser {
    margin-top: 1px;
    padding: 5px 0px 0px 8px;
    border-top: 1px solid #212123;
  }

  #WaveformsFrame,
  #OverviewBox,
  #OverviewBoxMini,
  WSearchLineEdit {
    border-radius: 1px;
  }
  #OverviewBox[highlight="1"],
  #OverviewBoxMini[highlight="1"] {
    background-color: #151515;
  }
  #KeyText {
    border-width: 1px 0px 1px 0px;
  }

  #DeckSettingsContainer,
  #DeckSettingsContainerCompact,
  #SamplerSettingsContainer,
  /* Prevents cut-off or shifted stars on macOS */
  WStarRating {
    background-color: #19191a;
    }
    #DeckSettingsContainer,
    #DeckSettingsContainerCompact,
    #SamplerSettingsContainer {
      border-top: 1px solid #080808;
      border-bottom: 1px solid #2a2a2a;
      }
      #DeckSettings,
      #SamplerSettings {
        border-top: 1px solid #1f1f1f;
        border-bottom: 1px solid #050505;
      }

/* fillers */
#FxRackFillerL,
#FxRackFillerR,
#MicAuxRackFiller {
  border-top: 1px solid #1c1c1c;
  border-left: 1px solid #191919;
  border-bottom: 1px solid #020202;
  border-right: 1px solid #111;
  border-radius: 1px;
  background-color: #151517;
  }

/* meters */
#VuMeterBox,
#VuMeterBoxMaster,
#VuMeterBoxMasterSingle,
#LatencyMeterBox {
  background-color: #040404;
}

#WaveformsContainer {
  border-bottom: 1px solid #0c0c0c;
}

#FxParametersFocusBg {
  border: 1px solid #257B82;
  background-color: rgba(0,0,1,50);
}

#VuMasterCover {
  background-color: rgba(21, 21, 21, 150);
}

#SearchLineBox {
  padding-right: 2px;
  border-right: 0px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
}

#LibExpandBox {
  border-right: 0px;
  border-left: 0px;
  border-radius: 0px;
  padding: 0px 2px 2px 2px;
}

#SidebarBox {
  border-right: 0px;
  border-top-right-radius: 0px;
}


/************ lines / grooves / splitters *********************/

#DeckRateSeparator,
#DeckRateSeparatorCompact,
#MasterMixerSeparator,
#MasterHeadphoneSeparator,
#FxMixerSeparatorCollapsed,
#FxSlotSeparatorH,
#SeparatorToolbar,
#SkinSettingsSeparator {
  /* needs a background color to paint the borders */
  background-color: transparent;
  }
  #DeckRateSeparator,
  #DeckRateSeparatorCompact,
  #FxMixerSeparatorCollapsed {
    min-width: 0px;
    max-width: 0px;
  }
  #SkinSettingsSeparator {
    min-height: 0px;
    max-height: 0px;
  }
  #FxMixerSeparatorCollapsed {
    margin-left: 3px;
  }
  #FxFlowIndicatorCollapsed {
    min-width: 12px;
    max-width: 12px;
  }
  #DeckRateSeparator,
  #DeckRateSeparatorCompact,
  #FxMixerSeparatorCollapsed,
  #FxSlotSeparatorH {
    border-left: 1px solid #0c0c0c;
    border-right: 1px solid #333;
  }
  #MasterMixerSeparator {
    border-left: 1px solid #0c0c0c;
    border-right: 1px solid #222;
  }
  #FxSlotSeparatorH {
    border-top: 1px solid #0c0c0c;
    border-bottom: 1px solid #333;
  }

  #FxFlowIndicatorCollapsed {
    margin: 0px 0px 0px 0px;
    image: url(skin:/palemoon/style/fx_flow_horizontal.svg) no-repeat center center;
  }
  #ToolbarSeparator {
    margin: 0px 5px;
  }
  #SkinSettingsSeparator {
    margin: 3px 4px 7px 4px;
  }

/* dynamic bottom border in #DeckRow1_ */
#ExpandingBottomBorder {
  /* border shows up if we set a bg color... */
  background-color: transparent;
  border-bottom: 1px solid #0c0c0c;
}

#PreviewPlayBox {
  border-style: solid;
  border-color: #0c0c0c;
}

#BpmTapContainer:hover,
#PlayPositionText:hover, #PlayPositionTextSmall:hover {
  background-color: #151517;
  border-radius: 1px;
}

/* Disbled for now since the hover effect is stuck as soon as the
  track menu is opened.
#TitleText[highlight="1"]:hover, #TitleTextSmall[highlight="1"]:hover,
#ArtistText[highlight="1"]:hover, #ArtistTextSmall[highlight="1"]:hover {
  background-color: #171719;
  border-radius: 1px;
}
*/


/**********************************************************************
************** container background colors & borders *****************/




/******************* Container layouts, margins etc. ******************
**********************************************************************/

#ToolbarDeckSpacer {
  min-height: 3px;
  max-height: 3px;
}

/* Since the toolbar is dim in PaleMoon, we don't need an extra margin
    in between mini decks and the toolbar. */
#MiniDecksTopSpacer {
  min-height: 0px;
  max-height: 0px;
}

#CompactDecksCenterSpacer {
  min-width: 4px;
  max-width: 4px;
}

#DeckRateSpacer {
  min-width: 0px;
  max-width: 0px;
}

#ToolBar {
  padding: 0px 2px 0px 2px;
  }
  #BatteryBox,
  #ClockWidget {
    margin-bottom: 1px;
  }
  #LatencyLabel {
    margin-top: 1px;
  }

#Deck1, #DeckCompact1, #DeckMini1,
#Deck2, #DeckCompact2, #DeckMini2,
#Deck3, #DeckCompact3, #DeckMini3,
#Deck4, #DeckCompact4, #DeckMini4,
#MixerContainer,
#VuMeterDeck1_Compact,
#VuMeterDeck2_Compact,
#VuMeterDeck3_Compact,
#VuMeterDeck4_Compact,
#VuMeterMaster_Compact,
#FxUnit1, #FxUnit3,
#FxUnit2, #FxUnit4,
#FxRackFillerR,
#FxRackFillerL,
#MicAuxRack,
#SamplerRow,
#PreviewDeck {
  margin-bottom: 3px;
}

#Deck1, #DeckMini1,
#Deck3, #DeckMini3,
#MixerContainer,
#FxUnit1,
#FxUnit3,
#FxRackFillerL,
#FxRackFillerR,
#MicRack, #AuxRack {
  margin-right: 2px;
}

#Deck2, #DeckMini2,
#Deck4, #DeckMini4,
#MixerContainer,
#FxUnit2,
#FxUnit4,
#FxRackFillerL,
#FxRackFillerR,
#MicRack, #AuxRack {
  margin-left: 2px;
}
/* gap in between compact decks is managed
  by #CompactDecksCenterSpacer in order to have VU meters
  directly attached to each deck.
  A highlight connection to [LateNight],show_vumeters_compact
  can be used for the borders but screws up the margin: contents
  are rendered beyond the parent border */

#MixerContainer {
  margin-right: 1px;
  margin-left: 1px;
}

#SamplerRow {
  qproperty-layoutSpacing: 4;
}

#MicRack, #AuxRack {
  qproperty-layoutSpacing: 3;
}

#PreviewDeck {
  /* right margin is managed by #PreviewDeckRightSpacer which
    also generates the left border of the splitter handle */
}

#SkinSettingsContainer {
  margin-left: 3px;
}


/************** Waveforms *****************************************************/

#WaveformsContainer {
  padding-bottom: 1px;
}

#WaveformBox1,
#WaveformBox2,
#WaveformBox3,
#WaveformBox4 {
  border-left: 0px;
  }
  #WaveformBox1,
  #WaveformBox3 {
    border-bottom: 0px;
  }
  #WaveformBox2,
  #WaveformBox4 {
    border-top: 0px;
  }
  /* Hide some borders when 4 decks are visible */
  #WaveformBox1[highlight="1"] {
    border-top: 0px;
  }
  #WaveformBox2[highlight="1"] {
    border-bottom: 0px;
  }


/************** Decks *********************************************************/

#DeckMini1,
#DeckMini2,
#DeckMini3,
#DeckMini4 {
  padding-right: 2px;
}

/* All rows in FULL deck */
#DeckRows12345,
#DeckRows234 {
  padding: 2px 0px 2px 1px;
  }
  /* All rows in compact deck */
  #DeckRows2345 {
    padding: 0px 0px 2px 1px;
  }

#SpinnyCoverContainer_Small{
  min-width: 63px;
  max-width: 63px;
  min-height: 63px;
  max-height: 63px;
  margin: 0px 1px 0px 0px;
  }
  #SpinnyCoverContainer_SmallCompact {
    min-width: 63px;
    max-width: 63px;
    min-height: 63px;
    max-height: 63px;
    margin: 0px 1px 1px 0px;
  }
#SpinnyCoverContainer_Big{
  min-width: 118px;
  max-width: 118x;
  min-height: 118px;
  max-height: 118px;
  margin: 1px 2px 0px 0px;
  }
  #SpinnyCoverContainer_BigCompact {
    min-width: 114px;
    max-width: 114px;
    min-height: 114px;
    max-height: 114px;
    margin: 0px 2px 0px 0px;
  }
#SpinnyCoverContainer_MiniDeck {
  min-width: 53px;
  max-width: 53px;
  min-height: 53px;
  max-height: 53px;
}

  /* Replacement for #DeckMiniN padding */
  #PlayCueMini {
    margin: 0px 1px 1px 0px;
  }
  #OverviewBoxMini {
    margin: 1px 0px;
  }
  #DeckMini_TitlePlayPosKeyBPM {
    margin: 1px 1px 1px 0px;
  }

#DeckRow_1_KeyVinylFx {
  padding-right: 2px;
  padding-left: 1px;
  }

#DeckRow_2_3_ArtistTitleTime {
  margin: 2px 0px 2px 0px;
  }
  #ArtistText,
  #TitleText {
    /* for some reason the padding/margin is doubled in the skin... */
    padding: 0px 2px 1px 0px;
  }
  #PlayPositionText,
  #DurationText {
    /* for some reason the padding/margin is doubled in the skin... */
    padding: 0px 1px 1px 1px;
  }
  #TitleTextSmall {
    padding: 1px 3px 1px 1px;
  }
  #ArtistTextSmall {
    margin: 0px 0px 0px 1px;
    padding: 0px 1px 0px 0px;
  }
  #PlayPositionTextSmall {
    padding: 0px 0px 2px 2px;
  }

#DeckSettingsContainer,
#DeckSettingsContainerCompact {
  border-width: 1px 0px 1px 0px;
  }
  #SamplerSettingsContainer {
    border-width: 1px 0px 1px 0px;
    border-bottom-right-radius: 1px;
  }

  #DeckSettings {
    padding: 1px 2px 1px 1px;
    border-width: 1px 0px 1px 0px;
    }
    #DeckSettingsGrid {
      padding: 0px 2px;
      qproperty-layoutSpacing: 4;
    }

#DeckRow_5_LoopCuesTransport {
  margin-top: 1px;
}
#DeckRow_5_Compact {
}


/************** RateControls ********************************************/

#RateContainer {
  padding: 4px 0px 0px 0px;
  }

  #RateText {
    padding: 0px;
    margin: 0px 2px 0px 0px;
  }

#SyncBox {
  margin: 2px 1px 1px 0px;
}

#RateControls {
  margin: 0px 1px 0px 2px;
}


/********************** Loop Controls / AutoDJ spinbox ************************/
WBeatSpinBox,
#spinBoxTransition {
  selection-color: #a7998b;
  selection-background-color: #111;
  }
  WBeatSpinBox:focus,
  #spinBoxTransition:focus,
  #LibraryBPMSpinBox:focus  {
    selection-color: #000;
    selection-background-color: #d2d2d2;
  }
WBeatSpinBox {
  border-width: 3px 19px 2px 3px;
  border-image: url(skin:/palemoon/buttons/btn_embedded_spinbox.svg) 3 19 2 3;
}
#spinBoxTransition {
  border-width: 3px 19px 2px 3px;
  border-image: url(skin:/palemoon/buttons/btn_embedded_spinbox_autodj.svg) 3 19 2 3;
}

WBeatSpinBox {
  margin: 1px 0px 1px 1px;
  padding: 0px -17px 2px 1px;
}

#spinBoxTransition {
  width: 24px;
  height: 19px;
  padding: 0px -15px 0px 0px;
  margin: 0px 2px 3px 5px;
  }
  WBeatSpinBox:focus,
  #spinBoxTransition:focus {
    border-image: url(skin:/palemoon/buttons/btn_embedded_spinbox_focus_blue.svg) 3 19 2 3;
  }

WBeatSpinBox::up-button,
WBeatSpinBox::down-button,
#spinBoxTransition::up-button,
#spinBoxTransition::down-button {
  subcontrol-origin: content;
  position: relative;
  /* as with spinbox: border is added to size. */
  width: 18px;
  padding: 0px;
  }
  WBeatSpinBox::up-button,
  #spinBoxTransition::up-button {
    height: 11px;
    subcontrol-position: top right;
    image: url(skin:/palemoon/buttons/btn__spinbox_up.svg) no-repeat;
    }
    WBeatSpinBox::up-button {
      margin: -2px -1px 0px 0px;
      }
    #spinBoxTransition::up-button {
      margin: -2px -3px 0px 0px;
      }
  WBeatSpinBox::down-button,
  #spinBoxTransition::down-button {
    height: 11px;
    subcontrol-position: bottom right;
    image: url(skin:/palemoon/buttons/btn__spinbox_down.svg) no-repeat;
    }
    WBeatSpinBox::down-button {
      margin: 0px -1px -3px 0px;
      }
    #spinBoxTransition::down-button {
      margin: 0px -3px -1px 0px;
      }


/************** Mixer ***************************************************/

#MixerDecks {
  padding: 2px 5px 2px 5px;
  }
  #MixerChannel_2Decks_Left {
    margin: 0px 2px;
  }
  #MixerChannel_2Decks_Right {
    margin: 0px 2px;
  }
  #VuAndSlider_4Decks {
    margin-right: 1px;
  }
  #PflBox_4Decks {
    margin: 3px 0px 0px 20px;
  }

  #CrossfaderSwitch_4Decks {
    margin: 0px 4px 3px 0px;
  }
  #Crossfader {
    padding: 0px 0px 0px 1px;
  }

  #CrossfaderButtonContainer_Deck {
    padding: 1px;
    margin: 0px 1px 1px 0px;
    }
  #CrossfaderButtonContainer_Aux {
    padding: 1px;
    margin-left: 3px;
    }

#MixerMasterHeadphone {
  }
  #MasterControls,
  #HeadphoneControls {
    padding: 4px;
  }
  #MasterControls {
    border-radius: 0px 1px 0px 0px;
    }
    #BoothLabelBox {
      padding: 0px 0px 2px 0px;
    }
  #HeadphoneControls {
    border-radius: 0px 0px 1px 0px;
  }

/* All VU meter instances */
#VuMeterChannel_2Decks {
  margin: 0px 9px 2px 9px;
}
#VuMeterChannel_4Decks {
  margin: 6px 0px 6px 11px;
}
#VuMeterMaster_2Decks {
  margin: 0px 0px 2px 0px;
}
#VuMeterMaster_4Decks {
  margin: 5px 0px;
}

#VuMeterDeck1_Compact,
#VuMeterDeck3_Compact {
  padding: 0px 4px 0px 5px;
  border-left: 0px;
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
}
#VuMeterDeck2_Compact,
#VuMeterDeck4_Compact {
  padding: 0px 5px 0px 4px;
  border-right: 0px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
}
#VuMeterMaster_Compact {
  margin-right: 4px;
  margin-left: 4px;
  padding: 0px 5px;
}


/************** Effects *************************************************/

#FxUnitHeaderCollapsed[highlight="0"],
#FxUnitHeaderCollapsed[highlight="1"] {
  padding: 0px;
  border-left: 0px;
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
  }
  #FxUnitHeaderExpanded[highlight="0"],
  #FxUnitHeaderExpanded[highlight="1"] {
    padding: 0px;
    border-bottom-left-radius: 0px;
    border-left: 0px;
    border-bottom: 0px;
    border-top-left-radius: 0px;
    border-bottom-right-radius: 0px;
  }
  #FxUnitHeader {
    padding: 0px 0px 1px 0px;
  }

#FxUnitControlsCollapsed {
  padding: 1px 2px 3px 2px;
  qproperty-layoutSpacing: 2;
  border-left: 0px;
  border-right: 0px;
  border-radius: 0px;
  }
  #FxUnitControlsExpanded {
    padding: 2px 1px 2px 0px;
    border-top: 0px;
    border-left: 0px;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    border-top-left-radius: 0px;
  }

#FxSlotsCollapsed {
  padding: 0px 0px 0px 0px;
  border-right: 0px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
}
#FxSlotsExpanded {
  padding: 0px 0px 1px 1px;
  border-right: 0px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
  background: #1e1e20 url(skin:/palemoon/style/fx_flow_vertical.svg) no-repeat center right;
  }
  #FxSlot1,
  #FxSlot2,
  #FxSlot3 {
    padding: 2px 4px 2px 2px;
  }
  #FxSlotsExpanded #FxSlot1,
  #FxSlotsExpanded #FxSlot2,
  #FxSlotsExpanded #FxSlot3 {
    padding-right: 7px;
  }

#FxParametersContainer {
  padding: 5px 0px 2px 0px;
}

#FxSlotsCollapsed #FxSlotControls {
  padding: 2px 3px 1px 3px;
}

#FxSlotsExpanded #FxSlotControls {
/* keep height of fx slot with/without effect */
  min-height: 47px;
  padding: 2px 7px 1px 3px;
}

#FxFocusButtonBox {
  margin-right: 3px;
}

WPushButton#FxSuperLinkButton,
WPushButton#FxSuperLinkInvertButton {
  border-radius: 3px;
  margin: 1px 1px 0px 0px;
}

WEffectSelector:!editable,
WEffectSelector:!editable:on {
  /* If you use margin top/bottom 0, the combo box shrinks in width (go figure) and
      names start getting cut off. Adding explicit padding improves this. */
  padding: 3px 0px 1px 5px;
  margin: 0px;
}
#fadeModeCombobox:!editable,
#fadeModeCombobox:!editable:on {
  min-height: 17px;
  max-height: 17px;
  padding: 2px 0px 0px 5px;
  margin: 4px 1px 4px 1px;
}
  /* selected item */
  WEffectSelector::checked,
  #fadeModeCombobox::checked {
    /* not applied
    padding-left: 5px;  */
    padding: 0px;
    margin: 0px;
    color: #eee;
  }
  /* hovered items */
  WEffectSelector::item:selected,
  #fadeModeCombobox::item:selected {
    background-color: #333;
  /* Already of those two destroys font config and puts tick mark behind text:
    margin: 0px;
    padding: 0px; */
  /* This moves the tick mark behind item text,
    text sits at left border now
    border: 0; */
  }
  WEffectSelector::down-arrow,
  #fadeModeCombobox::down-arrow {
    image: url(skin:/palemoon/buttons/btn__fx_selector_down.svg);
  }


/************** Sampler *************************************************/

#SamplerExpandBox {
  padding: 0px 1px 0px 1px;
}

#SamplerMini {
  padding: 0px 1px 1px 0px;
  }
  #SamplerPlayBoxMini {
    padding: 1px;
  }
  #SamplerTitleBoxMini {
    padding: 0px 0px 0px 0px;
  }
  #SamplerTitleMini {
    padding: 2px 0px 0px 0px;
  }
  #SamplerBpmMini {
    margin-left: 2px;
  }

#Sampler {
  padding: 0px 0px 0px 1px;
  }
  #SamplerTitleRow {
    border-width: 0px 1px 0px 0px;
    padding-right: 2px;
    }
    #SamplerTitleBox {
      }
      #SamplerTitle {
        padding: 3px 3px 1px 4px;
      }
    #SamplerTitleBpmSeparator {
      min-width: 0px;
      max-width: 0px;
      border-right: 1px solid #292929;
      border-left: 1px solid #0c0c0c;
      background: transparent;
    }

  #SamplerRows23 {
    }
    #SamplerPlayRow {
    }
    #SamplerPlayBox {
      padding: 1px 2px 1px 0px;
    }

    #Sampler #OverviewBox {
      border-top-right-radius: 0px;
      border-bottom-right-radius: 0px;
    }

    #SamplerSettingsContainer {
      }
      #SamplerSettings {
        border-width: 1px 0px 1px 0px;
        padding: 0px 0px 2px 0px;
      }

    #SamplerButtons {
      }
      #SamplerHotcues {
        padding: 1px 0px 2px 0px;
      }

    #SamplerGainPflVu_Container {
      border-top: 1px solid #0c0c0c;
      border-right: 1px solid #292929;
      border-left: 1px solid #0c0c0c;
      border-top-right-radius: 1px;
      }
      #SamplerGainPflVu {
        border-top: 1px solid #2c2c2c;
        border-right: 1px solid #0c0c0c;
        border-left: 1px solid #292929;
        padding-bottom: 2px;
        }
        #SamplerGain {
          padding: 0px 0px 0px 1px;
          border-width: 1px 0px 0px 0px;
        }
        #SamplerPfl {
          padding: 0px 5px 0px 6px;
        }
        #SamplerVU {
          padding: 2px 3px 0px 1px;
          border-width: 1px 1px 0px 0px;
        }

    #SamplerRateControls {
      padding: 1px 1px 1px 0px;
      }
      #SamplerPitchSlider {
        padding: 0px 0px 1px 0px;
      }


/************** MicAux **************************************************/

#MicDuckingContainer {
  }
  #MicDuckingModeBox {
    padding: 2px 2px 0px 2px;
  }
  #MicDuckingStrengthBox {
    padding: 1px 0px 4px 0px;
  }

#MicAuxMainControls {
  border-radius: 2px;
  padding: 0px 1px 0px 2px;
  border-bottom-left-radius: 1px;
  border-top-right-radius: 1px;
  }
  #MicAuxLabel {
    padding: 3px 0px 3px 1px;
  }

  #AuxPlayBox,
  #MicTalkBox {
    padding: 0px 0px 2px 0px;
  }

  #MicAuxAddBox {
    margin: 1px 0px 1px 1px;
  }

  #MicAuxVUMeter {
    padding: 4px 1px 1px 0px;
    margin-left: 2px;
  }

#MicAuxSubControls {
  border-width: 0px;
  padding: 0px 2px 3px 3px;
  }
  #MicAuxFxButtons {
    padding: 2px 0px;
  }

#MicAuxAddFrame {
  padding: 2px 4px 4px 4px;
}


/************** PreviewDeck ***************************************************/

#PreviewDeck {
  padding: 2px 1px;
  }

  #PreviewDeckTextBox {
    }
    #PreviewLabel { /* Placeholder when no track is loaded */
      padding-left: 2px;
    }
    #PreviewTitle {
      margin: 0px 2px 0px 0px;
    }
    #PreviewBPM {
      padding-left: 2px;
    }
    #PreviewEjectBox {
      padding-bottom: 2px;
    }

  #PreviewDeck #OverviewBox {
    margin: 1px 2px 0px 2px;
  }


/************** SkinSettings **************************************************/

#SkinSettings {
  padding: 3px;
  border-top: 1px solid #585858;
  border-bottom: 1px solid #585858;
  border-left: 1px solid #585858;
  border-top-left-radius: 2px;
  border-bottom-left-radius: 2px;
}

#DeckSizeSettings {
  margin: 2px 0px 0px 0px;
  }
  #DeckSizeToggles {
    padding: 0px 0px 0px 0px;
    }
    #SkinSettingsNumToggle {
      margin-left: 1px;
    }

#SkinSettingsCategory {
  padding: 2px 5px 7px 3px;
  }
  #SkinSettingsSubMenu {
    padding: 0px 0px 0px 13px;
  }
  #CategoryLabel {
    padding: 3px 0px 2px 0px;
  }
  #SkinSettingsLabelButton {
    padding: 0px 0px 0px 3px;
  }

  #SamplerLoadSaveBox {
    padding-left: 18px;
  }

#SubmenuCover,
#DeckSizeCover[highlight="0"] {
  background-color: rgba(15, 15, 15, 180);
}
#DeckSizeCover[highlight="1"] {
  background-color: qlineargradient(x1: 0, y1: 0, x2: 1, y2: 0,
    stop: 0 rgba(15, 15, 15, 220),
    stop: 0.70 rgba(15, 15, 15, 220),
    stop: 0.71 transparent,
    stop: 1 transparent);
}
#SkinSettingsMixerToggle {
  background-color: rgba(15, 15, 15, 255);
}
/*********************************************************************
******************* Container layouts, margins etc. *****************/





/************** font colors **************************************************/

WLabel#FxUnitLabel,
WLabel#MicAuxLabel,
WLabel#MicAuxLabelUnconfigured,
WEffectSelector,
#fadeModeCombobox {
  font-weight: 500;
}

/* Ivory */
#Deck1 #TitleText,
  #Deck1 #ArtistText,
  #Deck1 #BpmText,
  #Deck1 #KeyText,
  #DeckCompact1 #TitleText,
  #DeckCompact1 #ArtistText,
  #DeckCompact1 #BpmText,
  #DeckCompact1 #KeyText,
  #DeckMini1 #TitleTextSmall,
  #DeckMini1 #ArtistTextSmall,
  #DeckMini1 #BpmTextSmall,
  #DeckMini1 #KeyTextSmall,
#Deck2 #TitleText,
  #Deck2 #ArtistText,
  #Deck2 #BpmText,
  #Deck2 #KeyText,
  #DeckCompact2 #TitleText,
  #DeckCompact2 #ArtistText,
  #DeckCompact2 #BpmText,
  #DeckCompact2 #KeyText,
  #DeckMini2 #TitleTextSmall,
  #DeckMini2 #ArtistTextSmall,
  #DeckMini2 #BpmTextSmall,
  #DeckMini2 #KeyTextSmall,
#MicAuxLabel,
#SamplerTitle, #SamplerTitleMini,
#MainMenu QMenu,
#MainMenu QMenu::item,
#MainMenu QMenu QCheckBox,
WSearchLineEdit, WTime,
#PreviewDeckTextBox, #PreviewTitle, #PreviewBPM,
#LibraryBPMSpinBox,
#LibraryBPMButton::item,
WTrackTableView,
WTrackTableView::indicator,
WLibraryTextBrowser,
WLibrarySidebar,
#LibraryFeatureControls QLabel,
#LibraryFeatureControls QPushButton,
#LibraryFeatureControls QRadioButton,
/* Tooltip and menus */
QToolTip,
WLibrarySidebar QMenu,
WTrackTableViewHeader QMenu,
WLibraryTextBrowser QMenu,
WTrackMenu,
WTrackMenu QMenu,
WTrackMenu QMenu QCheckBox,
QLineEdit QMenu,
WCueMenuPopup,
WCueMenuPopup QLabel,
#CueLabelEdit,
WCoverArtMenu {
  color: #c2b3a5;
  }
  /* dim ivory / light brown */
  #Deck1 WStarRating, #DeckCompact1 WStarRating,
  #Deck2 WStarRating, #DeckCompact2 WStarRating,
  #SkinSettingsLabelButton, #CategoryLabel,
  #SkinSettingsButton,
  #SkinSettingsNumToggle,
  #SkinSettingsNumToggleHeader[displayValue="1"],
  #SkinSettingsMixerToggle,
  #SkinSettingsText {
    color: #988f86;
  }
  #SkinSettingsNumToggleHeader[displayValue="0"] {
    color: #756e6c;
  }
WEffectSelector:!editable,
WEffectSelector:!editable:on,
#fadeModeCombobox:!editable,
#fadeModeCombobox:!editable:on {
  color: #918273;
  /* use slightly larger labels than in Classic */
  font-size: 14px;
}
  /* dim² ivory */
  #SamplerBpm, #SamplerBpmMini,
  WTrackTableViewHeader {
    color: #766b65;
  }

  WBeatSpinBox,
  #spinBoxTransition {
    color: #a7998b;
  }

/* pale blue */
#Deck3 #TitleText,
  #Deck3 #ArtistText,
  #Deck3 #BpmText,
  #Deck3 #KeyText,
  #DeckCompact3 #TitleText,
  #DeckCompact3 #ArtistText,
  #DeckCompact3 #BpmText,
  #DeckCompact3 #KeyText,
  #DeckMini3 #TitleTextSmall,
  #DeckMini3 #ArtistTextSmall,
  #DeckMini3 #BpmTextSmall,
  #DeckMini3 #KeyTextSmall,
#Deck4 #TitleText,
  #Deck4 #ArtistText,
  #Deck4 #BpmText,
  #Deck4 #KeyText,
  #DeckCompact4 #TitleText,
  #DeckCompact4 #ArtistText,
  #DeckCompact4 #BpmText,
  #DeckCompact4 #KeyText,
  #DeckMini4 #TitleTextSmall,
  #DeckMini4 #ArtistTextSmall,
  #DeckMini4 #BpmTextSmall,
  #DeckMini4 #KeyTextSmall {
  color: #85bdbb;
  }
  #Deck3 WStarRating, #DeckCompact3 WStarRating,
  #Deck4 WStarRating, #DeckCompact4 WStarRating {
    color: #559b99;
  }

/* Grey for FxUnit labels */
#FxUnitLabel,
#MicAuxLabelUnconfigured {
  color: #686666;
  }

/* When the Fx unit is currently focused = accessible from the controller
  indicate that with a bright colored bar and colorize the unit label */
#FxUnit1 #FxUnitLabel[highlight="1"],
#FxUnit2 #FxUnitLabel[highlight="1"] {
  color: #518f00;
  }
  #FxUnit1 #FxUnitControllerInputIndicator[highlight="1"],
  #FxUnit2 #FxUnitControllerInputIndicator[highlight="1"] {
    background-color: #518f00;
  }
#FxUnit3 #FxUnitLabel[highlight="1"],
#FxUnit4 #FxUnitLabel[highlight="1"] {
  color: #028392;
  }
  #FxUnit3 #FxUnitControllerInputIndicator[highlight="1"],
  #FxUnit4 #FxUnitControllerInputIndicator[highlight="1"] {
    background-color: #028392;
  }

#MainMenu,
#MainMenu::item {
  color: #888;
}

/* Grey. default for all deck labels */
#MainMenu,
#MainMenu QMenu,
#MainMenu QMenu QCheckBox,
#PlayPositionText, #PlayPositionTextSmall,
#DurationText,
#RateText, #RateRangePrefix, #RateRangeText,
#MixerMasterHeadphone #FxAssignButtons WPushButton[displayValue="0"],
#PreviewLabel,
WEffectSelector QAbstractScrollArea,
#fadeModeCombobox QAbstractScrollArea,
#GuiToggleButton[displayValue="0"],
#RecDuration[highlight="0"],
#BroadcastButton[displayValue="0"],
#SkinSettingsToggle[displayValue="0"],
#LibraryFeatureControls QLabel {
  color: #777;
}

/* Darker grey for knob labels & inactive decks/units */
#KnobLabel,
#FxKnobLabel,
#FxButtonLabel,
#VinylButton[displayValue="0"],
#VinylCueButton[displayValue="0"],
#VinylModeButton,
#PassthroughButton[displayValue="0"],
#FxAssignButtons WPushButton[displayValue="0"] {
  color: #666;
  }

/* Even darker grey for knob labels in master/headphone mixer */
#MixerMasterHeadphone #KnobLabel,
#MixerMasterHeadphone #FxAssignButtons WPushButton[displayValue="0"] {
  color: #555;
}

#LatencyLabel {
  color: #444;
}

#VinylButton[displayValue="1"],
#VinylCueButton[displayValue="1"],
#VinylCueButton[displayValue="2"],
#PassthroughButton[displayValue="1"],
#FxAssignButtons WPushButton[displayValue="1"],
#GuiToggleButton[displayValue="1"],
#GuiToggleButton[displayValue="2"],
#BroadcastButton[displayValue="1"], /* connecting */
#BroadcastButton[displayValue="2"], /* broadcasting */
#BroadcastButton[displayValue="3"], /* failure */
#BroadcastButton[displayValue="4"], /* warning */
#RecDuration[highlight="1"],  /* initializing */
#RecDuration[highlight="2"],  /* recording */
#SkinSettingsToggle[displayValue="1"],
QPushButton#pushButtonAutoDJ:checked,
QPushButton#pushButtonRepeatPlaylist:checked,
QPushButton#pushButtonAnalyze:checked,
QPushButton#pushButtonRecording:checked {
  color: #000;
}

#LibraryFeatureControls QPushButton:!enabled {
  color: #444443;
}

/* Passthrough label on overview waveform */
WOverview #PassthroughLabel {
  color: #b24c12;
}

#SkinSettingsButton,
#SkinSettingsNumToggle,
#SkinSettingsText,
#SkinSettingsMixerToggle {
  color: #d2d2d2;
  }
  #SkinSettingsNumToggle[value="1"],
  #SkinSettingsNumToggleHeader[displayValue="1"] {
    text-decoration: underline;
  }

/************** font colors **************************************************/
/************** font settings *************************************************/




/************** Button styles *************************************************
*************** Button borders ************************************************/

/* crop shadow on the left border for all buttons in Fx assign and vinyl control grid
  (except leftmost button in each grid > overwritten in the block below) */
#VinylModeButton,
#VinylCueButton[displayValue="0"],
#PassthroughButton[displayValue="0"],
#FxAssignButtons WPushButton[displayValue="0"] {
  outline: none;
  border-width: 2px 2px 2px 1px;
  border-image: url(skin:/palemoon/buttons/btn_embedded_grid.svg) 2 2 2 1;
  }
  /* Active */
  #VinylCueButton[displayValue="1"],
  #VinylCueButton[displayValue="2"],
  #PassthroughButton[displayValue="1"],
  #FxAssignButtons WPushButton[displayValue="1"] {
    outline: none;
    border-width: 2px 2px 2px 1px;
    border-image: url(skin:/palemoon/buttons/btn_embedded_grid_active.svg) 2 2 2 1;
  }

#GuiToggleButton[displayValue="0"],
#RecFeedback[displayValue="0"],
#BroadcastButton[displayValue="0"],
#SkinSettingsToggle[displayValue="0"],
#KeyMatchReset[displayValue="0"],
WPushButton#VinylButton[displayValue="0"],
WPushButton#FxAssignButton1[displayValue="0"],
WEffectSelector:!editable,
#fadeModeCombobox:!editable,
#LibraryFeatureControls QPushButton:enabled,
#CueDeleteButton {
  outline: none;
  border-width: 2px;
  border-image: url(skin:/palemoon/buttons/btn_embedded_library.svg) 2 2 2 2;
  }
  /*
  WPushButton#BpmTap[displayValue="1"], */
  WPushButton#VinylButton[displayValue="1"],
  WPushButton#FxAssignButton1[displayValue="1"],
  #KeyMatchReset[pressed="true"],
  #GuiToggleButton[displayValue="1"],
  #RecFeedback[displayValue="1"],
  #RecFeedback[displayValue="2"],
  #RecFeedback[displayValue="3"],
  #BroadcastButton[displayValue="1"],
  #BroadcastButton[displayValue="2"],
  #BroadcastButton[displayValue="3"],
  #BroadcastButton[displayValue="4"],
  #SkinSettingsToggle[displayValue="1"],
  #LibraryFeatureControls QPushButton:pressed
  QPushButton#pushButtonAutoDJ:checked,
  QPushButton#pushButtonRepeatPlaylist:checked,
  QPushButton#pushButtonAnalyze:checked,
  QPushButton#pushButtonRecording:checked,
  WEffectSelector:!editable:on,
  #fadeModeCombobox:!editable:on,
  #CueDeleteButton[pressed="true"] {
    border-width: 2px;
    border-image: url(skin:/palemoon/buttons/btn_embedded_library_active.svg) 2 2 2 2;
  }

  WTrackTableViewHeader {
    border-bottom-right-radius: 1px solid #000;
    outline: none;
  }
  WTrackTableViewHeader::section {
    outline: none;
    border-width: 1px 2px 1px 1px;
    border-image: url(skin:/palemoon/buttons/btn_embedded_library_header.svg) 1 2 1 1;
  }
  WTrackTableViewHeader::up-arrow,
  WTrackTableViewHeader::down-arrow {
    outline: none;
    /* ToDo: restore image
    border-width: 1px 2px 1px 0px;
    border-image: url(skin:/palemoon/buttons/btn_embedded_library_header_sort.svg) 1 2 1 1; */
  }

  #LibraryFeatureControls QPushButton:!enabled {
    outline: none;
    border-width: 2px;
    border-image: url(skin:/palemoon/buttons/btn_embedded_library_disabled.svg) 2 2 2 2;
  }

#KeyUp {
  border-width: 1px 2px 0px 2px;
  border-image: url(skin:/palemoon/buttons/btn_embedded_library.svg) 1 2 12 2;
  }
  #KeyUp[pressed="true"] {
    border-width: 1px 2px 0px 2px;
    border-image: url(skin:/palemoon/buttons/btn_embedded_library_active.svg) 1 2 12 2;
  }
#KeyDown {
  border-width: 0px 2px 1px 2px;
  border-image: url(skin:/palemoon/buttons/btn_embedded_library.svg) 12 2 1 2;
  }
  #KeyDown[pressed="true"] {
    border-width: 0px 2px 1px 2px;
    border-image: url(skin:/palemoon/buttons/btn_embedded_library_active.svg) 12 2 1 2;
  }

#BeatgridControls WPushButton, WPushButton#BeatgridControlsToggle,
#DeckRow_5_LoopCuesTransport WPushButton,
#RateControls WPushButton,
WPushButton#PlayDeck,
WPushButton#PreviewIndicator,
WPushButton#PlayIndicator,
WPushButton#CueDeck,
#PlayCueMini WPushButton,
WPushButton#LoopActivate,
WPushButton#RateControls WPushButton,
WPushButton#SyncDeck, WPushButton#SyncSampler,
#MixerContainer WPushButton,
#FxUnitContainer WPushButton,
#Sampler WPushButton,
#SamplerMini WPushButton,
#MicAuxRack WPushButton,
WPushButton#PlayPreview {
  /* Limit background-color area to button area designed in SVG backpath. */
  margin: 1px;
  /* just to be sure the colored background doesn't overlap the rounded SVG border */
  border-radius: 2px;
}

WPushButton#FxExpand,
WPushButton#SamplerExpand,
#FxAssignButtons WPushButton,
#VinylControls WPushButton,
#KeyControls WPushButton,
#SamplerSettings WPushButton,
#SamplerSettingsMini WPushButton,
WPushButton#CrossfaderButton,
#LibExpand,
#ToolBar WPushButton {
  margin: 0px;
  border-radius: 0px;
}



/************** button background colors **************************************/

/* top-level buttons in transport, fx, micaux and others */
#DeckRow_5_LoopCuesTransport WPushButton[displayValue="0"],
#PlayCueMini WPushButton[displayValue="0"],
WPushButton#PlayIndicator[displayValue="0"],
WPushButton#CueDeck[displayValue="0"],
#SamplerPlayBox WPushButton#PreviewIndicator,
WPushButton#LoopActivate[displayValue="0"],
#KeyControls WPushButton[displayValue="0"],
#EQKillButtonBox WPushButton[displayValue="0"],
WPushButton#QuickEffectButton[displayValue="0"],
WPushButton#FxToggleButton[displayValue="0"],
#MicAuxUnit WPushButton[displayValue="0"],
#MicDuckingContainer WPushButton[displayValue="0"],
WBeatSpinBox,
WBeatSpinBox::up-button,
WBeatSpinBox::down-button {
  background-color: #121213;
  }
  /* dim buttons in top-level containers */
  #LoopControls WPushButton[displayValue="0"],
  #BeatjumpControls WPushButton[displayValue="0"],
  WPushButton#SyncDeck[value="0"],
  WBeatSpinBox::up-button,
  WBeatSpinBox::down-button,
  WPushButton#LoopActivate[displayValue="0"], /* in compact deck */
  WPushButton#FxParameterButton[displayValue="0"],
  WTrackTableViewHeader,
  WTrackTableViewHeader::section {
    background-color: #171719;
  }
  /* even buttons in 2nd level containers */
  #FxAssignButtons WPushButton[displayValue="0"],
  #VinylControls WPushButton[displayValue="0"],
  #KeyControls WPushButton[displayValue="0"],
  WPushButton#VinylModeButton[displayValue="1"],
  WPushButton#VinylModeButton[displayValue="2"],
  WPushButton#HotcueButton[displayValue="0"],
  WPushButton#SpecialCueButton[displayValue="0"],
  #RateControls WPushButton[displayValue="0"],
  WPushButton#PflButton[displayValue="0"],
  WPushButton#MixModeButton[displayValue="0"],
  WPushButton#MixModeButton[displayValue="1"],
  WEffectSelector,
  #fadeModeCombobox,
  #SamplerContainer WPushButton#SyncSampler[displayValue="0"],
  #SamplerContainer WPushButton#PflButton[displayValue="0"],
  #MicAuxUnit WPushButton#PflButton[displayValue="0"],
  WPushButton#MicAuxAdd {
    background-color: #1e1e20;
  }
  /* brigth buttons in dimmed containers
  #BeatgridControls WPushButton[displayValue="0"], */
  #CueDeleteButton,
  #SplitCue[displayValue="0"],
  #PlayPreview[displayValue="0"],
  /* library controls */
  #spinBoxTransition::up-button,
  #spinBoxTransition::down-button,
  QPushButton#pushButtonAutoDJ:enabled:!checked,
  #LibraryFeatureControls QPushButton:enabled {
    background-color: #222;
  }
  /* dark buttons in toolbar */
  #ToolBar WPushButton[displayValue="0"],
  #MixerMasterHeadphone #FxAssignButtons WPushButton[displayValue="0"] {
    background-color: #151517;
  }

/* Orange for 'active' status */
WPushButton#PlayDeck[displayValue="1"],
WPushButton#PlayDeckMini[displayValue="1"],
WPushButton#PlaySampler[displayValue="1"],
WPushButton#PlayPreview[displayValue="1"],
WPushButton#PlayIndicator[displayValue="1"],
#LibraryPreviewButton:checked,
#CueDeck[displayValue="1"],
WPushButton#Reverse[pressed="true"],
#LoopActivate[value="1"],
#Reloop[value="1"],
#SyncSampler[displayValue="1"],
#MicTalk[value="1"], #AuxPlay[value="1"],
#MicDucking[value="1"],
#MicDucking[value="2"],
#VinylButton[displayValue="1"],
#PassthroughButton[displayValue="1"],
#BroadcastButton[displayValue="4"], /* warning */
QPushButton#pushButtonAutoDJ:checked,
QPushButton#pushButtonAnalyze:checked {
  background-color: #b24c12;
  }
  /* Orange border for Play buttons when previewing from
    Cue or Hotcue */
  WPushButton#PreviewIndicator[value="1"] {
    border: 3px solid #b24c12;
    /* work around round borders being painted outside the actual border area */
    border-radius: 0px;
  }
/* dim orange for momentary controls */
#KeyControls WPushButton[pressed="true"],
#SyncDeck[value="1"],
WPushButton#LoopIn[pressed="true"],
WPushButton#LoopOut[pressed="true"],
#BeatjumpControls WPushButton[value="1"],
#RateControls WPushButton[value="1"],
#BeatgridControls WPushButton[pressed="true"]/*,
#CueDeleteButton[pressed="true"]*/ {
  background-color: #7d350d;
  }
  #BpmTap[pressed="true"] {
   border: 1px solid #7d350d;
  }

/* Red */
#EQKillButtonBox WPushButton[displayValue="1"],
QPushButton#pushButtonRecording:checked,
#RecFeedback[displayValue="2"] {
  background-color: #a80000;
}

/* Green for Fx toggles, QuickEffect + Fx12 */
#FxUnit1 #FxToggleButton[displayValue="1"],
#FxUnit2 #FxToggleButton[displayValue="1"],
#BroadcastButton[displayValue="2"] {
  background-color: #438225;
  }
  /* Dim green for assign buttons Fx12 */
  WPushButton#QuickEffectButton[displayValue="1"],
  #FxAssignButton1[displayValue="1"],
  #FxAssignButton2[displayValue="1"] {
    background-color: #236b00;
  }
/* Blue for Fx buttons 3/4 */
#FxUnit3 #FxToggleButton[displayValue="1"],
#FxUnit4 #FxToggleButton[displayValue="1"],
WBeatSpinBox::up-button:pressed,
WBeatSpinBox::down-button:pressed,
#spinBoxTransition::up-button:pressed,
#spinBoxTransition::down-button:pressed {
  background-color: #257b82;
  }
  /* Dim blue for assign buttons Fx34 */
  #FxAssignButton3[displayValue="1"],
  #FxAssignButton4[displayValue="1"] {
    background-color: #146674;
  }

WPushButton#FxSuperLinkButton[value="0"],
WPushButton#FxSuperLinkInvertButton[displayValue="0"] {
  background-color: #333;
  }
  #FxSuperLinkInvertButton[displayValue="1"] {
    background-color: #9C0900;
    }

/* Green for Fx1 / Fx2 */
#FxUnit1 #FxSuperLinkButton[value="1"],
#FxUnit2 #FxSuperLinkButton[value="1"] {
  background-color: #236b00;
  }
#FxUnit1 #FxSuperLinkButton[value="2"],
#FxUnit2 #FxSuperLinkButton[value="2"] {
/* a simple way to achieve a partitioning in thirds  */
  background-color: qlineargradient(x1: 0, y1: 0, x2: 1, y2: 0,
    stop: 0 #236b00,
    stop: 0.33 #236b00,
    stop: 0.34 #333,
    stop: 1 #333);
  }
#FxUnit1 #FxSuperLinkButton[value="3"],
#FxUnit2 #FxSuperLinkButton[value="3"] {
  background-color: qlineargradient(x1: 0, y1: 0, x2: 1, y2: 0,
    stop: 0 #333,
    stop: 0.66 #333,
    stop: 0.67 #236b00,
    stop: 1 #236b00);
  }
#FxUnit1 #FxSuperLinkButton[value="4"],
#FxUnit2 #FxSuperLinkButton[value="4"] {
  background-color: qlineargradient(x1: 0, y1: 0, x2: 1, y2: 0,
    stop: 0 #236b00,
    stop: 0.330000 #236b00,
    stop: 0.340000 #333,
    stop: 0.660000 #333,
    stop: 0.670000 #236b00,
    stop: 1 #236b00);
  }

/* Blue for Fx3 / Fx4 */
#FxUnit3 #FxSuperLinkButton[value="1"],
#FxUnit4 #FxSuperLinkButton[value="1"] {
  background-color: #146674;
  }
#FxUnit3 #FxSuperLinkButton[value="2"],
#FxUnit4 #FxSuperLinkButton[value="2"] {  /*
  a simple way to achieve a partitioning in thirds  */
  background-color: qlineargradient(x1: 0, y1: 0, x2: 1, y2: 0,
    stop: 0 #146674,
    stop: 0.33 #146674,
    stop: 0.34 #333,
    stop: 1 #333);
  }
#FxUnit3 #FxSuperLinkButton[value="3"],
#FxUnit4 #FxSuperLinkButton[value="3"] {
  background-color: qlineargradient(x1: 0, y1: 0, x2: 1, y2: 0,
    stop: 0 #333,
    stop: 0.66 #333,
    stop: 0.67 #146674,
    stop: 1 #146674);
  }
#FxUnit3 #FxSuperLinkButton[value="4"],
#FxUnit4 #FxSuperLinkButton[value="4"] {
  background-color: qlineargradient(x1: 0, y1: 0, x2: 1, y2: 0,
    stop: 0 #146674,
    stop: 0.330000 #146674,
    stop: 0.340000 #333,
    stop: 0.660000 #333,
    stop: 0.670000 #146674,
    stop: 1 #146674);
  }

/* Yellow */
#RecFeedback[displayValue="1"],     /* initialize recording */
#BroadcastButton[displayValue="1"] {  /* connecting */
  background-color: #d09300;
}

#SpecialCueButton[value="1"] {
  background-color: #395579;
}

/* pink */
#BroadcastButton[displayValue="3"], /* failure */
#RecFeedback[displayValue="3"] {
  background-color: #f856e7;
}

/* Grey for GUI toggles */
#GuiToggleButton[displayValue="1"],
#SkinSettingsToggle[displayValue="1"] {
  background-color: #777;
}

/* Grey */
#VinylCueButton[displayValue="1"],
#VinylCueButton[displayValue="2"],
#PflButton[value="1"],
#FxParameterButton[displayValue="1"],
QPushButton#pushButtonRepeatPlaylist:checked {
  background-color: #666;
}

/* Darker grey */
#SplitCue[value="1"] {
  background-color: #555;
}

/* Special flat/invisible buttons */
#BeatgridControlsToggle,
WPushButton#PlayDeck[displayValue="0"],
WPushButton#PlayDeckMini[displayValue="0"],
WPushButton#PlaySampler[displayValue="0"],
#DeckRow_5_LoopCuesTransport WPushButton#PreviewIndicator,
#PlayCueMini WPushButton#PreviewIndicator,
WPushButton#FxFocusButton[displayValue="0"],
#SamplerSettings WPushButton[displayValue="0"],
#SamplerSettingsMini WPushButton[displayValue="0"],
WPushButton#FxExpand[displayValue="0"],
WPushButton#SamplerExpand[displayValue="0"],
WPushButton#CrossfaderButton[displayValue="0"],
WPushButton#CrossfaderButton[displayValue="1"],
WPushButton#RecButton[displayValue="0"],
WPushButton#RecButton[displayValue="1"],
#RecDot {
  background-color: transparent;
}



/************** Button icons **************************************************/
WPushButton#PlayDeck[value="0"] {
  image: url(skin:/palemoon/buttons/btn__play_deck.svg) no-repeat center center;
  }
  WPushButton#PlayDeck[value="1"] {
    image: url(skin:/palemoon/buttons/btn__play_deck_active.svg) no-repeat center center;
  }

#PlayDeckMini[value="0"] {
  image: url(skin:/palemoon/buttons/btn__play_deck_mini.svg) no-repeat center center;
  }
  #PlayDeckMini[value="1"] {
    image: url(skin:/palemoon/buttons/btn__pause_deck_mini.svg) no-repeat center center;
  }
#PlaySampler[value="0"],
#PlayPreview[displayValue="0"] {
  image: url(skin:/palemoon/buttons/btn__play_sampler.svg) no-repeat center center;
  }
  #PlaySampler[value="1"],
  #PlayPreview[displayValue="1"] {
    image: url(skin:/palemoon/buttons/btn__pause_sampler.svg) no-repeat center center;
  }

#CueDeck[displayValue="0"] {
  image: url(skin:/palemoon/buttons/btn__cue_deck.svg) no-repeat center center;
  }
  #CueDeck[displayValue="1"] {
    image: url(skin:/palemoon/buttons/btn__cue_deck_active.svg) no-repeat center center;
  }

#Reverse {
  image: url(skin:/palemoon/buttons/btn__reverse.svg) no-repeat center center;
  }
  #Reverse[pressed="true"] {
    image: url(skin:/palemoon/buttons/btn__reverse_active.svg) no-repeat center center;
  }

#Hotcue1 WPushButton[displayValue="0"] {
  image: url(skin:/palemoon/buttons/btn__1.svg) no-repeat center center;
  }
  #Hotcue1 WPushButton[displayValue="1"][dark="false"] {
    image: url(skin:/palemoon/buttons/btn__1_active.svg) no-repeat center center;
  }
  #Hotcue1 WPushButton[displayValue="1"][dark="true"] {
    image: url(skin:/palemoon/buttons/btn__1_active_dark.svg) no-repeat center center;
  }

#Hotcue2 WPushButton[displayValue="0"] {
  image: url(skin:/palemoon/buttons/btn__2.svg) no-repeat center center;
  }
  #Hotcue2 WPushButton[displayValue="1"] {
    image: url(skin:/palemoon/buttons/btn__2_active.svg) no-repeat center center;
  }
  #Hotcue2 WPushButton[displayValue="1"][dark="true"] {
    image: url(skin:/palemoon/buttons/btn__2_active_dark.svg) no-repeat center center;
  }

#Hotcue3 WPushButton[displayValue="0"] {
  image: url(skin:/palemoon/buttons/btn__3.svg) no-repeat center center;
  }
  #Hotcue3 WPushButton[displayValue="1"] {
    image: url(skin:/palemoon/buttons/btn__3_active.svg) no-repeat center center;
  }
  #Hotcue3 WPushButton[displayValue="1"][dark="true"] {
    image: url(skin:/palemoon/buttons/btn__3_active_dark.svg) no-repeat center center;
  }

#Hotcue4 WPushButton[displayValue="0"] {
  image: url(skin:/palemoon/buttons/btn__4.svg) no-repeat center center;
  }
  #Hotcue4 WPushButton[displayValue="1"] {
    image: url(skin:/palemoon/buttons/btn__4_active.svg) no-repeat center center;
  }
  #Hotcue4 WPushButton[displayValue="1"][dark="true"] {
    image: url(skin:/palemoon/buttons/btn__4_active_dark.svg) no-repeat center center;
  }

#Hotcue5 WPushButton[displayValue="0"] {
  image: url(skin:/palemoon/buttons/btn__5.svg) no-repeat center center;
  }
  #Hotcue5 WPushButton[displayValue="1"] {
    image: url(skin:/palemoon/buttons/btn__5_active.svg) no-repeat center center;
  }
  #Hotcue5 WPushButton[displayValue="1"][dark="true"] {
    image: url(skin:/palemoon/buttons/btn__5_active_dark.svg) no-repeat center center;
  }

#Hotcue6 WPushButton[displayValue="0"] {
  image: url(skin:/palemoon/buttons/btn__6.svg) no-repeat center center;
  }
  #Hotcue6 WPushButton[displayValue="1"] {
    image: url(skin:/palemoon/buttons/btn__6_active.svg) no-repeat center center;
  }
  #Hotcue6 WPushButton[displayValue="1"][dark="true"] {
    image: url(skin:/palemoon/buttons/btn__6_active_dark.svg) no-repeat center center;
  }

#Hotcue7 WPushButton[displayValue="0"] {
  image: url(skin:/palemoon/buttons/btn__7.svg) no-repeat center center;
  }
  #Hotcue7 WPushButton[displayValue="1"] {
    image: url(skin:/palemoon/buttons/btn__7_active.svg) no-repeat center center;
  }
  #Hotcue7 WPushButton[displayValue="1"][dark="true"] {
    image: url(skin:/palemoon/buttons/btn__7_active_dark.svg) no-repeat center center;
  }

#Hotcue8 WPushButton[displayValue="0"] {
  image: url(skin:/palemoon/buttons/btn__8.svg) no-repeat center center;
  }
  #Hotcue8 WPushButton[displayValue="1"] {
    image: url(skin:/palemoon/buttons/btn__8_active.svg) no-repeat center center;
  }
  #Hotcue8 WPushButton[displayValue="1"][dark="true"] {
    image: url(skin:/palemoon/buttons/btn__8_active_dark.svg) no-repeat center center;
  }

#SpecialCueButton_intro_start WPushButton[displayValue="0"] {
  image: url(skin:/palemoon/buttons/btn__intro_start.svg) no-repeat center center;
  }
  #SpecialCueButton_intro_start WPushButton[displayValue="1"] {
    image: url(skin:/palemoon/buttons/btn__intro_start_active.svg) no-repeat center center;
  }
#SpecialCueButton_intro_end WPushButton[displayValue="0"] {
  image: url(skin:/palemoon/buttons/btn__intro_end.svg) no-repeat center center;
  }
  #SpecialCueButton_intro_end WPushButton[displayValue="1"] {
    image: url(skin:/palemoon/buttons/btn__intro_end_active.svg) no-repeat center center;
  }
#SpecialCueButton_outro_start WPushButton[displayValue="0"] {
  image: url(skin:/palemoon/buttons/btn__outro_start.svg) no-repeat center center;
  }
  #SpecialCueButton_outro_start WPushButton[displayValue="1"] {
    image: url(skin:/palemoon/buttons/btn__outro_start_active.svg) no-repeat center center;
  }
#SpecialCueButton_outro_end WPushButton[displayValue="0"] {
  image: url(skin:/palemoon/buttons/btn__outro_end.svg) no-repeat center center;
  }
  #SpecialCueButton_outro_end WPushButton[displayValue="1"] {
    image: url(skin:/palemoon/buttons/btn__outro_end_active.svg) no-repeat center center;
  }

#LoopActivate[displayValue="0"] {
  image: url(skin:/palemoon/buttons/btn__loop.svg) no-repeat center center;
  }
  #LoopActivate[displayValue="1"], #LoopActivate[pressed="true"] {
    image: url(skin:/palemoon/buttons/btn__loop_active.svg) no-repeat center center;
  }
#Reloop[displayValue="0"] {
  image: url(skin:/palemoon/buttons/btn__reloop.svg) no-repeat center center;
  }
  #Reloop[displayValue="1"] {
    image: url(skin:/palemoon/buttons/btn__reloop_active.svg) no-repeat center center;
  }

#LoopIn {
  image: url(skin:/palemoon/buttons/btn__loop_in.svg) no-repeat center center;
  }
  #LoopIn[pressed="true"] {
    image: url(skin:/palemoon/buttons/btn__loop_in_active.svg) no-repeat center center;
  }
#LoopOut {
  image: url(skin:/palemoon/buttons/btn__loop_out.svg) no-repeat center center;
  }
  #LoopOut[pressed="true"] {
    image: url(skin:/palemoon/buttons/btn__loop_out_active.svg) no-repeat center center;
  }

#JumpForward {
  image: url(skin:/palemoon/buttons/btn__beatjump_right.svg) no-repeat center center;
  }
  #JumpForward[pressed="true"] {
    image: url(skin:/palemoon/buttons/btn__beatjump_right_active.svg) no-repeat center center;
  }
#JumpBack {
  image: url(skin:/palemoon/buttons/btn__beatjump_left.svg) no-repeat center center;
  }
  #JumpBack[pressed="true"] {
    image: url(skin:/palemoon/buttons/btn__beatjump_left_active.svg) no-repeat center center;
  }

/* Key buttons */
#KeyMatchReset {
  image: url(skin:/palemoon/buttons/btn__key_match.svg) no-repeat center center;
  }
  #KeyMatchReset[pressed="true"] {
    image: url(skin:/palemoon/buttons/btn__key_match_active.svg) no-repeat center center;
  }

#KeyUp {
  image: url(skin:/palemoon/buttons/btn__key_up.svg) no-repeat center center;
  }
  #KeyUp[pressed="true"] {
    image: url(skin:/palemoon/buttons/btn__key_up_active.svg) no-repeat center center;
  }

#KeyDown {
  image: url(skin:/palemoon/buttons/btn__key_down.svg) no-repeat center center;
  }
  #KeyDown[pressed="true"] {
    image: url(skin:/palemoon/buttons/btn__key_down_active.svg) no-repeat center center;
  }

/* Rate buttons */
#SyncDeck[displayValue="0"] {
  image: url(skin:/palemoon/buttons/btn__sync_deck.svg) no-repeat center center;
  }
  #SyncDeck[displayValue="1"] {
    image: url(skin:/palemoon/buttons/btn__sync_deck_active.svg) no-repeat center center;
  }

  #SyncSampler {
    image: url(skin:/palemoon/buttons/btn__sync_sampler.svg) no-repeat center center;
    }
    #SyncSampler[displayValue="1"] {
      image: url(skin:/palemoon/buttons/btn__sync_sampler_active.svg) no-repeat center center;
    }

  #RatePermUp {
    image: url(skin:/palemoon/buttons/btn__plus.svg) no-repeat center center;}
  #RatePermUp[pressed="true"] {
    image: url(skin:/palemoon/buttons/btn__plus_active.svg) no-repeat center center;
    }

  #RatePermDown {
    image: url(skin:/palemoon/buttons/btn__minus.svg) no-repeat center center;}
  #RatePermDown[pressed="true"] {
    image: url(skin:/palemoon/buttons/btn__minus_active.svg) no-repeat center center;
    }

  #RateTempUp {
    image: url(skin:/palemoon/buttons/btn__arrow_right_up.svg) no-repeat center center;}
  #RateTempUp[pressed="true"] {
    image: url(skin:/palemoon/buttons/btn__arrow_right_up_active.svg) no-repeat center center;
    }
  #RateTempDown {
    image: url(skin:/palemoon/buttons/btn__arrow_left_down.svg) no-repeat center center;}
  #RateTempDown[pressed="true"] {
    image: url(skin:/palemoon/buttons/btn__arrow_left_down_active.svg) no-repeat center center;
    }

  #RateTempUpRev {
    image: url(skin:/palemoon/buttons/btn__arrow_right_down.svg) no-repeat center center;}
  #RateTempUpRev[pressed="true"] {
    image: url(skin:/palemoon/buttons/btn__arrow_right_down_active.svg) no-repeat center center;
    }

  #RateTempDownRev {
    image: url(skin:/palemoon/buttons/btn__arrow_left_up.svg) no-repeat center center;
    }
    #RateTempDownRev[pressed="true"] {
      image: url(skin:/palemoon/buttons/btn__arrow_left_up_active.svg) no-repeat center center;
    }

/* Mixer buttons */
#PflButton[value="0"] {
  image: url(skin:/palemoon/buttons/btn__pfl.svg) no-repeat center center;
  }
  #PflButton[value="1"] {
    image: url(skin:/palemoon/buttons/btn__pfl_active.svg) no-repeat center center;
  }

#QuickEffectButton[displayValue="0"] {
  image: url(skin:/palemoon/buttons/btn__star.svg) no-repeat center center;
}

/* EQ Kill button icons H / M / L */
#EQKillButton_High[displayValue="0"] {
  image: url(skin:/palemoon/buttons/btn__eq_kill_high.svg) no-repeat center center;
}
#EQKillButton_Mid[displayValue="0"] {
  image: url(skin:/palemoon/buttons/btn__eq_kill_mid.svg) no-repeat center center;
}
#EQKillButton_Low[displayValue="0"] {
  image: url(skin:/palemoon/buttons/btn__eq_kill_low.svg) no-repeat center center;
}

/* EQ Kill / QuickEffect dots */
#EQKillDot[displayValue="0"],
#QuickEffectDot[displayValue="0"] {
  image: url(skin:/palemoon/buttons/btn__eq_kill_dot_off.svg) no-repeat center center;
  }
  #EQKillDot[displayValue="1"] {
    image: url(skin:/palemoon/buttons/btn__eq_kill_dot_active_red.svg) no-repeat center center;
  }
  #QuickEffectDot[displayValue="1"] {
    image: url(skin:/palemoon/buttons/btn__eq_kill_dot_active_green.svg) no-repeat center center;
  }

#RateCenter[highlight="0"] {
  image: url(skin:/palemoon/buttons/btn__rate_center_off.svg) no-repeat center center;
  }
  #RateCenter[highlight="1"] {
    image: url(skin:/palemoon/buttons/btn__rate_center_cyan.svg) no-repeat center center;
  }

#SplitCue[value="0"] {
  image: url(skin:/palemoon/buttons/btn__split.svg) no-repeat center center;
  }
  #SplitCue[value="1"] {
    image: url(skin:/palemoon/buttons/btn__split_active.svg) no-repeat center center;
  }

#FxExpand[value="0"],
#SamplerExpand[value="0"],
#LibExpand[value="0"] {
  image: url(skin:/palemoon/buttons/btn__expand_dim.svg) no-repeat center center;
  }
  #FxExpand[value="1"],
  #SamplerExpand[value="1"],
  #LibExpand[value="1"] {
    image: url(skin:/palemoon/buttons/btn__collapse_dim.svg) no-repeat center center;
  }

#MixModeButton[value="0"] {
  image: url(skin:/palemoon/buttons/btn__fx_mixmode_d-w.svg) no-repeat center center;
  }
  #MixModeButton[value="1"] {
    image: url(skin:/palemoon/buttons/btn__fx_mixmode_d+w.svg) no-repeat center center;
  }

#FxToggleButton[value="0"] {
  image: url(skin:/palemoon/buttons/btn__fx_toggle.svg) no-repeat center center;
  }
  #FxToggleButton[value="1"] {
    image: url(skin:/palemoon/buttons/btn__fx_toggle_active.svg) no-repeat center center;
  }

#FxFocusButton[value="0"] {
  image: url(skin:/palemoon/buttons/btn__fx_focus.svg) no-repeat center center;
  }
  #FxFocusButton[value="1"] {
    image: url(skin:/palemoon/buttons/btn__fx_focus_active.svg) no-repeat center center;
  }

/* deck controls for decks 1-4 and samplers */
#CurposButton12[displayValue="0"], #CurposButton34[displayValue="0"] {
  image: url(skin:/palemoon/buttons/btn__beat_curpos.svg) no-repeat center center;
  }
  #CurposButton12[value="1"] {
    image: url(skin:/palemoon/buttons/btn__beat_curpos_active_12.svg) no-repeat center center;
  }
  #CurposButton34[value="1"] {
    image: url(skin:/palemoon/buttons/btn__beat_curpos_active_34.svg) no-repeat center center;
  }

  #EjectButton12[displayValue="0"], #EjectButton34[displayValue="0"] {
    image: url(skin:/palemoon/buttons/btn__eject.svg) no-repeat center center;
    }
    #EjectButton12[value="1"] {
      image: url(skin:/palemoon/buttons/btn__eject_active_12.svg) no-repeat center center;
    }
    #EjectButton34[value="1"] {
      image: url(skin:/palemoon/buttons/btn__eject_active_34.svg) no-repeat center center;
    }

  #RepeatButton12[displayValue="0"], #RepeatButton34[displayValue="0"] {
    image: url(skin:/palemoon/buttons/btn__repeat.svg) no-repeat center center;
    }
    #RepeatButton12[displayValue="1"] {
      image: url(skin:/palemoon/buttons/btn__repeat_active_12.svg) no-repeat center center;
    }
    #RepeatButton34[displayValue="1"] {
      image: url(skin:/palemoon/buttons/btn__repeat_active_34.svg) no-repeat center center;
    }

  #QuantizeButton12[displayValue="0"], #QuantizeButton34[displayValue="0"] {
    image: url(skin:/palemoon/buttons/btn__quantize.svg) no-repeat center center;
    }
    #QuantizeButton12[displayValue="1"] {
      image: url(skin:/palemoon/buttons/btn__quantize_active_12.svg) no-repeat center center;
    }
    #QuantizeButton34[displayValue="1"] {
      image: url(skin:/palemoon/buttons/btn__quantize_active_34.svg) no-repeat center center;
    }

  #SlipmodeButton12[displayValue="0"], #SlipmodeButton34[displayValue="0"] {
    image: url(skin:/palemoon/buttons/btn__slip.svg) no-repeat center center;
    }
    #SlipmodeButton12[displayValue="1"] {
      image: url(skin:/palemoon/buttons/btn__slip_active_12.svg) no-repeat center center;
    }
    #SlipmodeButton34[displayValue="1"] {
      image: url(skin:/palemoon/buttons/btn__slip_active_34.svg) no-repeat center center;
    }

  #KeylockButton12[displayValue="0"], #KeylockButton34[displayValue="0"] {
    image: url(skin:/palemoon/buttons/btn__keylock.svg) no-repeat center center;
    }
    #KeylockButton12[displayValue="1"] {
      image: url(skin:/palemoon/buttons/btn__keylock_active_12.svg) no-repeat center center;
    }
    #KeylockButton34[displayValue="1"] {
      image: url(skin:/palemoon/buttons/btn__keylock_active_34.svg) no-repeat center center;
    }

#BeatgridControlsToggle[displayValue="0"] {
  image: url(skin:/palemoon/buttons/btn__beatgrid_controls_expand.svg) no-repeat center center;
  }
  #BeatgridControlsToggle[displayValue="1"] {
    image: url(skin:/palemoon/buttons/btn__beatgrid_controls_collapse.svg) no-repeat center center;
  }

  #BeatCurposLarge[displayValue="0"] {
    image: url(skin:/palemoon/buttons/btn__beat_curpos_large.svg) no-repeat center center;
    }
    #BeatCurposLarge[pressed="true"] {
      image: url(skin:/palemoon/buttons/btn__beat_curpos_large_active.svg) no-repeat center center;
    }

  #BeatsEarlier {
    image: url(skin:/palemoon/buttons/btn__beats_earlier.svg) no-repeat center center;
    }
    #BeatsEarlier[pressed="true"] {
      image: url(skin:/palemoon/buttons/btn__beats_earlier_active.svg) no-repeat center center;
    }

  #BeatsLater {
    image: url(skin:/palemoon/buttons/btn__beats_later.svg) no-repeat center center;
    }
    #BeatsLater[pressed="true"] {
      image: url(skin:/palemoon/buttons/btn__beats_later_active.svg) no-repeat center center;
    }

  #BeatsSlower {
    image: url(skin:/palemoon/buttons/btn__beats_slower.svg) no-repeat center center;
    }
    #BeatsSlower[pressed="true"] {
      image: url(skin:/palemoon/buttons/btn__beats_slower_active.svg) no-repeat center center;
    }

  #BeatsFaster {
    image: url(skin:/palemoon/buttons/btn__beats_faster.svg) no-repeat center center;
    }
    #BeatsFaster[pressed="true"] {
      image: url(skin:/palemoon/buttons/btn__beats_faster_active.svg) no-repeat center center;
    }
  #HotcuesEarlier {
    image: url(skin:/palemoon/buttons/btn__beats_hotcues_earlier.svg) no-repeat center center;
  }
    #HotcuesEarlier[pressed="true"] {
      image: url(skin:/palemoon/buttons/btn__beats_hotcues_earlier_active.svg) no-repeat center center;
    }
  #HotcuesLater {
    image: url(skin:/palemoon/buttons/btn__beats_hotcues_later.svg) no-repeat center center;
  }
    #HotcuesLater[pressed="true"] {
      image: url(skin:/palemoon/buttons/btn__beats_hotcues_later_active.svg) no-repeat center center;
    }

#MicTalk[displayValue="0"] {
  image: url(skin:/palemoon/buttons/btn__mic_talk.svg) no-repeat center center;
  }
  #MicTalk[displayValue="1"] {
    image: url(skin:/palemoon/buttons/btn__mic_talk_active.svg) no-repeat center center;
  }

#AuxPlay[displayValue="0"] {
  image: url(skin:/palemoon/buttons/btn__aux_play.svg) no-repeat center center;
  }
  #AuxPlay[displayValue="1"] {
    image: url(skin:/palemoon/buttons/btn__aux_play_active.svg) no-repeat center center;
  }

#MicAuxAdd {
  image: url(skin:/palemoon/buttons/btn__plus_flat.svg) no-repeat center center;
}

#MicDucking[value="0"] {
  image: url(skin:/palemoon/buttons/btn__mic_duck_off.svg) no-repeat center center;
  }
  #MicDucking[value="1"] {
    image: url(skin:/palemoon/buttons/btn__mic_duck_auto.svg) no-repeat center center;
  }
  #MicDucking[value="2"] {
    image: url(skin:/palemoon/buttons/btn__mic_duck_manual.svg) no-repeat center center;
  }

#RecDot[highlight="0"] {
  image: url(skin:/palemoon/buttons/btn__rec_dot.svg) no-repeat center center;
  }
  #RecDot[highlight="1"], #RecDot[highlight="2"] {
    image: url(skin:/palemoon/buttons/btn__rec_dot_active.svg) no-repeat center center;
  }

#BroadcastButton[displayValue="0"] {
  /* for some reason the alignment isn't rescpected, so the icons
    have to be sized like available area (button size - margin) */
  image: url(skin:/palemoon/buttons/btn__broadcast_off.svg) no-repeat left top;
  }
  #BroadcastButton[displayValue="1"],
  #BroadcastButton[displayValue="2"],
  #BroadcastButton[displayValue="3"],
  #BroadcastButton[displayValue="4"] {
    image: url(skin:/palemoon/buttons/btn__broadcast_on.svg) no-repeat left top;
  }

#SkinSettingsToggle[displayValue="0"] {
  image: url(skin:/palemoon/buttons/btn__settings_off.svg) no-repeat left top;
  }
  #SkinSettingsToggle[displayValue="1"] {
    image: url(skin:/palemoon/buttons/btn__settings_on.svg) no-repeat left top;
  }

#ToolbarLogo {
  image: url(skin:/palemoon/style/mixxx_logo_small.svg) no-repeat center center;
}

WSearchLineEdit QToolButton:!focus {
  image: url(skin:/palemoon/buttons/btn__lib_clear_search.svg);
  }
  WSearchLineEdit QToolButton:focus {
    image: url(skin:/palemoon/buttons/btn__lib_clear_search_focus.svg);
  }

/* AutoDJ button icons */
QPushButton#pushButtonAutoDJ:!checked {
  image: url(skin:/palemoon/buttons/btn__autodj_enable_off.svg) no-repeat center center;
  }
  QPushButton#pushButtonAutoDJ:checked {
    image: url(skin:/palemoon/buttons/btn__autodj_enable_on.svg) no-repeat center center;
  }

QPushButton#pushButtonFadeNow:!enabled {
  image: url(skin:/palemoon/buttons/btn__autodj_fade_disabled.svg) no-repeat center center;
  }
  QPushButton#pushButtonFadeNow:enabled {
    image: url(skin:/palemoon/buttons/btn__autodj_fade.svg) no-repeat center center;
  }

QPushButton#pushButtonSkipNext:!enabled {
  image: url(skin:/palemoon/buttons/btn__autodj_skip_disabled.svg) no-repeat center center;
  }
  QPushButton#pushButtonSkipNext:enabled {
    image: url(skin:/palemoon/buttons/btn__autodj_skip.svg) no-repeat center center;
  }

QPushButton#pushButtonShuffle:enabled {
  image: url(skin:/palemoon/buttons/btn__autodj_shuffle.svg) no-repeat center center;
}

QPushButton#pushButtonAddRandom:enabled {
  image: url(skin:/palemoon/buttons/btn__autodj_addrandom.svg) no-repeat center center;
}

QPushButton#pushButtonRepeatPlaylist:!checked {
  image: url(skin:/palemoon/buttons/btn__autodj_repeat_playlist_off.svg) no-repeat center center;
  }
  QPushButton#pushButtonRepeatPlaylist:checked {
    image: url(skin:/palemoon/buttons/btn__autodj_repeat_playlist_on.svg) no-repeat center center;
  }
/* AutoDJ button icons */

/* widgets in cue popup menu */
WCueMenuPopup #CueDeleteButton {
  qproperty-icon: url(skin:/palemoon/buttons/btn__delete.svg);
  width: 24px;
  height: 42px;
  /* make the icon slightly larger than default 16px */
  qproperty-iconSize: 20px;
}

WCueMenuPopup #CueDeleteButton:pressed {
  background-color: #b24c12;
  outline: none;
  /* not applied: */
  qproperty-icon: url(skin:/palemoon/buttons/btn__delete_active.svg);
}
WCueMenuPopup #CueLabelEdit {
  /*border: 1px solid #c2b3a5;*/
  border-radius: 0px;
  background-color: #000;
  selection-color: #000;
  selection-background-color: #ccc;
  padding: 2px;
}

/* Color picker in WCueMenuPopup and WTrackMenu (library and decks) */
WColorPicker QPushButton {
}
WColorPicker QPushButton[checked="false"] {
  outline: none;
  border-width: 2px 2px 2px 2px;
  border-image: url(skin:/palemoon/buttons/btn_colorpicker.svg) 2 2 2 2;
  margin: 0px;
  padding: 0px;
}
WColorPicker QPushButton[checked="true"] {
  outline: none;
  border-width: 2px 2px 2px 2px;
  border-image: url(skin:/palemoon/buttons/btn_colorpicker_active.svg) 2 2 2 2;
  margin: 0px;
  padding: 0px;
  /* This property behaves really strange:
  * set to 20px it's 2px too tall
  * set to 18px it's 2px too small
  qproperty-iconSize: 20px;*/
}

/************** Button icons **************************************************/
/************** Button styles *************************************************/



/************** Library *********************************************/

WTrackTableView,
WLibraryTextBrowser,
WLibrarySidebar,
#SkinSettings,
WSearchLineEdit,
WLibrary QLineEdit,
#spinBoxTransition,
#LibraryBPMSpinBox {
  background-color: #0f0f0f;
}

WTrackTableView,
WLibraryTextBrowser,
WLibrarySidebar {
  alternate-background-color: #0a0a0a;
/* In selected library rows this sets the color of
  * shapes in star rating delegate
  * focus border of Cover Art and Color delegates
   > See src/library/coverartdelegate.cpp: "option.palette.highlightedText().color();" */
  selection-color: #fff;
  /* background of Color delegate in selected row */
  selection-background-color: #2c454f;
}
/* Selected rows in Tree and Tracks table */
WLibrarySidebar::item:selected,
WTrackTableView::item:selected,
#LibraryBPMButton::item:selected {
  color: #fff;
  background-color: #2c454f;
}
WLibrarySidebar,
WLibrarySidebar::item:focus {
  outline: none;
}

WTrackTableView:focus,
WLibrarySidebar:focus,
WLibraryTextBrowser:focus {
  border: 1px solid #257b82;
}

WLibrarySidebar {
  show-decoration-selected: 0;
}

/* Use the native focus decoration */
/* This is for all cells including Played and Location */
WTrackTableView,
/* This is for the BPM cell */
WTrackTableView QCheckBox:focus {
  outline: 1px solid #fff;
}
/* This uses a custom qproperty to set the focus border
  for Color and Cover Art cells, 1px solid, sharp corners.
  See src/library/tableitemdelegate.cpp */
WTrackTableView {
  qproperty-focusBorderColor: #fff;
}

/* Table cell in edit mode */
WLibrary QLineEdit,
#LibraryBPMSpinBox {
  color: #ddd;
  selection-color: #000;
  selection-background-color: #ccc;
  border: 1px solid #2c454f;
}

/* Entire BPM cell */
/* Lock icon at the left */
#LibraryBPMButton::indicator:checked {
  image: url(skin:/palemoon/buttons/btn__lib_bpm_locked_blue.svg);
  }
#LibraryBPMButton::indicator:unchecked {
  image: url(skin:/palemoon/buttons/btn__lib_bpm_unlocked_grey.svg);
  }
/* BPM value */
#LibraryBPMButton::item {}
/* BPM spinbox in edit mode */
#LibraryBPMSpinBox {
  border-width: 1px 2px 1px 0px;
  }
  /* When activated, the left border of the spinbox shows an
    artefact of the inactive BPM value. A small margin eliminates that.*/
  #LibraryBPMSpinBox::up-button,
  #LibraryBPMSpinBox::down-button {
    margin-right: 2px;
    }
    #LibraryBPMSpinBox::up-button {
      image: url(skin:/palemoon/buttons/btn__lib_spinbox_up.svg) no-repeat center center;
      }
    #LibraryBPMSpinBox::down-button {
      image: url(skin:/palemoon/buttons/btn__lib_spinbox_down.svg) no-repeat center center;
      }

/* Button in library "Preview" column */
#LibraryPreviewButton {
  margin: 0px;
  padding: 0px;
  border-radius: 2px;
  border: 1px solid transparent;
  }
  #LibraryPreviewButton:!checked {
    image: url(skin:/palemoon/buttons/btn__lib_preview_play.svg);
    }
  #LibraryPreviewButton:checked {
    image: url(skin:/palemoon/buttons/btn__lib_preview_pause.svg);
    }


/*********** table header styles *********************************/

WTrackTableViewHeader {
  }
  WTrackTableViewHeader::section {
    padding: 2px 1px 0px 3px;
    }
    WTrackTableViewHeader::up-arrow {
      image: url(skin:/palemoon/buttons/btn__lib_sort_up.svg);
    }
    WTrackTableViewHeader::down-arrow {
      image: url(skin:/palemoon/buttons/btn__lib_sort_down.svg);
    }




/*********** scrollbars *********************************/
#LibraryContainer QScrollBar,
WEffectSelector QAbstractScrollArea QScrollBar {
  border: 0px solid #585858;
  background: #000;
  border-radius: 2px;
  padding: 1px;
  color: #999;
  }
  #LibraryContainer QScrollBar:horizontal,
  WEffectSelector QAbstractScrollArea QScrollBar:horizontal {
    min-width: 12px;
    height: 15px;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    background-color: #000;
  }
  #LibraryContainer QScrollBar:vertical,
  WEffectSelector QAbstractScrollArea QScrollBar:vertical {
    min-height: 12px;
    width: 15px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    color: #b3b3b3;
    background-color: #000;
  }
  #LibraryContainer QScrollBar:vertical {
    border-top: 1px solid #212123;
  }
  /* catch scroll bar of focused treeview like this:
  WLibrarySidebar:focus QScrollBar:vertical {
  }*/
  #LibraryContainer QScrollBar::handle:horizontal,
  WEffectSelector QAbstractScrollArea QScrollBar::handle:horizontal {
    min-width: 25px;
  }
  #LibraryContainer QScrollBar::handle:vertical,
  WEffectSelector QAbstractScrollArea QScrollBar::handle:vertical {
    min-height: 25px;
  }

/* "add-page" and "sub-page" are the gutter of the scrollbar */
#LibraryContainer QScrollBar::add-page,
#LibraryContainer QScrollBar::sub-page,
WEffectSelector QAbstractScrollArea QScrollBar::add-page,
WEffectSelector QAbstractScrollArea QScrollBar::sub-page {
  min-width: 15px;
  min-height: 15px;
  background-color: #000;
  border-radius: 2px;
}
/* Turn off buttons */
#LibraryContainer QScrollBar::add-line,
#LibraryContainer QScrollBar::sub-line,
WEffectSelector QAbstractScrollArea QScrollBar::add-line,
WEffectSelector QAbstractScrollArea QScrollBar::sub-line {
  width: 0px;
  height: 0px;
  border: 0px;
}

/* Corner in between two scrollbars */
#LibraryContainer QAbstractScrollArea::corner,
WEffectSelector QAbstractScrollArea QScrollBar::corner {
  background-color: #1e1e1e;
}
/*********** scrollbars *********************************/


/*********** library search bar *********************************/
WSearchLineEdit {
  padding: 2px;
  selection-color: #000;
  selection-background-color: #ccc;
  }
  WSearchLineEdit:focus {
    padding: 1px;
    border: 2px solid #257b82;
    border-radius: 0px;
  }
  /* Dunno when this is true */
  WSearchLineEdit[active="false"] {
    color: #999;
  }
  WSearchLineEdit:disabled {
    background-color: #161617;
    color: #161617;
  }

/************ splitters ***********************/
/* HorizontalSplitter (the splitter itself is horizontal)
  splits
  - Waveforms / Decks/FX/etc
  - Library sidebar / Lib Coverart */
#WaveformSplitter,
#SidebarCoverSplitter {
  padding: 0px;
  margin: 0px;
  }
  #WaveformSplitter::handle,
  #SidebarCoverSplitter::handle {
      image: url(skin:/palemoon/style/splitter_handle_horizontal.svg);
      height: 9px;
    }
    #WaveformSplitter::handle:pressed,
    #SidebarCoverSplitter::handle:pressed
    /* doesn't catch hover state:
    #HorizontalSplitter::handle:hover,
    #HorizontalSplitter::handle[hover="true"] */ {
      image: url(skin:/palemoon/style/splitter_handle_horizontal_pressed.svg);
    }

/* VerticalSplitter (the splitter itself is vertical)
  splits
  * Library sidebar / Tracks table */
#LibrarySplitter {
  padding: 0px;
  margin: 0px;
  }
  #LibrarySplitter::handle {
    image: url(skin:/palemoon/style/splitter_handle_vertical.svg);
    padding: 0px;
    margin: 1px 0px 0px 0px;
    /* 'height' works although it's actually the width of the handle */
    height: 6px;
  }
  #LibrarySplitter::handle:pressed,
  #LibrarySplitter::handle:hover {
    image: url(skin:/palemoon/style/splitter_handle_vertical_pressed.png);
  }
/************ splitters ***********************/


/* Extra declaration for QRadioButton otherwise it shows up with wrong colors in
   Linux with Gnome */
WLibrary QLabel, WLibrary QRadioButton {
  background: transparent;
}

WLibrary QRadioButton::indicator:checked {
  image: url(skin:/palemoon/buttons/btn__lib_radio_button_on_blue.svg) center center;
}

WLibrary QRadioButton::indicator:unchecked {
  image: url(skin:/palemoon/buttons/btn__lib_radio_button_off.svg) center center;
}

/* Library feature pushbuttons
  Don't use 'WLibrary QPushButton' here, as this would apply padding
  to the Preview & BPM lock buttons as well.
  Define the buttons fore every Library feature instead. */
#LibraryFeatureControls QPushButton {
  margin: 0px 6px 3px 0px;
  }
/* add margin to compensate for frameless library table */
#LibraryFeatureControls QPushButton,
/* #fadeModeCombobox set below */
#spinBoxTransition {
  margin-top: 4px;
  }
  #LibraryFeatureControls QRadioButton {
    /* bottom margin! */
    margin: 6px 3px 4px 3px;
  }
  QLabel#labelProgress, /* Analysis progress */
  QLabel#labelSelectionInfo /* AutoDJ track selection info */ {
    margin: 4px 5px 5px 1px;
  }

WLibrarySidebar {
  show-decoration-selected: 0;
}
/* triangle for closed/opened branches in treeview */
/* closed */
WLibrarySidebar::branch:closed:has-children:!has-siblings:!selected,
WLibrarySidebar::branch:closed:has-children:has-siblings:!selected {
/* Suppresses that selected sidebar items branch indicator shows wrong color when
    out of focus ; lp:880588 */
  border-image: none;
  image: url(skin:/palemoon/style/library_branch_closed.svg);
  }
  /* closed, selected */
  WLibrarySidebar::branch:closed:has-children:!has-siblings:selected,
  WLibrarySidebar::branch:closed:has-children:has-siblings:selected {
    border-image: none;
    image: url(skin:/palemoon/style/library_branch_closed_selected.svg);
    background-color: #2c454f;
  }
/* open */
WLibrarySidebar::branch:open:has-children:!has-siblings,
WLibrarySidebar::branch:open:has-children:has-siblings {
  border-image: none;
  image: url(skin:/palemoon/style/library_branch_open.svg);
  }
  /* open, selected */
  WLibrarySidebar::branch:open:has-children:!has-siblings:selected,
  WLibrarySidebar::branch:open:has-children:has-siblings:selected {
    border-image: none;
    image: url(skin:/palemoon/style/library_branch_open_selected.svg);
    background-color: #2c454f;
    }
  /* space left of selected child item */
  WLibrarySidebar::branch:closed:!has-children:!has-siblings:selected,
  WLibrarySidebar::branch:closed:!has-children:has-siblings:selected,
  WLibrarySidebar::branch:open:!has-children:!has-siblings:selected,
  WLibrarySidebar::branch:open:!has-children:has-siblings:selected {
    border-image: none;
    background-color: #0f0f0f;
  }
/************** Library *******************************************************/



/************** common styles for WEffectSelector ******************************
*************** QSpinBox, QMenu, QToolTip *************************************/
QToolTip,
#MainMenu QMenu,
WLibrarySidebar QMenu,
WTrackTableViewHeader QMenu,
WLibraryTextBrowser QMenu,
WTrackMenu,
WTrackMenu QMenu,
QLineEdit QMenu,
WCueMenuPopup,
WCoverArtMenu,
WEffectSelector QAbstractScrollArea,
#fadeModeCombobox QAbstractScrollArea {
  border: 1px solid #333;
  border-radius: 1px;
}

QToolTip,
#MainMenu,
#MainMenu::item,
#MainMenu QMenu,
#MainMenu QMenu::item,
#MainMenu QMenu QCheckBox,
WLibrarySidebar QMenu,
WLibrarySidebar QMenu::item,
WTrackTableViewHeader QMenu,
WTrackTableViewHeader QMenu::item,
WLibraryTextBrowser QMenu,
WLibraryTextBrowser QMenu::item,
WTrackMenu,
WTrackMenu::item,
WTrackMenu QMenu,
WTrackMenu QMenu::item,
WTrackMenu QMenu QCheckBox,
QLineEdit QMenu,
QLineEdit QMenu::item,
WCoverArtMenu,
WCoverArtMenu::item,
WCueMenuPopup,
WCueMenuPopup QLabel,
WEffectSelector QAbstractScrollArea,
WEffectSelector::item,
#fadeModeCombobox QAbstractScrollArea,
#fadeModeCombobox::item {
  background-color: #151517;
}
/* hovered items */
#MainMenu::item:selected,
#MainMenu QMenu::item:selected,
#MainMenu QMenu::item:focus,
#MainMenu QMenu::item:hover,
#MainMenu QMenu::indicator:checked:selected,
/* ::indicator:!checked won't work. use 'unchecked' */
#MainMenu QMenu::indicator:unchecked:selected,
WLibrarySidebar QMenu::item:selected,
WTrackTableViewHeader QMenu::item:selected,
WTrackMenu::item:selected,
WTrackMenu QMenu::item:selected,
WTrackMenu QMenu QCheckBox:selected,
WTrackMenu QMenu QCheckBox:focus,
WTrackMenu QMenu QCheckBox:hover,
QLineEdit QMenu::item:selected,
WCoverArtMenu::item:selected,
#fadeModeCombobox::item:selected,
WEffectSelector::item:selected,
#SkinSettingsButton[hover="true"],
#SkinSettingsNumToggle[hover="true"],
#SkinSettingsNumToggleHeader[hover="true"],
#SkinSettingsMixerToggle[hover="true"],
#SkinSettingsLabelButton[hover="true"] {
  background-color: #2c454f;
  border-radius: 1px;
  color: #fff;
  /* remove OS focus indicator */
  outline: none;
  }
  /* hover over checked effect */
  WEffectSelector::item:checked:selected,
  WSearchLineEdit::item:checked:selected,
  #fadeModeCombobox::item:checked:selected {
    background-color: #2f2f2f;
    color: #fff;
  }
  /* remove OS focus indicator from some buttons */
  WLibrary QCheckBox:focus,
  #LibraryBPMButton::item:selected,
  WCueMenuPopup QPushButton:focus {
    outline: none;
  }
/* disabled menu items and checkboxes */
#MainMenu::item:disabled,
#MainMenu QMenu::item:disabled,
WLibrarySidebar QMenu::item:disabled,
WTrackMenu::item:disabled,
WTrackMenu QMenu::item:disabled,
WTrackMenu QMenu QCheckBox:disabled,
QLineEdit QMenu::item:disabled {
  color: #494949;
}

  #MainMenu QMenu::separator,
  WLibrarySidebar QMenu::separator,
  WTrackTableViewHeader QMenu::separator,
  WTrackMenu::separator,
  WTrackMenu QMenu::separator,
  WLibraryTextBrowser QMenu::separator,
  QLineEdit QMenu::separator,
  #SkinSettingsSeparator {
    border-top: 1px solid #000;
    border-bottom: 1px solid #222;
  }

  #MainMenu QMenu::right-arrow,
  WTrackMenu::right-arrow,
  WTrackMenu QMenu::right-arrow {
    image: url(skin:/palemoon/style/menu_arrow_ivory.svg);
    }
  #MainMenu QMenu::right-arrow:selected,
  WTrackMenu::right-arrow:selected,
  WTrackMenu QMenu::right-arrow:selected {
    image: url(skin:/palemoon/style/menu_arrow_white.svg);
  }

  #MainMenu QMenu::indicator:checked,
  #MainMenu QMenu::indicator:checked:selected {
    image: url(skin:/palemoon/buttons/btn__menu_checkbox_checked.svg);
    }
    #MainMenu QMenu::indicator:unchecked,
    #MainMenu QMenu::indicator:unchecked:selected {
      image: url(skin:/palemoon/buttons/btn__menu_checkbox.svg);
    }

  /* This is the only way to select the 'Played' checkbox.
    Note that this also selects the BPM lock, so style that afterwards. */
  WTrackTableView::indicator:unchecked {
    image: url(skin:/palemoon/buttons/btn__lib_checkbox.svg);
  }
  WLibrarySidebar QMenu::indicator:checked,
  WTrackTableViewHeader QMenu::indicator:checked,
  WTrackTableView::indicator:checked,
  WTrackMenu QMenu QCheckBox::indicator:checked {
    image: url(skin:/palemoon/buttons/btn__lib_checkmark_blue.svg);
  }
  WEffectSelector::indicator:checked,
  #fadeModeCombobox::indicator:checked {
    image: url(skin:/palemoon/buttons/btn__effect_selected.svg);
    width: 13px;
    height: 13px;
    margin-left: 4px;
  }
  /* disabled menu item and checkbox */
  WTrackMenu QMenu QCheckBox::indicator:disabled:unchecked,
  WTrackMenu QMenu QCheckBox::indicator:disabled:checked,
  WTrackMenu QMenu QCheckBox::indicator:indeterminate {
    background-color: #222;
  }
  WTrackMenu QMenu QCheckBox::indicator:disabled:checked {
    image: url(skin:/palemoon/buttons/btn__lib_checkmark_grey.svg);
  }
  WTrackMenu QMenu QCheckBox::indicator:indeterminate {
    image: url(skin:/palemoon/buttons/btn__lib_checkmark_indeterminate_blue.svg);
  }
  WTrackMenu QMenu QCheckBox::indicator:disabled:indeterminate {
    image: url(skin:/palemoon/buttons/btn__lib_checkmark_indeterminate_grey.svg);
  }
  WTrackMenu QMenu QCheckBox::indicator:disabled:checked,
  WTrackMenu QMenu QCheckBox::indicator:disabled:unchecked {
    border: 1px solid #222;
  }

/* explicitly remove icons from unchecked items otherwise
  selected, unchecked items would have a checkmark */
WLibrarySidebar QMenu::indicator:unchecked,
WLibrarySidebar QMenu::indicator:unchecked:selected,
WTrackTableViewHeader QMenu::indicator:unchecked,
WTrackTableViewHeader QMenu::indicator:unchecked:selected,
WEffectSelector::indicator:unchecked,
WEffectSelector::indicator:unchecked:selected,
#fadeModeCombobox::indicator:unchecked,
#fadeModeCombobox::indicator:unchecked:selected {
  image: none;
}
/************** common styles for WEffectSelector ******************************
*************** QSpinBox, QMenu, QToolTip *************************************/
