/* Minification failed. Returning unminified contents.
(20,21): run-time error CSS1039: Token not allowed after unary operator: '-site-minwidth'
(44,32): run-time error CSS1039: Token not allowed after unary operator: '-color-primary'
(54,33): run-time error CSS1039: Token not allowed after unary operator: '-color-primary'
(90,28): run-time error CSS1039: Token not allowed after unary operator: '-color-primary'
(115,17): run-time error CSS1039: Token not allowed after unary operator: '-color-primary'
(144,17): run-time error CSS1039: Token not allowed after unary operator: '-color-primary'
(163,21): run-time error CSS1039: Token not allowed after unary operator: '-site-minwidth'
(169,17): run-time error CSS1039: Token not allowed after unary operator: '-color-error'
(180,17): run-time error CSS1039: Token not allowed after unary operator: '-color-error'
(188,21): run-time error CSS1039: Token not allowed after unary operator: '-color-primary'
(196,17): run-time error CSS1039: Token not allowed after unary operator: '-color-warning'
(227,17): run-time error CSS1039: Token not allowed after unary operator: '-color-text-color'
(236,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(237,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(238,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(239,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(240,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(241,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(244,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(245,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(246,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(247,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(248,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(249,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(251,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(252,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(253,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(254,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(255,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(256,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(257,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(258,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(259,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(260,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(261,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(262,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(263,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(264,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(265,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(266,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(267,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(268,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(269,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(274,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(275,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(276,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(277,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(278,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(279,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(280,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(281,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(282,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(283,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(284,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(285,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(286,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(287,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(288,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(289,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(290,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(291,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(292,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(293,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(294,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(295,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(302,36): run-time error CSS1039: Token not allowed after unary operator: '-color-site-foreground'
(306,36): run-time error CSS1039: Token not allowed after unary operator: '-color-site-background'
(310,36): run-time error CSS1039: Token not allowed after unary operator: '-color-site-foreground'
(316,36): run-time error CSS1039: Token not allowed after unary operator: '-color-option-content'
(323,25): run-time error CSS1039: Token not allowed after unary operator: '-color-text-color'
(328,36): run-time error CSS1039: Token not allowed after unary operator: '-color-section-background'
(336,25): run-time error CSS1039: Token not allowed after unary operator: '-color-text-color'
(340,40): run-time error CSS1039: Token not allowed after unary operator: '-color-site-background'
(344,40): run-time error CSS1039: Token not allowed after unary operator: '-color-section-background'
(372,17): run-time error CSS1039: Token not allowed after unary operator: '-color-text-color'
(418,32): run-time error CSS1034: Expected closing parenthesis, found ','
(418,32): run-time error CSS1042: Expected function, found ','
(418,36): run-time error CSS1062: Expected semicolon or closing curly-brace, found ')'
(437,21): run-time error CSS1039: Token not allowed after unary operator: '-site-minwidth'
(443,22): run-time error CSS1039: Token not allowed after unary operator: '-color-site-background'
(454,22): run-time error CSS1039: Token not allowed after unary operator: '-color-site-foreground'
(501,17): run-time error CSS1039: Token not allowed after unary operator: '-color-success'
(506,17): run-time error CSS1039: Token not allowed after unary operator: '-color-warning'
(511,17): run-time error CSS1039: Token not allowed after unary operator: '-color-error'
(515,17): run-time error CSS1039: Token not allowed after unary operator: '-color-error'
(555,17): run-time error CSS1039: Token not allowed after unary operator: '-color-primary'
(560,17): run-time error CSS1039: Token not allowed after unary operator: '-color-primary-hover'
(566,17): run-time error CSS1039: Token not allowed after unary operator: '-color-primary'
(632,28): run-time error CSS1039: Token not allowed after unary operator: '-color-primary'
(633,24): run-time error CSS1039: Token not allowed after unary operator: '-color-primary'
(639,28): run-time error CSS1039: Token not allowed after unary operator: '-color-primary-hover'
(653,28): run-time error CSS1039: Token not allowed after unary operator: '-color-secondary'
(654,24): run-time error CSS1039: Token not allowed after unary operator: '-color-secondary'
(661,32): run-time error CSS1039: Token not allowed after unary operator: '-color-secondary-hover'
(662,28): run-time error CSS1039: Token not allowed after unary operator: '-color-secondary-hover'
(667,32): run-time error CSS1039: Token not allowed after unary operator: '-color-secondary-hover'
(672,32): run-time error CSS1039: Token not allowed after unary operator: '-color-secondary-hover'
(792,24): run-time error CSS1039: Token not allowed after unary operator: '-color-error'
(796,17): run-time error CSS1039: Token not allowed after unary operator: '-color-error'
(807,17): run-time error CSS1039: Token not allowed after unary operator: '-color-error'
(813,17): run-time error CSS1039: Token not allowed after unary operator: '-color-required-label'
(819,17): run-time error CSS1039: Token not allowed after unary operator: '-color-error'
(831,17): run-time error CSS1039: Token not allowed after unary operator: '-color-text-color'
(901,21): run-time error CSS1039: Token not allowed after unary operator: '-site-maxwidth'
(902,21): run-time error CSS1039: Token not allowed after unary operator: '-site-minwidth'
(907,28): run-time error CSS1039: Token not allowed after unary operator: '-color-site-foreground'
(1014,21): run-time error CSS1039: Token not allowed after unary operator: '-color-tooltip-text'
(1016,32): run-time error CSS1039: Token not allowed after unary operator: '-color-tooltip-background'
(1043,28): run-time error CSS1039: Token not allowed after unary operator: '-color-section-background'
(1047,28): run-time error CSS1039: Token not allowed after unary operator: '-color-section-border'
(1055,32): run-time error CSS1039: Token not allowed after unary operator: '-color-site-background'
(1071,28): run-time error CSS1039: Token not allowed after unary operator: '-color-error'
(1076,33): run-time error CSS1039: Token not allowed after unary operator: '-color-section-border'
(1077,35): run-time error CSS1039: Token not allowed after unary operator: '-color-section-border'
(1078,34): run-time error CSS1039: Token not allowed after unary operator: '-color-section-border'
(1130,28): run-time error CSS1039: Token not allowed after unary operator: '-color-primary'
(1136,28): run-time error CSS1039: Token not allowed after unary operator: '-color-primary'
(1140,22): run-time error CSS1039: Token not allowed after unary operator: '-color-primary'
(1204,17): run-time error CSS1039: Token not allowed after unary operator: '-color-primary'
(1254,28): run-time error CSS1039: Token not allowed after unary operator: '-color-primary'
(1258,30): run-time error CSS1039: Token not allowed after unary operator: '-color-primary'
(1314,17): run-time error CSS1039: Token not allowed after unary operator: '-color-error'
(1327,17): run-time error CSS1039: Token not allowed after unary operator: '-color-error'
(1341,28): run-time error CSS1039: Token not allowed after unary operator: '-color-section-border'
(1346,17): run-time error CSS1039: Token not allowed after unary operator: '-color-text-color'
(1351,17): run-time error CSS1039: Token not allowed after unary operator: '-color-primary'
(1363,28): run-time error CSS1039: Token not allowed after unary operator: '-color-inlinetextfield-background'
(1375,28): run-time error CSS1039: Token not allowed after unary operator: '-color-inlinetextfield-background'
(1437,28): run-time error CSS1039: Token not allowed after unary operator: '-color-section-background'
(1456,28): run-time error CSS1039: Token not allowed after unary operator: '-color-section-border'
(1476,28): run-time error CSS1039: Token not allowed after unary operator: '-color-sitewarning'
(1482,24): run-time error CSS1039: Token not allowed after unary operator: '-color-sitewarning-border'
(1503,32): run-time error CSS1039: Token not allowed after unary operator: '-color-highpriority'
(1507,28): run-time error CSS1039: Token not allowed after unary operator: '-color-highpriority-alt'
(1536,17): run-time error CSS1039: Token not allowed after unary operator: '-color-success'
(1539,17): run-time error CSS1039: Token not allowed after unary operator: '-color-warning'
(1606,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1607,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1608,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1609,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1610,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1611,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1612,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1617,28): run-time error CSS1039: Token not allowed after unary operator: '-color-site-foreground'
(1622,28): run-time error CSS1039: Token not allowed after unary operator: '-color-tabselected'
(1625,33): run-time error CSS1039: Token not allowed after unary operator: '-color-tabselected'
(1626,34): run-time error CSS1039: Token not allowed after unary operator: '-color-tabselected'
(1627,35): run-time error CSS1039: Token not allowed after unary operator: '-color-tabselected'
(1639,17): run-time error CSS1039: Token not allowed after unary operator: '-color-text-color'
(1644,32): run-time error CSS1039: Token not allowed after unary operator: '-color-tabborder'
(1645,26): run-time error CSS1039: Token not allowed after unary operator: '-color-tab'
(1661,36): run-time error CSS1039: Token not allowed after unary operator: '-color-tabselected'
(1662,32): run-time error CSS1039: Token not allowed after unary operator: '-color-tabselected'
(1663,43): run-time error CSS1039: Token not allowed after unary operator: '-color-tabselected'
(1671,43): run-time error CSS1039: Token not allowed after unary operator: '-color-tabselected'
(1675,25): run-time error CSS1039: Token not allowed after unary operator: '-color-tab-error-invalid'
(1694,28): run-time error CSS1039: Token not allowed after unary operator: '-color-tabselected'
(1695,24): run-time error CSS1039: Token not allowed after unary operator: '-color-tabselected'
(1703,17): run-time error CSS1039: Token not allowed after unary operator: '-color-site-foreground'
(1706,17): run-time error CSS1039: Token not allowed after unary operator: '-color-tab-error-invalid'
(1714,28): run-time error CSS1039: Token not allowed after unary operator: '-color-tabactive'
(1715,24): run-time error CSS1039: Token not allowed after unary operator: '-color-tabactive'
(1723,25): run-time error CSS1039: Token not allowed after unary operator: '-color-tabborder'
(1727,17): run-time error CSS1039: Token not allowed after unary operator: '-color-tab-error-selected'
(1730,21): run-time error CSS1039: Token not allowed after unary operator: '-color-tab-error-selected'
(1739,28): run-time error CSS1039: Token not allowed after unary operator: '-color-tab-error-selected'
(1740,24): run-time error CSS1039: Token not allowed after unary operator: '-color-tab-error-selected'
(1741,35): run-time error CSS1039: Token not allowed after unary operator: '-color-tab-error-selected'
(1745,21): run-time error CSS1039: Token not allowed after unary operator: '-color-text-color'
(1749,28): run-time error CSS1039: Token not allowed after unary operator: '-color-tab-error-selected'
(1750,24): run-time error CSS1039: Token not allowed after unary operator: '-color-tab-error-selected'
(1751,35): run-time error CSS1039: Token not allowed after unary operator: '-color-tab-error-selected'
(1755,21): run-time error CSS1039: Token not allowed after unary operator: '-color-text-color'
(1815,17): run-time error CSS1039: Token not allowed after unary operator: '-color-primary'
(1816,62): run-time error CSS1046: Expect comma, found '255'
(1816,70): run-time error CSS1046: Expect comma, found '/'
(1816,87): run-time error CSS1046: Expect comma, found '255'
(1816,95): run-time error CSS1046: Expect comma, found '/'
(1820,24): run-time error CSS1039: Token not allowed after unary operator: '-color-primary'
(1841,28): run-time error CSS1039: Token not allowed after unary operator: '-color-subGrid-header'
(1844,28): run-time error CSS1039: Token not allowed after unary operator: '-color-subGrid-body'
(1848,22): run-time error CSS1039: Token not allowed after unary operator: '-color-site-foreground'
(1852,22): run-time error CSS1039: Token not allowed after unary operator: '-color-site-foreground'
(1856,24): run-time error CSS1039: Token not allowed after unary operator: '-color-section-border'
(1861,28): run-time error CSS1039: Token not allowed after unary operator: '-color-site-foreground'
(1865,21): run-time error CSS1039: Token not allowed after unary operator: '-color-text-color'
(1873,28): run-time error CSS1039: Token not allowed after unary operator: '-color-site-background'
(1877,28): run-time error CSS1039: Token not allowed after unary operator: '-color-section-grid-background'
(1882,28): run-time error CSS1039: Token not allowed after unary operator: '-color-section-grid-background'
(1904,28): run-time error CSS1039: Token not allowed after unary operator: '-color-section-grid-background'
(1910,28): run-time error CSS1039: Token not allowed after unary operator: '-color-section-grid-background'
(1916,28): run-time error CSS1039: Token not allowed after unary operator: '-color-section-grid-background'
(1923,62): run-time error CSS1046: Expect comma, found '255'
(1923,70): run-time error CSS1046: Expect comma, found '/'
(1923,87): run-time error CSS1046: Expect comma, found '255'
(1923,95): run-time error CSS1046: Expect comma, found '/'
(1987,28): run-time error CSS1039: Token not allowed after unary operator: '-color-section-border'
(1989,28): run-time error CSS1039: Token not allowed after unary operator: '-color-section-background'
(1996,17): run-time error CSS1039: Token not allowed after unary operator: '-color-primary'
 */

