/** Styles that follow the corporate branding guidelines, and which give a web/bootstrap look'n'feel */

.root-pane {
    -fx-font-family: sans-serif;
    -fx-font-size: 14pt;
    -db-grey: #ddd;
}

.button {
    -fx-padding: 12px;
    -fx-border-radius: 4px;
}

.info-button {
    -fx-base: #5bc0de;
    -fx-text-fill: white;
    -fx-border-color: #298dff;
    -fx-background-color: linear-gradient(to bottom, #70b3ff 0%, #3392ff 100%);
}

.info-button:hover {
    -fx-background-color: #3392ff;
}

.tab-pane:top > .tab-header-area > .tab-header-background {
    -fx-background-color: white;
    -fx-border-color: -db-grey;
    -fx-border-width: 0 0 1 0;
}

.tab-pane:top > .tab-header-area {
    -fx-padding: 0.816667em 0 0 8em;
}

.tab .focus-indicator {
    -fx-border-width: 0, 0, 0;
}

.tab, .tab:selected:hover {
    -fx-background-color: white;
    -fx-background-radius: 0;
    -fx-border-radius: 4px 4px 0 0;
    -fx-padding: 10px 15px;
}

.tab:selected {
    -fx-border-width: 1;
    -fx-border-color: -db-grey -db-grey white -db-grey;
}

.tab:hover {
    -fx-background-color: -db-grey;
    -fx-background-radius: 4px 4px 0 0;
    -fx-cursor: hand;
}