:root {
    --global-color: #333;
    /* block header */
    --menu-bg: #f8f8f8;
    --menu-color: var(--global-color);
    --menu-color-active: #fff;
    --menu-border: #e7e7e7;
    --menu-btn-bg-active: #135792;
    --menu-btn-border-active: #337ab7;

    /* block body */
    --body-bg: #ffffff;
    --body-color: var(--global-color);
    --body-border: #e7e7e7;

    /* block */
    --blk-1-bg: #fff;
    --blk-1-color: var(--global-color);
    --blk-1-border: #fff;

    --blk-2-bg: #e5e5e5;
    --blk-2-color: var(--global-color);
    --blk-2-border: #999;

    --blk-3-bg: #ddd;
    --blk-3-color: var(--global-color);
    --blk-3-border: #ddd;

    --blk-4-bg: #ececec;
    --blk-4-color: var(--global-color);
    --blk-4-border: #04b2df;

    --blk-5-bg: #337ab7; /*#b2f4ff*/
    --blk-5-color: var(--global-color);
    --blk-5-border: #04b2df;


    /* button */
    --btn-1-bg: #fff;
    --btn-1-bg-hover: #ddd;
    --btn-1-bg-active: #fff;
    --btn-1-bg-focus: #fff;
    --btn-1-color: var(--global-color);
    --btn-1-color-hover: #fff;
    --btn-1-color-active: var(--global-color);
    --btn-1-color-focus: var(--global-color);
    --btn-1-border: #ddd;
    --btn-1-border-hover: #ddd;
    --btn-1-border-active: #fff;
    --btn-1-border-focus: #ddd;

    --btn-2-bg: #f8f8f8;
    --btn-2-bg-hover: #e6e6e6;
    --btn-2-bg-active: #ffffff;
    --btn-2-bg-focus: #f8f8f8;
    --btn-2-color: var(--global-color);
    --btn-2-color-hover: var(--global-color);
    --btn-2-color-active: var(--global-color);
    --btn-2-color-focus: var(--global-color);
    --btn-2-border: #ddd;
    --btn-2-border-hover: #ddd;
    --btn-2-border-active: #ddd;
    --btn-2-border-focus: #ddd;

    --btn-3-bg: #ccc;
    --btn-3-bg-hover: #cecdcd;
    --btn-3-bg-active: #e4e4e4;
    --btn-3-bg-focus: #e4e4e4;
    --btn-3-color: var(--global-color);
    --btn-3-color-hover: var(--global-color);
    --btn-3-color-active: var(--global-color);
    --btn-3-color-focus: var(--global-color);
    --btn-3-border: #999;
    --btn-3-border-hover: #666;
    --btn-3-border-active: #999;
    --btn-3-border-focus: var(--global-color);

    --btn-4-bg: #5cb85c;
    --btn-4-bg-hover: #5cb85c;
    --btn-4-bg-active: #5cb85c;
    --btn-4-bg-focus: #5cb85c;
    --btn-4-color: var(--global-color);
    --btn-4-color-hover: var(--global-color);
    --btn-4-color-active: var(--global-color);
    --btn-4-bg-focus: var(--global-color);
    --btn-4-border: #5cb85c;
    --btn-4-border-hover: #5cb85c;
    --btn-4-border-active: #5cb85c;
    --btn-4-border-focus: var(--global-color);

    --btn-5-bg: #f8f8f8;
    --btn-5-bg-hover: #5cb85c;
    --btn-5-bg-active: #5cb85c;
    --btn-5-bg-focus: #5cb85c;
    --btn-5-color: var(--global-color);
    --btn-5-color-hover: #FF0000;
    --btn-5-color-active: var(--global-color);
    --btn-5-color-focus: var(--global-color);
    --btn-5-border: #ddd;
    --btn-5-border-hover: #ddd;
    --btn-5-border-active: #ddd;
    --btn-5-border-focus: #ddd;

    --btn-6-bg: #337ab7;
    --btn-6-bg-hover: #286090;
    --btn-6-bg-active: #286090;
    --btn-6-bg-focus: #1c64a3;
    --btn-6-color: #fff;
    --btn-6-color-hover: #fff;
    --btn-6-color-active: #fff;
    --btn-6-color-focus: #fff;
    --btn-6-border: #2e6da4;
    --btn-6-border-hover: #204d74;
    --btn-6-border-active: #204d74;
    --btn-6-border-focus: #204d74;

    /* state 1-4 */
    --state-1-bg: #4cae4c;
    --state-1-bg-hover: #4cae4c;
    --state-1-bg-active: #4cae4c;
    --state-1-color: var(--global-color);
    --state-1-color-hover: var(--global-color);
    --state-1-color-active: var(--global-color);
    --state-1-border: #4cae4c;
    --state-1-border-hover: #4cae4c;
    --state-1-border-active: #4cae4c;

    --state-2-bg: #eea236;
    --state-2-bg-hover: #eea236;
    --state-2-bg-active: #eea236;
    --state-2-color: var(--global-color);
    --state-2-color-hover: var(--global-color);
    --state-2-color-active: var(--global-color);
    --state-2-border: #eea236;
    --state-2-border-hover: #eea236;
    --state-2-border-active: #eea236;

    --state-3-bg: #FF0000;
    --state-3-bg-hover: #FF0000;
    --state-3-bg-active: #FF0000;
    --state-3-color: var(--global-color);
    --state-3-color-hover: var(--global-color);
    --state-3-color-active: var(--global-color);
    --state-3-border: #FF0000;
    --state-3-border-hover: #FF0000;
    --state-3-border-active: #FF0000;

    --state-4-bg: #999;
    --state-4-bg-hover: #666;
    --state-4-bg-active: #666;
    --state-4-color: var(--global-color);
    --state-4-color-hover: var(--global-color);
    --state-4-color-active: var(--global-color);
    --state-4-border: #666;
    --state-4-border-hover: #666;
    --state-4-border-active: #666;

    --state-5-bg: #fffc91;

    --status-new-bg: #eeeeee;
    --status-producing-bg: #4cae4c;
    --status-paused-bg: #eea236;
    --status-finished-bg: #008c9a;
    --status-canceled-bg: #505050;
    --status-closed-bg: #8e8e8e; /* #0036ce; */
    --status-scheduled-bg: #4da200;
    --status-ts-bg: #6e0068;
    --status-te-bg: #0062be;
    --status-false-bg: #820000;
    --status-true-bg: #0043b2;
    --state-fonts-bg: #333;
}