#ibsHeaderError {
    font-weight: bold;
    color: red;
}

.sticky {
    position: fixed;
    top: 0;
    box-shadow: 0px 3px 5px 0px grey;
}

.navmenu {
    display: inline-flex;
    border-top: 2px solid grey;
    border-bottom: 2px solid grey;
    width: 100%;
    z-index: 1000;
    background-color: white;
    min-width: var(--site-minwidth);
}

.mainmenu {
    display: inline-flex;
    padding: 0 152px;
    width: 100%;
}

.leftsidemainmenu {
    /*display: inline-flex;*/
    width: 70%
}

.rightsidemainmenu {
    /*display: inline-flex;*/
    width: 30%;
}

.caret {
    content: '';
    position: relative;
    top: 13px;
    left: 10px;
    border-top: 5px solid var(--color-primary);
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
}

.caretRight {
    content: '';
    position: relative;
    top: 1px;
    left: 10px;
    border-left: 5px solid var(--color-primary);
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    display: inline-flex;
}

.navmenuitem,
.navmenuitemempty {
    display: inline-block;
    width: 125px;
    max-height: 30px;
    line-height: 30px;
    text-align: center;
    background-color: white;
    font-weight: bold;
    font-size: 12px;
    float: left;
    /*z-index: 90;*/
    position: relative;
}

