/*
  Deere , Skin for Mixxx 1.12.x
  www.mixxx.org
  Copyright (C) 2010-2015 RJ Ryan <rryan@mixxx.org>, S.Brandt <s.brandt@mixxx.org>
  This file is part of the "Deere" Skin for Mixxx
  "Deere" is licensed under the Creative Commons Attribution-ShareAlike 3.0 Unported license.
  http://creativecommons.org/licenses/by-sa/3.0/

  Mixxx skin documentation:
  http://mixxx.org/wiki/doku.php/creating_skins

  List of controls:
  http://mixxx.org/wiki/doku.php/mixxxcontrols

  Qt Style Sheets documentation:
  http://doc.qt.io/qt-4.8/stylesheet-examples.html

*/

/*******************************************************************************
 ** BORDER *********************************************************************
 *******************************************************************************/
/* These definitions put a faint border around all the widgets. We have to be
   tricky with top/bottom-ness to get things right. */
#DeckControls {
  border-color: #222;
  border-style: solid;
  border-left-width: 3px;
  border-right-width: 3px;
  padding-bottom: 5px;
}

#Crossfader {
  border-color: #222;
  border-style: solid;
  border-left-width: 3px;
  border-right-width: 3px;
  border-bottom-width: 3px;
}

#DeckTextRow {
  border-top: 0px solid #222;
  border-bottom: 0px solid #222;
}

#UpperTextRow {
  /* top 0px seems required for bottom 1px to work O_o */
  border-top: 0px solid #222;
  border-bottom: 0px solid #222;
}

#DeckRows {
  border: 0px solid #222;
  border-top: none;
}

#Deck1InnerColumn, #Deck3InnerColumn {
  border: 0px solid #222;
  border-left: 1px solid #222;
}

#Deck2InnerColumn, #Deck4InnerColumn {
  border: 0px solid #222;
  border-right: 1px solid #222;
}

/* Prevent a 2px border where the decks meet. */
#Deck3 #DeckRows, #Deck4 #DeckRows {
  border-top: none;
}

#VisualRow {
  border-top: 1px solid #222;
  background-color: transparent;
  margin: 0px;
}

#OverviewRow {
  border-top: 1px solid #222;
  background-color: transparent;
  margin: 0px;
  padding: 4px;
}

#ControlsRow {
  border-top: 1px solid #222;
  padding: 4px;
}

/* Rounded corners to split things up */

#Deck1, #Deck3 {
  border-bottom-right-radius:5px;
  border-top-right-radius:5px;
  border-width: 1px;
  border-style: solid;
  border-color: #222;
}

#Deck2, #Deck4 {
  border-bottom-left-radius:5px;
  border-top-left-radius:5px;
  border-width: 1px;
  border-style: solid;
  border-color: #222;
}

#Sampler {
  border: 1px solid #222;
}

/*******************************************************************************
 ** END BORDER *****************************************************************
 *******************************************************************************/


/*******************************************************************************
 ** LIBRARY *********************************************************************
 *******************************************************************************/

/* library table */
QTableView {
  color: #d2d2d2;
  background-color: #1F1F1F;
  alternate-background-color: #1A1A1A;
  selection-background-color: #006596;
  selection-color: #D6D6D6;
  border: 1px solid #1A1A1A;
  gridline-color: red;
}

/* checkbox in library "Played" column */
QTableView::indicator {
  width: 12px;
  height: 12px;
}

QTableView::indicator:checked {
  background: url(skin:/image/style_checkbox_checked.png);
}

QTableView::indicator:unchecked {
  background: url(skin:/image/style_checkbox_unchecked.png);
}

/* BPM lock icon in the library "BPM" column. */
#LibraryBPMButton::indicator:checked {
  image: url(:/images/library/ic_library_checked.png);
}

#LibraryBPMButton::indicator:unchecked {
  image: url(:/images/library/ic_library_unchecked.png);
}

/* button in library "Preview" column */
QPushButton#LibraryPreviewButton {
  width: 23px;
  height: 12px;
  background: transparent;
  border: none;
}

QPushButton#LibraryPreviewButton:!checked {
  image: url(skin:/image/style_library_preview_play.png);
}

QPushButton#LibraryPreviewButton:checked {
  image: url(skin:/image/style_library_preview_pause.png);
}

/* library header row */
QHeaderView {
  color: #d2d2d2;
  background: #1A1A1A;
  border-bottom: 1px solid #141414;
}

QHeaderView::section {
  height: 18px;
  font-size: 13px/15px;
  font-weight: normal;
  padding: 2px;
  background: #1A1A1A;
  border-top: none;
  border-bottom: 1px solid #141414;
  border-left: 1px solid #141414;
  border-right: none;
}

