/*Attention au c0da71 à passer en primary color dans ej */
@import url(css/uicons-regular-straight.css);
@import url(css/uicons-regular-rounded.css);

:root {
    --body-color: #fff;
    --sidebar-color: #FFF;
    --primary-color: #5e3272;
    --primary-color-light: #ffd766;
    --primary-color-rgb: 94,50,114;
    --primary-color-light-rgb: 255,215,102;
    --green-color: #a9fbb4;
    --blue-color: #09FEFF;
    --toggle-color: #707070;
    --text-color: #707070;
    --tran: all 0.5s;
    --button-background-color: #5e3272;
    --button-background-color-hover: #ffd766;
    --button-text-color: #fff;
    --button-text-color-hover: #5e3272;
    --button-background-color-light: #ffd766;
    --button-background-color-light-hover: #5e3272;
    --button-text-color-light: #5e3272;
    --button-text-color-light-hover: #fff;
}

@font-face {
    font-family: Roboto;
    src: url(fonts/Roboto/Roboto-Regular.ttf) format("TrueType");
}
@font-face {
    font-family: "uicons-regular-rounded";
    src: url(fonts/uicons-regular-rounded.eot#iefix) format("embedded-opentype"), url(fonts/uicons-regular-rounded.woff2) format("woff2"), url(fonts/uicons-regular-rounded.woff) format("woff");
}
@font-face {
    font-family: "uicons-regular-straight";
    src: url(fonts/uicons-regular-straight.eot#iefix) format("embedded-opentype"), url(fonts/uicons-regular-straight.woff2) format("woff2"), url(fonts/uicons-regular-straight.woff) format("woff");
}
* {
    margin: 0;
    box-sizing: border-box;
    font-family: Roboto, Arial, sans-serif;
}

body {
    background-color: var(--body-color);
    font-size: 14px;
    margin: 0px;
    padding: 0px;
    color: #4c4c4c;
    min-height: 100vh;
}

img {
    border: 0;
    outline: none;
}

#BtNew {
    width: 24px;
}

.barrer {
    text-decoration: line-through;
}

a {
    outline: 0;
}

    a:link {
        color: #0000EE;
        text-decoration: underline;
    }

    a:visited {
        color: #551A8B;
    }

    a:hover {
        color: #1d60ff;
        text-decoration: none;
    }

    a:active {
        color: #551A8B;
    }

p, ul {
    margin-bottom: 20px;
    line-height: 1.6em;
}

header, section {
    display: block;
}

/* HEADINGS
----------------------------------------------------------*/
h1, h2, h3, h4, h5, h6 {
    font-size: 1.5em;
}

h1 {
    font-size: 2em;
    padding-bottom: 0;
    margin-bottom: 0;
}

h2 {
    padding: 0 0 10px 0;
}

h3 {
    font-size: 1.2em;
}

h4 {
    font-size: 1.1em;
}

h5, h6 {
    font-size: 1em;
}

.justify {
    text-align: justify;
}

/* PRIMARY LAYOUT ELEMENTS
----------------------------------------------------------*/

/* you can specify a greater or lesser percentage for the
page width. Or, you can specify an exact pixel width. */
.page {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    border-top-left-radius: 5px;
}

header, #header {
    position: relative;
    margin-bottom: 0px;
    color: #000;
    padding: 0;
}

    header h1, #header h1 {
        font-weight: bold;
        padding: 5px 0;
        margin: 0;
        color: #fff;
        border: none;
        line-height: 2em;
        font-size: 32px !important;
        text-shadow: 1px 1px 2px #111;
    }

#main {
    display: block;
    /*background-color: var(--body-color);*/
	background-color: #fff;
}

.maindesigner {
    position: fixed;
    left: 250px;
    height: calc(100% - 82px);
    width: calc(100% - 250px);
    background-color: var(--body-color);
    padding-left: 5px;
    overflow: auto;
}

    .maindesigner .text {
        font-size: 30px;
        font-weight: 500;
        color: var(--text-color);
        padding: 12px 60px;
    }

/* MENU */
nav {
    display: block;
    width: 100%;
    float: left;
    margin: 5px 0px 0px 0px;
}

.e-menu {
    border: 0 none;
}

    .e-menu.e-horizontal .e-list:hover {
        background: #E6E6E6;
        border-top: 2px solid var(--primary-color);
        margin-top: -2px;
        border-bottom: 2px solid var(--primary-color);
        margin-bottom: -2px;
    }

    .e-menu.e-horizontal .e-list.e-active > .e-menulink {
        color: #333;
    }

    .e-menu, .e-menu-res-wrap .e-in-wrap.e-menu-res-in-wrap, .e-menu.e-vertical, .e-menu.e-vertical .e-list > ul, .e-menu.e-context, .e-menu.e-context .e-list > ul {
        background: #FFF;
    }

        .e-menu.e-horizontal .e-list {
            margin-right: 10px;
        }

            .e-menu.e-horizontal .e-list > ul {
                background: #FFF;
            }

            .e-menu.e-horizontal .e-list > a {
                /*color: rgb(92, 93, 90);*/
                color: #707070 !important;
                font-size: 14px !important;
                /*text-transform: uppercase;*/
            }

            .e-menu.e-horizontal .e-list > a, .e-menu.e-horizontal .e-list > span, .e-menu.e-vertical .e-list > a, .e-menu.e-vertical .e-list > span, .e-menu.e-context .e-list > a, .e-menu.e-context .e-list > span, .e-menu-res-wrap .e-menu-res-in-wrap .e-res-title, .e-menu.e-vertical {
                color: #333;
            }

.e-menu-res-wrap .e-menu-res-in-wrap .e-check-wrap .e-res-icon, .e-menu-res-wrap .e-menu-res-in-wrap .e-check-wrap {
    color: #333;
}

.e-menu.e-horizontal > .e-list.e-active.e-menu-arrow:after {
    border-color: transparent transparent #FFF;
    border-style: solid;
}

.e-menu .e-list > a .e-icon, .e-menu .e-list > span > .e-icon {
    color: #333;
}

.e-menu .e-list > a span.e-icon.e-arrowhead-down, .e-menu .e-list > a span.e-icon.e-arrowhead-right {
    color: var(--primary-color);
}

.e-menu.e-horizontal .e-list > .e-menulink, .e-menu.e-vertical .e-list > .e-menulink, .e-menu.e-context .e-list > .e-menulink, .e-menu-res-wrap .e-menu-res-in-wrap .e-res-title, .e-menu.e-vertical {
    color: #000;
}

.e-menu-wrap > .e-menu-popwrap > .e-menu.e-vertical .e-list > .e-menulink {
    background: #FFF;
    color: #333;
}

.e-menu.e-separator.e-horizontal > .e-list, .e-menu.e-horizontal > .e-separator {
    border-right: 0 none;
}

.e-menu.e-horizontal .e-list:hover > a, .e-horizontal.e-menu .e-list:hover > span {
    background: none;
}

.e-menu.e-horizontal .e-list.e-active > .e-menulink, .e-menu.e-vertical .e-list.e-active > .e-menulink, .e-menu.e-context, e-list.e-active > .e-menulink, .e-menu.e-horizontal .e-list.e-active:hover, .e-menu.e-vertical .e-list.e-active:hover, e-menu.e-context .e-list.e-active:hover {
    color: #000000;
}

.MENUSELECTED {
    border-bottom: 2px solid var(--primary-color) !important;
    margin-bottom: -2px !important;
}

.e-menu.e-context {
    width: initial;
}
/*SIDE BAR MENU */

/*.eca-toggle:before{content: "\e602"}	*/

.toggle {
    cursor: pointer;
    margin-bottom: 15px;
}

.sidebar {
    position: fixed;
    top: 80px;
    left: 0;
    height: calc(100% - 80px);
    width: 250px;
    padding: 5px 5px 10px 5px;
    background: #fff;
    transition: var(--tran);
    z-index: 100;
    border-top-right-radius: 5px;
    box-shadow: 2px 0px 5px 0px rgba(0, 0, 0, 0.15);
}

    .sidebar.close {
        width: 68px;
    }

.ticketeditsidebar {
    position: relative;
    top: auto;
    border-top-right-radius: initial;
    box-shadow: none;
}

    .ticketeditsidebar .menu-bar {
        overflow: hidden !important;
    }

.SplitterLeftPane .sidebar {
    width: auto;
}

.nav-link {
    height: 40px;
    list-style: none;
    display: flex;
    align-items: center;
}

.sidebar header .image,
.sidebar .icon, .pagetitle .icon, .pagetitleindex .icon, .pagetitleedit .icon, .toggle {
    min-width: 40px;
    border-radius: 6px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}

.sidebar .text,
.sidebar .icon {
    color: var(--text-color);
    transition: var(--tran);
}

.sidebar .text {
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
    opacity: 1;
}

.sidebar.close .text {
    opacity: 0;
}

.sidebar li a {
    list-style: none;
    height: 100%;
    background-color: transparent;
    display: flex;
    align-items: center;
    height: 100%;
    width: 100%;
    border-radius: 6px;
    text-decoration: none;
    transition: var(--tran);
}

    .sidebar li a:hover {
        background-color: var(--primary-color);
    }

        .sidebar li a:hover .icon,
        .sidebar li a:hover .text {
            color: var(--sidebar-color);
        }

.sidebar .menu-bar {
    height: calc(100% - 55px);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow-x: hidden; /* Hide horizontal scrollbar */
    overflow-y: scroll; /* Add vertical scrollbar */
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}

    .sidebar .menu-bar::-webkit-scrollbar {
        width: 5px;
    }

    .sidebar .menu-bar::-webkit-scrollbar-track {
        background: #f1f1f1;
    }

    .sidebar .menu-bar::-webkit-scrollbar-thumb {
        background: #888;
    }

        .sidebar .menu-bar::-webkit-scrollbar-thumb:hover {
            background: #555;
        }

.sidebar.close ~ .maindesigner {
    left: 68px;
    width: calc(100% - 48px);
}

#mySplitter div > div > ul {
    padding-inline-start: 5px;
}

/* FORM LAYOUT ELEMENTS
----------------------------------------------------------*/
#TopButton {
    background-color: #fff;
    width: 24px;
    cursor: pointer;
    height: 24px;
    float: right;
    margin: -24px -24px 0 0;
}

#BtnBack {
    float: left;
    display: block;
}

#BtnBackToList {
    width: 24px;
    cursor: pointer;
}

.imgload {
    margin: auto;
    display: block;
    width: 80px;
    height: 80px;
}

#loginapplogo {
    border-width: 0px;
    /*vertical-align: bottom;*/
    margin: auto;
    display: block;
    max-height: 40px;
}

#applogo {
    border-width: 0px;
    vertical-align: bottom;
}

#EcaldimaLogo {
    border-width: 0px;
    vertical-align: bottom;
    margin-left: 5px;
}

.ClearBoth {
    clear: both;
}

fieldset {
    border: 2px solid var(--primary-color);
    padding: 0 1.4em 1.4em 1.4em;
    margin: 0 0 1.5em 0;
    min-width: 95%;
    display: table-cell;
}

#image {
    max-width: 200px;
    margin: 2px;
}

legend {
    font-size: 1.2em;
    font-weight: bold;
    margin-bottom: 0.5em;
}

    legend span {
        font-size: 0.8em;
        font-weight: normal;
    }

textarea {
    min-height: 75px;
    border-color: #aaa;
}

input[type="text"], input[type="password"], input[type="email"] {
    border: 1px solid #aaa;
    padding: 2px;
    font-size: 1.0em;
    color: #4c4c4c;
    width: 100%;
    height: 30px;
    line-height: 28px;
    border-radius: 5px;
    box-sizing: border-box;
}

input[type="number"], input[type="textdate"], .numberinput {
    text-align: right;
    border: 1px solid #aaa;
    padding: 2px;
    font-size: 1.0em;
    color: #4c4c4c;
    width: 100%;
    line-height: 28px;
    border-radius: 5px;
    box-sizing: border-box;
}

.stocknum {
    width: initial !important;
}

input[type=checkbox], input[type=radio] {
    vertical-align: middle;
    position: relative;
    bottom: 1px;
}

input[type=checkbox] {
    margin-right: 2px;
}

input[type="submit"] {
    outline: 0;
}

input::placeholder {
    color: lightgrey;
}

select {
    padding: 2px;
    font-size: 14px;
    color: #4c4c4c;
    line-height: 28px;
    height: 30px;
    border: 1px solid #aaa;
    border-radius: 5px;
}

.select2-container .select2-selection--single {
    height: 30px;
}

.select2-container--classic .select2-selection--single {
    background-color: #ffffff;
    background-image: none;
}

    .select2-container--classic .select2-selection--single .select2-selection__arrow {
        background-image: none;
    }

.select2-container--classic.select2-container--open.select2-container--below .select2-selection--single {
    background-image: none;
}

.select2-container--classic.select2-container--open .select2-selection--single {
    border: 1px solid #aaa;
}

.select2-container--classic.select2-container--open .select2-dropdown {
    border-color: #aaa;
}

.select2-container--classic .select2-selection--single:focus {
    border: 1px solid #aaa;
}

#Resolve_ResolutionCodeId {
    z-index: 100000;
}

.costitem-field {
    width: 100%;
    margin: 0.5em 0 0.5em 0;
}

.comment-field {
    width: 100%;
    margin: 0.5em 0 0.5em 0;
}

#Query, #editor {
    width: 100%;
    height: 200px;
    margin: 0.5em 0 0.5em 0;
}

#editor {
    border: 1px solid #f1f1f1;
}

.ace_editor {
    height: 200px;
}
/* TABLE
----------------------------------------------------------*/

.tablediv {
    display: table;
    border: 1px solid #CCC;
    margin-left: 10px;
}

.tablerow {
    display: table-row;
}

.tablecellheader {
    display: table-cell;
    border-bottom: 1px solid #CCC;
}

.tablecell {
    display: table-cell;
}

.tableaction {
    width: 45px;
    max-width: 60px;
}

.tableactionrequests {
    width: 100px;
}

.tableactionassets {
    min-width: 100px;
}

.tableactionreports {
    min-width: 100px;
}

    .tableaction img, .tableactionrequests img, .tableactionassets img, .tableactionreports img {
        width: 16px;
        cursor: pointer;
    }

table {
    /*border: solid 1px #C8C8C8;*/
    border-collapse: collapse;
}

    table tfoot th {
        text-align: left;
    }

.sortable {
    list-style: none;
    width: 95%;
}

    .sortable li {
        display: table;
        width: 100%;
        height: 22px;
        vertical-align: middle;
        text-align: left;
        background: #fff;
        margin: 5px;
        border: 1px solid var(--eca-primary-color);
    }

        .sortable li:hover {
            background: #f2f2f2;
            cursor: move;
        }

.dataTables_wrapper a {
    z-index: 100;
}
/* MISC
----------------------------------------------------------*/
.clear {
    clear: both;
}

#title {
    display: block;
    float: left;
    text-align: left;
    /*vertical-align: middle;*/
    margin: 2px 0px 2px 0px;
    width: 30%;
}

#logindisplay {
    font-size: 1.1em;
    display: block;
    text-align: right;
    margin: 12px 5px 0px 0px;
    color: black;
    float: right;
}

    #logindisplay a:link {
        color: var(--primary-color);
        text-decoration: underline;
    }

    #logindisplay a:visited {
        color: var(--primary-color);
        text-decoration: underline;
    }

    #logindisplay a:hover {
        color: var(--primary-color);
        text-decoration: none;
    }