.navmenuvertical {
    z-index: 91;
    max-height: 60px;
}

.rightaligned {
    float: right !important;
    display: inline-flex;
}

    .navmenuitem {
        box-shadow: 0px 0px 5px 0px #a0a0a0;
    }

.navmenuitem:hover, .navmenuitem:focus-within {
    background-color: var(--color-primary);
    cursor: pointer;
    border-left: 1px solid grey;
    border-right: 1px solid grey;
}

    .navmenuitem:hover > a, .navmenuitem:focus-within > a {
        color: white;
    }

    .navmenuitem:hover .caret, .navmenuitem:focus-within .caret {
        border-top: 5px solid white;
    }
.navmenuvertical:hover .caretRight, .navmenuvertical:focus-within .caretRight {
    border-left: 5px solid white;
}

.navmenuitem:hover .newIndicator, .navmenuitem:focus-within .newIndicator {
    color: white;
}

.navmenuitem a {
    display: inline-block;
    height: 100%;
    width: 100%;
    color: var(--color-primary);
}

.navmenuitem a:hover {
    text-decoration: none;
}

.navmenuitem:hover .navsubmenuitem, .navmenuitem:focus-within .navsubmenuitem {
    display: inline-block;
}

.noborder {
    border: 0 !important;
    box-shadow: none !important;
}

.navsubmenuitem {
    display: none;
    border-left: 1px solid grey;
    border-right: 1px solid grey;
    margin-left: -1px;
    position: relative;
}
.navsubmenuitem_leveltwo {
    display: none;
    border-left: 1px solid grey;
    border-right: 1px solid grey;
    box-shadow: 0px 0px 5px 0px #a0a0a0;
    background-color: white;
    color: var(--color-primary);
    margin-left: 125px;
    position: relative;
    top: calc(100% - 59px);
}

    .navsubmenuitem:last-child,
    .navsubmenuitem_leveltwo:last-child {
        border-bottom: 1px solid grey;
        border-radius: 0 0 5px 5px;
    }

.navsubmenuitem:hover .navsubmenuitem_leveltwo, .navsubmenuitem:focus-within .navsubmenuitem_leveltwo, .navsubmenuitem_leveltwo:focus-within {
    display: block;
}

#dvBannerInfo {
    text-align: center;
    background-color: #eaeaea;
    min-width: var(--site-minwidth);
}

#lblLargeBannerText {
    position: absolute;
    top: 0;
    color: var(--color-error);
    font-size: 300%;
    font-weight: 800;
}

#lblSmallBannerText {
    margin-bottom: 0;
}

.newIndicator {
    font-weight: bold;
    color: var(--color-error);
    font-size: 14px;
    position: absolute;
    margin-top: -5px;
    margin-left: 2px;
}

    #spSidePanelMenuButton svg {
        color: var(--color-primary);
    }

.navmenuitem:hover #spSidePanelMenuButton svg, .navmenuitem:focus-within #spSidePanelMenuButton svg {
    color: white;
}

#lblScheduledMaintenanceText {
    color: var(--color-warning);
}

.home-overlay {
    height: 68px;
    width: 200px;
    position: absolute;
    z-index: 200;
    cursor: pointer;
}

.dvBrandHeader {
    width: 100%;
    height: 69px; /* This causes issues with the skip to main content link. prevents the main nav bar from picking up at the top but it's worth the trade off for a more stable page load experience. */
    
}

/*:root.darkMode .dvBrandHeader {
    background: var(--color-site-background);
}*/


.a11y-skip-link-container {
    position: absolute !important;
    z-index: 999;
}

html,
body {
    height: 100%;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    color: var(--color-text-color);
    scrollbar-gutter: stable; /* this keeps the browser scroll bars from changing the content width when they appear/disappear */
}

    body[contenteditable='true'], body[contenteditable='false'] {
        height: auto !important;
    }

:root {
    --site-minwidth: 1075px;
    --site-maxwidth: 1600px;
    --color-warning: #C25100;
    --color-error: #AD0000; /*#B80000;*/
    --color-success: #158655;
    --color-required-label: #0077A7;
    /*    --color-secondary: burlywood;
    --color-secondary-hover: sandybrown;*/
    --color-secondary: #0077A7;
    --color-secondary-hover: #0077AF;
    --color-primary: #267875;
    --color-primary-hover: #1f6360;
    --color-site-background: #e7faf9;
    --color-section-border: #b5b5b5;
    /*-color-section-background: lightgrey;*/
    --color-section-background: #E3E3E3;
    --color-section-background-hover: darkgrey;
    --color-site-foreground: #fafafa;
    --color-text-color: #2e2e2e;
    --color-inlinetextfield-background: #00FF00;
    --color-IBSDialogLink: #07efe4e8;
    --color-section-grid-background: darkseagreen;
    --color-tooltip-text: #2e2e2e;
    --color-tooltip-background: azure;
    --color-collapsablesection-background: #C4CED1;
    --color-option-background: gainsboro;
    --color-option-content: white;
    --color-option-background-textarea: white;
    --color-sitewarning: orange;
    --color-sitewarning-border: black;
    --color-highpriority: #f79ea4;
    --color-highpriority-alt: #FF8080;
    --color-subGrid-header: burlywood;
    --color-subGrid-body: lightgoldenrodyellow;
}


    :root.darkMode {
        --color-warning: #C75300;
        --color-error: #FF7575;
        --color-success: #158655;
        --color-required-label: #58a9ca;
        --color-primary: #3ab6b0;
        --color-primary-hover: #bebebe;
        --color-site-background: #232527;
        --color-section-border: #b5b5b5;
        --color-section-background: #5c5c5c;
        --color-site-foreground: #373737;
        --color-text-color: #eaeaea;
        --color-inlinetextfield-background: #00FF00;
        --color-section-grid-background: darkslategray;
        --color-tooltip-text: #2e2e2e;
        --color-tooltip-background: azure;
        --color-collapsablesection-background: #444444;
        --color-option-content: #BDBDBD;
        --color-option-background: #3d3d3d;
        --color-sitewarning: orangered;
        --color-sitewarning-border: white;
        --color-subGrid-header: blue;
        --color-subGrid-body: midnightblue;
    }


/******* Dark Mode *******/

        :root.darkMode .navmenuitem, :root.darkMode .navmenu, :root.darkMode #dvBannerInfo {
            background-color: var(--color-site-foreground);
        }

        :root.darkMode #ibsFooter {
            background-color: var(--color-site-background);
        }

            :root.darkMode #ibsFooter hr {
                border-color: var(--color-site-foreground);
            }

        :root.darkMode input:not([type=button]):not([type=submit]):not(.k-input), :root.darkMode select, :root.darkMode textarea {
            /* background-color: #565555;*/
            /*color: var(--color-text-color);*/
            background-color: var(--color-option-content);
            color: #2e2e2e;
            border-color: #888888;
        }

        :root.darkMode select {
            background-color: #565555;
            color: var(--color-text-color);
            border-color: #888888;
        }

        :root.darkMode .siteSection {
            background-color: var(--color-section-background);
        }

            :root.darkMode .siteSection:hover {
                background-color: #696969;
            }

        :root.darkMode .tab button {
            color: var(--color-text-color);
        }

            :root.darkMode .tab button:hover {
                background-color: var(--color-site-background);
            }

            :root.darkMode .tab button.selectedTab {
                background-color: var(--color-section-background);
            }

        :root.darkMode hr:not(.page-title-hr) {
            border-color: #888888;
        }

        :root.darkMode .blockUIOverlay, :root.darkMode .partialBlockUIOverlay, :root.darkMode .loadingOverlay, :root.darkMode .partialLoadingOverlay {
            background: #6c6b6bcc;
        }