QHeaderView::section:selected {
  font-size: 13px/15px;
  font-weight: bold;
  padding: 2px;
  background: #1A1A1A;
  border-top: none;
  border-bottom: 1px solid #141414;
  border-left: 1px solid #141414;
  border-right: none;
}

QHeaderView::up-arrow {
  image: url(skin:/image/style_sort_up.svg)
}

QHeaderView::down-arrow {
  image: url(skin:/image/style_sort_down.svg)
}

/* library search bar */
WSearchLineEdit {
  margin: 0px 0px 0px 1px;
  padding: 2px;
  border: 1px solid #1A1A1A;
  background-color: #4B4B4B;
  color: #d2d2d2;
}

WSearchLineEdit:focus {
  margin: 2px 0px 0px 1px;
  padding: 2px;
  border: 1px solid #FF6600;
  background-color: #4B4B4B;
  color: #D6D6D6;
  selection-color: #222222;
}

/* library preview deck */
#PreviewDeckContainer {
  margin: 4px 0px 0px 0px;
  background-color: #333333;
  border: 1px solid #1A1A1A;
  qproperty-layoutSpacing: 2;
}

#PreviewDeckTextRow WLabel {
  padding: 2px;
  color: #d2d2d2;
  font-size: 12px/14px;
  text-transform: none;
}

#PreviewDeckVisualRow {
  padding: 2px;
  border-top: 1px solid #1A1A1A;
}

#PreviewDeckEjectButton[value="0"]:!hover {
  background: none;
  border: none;
}

/* Spacing between treeview and preview deck/search bar */
QTreeView {
  margin: 4px 0px 0px 0px;
}

/* sidebar, as well as root items for playlists, crates, and history */
QTextBrowser, QTreeView {
  color: #d2d2d2;
  background-color: #1F1F1F;
  selection-background-color: #006596;
  selection-color: #D6D6D6;
  border: 1px solid #1A1A1A;
  gridline-color: red;
  /* Suppresses that selected sidebar item's branch indicator shows wrong color
     when out of focus, see lp:880588 */
  show-decoration-selected: 1;
}
/* triangle for closed/opened branches in treeview */
QTreeView::branch:has-children:!has-siblings:closed,
QTreeView::branch:closed:has-children:has-siblings {
  border-image: none; image: url(skin:/image/style_branch_closed.png);
}

QTreeView::branch:open:has-children:!has-siblings,
QTreeView::branch:open:has-children:has-siblings {
  border-image: none; image: url(skin:/image/style_branch_open.png);
}

/* QSplitter between LibrarySidebar and Library */
#LibrarySplitter::handle {
  image: url(skin:/image/style_handle_horizontal_unchecked.svg);
  background: none;
}

#LibrarySplitter::handle:pressed {
  image: url(skin:/image/style_handle_horizontal_checked.svg);
  background: none;
}

#LibrarySplitter::handle:horizontal {
  width: 6px;
}

#LibrarySplitter::handle:vertical {
  height: 6px;
}

/* QSplitter between LibrarySidebar and CoverArt */
#LibraryCoverArtSplitter::handle {
  image: url(skin:/image/style_handle_vertical_unchecked.svg);
  background: none;
}

#LibraryCoverArtSplitter::handle:pressed {
  image: url(skin:/image/style_handle_vertical_checked.svg);
  background: none;
}

#LibraryCoverArtSplitter::handle:horizontal {
  width: 6px;
}

#LibraryCoverArtSplitter::handle:vertical {
  height: 6px;
}

/* library cover art widget */
#LibraryCoverArt {
  padding: 8px 4px 4px 4px;
  background-color: #1F1F1F;
  border: 1px solid #1A1A1A;
}
/* transition time in Auto DJ tab */
WLibrary QSpinBox {
  min-height: 20px;
  max-height: 20px;
  min-width: 40px;
  max-width: 40px;
}

WLibrary QSpinBox:editable {
  background: transparent;
  color:#d2d2d2;
}

/* Extra declaration for QRadionButton otherwise it shows up with wrong colors in Linux with Gnome */
WLibrary QLabel, WLibrary QRadioButton {
  /* same as QTreeview */
  color: #d2d2d2;
  margin: 0px 10px 0px 0px;
}

WLibrary QRadioButton::indicator {
  margin: 0px 5px 0px 2px;
  width: 18px;
  height: 18px;
}

WLibrary QRadioButton::indicator:checked {
  background: url(skin:/icon/ic_radio_button_on_18px.svg);
}

WLibrary QRadioButton::indicator:unchecked {
  background: url(skin:/icon/ic_radio_button_off_18px.svg);
}
/* buttons in library (in hierarchical order of appearance)
   Style them just as the other regular buttons */
