@import url("../../css/main.min.css");
@import url("../../css/Skins/Modelspace/Calendar.Modelspace.min.css");
@import url("../../css/Skins/Modelspace/Grid.Modelspace.min.css");
@import url("../../css/Skins/Dialog/Grid.Dialog.min.css");
@import url("../../css/Skins/Modelspace/Dock.Modelspace.min.css");
@import url("../../css/Skins/Modelspace/TabStrip.Modelspace.min.css");
@import url("../../css/Skins/Modelspace/ComboBox.Modelspace.min.css");
@import url("../../css/Skins/Modelspace/DropDown.Modelspace.min.css");
@import url("../../css/Skins/Modelspace/TextBox.Modelspace.min.css");
@import url("../../css/Skins/Modelspace/ListBox.Modelspace.min.css");
@import url("../../css/Skins/Dialog/ListBox.Dialog.min.css");
@import url("../../css/Skins/Dialog/PanelBar.Dialog.min.css");
@import url("../../css/Skins/Dialog/TreeView.Dialog.min.css");
@import url("../../css/Skins/Preview/Grid.Preview.min.css");
@import url("../../css/Skins/Modelspace/Upload.Modelspace.min.css");
@import url("../../css/Skins/Preview/Grid.Previewtask.min.css");
@import url("../../css/Skins/Modelspace/Scheduler.Modelspace.min.css");
@import url("../../css/Skins/Modelspace/Menu.Modelspace.min.css");
@import url("../../css/Skins/Modelspace/Windows.Modelspace.min.css");
@import url("../../css/Skins/Modelspace/Wizard.Modelspace.min.css");
@import url("../../css/Skins/Modelspace/TreeView.Modelspace.min.css");
@import url("../../css/Skins/Space/Grid.Space.min.css");
@import url("../../css/Skins/Modelspace/TreeList.Modelspace.min.css");
@import url("../../css/Skins/ComboTransparent.min.css");
@import url("../../css/Skins/Bootstrap/TabStrip.Bootstrap.min.css");
@import url("../../css/Skins/DropDownTreeTransparent.css");

/* Theme Component excludes */

/*------------------- page header - top area -----------------*/
.header .top {
    background-color: var(--color-grey-darker);
}

    .header .top A {
        color: var(--color-grey-white);
        text-align: center;
        padding: 3px 5px; /*Note: required for focus/hover shadow*/
        transition: box-shadow .1s ease, color .1s ease;
    }

        .header .top A:focus {
            box-shadow: var(--focused-shadow-on-dark);
        }

        .header .top A:hover {
            /*for dark background*/
            color: var(--color-active-light);
            box-shadow: var(--hovered-shadow-on-dark);
            position: relative;
        }

            .header .top A:hover::before {
                /*for dark background*/
                box-sizing: border-box;
                content: "";
                position: absolute;
                top: 0px;
                left: 0px;
                width: calc(100% - 3px);
                height: calc(100% - 3px);
                margin: 1.5px;
                padding: 0;
                border-style: none;
                background-color: var(--color-grey-white);
                opacity: 0.1;
            }

        .header .top A:active, .header .top A.active {
            /*user interaction by mouse click, mouse down; pressing space/enter key has no effect for anchor element and :active */
            color: var(--color-active-light);
            box-shadow: var(--hovered-shadow-on-dark);
            position: relative;
        }

            .header .top A:active::before, .header .top A.active::before {
                /*for dark background*/
                box-sizing: border-box;
                content: "";
                position: absolute;
                top: 0px;
                left: 0px;
                width: calc(100% - 3px);
                height: calc(100% - 3px);
                margin: 1.5px;
                padding: 0;
                border-style: none;
                background-color: var(--color-grey-white);
                opacity: 0.3;
            }