.darkModeEditor {
    /*    background-color: #5c5c5c;
    color: #eaeaea;*/

    background-color: #BDBDBD;
    color: #2e2e2e;
}


:root.darkMode .ui-dialog #dvPopupHolder {
    color: #eaeaea;
}

:root.darkMode .ui-dialog img {
    background: #fafafa;
}
:root.darkMode .ui-dialog-content {
    color: var(--color-text-color);
}

:root.darkMode .k-button {
    background-color: #40444f;
    color: white;
}

:root.darkMode .k-picker {
    background-color: #40444f;
    color: white !important;
}

:root.darkMode .k-list-item.k-selected.k-hover, .k-list-item.k-selected:hover {
    background-color: #f4af03;
    color: #40444f !important;
}
:root.darkMode .k-list-item.k-selected.k-focus, .k-list-item.k-selected:focus {
    background-color: #f4af03;
    color: #40444f;
}

:root.darkMode .IBSTable tr:nth-child(even) {
    background-color: #40444f;
}

:root.darkMode .IBSTable tr:not(.IBSTableHeaderRow):hover {
    background-color: #deedee;
    color: #40444f;
}
/******* End Dark Mode *******/
:root.darkMode .k-picker {
    background-color: #40444f;
    color: white !important;
}

:root.darkMode .IBSTable tr:nth-child(even) {
    background-color: #40444f;
}

:root.darkMode .IBSTable tr:not(.IBSTableHeaderRow):hover {
    background-color: #deedee;
    color: #40444f;
}

:root.darkMode .loadingOverlay, :root.darkMode .blockUIOverlay, :root.darkMode .loadingIcon, :root.darkMode .partialBlockUIOverlay, :root.darkMode .partialLoadingOverlay {
    background: rgb(128,128,128,0.8) url("../../Images/Spinner.gif") center no-repeat;
}

:root.darkMode .k-selected, .k-state-selected {
    background-image: url(textures/brushed-metal.png);
}

:root.darkMode .som-primary-header .navbar-container {
    background: lightgrey !important;
}

/******* End Dark Mode *******/
#ibsMainBody {
    padding-top: 0 !important;
    padding-bottom: 20px;
}

.sticky ~ #mainContent {
    padding-top: 15px;
    min-width: var(--site-minwidth);
}

#ibsmainWrapper {
    min-height: calc(100vh - 178px);
   /* background: #80bdff50;*/
    background: var(--color-site-background);
    margin-top: -24px;
    padding-bottom: 30px;
}

#mainContent {
    height: 70%;
}

.body-content {
    padding: 10px 15px 50px 30px;
    background: var(--color-site-foreground);
    box-shadow: 0 0 5px 0 #a0a0a0;
}

#ibsFooter {
    position: relative;
    height: 55px;
    clear: both;
    width: 100%;
}

#ibsFooter p {
    padding-left: 2rem;
}

.footer-align-left {
    float: left;
    padding-left: 25px;
}

.footer-align-right {
    float: right;
    padding-right: 40px;
}

.footer-align-left span:after {
    content: "|";
    margin-left: 10px;
    margin-right: 10px;
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 280px;
}

.IBSSuccess {
    font-weight: bold;
    color: var(--color-success);
}

.IBSWarning {
    font-weight: bold;
    color: var(--color-warning);
}

.IBSError {
    font-weight: bold;
    color: var(--color-error);
}
.IBSErrorBlock {
    font-weight: bold;
    color: var(--color-error);
    display: block;
}

.IBSItalics {
    font-style: italic !important;
}

.IBSBold {
    font-weight: bold !important;
}

.IBSNormal {
    font-weight: normal !important;
}

.IBSAlignLeft {
    text-align: left !important;
}
.IBSAlignRight {
    text-align: right !important;
}
.IBSAlignCenter {
    text-align: center !important;
}

body {
    font-size: 14px;
}

label, a, div {
    font-size: 14px;
    font-weight: 600;
}

label {
    margin-bottom: 0.25rem;
}

a {
    color: var(--color-primary);
    font-weight: 500;
}

a:hover {
    color: var(--color-primary-hover);
    cursor: pointer;
}


.ui-dialog a {
    color: var(--color-primary);
}

h1, .h1{
    font-size: 2rem;
    font-weight: 700;
    letter-spacing: .3px;
    margin-bottom: 0;
}

h2, .h2 {
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: .3px;
}

h3, .h3 {
    font-size: 0.9rem;
    font-weight: 500;
}

h4, .h4 {
    font-size: 1.25rem;
    font-weight: 500;
    display: inline-block;
}

select, input, textarea {
    border: 1px solid #8ea6af;
    border-radius: 4px;
    padding: .25rem .5rem;
}

    input:focus, select:focus, textarea:focus {
        border-color: #5cccc7;
        outline: 0;
        box-shadow: 0 0 0 0.2rem #80bdff50;
    }
    

    input[type=number]::-webkit-inner-spin-button,
    input[type=number]::-webkit-outer-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

    input[type=button], input[type=submit], button, .btn {/*, .k-button, .k-picker {*/
        box-shadow: 1px 1px 1px 0 grey;
    }

input[name*="ZipCode"] {
    max-width: 138px;
}

.btn {
    background-color: #eaeaea;
    border-color: #d5d5d5;
    margin-top: 5px;
}

.btn:hover:not(:disabled) {
    background-color: #d7d7d7;
    border-color: #c5c5c5;
}

.btn-primary, .btn-primary:focus {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    margin-top: 5px;
    font-weight: 500;
}

.btn-primary:hover:not(:disabled) {
    background-color: var(--color-primary-hover);
    border-color: #1c5956;
}

.btn-primary:active {
    background-color: #1c5956 !important;
}

.btn-primary:disabled {
    background-color: #1c5956 !important;
}

.btn-secondary, .btn-secondary:focus {
    color: white;
    background-color: var(--color-secondary);
    border-color: var(--color-secondary);
    margin-top: 5px;
    font-weight: 500;
}

    .btn-secondary:hover:not(:disabled) {
        color: white;
        background-color: var(--color-secondary-hover);
        border-color: var(--color-secondary-hover);
    }

    .btn-secondary:active {
        color: white;
        background-color: var(--color-secondary-hover) !important;
    }

    .btn-secondary:disabled {
        color: white;
        background-color: var(--color-secondary-hover) !important;
    }

.btn-inline {
    line-height: 1.5;
    padding: 0.25rem 0.5rem;
    margin-top: -4px;
    font-size: .875rem;
}