#DlgMissing > QPushButton,
#DlgHidden > QPushButton,
#DlgAutoDJ > QPushButton,
#DlgRecording > QPushButton,
#DlgAnalysis > QPushButton {
  padding: 4px;
  color: #D2D2D2;
  background-color: qlineargradient(x1: 0, y1: 1, x2: 0, y2: 0,
                                    stop: 0 #4B4B4B,
                                    stop: 1 #4B4B4B);
  border: 1px solid #4B4B4B;
  border-radius: 2px;
  outline: none;
}

#DlgMissing > QPushButton:!enabled,
#DlgHidden > QPushButton:!enabled,
#DlgAutoDJ > QPushButton:!enabled,
#DlgAnalysis > QPushButton:!enabled {
  /* buttons in "disabled" (not click-able) state. They are nearly invisible
     by default QT palette, so style accordingly */
  padding: 4px;
  color: #808080; /* Default #A3A3A3 -90L HSL*/
  background-color: qlineargradient(spread:pad,
                                    x1:0, y1:0, x2:1, y2:0,
                                    stop:0 rgba(95, 95, 95, 127),
                                    stop:1 rgba(95, 95, 95, 127));
                                    /* 50% #5F5F5F = RGBA#5F5F5F7F */
  border: 0px solid #5F5F5F;
  border-radius: 2px;
  outline: none;
}

#DlgMissing > QPushButton:hover,
#DlgHidden > QPushButton:hover,
#DlgAutoDJ > QPushButton:hover,
#DlgRecording > QPushButton:hover,
#DlgAnalysis > QPushButton:hover {
  padding: 4px;
  color: #D2D2D2;
  background-color: qlineargradient(x1: 0, y1: 1, x2: 0, y2: 0,
                                    stop: 0 #5F5F5F,
                                    stop: 1 #5F5F5F);
  border: 0px solid #5F5F5F;
  border-radius: 2px;
  outline: none;
}

#DlgAutoDJ > QPushButton:checked,
#DlgRecording > QPushButton:checked,
#DlgAnalysis > QPushButton:checked {
  /* checkbuttons in active state */
  padding: 4px;
  color: #FDFDFD;
  background-color: qlineargradient(x1: 0, y1: 1, x2: 0, y2: 0,
                                    stop: 0 #006596,
                                    stop: 1 #006596);
  border: 0px solid #006596;
  border-radius: 2px;
  outline: none;
}

#DlgAutoDJ > QPushButton:checked:hover,
#DlgRecording > QPushButton:checked:hover,
#DlgAnalysis > QPushButton:checked:hover {
  /* checkbuttons hovered over in "active" state */
  padding: 4px;
  color: #FDFDFD;
  background-color: qlineargradient(x1: 0, y1: 1, x2: 0, y2: 0,
                                    stop: 0 #0080BE,
                                    stop: 1 #0080BE);
  border: 0px solid #0080BE;
  border-radius: 2px;
  outline: none;
}

#DlgMissing > QPushButton:pressed,
#DlgHidden > QPushButton:pressed,
#DlgAutoDJ > QPushButton:pressed,
#DlgAnalysis > QPushButton:pressed {
  /* pushbuttons in "down" state */
  padding: 4px;
  color: #FDFDFD;
  background-color: qlineargradient(x1: 0, y1: 1, x2: 0, y2: 0,
                                    stop: 0 #006596,
                                    stop: 1 #006596);
  border: 0px solid #006596;
  border-radius: 2px;
  outline: none;
}


/* Scroll bars */
QScrollBar:horizontal {
  border-top: 1px solid #141414;
  min-width: 12px;
  height: 15px;
  background: #222222;
  padding: 3px;
}
QScrollBar:vertical {
  border-left: 1px solid #141414;
  min-height: 12px;
  width: 15px;
  background: #222222;
  padding: 3px;
}
/* "add-page" and "sub-page" are the gutter of the scrollbar */
QScrollBar::add-page, QScrollBar::sub-page {
  background: none;
}
QScrollBar::handle:horizontal {
  min-width: 25px;
  background: #5F5F5F;
  border-radius: 3px;
  border: none;
}
QScrollBar::handle:vertical {
  min-height: 25px;
  background: #5F5F5F;
  border-radius: 3px;
  border: none;
}
QScrollBar::handle:horizontal:hover, QScrollBar::handle:vertical:hover {
  background: #B3B3B3;
}

/* Turn off buttons */
QScrollBar::add-line:horizontal, QScrollBar::add-line:vertical {
  width: 0px;
  height: 0px;
  border: none;
}
QScrollBar::sub-line:horizontal, QScrollBar::sub-line:vertical {
  width: 0px;
  height: 0px;
  border: none;
}