/*------------------- page header - bottom area -----------------*/
.header .bottom {
    background-color: #fff;
    border-radius: 0 0 4px 4px;
}

    body .main-wrapper .legacy-white-button {
        background-image: none;
        background-color: white;
        display: flex;
        justify-content: center;
    }
    .header .bottom A, .main-wrapper .legacy-white-button {
        color: var(--color-grey-darker);
        padding: 3px 5px; /*Note: required for focus/hover shadow*/
    }

        .header .bottom A:focus, .main-wrapper .legacy-white-button:focus {
            box-shadow: var(--focused-shadow);
        }

        .header .bottom A:hover, .main-wrapper .legacy-white-button:hover {
            /*for light background*/
            color: var(--color-active-dark);
            box-shadow: var(--hovered-shadow);
            position: relative;
        }

            .header .bottom A:hover::before, .main-wrapper .legacy-white-button:hover::before {
                /*for light background*/
                box-sizing: border-box;
                content: "";
                position: absolute;
                top: 0px;
                left: 0px;
                width: calc(100% - 3px);
                height: calc(100% - 3px);
                margin: 1.5px;
                padding: 0;
                border-style: none;
                background-color: var(--color-grey-darker);
                opacity: 0.1;
            }

        .header .bottom A:active, .header .bottom A.active {
            /*user interaction by mouse click, mouse down; pressing space/enter key has no effect for anchor element and :active */
            color: var(--color-active-dark);
            box-shadow: var(--hovered-shadow);
            position: relative;
        }

            .header .bottom A:active::before, .header .bottom A.active::before {
                /*for light background*/
                box-sizing: border-box;
                content: "";
                position: absolute;
                top: 0px;
                left: 0px;
                width: calc(100% - 3px);
                height: calc(100% - 3px);
                margin: 1.5px;
                padding: 0;
                border-style: none;
                background-color: var(--color-grey-darker);
                opacity: 0.3;
            }

