Monadic-ScalaFX-Demo/src/main/resources/static/css/main.css

.root {
    -fx-font-family: Roboto;
    src: "/resources/roboto/Roboto-Regular.ttf";
}

/* Burgers Demo */

.jfx-hamburger {
    -fx-spacing: 5;
    -fx-cursor: hand;
}

.jfx-hamburger StackPane {
    -fx-pref-width: 40px;
    -fx-pref-height: 7px;
    -fx-background-color: #D63333;
    -fx-background-radius: 5px;
}

/* Input Demo */

.text-field {
    -fx-max-width: 300;
}

.jfx-text-field, .jfx-password-field {
    -fx-background-color: WHITE;
    -fx-font-weight: BOLD;
    -fx-prompt-text-fill: #808080;
    -fx-alignment: top-left;
    -jfx-focus-color: #4059A9;
    -jfx-unfocus-color: #4d4d4d;
    -fx-max-width: 300;
}

.jfx-decorator {
    -fx-decorator-color: RED;
}

.jfx-decorator .jfx-decorator-buttons-container {
    -fx-background-color: -fx-decorator-color;
}

.jfx-decorator .resize-border {
    -fx-border-color: -fx-decorator-color;
    -fx-border-width: 0 4 4 4;
}

.jfx-text-area, .text-area {
    -fx-font-weight: BOLD;
}

.jfx-text-field:error, .jfx-password-field:error, .jfx-text-area:error {
    -jfx-focus-color: #D34336;
    -jfx-unfocus-color: #D34336;
}

.jfx-text-field .error-label, .jfx-password-field .error-label, .jfx-text-area .error-label {
    -fx-text-fill: #D34336;
    -fx-font-size: 0.75em;
}

.jfx-text-field .error-icon, .jfx-password-field .error-icon, .jfx-text-area .error-icon {
    -fx-text-fill: #D34336;
    -fx-font-size: 1em;
}

/* Progress Bar Demo */

.progress-bar > .bar {
    -fx-min-width: 500;
}

.jfx-progress-bar > .bar {
    -fx-min-width: 500;
}

.jfx-progress-bar {
    -fx-progress-color: #0F9D58;
    -fx-stroke-width: 3;
}

/* Icons Demo */
.icon {
    -fx-text-fill: #FE774D;
    -fx-padding: 10;
    -fx-cursor: hand;
}

.icons-rippler {
    -jfx-rippler-fill: BLUE;
    -jfx-mask-type: CIRCLE;
}

.icons-rippler:hover {
    -fx-cursor: hand;
}

.jfx-check-box {
    -fx-font-weight: BOLD;
}

.custom-jfx-check-box {
    -jfx-checked-color: RED;
    -jfx-unchecked-color: BLACK;
}

/* Button */
.button {
    -fx-padding: 0.7em 0.57em;
    -fx-font-size: 14px;
}

.button-raised {
    -fx-padding: 0.7em 0.57em;
    -fx-font-size: 14px;
    -jfx-button-type: RAISED;
    -fx-background-color: rgb(77, 102, 204);
    -fx-pref-width: 200;
    -fx-text-fill: WHITE;
}

/* The main scrollbar **track** CSS class  */
.mylistview .scroll-bar:horizontal .track,
.mylistview .scroll-bar:vertical .track {
    -fx-background-color: transparent;
    -fx-border-color: transparent;
    -fx-background-radius: 0em;
    -fx-border-radius: 2em;
}

/* The increment and decrement button CSS class of scrollbar */
.mylistview .scroll-bar:horizontal .increment-button,
.mylistview .scroll-bar:horizontal .decrement-button {
    -fx-background-color: transparent;
    -fx-background-radius: 0em;
    -fx-padding: 0 0 10 0;
}

/* The increment and decrement button CSS class of scrollbar */

.mylistview .scroll-bar:vertical .increment-button,
.mylistview .scroll-bar:vertical .decrement-button {
    -fx-background-color: transparent;
    -fx-background-radius: 0em;
    -fx-padding: 0 10 0 0;

}

.mylistview .scroll-bar .increment-arrow,
.mylistview .scroll-bar .decrement-arrow {
    -fx-shape: " ";
    -fx-padding: 0;
}

/* The main scrollbar **thumb** CSS class which we drag every time (movable) */
.mylistview .scroll-bar:horizontal .thumb,
.mylistview .scroll-bar:vertical .thumb {
    -fx-background-color: derive(black, 90%);
    -fx-background-insets: 2, 0, 0;
    -fx-background-radius: 2em;
}

.jfx-list-cell-container {
    -fx-alignment: center-left;
}

.jfx-list-cell-container > .label {
    -fx-text-fill: BLACK;
}