/*******************************************************************************
 ** END LIBRARY *****************************************************************
 *******************************************************************************/

/*******************************************************************************
 ** SKIN SETTINGS **************************************************************
 *******************************************************************************/

#SkinSettings {
  background-color: rgba(17.3%, 17.3%, 17.3%, 100%);
  margin-left: 4px;
}

#SkinSettingsTop {
  margin: 7px 4px 6px 6px;
}

#SkinSettingsTop > #h1 {
  font: 16px/18px;
  text-align: left;
  text-transform: uppercase;
  background: none;
}

#SkinSettings > #h2 {
  font: 14px/16px;
  text-align: left;
  color: #d2d2d2;
  background-color: none;
  margin: 0.2em;
  border-top: none;
  border-bottom: 1px solid #A9A9A9;
}

#SkinSettings > #h3 {
  font: 12px/14px;
  background-color: none;
  text-align: left;
  margin: 0.5em;
}

#SkinSettings > #h3 WPushButton {
  font: 12px/14px;
  background-color: none;
  text-transform: none;
  border: none;
}

#SkinSettings > #h3 WPushButton:hover {
  background: #222222;
}

/*******************************************************************************
 ** END SKIN SETTINGS **********************************************************
 *******************************************************************************/

#Mixxx {
  background-color: black;
  font-family: "Open Sans";
}

WWidget, QLabel {
  font-family: "Open Sans";
  font-size: 8px;
  text-transform: uppercase;
}

/* Start spacing for Deck overview row (small waveform, option grid) */
#OptionGrid {
  background-color: #333333;
  padding: 1px;
  qproperty-layoutSpacing: 2;
}

#OptionGridRow1, #OptionGridRow2 {
  qproperty-layoutSpacing: 2;
}

#OverviewRow {
  qproperty-layoutSpacing: 5;
}
/* End spacing for Deck overview row */

#WaveformZoomContainer {
  background-color: #333333;
  padding: 1px;
  qproperty-layoutSpacing: 2;
}

/* Start spacing for Deck inner column (tempo slider, rate change) */
#Deck1InnerColumn, #Deck3InnerColumn {
  background-color: #333333;
  padding: 4px;
  qproperty-layoutSpacing: 2;
}

#Deck2InnerColumn, #Deck4InnerColumn {
  background-color: #333333;
  padding: 4px;
  qproperty-layoutSpacing: 2;
}

#RateTempButtons {
  qproperty-layoutSpacing: 2;
}
/* End spacing for Deck inner column (tempo slider, rate change) */


/* Start spacing for Deck controls row (transport, beatgrid, looping, hotcue) */
#ControlsRow {
  qproperty-layoutSpacing: 5;
}

#HotcueGrid, #HotcueGridExtended {
  background-color: #333333;
  padding: 1px;
  qproperty-layoutSpacing: 2;
}
#HotcueGridExtendedRow1, #HotcueGridExtendedRow1 {
  qproperty-layoutSpacing: 2;
}

#HotcueGrid WWidgetGroup, #HotcueGridExtended WWidgetGroup {
  qproperty-layoutSpacing: 2;
}

#HotcueGrid WPushButton, #HotcueGridExtended WPushButton {
}

#LoopingContainer, #BeatLoopContainer, #TransportContainer {
  background-color: #333333;
  padding: 1px;
  qproperty-layoutSpacing: 2;
}

#LoopingContainer WWidgetGroup, #BeatLoopContainer WWidgetGroup, #TransportContainer WWidgetGroup {
  qproperty-layoutSpacing: 2;
}

#LoopingContainer WPushButton, #BeatLoopContainer WPushButton, #TransportContainer WPushButton {
}
/* End spacing for Deck controls row */

/* Start spacing for toolbar */
#ToolBar {
  padding: 0px 4px 0px 4px;
  qproperty-layoutSpacing: 5;
  background-color: #111111;
}

#NotificationsContainer {
  qproperty-layoutSpacing: 4;
}

#MasterControls, #HeadphoneControls {
    qproperty-layoutSpacing: 10;
    margin-bottom: 1px;
    margin-top: 1px;
}

#HeadphoneControls {
    margin-right: 30px;
}
/* End spacing for toolbar */

#Time {
  font: bold 12px;
}

#KnobLabelH, #HeadSplit {
  font: bold 10px;
}

/* All widget groups that are children of #DeckRows should AlignTop. */
#DeckRows > WWidgetGroup {
  qproperty-layoutAlignment: 'AlignTop | AlignHCenter';
}

#ArtistGutter, #TitleGutter {
  qproperty-layoutAlignment: 'AlignLeft | AlignTop';
  padding: 2px;
}