.basecolor {
    margin-top: 5px;
    background-color: #4B4D58;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

.footer {
    -webkit-border-radius: 4px 4px 0 0;
    -moz-border-radius: 4px 4px 0 0;
    border-radius: 4px 4px 0 0;
    background-color: var(--color-grey-white);
}

    .footer > .section-row {
        display: flex;
        flex-direction: row;
        align-items: center;
    }

    .footer, .footer .section > A {
        color: var(--color-grey-darker);
    }

        .footer .section > A {
            display: flex;
            align-items: flex-end;
            text-align: center;
            padding: 3px 5px; /*required for hover/focus shadow*/
            transition: box-shadow .1s ease, color .1s ease;
        }

            .footer .section > A:focus {
                box-shadow: var(--focused-shadow);
            }

            .footer .section > A:hover {
                /*for dark background*/
                color: var(--color-active-dark);
                box-shadow: var(--hovered-shadow);
                position: relative;
            }

                .footer .section > A:hover::before {
                    /*for dark background*/
                    box-sizing: border-box;
                    content: "";
                    position: absolute;
                    top: 0px;
                    left: 0px;
                    width: calc(100% - 3px);
                    height: calc(100% - 3px);
                    margin: 1.5px;
                    padding: 0;
                    border-style: none;
                    background-color: var(--color-grey-darker);
                    opacity: 0.1;
                }

            .footer .section > A:active, .footer .section > A.active {
                /*user interaction by mouse click, mouse down; pressing space/enter key has no effect for anchor element and :active */
                color: var(--color-grey-white);
                box-shadow: var(--hovered-shadow);
                position: relative;
            }

                .footer .section > A:active::before, .footer .section > A.active::before {
                    /*for dark background*/
                    box-sizing: border-box;
                    content: "";
                    position: absolute;
                    top: 0px;
                    left: 0px;
                    width: calc(100% - 3px);
                    height: calc(100% - 3px);
                    margin: 1.5px;
                    padding: 0;
                    border-style: none;
                    background-color: var(--color-active-light);
                    opacity: 0.3;
                }

.section > .title {
    background-color: var(--color-grey-darker);
}


    header.header > nav.top .button.minibutton:focus:not([disabled]) .button-text,
    header.header > nav.top .button.minibutton:focus:not([disabled]) .button-symbol,
    header.header > nav.top .splitbutton.minibutton:focus:not([disabled]) .button-text,
    header.header > nav.top .splitbutton.minibutton:focus:not([disabled]) .button-symbol,
    .section > .title .button.minibutton:focus:not([disabled]) .button-text,
    .section > .title .button.minibutton:focus:not([disabled]) .button-symbol,
    .section > .title .splitbutton.minibutton:focus:not([disabled]) .button-text,
    .section > .title .splitbutton.minibutton:focus:not([disabled]) .button-symbol {
        /*for dark background*/
        box-shadow: var(--focused-shadow-on-dark);
    }

    header.header > nav.top .button.minibutton:focus[disabled] .button-text,
    header.header > nav.top .button.minibutton:focus[disabled] .button-symbol,
    header.header > nav.top .splitbutton.minibutton:focus[disabled] .button-text,
    header.header > nav.top .splitbutton.minibutton:focus[disabled] .button-symbol,
    .section > .title .button.minibutton:focus[disabled] .button-text,
    .section > .title .button.minibutton:focus[disabled] .button-symbol,
    .section > .title .splitbutton.minibutton:focus[disabled] .button-text,
    .section > .title .splitbutton.minibutton:focus[disabled] .button-symbol {
        /*for dark background*/
        box-shadow: var(--disabled-focused-shadow-on-dark);
    }

    header.header > nav.top .button.minibutton:hover:not([disabled]) .button-text,
    header.header > nav.top .button.minibutton:hover:not([disabled]) .button-symbol,
    header.header > nav.top .splitbutton.minibutton:hover:not([disabled]) .button-text,
    header.header > nav.top .splitbutton.minibutton:hover:not([disabled]) .button-symbol,
    .section > .title .button.minibutton:hover:not([disabled]) .button-text,
    .section > .title .button.minibutton:hover:not([disabled]) .button-symbol,
    .section > .title .splitbutton.minibutton:hover:not([disabled]) .button-text,
    .section > .title .splitbutton.minibutton:hover:not([disabled]) .button-symbol {
        /*for dark background*/
        box-shadow: var(--hovered-shadow-on-dark);
    }

TABLE.listing > THEAD > TR > TH,
.RadTreeList .rtlHeader > TH,
.RadGrid .rgMasterTable > THEAD > TR > TH {
    background-color: var(--color-grey-lightest);
}

.RadGrid .rgFilterRow {
    background: var(--color-grey-lightest);
}

.RadGrid .rgBatchChanged,
.RadGrid_Modelspace .rgBatchChanged {
    background-color: var(--color-grey-lightest) !important;
}

.RadGrid_Space .rgFooterDiv, .RadGrid_Space .rgFooter {
    background: var(--color-grey-lightest);
}

.RadGrid_Space .rgCommandRow,
.RadGrid_Modelspace .rgCommandRow {
    background-color: var(--color-grey-lightest);
    color: #656770;
}

.DockCommandPlus {
    background: url("../../images/CommandSpritebuttons.gif") no-repeat !important;
    background-position: 0px -16px !important
}

    .DockCommandPlus:hover {
        background-position: -20px -16px !important
    }

.DockCommandArrow {
    background: url("../../images/CommandSpritebuttons.gif") no-repeat !important;
    background-position: 0px 0px !important;
}

    .DockCommandArrow:hover {
        background-position: 17px 0px !important;
    }

.DockCommandBind {
    background: url("../../images/CommandSpritebuttons.gif") no-repeat !important;
    background-position: 0px -53px !important;
}

    .DockCommandBind:hover {
        background-position: -20px -53px !important;
    }

.process-race > .start {
    background: transparent url("../../images/process-race-arrow-start.png") no-repeat scroll left 7px;
}

.process-race > .start2 {
    background: transparent url("../../images/process-race-arrow-start2.png") no-repeat scroll left 7px;
}

.process-race > .finish {
    background: url("../../images/process-race-arrow-finish.png") no-repeat scroll left 7px;
}

.process-race > .steps > .step {
    background: transparent url("../../images/icon-triangle-e-light-grey.png") no-repeat scroll right 7px;
}


.grey-box {
    background-color: var(--color-grey-lightest);
}

/* BUTTONS */
.button.grey {
    background-color: var(--color-grey-dark);
    color: var(--color-grey-white);
    font-weight: normal;
}

header.header > nav.top .button.grey:focus:not([disabled]),
.section > .title .button.grey:focus:not([disabled]) {
    /*for dark background*/
    box-shadow: var(--focused-shadow-on-dark);
}

header.header > nav.top .button.grey:hover:not([disabled]),
.section > .title .button.grey:hover:not([disabled]) {
    /*for dark background*/
    box-shadow: var(--hovered-shadow-on-dark);
}

.button.grey.disabled,
INPUT[type="submit"][disabled="disabled"].button, BUTTON[disabled="disabled"].button,
INPUT[type="submit"][disabled="disabled"].button.grey, BUTTON[disabled="disabled"].button.grey {
    border: 1px solid #c9c9c6;
    background-color: #dededd;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #dededd), color-stop(1, #d4d4d3));
}

.button.flat-grey {
    background-color: #96979c;
    color: var(--color-grey-white);
}

.button.light {
    background-color: #fff;
    color: #4b4d58;
    background-image: -webkit-linear-gradient(top, #fff, #ECEDEB); /* For Chrome and Safari */
    background-image: -moz-linear-gradient(top, #fff, #ECEDEB); /* For old Fx (3.6 to 15) */
    background-image: -ms-linear-gradient(top, #fff, #ECEDEB); /* For pre-releases of IE 10*/
    background-image: -o-linear-gradient(top, #fff, #ECEDEB); /* For old Opera (11.1 to 12.0) */
    background-image: linear-gradient(to bottom, #fff, #ECEDEB); /* Standard syntax; must be last */
}

.button.contentlike {
    background-color: #4B4D58;
    color: #fff;
}

    .button.contentlike.disabled {
        background-color: #4B4D58;
        color: #fff;
    }



.RadButton_Default,
.RadButton_Default.RadButton.rbLinkButton {
    background-color: #B7B8B5 !important;
    border: 1px solid #A1A19C !important;
    color: var(--color-grey-white) !important;
    font-size: 11px !important;
    font-weight: bold;
    text-align: left;
    line-height: 18px;
    padding-bottom: 3px;
}

    .RadButton_Default.RadButton.rbLinkButton {
        background-image: none !important;
        padding-left: 10px;
    }
    /*.RadButton_Default.rbButton.rbHovered {
    background-image:none !important;
    opacity:0.4;
    }*/


    .RadButton_Default,
    .RadButton_Default.rbLinkButton {
        border: 1px solid #A1A19C !important;
        color: #fff !important;
    }

        .RadButton_Default.rbLinkButton .rbSplitRight {
            border-left: 1px solid #FFF !important;
        }

        .RadButton_Default .rbSplitRight, .RadButton_Default .rbSplitLeft {
            background-image: url("../../images/icon-triangle-s-light-grey.png") !important;
            background-position: 2px 10px !important;
        }

.button.dark,
.form-save-buttons .button,
.window-form .button {
    background: #4b4d57 url("../../images/bgradient.png") repeat scroll left top;
    color: #fff;
}

INPUT[type="submit"].button.minibutton, BUTTON.button.minibutton {
    background-color: #6a6d7b;
    color: var(--color-grey-white);
}

.button.minibutton .button-text, .button.minibutton .button-symbol,
.splitbutton.minibutton .button-text, .splitbutton.minibutton .button-symbol {
    /*background-color: var(--color-grey-dark);*/
    color: var(--color-grey-white);
}

.button.minibutton .button-text,
.splitbutton.minibutton .button-text,
.button-text + .button-symbol {
    background-color: var(--color-grey-dark);
}

.button.minibutton[disabled] .button-text,
.button.minibutton[disabled] .button-symbol,
.button.minibutton.aspNetDisabled .button-text,
.button.minibutton.aspNetDisabled .button-symbol,
.splitbutton.minibutton[disabled] .button-text,
.splitbutton.minibutton[disabled] .button-symbol,
.splitbutton.minibutton.aspNetDisabled .button-text,
.splitbutton.minibutton.aspNetDisabled .button-symbol {
    opacity: var(--opacity-disabled-button);
}

.button.minibutton:active .button-text,
.button.minibutton:active .button-symbol,
.splitbutton.minibutton:active .button-text,
.splitbutton.minibutton:active .button-symbol {
    background-color: #2c2e3a;
    color: #ccc;
}

INPUT[type="submit"].button.midbutton, BUTTON.button.midbutton {
    background-color: #6a6d7b;
    color: #fff;
}

.button.midbutton .button-text, .button.midbutton .button-symbol {
    background-color: #6a6d7b;
    color: #fff;
}

.button.midbutton:hover .button-text, .button.midbutton:hover .button-symbol {
    background-color: #5d606d;
    color: #ccc;
}

.button.midbutton:active .button-text, .button.midbutton:active .button-symbol {
    background-color: #2c2e3a;
    color: #ccc;
}

.button.title-bar-grey {
    border-left: 1px solid #aeafb5;
    border-right: 1px solid #7c7d85;
    background-color: #96979c;
    color: #fff;
}

    .button.title-bar-grey:hover,
    .button.title-bar-grey:active {
        opacity: 1;
        background-color: var(--color-grey-lightest);
        color: #4b4d58;
    }

.button.title-bar-light {
    border-left: 1px solid #aeafb5;
    border-right: 1px solid #7c7d85;
    background-color: var(--color-grey-lightest);
    color: #4b4d58;
}

    .button.title-bar-light:hover,
    .button.title-bar-light:active {
        opacity: 1;
    }

TABLE.listing > TBODY > TR.selected,
.RadGrid .rgSelectedRow,
UL.listing > LI.selected {
    background-color: #96979c;
    color: var(--color-grey-white);
}

.RadGrid .rgEditRow {
    background-color: #96979c;
    color: var(--color-grey-white);
}

.RadGrid_Modelspace .rgEditForm .rgHeader {
    background: #4B4D58 !important;
    color: White !important;
}


/*Modal popup */
.dialog-header {
    background-color: #2c2e3a;
}

.modalPopup.white .dialog-header {
    background-color: #2d2f3a;
}

    .modalPopup.white .dialog-header .dialog-close,
    .modalCommentPopup .dialog-close {
        float: right;
        background: transparent url("../../images/icon-circle-close-white.png") no-repeat scroll left top;
    }

.RadTreeView_Default .rtSelected .rtIn {
    background-color: #828282 !important;
    border-color: #8D8D8D #7E7E7E #6C6C6C;
    color: var(--color-grey-white);
}

.RadTreeView_Default .rtHover .rtIn {
    background-color: #C5C5C5 !important;
    border-color: #B5B5B5 #B5B5B5 #9E9E9E;
    color: var(--color-grey-black);
}

.RadTreeView .rtHover .rtIn {
    background-color: #C5C5C5 !important;
    border-color: #B5B5B5 #B5B5B5 #9E9E9E;
    color: var(--color-grey-black);
}


.PanelWizardNew {
    border-width: 3px;
    border-style: none;
    border-color: Silver;
    height: 100%;
    width: 415px;
    font-family: Verdana;
    background-color: #2C2E3A;
    color: var(--color-grey-black);
}



.psetBar .rpText {
    color: #2c2e3a !important;
    background-color: #F0F0F0 !important;
}

.RadPanelBar_SpaceCard a.rpLink {
    border: 1px solid Silver;
    background-color: #4b4d57;
    height: 18px;
    line-height: 18px;
}

    .RadPanelBar_SpaceCard a.rpLink:hover {
        background-color: #4b4d57;
        font-weight: bold;
        color: var(--color-grey-white);
    }

.RadPanelBar_SpaceCard a.rpFocused,
.RadPanelBar_SpaceCard a.rpExpanded,
.RadPanelBar_SpaceCard a.rpSelected,
.RadPanelBar_SpaceCard a.rpSelected:hover {
    border: 1px solid #2d2f3a;
    background-color: #4b4d57;
}

.RadPanelBar_SpaceCard .rpRootGroup {
    border-color: Silver;
}

.RightPageHeader {
    border: 1px solid silver;
    z-index: 1;
    background-color: #F0F0F0;
}


.RadTreeView_Modelspace .rtHover .rtIn {
    background-color: var(--color-grey-lightest);
    color: #4B4D58;
}

.RadTreeView_Modelspace .rtSelected .rtIn {
    background-color: #96979c;
    color: #fff;
    /*background-image: url('TreeView/ItemSelectedBg.png');*/
}

.RadTreeView_Modelspace .rtHover .rtIn {
    border: 1px solid var(--color-grey-lightest);
}

.RadTreeView_Modelspace .rtSelected .rtIn {
    border: 1px solid var(--color-grey-lightest);
}

.RadDropDownTree_Default .rddtInner {
    background-color: #fff !important;
    background-image: none !important;
    border-color: #8a8a8a;
    border-radius: 3px;
    color: #333;
}

.section > .title > .RadComboBox_ComboDark {
    float: left;
    margin: 2px 0 0 0;
}

.RadComboBox_ComboDark {
    font: normal normal normal 12px/15px Helvetica,Arial,"Liberation Sans",FreeSans,sans-serif;
    background-color: transparent;
    color: blue;
}

    .RadComboBox_ComboDark .rcbInput {
        color: transparent !important;
        list-style-type: none;
        cursor: default;
        width: 0px !important;
    }

    .RadComboBox_ComboDark .rcbArrowCell a {
        background: url("../../images/icon-triangle-s-grey.png") no-repeat scroll 2px center !important;
    }

    .RadComboBox_ComboDark td.rcbInputCell.rcbInputCellLeft {
        display: flex;
        align-items: center;
    }

    .RadComboBox_ComboDark .rcbFocused {
        box-shadow: var(--focused-shadow);
    }

    .RadComboBox_ComboDark .rcbHovered, .RadComboBox_ComboDark:hover .rcbFocused {
        box-shadow: var(--hovered-shadow);
    }

.RadComboBox_ComboDark {
    position: relative;
}

    .RadComboBox_ComboDark > table.rcbHovered::before,
    .RadComboBox_ComboDark:hover .rcbFocused::before {
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        margin: 1.5px;
        padding: 0;
        opacity: 0.1;
        background-color: var(--color-grey-darker);
        pointer-events: none;
    }

    .RadComboBox_ComboDark > table.rcbActive::before,
    .RadComboBox_ComboDark:hover .rcbActive::before {
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        margin: 1.5px;
        padding: 0;
        opacity: 0.3;
        background-color: var(--color-grey-darker);
        pointer-events: none;
    }

.RadComboBoxDropDown_ComboDark {
    color: #2c2e3a;
    background: #fff;
    border-color: var(--color-grey-darker);
    border-top-color: var(--color-grey-darker);
}

    .RadComboBoxDropDown_ComboDark > .rcbScroll.rcbWidth {
        overflow: hidden;
    }

    .RadComboBoxDropDown_ComboDark .rcbHovered {
        box-shadow: var(--hovered-shadow);
        position: relative;
    }

        .RadComboBoxDropDown_ComboDark .rcbHovered::before {
            content: "";
            position: absolute;
            width: 100%;
            height: 100%;
            top: 0;
            left: 0;
            margin: 1.5px;
            padding: 0;
            opacity: 0.1;
            background-color: var(--color-grey-darker);
        }

.RadMultiPage_Default .rmpView,
.tabPage,
.tabSubPage {
    background: var(--color-grey-white);
    border: 1px solid #C5C5C5;
    -webkit-border-top-right-radius: 3px;
    -webkit-border-bottom-right-radius: 3px;
    -webkit-border-bottom-left-radius: 3px;
    -moz-border-radius-topright: 3px;
    -moz-border-radius-bottomright: 3px;
    -moz-border-radius-bottomleft: 3px;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
}