.sr-only {
    position: absolute;
    left: -10000px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.sr-only a:focus {
    top: 0;
    left: 0;
    width: auto;
    height: auto;
    clip: unset;
}

.partialLoadingOverlay {
    display: none;
    position: absolute;
    /* width and height < 100% to avoid scroll bars */
    width: 95%;
    height: 95%;
    z-index: 900;
    background: rgba(255,255,255,0.8) url("../../Images/Spinner.gif") center no-repeat;
}

.partialBlockUIOverlay {
    display: none;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 900;
    background: rgba(255,255,255,0.8);
}

#dvSidePanelLoader .partialLoadingOverlay {
    z-index: 999;
}

.loadingIcon {
    background: rgba(255,255,255,0.8) url("../../Images/Spinner.gif") center no-repeat;
}

.loadingOverlay {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 999;
    background: rgba(255,255,255,0.8) url("../../Images/Spinner.gif") center no-repeat;
}

.blockUIOverlay {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 999;
    background: rgba(255,255,255,0.8);
}

/* Turn off scrollbar when body element has the loading class */
.loading {
    overflow: hidden;
    display: block;
}
/* Make spinner image visible when body element has the loading class */
    .loading .loadingOverlay {
        display: block;
    }
    
.blockUI {
    overflow: hidden;
    display: block;
}

    .blockUI .blockUIOverlay {
        display: block;
    }

/*
.loading .smallOverlay {
    display: block;
}*/

/* datatables.net has silly extra padding on the headers */
table.dataTable thead th, table.dataTable thead td {
    padding-top: 8px;
    padding-bottom: 8px;
    padding-left: 10px;
    padding-right: 10px;
}


.column {
    display: inline-block;
}

/* ALM - changed input, to input:not(.btn), to prevent buttons from being 100% wide like the form-group */
.form-group input:not(.btn), select, textarea {
    width: 100%;
}

select.error, input.error, textarea.error {
    border-color: var(--color-error);
}

label.error, span.errorColor {
    color: var(--color-error);
}

.hidden {
    display: none;
}


/*start stuff form required field validation*/

.requiredField {
    color: var(--color-error);
    font-size: 16px;
    margin-left:3px;
}

.requiredLabel {
    color: var(--color-required-label) !important;
    font-style: italic;
    margin-bottom: 1rem;
}

span.field-validation-error {
    color: var(--color-error) !important;
}

select:required:invalid {
    color: black;
}

option[value=""][disabled] {
    display: none;
}

option {
    color: var(--color-text-color);
}
/*end stuff form required field validation*/

/* Tabs */

.tab {
    overflow: hidden;
    border-bottom: 1px solid #ccc;
}

    .tab button {
        background-color: inherit;
        float: left;
        border: none;
        outline: none;
        cursor: pointer;
        padding: 14px 16px;
        transition: 0.3s;
    }

        .tab button:hover {
            background-color: #ddd;
        }

        .tab button.active {
            background-color: #ccc;
        }

.tabcontent {
    padding: 6px 12px;
    overflow: auto;
}

.tab button.selectedTab {
    background-color: #ccc;
}

/* End Tabs */

.row {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    margin: 0;
}

.column {
    display: flex;
    flex-direction: column;
    flex-basis: 100%;
    flex: 1;
}

.column-right {
    align-items: flex-end;
    padding-right: 130px;
    align-self: flex-end;
}

.page-title-hr {
    margin: 4px 0 4px 0;
    width: 5rem;
    background: teal;
    height: 3px;
    border-radius: 5px;
}

.container {
    max-width: var(--site-maxwidth);
    min-width: var(--site-minwidth);
}


.ui-dialog, .ui-dialog-buttonpane {
    background-color: var(--color-site-foreground);
}

/* Login Page*/
.loginContainer {
    border-radius: 16px;
    border: 1px solid #28807C;
    box-shadow: none;
    padding: 30px;
    max-width: 720px !important;
    min-width: unset;
}

.loginDiv {
    display: flex;
    align-items: center;
    flex-flow: column wrap;
}

.loginDiv .form-group{
    margin-left: 0;
}

.loginDiv input.form-control{
    width: 400px !important;
    max-width: 400px;
}

.loginWrapper{
    padding-top: 50px;
}

/*End Login Page*/

.container > #dvLoginMain{
    max-width: 1000px;
}

.form-group .form-group
{
    margin-left: 0;
}

.form-group
{
    margin-left: 1.5rem;
}

#btnSubmit, #btnCancel{
    margin-left: 0.5rem;
}

#Comments{
    height: 77px;
}

#dvLoginMain {
    max-width: 1000px;
}

fieldset legend {
    font-size: 14px;
}

#rowResourceID a, #rowClusterID a, #rowStimulusID a, #rowContextID a {
    font-weight: bold;
}

    #rowResourceID a.disabledAnchorTag, #rowClusterID a.disabledAnchorTag, #rowStimulusID a.disabledAnchorTag, #rowContextID a.disabledAnchorTag {
        pointer-events: none;
        cursor: default;
        text-decoration: none;
        /*font-weight: 500;*/
        /*color: black;*/
        font-weight: normal;
    }

.disabledAnchorTag {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
    /*font-weight: 500;*/
    color: unset;
    font-weight: normal;
}

.disguisedAnchorTag {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
    color: unset;
}

#ibsFooter hr {
    margin-top: 0;
}

/* Begin Information span stuff */

.IBSToolTip {
    cursor: pointer;
}

    .IBSToolTip i {
    }

    .IBSToolTip label {
        color: var(--color-tooltip-text);
        padding: 10px;
        background-color: var(--color-tooltip-background);
        border: 1px solid black;
        border-radius: 15px;
        display: none;
        position: absolute;
        z-index: 998;
        max-width: 300px;
        text-align: left !important;
    }

/* End Information span stuff */


/* Collapsable Section */
.IBSCollapsableSectionButton {
    height: 15px;
    width: 100%;
    border: 1px rgb(213, 213, 213) solid;
    max-width: unset;
    cursor: pointer;
    align-content: center;
    line-height: 0;
}

.IBSCollapsableSectionHeader {
    cursor: pointer;
    height: 35px;
    background-color: var(--color-section-background);
    padding-left: 10px;
    padding-top: 5px;
    margin-bottom: 5px;
    border: solid 1px var(--color-section-border);
    border-radius: 3px;
}

    .IBSCollapsableSectionHeader:hover {
        background-color: darkgrey;
    }
    :root.darkMode .IBSCollapsableSectionHeader:hover {
        background-color: var(--color-site-background);
    }

    .IBSCollapsableSectionHeader:active {
        -webkit-box-shadow: inset 0px 0px 5px #c1c1c1;
        -moz-box-shadow: inset 0px 0px 5px #c1c1c1;
        box-shadow: inset 0px 0px 5px #c1c1c1;
        outline: none;
    }

.IBSCollapsableSectionHeaderText {
    /*width: 92%;*/
    cursor: pointer;
}

.IBSCollapsableSectionHeader.Invalid.Collapsed {
    border: 3px solid var(--color-error);
}