/* Styles for validation helpers
-----------------------------------------------------------*/
.select2-container--default.input-validation-error {
    border: 1px solid #ff0000;
    background-color: #ffeeee;
}

.field-validation-error {
    color: #ff0000;
}

.field-validation-valid {
    display: none;
}

.input-validation-error {
    border: 1px solid #ff0000;
    background-color: #ffeeee;
}

.validation-summary-errors {
    font-weight: bold;
    color: #ff0000;
}

    .validation-summary-errors ul {
        list-style-type: none;
    }

.validation-summary-valid {
    display: none;
}

/* Styles for editor and display helpers
----------------------------------------------------------*/
.displayandeditorgroup {
    margin-bottom: 1rem;
}

.display-label, .editor-label, .QuestionText {
    margin: 5px 0px 0px 0px;
    font-size: 1.0em;
    min-height: 20px;
    font-weight: 600;
    /*border-bottom: 1px solid #f1f1f1;*/
    padding: 5px 5px 0px 0px;
    box-sizing: border-box;
}

.label-label {
    border-bottom: none;
    padding-bottom: 0px;
}

.QuestionText {
    border: none;
}

.display-field, .editor-field, .designer-editor-field {
    margin: 5px 0px 0px 0px;
    /*vertical-align: middle;*/
    background: #fcfcfc;
    padding: 5px 5px 0px 0px;
    min-height: 28px;
    display: block;
    width: 100%;
    box-sizing: border-box;
}

.editor-field, .designer-editor-field {
    background: none;
}

.display-label100l, .editor-label100l {
    font-size: 1.2em;
    height: 20px;
    clear: both;
    float: left;
    width: 100%;
    margin-right: 5px;
}

.multiline-editor-field {
    margin: 5px 0px 0px 0px;
	padding: 5px 5px 0px 0px;
    display: block;
    box-sizing: border-box;
}

.html-editor-field {
    margin: 5px;
}

.text-box.multi-line {
    height: 6.5em;
    width: 600px;
}

.tri-state {
    width: 6em;
}

.tooltipbox {
    display: none;
    z-index: 1001;
}

.ColumnFilter {
    border: 0px solid #a2c522;
    background: #a2c522;
    color: #ffffff;
    width: 100%;
}

.Money {
    text-align: right;
}

.NumberAlignRight {
    text-align: right;
}
td:has(> span.NumberAlignRight) {
    text-align: right;
}
.button {
    background: var(--primary-color);
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    color: #ffffff;
    padding: 10px 20px 10px 20px;
    text-decoration: none;
    border-style: none;
    align-items: flex-start;
    text-align: center;
    cursor: pointer;
}

    .button:hover {
        background: #626262;
        text-decoration: none;
        border-style: none;
    }

.buttonDeleteRow {
    width: 16px;
    height: 16px;
    background-image: url(./images/delete-16.png);
    text-decoration: none;
    border-style: none;
    background-color: #fff;
    background-repeat: no-repeat !important;
}

.formbutton {
    float: left;
    padding-top: 5px;
}

a.back-to-top {
    margin: 0;
    position: fixed;
    bottom: 0;
    width: 52px;
    height: 52px;
    z-index: 100;
    display: none;
    right: 0;
    text-decoration: none;
    background-image: url(images/backtotop-up-circular-48.png);
    background-color: transparent;
    background-repeat: no-repeat !important;
    vertical-align: middle;
}

    a.back-to-top:hover {
        background-image: url(images/backtotop-hover-up-circular-48.png);
    }

#return-to-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    background: rgb(0, 0, 0);
    background: rgba(0, 0, 0, 0.7);
    width: 50px;
    height: 50px;
    display: block;
    text-decoration: none;
    -webkit-border-radius: 35px;
    -moz-border-radius: 35px;
    border-radius: 35px;
    display: none;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
    z-index: 120000;
}

    #return-to-top span {
        color: #fff;
        margin: 0;
        position: relative;
        left: 16px;
        top: 13px;
        font-size: 19px;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        transition: all 0.3s ease;
    }

    #return-to-top:hover {
        background: #A0A0A0;
        box-shadow: rgba(0, 0, 0, 0.3) 0px 2px 4px 0px;
    }

        #return-to-top:hover span {
            color: #fff;
            top: 5px;
        }

.TicketInfoBlock {
    margin: 0.5em 0 1em 0;
    height: 35px;
    border: 2px solid #ddd;
}

.TicketInfoBlock-field {
    max-width: 400px;
    white-space: normal;
}

/* STRUCTURE */

.col-1 {
    width: 80px;
}

.col-2 {
    width: 160px;
}

.col-3 {
    width: 240px;
}

.col-4 {
    width: 320px;
}

.col-5 {
    width: 400px;
}

.col-6 {
    width: 480px;
}

.col-7 {
    width: 560px;
}

.col-8 {
    width: 640px;
}

.col-9 {
    width: 720px;
}

.col-10 {
    width: 800px;
}

.col-11 {
    width: 880px;
}

.col-12 {
    width: 100%;
}

.col-50p {
    width: 45%;
}

[class*="col-"], [class*="cell-"] {
    float: left;
    padding: 5px;
}

.col-flright {
    float: right;
}

.col-down {
    display: none;
}

.cell-1 {
    min-width: 80px;
}

.cell-2 {
    min-width: 160px;
}

.cell-3 {
    min-width: 240px;
}

.cell-4 {
    min-width: 320px;
}

.cell-5 {
    min-width: 400px;
}

.cell-6 {
    min-width: 480px;
}

.cell-7 {
    min-width: 560px;
}

.cell-8 {
    min-width: 640px;
}

.cell-9 {
    min-width: 720px;
}

.cell-10 {
    min-width: 800px;
}

.cell-11 {
    min-width: 880px;
}

.cell-12 {
    min-width: 100%;
}

.fullwidth {
    width: 100%;
    padding: 0;
}

.colheader {
    width: 100%;
    padding: 2px 0 2px 5px;
    margin-bottom: 10px;
    font-size: large;
}

#uploadbox, #uploadboxnotvisibletoguest {
    margin-top: 3px;
    margin-bottom: 3px;
}

.TIMABlock {
    border: 2px solid #ddd;
    padding: 0 2px 5px 2px;
    margin: 0 5px 5px 0;
    white-space: normal;
}

.TIMATIcketActionPageTitle {
    height: 40px;
}

    .TIMATIcketActionPageTitle i {
        width: 40px;
        font-size: 20px;
        text-align: center;
        display: inline-block;
    }

    .TIMATIcketActionPageTitle .text {
        font-size: 14px;
        font-weight: 500;
        white-space: nowrap;
        opacity: 1;
        line-height: 40px;
    }

.OperatorTicketDisplayMenuLink {
    padding: 10px;
    box-sizing: border-box;
    min-width: 150px;
    text-align: center;
    background-color: #f7f7f7;
    margin: 0px 5px 0px 5px;
	height: 35px;
	text-wrap: nowrap;
}

    .OperatorTicketDisplayMenuLink:hover {
        border-top: 2px solid var(--primary-color);
        margin-top: -2px;
        border-bottom: 2px solid var(--primary-color);
        margin-bottom: -2px;
        cursor: pointer;
    }

    .OperatorTicketDisplayMenuLink a {
        text-decoration: none;
        color: var(--primary-color);
    }

.OperatorTicketDisplayMENUSELECTED {
    border-bottom: 2px solid var(--primary-color) !important;
    margin-bottom: -2px !important;
    background-color: #4c4c4c;
    color: #ffffff;
}

    .OperatorTicketDisplayMENUSELECTED a {
        color: #ffffff;
    }

.OperatorTicketDisplayCancelButton, .OperatorTicketDisplayCloseButton {
    padding: 10px;
    box-sizing: border-box;
    min-width: 150px;
    text-align: center;
    background-color: #f7f7f7;
    margin: 0px 5px 0px 5px;
    border: none;
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
    display: inline-block;
}

.OperatorTicketDisplayActionButton {
    position: relative;
    padding: 10px;
    box-sizing: border-box;
    min-width: 150px;
    text-align: center;
    background-color: #4c4c4c;
    color: #ffffff;
    margin: 0px 5px 0px 5px;
    border: none;
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
}

.OperatorTicketDisplayRefuseButton, .OperatorTicketDisplaySubActionButton {
    position: relative;
    padding: 10px;
    box-sizing: border-box;
    min-width: 150px;
    text-align: center;
    background-color: #f1f1f1;
    margin: 0px 5px 0px 5px;
    border: none;
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
}

.OperatorTicketDisplayAcceptButton {
    position: relative;
    padding: 10px;
    box-sizing: border-box;
    min-width: 150px;
    text-align: center;
    background-color: #4c4c4c;
    color: #ffffff;
    margin: 0px 5px 0px 5px;
    border: none;
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
}

    .OperatorTicketDisplayActionButton:hover, .OperatorTicketDisplayCancelButton:hover, .OperatorTicketDisplayRefuseButton:hover, .OperatorTicketDisplayAcceptButton:hover, .OperatorTicketDisplayCloseButton:hover, .OperatorTicketDisplaySubActionButton:hover {
        box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.4);
        transition: box-shadow 0.3s ease;
        cursor: pointer;
    }

.childticketlist {
    min-height: 2px;
    max-height: 180px;
    overflow: auto;
    width: 400px;
    padding: 0 0 0 5px;
    margin: 0 5px 5px 0;
    white-space: nowrap;
}

.childtickettoclose {
    list-style: none;
    padding-inline-start: 0px;
}

.assetsearchresult {
    width: 100%;
    padding: 2px;
    background-image: url(images/view-details-24.png) !important;
    background-repeat: no-repeat !important;
    cursor: pointer;
}

    .assetsearchresult span {
        padding-left: 25px;
    }

.blocktitle {
    font-size: 0.8em;
    text-align: left;
    font-weight: bold;
}
/* Priority
100	Low
200	Medium
300	High
400	Critical
*/
.PriorityBlock400 {
    border: 2px solid red;
    font-weight: bold;
    color: Red;
}

.PriorityBlock300 {
    border: 2px solid #FF6A00;
    font-weight: bold;
    color: #FF6A00;
}

.PriorityBlock200 {
    border: 2px solid blue;
    font-weight: bold;
    color: blue;
}

.PriorityBlock100 {
    border: 2px solid blue;
    font-weight: normal;
    color: blue;
}

.StatusBlock400 {
    border: 2px solid #0014ED;
}

.row::after {
    content: "";
    clear: both;
    display: block;
}

.includeTicketDisplay {
    margin-top: 10px;
}

.CalcPrioritybutton {
    background-image: url(images/ticketedit/BtnTicketEditCalculatePriority-18.png) !important;
    height: 18px;
    width: 18px;
    border: 0 none;
    border-style: none;
    background-color: transparent;
    vertical-align: middle;
    cursor: pointer;
    outline: none;
    background-repeat: no-repeat !important;
}

.ShowHideSearch {
    background-image: url(images/show-hide-search.png);
    height: 16px;
    width: 16px;
    border: 0 none;
    border-style: none;
    background-color: transparent;
    vertical-align: middle;
    cursor: pointer;
    outline: none;
    background-repeat: no-repeat !important;
}
/* MENU TICKET DISPLAY */