.jfx-list-cell:odd:selected > .jfx-rippler > StackPane, .jfx-list-cell:even:selected > .jfx-rippler > StackPane {
    -fx-background-color: rgba(0, 0, 255, 0.2);
}

.jfx-list-cell {
    -fx-background-insets: 0.0;
    -fx-text-fill: BLACK;
}

.jfx-list-cell:odd, .jfx-list-cell:even {
    -fx-background-color: WHITE;
}

.jfx-list-cell:filled:hover {
    -fx-text-fill: black;
}

.jfx-list-cell .jfx-rippler {
    -jfx-rippler-fill: BLUE;
}

.jfx-list-view {
    -fx-background-insets: 0;
    -jfx-cell-horizontal-margin: 0.0;
    -jfx-cell-vertical-margin: 5.0;
    -jfx-vertical-gap: 10;
    -jfx-expanded: false;
    -fx-pref-width: 200;
}

.jfx-toggle-button {
    -jfx-toggle-color: RED;
}

.jfx-tool-bar {
    -fx-font-size: 20;
    -fx-font-weight: BOLD;
    -fx-background-color: #5264AE;
    -fx-pref-width: 100%;
    -fx-pref-height: 64px;
}

.jfx-tool-bar HBox {
    -fx-alignment: center;
    -fx-spacing: 25;
    -fx-padding: 0 10;
}

.jfx-tool-bar Label {
    -fx-text-fill: WHITE;
}

.jfx-popup-container {
    -fx-background-color: WHITE;
}

.jfx-snackbar-content {
    -fx-background-color: #323232;
    -fx-padding: 5;
    -fx-spacing: 5;
}

.jfx-snackbar-toast {
    -fx-text-fill: WHITE;
}

.jfx-snackbar-action {
    -fx-text-fill: #ff4081;
}

.jfx-list-cell-content-container {
    -fx-alignment: center-left;
}

.jfx-list-cell-container .label {
    -fx-text-fill: BLACK;
}

.combo-box-popup .list-view .jfx-list-cell:odd:selected .jfx-list-cell-container,
.combo-box-popup .list-view .jfx-list-cell:even:selected .jfx-list-cell-container {
    -fx-background-color: rgba(0.0, 0.0, 255.0, 0.2);
}

.combo-box-popup .list-view .jfx-list-cell {
    -fx-background-insets: 0.0;
    -fx-text-fill: BLACK;
}

.combo-box-popup .list-view .jfx-list-cell:odd,
.combo-box-popup .list-view .jfx-list-cell:even {
    -fx-background-color: WHITE;
}

.combo-box-popup .list-view .jfx-list-cell:filled:hover {
    -fx-text-fill: black;
}

/*.combo-box .combo-box-button-container{
 	-fx-border-color:BLACK;-fx-border-width: 0 0 1 0;
}
.combo-box .combo-box-selected-value-container{
	-fx-border-color:BLACK;
} */

/*
 * TREE TABLE CSS
 */

.tree-table-view {
    -fx-tree-table-color: rgba(255, 0, 0, 0.2);
    -fx-tree-table-rippler-color: rgba(255, 0, 0, 0.4);
}

.tree-table-view .jfx-text-field{
    -fx-background-color: transparent;
}

.animated-option-button {
    -fx-background-color: #F1F1F1;
    -fx-background-radius: 50px;
    -fx-pref-height: 50px;
    -fx-pref-width: 50px;
    -fx-min-width: -fx-pref-width;
    -fx-max-width: -fx-pref-width;
    -fx-min-height: -fx-pref-height;
    -fx-max-height: -fx-pref-height;
    -jfx-button-type: RAISED;
}
.animated-option-button .jfx-rippler{
    -jfx-rippler-fill: rgb(113, 118, 114);
}
.sub-icon{
    -fx-fill: rgb(113, 118, 114);
}

.main-button {
    -fx-pref-width: 60px;
    -fx-background-color: #0F9D58;
    -fx-background-radius: 60px;
    -fx-pref-height: 60px;
    -fx-min-width: -fx-pref-width;
    -fx-max-width: -fx-pref-width;
    -fx-min-height: -fx-pref-height;
    -fx-max-height: -fx-pref-height;
    -jfx-button-type: RAISED;
}
.main-button .jfx-rippler{
    -jfx-rippler-fill: rgba(255,255,255, .87);
}
.main-icon{
    -fx-fill: rgba(255,255,255, .87);
}


.animated-option-sub-button {
    -fx-background-color: #43609C;
}

.animated-option-sub-button2 {
    -fx-background-color: rgb(203, 104, 96);
}

.tree-table-view .menu-item:focused {
    -fx-background-color: -fx-tree-table-color;

}

.tree-table-view .menu-item .label {
    -fx-padding: 5 0 5 0;
}