.IBSCollapsableSection {
    display: none;
    border-left: solid 1px var(--color-section-border);
    border-bottom: solid 1px var(--color-section-border);
    border-right: solid 1px var(--color-section-border);
    border-top-right-radius: 0px;
    border-top-left-radius: 0px;
    margin-top: -7px;
    border-radius: 3px;
    padding: 15px;
}

/* End of Collapsable Section */


/* just default this across the site */
input[type="radio"],input[type="checkbox"] {
    cursor: pointer;
}

    input[type="radio"] + label, input[type="checkbox"] + label {
        cursor: pointer;
    }

    label[for^='chk'], label[for^='rdo'] {
        cursor: pointer;
    }


.ShowPointer {
    cursor: pointer;
}

/* Table Styling*/

table {
    width: 100%;
}

    tr .tm {
        width: 50%;
    }

    tr .cyc {
        width: 15%;
    }

    tr .usr {
        width: 35%;
    }

    td {
        font-weight: normal;
    }

.IBSTable {
    border: 2px solid var(--color-primary);
}

.IBSTable th, .IBSTable td {
    padding: 0.25rem 0.5rem;
    text-align: center;
    border: 1px solid var(--color-primary);
}

.IBSTableHeaderRow {
    background: var(--color-primary);
    color: white;
}
.IBSTableHeaderRow th{
    font-weight: bold !important;
}

.IBSScrollableTable .IBSTableRow {
    display: flex;
}
.IBSTableRow td {
    font-weight: normal;
}


.IBSTable tr:nth-child(even) {
    background-color: #f8f8f8;
}

.IBSTable tr:not(.IBSTableHeaderRow):hover {
    background-color: #deedee;
}


.IBSScrollableTable tbody {
    overflow-y: auto;
    display: block;
    width: 100%;
}

.IBSScrollableTable thead tr {
    display: block;
}

.IBSScrollableTable tbody {
    max-height: 300px;
}


/*.IBSTable .IBSAlignLeft td {
    text-align: left;
}
*/
/* End of Table Styling*/


.graphicPlaceHolder {
    width: 650px;
    border: 2px outset #D8D2BD;
    padding: 15px;
    font-family: Verdana !important;
    font-size: 12px;
    font-weight: bold !important;
    background-color: #F1EFE6;
    color: #000000;
    word-wrap: break-word; /* CSS3 tag, so VS may show squiggles.  Works with current browsers as of June 2014. */
}

 /*From IBS*/
.Wirisformula {
    vertical-align: middle;
}

.fakeLink {
    color: var(--color-primary);
    font-weight: 500;
}

    .fakeLink:hover {
        text-decoration: underline;
        cursor: pointer !important;
    }


/******* Toggle switch *******/

.switch {
    position: relative;
    display: inline-block;
    width: 30px;
    height: 17px;
}

    .switch input {
        opacity: 0;
        width: 0;
        height: 0;
    }

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

    .slider:before {
        position: absolute;
        content: "";
        height: 13px;
        width: 13px;
        left: 2px;
        bottom: 2px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
    }

.switch input:checked + .slider {
    background-color: var(--color-primary); /*#2196F3*/
}

.switch input:focus + .slider {
    box-shadow: 0 0 1px var(--color-primary); /*#2196F3*/
}

.switch input:checked + .slider:before {
    -webkit-transform: translateX(13px);
    -ms-transform: translateX(13px);
    transform: translateX(13px);
}

/* Rounded sliders */
.switch .slider.round {
    border-radius: 17px;
}

    .switch .slider.round:before {
        border-radius: 50%;
    }

/******* End Toggle Switch *******/


.ibsSortableAndRemoveContainer {
    float: right;
    display: flex;
    flex-direction: row-reverse;
    flex-wrap: nowrap;
    justify-content: flex-end;
}


.IBSSortableHandle {
    order: 1;
    height: fit-content;
    /*width: 5%;*/
    padding-left: 2%;
    cursor: pointer;
    font-size: 18px;
}

    .IBSSortableHandle svg {
        pointer-events: none;
    }

.IBSSortableHandleNested {
    height: fit-content;
    width: 5%;
    padding-left: 2%;
    cursor: pointer;
    font-size: 18px;
}
    .IBSSortableHandleNested svg {
        pointer-events: none;
    }

.IBSSortableRemove {
    order: 0;
    color: var(--color-error);
    margin-left: 10px;
    margin-right: 10px;
    font-size: 18px;
    cursor: pointer;
    height: fit-content;
}

    .IBSSortableRemove svg {
        pointer-events: none;
    }

.IBSSortableRemoveNested {
    color: var(--color-error);
    margin-left: 10px;
    margin-right: 10px;
    font-size: 18px;
    cursor: pointer;
    height: fit-content;
}

    .IBSSortableRemoveNested svg {
        pointer-events: none;
    }


.IBSSortableShadow {
    background-color: var(--color-section-border);
    opacity: 50%;
}

pre {
    color: var(--color-text-color);
}


.IBSDialogLink {
    color: var(--color-primary);
    font-weight: 500;
    cursor: pointer;
}

/*    .IBSDialogLink:hover {
        text-decoration: underline;
        cursor: pointer !important;
    }*/

/* This seems to need to be at the site level for it to work in the telerik editors, so here it is. This is used for the Inline Text Entry Interaction */
.InlineTextBackGround {
    background-color: var(--color-inlinetextfield-background) !important;
    -webkit-touch-callout: none !important;
    -webkit-user-select: none !important;
    -khtml-user-select: none !important;
    -moz-user-select: none !important;
    -ms-user-select: none !important;
    user-select: none !important;
    border-style: none !important;
    box-shadow: none;
}

.editorDropdown {
    background-color: var(--color-inlinetextfield-background) !important;
    -webkit-touch-callout: none !important;
    -webkit-user-select: none !important;
    -khtml-user-select: none !important;
    -moz-user-select: none !important;
    -ms-user-select: none !important;
    user-select: none !important;
    border-style: none !important;
    box-shadow: none;
}

.k-toolbar {
    position: unset !important;
}
/* This seems to need to be at the site level for it to work in the telerik editors, so here it is. This is used for the Hot Text Interaction */

/* Hot Text Paragraph Interaction Editor */
.hottext-answer-paragraph-selection,
.hottext-paragraph-selection,
/* Hot Text Paragraph Interaction Preview */
span.hottext-paragraph-right,
span.hottext-paragraph-wrong {
    overflow: hidden;
    border-radius: 2px;
    border: 1px solid black;
    vertical-align: middle;
}

.hottext-answer-paragraph-selection,
span.hottext-paragraph-right {
    background: #00CC00; /* Green */
}

.hottext-paragraph-selection,
span.hottext-paragraph-wrong {
    background: #FFFF00; /* Yellow */
}

/* End Hot Text stuff for telerik editor */

.screen-reader-only {
    position: absolute;
    height: 1px;
    width: 1px;
    clip: rect(1px 1px 1px 1px);
    /*// IE 6 and 7 clip: rect(1px,1px,1px,1px);*/
    clip-path: polygon(0px 0px, 0px 0px, 0px 0px);
    -webkit-clip-path: polygon(0px 0px, 0px 0px, 0px 0px);
    overflow: hidden !important;
}


.a11y-skip-link-container {
    position: absolute !important;
    z-index: 999;
}

.CheckBoxLabel {
    margin-left: 5px;
}