#MnuAddComment, .TicketAddComment {
    background-image: url(images/ticketedit/BtnTicketEditAddComment-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

#MnuSendEmail {
    background-image: url(images/ticketedit/BtnTicketEditSendEmail-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

#MnuValidation {
    background-image: url(images/ticketedit/BtnTicketEditAskForValidation-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

#MnuCreateLinked {
    background-image: url(images/ticketedit/BtnTicketEditCreateChildTicket-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

#MnuAskValidation {
    background-image: url(images/ticketedit/BtnTicketEditAskForValidation-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

#MnuCancelValidation {
    background-image: url(images/ticketedit/BtnTicketEditCancelValidation-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

#MnuAssignToMe {
    background-image: url(images/ticketedit/BtnTicketEditAssignToMe-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

#MnuReAssign {
    background-image: url(images/ticketedit/BtnTicketEditReassign-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

#MnuSchedule {
    background-image: url(images/ticketedit/BtnTicketEditSchedule-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

#MnuReSchedule {
    background-image: url(images/ticketedit/BtnTicketEditReschedule-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

#MnuCancelSchedule {
    background-image: url(images/ticketedit/BtnTicketEditCancelSchedule-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

#MnuResolve {
    background-image: url(images/ticketedit/BtnTicketEditResolve-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

#MnuCancelResolution {
    background-image: url(images/ticketedit/BtnTicketEditCancelResolve-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

#MnuControlResolution {
    background-image: url(images/ticketedit/BtnTicketEditControlResolution-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

#MnuClassify {
    background-image: url(images/ticketedit/BtnTicketEditClassify-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

#MnuRespond {
    background-image: url(images/ticketedit/BtnTicketEditRespond-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

#MnuResume {
    background-image: url(images/ticketedit/BtnTicketEditResume-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

#MnuCloseTask {
    background-image: url(images/run-task-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

#MnuScheduleTask {
    background-image: url(images/TaskSchedule-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

#MnuHoldTask {
    background-image: url(images/TaskHold-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

#dvMenuActions ul {
    margin: 0px;
    width: 100%;
    display: block;
    padding-inline-start: 0px;
}

    #dvMenuActions ul li {
        display: inline-block;
        background-color: #fff;
        list-style-type: none;
        padding: 10px 10px 10px 46px;
        margin: 5px;
        background: #ffffff;
        color: #4c4c4c;
        text-align: center;
        cursor: pointer;
        font-weight: 500;
        border: 1px solid #c1c1c1;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
        box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 2px 0px;
    }

        #dvMenuActions ul li:hover {
            cursor: pointer;
            background: #f2f2f2;
            box-shadow: rgba(0, 0, 0, 0.3) 0px 2px 4px 0px;
        }

[id*="MnuSmartTask_"] {
    background-image: url(images/ticketedit/BtnTicketEditSmartTask-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

    [id*="MnuSmartTask_"]:hover {
        background: none;
    }

[id*="MnuRequestTask_"] {
    background-image: url(images/task-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

[id*="MnuRequestValidation_"] {
    background-image: url(images/validation-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

[id*="MnuRequestDialog_"] {
    background-image: url(images/dialog-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

[id*="MnuRequestReassignTask_"] {
    background-image: url(images/reassign-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

    [id*="MnuRequestReassignTask_"]:hover {
        background: none;
    }

[id*="MnuRequestReassignValidation_"] {
    background-image: url(images/reassign-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

.TicketAddComment {
    background-image: url(images/ticketedit/BtnTicketEditAddComment-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
    padding-left: 28px;
}

.TicketClassify {
    background-image: url(images/ticketedit/BtnTicketEditClassify-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
    padding-left: 28px;
}

.TicketAskValidation {
    background-image: url(images/ticketedit/BtnTicketEditAskForValidation-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
    padding-left: 28px;
}

.TicketAssignToMe {
    background-image: url(images/ticketedit/BtnTicketEditAssignToMe-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
    padding-left: 28px;
}

.TicketCancelResolution {
    background-image: url(images/ticketedit/BtnTicketEditCancelResolve-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
    padding-left: 28px;
}

.TicketCancelSchedule {
    background-image: url(images/ticketedit/BtnTicketEditCancelSchedule-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
    padding-left: 28px;
}

.TicketCancelValidationRequest {
    background-image: url(images/ticketedit/BtnTicketEditCancelValidation-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
    padding-left: 28px;
}

.TicketControlResolution {
    background-image: url(images/ticketedit/BtnTicketEditControlResolution-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
    padding-left: 28px;
}

.TicketReassign {
    background-image: url(images/ticketedit/BtnTicketEditReassign-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
    padding-left: 28px;
}

.TicketReschedule {
    background-image: url(images/ticketedit/BtnTicketEditReschedule-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
    padding-left: 28px;
}

.TicketResolve {
    background-image: url(images/ticketedit/BtnTicketEditResolve-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
    padding-left: 28px;
}

.TicketResume {
    background-image: url(images/ticketedit/BtnTicketEditResume-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
    padding-left: 28px;
}

.TicketSendEmail {
    background-image: url(images/ticketedit/BtnTicketEditSendEmail-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
    padding-left: 28px;
}

.TicketSchedule {
    background-image: url(images/ticketedit/BtnTicketEditSchedule-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
    padding-left: 28px;
}

.TicketValidation {
    background-image: url(images/ticketedit/BtnTicketEditAskForValidation-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
    padding-left: 28px;
}

.CreatedLinkedTicket {
    background-image: url(images/ticketedit/BtnTicketEditCreateChildTicket-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
    padding-left: 28px;
}

.TabTicketDetails {
    background-image: url(images/tabs/TabTicketDetails-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
    padding-left: 28px;
}

.TabLinkedTickets {
    background-image: url(images/ticketedit/BtnTicketEditCreateChildTicket-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
    padding-left: 28px;
}

.TabTicketCommentHistory {
    background-image: url(images/tabs/TabTicketCommentHistory-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
    padding-left: 28px;
}

.TabTicketHistory {
    background-image: url(images/tabs/TabTicketHistory-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
    padding-left: 28px;
}

.TabTicketActionHistory {
    background-image: url(images/tabs/TabTicketActionHistory-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
    padding-left: 28px;
}

#TicketCommentHistory, #TicketHistory, #TicketActionHistory {
    isolation: isolate;
}

.e-tab.e-js .e-header > .e-active, .e-tab.e-js .e-header > .e-select {
    font-size: 14px;
}

/*.e-tab.e-js > .e-content
{
    color: #4c4c4c;
    margin-bottom: 5px;
}
.e-tab .e-header > .e-select a, .e-tab .e-left > .e-select a, .e-tab .e-right > .e-select a
{
    color: #4c4c4c;
}

.e-tab .e-active-content
{
	padding: 0;
}
*/

/* Accordeon */

.e-acrdn .e-select {
    font-size: 1em;
}

.e-in-wrap {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.e-ddl .e-in-wrap {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.e-numeric .e-in-wrap, .e-percent .e-in-wrap, .e-currency .e-in-wrap, .e-mask .e-in-wrap {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

button.dt-button, div.dt-button, a.dt-button {
    height: 30px;
}

#SRLevels td, #ConsumStock td {
    padding: 0px 2px 0px 2px;
}

.coldeleterow {
    width: 20px;
}

.DashboardAssetSearch, .DashboardContractSearch, .DashboardOperatorSearch {
    margin-top: 5px;
    margin-bottom: 3px;
}

.DashboardLastUpdate {
    float: right;
}

    .DashboardLastUpdate img {
        width: 24px;
        vertical-align: middle;
        cursor: pointer;
    }

.AssetDashboardReport, .ContractDashboardReport, .UserRequestsDashboardReport {
    border: 1px #C0C0C0 solid;
    padding: 0px 10px 5px 5px;
    margin-bottom: 5px;
    min-height: 250px;
}

    .AssetDashboardReport table, .ContractDashboardReport table, .UserRequestsDashboardReport table {
        width: 100%;
    }

.DashboardReporthr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #f1f1f1;
    margin: 2px 0 2px 0;
    padding: 0;
}

.ContractDashboardReport th {
    background-color: var(--primary-color);
}

.inventoryicon {
    width: 48px;
    height: 48px;
}

.tabicon {
    margin: 0px -10px 0 5px;
    width: 24px;
    height: 24px;
    vertical-align: middle;
    padding-right: -5px;
}

.reportplannedicon {
    background-image: url(images/schedule-24.png) !important;
    background-repeat: no-repeat !important;
    height: 26px;
}

.reportactionsicon {
    background-image: url(images/smarttask-24.png) !important;
    background-repeat: no-repeat !important;
    height: 26px;
}

.reportasseticon {
    background-image: url(images/asset-24.png) !important;
    background-repeat: no-repeat !important;
    height: 26px;
}

.reportopenicon {
    background-image: url(images/inprogress-24.png) !important;
    background-repeat: no-repeat !important;
    height: 26px;
}

.reportcloseicon {
    background-image: url(images/closed-24.png) !important;
    background-repeat: no-repeat !important;
    height: 26px;
}

    .reportplannedicon h3, .reportactionsicon h3, .reportasseticon h3, .reportopenicon h3, .reportcloseicon h3 {
        padding-left: 28px;
    }

.OperatorDashboardTableTitle {
    font-size: 1em;
    font-weight: bold;
    padding-left: 28px;
}

.objectlink a {
    text-decoration: none;
    font-weight: bold;
}

    .objectlink a:visited, .objectlink a:active {
        text-decoration: none;
        color: #4c4c4c;
    }

    .objectlink a:link {
        color: #4c4c4c;
    }

.objectlink img {
    height: 24px;
    width: 24px;
    vertical-align: middle;
}

.ticketlink a, .assetlink a {
    text-decoration: none;
    font-weight: bold;
}

    .ticketlink a:visited, .assetlink a:visited, .ticketlink a:active, .assetlink a:active {
        text-decoration: none;
        color: #4c4c4c;
    }

    .ticketlink a:link, .assetlink a:link {
        color: #4c4c4c;
    }

.ticketlink img, .assetlink img {
    height: 24px;
    width: 24px;
    vertical-align: middle;
}

.ChildTicketLink {
    font-style: italic;
}

.ParentTicketLink {
    text-decoration: underline;
}
/*DESIGNER */
#TabProcessStart {
    padding: 0;
    overflow: auto;
}

.e-treeview .e-active {
    background: var(--primary-color-light);
    color: var(--primary-color);
}

.ace_print-margin {
    display: none;
}

#Tabs {
    margin: 0px 5px 0px 5px;
}

#jstreeStart div.jstree-wholerow, #jstreeEnd div.jstree-wholerow {
    height: 32px;
}

#jstreeStart .jstree-anchor, #jstreeEnd .jstree-anchor {
    height: 36px;
}

#jstreeStart.jstree-default, #jstreeStart.jstree-node, #jstreeEnd.jstree-default, #jstreeEnd.jstree-node {
    min-height: 36px;
    line-height: 36px;
    margin-left: 36px;
    min-width: 36px;
}

li#ROOT_0.jstree-node.jstree-open.jstree-last {
    line-height: 36px;
}

#jstreeStart i.jstree-icon.jstree-ocl, #jstreeStart i.jstree-icon.jstree-themeicon.jstree-themeicon-custom, #jstreeEnd i.jstree-icon.jstree-ocl, #jstreeEnd i.jstree-icon.jstree-themeicon.jstree-themeicon-custom {
    line-height: 32px;
    height: 32px;
    width: 32px;
}

ul#DesignerMenu.e-menu.e-js.e-menu-responsive.e-widget.e-box.e-horizontal.e-separator {
    background: #FFF;
}

#navdesigner.div.e-menu-wrap.e-menu-responsive {
    margin-left: 5px;
}

.imgselectseparator {
    color: #333333;
    background-color: #ccc;
    height: 20px;
}

.imgchildselectitem {
    float: left;
}

.imgselectitem {
    float: left;
}

.IconDisplay {
    max-width: 32px;
}

.ImageDisplay {
    max-width: 48px;
}

#ImageSelector_IconUrl .select2-container .select2-selection--single {
    min-height: 120px;
    padding: 3px;
}

#ImageSelector_ImageUrl .select2-container .select2-selection--single {
    min-height: 120px;
    padding: 3px;
}

ul#select2-IconUrl-results.select2-results__options {
    max-height: 330px;
}

ul#select2-ImageUrl-results.select2-results__options {
    max-height: 330px;
}

.imgselectitemtext, .imgchildselectitemtext {
    float: left;
    margin-left: 5px;
}

.DesignerAlertMsg {
    font-weight: normal;
    font-size: 1.0em;
    margin-left: 5px;
}

.scoopvartable tr td {
    border: 1px solid #c8c8c8;
}

.scoopvartable td:hover {
    background-color: #86bcea;
    cursor: pointer;
}

.CodeMirror-line-numbers {
    margin: 0.4em;
}

    .CodeMirror-line-numbers div {
        color: #999;
        min-width: 20px;
        text-align: right;
        background-color: #F7F7F7;
        font-size: 10pt;
        margin: 0;
        padding: 0;
    }

.btnEcaldima, .btnEcaldimaMSL.e-button, .btnScoop, #InlineEditForm_GridMapping_Save, #InlineEditForm_Grid_Save, .btnLogin {
    outline: none;
    background: #A0A0A0;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    color: #FFF;
    padding: 10px 10px 10px 10px;
    min-width: 95px;
    text-decoration: none;
    border: 1px solid #A0A0A0;
    align-items: flex-start;
    text-align: center;
    cursor: pointer;
    box-sizing: border-box;
    box-shadow: rgba(0, 0, 0, 0.3) 0px 2px 4px 0px;
    margin-bottom: 2px;
}

.btnEcaldimaMSL.e-button {
    padding: 5px 10px 5px 10px;
    min-width: 110px;
}

    .btnEcaldimaMSL.e-button .e-icon {
        color: #FFF;
    }

    .btnEcaldima:hover, .btnEcaldimaMSL.e-button:hover, .btnScoop:hover, #InlineEditForm_GridMapping_Save:hover, #InlineEditForm_Grid_Save:hover, .btnLogin:hover {
        outline: none;
        background: #C0C0C0;
        text-decoration: none;
        border-style: none;
        border: 1px solid #A0A0A0;
        box-shadow: none;
    }

.btnEcaldima:visited, .btnEcaldima:link, .btnScoop:link, .btnScoop:visited {
    outline: none;
    text-decoration: none;
    color: #FFF;
}

.btnEcaldimalight, .btnEcaldimaMSLlight.e-button, .btnScoopLight, #InlineEditForm_GridMapping_Cancel, #InlineEditForm_Grid_Cancel {
    outline: none;
    background: #f5f5f5 !important;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    color: #000;
    padding: 10px 10px 10px 10px !important;
    min-width: 95px;
    text-decoration: none;
    border: 1px solid #A0A0A0;
    align-items: flex-start;
    text-align: center;
    cursor: pointer;
    box-sizing: border-box;
    margin-bottom: 2px;
}

.btnEcaldimaMSLlight.e-button {
    padding: 5px 10px 5px 10px;
    min-width: 110px;
    margin-top: 10px;
}

.btnEcaldimaback {
    outline: none;
    background: #fff !important;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    color: #000;
    padding: 10px 20px 10px 20px !important;
    text-decoration: none;
    border: 1px solid #A0A0A0;
    align-items: flex-start;
    text-align: center;
    cursor: pointer;
    box-sizing: border-box;
    margin-bottom: 2px;
}

    .btnEcaldimalight:hover, .btnEcaldimaback:hover, .btnEcaldimaMSLlight.e-button:hover, .btnScoopLight:hover, #InlineEditForm_GridMapping_Cancel:hover, #InlineEditForm_Grid_Cancel:hover {
        outline: none;
        background: #C0C0C0 !important;
        text-decoration: none;
        border-style: none;
        border: 1px solid #A0A0A0;
        box-shadow: rgba(0, 0, 0, 0.3) 0px 2px 4px 0px;
    }

.btnEcaldimalight:visited, .btnEcaldimalight:link, .btnScoopLight:link, .btnScoopLight:visited {
    outline: none;
    text-decoration: none;
    color: #000;
}

.btnRequestNumber {
    outline: none;
    background: #A0A0A0;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    color: #FFF;
    padding: 10px 20px 10px 20px;
    text-decoration: none;
    border: 1px solid #A0A0A0;
    align-items: flex-start;
    text-align: center;
    cursor: pointer;
    box-sizing: border-box;
    box-shadow: rgba(0, 0, 0, 0.3) 0px 2px 4px 0px;
}

.btnapply, .btnsaveandexit, .btnedit, .btngokbcategory, .btngokbtag, .btngokbarticle, .btncreate, .btndefaulttheme, .btnprevioustheme, .btnrefresh {
    background: var(--button-background-color);
    border: 1px solid var(--button-background-color);
    color: var(--button-text-color);
    position: relative;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 5px 10px 5px 24px;
    min-width: 95px;
    text-decoration: none;
    cursor: pointer;
    box-sizing: border-box;
}
.btnsaveacopy, .btncreatereport {
    background: var(--button-background-color-light);
    border: none;
    border-bottom: 2px solid var(--button-background-color);
    color: var(--primary-color);
    position: relative;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 5px 10px 5px 24px;
    min-width: 95px;
    text-decoration: none;
    cursor: pointer;
    box-sizing: border-box;
}
.btnexecutequery {
    background: none;
    border: 2px solid var(--button-background-color);
    color: var(--primary-color);
    position: relative;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 5px 10px 5px 24px;
    min-width: 95px;
    text-decoration: none;
    cursor: pointer;
    box-sizing: border-box;
}

.btnconfigure, .btnrecopyconf, .btnrecopyalltext {
    background: none; /*var(--button-background-color-light);*/
    border: none;
    border: 1px solid var(--button-background-color);
    color: var(--button-text-color-light);
    position: relative;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 5px 10px 5px 24px;
    min-width: 95px;
    text-decoration: none;
    cursor: pointer;
    box-sizing: border-box;
    margin-right: 5px;
    margin-bottom: 5px;
}

.btncancel, .btnclearall, .btngokbhome,.btntest, .btnsearch {
    background: var(--button-background-color-light);
    border: 1px solid var(--button-background-color-light);
    color: var(--button-text-color-light);
    position: relative;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 5px 10px 5px 24px;
    min-width: 95px;
    text-decoration: none;
    cursor: pointer;
    box-sizing: border-box;
}

.btncreate:before {
    position: absolute;
    font-family: 'ej-webfont';
    left: 6px;
    top: 6px;
    content: "\e6fe";
    color: var(--button-text-color);
}

.btnapply:before {
    position: absolute;
    font-family: 'uicons-regular-straight';
    left: 6px;
    top: 6px;
    content: "\e56a";
    color: var(--button-text-color);
}
.btnrefresh:before {
    position: absolute;
    font-family: 'uicons-regular-straight';
    left: 6px;
    top: 6px;
    content: "\ece4";
    color: var(--button-text-color);
}
.btndefaulttheme:before, .btnprevioustheme:before {
    position: absolute;
    font-family: 'uicons-regular-straight';
    left: 6px;
    top: 6px;
    content: "\ecf5";
    color: var(--button-text-color);
}
.btnsaveandexit:before {
    position: absolute;
    font-family: 'uicons-regular-straight';
    left: 6px;
    top: 6px;
    content: "\e704";
    color: var(--button-text-color);
}
.btnsaveacopy:before {
    position: absolute;
    font-family: 'uicons-regular-straight';
    left: 6px;
    top: 6px;
    content: "\e707";
    color: var(--button-text-color-hover);
}
.btnsaveacopy:hover::before {
    color: var(--button-text-color);
}
.btncreatereport:before {
    position: absolute;
    font-family: 'uicons-regular-straight';
    left: 6px;
    top: 6px;
    content: "\e028";
    color: var(--button-text-color-hover);
}
.btncreatereport:hover::before {
    color: var(--button-text-color);
}
.btnexecutequery:before {
    position: absolute;
    font-family: 'uicons-regular-straight';
    left: 6px;
    top: 6px;
    content: "\ee91";
    color: var(--button-text-color-hover);
}
.btnexecutequery:hover::before {
    color: var(--button-text-color);
    background-color: var(--button-background-color);
}
fi-rs-floppy-disk-circle-arrow-right
.btnedit:before {
    position: absolute;
    font-family: 'uicons-regular-rounded';
    left: 6px;
    top: 6px;
    content: "\f1a4";
    color: var(--button-text-color);
}

.btncancel:before {
    position: absolute;
    font-family: 'uicons-regular-rounded';
    left: 6px;
    top: 6px;
    content: "\f11d";
    color: var(--button-text-color);
}
.btnsearch:before {
    position: absolute;
    font-family: 'uicons-regular-straight';
    left: 6px;
    top: 6px;
    content: "\ed83";
    color: var(--button-text-color);
}
.btntest:before {
    position: absolute;
    font-family: 'uicons-regular-rounded';
    left: 6px;
    top: 6px;
    content: "\eb51";
    color: var(--button-text-color);
}

.btnclearall:before {
    position: absolute;
    font-family: 'uicons-regular-rounded';
    left: 6px;
    top: 6px;
    content: "\f13f";
    color: var(--button-text-color);
}

.btngokbcategory:before {
    position: absolute;
    font-family: 'uicons-regular-rounded';
    left: 6px;
    top: 6px;
    content: "\f119";
    color: var(--button-text-color);
}

.btngokbtag:before {
    position: absolute;
    font-family: 'uicons-regular-rounded';
    left: 6px;
    top: 6px;
    content: "\f1e3";
    color: var(--button-text-color);
}

.btngokbarticle:before {
    position: absolute;
    font-family: 'uicons-regular-rounded';
    left: 6px;
    top: 6px;
    content: "\f19c";
    color: var(--button-text-color);
}

.btngokbhome:before {
    position: absolute;
    font-family: 'uicons-regular-rounded';
    left: 6px;
    top: 6px;
    content: "\f1a2";
    color: var(--button-text-color);
}

.btnconfigure:before {
    position: absolute;
    font-family: 'ej-webfont';
    left: 6px;
    top: 6px;
    content: "\e644";
    color: var(--button-text-color-light);
}

.btnrecopyconf:before {
    position: absolute;
    font-family: 'ej-webfont';
    left: 6px;
    top: 6px;
    content: "\e6d1";
    color: var(--button-text-color-light);
}

.btnrecopyalltext:before {
    position: absolute;
    font-family: 'uicons-regular-rounded';
    left: 6px;
    top: 6px;
    content: "\f17e";
    color: var(--button-text-color-light);
}

.btnexpandall {
    background: var(--button-background-color);
    border: 1px solid var(--button-background-color);
    color: var(--button-text-color);
    position: relative;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 5px 5px 5px 5px;
    text-decoration: none;
    cursor: pointer;
    box-sizing: border-box;
}

.btncollapseall {
    background: var(--button-background-color-light);
    border: 1px solid var(--button-background-color-light);
    color: var(--button-text-color-light);
    position: relative;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 5px 5px 5px 5px;
    text-decoration: none;
    cursor: pointer;
    box-sizing: border-box;
}

.btnclearfilter {
    background: #fff;
    border: 1px solid #fff;
    color: #fff;
    position: relative;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 5px 5px 5px 5px;
    text-decoration: none;
    cursor: pointer;
    box-sizing: border-box;
}

.btnexpandall:before {
    font-family: 'ej-webfont';
    content: "\e679";
    color: var(--button-text-color);
}

.btncollapseall:before {
    font-family: 'ej-webfont';
    content: "\e600";
    color: var(--button-text-color);
}

.btnclearfilter:before {
    font-family: 'ej-webfont';
    content: "\e751";
    color: #4c4c4c;
}

.btnapply:hover, .btnsaveandexit:hover, .btnedit:hover, .btngokbcategory:hover, .btngokbtag:hover, .btngokbarticle:hover, .btnexpandall:hover, .btncreate:hover,.btndefaulttheme:hover, .btnprevioustheme:hover, .btnrefresh:hover {
    background: var(--button-background-color-hover);
    border: 1px solid var(--button-background-color-hover);
    color: var(--button-text-color-hover);
}
.btnsaveacopy:hover {
    background: var(--button-background-color);
    border-bottom: 2px solid var(--button-background-color-light);
    color: var(--button-text-color);
}
.btnexecutequery:hover {
    background: var(--button-background-color);
    border: 1px solid var(--button-background-color);
    color: var(--button-text-color);
}
.btncancel:hover, .btnclearall:hover, .btngokbhome:hover, .btnconfigure:hover, .btnrecopyconf:hover, .btnrecopyalltext:hover, .btnclearall:hover, .btncollapseall:hover, .btnclearfilter:hover, .btntest:hover, .btnsearch:hover {
    background: var(--button-background-color-light-hover);
    border: 1px solid var(--button-background-color-light-hover);
    color: var(--button-text-color-light-hover);
}

.btrequestactionedit {
    background-image: url(images/ticketedit/BtnTicketEditClassify-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

.btrequestactioncancel {
    background-image: url(images/cancel-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}
/* OPERATOR DASHBOARD */
.MoveUpButton:before {
    content: "\e7b0";
}

.MoveDownButton:before {
    content: "\e7b1";
}

.CreateTicketButton:before {
    content: "\e69f"
}

.ReCopyButton:before {
    content: "\e6d0";
}

.ReCopyConfButton:before {
    content: "\e6d1";
}

.ConfigureButton:before {
    content: "\e644";
}

.RefreshButton:before {
    content: "\e808"
}

.CreateButton:before {
    content: "\e676";
}

.EditButton:before {
    content: "\e653";
}

.DeleteButton:before {
    content: "\e681";
}

.CloneButton:before {
    content: url('images/copy.png');
}

.AssignToMeButton:before {
    content: url('images/operatordashboard/BtnGridAssignToMe-16.png');
}

.ReassignButton:before {
    content: url('images/operatordashboard/BtnGridReassign-16.png');
}

.ResolveButton:before {
    content: url('images/operatordashboard/BtnGridResolve-16.png');
}

.PriorityButton:before {
    content: url('images/operatordashboard/BtnGridPriority-16.png');
}

.LinkParentButton:before {
    content: url('images/operatordashboard/BtnGridLinkToParent-16.png');
}

.ScheduleButton:before {
    content: url('images/operatordashboard/BtnGridSchedule-16.png');
}

#tableDiv_OperatorDashBoard_LinkParentButton, #tableDiv_OperatorDashBoard_PriorityButton, #tableDiv_OperatorDashBoard_ResolveButton, #tableDiv_OperatorDashBoard_ReassignButton, #tableDiv_OperatorDashBoard_AssignToMeButton, #tableDiv_OperatorDashBoard_ScheduleButton, .BtnSelectGridNoSLA:link, .BtnSelectGridNoSLA:visited, .BtnSelectGridSLAWarn:link, .BtnSelectGridSLAWarn:visited, .BtnSelectGridSLALate, .BtnSelectGridSLALate:link, .BtnSelectGridSLALate:visited, .BtnSelectGrid:link, .BtnSelectGrid:visited {
    padding: 5px 5px 5px 5px;
    margin: 5px 5px 5px 0px;
    outline: none;
    background: #f7f7f7;
    color: #4c4c4c;
    text-align: center;
    cursor: pointer;
    font-weight: 600;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none;
}

    #tableDiv_OperatorDashBoard_LinkParentButton:hover, #tableDiv_OperatorDashBoard_PriorityButton:hover, #tableDiv_OperatorDashBoard_ResolveButton:hover, #tableDiv_OperatorDashBoard_ReassignButton:hover, #tableDiv_OperatorDashBoard_AssignToMeButton:hover, #tableDiv_OperatorDashBoard_ScheduleButton:hover, .BtnSelectGridNoSLA:hover, .BtnSelectGridSLAWarn:hover, .BtnSelectGridSLALate:hover, .BtnSelectGrid:hover {
        outline: none;
        text-decoration: none;
        background: #4c4c4c;
        color: #f7f7f7;
    }

.BtnSelectGridSLAWarn, .BtnSelectGridSLAWarn:link, .BtnSelectGridSLAWarn:visited {
    padding: 5px 5px 5px 15px;
    background-image: url('images/operatordashboard/priorityid300.png') !important;
    vertical-align: middle;
    text-align: center !important;
    background-repeat: no-repeat !important;
    background-position: left top !important;
}

.BtnSelectGridSLALate, .BtnSelectGridSLALate:link, .BtnSelectGridSLALate:visited {
    padding: 5px 5px 5px 15px;
    background-image: url('images/operatordashboard/priorityid400.png') !important;
    vertical-align: middle;
    text-align: center !important;
    background-repeat: no-repeat !important;
    background-position: left top !important;
}

.TitleSLAWarn {
    padding: 5px 5px 5px 15px;
    background-image: url('images/operatordashboard/TicketTitleSLAWarn-24.png') !important;
    vertical-align: middle;
    background-repeat: no-repeat !important;
    background-position: left top !important;
}

.TitleSLALate {
    padding: 5px 5px 5px 15px;
    background-image: url('images/operatordashboard/TicketTitleSLALate-24.png') !important;
    vertical-align: middle;
    background-repeat: no-repeat !important;
    background-position: left top !important;
}

.e-grid .e-horizontallines .e-rowcell {
    border-top: 1px solid #f9f9f9;
}

.e-grid {
    border: none;
}

    .e-grid .e-pager {
        background: none;
    }

    .e-grid .e-toolbar.e-toolbarspan {
        background: none;
    }

    .e-grid td.e-active {
        background: #c1c1c1;
        color: #4c4c4c;
    }

    .e-grid .e-searchinputdiv {
        overflow: auto !important;
        margin-right: 10px !important;
    }

    .e-grid .e-inlineformedit .e-editform-btn {
        margin-top: 5px;
    }

.e-treegrid .e-treegridadaptivetoolbar {
    height: 46px !important;
}

.e-treegrid {
    border: none !important;
}

    .e-treegrid .e-pager {
        background: none;
    }

    .e-treegrid .e-toolbar.e-toolbarspan {
        background: none;
    }

    .e-treegrid td.e-active {
        background: #c1c1c1;
        color: #4c4c4c;
    }

.e-pager {
    border-top: 1px solid #000
}

#DepGrid_EditButton a {
    margin-top: 5px;
}

#DepGrid_search > div > input::placeholder {
    display: none;
}

#DepGride-gridheader, #DepGrid_toolbarItems, .e-treegrid .e-rowcell, #DepGride-gridcontent {
    border-left: none !important;
    border-right: none !important;
}

#DepGridPager {
    border: none;
}

#DepGride-gridcontent {
    border-bottom: none;
}

.ace_editor * {
    font-family: Monaco, Menlo, "Ubuntu Mono", Consolas, source-code-pro, monospace !important;
    font-size: 12px !important
}

.e-pager div.e-drpdwndiv {
    width: 80px;
}

.designerselectorajaxtoolbar {
    display: flex;
    align-items: center;
    width: 100%;
    border-collapse: collapse;
    height: 26px;
    border-top: 1px solid #c8c8c8;
    border-bottom: 1px solid #c8c8c8;
}

    .designerselectorajaxtoolbar a {
        display: inline-block;
        height: 26px;
        line-height: 26px;
        width: 26px;
    }

        .designerselectorajaxtoolbar a:hover {
            background: var(--primary-color-light);
            color: var(--primary-color);
        }

#tableDiv_OperatorDashBoard.e-grid td.e-active {
    background-color: #f3f3f3 !important;
    color: #4c4c4c !important;
}

#tableDiv_OperatorDashBoard.e-grid tr.e-hover, #GridMapping > div.e-gridcontent > div > table > tbody > tr.e-hover, #GridEventSort > div.e-gridcontent > div > table > tbody > tr.e-hover, #GridLookup > div.e-gridcontent > div > table > tbody > tr.e-hover, #Grid > div.e-gridcontent > div > table > tbody > tr.e-hover {
    background: #f6f6f6;
    color: #4c4c4c;
}

[id*="tableDiv_"].e-grid tr.e-hover {
    background: #f6f6f6;
    color: #4c4c4c;
}
.objectlinkecaldima a {
    color: #4c4c4c;
    margin: 0 !important;
    vertical-align: middle;
    text-align: center;
    display: table-cell;
    text-decoration: underline;
}
.objectlinkecaldima {
    padding-left: 10px;
  }
#tableDiv_OperatorDashBoard_AssignToMeButton {
    display: none;
}

#tableDiv_OperatorDashBoard_ReassignButton {
    display: none;
}

#tableDiv_OperatorDashBoard_PriorityButton {
    display: none;
}

#tableDiv_OperatorDashBoard_LinkParentButton {
    display: none;
}

#tableDiv_OperatorDashBoard_ResolveButton {
    display: none;
}

#tableDiv_OperatorDashBoard_ScheduleButton {
    display: none;
}

[class*="StatusId"] {
    color: #4c4c4c;
    background-size: 16px 16px !important;
    background-repeat: no-repeat !important;
    background-position: left top !important;
    text-align: center !important;
}

[class*="StatusId1"] {
    background-image: url('images/operatordashboard/statusnew-24.png') !important;
}

[class*="StatusId2"] {
    background-image: url('images/operatordashboard/statusopen-24.png') !important;
}

[class*="StatusId3"] {
    background-image: url('images/operatordashboard/statusplanned-24.png') !important;
}

[class*="StatusId4"] {
    background-image: url('images/operatordashboard/statusonhold-24.png') !important;
}

[class*="StatusId45"] {
    background-image: url('images/operatordashboard/statuswaitingvalidation-24.png') !important;
}

[class*="PriorityId"] {
    color: #4c4c4c;
    padding: 5px;
    vertical-align: middle;
    text-align: center !important;
    background-repeat: no-repeat !important;
    background-position: left top !important;
}

.PriorityId100 {
    color: #4c4c4c;
}

.PriorityId200 {
    background-image: url('images/operatordashboard/priorityid200.png') !important;
}

.PriorityId300 {
    background-image: url('images/operatordashboard/priorityid300.png') !important;
    font-weight: bold !important;
}

.PriorityId400 {
    background-image: url('images/operatordashboard/priorityid400.png') !important;
    color: #FF0000 !important;
    font-weight: bold !important;
}

td.ParentRow {
    font-weight: bold !important;
    background-image: url('images/operatordashboard/ParentRow-24.png') !important;
    background-repeat: no-repeat !important;
    background-position: left top !important;
    background-size: 16px 16px !important;
}

td.ChildRow {
    font-style: italic !important;
    background-image: url('images/operatordashboard/ChildRow-24.png') !important;
    background-repeat: no-repeat !important;
    background-position: left top !important;
    background-size: 16px 16px !important;
}

.cellTicketTitle {
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 600px;
}

.ui-dialog.OperatorDashboardDialog {
    font-size: 1.0em;
}

.cellTicketTitleLastUpdatedByOther {
    font-weight: bold;
}

.ui-dialog .ui-dialog-buttonpane {
    text-align: center;
}

    .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
        float: none;
    }

.DesignerIndexBlock {
    border: none;
    padding: 0 2px 5px 2px;
    margin: 0 5px 5px 0;
    white-space: nowrap;
}

    .DesignerIndexBlock ul {
        padding: 0;
    }

    .DesignerIndexBlock .sortable {
        width: 100%;
    }

        .DesignerIndexBlock .sortable li {
            width: 98%;
            border: none;
            border-bottom-left-radius: 5px;
            border-bottom-right-radius: 5px;
            border-top-left-radius: 5px;
            border-top-right-radius: 5px;
            box-shadow: rgba(0, 0, 0, 0.15) 0px 1px 2px 0px;
            box-sizing: border-box;
            margin-bottom: 10px;
            margin-left: 3px;
            margin-right: 3px;
            margin-top: 5px;
        }

            .DesignerIndexBlock .sortable li:hover, .DesignerServiceBlock:hover, .DesignerArticleBlock:hover {
                box-shadow: rgba(0, 0, 0, 0.15) 0px 5px 10px 0px;
                background: #FFF;
            }

.CategoryDescription {
    white-space: normal;
}

.DesignerIndexBlock table.dataTable tbody td, .DesignerServiceBlock, .DesignerServiceFieldBlock, .DesignerArticleFieldBlock {
    display: block;
    margin-top: 5px;
    padding: 5px;
    outline: 0;
    border: 1px solid #f6f6f6;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    box-shadow: rgba(0, 0, 0, 0.15) 0px 1px 2px 0px;
    box-sizing: border-box;
    margin-bottom: 10px;
    margin-left: 3px;
    margin-right: 3px;
    margin-top: 5px;
}

.DesignerServiceBlock {
    margin-left: 40px;
}

.DesignerArticleBlock {
    display: block;
    margin-top: 5px;
    padding: 5px;
    outline: 0;
    border: none;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    box-shadow: rgba(0, 0, 0, 0.15) 0px 1px 2px 0px;
    box-sizing: border-box;
    margin-bottom: 10px;
    margin-right: 3px;
    margin-top: 5px;
    margin-left: 94px;
}

.DesignerToolbar {
    background: transparent;
    width: 55px;
    text-align: left;
    margin-right: 2px;
    float: right;
}

    .DesignerToolbar img {
        width: 16px;
        height: 16px;
        cursor: pointer;
        opacity: 0.80;
    }

.DesignerServiceFieldBlock {
    margin-left: 94px;
}

.DesignerArticleFieldBlock {
    margin-left: 106px;
}

.DesignerIndexBlock table thead th {
    background-color: transparent;
}

.DesignerIndexBlock table.dataTable thead th, .DesignerIndexBlock table.dataTable thead td, .DesignerIndexBlock table {
    border: none;
}

.Designerindexcategoryblock {
    padding: 5px;
}

.Designerimgcategoryindex {
    max-width: 90px;
}

    .Designerimgcategoryindex img {
        border: none;
        margin-left: 5px;
    }

.Designerimgserviceindex, .Designerimgcategoryindex, .Designerimgserviceindex, .Designerimgarticleindex {
    float: left;
    padding-right: 5px;
}

    .Designerimgserviceindex img, .Designerimgarticleindex img {
        max-height: 52px;
        max-width: 52px;
        vertical-align: top;
    }

    .Designerimgcategoryindex a, .Designerimgserviceindex a, .Designerimgarticleindex a {
        outline: 0;
        text-decoration: none;
        color: #5e5e5e;
    }

        .Designerimgcategoryindex a:link, .Designerimgserviceindex a:link, .Designerimgarticleindex a:link {
            text-decoration: none;
        }

        .Designerimgcategoryindex a:hover, .Designerimgserviceindex a:hover, .Designerimgarticleindex a:hover {
            text-decoration: none;
            color: black;
        }

.DesignerCategoryTxtIndex, .DesignerServiceTxtIndex, .DesignerArticleTxtIndex, .DesignerSericeFieldTxtIndex, .DesignerArticleFieldTxtIndex {
    float: left;
}

.DesignerCategoryTitleIndex, .DesignerServiceTitleIndex, .DesignerArticleTitleIndex, .DesignerServiceFieldTitleIndex, .DesignerArticleFieldTitleIndex {
    float: left;
    text-decoration: none;
    vertical-align: Top;
    font-size: medium;
    text-align: left;
    color: #5e5e5e;
    font-weight: bolder;
}

    .DesignerCategoryTitleIndex a, .DesignerServiceTitleIndex a, .DesignerArticleTitleIndex a, .DesignerServiceFieldTitleIndex a, .DesignerArticleFieldTitleIndex a {
        text-decoration: none;
        color: #5e5e5e;
    }

.DesignerCategoryTxtIndex a, .DesignerServiceTxtIndex a, .DesignerArticleTxtIndex a, .DesignerSericeFieldTxtIndex a, .DesignerArticleFieldTxtIndex a {
    outline: 0;
    text-decoration: none;
    color: #5e5e5e;
}

.DesignerArticleFieldTxtIndex, .DesignerSericeFieldTxtIndex {
    vertical-align: Top;
    font-size: medium;
    text-align: left;
}

.DesignerObjectsCount {
    float: right;
    display: table;
}

.DesignerObjectsCountimg {
    display: table-cell;
    width: 36px;
    vertical-align: middle;
    float: left;
    padding: 2px;
}

.DesignerObjectsCounttxt {
    display: table-cell;
    width: 100px;
    vertical-align: middle;
    float: left;
    padding: 2px;
}

.DesignerSortImg {
    vertical-align: middle;
    max-width: 32px;
}

.DesignerColId {
    width: 30px;
}

.DesignerIndexBlock li, .DesignerIndexBlock li:hover {
    background: #fff;
}

#TestQueryResult {
    margin-top: 10px;
    max-height: 200px;
    overflow-x: scroll;
}

#editorText {
    width: 100%;
    height: 200px;
}

#editorStyle {
    width: 100%;
    height: 200px;
}
/*User request page */
.UserRequestsBlock table.dataTable tbody td, .myopenticketarticle, .myClosedTicketarticle {
    display: block;
    margin-bottom: 5px;
    padding: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid var(--primary-color);
    outline: 0;
}

table.dataTable.no-footer {
    border-bottom: none;
}

.UserRequestsBlock {
    border: none;
    padding: 0 2px 5px 2px;
    margin: 0 5px 5px 0;
    white-space: nowrap;
}

    .UserRequestsBlock .ticketlink {
        float: left;
        padding-right: 5px;
    }

    .UserRequestsBlock table thead th {
        background-color: transparent;
    }

    .UserRequestsBlock table.dataTable thead th, .UserRequestsBlock table.dataTable thead td, .UserRequestsBlock table {
        border: none;
    }

.imgindex, .txtindex, .imgarticleindex, .imageserviceindex {
    float: left;
}

.imgarticleindex, .imageserviceindex {
    padding-left: 52px;
}

.indexrequestid {
    vertical-align: Top;
    font-size: medium;
    text-align: left;
    color: #5e5e5e;
    font-weight: bolder;
}

.imgarticleindex img, .imageserviceindex img {
    max-height: 32px;
    max-width: 32px;
    vertical-align: top;
}

.imgindex img {
    max-height: 52px;
    max-width: 52px;
    vertical-align: top;
    border: 2px solid var(--primary-color);
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.imgindex a, .txtindex a {
    outline: 0;
    text-decoration: none;
    color: #5e5e5e;
}

    .imgindex a:link, .MainPageCategoryTitle a:visited, .MainPageCategoryTitle a:active {
        text-decoration: none;
    }

    .imgindex a:hover {
        text-decoration: none;
        color: black;
    }

.txtindex {
    padding-left: 5px;
}

.indexstatus {
    float: right;
    display: table;
}

.indexstatusimg {
    display: table-cell;
    width: 36px;
    vertical-align: middle;
    float: left;
    padding: 2px;
}

.indexstatustxt {
    display: table-cell;
    width: 155px;
    vertical-align: middle;
    float: left;
    padding: 2px;
}

.indexarticlestatustxt {
    display: table-cell;
    width: 150px;
    vertical-align: middle;
    float: left;
    padding: 2px;
}

.indexarticletitle, .indexservicetitle {
    padding-left: 5px;
    float: left;
}

.plusminusbutton {
    float: right;
    margin: 10px;
}

/* End User Request Page */
#BoxLabelComment {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    border: 2px #ddd solid;
    padding: 0px 2px 10px 2px;
    min-height: 5%;
    margin-bottom: 5px;
}

.editickethr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #f1f1f1;
    margin: 1em 0;
    padding: 0;
}
/* PARENT */
#ParentTicketLine {
    float: left;
    padding: 5px 15px 10px 5px;
}

    #ParentTicketLine span {
        padding-left: 12px;
    }

.parentticket {
    background-image: url(images/operatordashboard/ParentRow-24.png) !important;
    background-repeat: no-repeat !important;
}
/* SLA */
#ShowSLA {
    margin-bottom: 5px;
    background: #fcfcfc;
    color: #333;
    font-weight: bold;
    list-style: none;
    list-style-position: outside;
}

#SLAResponseLine, #SLAResolutionLine {
    float: left;
    padding: 5px 15px 10px 5px;
}

    #SLAResponseLine span, #SLAResolutionLine span {
        padding-left: 25px;
    }

.SLAInfo {
    line-height: 28px;
}

.sla-notstarted {
    background-image: url(images/sla-notstarted.png);
    background-repeat: no-repeat !important;
}

.sla-green-running {
    background-image: url(images/sla-green-running.png);
    background-repeat: no-repeat !important;
}

.sla-green-pause {
    background-image: url(images/sla-green-pause.png);
    background-repeat: no-repeat !important;
}

.sla-green-stopped {
    background-image: url(images/sla-green-stopped.png);
    background-repeat: no-repeat !important;
}

.sla-yellow-running {
    background-image: url(images/sla-yellow-running.png);
    background-repeat: no-repeat !important;
}

.sla-yellow-pause {
    background-image: url(images/sla-yellow-pause.png);
    background-repeat: no-repeat !important;
}

.sla-yellow-stopped {
    background-image: url(images/sla-yellow-stopped.png);
    background-repeat: no-repeat !important;
}

.sla-red-running {
    background-image: url(images/sla-red-running.png);
    background-repeat: no-repeat !important;
}

.sla-red-pause {
    background-image: url(images/sla-red-pause.png);
    background-repeat: no-repeat !important;
}

.sla-red-stopped {
    background-image: url(images/sla-red-stopped.png);
    background-repeat: no-repeat !important;
}

.colstatustblock {
    margin-bottom: 5px;
    float: left;
    padding: 0 5px 0 5px;
}

.slastatusblock {
    width: 100px;
    height: 100px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    display: table;
    margin-right: 5px;
}

.slastatusblockrow {
    display: table-row;
}

.slastatusblockcelltop {
    display: table-cell;
    vertical-align: top;
    text-align: center;
    padding: 0 2px 0 2px;
    height: 50px;
}

.slastatusblockcellbottom {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    padding: 0 2px 0 2px;
    font-size: 35px;
    height: 50px;
}

.slastatusblocktitleorange {
    font-weight: bold;
}

.slastatusblocktitlered {
    font-weight: bold;
    color: #000;
}

.slastatusblockslatypeorange {
    white-space: pre-wrap;
}

.slastatusblockslatypered {
    color: #000;
    white-space: pre-wrap;
}

.slastatusblockorange {
    background: #FBA026;
}

.slastatusblockred {
    background: #B8312F;
}

.slastatusblockorange0 {
    background: #c0c0c0;
}

.slastatusblockred0 {
    background: #c0c0c0;
}

/* PRIORITY BLOCKS */

.colpriorityblock {
    margin-bottom: 5px;
    float: left;
    padding: 0 5px 0 5px;
}

.priorityblock {
    width: 100px;
    height: 100px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    display: table;
    margin-right: 5px;
}

.priorityblockrow {
    display: table-row;
}

.priorityblockcelltop {
    display: table-cell;
    vertical-align: top;
    text-align: center;
    padding: 0 2px 0 2px;
    height: 50px;
}

.priorityblockcellbottom {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    padding: 0 2px 0 2px;
    font-size: 35px;
    height: 50px;
}

.priorityblocktitlelow {
    font-weight: inherit;
}

.priorityblocktitlemedium {
    font-weight: inherit;
}

.priorityblocktitlehigh {
    font-weight: bold;
}

.priorityblocktitlecritical {
    font-weight: bold;
}

.priorityblocklow {
    background: #3D8EB9;
}

.priorityblockmedium {
    background: #61BD6D;
}

.priorityblockhigh {
    background: #FBA026;
}

.priorityblockcritical {
    background: #B8312F;
}

.priorityblocklow0 {
    background: #c0c0c0;
}

.priorityblockmedium0 {
    background: #c0c0c0;
}

.priorityblockhigh0 {
    background: #c0c0c0;
}

.priorityblockcritical0 {
    background: #c0c0c0;
}

.dashboardblocktitle {
    font-size: 1em;
    text-align: left;
    font-weight: bold;
    height: 25px;
}

#assetactionbuttons {
    display: none;
}

.loginform {
    margin: 30px 30px 5px 30px;
    padding: 5px 0 5px 0;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 300px;
    border: none;
}

.LayoutLogin {
    background: #fff;
}

.logintitle {
    display: block;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 10px;
}

.login-label {
    font-size: 1.2em;
    height: 20px;
}

.login-field {
    margin: 0 0 0.5em 0;
    vertical-align: middle;
    width: 95%;
}

    .login-field input[type="text"], .login-field input[type="password"] {
        height: 30px;
        border: 1px solid var(--primary-color);
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
    }

    .login-field a, .login-field a:visited {
        text-decoration: none;
        font-size: 1.2m;
        font-weight: bold;
        color: var(--primary-color);
    }

.btnLogin-field {
    margin: 0 0 0.5em 10px;
    height: 35px;
    vertical-align: middle;
    width: 95%;
}

/* RequestView */
.RequestBlock {
    white-space: nowrap;
    background-color: rgb(255, 255, 255);
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    box-shadow: rgba(0, 0, 0, 0.15) 0px 1px 2px 0px;
    box-sizing: border-box;
    color: rgb(92, 93, 90);
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    margin-bottom: 10px;
    margin-left: 3px;
    margin-right: 3px;
    margin-top: 5px;
    text-indent: 0px;
    transition-delay: 0s;
    transition-duration: 0.1s;
    transition-property: all;
    transition-timing-function: ease-in-out;
    -webkit-font-smoothing: antialiased;
    border: none;
    padding: 10px;
}

.RequestViewImg {
    vertical-align: middle;
    text-decoration: none;
    border: 2px solid var(--primary-color);
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.RequestViewServiceTitle {
    vertical-align: Top;
    padding-top: 4px;
    font-size: x-large;
    text-align: left;
    color: #5e5e5e;
}

.RequestViewArticleTitle {
    vertical-align: Top;
    padding-top: 4px;
    padding-bottom: 4px;
    font-size: large;
    text-align: left;
    color: #5e5e5e;
}

.RequestViewScheduledTitle {
    font-style: italic;
    font-weight: 600;
    padding: 0px 10px 0px 36px !important;
}

.RequestViewHoldTitle {
    font-style: italic;
    font-weight: 600;
    padding: 0px 10px 0px 36px !important;
}

.RequestViewInProgressTitle {
    font-weight: 600;
    padding: 0px 10px 0px 36px !important;
}

.RequestViewEmptyLine {
    line-height: 18px;
}

.RequestViewTaskTitle {
    background-repeat: no-repeat !important;
    background-position: 2% center !important;
    background-color: #fff !important;
    padding: 10px 10px 10px 0px !important;
    font-weight: 600;
}

.RequestViewTaskTitleScheduled {
    background-image: url(images/TaskSchedule-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 2% center !important;
    background-color: #fff !important;
    padding: 10px 10px 10px 36px !important;
    font-style: italic;
}

.RequestViewTaskTitleHold {
    background-image: url(images/TaskHold-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 2% center !important;
    background-color: #fff !important;
    padding: 10px 10px 10px 36px !important;
    font-style: italic;
}

.RequestViewTaskTitleInProgress {
    background-image: url(images/TaskRunning-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 2% center !important;
    background-color: #fff !important;
    padding: 10px 10px 10px 36px !important;
}

.RequestViewValidationTitleInProgress {
    background-image: url(images/ticketedit/BtnTicketEditAskForValidation-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 2% center !important;
    background-color: #fff !important;
    cursor: auto !important;
    padding: 10px 10px 10px 36px !important;
}

.RequestViewAutomatedtaskTitleInProgress {
    background-image: url(images/automatedtask-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 2% center !important;
    background-color: #fff !important;
    cursor: auto !important;
    padding: 10px 10px 10px 36px !important;
}

.requestaction:hover, .Myrequestaction:hover {
    background: rgba(94, 50, 114,0.2);
}

.requestaction {
    margin: 0 0 0 0;
    padding: 0 0 0 35px;
    vertical-align: middle;
    font-size: 1.2em;
    font-weight: bold;
    color: #5e5e5e;
    border-style: none;
    cursor: pointer;
}

.requestaction {
    display: inline-block;
    background-color: #fff;
    padding: 10px 10px 10px 36px;
    margin: 5px;
    background: #fcfcfc;
    color: #4c4c4c;
    text-align: center;
    font-weight: 600;
}

.ActionBlock {
    min-height: 150px;
}

.RequestActionBlock {
    border: 1px solid #ddd;
    padding: 0 2px 5px 2px;
    margin: 0 0 5px 0;
    white-space: normal;
}

.Myrequestaction {
    margin: 0 0 0 0;
    padding: 0 0 0 35px;
    vertical-align: middle;
    font-size: 1.2em;
    color: #5e5e5e;
    border-style: none;
    cursor: pointer;
}

.requestdisplayaction {
    margin: 0 0 0 0;
    padding: 0 0 0 28px;
    vertical-align: middle;
    font-size: 1.2em;
    color: #5e5e5e;
    border-style: none;
    font-style: italic;
}

.requestaction a, .requestaction a:visited, .requestaction a:active, .requestaction a:link, .Myrequestaction a, .Myrequestaction a:visited, .Myrequestaction a:active, .Myrequestaction a:link {
    text-decoration: none;
    color: #5e5e5e;
    outline: 0;
    font-weight: normal;
}

.assignment-display-field {
    margin: 0;
    white-space: normal;
    padding-left: 65px;
    font-style: italic;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: var(--primary-color-light);
    color: var(--primary-color);
}

.headerCell {
    float: left;
    border: none;
    border-bottom: 1px solid #ddd;
    padding: 3px;
    width: 50%;
    box-sizing: border-box;
}

.headerCelldata {
    float: left;
    border: none;
    border-bottom: 1px solid #ddd;
    padding: 3px;
    width: 50%;
    box-sizing: border-box;
    background-color: #f8f8f8;
}

.headerCell2 {
    float: left;
    border-bottom: 1px solid #ddd;
    padding: 3px;
    width: 100%;
    box-sizing: border-box;
    text-align: left;
    background-color: #f8f8f8;
}

.Block {
    padding: 0 2px 5px 2px;
    margin: 0 0 0 0;
    white-space: normal;
}

.headerBlockTitle {
    width: 100%;
    font-weight: 600;
}

.e-excelfilter.e-dlgcontainer {
    background: #FFFFFF;
}

footer {
    background: none;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 0;
    text-align: center;
    margin-bottom: 5px;
    display: block;
    box-sizing: border-box;
}

    footer > div {
        background: none !important;
    }

.loginheader {
    border: none;
    background: linear-gradient(#a9fbb4, #ffffff);
    width: 100%;
    margin: 0;
    box-sizing: border-box;
}

.pageheader {
    background: #FFF;
}

.pagetitle {
    /*box-shadow: rgba(0, 0, 0, 0.3) 0px 2px 4px 0px;*/
    background: #FFF;
    display: block;
    /*margin-bottom: 10px;*/
    margin-top: 0px;
    font-size: 1.2em;
    /*font-weight: bold;*/
    color: #5e5e5e;
    border-top-left-radius: 5px;
}

.pagetitleindex {
    background: #FFF;
    display: block;
    margin: 0;
    font-size: 1.2em;
    font-weight: bold;
    color: #5e5e5e;
    border-top-left-radius: 5px;
}

.pagetitleedit {
    background: #FFF;
    margin: 0;
    font-size: 1.2em;
    font-weight: bold;
    color: #5e5e5e;
    border-top-left-radius: 5px;
    padding-left: 5px;
    position: sticky;
    position: -webkit-sticky;
    display: flex;
    top: 0px;
}

    .pagetitleedit > .divtitle, .pagetitleindex > .divtitle {
        height: 40px;
        list-style: none;
        display: flex;
        align-items: center;
    }

    .pagetitleedit > .divbuttons {
        margin-left: auto;
        padding: 5px 20px 0px 0px;
    }

#texttitle > a {
    font-weight: bold;
    color: var(--primary-color);
}

    #texttitle > a:visited {
        font-weight: bold;
        color: var(--primary-color);
    }

#Description_toolbar {
    background: #ececec;
}

.sticky {
    position: fixed;
    top: 0;
    width: 100%
}

.stickynav {
    box-shadow: rgba(0, 0, 0, 0.3) 0px 2px 4px 0px;
}
/* Add some top padding to the page content to prevent sudden quick movement (as the header gets a new position at the top of the page (position:fixed and top:0) */
.sticky + .content {
    padding-top: 102px;
}

#fixedheader {
    z-index: 10000;
    background: #FFFFFF;
}

.pagewrap {
    padding: 5px 10px 10px 10px;
    background: #FFF;
}

.pagewrapdashboards {
    padding: 0px 5px 10px 5px;
    background: #FFF;
}

.requestviewpagewrap {
    padding: 10px;
    background: #F6F7F9;
}
.box {
    align-items: stretch;
    background-color: rgb(255 254 254);
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    box-shadow: rgba(0, 0, 0, 0.15) 4px 2px 4px 2px;
    box-sizing: border-box;
    color: rgb(92, 93, 90);
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    margin-bottom: 10px;
    margin-left: 3px;
    margin-right: 3px;
    margin-top: 5px;
    text-indent: 0px;
    transition-delay: 0s;
    transition-duration: 0.1s;
    transition-property: all;
    transition-timing-function: ease-in-out;
    width: 250px;
    -webkit-font-smoothing: antialiased;
    position: absolute;
    border: none;
    padding: 5px;
}

.boxPopup {
    align-items: center;
    background-attachment: scroll;
    background-clip: border-box;
    background-color: rgb(255, 255, 255);
    background-image: none;
    background-origin: padding-box;
    background-position-x: 0%;
    background-position-y: 0%;
    background-size: auto;
    border-bottom-color: rgb(235, 235, 235);
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    bottom: auto;
    box-shadow: rgba(0, 0, 0, 0.3) 0px 2px 4px 0px;
    box-sizing: border-box;
    color: rgb(92, 93, 90);
    display: none;
    flex-direction: column;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: auto;
    pointer-events: fill;
    right: auto;
    text-indent: 0px;
    visibility: visible;
    -webkit-font-smoothing: antialiased;
}

.boxcategory {
    align-items: stretch;
    background-color: rgb(255, 255, 255);
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    box-shadow: rgba(0, 0, 0, 0.15) 0px 1px 2px 0px;
    flex-direction: column;
    flex-wrap: nowrap;
    margin-bottom: 10px;
    margin-left: 3px;
    margin-right: 3px;
    margin-top: 5px;
    text-indent: 0px;
    transition-delay: 0s;
    transition-duration: 0.1s;
    transition-property: all;
    transition-timing-function: ease-in-out;
    width: 98%;
    -webkit-font-smoothing: antialiased;
    position: absolute;
    border: none;
    padding: 5px;
    font-weight: 500;
    font-size: 1.2em;
    cursor: pointer;
    color: rgb(92, 93, 90);
}
.boxsoftware {
    align-items: stretch;
    background-color: rgb(255, 255, 255);
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    box-shadow: rgba(0, 0, 0, 0.15) 0px 1px 2px 0px;
    box-sizing: border-box;
    color: rgb(92, 93, 90);
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    height: 130px;
    margin-bottom: 10px;
    margin-left: 3px;
    margin-right: 3px;
    margin-top: 5px;
    text-indent: 0px;
    transition-delay: 0s;
    transition-duration: 0.1s;
    transition-property: all;
    transition-timing-function: ease-in-out;
    width: 300px;
    -webkit-font-smoothing: antialiased;
    position: absolute;
    border: none;
    padding: 5px;
    cursor: pointer;
}

.boxmyactions {
    align-items: stretch;
    background-color: rgb(255, 255, 255);
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    box-shadow: rgba(0, 0, 0, 0.15) 0px 1px 2px 0px;
    box-sizing: border-box;
    color: rgb(92, 93, 90);
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    margin-bottom: 10px;
    margin-left: 3px;
    margin-right: 3px;
    margin-top: 5px;
    text-indent: 0px;
    transition-delay: 0s;
    transition-duration: 0.1s;
    transition-property: all;
    transition-timing-function: ease-in-out;
    width: 400px;
    -webkit-font-smoothing: antialiased;
    position: absolute;
    border: none;
    padding: 5px;
    height: 270px;
}

.boxmyrequests, .boxdraftortemplate {
    align-items: stretch;
    background-color: rgb(255, 255, 255);
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    box-shadow: rgba(0, 0, 0, 0.15) 0px 1px 2px 0px;
    box-sizing: border-box;
    color: rgb(92, 93, 90);
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    margin-bottom: 10px;
    margin-left: 3px;
    margin-right: 3px;
    margin-top: 5px;
    text-indent: 0px;
    transition-delay: 0s;
    transition-duration: 0.1s;
    transition-property: all;
    transition-timing-function: ease-in-out;
    width: 300px;
    -webkit-font-smoothing: antialiased;
    position: absolute;
    border: none;
    padding: 5px;
    cursor: pointer;
}

.boxmyhystory {
    align-items: stretch;
    background-color: rgb(255, 255, 255);
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    box-shadow: rgba(0, 0, 0, 0.15) 0px 1px 2px 0px;
    box-sizing: border-box;
    color: rgb(92, 93, 90);
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    margin-bottom: 10px;
    margin-left: 3px;
    margin-right: 3px;
    margin-top: 5px;
    text-indent: 0px;
    transition-delay: 0s;
    transition-duration: 0.1s;
    transition-property: all;
    transition-timing-function: ease-in-out;
    width: 300px;
    -webkit-font-smoothing: antialiased;
    position: absolute;
    border: none;
    padding: 5px;
    cursor: pointer;
}

.box:hover, .boxsoftware:hover, .boxmyactions:hover, .boxmyrequests:hover, .boxdraftortemplate:hover {
    box-shadow: rgba(94, 50, 114, 0.15) 0px 5px 10px 0px;
    background: #FFF;
}

.controls {
    /*box-shadow: rgba(0, 0, 0, 0.3) 0px 2px 4px 0px;*/
    padding: 10px;
    background: #FFF;
}

.dialogbutton {
    float: right;
    padding-top: 5px;
}

.homepagebox {
    height: 180px;
    width: 300px;
    cursor: pointer;
}

.homepageoptiontitle {
    font-size: 1.5em;
    text-align: center;
    font-weight: bold;
    margin: 5px;
    float: left;
    vertical-align: middle;
    height: 52px;
    line-height: 52px;
}

.homepageoptiondescription {
    margin: 5px;
    font-size: 1.0em;
    display: block;
}

.homepageboximage {
    margin: 5px;
    height: 52px;
    text-align: left;
    float: left;
    vertical-align: middle;
    line-height: 52px;
}

    .homepageboximage img {
        height: 52px;
        vertical-align: middle;
        line-height: 52px;
    }

.grid {
    padding: 5px 5px 50px 5px;
}

.myrequestpagetitle {
    font-size: 1.2em;
    text-align: left;
    font-weight: bold;
    margin: 5px;
    float: left;
}

.myactiontitle {
    font-size: 1.2em;
    text-align: left;
    font-weight: bold;
    margin: 5px;
}

.mysoftwaresboximage {
    margin: 5px;
    height: 52px;
    text-align: left;
    float: left;
    vertical-align: middle;
    line-height: 52px;
    width: 82px;
}

    .mysoftwaresboximage img {
        max-height: 52px;
        vertical-align: middle;
        line-height: 52px;
        max-width: 52px;
    }

.mysoftwarestitle {
    font-size: 1.0em;
    text-align: center;
    font-weight: bold;
    margin: 5px;
    float: left;
    vertical-align: middle;
    height: initial;
    line-height: initial;
}

.mysoftwarescategorytitle {
    margin-top: 10px;
}

.mysoftwarestitleb {
    font-size: 1.1em;
    font-weight: bold;
    margin: 5px 0px 0px 0px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.mysoftwaresmenulateral {
    position: absolute;
    left: 0;
    margin-top: 10px;
    width: 350px;
    box-shadow: rgba(0, 0, 0, 0.15) 0px 1px 2px 0px;
    box-sizing: border-box;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.mysoftwaresdescription {
    margin-top: 5px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    line-clamp: 3;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow-wrap: break-word;
}

.mysoftwarespopupdescription {
    min-height: 300px;
}

.filterselectors {
    font-weight: initial;
}

.portalservicetitle {
    word-break: break-word;
    margin-top: 2px;
}

.featuredarticle {
    box-shadow: rgb(255, 0, 0) 0px 1px 2px 0px;
}

.requestlistboximage {
    margin: 5px;
    height: 52px;
    text-align: left;
    float: left;
    vertical-align: middle;
    line-height: 52px;
}

    .requestlistboximage img {
        height: 52px;
        vertical-align: middle;
        line-height: 52px;
    }

.myrequeststitle {
    margin: 5px;
    font-size: 1.1em;
    display: block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

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

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

    .myactionsactionlink:visited {
        color: var(--primary-color);
    }

.myactionstitle {
    margin: 5px;
    font-size: 1.1em;
    display: block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.mytemplatestitle, .mydraftstitle {
    font-size: 1.2em;
    text-align: left;
    font-weight: bold;
    margin: 5px;
    float: left;
    display: block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.mytemplatesdate, .mydraftsdate {
    font-weight: normal;
    padding-top: 5px;
}

#GridMappingEditForm > div {
    text-align: center;
}

.btnRequestNumber:hover {
    outline: none;
    background: #C0C0C0;
    text-decoration: none;
    border-style: none;
    border: 1px solid #A0A0A0;
    box-shadow: none;
}

.btnRequestNumber:visited, .btnRequestNumber:link {
    outline: none;
    text-decoration: none;
    color: #FFF;
}

.boxdrafttemplatechoice {
    outline: none;
    background: #FFF;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    color: #000;
    padding: 8px 20px 8px 20px;
    text-decoration: none;
    border: 1px solid #A0A0A0;
    align-items: flex-start;
    text-align: center;
    box-sizing: border-box;
}

.e-uploadbox.e-widget .e-selectpart.e-select {
    outline: none;
    background: #A0A0A0;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    color: #FFF;
    min-width: 95px;
    text-decoration: none;
    border: 1px solid #A0A0A0;
    align-items: flex-start;
    text-align: center;
    cursor: pointer;
    box-sizing: border-box;
    box-shadow: rgba(0, 0, 0, 0.3) 0px 2px 4px 0px;
}

    .e-uploadbox.e-widget .e-selectpart.e-select:hover {
        outline: none;
        background: #C0C0C0;
        text-decoration: none;
        border-style: none;
        border: 1px solid #A0A0A0;
        box-shadow: none;
    }

.e-uploadbox.e-widget .e-inputbtn {
    cursor: pointer;
    color: #FFF;
}

.e-uploadbox .e-uploadinput:hover {
    cursor: pointer;
}

.ui-dialog {
    z-index: 19999 !important;
}

.multiple_level_selector_field {
    font-size: 1.2em;
    min-height: 20px;
    font-weight: 400;
}

    .multiple_level_selector_field .e-ddl {
        float: left;
        margin-right: 5px;
    }

.fieldbox {
    padding: 5px;
    border: 1px solid #CCC;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    min-height: 28px;
    overflow: auto;
}

.listfile {
    padding-left: 10px;
}

    .listfile ul {
        list-style: none;
        display: block;
    }

    .listfile li {
        list-style: none;
        text-decoration: none;
        color: #000000;
        background-color: #fcfcfc;
        line-height: 30px;
        border-bottom-style: solid;
        border-bottom-width: 1px;
        border-bottom-color: #000;
        padding-left: 10px;
    }

.fileitem .e-icon {
    cursor: pointer;
}

#TestQueryResult {
    margin-bottom: 5px;
}

    #TestQueryResult th, #TestQueryResult td {
        border: 1px solid rgba(196,196,196,.5);
    }

.e-datetime-wrap {
    width: 100%;
}

.numberCircle {
    border-radius: 50%;
    width: 34px;
    height: 34px;
    padding: 9px;
    background: #fff;
    border: 2px solid #667;
    color: #667;
    text-align: center;
    font: 24px Arial, sans-serif;
    /*display: inline-block;*/
    float: right;
}

.circle {
    border: 0.1em solid grey;
    border-radius: 100%;
    height: 3em;
    width: 3em;
    text-align: center;
    float: right;
}

.circlemyactions {
    border: 0.2em solid grey;
}

.circle p {
    margin-top: 0.30em;
    font-size: 1.2em;
    font-weight: bold;
    color: grey;
}

.vakata-context, .vakata-context ul {
    background-color: rgb(255, 255, 255);
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    box-shadow: rgba(0, 0, 0, 0.15) 0px 1px 2px 0px;
    box-sizing: border-box;
    color: rgb(92, 93, 90);
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    margin-bottom: 10px;
    margin-left: 3px;
    margin-right: 3px;
    margin-top: 5px;
    text-indent: 0px;
    transition-delay: 0s;
    transition-duration: 0.1s;
    transition-property: all;
    transition-timing-function: ease-in-out;
    -webkit-font-smoothing: antialiased;
    position: absolute;
    border: 1px solid #f7f7f7;
    padding: 5px;
}

    .vakata-context li > a {
        padding-left: 0;
    }

        .vakata-context li > a .vakata-contextmenu-sep {
            border: 0;
        }

.vakata-context-separator {
    display: none;
}

.vakata-context .vakata-context-separator > a, .vakata-context .vakata-context-separator > a:hover {
    border: none;
}

.select2-container--open {
    z-index: 1000000;
}

.insert-scoop-variable {
    padding: 4px 10px 4px 10px;
}

#TicketOpen > .select2-container {
    z-index: inherit;
}
/* MY */
.menumy {
    font-size: 1.1em;
    color: black;
    float: right;
    margin: 5px;
}

#mylogo {
    border-width: 0px;
    vertical-align: bottom;
    cursor: pointer;
    width: 24px;
}
.menumy-content, .menumy-about, .menumy-banner {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    /*min-width: 160px;*/
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 100000;
    margin: 32px 36px 0px 0px;
    right: 0;
    padding: 0px 0px 10px 0px;
}
.menumy-content i, .menumy-about i, .menumy-banner i{
    color: var(--primary-color)
}
.menumy-content hr, .menumy-about hr, .menumy-banner hr{
    border-color: var(--primary-color)
}
.menumy-content a, .menumy-about a, .menumy-banner a{
    color: var(--text-color);
    padding: 10px 8px 10px 8px;
    text-decoration: none;
    display: flex;
    align-items: center;
    text-decoration: none;
    gap: 6px;
    /*width: 100%;*/
}

.menumy-content span,.menumy-about span,.menumy-banner span {
    color: var(--text-color);
    text-decoration: none;
    background-color: #ffffff;
    display: block;
    padding: 5px 16px 5px 8px;
}

.menumy-title {
    font-weight: bold;
}

.menumy-content a:hover,.menumy-about a:hover,.menumy-banner a:hover {
    border-top: 1px solid var(--primary-color);
    border-bottom: 1px solid var(--primary-color);
}

.menumy:hover {
    cursor: pointer;
}

.serviceformarticlefieldsblock {
    background-color: rgb(255, 255, 255);
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    box-shadow: rgba(0, 0, 0, 1) 0px 1px 2px 0px;
    box-sizing: border-box;
    border: 1px solid #c0c0c0;
    margin-bottom: 10px;
    margin-left: 3px;
    margin-right: 3px;
    margin-top: 5px;
    padding-bottom: 15px;
}

.DIVQUTY {
    width: 100px;
}

#Grid_dialogEdit_overLay {
    display: none;
}

.radialmenu > div > div.e-radial.e-abs.e-radialimage {
    background-image: url(images/closeactionmenu.png);
}

.btrequestaction {
    display: inline-block;
    background-color: #fff;
    padding: 10px 10px 10px 36px;
    margin: 5px;
    background: #fcfcfc;
    color: #4c4c4c;
    text-align: center;
    cursor: pointer;
    font-weight: 600;
    border: 1px solid #c1c1c1;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    min-width: 100px;
}

    .btrequestaction:hover {
        cursor: pointer;
        background: rgba(94, 50, 114,0.2);
        box-shadow: rgba(0, 0, 0, 0.3) 0px 2px 4px 0px;
    }

.btrequestactiontask {
    background-image: url(images/run-task-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

.btrequestactionvalidation {
    background-image: url(images/ticketedit/BtnTicketEditAskForValidation-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

.btrequestactionaddcomment {
    background-image: url(images/ticketedit/BtnTicketEditAddComment-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

.btrequestactionautodialog {
    background-image: url(images/ExternalTaskError-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

.btrequestactionautocomplete {
    background-image: url(images/markasfinished-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

.btrequestactiontaskremovefromhold {
    background-image: url(images/ticketedit/BtnTicketEditResume-24.png) !important;
    background-repeat: no-repeat !important;
    background-position: 5% center !important;
}

.servicecontainer {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.servicebreak {
    flex-basis: 100%;
    height: 0;
}

.field100percent {
    flex-basis: 100%;
}

.RequestViewBlock {
    padding: 0 2px 5px 2px;
    margin: 0 0 0 0;
    white-space: normal;
}

.RequestViewheaderBlockTitle {
    width: 100%;
    font-weight: bold;
}

.RequestViewheaderCell {
    float: left;
    padding: 3px;
    width: 150px;
    box-sizing: border-box;
    text-align: left;
}

.RequestViewheaderCellRight {
    float: left;
    padding: 3px;
    text-align: right;
    box-sizing: border-box;
    width: 120px;
}

.RequestViewheaderCell2 {
    margin: 5px 0px 5px 5px;
    /*vertical-align: middle;*/
    background: #fcfcfc;
    padding: 5px;
    min-height: 28px;
    display: block;
    width: 100%;
    box-sizing: border-box;
}

.RequestViewFieldLabel {
    float: left;
    border: 1px solid #ddd;
    padding: 3px;
    width: 200px;
    box-sizing: border-box;
}

.RequestViewFieldValue {
    float: left;
    border: 1px solid #ddd;
    padding: 3px;
    box-sizing: border-box;
}

.RequestViewFieldLabel2 {
    float: left;
    border: 1px solid #ddd;
    padding: 3px;
    width: 20%;
    box-sizing: border-box;
}

.RequestViewFieldValue2 {
    float: left;
    border: 1px solid #ddd;
    padding: 3px;
    width: 80%;
    box-sizing: border-box;
}

.RequestActionBlock {
    border: none;
}

.requestaction {
    padding: 0;
}

.assignment-display-field {
    padding-left: 28px;
}

.clickable {
    cursor: pointer;
}

.SortByAffectedUserDisplayName, .SortByRequesterDisplayName {
    width: 45%;
    text-overflow: ellipsis;
    overflow: hidden;
    display: block;
    white-space: nowrap;
}

[class*="historycontent-"] {
    background-color: #FFFFFF;
    padding: 10px;
}

.select2-container--classic .select2-selection--single {
    background-color: #ffffff;
    background-image: none;
}

    .select2-container--classic .select2-selection--single .select2-selection__arrow {
        background-image: none;
    }

.select2-container--classic.select2-container--open.select2-container--below .select2-selection--single {
    background-image: none;
}

.select2-container--classic.select2-container--open .select2-selection--single {
    border: 1px solid #aaa;
}

.select2-container--classic.select2-container--open .select2-dropdown {
    border-color: #aaa;
}

.select2-container--classic .select2-selection--single:focus {
    border: 1px solid #aaa;
}

.error:after {
    content: " *";
    color: red;
    font-weight: bolder;
}

.error {
    color: #4c4c4c;
    /*border-bottom: 2px solid #ff0000;*/
}

.valid {
    color: #4c4c4c;
    /*border-bottom: 1px solid #f1f1f1;*/
}

.errorcustom:after {
    content: "";
    color: red;
    font-weight: bolder;
}

.errorcustom {
    font-style: italic;
    font-weight: normal;
    color: #4c4c4c;
    border-bottom: none;
}

.e-waitpopup-pane {
    background-color: #383838;
    height: -webkit-fill-available !important;
}

    .e-waitpopup-pane > span {
        top: 200px !important;
    }

.ui-dialog-titlebar-close {
    visibility: hidden;
}

.ui-widget-header {
    border: none;
    background: none;
    color: #4c4c4c;
}

.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br {
    -moz-border-radius-bottomright: 5px;
    -webkit-border-bottom-right-radius: 5px;
    -khtml-border-bottom-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

.homepageseparator {
    flex-direction: column;
    flex-wrap: nowrap;
    margin-bottom: 10px;
    margin-left: 3px;
    margin-right: 3px;
    margin-top: 0px;
    text-indent: 0px;
    transition-delay: 0s;
    transition-duration: 0.1s;
    transition-property: all;
    transition-timing-function: ease-in-out;
    width: 98%;
    -webkit-font-smoothing: antialiased;
    position: absolute;
    border-bottom: none;
    padding: 0px;
    font-weight: 600;
    font-size: 1.3em;
}

.designerlangtitle {
    width: 98%;
    background-color: #ffffff;
    padding: 5px 0px 5px 5px;
    font-size: 1.2em;
    font-weight: 600;
}

.designeralert {
    padding: 0 !important;
    color: #4c4c4c !important;
}

    .designeralert .ui-widget-header, .designerobjectselector .ui-widget-header {
        border: none;
        background: #c1c1c1;
        color: #4c4c4c;
        margin: 0;
        border-radius: 0px;
    }

.designerconfigurationdialog {
    padding: 0 !important;
}

    .designerconfigurationdialog .ui-dialog .ui-dialog-content {
        padding: 0 !important;
    }

[id*="Trans_"] {
    border: none !important;
    padding-left: 0px !important;
}

#Translations > ul > li {
    border-left: none !important;
    border-right: none !important;
    border: none !important;
}

    #Translations > ul > li.e-bottom-line.e-item.e-active {
        border-bottom: 3px solid #5e3272 !important;
        background: var(--primary-color-light) !important;
    }

#popupConfig {
    padding: 0 !important;
}

#popmessage > ul {
    padding-left: 10px;
}

.designerconfigurationdialog .ui-widget-header {
    box-shadow: rgba(0, 0, 0, 0.3) 0px 2px 4px 0px;
    padding: 10px;
    background: #FFF;
    display: block;
    margin-bottom: 10px;
    margin-top: 0px;
    color: #5e5e5e;
}

.testquerybutton:before {
    content: "\e63e";
}

.clearquerybutton:before {
    content: "\e60b";
}

#TabTrans {
    padding: 0;
    height: 100vh;
}

/* KB */
.kbrating {
    height: 24px;
    padding: none;
    background: no-repeat;
}

.kbrating0stars {
    background-image: url(./images/kb/0stars.png);
}

.kbrating1stars {
    background-image: url(./images/kb/1stars.png);
}

.kbrating2stars {
    background-image: url(./images/kb/2stars.png);
}

.kbrating3stars {
    background-image: url(./images/kb/3stars.png);
}

.kbrating4stars {
    background-image: url(./images/kb/4stars.png);
}

.kbrating5stars {
    background-image: url(./images/kb/5stars.png);
}

.kbresultTemplate {
    padding: 10px;
}

#Kbresultview.e-lv.e-parentlv > .e-lv .e-list-container {
    border: none;
}

#Kbresultview.e-lv .e-list {
    border-bottom: 1px solid var(--primary-color-light) !important;
    /*font-size: 1em;*/
}

    #Kbresultview.e-lv .e-list.e-state-default {
        background-color: #fff;
        border-bottom: 1px solid var(--primary-color-light) !important;
    }

        #Kbresultview.e-lv .e-list.e-state-default:hover {
            background-color: #f1f1f1;
            border-bottom: 1px solid var(--primary-color-light) !important;
        }

.KbListcontainer, .KbArticlecontainer {
    display: table;
    width: 100%;
}

    .KbListcontainer .cell, .KbArticlecontainer .cell {
        display: table-cell;
        vertical-align: top;
        width: auto;
    }

#Kbresult {
    width: 85%;
    padding: 0;
}

#KbTagsCloud.e-tagcloud {
    width: initial;
}

    #KbTagsCloud.e-tagcloud .e-ul {
        border: none;
    }

[id*="resultList_"] {
    list-style: none;
}

    [id*="resultList_"] > li {
        border-bottom: 1px solid var(--primary-color-light);
        padding: 10px;
    }

    [id*="resultList_"] .searchresultrecord {
        cursor: pointer;
    }

.kbtagviewlink:visited, .kbcategoryviewlink:visited {
    color: #0000EE;
}


.e-queries:before {
    content: "\e839";
    line-height: 1;
}

.designerhomepagebox {
    height: 120px;
    width: 350px;
}

.designerhomepagetitle {
    font-size: 1.2em;
}

.designerhomepageerror {
    padding-left: 32px;
}

.designerhomepageicon {
    height: 32px;
    width: 32px;
    float: left;
    padding: 5px;
}

.designerhomepageseparator {
    flex-direction: column;
    flex-wrap: nowrap;
    margin-bottom: 10px;
    margin-left: 3px;
    margin-right: 3px;
    margin-top: 0px;
    text-indent: 0px;
    transition-delay: 0s;
    transition-duration: 0.1s;
    transition-property: all;
    transition-timing-function: ease-in-out;
    width: 98%;
    -webkit-font-smoothing: antialiased;
    position: absolute;
    padding: 0px 0px 5px 0px;
    border-bottom: 1px solid var(--primary-color);
    font-weight: 600;
    font-size: 1.3em;
}

.designercriticalitycolor_ERROR {
    color: red;
}

.designercriticalitycolor_WARNING {
    color: #ffd766;
}

.designercriticalitycolor_INFO {
    color: var(--primary-color);
}

.designercriticalitycolor_OK {
    color: var(--primary-color);
}

.designerhomepageli {
    cursor: pointer;
}

.ToggledGridView:before {
    content: url(./images/BtnGridSwithToCalendar-24.png);
    vertical-align: middle;height:24px;cursor: pointer;margin-right: 5px;
}

.ToggledListView:before {
    content: url(./images/BtnGridSwithGrid-24.png);
    vertical-align: middle;height:24px;cursor: pointer;margin-right: 5px;
}

.viewtype {
    border: none;
    background: none;
}

.articlecollapsed {
    width: 320px; /*col-4*/
}

.articleexpanded {
    width: 98%;
}
/* TreeView ACSDashboard */

.TreeDashboardcontainer {
    display: table;
    width: 100%;
}

    .TreeDashboardcontainer .cell {
        display: table-cell;
        vertical-align: top;
        width: auto;
    }

#TreeDashboardResult {
    width: 85%;
    padding: 0;
}

.TreeDashboardcontainer .sidebar {
    width: 250px;
    padding: 5px 5px 10px 5px;
    background: #fff;
    transition: var(--tran);
    z-index: 100;
    border-top-right-radius: 5px;
    box-shadow: 2px 0px 5px 0px rgba(0, 0, 0, 0.15);
}

#TreeDashboardMain {
    display: block;
    background-color: var(--body-color);
}

.TreeDashboardMainsection {
    position: fixed;
    top: 80px;
    left: 350px;
    height: calc(100% - 82px);
    width: calc(100% - 350px);
    background: #FFF;
    padding-left: 5px;
    overflow: auto;
}

    .TreeDashboardMainsection .text {
        font-size: 30px;
        font-weight: 500;
        color: var(--text-color);
        padding: 12px 60px;
    }

#TreeDashboardMain .pagewrap {
    height: 100%;
}

.TreeDashboardSidebar {
    position: fixed;
    top: 80px;
    left: 0;
    height: calc(100% - 80px);
    width: 350px;
    padding: 5px 5px 10px 5px;
    background: #fff;
    transition: var(--tran);
    z-index: 100;
    border-top-right-radius: 5px;
    box-shadow: 2px 0px 5px 0px rgba(0, 0, 0, 0.15);
}

    .TreeDashboardSidebar .menu-bar {
        height: calc(100% - 55px);
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        overflow-x: hidden; /* Hide horizontal scrollbar */
        overflow-y: scroll; /* Add vertical scrollbar */
        -ms-overflow-style: none; /* IE and Edge */
        scrollbar-width: none; /* Firefox */
    }

        .TreeDashboardSidebar .menu-bar::-webkit-scrollbar {
            width: 5px;
        }

        .TreeDashboardSidebar .menu-bar::-webkit-scrollbar-track {
            background: #f1f1f1;
        }

        .TreeDashboardSidebar .menu-bar::-webkit-scrollbar-thumb {
            background: #888;
        }

            .TreeDashboardSidebar .menu-bar::-webkit-scrollbar-thumb:hover {
                background: #555;
            }

.TreeDashboardpagetitleedit {
    background: #FFF;
    margin: 0;
    font-size: 1.2em;
    font-weight: bold;
    color: #5e5e5e;
    border-top-left-radius: 5px;
    padding-left: 5px;
    position: sticky;
    position: -webkit-sticky;
    display: flex;
    top: 0px;
}

    .TreeDashboardpagetitleedit > .TreeDashboarddivtitle, .TreeDashboarddivtitle > .TreeDashboarddivtitle {
        height: 40px;
        list-style: none;
        display: flex;
        align-items: center;
    }

    .TreeDashboardpagetitleedit > .divbuttons {
        margin-left: auto;
        padding: 5px 20px 0px 0px;
    }

#DashboardTreeView .sidebar li {
    height: initial;
    list-style: initial;
    display: initial;
    align-items: initial;
}

.TreeDashboardtexttitle {
    padding: 5px;
}

.formserviceservicetitle{
	padding-left: 5px;
	font-size: 1.2em;
	font-weight:400;
}
.formserviceserviceimage{
	max-height: 32px;
	vertical-align: middle;
}

/* TreeView ACSDashboard */
.datatable-display{
	width:100%;
	border: 1px solid var(--primary-color);
	border-collapse: collapse;
}
.datatable-display tr{
	border: 1px solid var(--primary-color);
}
.datatable-display td,.datatable-display th{
	padding: 5px;
	border: 1px solid var(--primary-color);
}
.datatable-number{
	text-align: right;
}
.e-menu-wrapper, .e-menu-container {
    background: #fff;
	border: none;
}
.e-menu-wrapper .e-menu .e-menu-item .e-menu-url, .e-menu-container .e-menu .e-menu-item .e-menu-url {
    color: #707070;
}
.e-menu-wrapper ul .e-menu-item:hover{
        border-top: 2px solid var(--primary-color);
        border-bottom: 2px solid var(--primary-color);
        margin-bottom: -2px;
}
.e-control, .e-css, .e-error {
    font-family: Roboto, Arial, sans-serif;
    font-size: 14px;
}
.e-btn.e-primary, .e-css.e-btn.e-primary {
    background: var(--button-background-color);
    border-color: var(--button-background-color);
    color: var(--button-text-color);
}
.e-btn.e-primary:hover, .e-css.e-btn.e-primary:hover {
    background: var(--button-background-color-hover);
    border: 1px solid var(--button-background-color-hover);
    color: var(--button-text-color-hover);
}
.e-query-builder .e-group-body .e-horizontal-mode .e-rule-filter{
    width: 400px;
}
.e-treeview .e-list-item.e-active>.e-fullrow {
    background: none;
    border-color: transparent;
    box-shadow: none;
}
.e-treeview .e-list-item.e-active.e-hover>.e-fullrow, .e-treeview .e-list-item.e-active.e-node-focus>.e-fullrow {
    background: none;
    border-color: transparent;
    box-shadow: none;
}
.e-treeview .e-list-item .e-ul {
    margin: 2px 0 -2px;
    padding: 0 0 0 0;
}
.e-treeview {
    white-space: unset;
}
.e-treeview .e-list-item.e-active{
    background-color: var(--primary-color);
}
.e-treeview .e-list-text {
    color: var(--text-color);
}
.e-treeview .e-list-item.e-hover:not(.e-active) {
    background: #f5f5f5;
}
.e-tbar-delete-icon:before {content: "\e94a";}
.e-tbar-contract-icon:before {content: "\e203";}
.e-tbar-customaction-icon:before {content: "\e434";}
.e-tbar-new-icon:before {content: "\e709";}
.e-tbar-menu-icon:before {content: "\e718";}
.e-tbar-edit-icon:before {content: "\e7a3";}
.e-tbar-chgtpwd-icon:before {content: "\e91a";}
.e-tbar-members-icon:before {content: "\e15d";}
.settingsdescription{text-align: justify;text-justify: inter-word;}

#alertBanner {
    height: 40px;
    overflow: hidden;
    position: relative;
    padding: 0 10px;
    display: flex;
    align-items: center;
    width: 60%;
    float: left;
}

#alertScroller {
    position: absolute;
    white-space: nowrap;
    will-change: transform;
}
#devsrv{padding: 5px;font-style: italic}

.icon-circle-bg-light {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background-color: var(--button-background-color-light);
    color: var(--button-text-color-light);
    font-family: 'uicons-regular-straight';
    font-size: 14px;
    font-weight: bold;
    font-style: normal;
}

.icon-circle-bg {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background-color: var(--button-background-color);
    color: var(--button-text-color);
    font-family: 'uicons-regular-straight';
    font-size: 14px;
    font-weight: bold;
    font-style: normal;
}
.icon-banner::before {
    content: '\ea23';
}
.icon-about::before {
    content: '\e8d0';
}
.icon-my::before {
    content: '\f0a7';
}
.headerline{border-bottom: 1px solid #e0e0e0; box-sizing: content-box;}

.layout-sidebar-body {
  flex-grow: 1;
  overflow-y: auto;
}

.layout-sidebar-footer {
  padding: 15px 10px;
  border-top: 1px solid rgba(var(--primary-color-rgb), 0.2);
  font-size: 14px;
  text-align: center;
}


.layout-home-link {
  display: block;
  margin-bottom: 5px;
  text-decoration: none;
  color: inherit;
}

.layout-home-link:hover {
  text-decoration: underline;
}

.layout-footer-text {
  color: var(--primary-color);
  font-size: 12px;
}
#SideBar.e-pane {
  display: flex !important;
  flex-direction: column;
  padding: 0;
  overflow: hidden;
}
.layout-sidebarej2 {
    position: static;
}

.layout-sidebar.collapsed {
    width: 40px;
}

.layout-sidebar h2 {
    text-align: center;
    margin: 0 10px 20px 10px;
}

.layout-sidebar.collapsed h2,
.layout-sidebar.collapsed .layout-section-title strong,
.layout-sidebar.collapsed .layout-toggle-icon,
.layout-sidebar.collapsed .layout-section-content {
    display: none;
}

.layout-section {
    border-top: 1px solid #ccc;
}

.layout-section-title {
    padding: 12px 16px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #f8f8f8;
    transition: background-color 0.3s;
}

.layout-section-title:hover {
    background-color: var(--primary-color-light);
    color: var(--primary-color);
}

.layout-toggle-icon {
    font-size: 16px;
    color: var(--text-color);
}

.layout-section-content {
    display: none;
    padding-bottom: 8px;
}

.layout-section-content a {
    display: flex;
    align-items: center;
    padding: 10px 20px;
    font-size: 14px;
    color: var(--text-color);
    text-decoration: none;
    transition: background-color 0.2s, color 0.2s;
    border-left: 3px solid transparent;
}

.layout-section-content a:hover {
    background-color: rgba(var(--primary-color-rgb), 0.08);
    border-left: 3px solid var(--primary-color);
    color: var(--primary-color);
}
.layout-main {
    position: fixed;
    transition: margin-left 0.3s ease;
    height: calc(100% - 82px);
    background-color: var(--body-color);
    padding-left: 5px;
    overflow: auto;
    width: calc(100% - 250px);
}
.layout-mainej2 {
    position: static;
}
body.sidebar-collapsed .layout-main {
    margin-left: 40px;
}
.layout-section-content a.active {
    font-weight: bold;
    color: var(--primary-color);
    border-left: 3px solid var(--primary-color);
    background-color: rgba(var(--primary-color-rgb), 0.08);
}    
.layout-section strong {
    font-size: 15px;
    color: var(--primary-color);
}
.layout-search {
    width: calc(100% - 20px) !important;
    margin: 0 10px 15px 10px;
    padding: 8px;
    font-size: 14px;
}
.layout-subsection {
    margin: 10px 0;
    }

.layout-subsection-title {
    font-weight: bold;
    padding: 8px 20px;
    cursor: pointer;
    }

.layout-subsection-links {
    padding-left: 30px;
    display: none;
    }

.layout-subsection-title.open + .layout-subsection-links {
    display: block;
}
.layout-subtoggle-icon {
    float: right;
    font-weight: bold;
    font-size: 16px;
}
.search-box {
    position: relative;
    width: 400px;
}

.search-box input[type="text"] {
    width: 250px;
    padding: 8px 30px 8px 10px;
    border: 1px solid var(--primary-color);;
    border-radius: 4px;
    float: right;
}

.search-box .search-icon {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    color: var(--primary-color);
}

#searchResults {
    top: 0;
    left: 0;
    width: 100%;
    background: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    box-shadow: 0 6px 16px rgba(var(--primary-color-light-rgb), 0.1);
    z-index: 1000;
    padding: 6px 0;
    font-family: 'Segoe UI', sans-serif;
}

.search-result-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    font-size: 14px;
    color: var(--text-color);
   
}

.search-result-item i {
    font-size: 16px;
    color: var(--primary-color);
}

.search-result-item a {
    text-decoration: none;
    color: inherit;
    flex-grow: 1;
}

.search-result-item:hover {
    background-color: rgba(var(--primary-color-light-rgb), 0.1);
    cursor: pointer;
}
.search-no-result {
    padding: 10px;
    text-align: center;
    color: var(--primary-color);
    font-style: italic;
}

.search-header {
    width: 100%;
    background-color: rgba(var(--primary-color-rgb), 0.08);;
    color: var(--primary-color);
    line-height: 24px;
    padding: 5px;
    font-size: 14px;
    font-weight: bold;
}
.search-close {
    float: right;
    cursor: pointer;
    font-weight: normal;
    color: var(--primary-color);
    padding: 0 8px;
    font-size: 18px;
    line-height: 24px;
    transition: color 0.2s ease;
}

.search-close:hover {
    color: #d00;
}
@media only screen and (max-width: 321px) {
    .col-flright {
        height: 250px;
        display: block;
    }

    #ticketAttachmentsList {
        height: 180px;
        overflow: auto;
        width: 400px;
    }

    .TicketInfoBlock-field {
        height: 40px;
        overflow: auto;
    }

    .imgarticleindex {
        padding-left: 0;
    }

    .homepagebox {
        width: auto;
        margin-right: 5px;
    }

    .portalpagebox {
        width: 95%;
        margin-right: 5px;
    }

    [class*="col-"], .loginform, .indexstatus {
        width: 100%;
        margin-top: 5px;
    }

    #clearfilter {
        display: none;
    }

    .e-menu, .e-menu-res-wrap .e-in-wrap.e-menu-res-in-wrap, .e-menu.e-vertical, .e-menu.e-vertical .e-list > ul, .e-menu.e-context, .e-menu.e-context .e-list > ul {
        border-radius: 5px;
    }
}

@media only screen and (max-width: 800px) {
    /* For tablets: */
    .col-flright {
        height: 250px;
        display: block;
    }

    #ticketAttachmentsList {
        height: 180px;
        overflow: auto;
        width: 400px;
    }

    .TicketInfoBlock-field {
        height: 40px;
        overflow: auto;
    }

    .loginform {
        width: 100%;
        margin: 2em 5px 2em 5px;
    }

    .imgarticleindex {
        padding-left: 0;
    }

    [class*="col-"], .loginform, .indexstatus {
        width: 100%;
        margin-top: 5px;
    }

    #clearfilter {
        display: none;
    }

    .e-menu, .e-menu-res-wrap .e-in-wrap.e-menu-res-in-wrap, .e-menu.e-vertical, .e-menu.e-vertical .e-list > ul, .e-menu.e-context, .e-menu.e-context .e-list > ul {
        border-radius: 5px;
    }
}

@media screen and (max-width: 600px) {
    #logindisplay {
        float: left;
    }

    .homepagebox {
        width: 95%;
        margin-right: 5px;
    }

    .portalpagebox {
        width: 95%;
        margin-right: 5px;
    }

    [class*="col-"], .loginform, .indexstatus {
        width: 100%;
        margin-top: 5px;
    }

    #clearfilter {
        display: none;
    }

    .e-menu, .e-menu-res-wrap .e-in-wrap.e-menu-res-in-wrap, .e-menu.e-vertical, .e-menu.e-vertical .e-list > ul, .e-menu.e-context, .e-menu.e-context .e-list > ul {
        border-radius: 5px;
    }

    .articlecollapsed {
        width: 98%;
    }

    .articleexpanded {
        width: 98%;
    }

    .multiline-editor-field {
        padding: 5px 0px 0px 0px;
        overflow: unset;
    }

    .homepagebox {
        width: 96%;
    }

    .portalpagebox {
        width: 96%;
    }
}