#BPMGutter, #PositionGutter {
  qproperty-layoutAlignment: 'AlignRight | AlignTop';
  qproperty-layoutSpacing: 10;
  padding: 2px;
}

/* Start editable widgets in decks */
#BpmEditRow:hover, #KeyEditRow:hover, #PositionGutter:hover, #StarratingGutter:hover {
  /* emphasize editable widgets on hover */
  border: 1px solid #FF6600;
  background-color: rgba(255, 102, 0, 128);
}

#BpmEditRowExpanded, #KeyEditRowExpanded {
  /* emphasize active widget */
  border: 1px solid #FF6600;
  background: rgba(255, 102, 0, 64);
  color: #D6D6D6;
}

#BpmEditTrigger, #KeyEditTrigger {
  /* make trigger button transparent */
  background-color: none;
  border: none;
}

#BpmEditRowControls, #KeyEditRowControls {
  /* Make room between buttons */
  background-color: #333333;
  padding-left: 2px;
  padding-right: 2px;
  margin-left: 2px;
  qproperty-layoutSpacing: 2;
}
/* End editable widgets in decks */

#DeckTextRow #ArtistGutter WLabel, #DeckTextRow #BPMGutter WLabel, #DeckTextRow #PositionGutter WLabel {
  font-weight: bold;
  font-size: 15px;
  text-transform: none;
}

#SamplerTextRow #ArtistGutter WLabel, #SamplerTextRow #BPMGutter WLabel, #SamplerTextRow #PositionGutter WLabel {
  font-weight: bold;
  font-size: 11px;
  text-transform: none;
}

#BPMGutter WLabel, #PositionGutter WLabel {
  qproperty-alignment: 'AlignRight | AlignVCenter';
}

#DeckTextRow #TitleGutter WLabel, #EffectRackExpanded #EffectUnitNameContainer WLabel {
  font-weight: bold;
  font-size: 17px;
  text-transform: none;
  text-align: left;
}

#SamplerTextRow #TitleGutter WLabel {
  font-weight: bold;
  font-size: 13px;
  text-transform: none;
  text-align: left;
}

#EffectRackCollapsed #EffectUnitNameContainer WLabel {
  font-weight: bold;
  font-size: 15px;
  text-transform: none;
  text-align: left;
}

#EffectUnitNameRow {
  border-bottom: 1px solid #222;
  background-color: transparent;
  margin: 0px;
}

#EffectUnit1, #EffectUnit2, #EffectUnit3, #EffectUnit4 {
  qproperty-layoutAlignment: 'AlignTop';
  border: 1px solid #222;
  border-left:none;
}

#EffectUnit1 {
  border-left: 1px solid #222;
}

#EffectUnitNameContainer {
  padding: 2px;
  qproperty-layoutAlignment: 'AlignLeft | AlignVCenter';
}

#EffectUnitNextPrevContainer {
  background-color: #333333;
  padding: 1px;
  qproperty-layoutSpacing: 2;
  qproperty-layoutAlignment: 'AlignRight | AlignVCenter';
}

#EffectUnitNextPrevContainer WPushButton {
  font-size: 11px;
}

#EffectKnob {
}

#EffectButton {
}

#EffectButtonParameter {
  margin-top: 3px;
}

#KnobLabel {
  background-color: none;
  border: none;
  qproperty-alignment: 'AlignHCenter';
  font: 9px;
  margin-top: -3px;
}

#SmallKnobLabel {
  background-color: none;
  border: none;
  qproperty-alignment: 'AlignHCenter';
  font: 9px;
  margin-top: -2px;
}

#EffectUnitNameRow {
}

#EffectUnitMainKnobsContainer {
    qproperty-layoutSpacing: 7;
}

#EffectKnobLabel {
  background-color: none;
  border: none;
  qproperty-alignment: 'AlignHCenter | AlignTop';
  font: 8px;
  margin-top: -2px;
}

#EffectButtonLabel {
  background-color: none;
  border: none;
  qproperty-alignment: 'AlignHCenter';
  font: 8px;
  margin-top: 1px;
}

#Mixer {
  qproperty-layoutAlignment: 'AlignTop';
}

#CrossfaderAutoDjActive {
  background-color: #001726;
}

#MasterControls {
  qproperty-layoutSpacing: 0;
}

#DeckControls {
  qproperty-layoutSpacing: 0;
}

#MainDeckContainer {
  background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
                                    stop: 0 #333333,
                                    stop: 1.0 #333333);
}

#LeftGutter, #RightGutter {
  background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
                                    stop: 0 #222222,
                                    stop: 1.0 #222222);
}