.infoHeader {
    background-color: var(--color-section-background);
    display: block;
    padding: 15px;
}

.infoHeaderRowTitle {
    width: 16%;
    display: inline-block;
    vertical-align: middle;
    font-weight: bold;
}

.infoHeaderRowData {
    width: 16%;
    display: inline-block;
    vertical-align: middle;
}

.VerticalLineSeparator {
    border: 1px solid var(--color-section-border);
    width: 1px;
    height: 100%;
}

.ThumbnailImage {
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 5px;
    max-width: 100px;
    max-height: 100px;
    cursor: pointer;
}

    .ThumbnailImage:hover {
        box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
    }


.SiteWarning {
    background-color: var(--color-sitewarning);
    padding-left: 5px;
    text-align: center;
    padding-right: 5px;
    margin-left: 20%;
    margin-right: 20%;
    border: solid var(--color-sitewarning-border) 1px;
}
    .SiteWarning svg {
        /*color: var(--color-warning);*/
    }

.PostBankedMaturityWarning {
    background-color: beige;
    padding-left: 5px;
    text-align: center;
    padding-right: 5px;
    margin-left: 20%;
    margin-right: 20%;
    border: solid black 1px;
}

    .PostBankedMaturityWarning svg {
        color: darkred;
    }

    .highlightPriority {
        background-color: var(--color-highpriority) !important;
    }

.k-alt.highlightPriority {
    background-color: var(--color-highpriority-alt) !important;
}
.highlightPriority:hover {
    background-color: #80bdff70 !important;
}

.OverflowText {
    display: block;
    word-break: break-all;
}

.OverflowTextCutoff {
    display: -webkit-box;
    -webkit-line-clamp: 3; /* default is 3, can be overwritten with data-maxlines on the OverflowTextCutoff element */
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/*img:before {
    content: ' ';
    display: block;
    position: unset;
    height: 50px;
    width: 50px;
    background-image: url('../../Images/Image Unavailable3.png');
}
*/

.fa-check {
    color: var(--color-success);
}
.fa-exclamation {
    color: var(--color-warning);
}

.startInvisible{
    display:none;
}


u {
    text-underline-position: under;
}

span[style*="text-decoration:underline"] {
    text-underline-position: under;
}

span[style*="text-decoration: underline"] {
    text-underline-position: under;
}

.som-navmenuitem {
    display: inline-block;
    width: 100px;
    height: 23px;
    text-align: center;
    background-color: white;
    font-weight: bold;
    font-size: 12px;
    float: left;
    z-index: 100;
    position: relative;
}

.som-navmenuitem:hover {
    background-color: lightgrey;
    cursor: pointer;
    border-left: 1px solid grey;
    border-right: 1px solid grey;
}

    .som-navmenuitem:hover .som-navsubmenuitem {
        display: inline-block;
    }

.som-navmenuitem a:hover {
    text-decoration: none;
}

.som-navsubmenuitem {
    display: none;
    border-left: 1px solid grey;
    border-right: 1px solid grey;
}

    .som-navsubmenuitem:last-child {
        border-bottom: 1px solid grey;
    }

/*
som-menu-item > div[role=listitem] a {
    color: var(--color-text-color);
}*/




:root {
    --color-tab: var(--color-site-foreground);
    --color-tabborder: var(--color-section-border);
    --color-tabactive: var(--color-primary-hover);
    --color-tabselected: var(--color-primary);
    --color-tab-error: indianred;
    --color-tab-error-selected: var(--color-error);
    --color-tab-error-invalid: var(--color-text-color);
}


.ResourceTabBody {
    background-color: var(--color-site-foreground);
    /*margin-left: -5px;*/
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 10px;
    border: 5px solid var(--color-tabselected);
    border-radius: 0px 10px 10px 10px;
    padding-bottom: 5px;
    border-left: 1px solid var(--color-tabselected);
    border-right: 1px solid var(--color-tabselected);
    border-bottom: 1px solid var(--color-tabselected);
    /*margin-top: -2px;*/
    z-index: 2;
}

.IBSTabRow {
    list-style: none;
    margin: 0;
    padding: 0;
    line-height: 24px;
    position: relative;
    z-index: 1;
    color: var(--color-text-color);
}

    .IBSTabRow .IBSTab {
        padding: 4px 20px;
        border: 1px solid var(--color-tabborder);
        background: var(--color-tab);
        display: inline-block;
        position: relative;
        z-index: 0;
        border-top-left-radius: 2px;
        border-top-right-radius: 2px;
        cursor: pointer;
        border-radius: 3px 3px 0px 0px;
        border-bottom: none;
        margin-bottom: -1px;
    }

        .IBSTabRow .IBSTab.IBSTabSelected {
            color: white !important;
            z-index: 2;
            /*border-bottom-color: var(--color-tabselected);*/
            background-color: var(--color-tabselected);
            border-color: var(--color-tabselected);
            border-bottom: 1px solid var(--color-tabselected);
        }

            .IBSTabRow .IBSTab.IBSTabSelected a {
                color: white !important;
            }
        .IBSTabRow .IBSTab:hover {
            color: white !important;
            border-bottom: 1px solid var(--color-tabselected);
        }

        .IBSTabRow .IBSTab.IBSTabSelected .RemoveInteraction {
            color: var(--color-tab-error-invalid) !important;
        }
        .IBSTabRow .IBSTab.IBSTabSelected .requiredField {
            color: white !important;
            /*color: var(--color-tab-error-invalid) !important;*/
        }

        .IBSTabRow .IBSTab:hover .newIndicator {
            color: white;
        }

        .IBSTabSelected .newIndicator {
            color: white;
        }

.IBSTabRow a:hover {
    text-decoration: none;
}
.IBSTabRow .IBSTab:hover {
    background-color: var(--color-tabselected);
    border-color: var(--color-tabselected);
}
.IBSTabRow .IBSTab.IBSTabUnselectable:hover {
    color: white;
    /*        background-color: var(--color-secondary);
        border-color: var(--color-secondary);*/
}
.IBSTabRow .IBSTab:hover a {
    color: var(--color-site-foreground);
}
.IBSTabRow .IBSTab:hover .RemoveInteraction {
    color: var(--color-tab-error-invalid) !important;
}
.IBSTabRow .IBSTab:hover .requiredField {
    color: white !important;
    /*color: var(--color-tab-error-invalid) !important;*/
}

.IBSTabRow .IBSTab:active {
    background-color: var(--color-tabactive);
    border-color: var(--color-tabactive);
}
    .IBSTabRow .DisabledTab {
        pointer-events: none;
        display: inline-block;
    }

     .IBSTabRow .DisabledTab a {
            color: var(--color-tabborder);
       }

.IBSTabInvalid {
    color: var(--color-tab-error-selected) !important;
}
    .IBSTabInvalid a {
        color: var(--color-tab-error-selected) !important;
    }


.IBSTabSelected.IBSTabInvalid a {
    color: white !important;
}

.IBSTabSelected.IBSTabInvalid {
    background-color: var(--color-tab-error-selected) !important;
    border-color: var(--color-tab-error-selected) !important;
    border-bottom: 1px solid var(--color-tab-error-selected);
    color: white !important;
}
    .IBSTabSelected.IBSTabInvalid .requiredField, .RemoveInteraction {
        color: var(--color-text-color) !important;
    }

.IBSTabInvalid:hover {
    background-color: var(--color-tab-error-selected) !important;
    border-color: var(--color-tab-error-selected) !important;
    border-bottom: 1px solid var(--color-tab-error-selected);
    color: white !important;
}
    .IBSTabInvalid:hover .requiredField, .RemoveInteraction {
        color: var(--color-text-color) !important;
    }
    .IBSTabInvalid:hover a {
        color: white !important;
    }

.IBSTabSearchButtons{
    float:right;
    margin-left:4px;
}
.SearchButtonMargin {
    margin-right: 15px;
}


/*This css remove "X" for clear content in filter text box , Telerik grid. */
.k-filtercell > .k-operator-hidden {
    padding-right: 0;
}

.k-filtercell > span {
    padding-right: 2.4em;
}

.k-filter-row .k-dropdown-operator {
    right: 0em;
}

/*These two allow for multi-line headers in the telerik grids*/
.k-grid .k-grid-header .k-header .k-link {
    height: auto;
}

.k-grid .k-grid-header .k-header {
    white-space: normal;
    font-weight: bold;
}
/*header alignment*/
.k-header .k-link {
    text-align: center;
}

.k-grid-header th.k-header {
    vertical-align: middle;
}

.k-grid .k-grid-search {
    margin-left: auto;
    margin-right: 0;
}

.k-grid tr:hover {
    background: #80bdff70;
}

.k-grid td {
    text-align: center;
}

.k-button:not(:active),.k-picker:not(:active) {
    color: var(--color-primary);
    background-image: none,linear-gradient(to bottom,rgb(255 255 255 / 70%) 0,rgb(255 255 255 / 25%) 100%);
}

.k-button:hover:not(:active),.k-picker:hover:not(:active) {
    border-color: var(--color-primary);
    box-shadow: 0px 0px 2px 1px #28807c50;
    background-color: #c5c5c5;
}

.k-grid table {
    min-width: 100%;
}

:root.darkMode .k-grid .k-grid-content table .disabledAnchorTag {
    color: white;
}
/*Telerik grid related css moved from AssignItem.css page */
html .k-grid tr.k-detail-row td.k-hierarchy-cell {
  /*  background: rgb(128, 128, 128);*/
}

html .k-grid td.k-detail-cell {
    /*background: rgb(128, 128, 128);*/
}
html .k-grid tr.k-detail-row thead th {
    background-color: var(--color-subGrid-header);
}
html .k-grid tr.k-detail-row tbody td {
    background-color: var(--color-subGrid-body);
}

:root.darkMode table[role="grid"] tbody {
    background: var(--color-site-foreground);
}

:root.darkMode #ItemInteractionsGrid {
    background: var(--color-site-foreground);
}