#Deck1, #Deck2 {
  background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
                                    stop: 0 #333333,
                                    stop: 1.0 #333333);
}

#Deck3, #Deck4 {
  background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
                                    stop: 0 #333333,
                                    stop: 1.0 #333333);
}

WWidget, WLabel {
  /* All labels should default to a grey that is readable on black. */
  color: #D2D2D2;
}

/* Track text, etc. should be in the deck color. */
#Deck1 WLabel {
  color: #D2D2D2;
}

#DeckMixer1 {
  background-color: #333333;
}

/* Track text, etc. should be in the deck color. */
#Deck2 WLabel {
  color: #D2D2D2;
}

#DeckMixer2 {
  background-color: #333333;
}

#Deck3 WLabel {
  color: #D2D2D2;
}

#DeckMixer3 {
  background-color: #333333;
}

#Deck4 WLabel {
  color: #D2D2D2;
}

#DeckMixer4 {
  background-color: #333333;
}

#DeckMixer1_Column2, #DeckMixer2_Column2, #DeckMixer3_Column2,
#DeckMixer4_Column2 {
  qproperty-layoutSpacing: 7;
  padding: 5;
  qproperty-layoutAlignment: 'AlignHCenter';
}

#4DecksMixerCol2Container {
  padding-left: 14px;
}

#channel_VuMeter_Group {
  qproperty-layoutSpacing: 3;
  qproperty-layoutAlignment: 'AlignHCenter';
}

#MasterVumeter {
  qproperty-layoutSpacing: 2;
  padding-left: 10px;
  padding-right: 10px;
}

#vumeter_v, #vumeter_h {
  qproperty-layoutSpacing: 3;
}

WVuMeter, #PeakIndicator {
  background-color: #222222;
}

/* Starrating for tracks loaded in decks */
WStarRating {
  margin            : 5px 5px 0px 0px;
  border            : 0px solid #ffffff;
  padding           : 2px;
  color             : #888888;
  background-color  : none;
}

#SampleDecksContainer {
  background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
                                    stop: 0 #333333,
                                    stop: 1.0 #333333);
}

#MicrophonesContainer {
}

#MicrophoneRackExpanded {
  background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
                                    stop: 0 #333333,
                                    stop: 1.0 #333333);
}

#MicrophoneContainer {
}

#AuxiliaryContainer {
}

#LibraryContainer {
  background-color: #222;
  padding-top: 4px;
}

#LibraryExpanded, #LibraryCollapsed {
  qproperty-layoutAlignment: 'AlignLeft | AlignVCenter';
}

#EffectRackContainer {
  background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
                                    stop: 0 #333333,
                                    stop: 1.0 #333333);
}

#EffectRackExpanded, #EffectRackCollapsed {
  qproperty-layoutAlignment: 'AlignLeft | AlignTop';
}

#EffectUnitParameters {
  padding: 2px;
  qproperty-layoutAlignment: 'AlignLeft | AlignTop';
  qproperty-layoutSpacing: 2;
}

#EffectUnitControls {
  padding: 2px;
  qproperty-layoutAlignment: 'AlignRight | AlignTop';
  qproperty-layoutSpacing: 2;
}

#EffectUnitGroupControls {
  qproperty-layoutAlignment: 'AlignRight | AlignTop';
  qproperty-layoutSpacing: 1;
}

#EffectUnit {
  font-size: 15px;
}

#EffectUnit1 {
}

#EffectUnit2 {
}

#EffectUnit3 {
}

#EffectUnit4 {
}

#SampleDecksContainer {
}

#SamplerBankContainer {
  padding: 4px;
  qproperty-layoutSpacing: 2;
}

#SampleDecksExpanded, #SampleDecksCollapsed {
  qproperty-layoutAlignment: 'AlignLeft | AlignTop';
}

#OverviewRow, #VisualRow, #ButtonRow {
  /*qproperty-layoutContentsMargins: rect(0 1 0 1);*/
}

WWidgetGroup {
  /*border: 1px solid rgb(128, 128, 128);*/
  /*margin: 0px;
  padding: 0px;
  qproperty-layoutSpacing: 0;
  qproperty-layoutContentsMargins: rect(0 0 0 0);*/
  /*qproperty-layoutAlignment: 'AlignCenter';*/
}

/*******************************************************************************
 ** Buttons  *******************************************************************
 *******************************************************************************/