:root.darkMode table.k-editor {
    border-color: var(--color-section-border);
}
/*Telerik grid related css moved from Site.css page */

:root.darkMode .k-grid .k-grid-content {
    background-color: var(--color-site-foreground);
}

    :root.darkMode .k-grid .k-grid-content table {
        color: var(--color-text-color);
    }

:root.darkMode .k-grid tr:hover {
    background: #2c3b4b;
}

:root.darkMode .k-master-row.k-alt {
    background-color: var(--color-site-background);
}
:root.darkMode .k-master-row.k-alt.k-selected {
    color: #fff;
    background-color: var(--color-section-grid-background);
    border-color: #f85a00;
}

.k-pager-wrap .k-link.k-selected {
    background-color: var(--color-section-grid-background);
}

.k-grid .k-grid-content table {
    font-weight: normal;
}

.k-grid-header .k-header > .k-link {
    font-weight: bold;
}


:root.darkMode .k-grid .k-grid-content table {
    font-weight: normal;
}

.k-grid-header .k-header > .k-link, .k-header, .k-treemap-title {
    font-weight: bold;
}

.k-grid td.k-grid-content-sticky.k-selected:hover, .k-grid td.k-grid-content-sticky.k-selected:hover, .k-grid td.k-selected:hover, .k-grid td.k-selected:hover, .k-grid tr.k-selected:hover, .k-grid tr.k-selected:hover {
    color: #fff;
    background-color: var(--color-section-grid-background);
    border-color: #f85a00;
}

.k-draghandle.k-selected:hover, .k-ghost-splitbar-horizontal, .k-ghost-splitbar-vertical, .k-list > .k-highlight, .k-list > .k-selected, .k-marquee-color, .k-panel > .k-selected, .k-scheduler .k-today.k-selected, .k-selected, .k-selected:link, .k-selected:visited {
    color: #fff;
    background-color: var(--color-section-grid-background);
    border-color: #f85a00;
}

.k-list-item.k-selected.k-hover, .k-list-item.k-selected:hover {
    color: #fff;
    background-color: var(--color-section-grid-background);
    border-color: #f85a00;
}

a.k-button.k-button-icontext.k-primary.k-grid-update {
    color: white;
    background-color: #f35800;
    background-image: none,linear-gradient(to bottom,rgb(255 255 255 / 31%) 0,rgb(255 255 255 / 0%) 100%);
}

.k-button, .k-picker {
    box-shadow: unset;
}


/*.k-grid .k-selected {
    background-color: var(--color-section-grid-background);
    color: #000000;
}
 
.k-grid .k-alt.k-selected {
  background-color: #f1f1f1 !important;
  color: #000000;
}*/




 /*:root.darkMode .k-draghandle.k-selected:hover, .k-ghost-splitbar-horizontal, .k-ghost-splitbar-vertical, .k-list > .k-highlight, .k-list > .k-selected, .k-marquee-color, .k-panel > .k-selected, .k-scheduler .k-today.k-selected, .k-selected, .k-selected:link, .k-selected:visited {
        color: #fff;
        background-color: #212529;
        border-color: #f85a00;
    }*/


/* Kendo Listbox */
.k-list .k-item {
    font-weight: 400;
}

    .k-list .k-item:hover:not(.k-disabled) {
        background: #80bdff70;
    }

.k-list .k-selected {
    background: #eaeaea;
    border-color: transparent;
    color: unset;
}

.k-list .k-focused.k-selected {
    box-shadow: none;
}

/* End of Kendo Listbox */

.telerikGridDivider {
    border-width: 0 5px !important;
}

.k-grid .k-command-cell > .k-button + .k-button {
    margin-left: 0px !important;
    margin-inline-end: 20px !important;
    margin-inline-start: 0px !important;
}

.dvTextExtensionPopout {
    padding: 5px;
    z-index: 998;
    position: absolute;
    display: none;
    border: 2px solid var(--color-section-border);
    width: 500px;
    background-color: var(--color-section-background);
    line-height: normal;
    overflow-wrap: break-word;
}

.spTextExtensionPopout, .spTextExtensionModal {
    cursor: pointer;
    color: var(--color-primary);
}

.spTextExtensionPopout:hover, .spTextExtensionModal:hover {
    text-decoration: none;
    text-decoration: underline;
}

#dvSidePanel .dvTextExtensionPopout {
    left: unset !important;
    width: unset !important;
    margin-right: 12px;
}