WPushButton {
    color: #D2D2D2;
    background-color: qlineargradient(x1: 0, y1: 1, x2: 0, y2: 0,
                                      stop: 0 #4B4B4B,
                                      stop: 1 #4B4B4B);
    border: 1px solid #4B4B4B;
    border-radius: 2px;
    outline: none;
}

WPushButton:hover {
    color: #D2D2D2;
    background-color: qlineargradient(x1: 0, y1: 1, x2: 0, y2: 0,
                                      stop: 0 #5F5F5F,
                                      stop: 1 #5F5F5F);
    border: 0px solid #5F5F5F;
}

/*"Pressed" state*/
WPushButton[value="1"] {
    /*color: #FDFDFD;*/
    color: #FDFDFD;
    background-color: qlineargradient(x1: 0, y1: 1, x2: 0, y2: 0,
                                      stop: 0 #006596,
                                      stop: 1 #006596);
    border: 0px solid #006596;
}

WPushButton[value="1"]:hover {
    color: #FDFDFD;
    background-color: qlineargradient(x1: 0, y1: 1, x2: 0, y2: 0,
                                      stop: 0 #0080bE,
                                      stop: 1 #0080BE);
    border: 0px solid #0080BE;
}

/*"Enabled" state, e.g. for recording status
  0 -- disconnected / off
  1 -- connecting / enabling
  2 -- connected / enabled
*/
WPushButton[value="2"] {
    color: #FDFDFD;
    background-color: qlineargradient(x1: 0, y1: 1, x2: 0, y2: 0,
                                      stop: 0 #006596,
                                      stop: 1 #006596);
    border: 0px solid #006596;
}

WPushButton[value="2"]:hover {
    color: #FDFDFD;
    background-color: qlineargradient(x1: 0, y1: 1, x2: 0, y2: 0,
                                      stop: 0 #0080BE,
                                      stop: 1 #0080BE);
    border: 0px solid #0080BE;
}

/* Special case "orientation" controls
  1 -- center / default (off)
  2 -- right
  0 -- left
*/
#OrientationButton[value="1"] {
    color: #D2D2D2;
    background-color: qlineargradient(x1: 0, y1: 1, x2: 0, y2: 0,
                                      stop: 0 #4B4B4B,
                                      stop: 1 #4B4B4B);
    border: 1px solid #4B4B4B;
    border-radius: 2px;
    outline: none;
}

#OrientationButton:hover {
    color: #D2D2D2;
    background-color: qlineargradient(x1: 0, y1: 1, x2: 0, y2: 0,
                                      stop: 0 #5F5F5F,
                                      stop: 1 #5F5F5F);
    border: 0px solid #5F5F5F;
}

#OrientationButton[value="2"] {
    color: #FDFDFD;
    background-color: qlineargradient(x1: 0, y1: 1, x2: 0, y2: 0,
                                      stop: 0 #006596,
                                      stop: 1 #006596);
    border: 0px solid #006596;
}

#OrientationButton[value="2"]:hover {
    color: #FDFDFD;
    background-color: qlineargradient(x1: 0, y1: 1, x2: 0, y2: 0,
                                      stop: 0 #0080BE,
                                      stop: 1 #0080BE);
    border: 0px solid #0080BE;
}

#OrientationButton[value="0"] {
    color: #FDFDFD;
    background-color: qlineargradient(x1: 0, y1: 1, x2: 0, y2: 0,
                                      stop: 0 #006596,
                                      stop: 1 #006596);
    border: 0px solid #006596;
}

#OrientationButton[value="0"]:hover {
    color: #FDFDFD;
    background-color: qlineargradient(x1: 0, y1: 1, x2: 0, y2: 0,
                                      stop: 0 #0080BE,
                                      stop: 1 #0080BE);
    border: 0px solid #0080BE;
}

/* Special case link_type button for effect parameters
  0 -- not linked / default (off)
  1 -- linked (on)
  2 -- split linked left (on)
  3 -- split linked right (on)
  4 -- split linked left/right (on)

  We define only those values (2-4) that are not covered by the existing
  standard button definitions.
  Note: EQ Gain effects cannot be used in split mode (= can be 0 or 1 only)
*/
#EffectSlotParameterLinkTypeButton {
    margin: 0 4px 0 4px;
}

#EffectSlotParameterLinkTypeButton[value="2"] {
    color: none;
    background-color: qlineargradient(x1: 0, y1: 0, x2: 1, y2: 0,
                                      stop: 0 #006596,
                                      stop: 0.33 #006596,
                                      stop: 0.34 #4B4B4B,
                                      stop: 0.66 #4B4B4B,
                                      stop: 0.67 #4B4B4B,
                                      stop: 1 #4B4B4B);

    border: 0px solid #006596;
}

#EffectSlotParameterLinkTypeButton[value="2"]:hover {
    color: none;
    background-color: qlineargradient(x1: 0, y1: 0, x2: 1, y2: 0,
                                      stop: 0 #0080BE,
                                      stop: 0.33 #0080BE,
                                      stop: 0.34 #5F5F5F,
                                      stop: 0.66 #5F5F5F,
                                      stop: 0.67 #5F5F5F,
                                      stop: 1 #5F5F5F);

    border: 0px solid #0080BE;
}

#EffectSlotParameterLinkTypeButton[value="3"] {
    color: none;
    background-color: qlineargradient(x1: 0, y1: 0, x2: 1, y2: 0,
                                      stop: 0 #4B4B4B,
                                      stop: 0.33 #4B4B4B,
                                      stop: 0.34 #4B4B4B,
                                      stop: 0.66 #4B4B4B,
                                      stop: 0.67 #006596,
                                      stop: 1 #006596);

    border: 0px solid #006596;
}


#EffectSlotParameterLinkTypeButton[value="3"]:hover {
    color: none;
    background-color: qlineargradient(x1: 0, y1: 0, x2: 1, y2: 0,
                                      stop: 0 #5F5F5F,
                                      stop: 0.33 #5F5F5F,
                                      stop: 0.34 #5F5F5F,
                                      stop: 0.66 #5F5F5F,
                                      stop: 0.67 #0080BE,
                                      stop: 1 #0080BE);

    border: 0px solid #0080BE;
}

#EffectSlotParameterLinkTypeButton[value="4"] {
    color: none;
    background-color: qlineargradient(x1: 0, y1: 0, x2: 1, y2: 0,
                                      stop: 0 #006596,
                                      stop: 0.330000 #006596,
                                      stop: 0.340000 #4B4B4B,
                                      stop: 0.660000 #4B4B4B,
                                      stop: 0.670000 #006596,
                                      stop: 1 #006596);

    border: 0px solid #006596;
}


#EffectSlotParameterLinkTypeButton[value="4"]:hover {
    color: none;
    background-color: qlineargradient(x1: 0, y1: 0, x2: 1, y2: 0,
                                      stop: 0 #0080BE,
                                      stop: 0.330000 #0080BE,
                                      stop: 0.340000 #5F5F5F,
                                      stop: 0.660000 #5F5F5F,
                                      stop: 0.670000 #0080BE,
                                      stop: 1 #0080BE);

    border: 0px solid #0080BE;
}

/* Special case "hide/show" button
   The button unfolds/folds widgets. We display different icons per state, but
   do not want an active or active:hover color like with the other buttons.
*/
#ShowHideToggle {
  qproperty-layoutAlignment: 'AlignTop';
  padding-top: 3px;
}

#SampleDeckToggle[value="1"], #LibraryToggle[value="1"], #EffectRackToggle[value="1"] {
    color: #D2D2D2;
    background-color: qlineargradient(x1: 0, y1: 1, x2: 0, y2: 0,
                                      stop: 0 #4B4B4B,
                                      stop: 1 #4B4B4B);
    border: 1px solid #4B4B4B;
    border-radius: 2px;
    outline: none;
}

#SampleDeckToggle[value="1"]:hover, #LibraryToggle[value="1"]:hover, #EffectRackToggle[value="1"]:hover {
    color: #D2D2D2;
    background-color: qlineargradient(x1: 0, y1: 1, x2: 0, y2: 0,
                                      stop: 0 #5F5F5F,
                                      stop: 1 #5F5F5F);
    border: 0px solid #5F5F5F;
}

#WaveformZoomDownButton[value="0"]:!hover,
#WaveformZoomSetDefaultButton[value="0"]:!hover,
#WaveformZoomUpButton[value="0"]:!hover {
  background: none;
  border: none;
}

#DeckCue {
  font: bold 12px;
}

#DeckSync {
  font: bold 10px;
}

#BeatJumpValue, #BeatLoopButton, #LoopMoveValue, #HotcueButton {
  font: bold 9px;
}

/*******************************************************************************
 ** End Buttons  ***************************************************************
 *******************************************************************************/

QToolTip {
    background-color: #222222;
    color: #CCCCCC;
    border: 1px solid #CCCCCC;
}
/*

#Deck1 {
  margin: 0px;
  qproperty-layoutSpacing: 0;
  qproperty-layoutContentsMargins: rect(10 2 10 2);
  padding-bottom: 10px;
  margin-bottom: 10px;
}

WWidget {
  border: 1px solid rgb(128, 128, 128);
  background-color: grey;
}

WSliderComposed {
  background-color: orange;
}

WPushButton[value="1"] {
  background-color: green;
}

WPushButton[pressed="true"] {
  background-color: pink;
}

#BeatLoopButton[value="1"][pressed="true"] {
  background-color: pink;
}

#BeatLoopButton[value="0"][pressed="true"] {
  background-color: orange;
}
*/
