/*!
 * bootstrap-tokenfield
 * https://github.com/sliptree/bootstrap-tokenfield
 * Copyright 2013-2014 Sliptree and other contributors; Licensed MIT
 */
@-webkit-keyframes'blink' {
    0% { border-color: #ededed; }

    100% { border-color: #b94a48; }
}

@-moz-keyframes'blink' {
    0% { border-color: #ededed; }

    100% { border-color: #b94a48; }
}

@keyframes'blink' {
    0% { border-color: #ededed; }

    100% { border-color: #b94a48; }
}

.tokenfield.form-control .token {
    -moz-border-radius: 3px;
    -moz-box-sizing: border-box;
    -webkit-border-radius: 3px;
    -webkit-box-sizing: border-box;
    background-color: #ededed;
    border: 1px solid #d9d9d9;
    border-radius: 3px;
    box-sizing: border-box;
    cursor: default;
    display: inline-block;
    height: 22px;
    margin: -1px 5px 5px 0;
    vertical-align: top;
    white-space: nowrap;
}

.tokenfield.form-control .token:hover { border-color: #b9b9b9; }

.tokenfield.form-control .token.active {
    border-color: #52a8ec;
    border-color: rgba(82, 168, 236, 0.8);
}

.tokenfield.form-control .token.duplicate {
    -webkit-animation-direction: normal;
    -webkit-animation-duration: 0.1s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-name: blink;
    -webkit-animation-timing-function: ease;
    animation-direction: normal;
    animation-duration: 0.1s;
    animation-iteration-count: infinite;
    animation-name: blink;
    animation-timing-function: ease;
    border-color: #ebccd1;
}

.tokenfield.form-control .token.invalid {
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    background: none;
    border: 1px solid transparent;
    border-bottom: 1px dotted #d9534f;
    border-radius: 0;
}

.tokenfield.form-control .token.invalid.active {
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    background: #ededed;
    border: 1px solid #ededed;
    border-radius: 3px;
}

.tokenfield.form-control .token .token-label {
    display: inline-block;
    overflow: hidden;
    padding-left: 4px;
    text-overflow: ellipsis;
    vertical-align: top;
}

.tokenfield.form-control .token .close {
    display: inline-block;
    float: none;
    font-family: Arial;
    font-size: 1.1em;
    height: 100%;
    line-height: 100%;
    line-height: 1.49em;
    margin-left: 5px;
    padding-right: 4px;
    vertical-align: top;
}

.tokenfield.form-control .token-input {
    -webkit-box-shadow: none;
    background: none;
    border: 0;
    box-shadow: none;
    height: 20px;
    margin-bottom: 6px;
    margin-top: 0;
    min-width: 60px;
    padding: 0;
    width: 60px;
}

.tokenfield.form-control .token-input:focus {
    /* IE6-9 */
    -webkit-box-shadow: none;
    border-color: transparent;
    box-shadow: none;
    outline: 0;
}

.tokenfield.form-control.disabled {
    background-color: #eeeeee;
    cursor: not-allowed;
}

.tokenfield.form-control.disabled .token-input { cursor: not-allowed; }

.tokenfield.form-control.disabled .token:hover {
    border-color: #d9d9d9;
    cursor: not-allowed;
}

.tokenfield.form-control.disabled .token:hover .close {
    cursor: not-allowed;
    filter: alpha(opacity=20);
    opacity: 0.2;
}

.has-warning .tokenfield.form-control.focus {
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b;
    border-color: #66512c;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b;
}

.has-error .tokenfield.form-control.focus {
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
    border-color: #843534;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
}

.has-success .tokenfield.form-control.focus {
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168;
    border-color: #2b542c;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168;
}

.tokenfield.form-control.input-sm,
.input-group-sm .tokenfield.form-control {
    min-height: 30px;
    padding-bottom: 0px;
}

.input-group-sm .token,
.tokenfield.form-control.input-sm .token {
    height: 20px;
    margin-bottom: 4px;
}

.input-group-sm .token-input,
.tokenfield.form-control.input-sm .token-input {
    height: 18px;
    margin-bottom: 5px;
}

.tokenfield.form-control.input-lg,
.input-group-lg .tokenfield.form-control {
    min-height: 45px;
    padding-bottom: 4px;
}

.input-group-lg .token,
.tokenfield.form-control.input-lg .token { height: 25px; }

.input-group-lg .token-label,
.tokenfield.form-control.input-lg .token-label { line-height: 23px; }

.input-group-lg .token .close,
.tokenfield.form-control.input-lg .token .close { line-height: 1.3em; }

.input-group-lg .token-input,
.tokenfield.form-control.input-lg .token-input {
    height: 23px;
    line-height: 23px;
    margin-bottom: 6px;
    vertical-align: top;
}

.tokenfield.form-control.rtl {
    direction: rtl;
    text-align: right;
}

.tokenfield.form-control.rtl .token { margin: -1px 0 5px 5px; }

.tokenfield.form-control.rtl .token .token-label {
    padding-left: 0px;
    padding-right: 4px;
}

.tokenfield.form-control::-webkit-input-placeholder { color: #999 }

.tokenfield.form-control {
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    color: #555;
    display: block;
    font-size: 14px;
    height: auto;
    line-height: 1.428571429;
    padding: 6px 6px 0 6px;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    vertical-align: middle;
    width: 100%;
}

.tokenfield.form-control:focus {
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
    border-color: #66afe9;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
    outline: 0;
}


.tokenfield input.tt-hint { display: none; }

.tokenfield input.tt-query { width: auto !important; }
/* ------- Styles Kendo C2 ------ */
:root {
    --kendo-color-primary: #ef7522;
    --kendo-color-primary-on-surface: #ef7522;
    --kendo-color-primary-hover: #DB6B21;
}

.k-block {
    height: 100px;
    width: 200px;
}

.k-grid table,
.k-grid table tbody,
.k-grid table tr,
.k-grid table td {
    /* border-collapse: collapse !important; */
    /* border-width: 0px; */
}

.ParametersManager .k-grid-header-wrap, .ParametersManager .k-grid-footer-wrap,
form[name=gridTemplatesManagerForm] .grid-template-editor .k-grid-header-wrap,
form[name=gridTemplatesManagerForm] .grid-template-editor .k-grid-footer-wrap { overflow: auto; }

.k-block,
.k-widget { background-color: #fff; }

.k-grid .k-group-col, .k-grid .k-hierarchy-col { width: 10px; }

.k-block,
.k-widget,
.k-input,
.k-textbox,
.k-group,
.k-content,
.k-header,
.k-editable-area,
.k-separator,
.k-colorpicker .k-i-arrow-60-down,
.k-textbox > input,
.k-autocomplete,
.k-dropdownlist,
.k-toolbar,
.k-group-footer td,
.k-grid-footer,
.k-footer-template td,
.k-disabled,
.k-grid-header-wrap,
.k-grid-header,
.k-grid td,
.k-grid-footer-wrap,
.k-grouping-header,
.k-grouping-header .k-group-indicator,
.k-dropdownlist,
.k-panelbar > .k-treeview-item > .k-link,
.k-panel > .k-treeview-item > .k-link,
.k-panelbar .k-panel,
.k-panelbar .k-content,
.k-calendar th,
.k-slider-track,
.k-splitbar,
.k-dropzone-active,
.k-upload-files,
.k-tiles,
.k-toolbar,
.k-dropdownlist,
.k-tooltip,
.k-progress {
    border-color: #d3d3d3;
    font-size: 12px;
}

.k-group,
.k-toolbar,
.k-grouping-header,
.k-group-footer td,
.k-grid-footer,
.k-footer-template td,
.k-widget .k-status,
.k-grouping-row td,
td.k-group-cell,
.k-calendar th,
.k-hover,
.k-upload-files { background-color: #fff; }

.k-list-container { border-color: #d3d3d3; }

.k-content,
.k-editable-area,
.k-panelbar > li.k-treeview-item,
.k-panel > li.k-treeview-item,
.k-tiles { background-color: #fff; }

.k-textbox > input,
.k-autocomplete .k-input,
.k-dropdownlist .k-input,
.k-autocomplete.k-focused .k-input,
.k-dropdownlist.k-focused .k-input,
.k-datepicker.k-focused .k-input,
.k-datetimepicker.k-focused .k-input,
.k-timepicker.k-focused .k-input,
.k-numeric-wrap.k-focused .k-input { border-color: #d3d3d3; }

.k-input,
input.k-textbox,
textarea.k-textbox,
input.k-textbox:hover,
textarea.k-textbox:hover,
.k-textbox > input { background-color: #fff; }

.k-block,
.k-header,
.k-grid-header,
.k-toolbar,
.k-grouping-header,
.k-tooltip,
.k-button,
.k-draghandle {
    background-color: #eee;
    background-image: none;
}

/* icons */

.k-icon,
.k-column-menu .k-sprite { opacity: .8; }

.k-icon:hover,
.k-hover .k-icon,
.k-selected .k-icon,
.k-focused .k-icon,
.k-column-menu .k-hover .k-sprite,
.k-column-menu .k-active .k-sprite { opacity: 1; }

.k-loading-color { background-color: #fff; }

.k-button { }

.k-button,
.k-button.k-disabled:hover,
.k-disabled .k-button:hover,
.k-draghandle {
    background-color: #e3e3e3;
    border-color: #d3d3d3;
}

.k-button:hover,
.k-draghandle:hover { border-color: #000; }

/* states */

.k-active,
.k-active:hover,
.k-active-filter {
    background-color: #fff;
    border-color: #F4AD61;
}

.k-focused { border-color: #000; }

.k-grid-content .k-selected, .k-master-row.k-selected, .k-alt.k-selected {
    background-color: #F0F0F0 !important;
    background-image: none !important;
}

.k-selected,
.k-list > .k-focused,
.k-panelbar > .k-selected,
.k-panel > .k-selected,
.k-ghost-splitbar-vertical,
.k-ghost-splitbar-horizontal,
.k-draghandle.k-selected:hover {
    background-color: #ff9334 !important;
    color: #333;
}

.k-selected.k-focused { background-color: #ff9334; }

.k-selected > .k-link { color: #fff; }

.k-calendar-container .k-selected > .k-link { color: black; }

.k-hover,
.k-hover:hover,
.k-splitbar-horizontal-hover:hover,
.k-splitbar-vertical-hover:hover,
.k-list > .k-hover,
.k-marquee,
.k-textbox:hover,
.k-autocomplete.k-hover,
.k-datepicker.k-hover,
.k-datetimepicker.k-hover,
.k-timepicker.k-hover,
.k-numeric-wrap.k-hover,
.k-dropdownlist.k-hover {
    background-color: #F4AD61;
    color: white;
}

.k-calendar .k-selected.k-focused > .k-link { background-color: transparent; }

.k-state-error {
    background-color: #ff5252;
    border-color: #e20000;
    color: #fff;
}

.k-disabled {
    filter: alpha(opacity=70);
    opacity: .7;
}

/* Slider */

.k-slider-track { background-color: #e3e3e3; }

.k-slider-selection { background-color: #fe6a00; }

/* Tooltip */

.k-tooltip {
    background-color: #fff;
    border-color: #a99f9a;
}

.k-tooltip-validation {
    background-color: #fff4c9;
    border-color: #ffe79e;
}

/* Splitter */

.k-splitbar { background-color: #e3e3e3; }

.k-restricted-size-vertical,
.k-restricted-size-horizontal { background-color: #fff; }

/* Upload */

.k-progress-status { border-color: #a99f9a transparent; }

/* ImageBrowser */

.k-tile { border-color: #fff; }

.k-textbox:hover,
.k-tiles li.k-hover { border-color: #a99f9a; }

.k-tiles li.k-selected { border-color: #fe6a00; }

/* Shadows */

.k-window { border-color: rgba(0, 0, 0, 0.3); }

/* Border radius */

.k-block,
.k-button,
.k-textbox,
.k-drag-clue,
.k-touch-scrollbar,
.k-window,
.k-window-titleless .k-window-content,
.k-window-action,
.k-inline-block,
.k-grid .k-filter-options,
.k-grouping-header .k-group-indicator,
.k-autocomplete,
.k-dropdownlist,
.k-datepicker,
.k-datetimepicker,
.k-timepicker,
.k-numeric-wrap,
.k-list-container,
.k-calendar-container,
.k-calendar td,
.k-calendar .k-link,
.k-treeview .k-hover,
.k-treeview .k-selected,
.k-editor-button .k-hover,
.k-editor-button .k-active,
.k-tooltip,
.k-tile,
.k-slider-track,
.k-slider-selection { border-radius: 4px; }

.k-calendar-container.k-state-border-up,
.k-list-container.k-state-border-up,
.k-autocomplete.k-state-border-up,
.k-dropdownlist.k-state-border-up,
.k-datepicker.k-state-border-up,
.k-datetimepicker.k-state-border-up,
.k-timepicker.k-state-border-up,
.k-numeric-wrap.k-state-border-up,
.k-window-content,
.k-filter-menu { border-radius: 0 0 4px 4px; }

.k-window-titlebar,
.k-block > .k-header,
.k-tabstrip-items .k-treeview-item,
.k-panelbar .k-tabstrip-items .k-treeview-item,
.k-tabstrip-items .k-link,
.k-calendar-container.k-state-border-down,
.k-list-container.k-state-border-down,
.k-autocomplete.k-state-border-down,
.k-dropdownlist.k-state-border-down,
.k-datepicker.k-state-border-down,
.k-datetimepicker.k-state-border-down,
.k-timepicker.k-state-border-down,
.k-numeric-wrap.k-state-border-down { border-radius: 4px 4px 0 0; }

.k-dropdownlist .k-select,
.k-datepicker .k-select,
.k-datetimepicker .k-select,
.k-timepicker .k-select,
.k-numeric-wrap .k-select,
.k-datetimepicker .k-select + .k-select,
.k-animation-container .k-calendar-container,
.k-list-container.k-state-border-right { border-radius: 0 4px 4px 0; }

.k-textbox > input,
.k-autocomplete .k-input,
.k-dropdownlist .k-input,
.k-datepicker .k-input,
.k-datetimepicker .k-input,
.k-timepicker .k-input,
.k-numeric-wrap .k-input,
.k-numeric-wrap .k-link,
.k-colorpicker .k-selected-color,
.k-progress,
.k-progress-status { border-radius: 2px; }

.k-list .k-hover,
.k-list .k-focused,
.k-list .k-selected,
.k-dropzone,
.k-upload-files { border-radius: 3px; }

.k-slider .k-button,
.k-grid .k-slider .k-button { border-radius: 13px; }

.k-draghandle { border-radius: 7px; }

.k-grouping-header {
    background: #F6F6F6;
    padding: 0.3em;
}

.k-grid-header tr th { font-size: 1em; }

.k-detail-cell { background-color: #fff; }

.k-selected, .k-button:active { background-image: none, linear-gradient(to bottom, #F4AD61 0, #F29A3C 100%); }

.k-grid-header .k-selected {
    background-color: rgb(240, 240, 240);
    background-image: none, linear-gradient(to bottom, #F6F6F6 0, #EAEAEA 100%);
    border-color: #D3D3D3;
    color: #000;
}

.k-grid-header .k-selected .k-link { color: #000; }

.k-grid-header .k-header.k-focused {
    -webkit-box-shadow: none;
    box-shadow: none;
}

.k-button.k-upload-button { width: auto; }

/* ellipsis */

.k-master-row td {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Inverse arrow on ticket and ci grids */

.ticket-grid .k-grid-header a.k-link,
.ci-grid .k-grid-header a.k-link {
    padding-left: 17px;
    position: relative;
}

.ticket-grid .k-grid-header a.k-link span.k-icon,
.ci-grid .k-grid-header a.k-link span.k-icon {
    left: 0;
    position: absolute;
}

.k-datetimepicker .k-select,
.k-datepicker .k-select,
.k-timepicker .k-select {
    height: 22px;
    padding-top: 5px;
}

.k-datetimepicker input,
.k-datepicker input,
.k-timepicker input {
    color: #000;
}

.k-datetimepicker .k-input-inner,
.k-datepicker .k-input-inner,
.k-timepicker .k-input-inner {
    width: 100%;
    font-size: 13px;
    text-overflow: clip !important;
    padding-inline: 3.5px;
}
.k-dropzone.k-upload-dropzone {
    display: inline-block;
}

.k-upload {
  border-width: 0;
}

.k-upload .k-dropzone {
  padding: 0;
}

.k-upload-status {
    display: none !important;
}

.k-upload-status-total {
  display: none;
}

.k-column-menu .k-column-list {
    max-height: 350px;
}

.k-column-menu .k-columnmenu-item:focus,
.k-column-menu .k-columnmenu-item.k-focus {
    box-shadow: none !important;
}

.k-column-menu input[type="checkbox"] {
    width: var(--kendo-spacing-4, 1rem);
    border: 1px solid var(--kendo-color-border, rgba(0, 0, 0, 0.08));
    border-radius: var(--kendo-border-radius-md, 0.25rem);
}

.k-column-menu .search-row {
    position: relative;
    display: flex;
    align-items: center;
}

.k-column-menu .search-row #columnMenuSearchBar {
    margin: 2px 8px;
    border-radius: 4px;
    flex: 1;
    padding-right: 20px;
}

.k-column-menu .search-row .clear-search {
    background-color: transparent;
    border: none;
    position: absolute;
    right: 12px;
}

.k-column-menu .k-button-solid-primary {
    border-color: var(--kendo-color-primary);
    color: var(--kendo-color-on-primary);
    background-color: var(--kendo-color-primary);
    border-radius: var(--kendo-border-radius-md);
}

.k-column-menu .k-button-solid-base {
    border-color: var(--kendo-color-border);
    color: var(--kendo-color-on-base);
    background-color: var(--kendo-color-base);
    border-radius: var(--kendo-border-radius-md);
}

.k-column-menu .k-button-solid-base:active {    
    background-image: none;
}

.k-treeview-toggle .k-icon {
    padding: 0 var(--kendo-spacing-1);
}

.k-treeview .k-treeview-item {
    font-size: 12px;
}

/*----------------------------------------------------------------------*/
/* Message Box
/*----------------------------------------------------------------------*/

#wl_msg {
    bottom: 10px;
    left: 38px;
    position: fixed;
    width: 350px;
    z-index: 50;
}

#wl_msg .msg-box:first-child {
    -moz-border-radius-topleft: 4px;
    -moz-border-radius-topright: 4px;
    -webkit-border-top-left-radius: 4px;
    -webkit-border-top-right-radius: 4px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

#wl_msg .msg-box:last-child {
    -moz-border-radius-bottomleft: 4px;
    -moz-border-radius-bottomright: 4px;
    -webkit-border-bottom-left-radius: 4px;
    -webkit-border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}

#wl_msg .msg-box, #wl_msg .msg-box-close {
    border: 1px solid;
    display: none;
    margin-bottom: 4px;
}

#wl_msg .msg-box-close {
    -moz-border-radius-bottomleft: 4px;
    -moz-border-radius-bottomright: 4px;
    -webkit-border-bottom-left-radius: 4px;
    -webkit-border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    cursor: pointer;
    text-align: center;
}

#wl_msg .msg-box-close:hover { }

#wl_msg .msg-box h3, #wl_msg .msg-close {
    font-weight: bold;
    height: 28px;
}

#wl_msg .msg-box h3 {
    border-bottom: 1px solid;
    float: left;
    font-size: 14px;
    line-height: 30px;
    margin: 0;
    padding-left: 8px;
    width: 310px;
}

#wl_msg .msg-close {
    background-position: 50% 50%;
    background-repeat: no-repeat;
    border-bottom: 1px solid;
    border-left: 1px solid;
    cursor: pointer;
    display: block;
    float: right;
    line-height: 1px;
    padding: 0;
    text-indent: -9999px;
    width: 25px;
}

#wl_msg .msg-close:hover { }

#wl_msg .msg-content {
    clear: both;
    padding: 10px;
}

/*----------------------------------------------------------------------*/

/* Message Box (Theme)
/*----------------------------------------------------------------------*/

#wl_msg .msg-box, #wl_msg .msg-box-close {
    background: #202020;
    background: -webkit-gradient(linear, left top, left bottom, from(#202020), to(#151515));
    
    background: -moz-linear-gradient(top, #202020, #151515);
    background: -o-linear-gradient(top, #202020, #151515);
    border-color: #e1e1e1;
    color: #f1f1f1;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#202020', endColorstr='#151515');
}

#wl_msg .msg-box-close { }

#wl_msg .msg-box-close:hover {
    background-color: #e1e1e1;
    color: #2e2e33;
}

#wl_msg .msg-box h3, #wl_msg .msg-close {
    background: #202020;
    color: #f1f1f1;
    text-shadow: 0 1px 0 #111111;
}

#wl_msg .msg-box h3 { border-bottom-color: #555555; }

#wl_msg .msg-close {
    background-image: url(../images/icons/lightcross.png);
    border-bottom-color: #555555;
    border-left-color: #555555;
}

#wl_msg .msg-close:hover {
    background-color: #e1e1e1;
    background-image: url(../images/icons/darkcross.png);
}

#wl_msg .msg-content { }


/*----------------------------------------------------------------------*/

/* Alert Boxes
/*----------------------------------------------------------------------*/

div.alert {
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    background-position: 5px 5px;
    background-repeat: no-repeat;
    border: 1px solid;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 700;
    margin: 0;
    padding: 10px 10px 10px 35px;
}

div.alert code {
    background: none;
    border: 0;
}

#content form div.alert { margin: 15px 4px; }

div.alert a {
    font-size: 14px;
    font-weight: 700;
}

/*----------------------------------------------------------------------*/

/* Alert Boxes (Theme)
/*----------------------------------------------------------------------*/

div.alert {
    background-color: #e6e6e6;
    border-color: #c7c7c7 #b2b2b2 #b2b2b2 #c7c7c7;
    color: black;
    font-weight: normal;
    margin-top: 2px;
    text-shadow: none;
}

div.alert a { color: #777777; }

div.alert a:hover { color: #444444; }

div.alert.red, div.alert.warning { background-color: #f0a8a8; }

div.alert.red:hover, div.alert.warning:hover { background-color: #f0cccc; }

div.alert.green, div.alert.success { background-color: #a2e8a2; }

div.alert.green:hover, div.alert.success:hover { background-color: #c5e8c5; }

div.alert.yellow, div.alert.note { background-color: #e8e8a2; }

div.alert.yellow:hover, div.alert.note:hover { background-color: #e8e8c5; }

div.alert.blue, div.alert.info { background-color: #a8f0f0; }

div.alert.blue:hover, div.alert.info:hover { background-color: #ccf0f0; }

div.alert.pink { background-color: #f0a8f0; }

div.alert.pink:hover { background-color: #f0ccf0; }

div.alert.purple { background-color: #aea8f0; }

div.alert.purple:hover { background-color: #cfccf0; }

div.alert.warning { background-image: url(../images/icons/darkalert.png); }

div.alert.success { background-image: url(../images/icons/darktick.png); }

div.alert.note {
    background-image: url(../images/icons/darklight_bulb.png);
    color: #000;
    font-size: 16px;
}

div.alert.info { background-image: url(../images/icons/darkinformation.png); }
@charset "UTF-8";

option:disabled, select[disabled] > option { color: #ccc; }

/* CSS Reset 3 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    border: 0;
    font: inherit;
    font-size: 100%;
    margin: 0;
    padding: 0;
    vertical-align: middle;
    word-spacing: 2px;
}

::-webkit-scrollbar {
    background-color: #eee;
    height: 10px;
    width: 8px;
}

::-webkit-scrollbar-thumb { background-color: #ccc; }

#newTicketWizard svg, .portal-kb-body-box svg {
    float: left;
    height: 60px;
    position: relative;
    width: 60px;
}

#newTicketWizard svg { margin-top: -7px; }

#newTicketWizard .selectRequestButton svg { margin-left: -7px }

.portal-kb-body-box svg { margin-top: -20px }

#newTicketWizard svg path.st0, .portal-kb-body-box svg path.st0 { fill: #f89115; }

#newTicketWizard svg path.st1, .portal-kb-body-box svg path.st1 { fill: #5F5F5F; }

#newTicketWizard a.thumbnail svg {
    height: 50%;
    width: 100%;
}



body.app-initializing { display: none; }

.blink_text {
    -moz-animation: 1s blinker linear infinite;
    -webkit-animation: 1s blinker linear infinite;
    animation: 1s blinker linear infinite;
    color: red;
}

at-svg-img svg {
    float: left;
    height: 48px;
    position: relative;
    width: 48px;
}

.management-menu at-svg-img svg,
.my-options-menu at-svg-img svg,
.cmdb-menu at-svg-img svg {
    float: left;
    height: 150px;
    margin: -10px;
    position: relative;
    width: 150px;
}

.management-menu at-svg-img svg .st0,
.my-options-menu at-svg-img svg .st0,
.cmdb-menu at-svg-img svg .st0 { fill: #ef7522; }

.management-menu at-svg-img svg .st1,
.my-options-menu at-svg-img svg .st1,
.cmdb-menu at-svg-img svg .st1 { fill: #555; }

@-moz-keyframes blinker {
    0% { opacity: 1.0; }

    50% { opacity: 0.5; }

    100% { opacity: 1.0; }
}

@-webkit-keyframes blinker {
    0% { opacity: 1.0; }

    50% { opacity: 0.5; }

    100% { opacity: 1.0; }
}

@keyframes blinker {
    0% { opacity: 1.0; }

    50% { opacity: 0.5; }

    100% { opacity: 1.0; }
}

div.indicator {
    background-color: #fafafa;
    border: 1px solid #DDD;
    padding: 25px;
    position: relative;
    text-align: center;
}

div.indicator .title {
    font-size: 12px;
    margin-top: -12px;
    padding-bottom: 12px;
}

div.indicator .sla {
    color: #fff;
    left: 61px;
    position: absolute;
    top: 75px;
    width: 40px;
}



svg.indicator {
    height: 60px;
    overflow: inherit;
    position: inherit;
    width: 60%;
}

svg.indicator g ellipse.SLStatus-0 { fill: #89A600; }

svg.indicator g ellipse.SLStatus-1 { fill: #E9CC03; }

svg.indicator g ellipse.SLStatus-2 { fill: #F29A3C; }

svg.indicator g ellipse.SLStatus-3 { fill: #D00; }

#roadmap-toggle { text-align: center; }

#roadmap-container { margin-top: 70px; }

.dialog-timer-form input { width: 340px; }

.jsPanel-hdr.jsPanel-theme-warning { font-family: inherit; }

.jsPanel-hdr.jsPanel-theme-default {
    background-color: #333;
    color: white;
    font-family: inherit;
}

.jsPanel-hdr.jsPanel-theme-success {
    background-color: #89A600;
    color: white;
    font-family: inherit;
}

.jsPanel-hdr.jsPanel-theme-medium {
    background-color: #b2bf75;
    color: #000000;
    font-family: inherit;
}

.jsPanel-hdr.jsPanel-theme-medium a {
    color: #000000;
    font-family: inherit;
}

.jsPanel-hdr.jsPanel-theme-medium a.client-name { font-weight: bold; }

.jsPanel-hdr.jsPanel-theme-success a {
    color: white;
    font-family: inherit;
}

.jsPanel-hdr.jsPanel-theme-medium h3 {
    color: #000000;
    font-family: inherit;
}

.jsPanel-hdr.jsPanel-theme-default h3 { color: inherit; }



.k-grouping-row p.k-reset { word-spacing: 0px; }


[ng-cloak] { display: none; }

input::-ms-clear { display: none !important; }

.badge {
    border-radius: 2px;
    margin-top: -4px;
    padding: 3px 9px;
}

.label-success, .badge-success {
    background: #89A600;
    border: 1px solid #89A600;
    color: #fff;
}

/* HTML5 display-role reset for older browsers */

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section { display: block; }

/* Touch enabled for IE */

html {
    -ms-touch-action: manipulation; /* IE 10  */
    touch-action: manipulation; /* IE 11+ */
}

.hidden-release { display: none; }

html.isDebug .hidden-release { display: block; }

html.appMode .hidden-app { display: none; }

html.helpmode { cursor: help; }

body {
    color: #363636;
    font-family: 'Lato', "Trebuchet MS", Arial, Helvetica, sans-serif !important;
    font-size: 13px;
    line-height: 1;
    min-width: 1035px;
}

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
    border-top: 1px #D3D3D3 solid;
}

/*------- Grid System (based on the 960 Grid System)  ---*/

.g1, .g2, .g3, .g4, .g5, .g6, .g7, .g8, .g9, .g10, .g11, .g12 {
    display: inline;
    float: left;
    margin-left: 1%;
    margin-right: 1%;
    min-height: 10px;
    padding: 8px 0;
}

.g1 { width: 6.333%; }

.g2 { width: 14.667%; }

.g3 { width: 23.0%; }

.g4 { width: 31.333%; }

.g5 { width: 39.667%; }

.g6 { width: 48.0%; }

.g7 { width: 56.333%; }

.g8 { width: 64.667%; }

.g9 { width: 73.0%; }

.g10 { width: 81.333%; }

.g11 { width: 89.667%; }

.g12 { width: 98%; }

.p1 { padding-left: 8.333%; }

.p2 { padding-left: 16.667%; }

.p3 { padding-left: 25.0%; }

.p4 { padding-left: 33.333%; }

.p5 { padding-left: 41.667%; }

.p6 { padding-left: 50.0%; }

.p7 { padding-left: 58.333%; }

.p8 { padding-left: 66.667%; }

.p9 { padding-left: 75.0%; }

.p10 { padding-left: 83.333%; }

.p11 { padding-left: 91.667%; }

.s1 { padding-right: 8.333%; }

.s2 { padding-right: 16.667%; }

.s3 { padding-right: 25.0%; }

.s4 { padding-right: 33.333%; }

.s5 { padding-right: 41.667%; }

.s6 { padding-right: 50.0%; }

.s7 { padding-right: 58.333%; }

.s8 { padding-right: 66.667%; }

.s9 { padding-right: 75.0%; }

.s10 { padding-right: 83.333%; }

.s11 { padding-right: 91.667%; }

.ps1 { left: 8.333%; }

.ps2 { left: 16.667%; }

.ps3 { left: 25.0%; }

.ps4 { left: 33.333%; }

.ps5 { left: 41.667%; }

.ps6 { left: 50.0%; }

.ps7 { left: 58.333%; }

.ps8 { left: 66.667%; }

.ps9 { left: 75.0%; }

.ps10 { left: 83.333%; }

.ps11 { left: 91.667%; }

.pl1 { left: -8.333%; }

.pl2 { left: -16.667%; }

.pl3 { left: -25.0%; }

.pl4 { left: -33.333%; }

.pl5 { left: -41.667%; }

.pl6 { left: -50.0%; }

.pl7 { left: -58.333%; }

.pl8 { left: -66.667%; }

.pl9 { left: -75.0%; }

.pl10 { left: -83.333%; }

.pl11 { left: -91.667%; }


/* C2 Styles New Internal Page */

input, textarea, select,
.k-editable-area,
.ui-widget-content .ui-state-default, .ui-state-default,
.c2AutoComplete .ui-combobox a.ui-button {
    margin: 2px 0px;
    padding: 5px;
    /*border: 1px solid #777;
    -moz-box-shadow: inset 0 0 3px 0px #888;
    -webkit-box-shadow: inset 0 0 3px 0px #888;
    box-shadow: inset 0 0 3px 0px #888;
    -moz-border-radius: 3px;
    border-radius: 3px;
    */
}

.ParametersManager input::-webkit-outer-spin-button,
.ParametersManager input::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0;
}

.ParametersManager .reset-users-and-groups-preferences {
    margin-bottom: -100%;
}

.ParametersManager .service-level-bar {
    height: 50px;
    width: 16px;
}

.ParametersManager .service-level-yellow {
    background-color: #E9CC03;
}

.ParametersManager .service-level-orange {
    background-color: #F29A3C;
}

.ParametersManager .service-level-red {
    background-color: #D00;
}

.ParametersManager .client-search-template-active-select {
    margin-left: 0;
}

.ParametersManager .saml-textarea {
    resize: vertical;
}
.ParametersManager .errorLabel {
    padding-top: 30px;
}
.ClientManagementForm .c2AutoComplete .ui-combobox a.ui-button {
    left: -2px;
}

.appMode #SearchControl input, .ui-tabs-nav .ui-state-default, input[type="checkbox"], input[type="radio"] {
    -moz-border-radius: 0px;
    -moz-box-shadow: inset 0 0 0 0px;
    -webkit-box-shadow: inset 0 0 0 0;
    border: 0;
    border-radius: 0px;
    box-shadow: inset 0 0 0 0;
    vertical-align: middle;
}

input.ui-combobox-input.ui-autocomplete-input { border-radius: 3px 0 0 3px; }

.ui-state-default.ui-tooltip-close.ui-tooltip-icon { padding: 0; }


html { overflow-y: scroll; }

a {
    color: #363636;
    text-decoration: none;
}

.placeholder { color: #B1B1B1; }

/* Commons */

.bold { font-weight: 700; }

.spacedForm { margin: 5px 5px 5px 5px; }

.buttonDialogBottomSet, .buttonDialogUpperSet {
    display: inline-block;
    float: right;
}

.clear {
    clear: both;
    font-size: 0;
    height: 0;
}

.left { float: left; }

.right { float: right; }

.error { color: red; }

.warning-text { color: #363636; }

.warning-button { background-color: #ffdd00; }

.noPaddingBottom { padding: 9px 0 0 0; }

.noPaddingTop { padding: 0 0 9px 0; }

.formPadding { padding: 5px 0 5px 0; }

.ui-tooltip-content .error { color: white; }


#changePasswordDialog section,
#clientExportImportConfigurationForm section {
    padding-bottom: 10px;
    padding-left: 10px;
}

#changePasswordDialog input,
#clientExportImportConfigurationForm input { width: 92%; }

#clientExportImportConfigurationForm input[type=checkbox] { width: auto; }

#clientExportImportConfigurationForm ul { margin: 10px 25px; }

#clientExportImportConfigurationForm label.for-checkbox { display: initial; }

#clientExportImportConfigurationForm .message {
    color: black;
    font-weight: bold;
}

#selectLanguageDialog select { width: 99%; }

/* JQuery Validation Style */

.val-hasError, .val-hasError2, input.ng-invalid, .validation-failed, select.ng-invalid { outline: 1px solid red !important; }

label.validation-failed {
    background-color: #C44747;
    border: none !important;
    border-radius: 4px;
    color: #FFFFFF;
    padding: 4px;
}

.custom-button-control .val-hasError2 {
    display: inline-block;
    padding: 2px 5px;
}

/* Titres des sections et des widgets de gauche */

.widgetTitle {
    border-bottom: 1px solid #D3D3D3;
    font-size: 18px;
    margin-bottom: 7px;
    padding-bottom: 3px;
}

.widgetTitle.no-border { border: none; }

.dashboardTitle { font-size: 16px; }

.sectionTitle {
    background-color: #f5f5f5;
    border-bottom: 1px solid #D3D3D3;
    border-top: 2px solid #88a600;
    font-size: 15px;
    font-weight: bold;
    height: 20px;
    padding: 5px;
}

.handle {
    background-color: #f1f1f1;
    border-bottom: 1px solid #D3D3D3;
    font-size: 15px;
    font-weight: bold;
    margin-bottom: 4px;
    margin-bottom: 20px;
    padding: 6px 5px;
    padding-bottom: 3px;
}


.noCollapsibleSectionHeader,
.collapsibleSectionHeader {
    background-color: #f5f5f5;
    border-bottom: 1px solid #f5f5f5;
    border-top: 2px solid rgba(136, 166, 0, .6);
    font-size: 14px;
    font-weight: bold;
    height: 16px;
    margin-top: 6px;
    padding-left: 6px;
    padding-top: 8px;
}

.collapsibleSectionHeader:hover { border-top: 2px solid #ff9334; }

div.g2.collapse-button { margin-top: 2px; }

.ticketFull .collapsibleSectionHeader { padding-bottom: 4px; }

.ticketFull .collapsibleSectionHeader.expanded { background-position: top 10px right 10px; }

.ticketFull .collapsibleSectionHeader.collapsed { background-position: top 10px right 10px; }

.ticketFull .collapsibleSectionHeader em { vertical-align: initial; }

.ticketEmailForm h4.collapsibleSectionHeader { padding-bottom: 4px; }

.ticketEmailForm .collapsibleSectionHeader.expanded { background-position: top 10px right 10px; }

.ticketEmailForm .collapsibleSectionHeader.collapsed { background-position: top 10px right 10px; }

.ticketEmailForm .collapsibleSectionHeader em { vertical-align: initial; }

.collapsibleSectionHeader.expanded {
    background-image: url(../images/collapse.png);
    background-position: top 8px right 10px;
    background-repeat: no-repeat;
    background-size: 10px 6px;
    cursor: pointer;
}


.collapsibleSectionHeader.collapsed {
    background-image: url(../images/expand.png);
    background-position: top 8px right 10px;
    background-repeat: no-repeat;
    background-size: 10px 6px;
    cursor: pointer;
}

html.isDebug .collapsibleSectionHeader .watchers {
    color: #888;
    display: inline-block;
    font-size: 10px;
    padding-left: 5px;
    position: absolute;
}

/* Token Error */

.TokenForm { text-align: center; }

.TokenForm section {
    background-color: white;
    border: 1px solid black;
    margin: auto;
    margin-top: 50px;
    padding: 30px;
    text-align: center;
    width: 500px;
}

.TokenForm h2 {
    font-size: 18px;
    font-weight: bold;
    height: 40px;
}

.TokenForm h1 {
    font-size: 18px;
    font-weight: bold;
    margin: 20px 0;
    text-align: center;
}

.TokenForm a {
    color: royalblue;
    text-decoration: underline;
}

.TokenForm h3 {
    font-size: 14px;
    font-weight: bold;
    margin: 24px;
}

.TokenForm ul {
    text-align: start;
    word-break: break-all;
    list-style: disc;
    margin: 0 60px 30px;
}

.TokenForm ul li:not(:last-child) {
    margin-bottom: 8px;
}

.TokenForm .selectedClaim {
    color: #89A600;
    font-weight: bold;
}

.TokenForm .noClaimsSelected {
    color: red;
    font-weight: bold;
}

/* Header */

#alert-area { text-align: center; }

#pageoptions { display: none; }

#pageoptions a { font-size: 11px; }

#pageoptions ul li {
    display: block;
    float: right;
    padding-right: 15px;
}

#pageoptions div { display: none; }

header.layout_header {
    background-color: #333;
    height: 62px;
    position: relative;
    width: 100%;
    z-index: 1030;
}

/* TRAINING VIDEOS - start */

#training {
    color: #ffffff;
    height: 375px;
    top: 0;
    width: 100%;
}

#training .outer-box {
    margin: 0 auto;
    padding-top: 11px;
    width: 1040px;
}

#training .inner-box {
    background: #5e5e5e;
    margin-left: 0;
    padding: 7px;
    width: 1024px;
}

#training .video-description {
    height: 269px;
    line-height: 1.5em;
    overflow-y: auto;
}

#training .video-description ol.decimal { list-style-type: decimal; }

#training .video-description ol.roman { list-style-type: lower-roman; }

#training .video-description ol li {
    margin-left: 25px;
    padding: 3px 0 3px 0;
}

#training .video-description p {
    color: #dddddd;
    margin: 5px 0 5px 0;
}

#training-video {
    height: 327px;
    width: 582px;
}

#training .has-no-video {
    font-size: 110%;
    padding: 150px 20px;
    text-align: center;
    text-transform: uppercase;
}

/* TRAINING VIDEOS - end */

header.portalMode { margin-bottom: 20px; }

header.headerNoPadding {
    left: 0;
    position: absolute;
    top: 0;
}

#header {
    clear: both;
    height: 62px;
    margin-right: 5px;
    padding-left: 10px;
}

#header-logo {
    background-image: url(../images/logo.svg);
    background-size: 52px 52px;
    background-position: center;
    background-repeat: no-repeat;
    float: left;
    height: 62px;
    width: 62px;
}

#header .g7 {
    margin: 0;
    padding: 0;
}

#nav {
    float: left;
    height: 62px;
    list-style: none;
    z-index: 50;
}

#nav li {
    float: left;
    height: 30px;
    padding: 15px 10px;
    position: relative;
}

#nav a {
    color: #fff;
    display: block;
    font-size: 14px;
    padding: 5px;
    text-decoration: none;
    text-transform: uppercase;
}

#nav a:hover { color: #fff; }

#nav .nav_header > a { padding: 10px 5px 10px 5px; }

/*--- Dropdown ---*/

#nav ul {
    background: #fff;
    background: rgba(255, 255, 255, 0);
    border-right: 1px #333 solid;
    left: -9999px;
    list-style: none;
    position: absolute;
}

#nav ul li {
    float: none;
    min-width: 150px;
    padding-top: 1px;
}

#nav ul a { white-space: nowrap; }

#nav li:hover ul {
    background: #333;
    left: 0;
    margin: 0;
    min-width: 150px;
    padding: 0;
    top: 60px;
}

#nav li ul li {
    height: 2em;
    padding: 0 0 5px 0;
}

#nav li ul li a {
    font-size: 14px;
    line-height: 1em;
    text-transform: none;
}

#nav li ul li.separator {
    border-top: 1px solid #FFF !important;
    height: 0;
    margin: 2px 0;
    padding: 0;
}

#nav li:hover ul li:hover {
    background: #545454;
    /*color: #F26522;*/
}

/*#nav li.disabledMenu { color:#202020;padding: 0 0 5px 0;}*/

#nav li.disabledMenu {
    background: #454545;
    color: #202020;
    padding: 0 0 5px 0;
}

#nav li.disabledMenu a { color: #333333; }

#nav li:hover ul li.disabledMenu:hover { background: #454545; }

#nav li.disabledMenu:hover a {
    background: #454545;
    color: #333333;
    cursor: default;
}

/* Controles */

.headerControls {
    float: left;
    width: 250px;
}

.headerControls ul, .headerControls ul { padding: 25px 10px 0 0; }

.headerControls ul li {
    color: #FFF;
    display: block;
    float: right;
    font-size: 11px;
    font-size: 11px;
    line-height: 12px;
    margin: 0;
    padding: 0 5px;
}

.headerControls ul li:first-child { border-left: 1px solid #FFF; }

.headerControls ul li a {
    color: #FFF;
    font-size: 11px;
    line-height: 12px;
    margin: 0;
    padding: 0 3px;
    text-decoration: underline;
}

/* Barre de recherche */

.appMode #SearchControl {
    float: left;
    margin-right: 8px;
}

.appMode #SearchControl #SearchTerm {
    border: 0;
    border: 1px solid #686868;
    border-bottom-left-radius: 2px;
    border-right: 0px;
    border-top-left-radius: 2px;
    color: #999;
    display: block;
    float: left;
    font-style: italic;
    height: 18px;
    margin-top: -2px;
    padding: 0.5em;
}

.appMode #SearchControl #SearchSubmit {
    background-color: #CCC;
    border: 1px solid #686868;
    border-bottom-right-radius: 2px;
    border-left: 0;
    border-top-right-radius: 2px;
    cursor: pointer;
    display: block;
    float: left;
    height: 33px;
    margin: 1px 0 0 0;
    margin-right: 8px;
    margin-top: -2px;
    padding: 6px;
    width: 35px;
}

.appMode #SearchControl #SearchSubmit:hover { background-color: #999; }

.appMode #SearchControl #ClearSearch {
    background: url(../images/delete.png) no-repeat;
    background-position: 7px 4px;
    background-size: 8px 8px;
    border: 0;
    cursor: pointer;
    height: 16px;
    margin-left: -96px;
    margin-top: 7px;
    width: 16px !important;
}

.ticketFull .TicketFollowUpSection input:disabled, .ticketFull .TicketFollowUpSection select:disabled {
    border: 0;
    font-weight: bold;
}

textarea:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="color"]:focus, .uneditable-input:focus {
    border: 1px solid rgba(255, 100, 0, 0.5);
    box-shadow: none;
    outline: 1px auto rgba(255, 100, 0, 0.5);
}

select:focus, input[type="file"]:focus, input[type="radio"]:focus, input[type="checkbox"]:focus {
    border: 1px solid rgba(255, 100, 0, 0.5);
    outline: 1px auto rgba(255, 100, 0, 0.5);
}

textarea.highlighted, input.highlighted[type="text"], input.highlighted[type="password"], input.highlighted[type="datetime"], input.highlighted[type="datetime-local"], input.highlighted[type="date"], input.highlighted[type="month"], input.highlighted[type="time"], input.highlighted[type="week"], input.highlighted[type="number"], input.highlighted[type="email"], input.highlighted[type="url"], input.highlighted[type="search"], input.highlighted[type="tel"], input.highlighted[type="color"], .uneditable-input.highlighted {
    border-color: rgba(255, 100, 0, 0.5);
    box-shadow: none;
    outline: 1px auto rgba(255, 100, 0, 0.5);
}

div.highlighted {
    border: 1px solid rgba(255, 100, 0, 0.5);
    outline: 1px auto rgba(255, 100, 0, 0.5);
}

select.highlighted, input.highlighted[type="file"], input.highlighted[type="radio"], input.highlighted[type="checkbox"] {
    border: 1px solid rgba(255, 100, 0, 0.5);
    outline: none;
    outline: 1px auto rgba(255, 100, 0, 0.5);
}

section#content {
    clear: both;
    margin: 0 auto;
    margin-top: 3px;
}

.domHide { display: none !important; }

/* Boutons sous header */

.upperNavBar { margin: 10px 0 20px 0; }

.upperNavBar button {
    margin-right: 1%;
    text-transform: uppercase;
}

/* KendoUi Grid */

.k-selectable tbody tr, .k-selectable-custom tbody tr {
    cursor: default;
    height: 35px;
}

/* Waiting animated gif */

.loading { min-height: 75px; }

.loadmask {
    -moz-opacity: 0.75;
    background-color: #FAFAFA;
    cursor: wait;
    filter: alpha(opacity=75);
    height: 100%;
    left: 0;
    opacity: .75;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 20;
    zoom: 1;
}

.loadmask-msg {
    left: 0;
    position: absolute;
    top: 0;
    z-index: 25;
}

.loadmask-msg div {
    background: url(../images/loadingAtom.png) no-repeat;
    background-position: center;
    cursor: wait;
    height: 64px;
    padding: 5px 10px 5px 25px;
    width: 64px;
}

.masked { overflow: hidden !important; }

.masked-relative { position: relative !important; }

.masked-hidden { visibility: hidden !important; }

.loading-image { background-image: url(../images/loadingAtom.png); }

.k-loading-mask .k-loading-image {
    -moz-opacity: 0.75;
    background-color: #FAFAFA;
    background-image: url(../images/loadingAtom.png);
    background-repeat: no-repeat;
    background-position: center;
    filter: alpha(opacity=75);
    opacity: .75;
}

.k-loading-mask .k-loading-image::before,
.k-loading-mask .k-loading-image::after {
    display: none;
}

/* Ticket grid */
.k-selectable, .k-selectable-custom {
    table-layout: fixed;
    width: 100%;
}

.k-table-td {
    border: 1px solid #d3d3d3 !important;
    border-bottom: none !important;
    border-right: none !important;
}
.k-grid .k-table-td:last-child {
    border-right: 1px solid #d3d3d3 !important;
}
.k-grid .k-table-td:last-child {
    border-right: 1px solid #d3d3d3 !important;
}
.k-grid .k-table-row:last-child > .k-table-td {
    border-bottom: 1px solid #d3d3d3 !important;
}

.k-grouping-header { margin: 0 0 0 0; }

#MainTabs table.k-selectable tr td.greybg { background-color: #f0f0f0; }

#MainTabs table.k-selectable tr td span.sequenceNumber {
    display: block;
    float: left;
    width: 50%;
}

#MainTabs span.priority1-image {
    background-color: #DD0000;
    border-radius: 8px;
    box-shadow: 1px 2px 2px grey;
    display: block;
    height: 16px;
    width: 16px;
}

#MainTabs span.priority1-image:after {
    color: #d8b8b8;
    content: "1";
    font-size: smaller;
    font-weight: bold;
    left: 5px;
    position: relative;
    top: -2px;
}

#MainTabs span.priority2-image {
    background-color: #f29a3c;
    border-radius: 8px;
    box-shadow: 1px 2px 2px grey;
    display: block;
    height: 16px;
    width: 16px;
}

#MainTabs span.priority2-image:after {
    color: #333;
    content: "2";
    font-size: smaller;
    font-weight: bold;
    left: 5px;
    position: relative;
    top: -2px;
}

#MainTabs span.priority3-image {
    background-color: yellow;
    border-radius: 8px;
    box-shadow: 1px 2px 2px grey;
    display: block;
    height: 16px;
    width: 16px;
}

#MainTabs span.priority3-image:after {
    color: #333;
    content: "3";
    font-size: smaller;
    font-weight: bold;
    left: 5px;
    position: relative;
    top: -2px;
}

#MainTabs span.priority4-image {
    background-color: #89A600;
    border-radius: 8px;
    box-shadow: 1px 2px 2px grey;
    display: block;
    height: 16px;
    width: 16px;
}

#MainTabs span.priority4-image:after {
    color: #333;
    content: "4";
    font-size: smaller;
    font-weight: bold;
    left: 5px;
    position: relative;
    top: -2px;
}

#MainTabs span.priority5-image {
    background-color: #e0e0e0;
    border-radius: 8px;
    box-shadow: 1px 2px 2px grey;
    display: block;
    height: 16px;
    width: 16px;
}

#MainTabs span.priority5-image:after {
    color: #333;
    content: "5";
    font-size: smaller;
    font-weight: bold;
    left: 5px;
    position: relative;
    top: -2px;
}

#MainTabs .ticketHeader span.priority1-image:after,
#MainTabs .ticketHeader span.priority2-image:after,
#MainTabs .ticketHeader span.priority3-image:after,
#MainTabs .ticketHeader span.priority4-image:after,
#MainTabs .ticketHeader span.priority5-image:after { top: 1px; }

#MainTabs #ticket-kanban span.priority1-image:after,
#MainTabs #ticket-kanban span.priority2-image:after,
#MainTabs #ticket-kanban span.priority3-image:after,
#MainTabs #ticket-kanban span.priority4-image:after,
#MainTabs #ticket-kanban span.priority5-image:after { top: 1px; }

#MainTabs table.k-selectable tr td.SLStatus-0 {
    background-color: #89A600 !important;
    margin: 0;
    padding: 0;
}

#MainTabs table.k-selectable tr td.SLStatus-1 {
    background-color: #E9CC03 !important;
    margin: 0;
    padding: 0;
}

#MainTabs table.k-selectable tr td.SLStatus-2 {
    background-color: #F29A3C !important;
    margin: 0;
    padding: 0;
}

#MainTabs table.k-selectable tr td.SLStatus-3 {
    background-color: #D00 !important;
    margin: 0;
    padding: 0;
}

span.SLStatus-image-0 {
    background: #f0f0f0;
    display: inline-block;
    height: 16px;
    width: 16px;
}

.ticketHeader { background-color: #EFEFEF; }

.ticketHeader.bg-white { background-color: #FFFFFF; }

.ticketHeader span.SLStatus-image-0 {
    background: inherit;
    color: #89A600;
}

span.SLStatus-image-0 {
    background: #E9CC03;
    display: inline-block;
    height: 16px;
    width: 16px;
}

.ticketHeader span.SLStatus-image-1 {
    background: inherit;
    color: #E9CC03;
}

span.SLStatus-image-2 {
    background: #FF6C00;
    display: inline-block;
    height: 16px;
    width: 16px;
}

.ticketHeader span.SLStatus-image-2 {
    background: inherit;
    color: #FF6C00;
}

span.SLStatus-image-3 {
    background: #D77;
    display: inline-block;
    height: 16px;
    width: 16px;
}

.ticketHeader span.SLStatus-image-3 {
    background: inherit;
    color: #D77;
}


span.target-1-image {
    background: url(../images/icons/folder_bw.png) center center no-repeat;
    display: inline-block;
    height: 18px;
    width: 19px;
}

span.target-0-image {
    background: url(../images/icons/incident_ticket.png) center center no-repeat;
    display: inline-block;
    height: 18px;
    width: 19px;
}


span.Incident-image, span._d2b1fcc4-723d-4c36-ba1a-6f91b11d5c1c-image {
    background: url(../images/icons/incident_ticket.png) center center no-repeat;
    display: inline-block;
    height: 19px;
    vertical-align: top;
    width: 19px;
}

span.ServiceRequest-image, span._19f57377-94fd-4391-a154-577446131999-image {
    background: transparent url(../images/icons/service_request_ticket.png) center center no-repeat;
    display: inline-block;
    height: 19px;
    vertical-align: top;
    width: 19px;
}

span.Problem-image, span._acc5dff2-b0f4-40bc-bd98-e45a37b87faa-image {
    background: url(../images/icons/problem_ticket.png) center center no-repeat;
    display: inline-block;
    height: 19px;
    vertical-align: top;
    width: 19px;
}

span.ChangeRequest-image, span._d3d76203-bc9f-4b59-a105-68bd9f236e6a-image {
    background: url(../images/icons/change_request_ticket.png) center center no-repeat;
    display: inline-block;
    height: 19px;
    vertical-align: top;
    width: 19px;
}

span.Project-image, span._df1f87cb-3979-4ce7-9bd3-b0716869e34b-image {
    background: url(../images/icons/project_ticket.png) center center no-repeat;
    display: inline-block;
    height: 19px;
    vertical-align: top;
    width: 19px;
}

span.Task-image, span.TaskTemplate-image, span._e2609e13-0d39-4223-88a5-7090637706ee-image {
    background: transparent url(../images/icons/task_ticket.png) center center no-repeat;
    display: inline-block;
    height: 19px;
    vertical-align: top;
    width: 19px;
}

span.ApprovalTemplate-image, span.Approval-image, span._96e81cd0-9e90-4625-937b-1ad681d08543-image {
    background: transparent url(../images/icons/ticket_flag_locked.png) center center no-repeat;
    display: inline-block;
    height: 19px;
    vertical-align: top;
    width: 19px;
}

.request-workflow-container span._d2b1fcc4-723d-4c36-ba1a-6f91b11d5c1c-image { background: url(../images/icons/incident_ticket_white.png) center center no-repeat; }

.request-workflow-container span._19f57377-94fd-4391-a154-577446131999-image { background: transparent url(../images/icons/service_request_ticket_white.png) center center no-repeat; }

.request-workflow-container span._acc5dff2-b0f4-40bc-bd98-e45a37b87faa-image { background: url(../images/icons/problem_ticket_white.png) center center no-repeat; }

.request-workflow-container span._d3d76203-bc9f-4b59-a105-68bd9f236e6a-image { background: url(../images/icons/change_request_ticket_white.png) center center no-repeat; }

.request-workflow-container span._df1f87cb-3979-4ce7-9bd3-b0716869e34b-image { background: url(../images/icons/project_ticket_white.png) center center no-repeat; }

.request-workflow-container span._e2609e13-0d39-4223-88a5-7090637706ee-image { background: transparent url(../images/icons/task_ticket_white.png) center center no-repeat; }

.request-workflow-container span._96e81cd0-9e90-4625-937b-1ad681d08543-image { background: transparent url(../images/icons/ticket_flag_locked_white.png) center center no-repeat; }

#MainTabs table.k-selectable tr td span.ticket_status_new-image {
    background: transparent url(../images/icons/ticket_status_new.png) center center no-repeat;
    display: block;
    height: 18px;
    width: 19px;
}

#MainTabs table.k-selectable tr td span.ticket_status_closed-image {
    background: transparent url(../images/icons/ticket_status_closed.png) center center no-repeat;
    display: block;
    height: 18px;
    width: 19px;
}

#MainTabs table.k-selectable tr td span.ticket_status_in_progress-image {
    background: transparent url(../images/icons/ticket_status_in_progress.png) center center no-repeat;
    display: block;
    height: 18px;
    width: 19px;
}

#MainTabs table.k-selectable tr td span.ticket_status_assigned-image {
    background: transparent url(../images/icons/ticket_status_assigned.png) center center no-repeat;
    display: block;
    height: 18px;
    width: 19px;
}

#MainTabs table.k-selectable tr td span.ticket_flag_locked-image,
table.k-selectable-custom tr td span.ticket_flag_locked-image {
    background: transparent url(../images/icons/ticket_flag_locked.png) center center no-repeat;
    display: block;
    float: right;
    height: 18px;
    padding-right: 5px;
    width: 19px;
}

#MainTabs table.k-selectable tr td span.ticket_flag_unlocked-image,
table.k-selectable-custom tr td span.ticket_flag_unlocked-image {
    background: transparent url(../images/icons/ticket_flag_unlocked.png) center center no-repeat;
    display: block;
    float: right;
    height: 18px;
    padding-right: 5px;
    width: 19px;
}

#MainTabs table.k-selectable tr td span.icon-ticket-draft {
    background: transparent url(../images/icons/draft20x20.png) center center no-repeat;
    display: block;
    float: right;
    height: 20px;
    padding-right: 2px;
    width: 20px;
}

.appMode #MainTabs table.k-selectable tr td span.task_flag_blocked-image {
    background: transparent url(../images/task_blocked.png) center center no-repeat;
    display: block;
    float: right;
    height: 18px;
    padding-right: 5px;
    width: 19px;
    background-size: 19px 18px;
}

/* Sous-menu */

img.flagInformation { padding-left: 6px; }

#MainTabs {
    border: 0px;
    margin-top: 5px;
    padding-bottom: 32px;
}

#MainTabs .ui-widget-header { border: 0px; }

#MainTabs .ui-tabs-nav {
    background-color: white;
    border-color: #838383;
    border-width: 1px 1px 0 1px;
    height: 32px;
    margin: 0;
    padding: 0;
    position: relative;
}

#MainTabs .ui-corner-all { border-radius: 4px 4px 0 0; }

#MainTabs .ui-tabs-nav { border-radius: 0; }
#MainTabs .ui-tabs-nav li {
    background: #e0e0e0;
    border: 1px solid #e0e0e0;
    bottom: 0;
    bottom: 0;
    height: 26px;
    left: 0;
    line-height: 19px;
    margin: 0;
    margin-right: 2px;
    padding: 5px 45px 0 5px;
    position: relative;
    top: 0 !important;
}

#MainTabs .ui-tabs-nav li.ui-state-active {
    background: white;
    border: 1px solid #cccccc;
    border-bottom: none;
    font-weight: bold;
    height: 28px;
    left: 0;
    line-height: 16px;
    margin-top: -1px;
    top: 0;
}

#MainTabs .ui-tabs-nav li a {
    float: left;
    margin-left: 0;
    overflow: hidden;
    padding-left: 0;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#MainTabs .ui-tabs-nav li.ui-state-active a {
    color: #333;
    font-size: 14px;
    padding-top: 4px;
}

#MainTabs .ui-tabs-nav li:first-child { width: 100px; }

#MainTabs .ui-tabs-nav li:first-child a {
    margin-left: 10px;
    width: 100%;
}

#MainTabs .ui-tabs-nav li.no-pin { padding-right: 25px; }

#MainTabs .ui-tabs-nav li.no-pin .pin-tab { display: none; }

.ui-tabs .ui-tabs-panel {
    background: none repeat scroll 0 0 transparent;
    border-width: 1px;
    display: block;
    padding: 0px;
}

form[name=TicketsGridAdvancedSearchForm] { border-left: 0 !important; }

#TicketsTab, .ui-tabs-panel {
    background-color: white;
    border-color: #ccc;
    border-width: 1px;
}

#TicketsTab form {
    border-left: 1px solid #d0d0d0;
    padding-left: 2%;
    position: relative;
    width: 97%;
}

#TicketsTab .TicketsTabTable {
    border: none;
    margin-top: 6px;
    min-height: 200px;
    table-layout: fixed;
    width: 100%;
}

#TicketsTab .TicketsTabGrid {
    border-left: 1px solid #999;
    vertical-align: top;
}

#TicketsTab .TicketsTabMenu {
    border: none;
    overflow: hidden;
    padding-left: 6px;
    vertical-align: top;
    white-space: nowrap;
    width: 250px;
}

.ticketGridToolbar {
    background: #f5f5f5;
    border-bottom: lightgray 1px solid;
    margin-bottom: 4px;
    padding: 9px 10px;
    position: relative;
}

.ticketsPortalToolbar { display: none; }

.eventGridExport {
    position: relative;
    right: 7px;
    text-align: right;
    top: -4px;
}

.widget-slide,
.ticketGridSlideBtn { font-size: 1px; }

.widget-slide button,
.btnTicketGridSlide {
    border: 0px;
    cursor: pointer;
    height: 71px;
    margin-top: 50px;
    outline: none;
    position: absolute;
    width: 20px;
    z-index: 15;
}

.widget-slide button.close,
.ticketGridSlideBtn .btnTicketGridSlide.close { background: transparent url(../images/slide_btn_left.png) left top no-repeat; }

.widget-slide button.open,
.ticketGridSlideBtn .btnTicketGridSlide.open {
    background: transparent url(../images/slide_btn.png) left top no-repeat;
    margin-left: -2px;
}

.widget-slide button.close { left: 290px; }

#TicketsTab .widget-slide button.close { left: 239px; }

#TicketsTab .ticketGridSlideBtn .btnTicketGridSlide.close { left: 238px; }

.ticketFormRight { border-left: 1px solid lightgray; }

.ticketFormRight .btnTicketGridSlide.fixed {
    position: fixed;
    top: 55%;
}

.ticketFormRight .ticketGridSlideBtn .btnTicketGridSlide.close { margin-left: -21px; }


.ticketFormRight .ticketGridSlideBtn .btnTicketGridSlide.open { margin-left: -3px; }

#MainTabs #TicketsTab form fieldset {
    background: none;
    background-color: #fff;
    border: 0px;
    padding: 0;
}

#MainTabs #TicketsTab form fieldset label {
    background: url(../images/login_btn_bg.png) center center no-repeat;
    height: 29px;
    line-height: 29px;
    margin: 0;
    padding: 0;
    text-align: center;
    text-shadow: 0.05em 0.05em #f3f8db;
    width: 402px;
}

/* Selected row */
tr.k-selected > td {
    background-color: #dfdfdf !important;
}

/* Fix k-selected class that stick on Kendo UI grids cells */
/* Odd rows */
tr.k-alt td.k-selected {
    background-color: #f5f5f5 !important;
}
tr.k-alt.k-selected td.k-selected {
    background-color: #dfdfdf !important;
}

/* Even rows */
tr:not(.k-alt):not(:hover) td.k-selected {
    background-color: white !important;
}
tr.k-selected:not(.k-alt):not(:hover) td.k-selected {
    background-color: #dfdfdf !important;
}

/* Selected cell border */
.k-grid td.k-selected {
    border: 1px solid #d3d3d3
}

/* Ticket grid advanced search */

.ticketGridAdvanced {
    line-height: 25px;
    padding: 0 30px 0 10px;
    width: 94%;
}

.advancedSearchOptions {
    background: #f0f0f0;
    font-size: 90%;
}

.advancedSearchOptions p {
    display: block;
    float: left;
    height: 30px;
    line-height: 30px;
    margin-bottom: 10px;
    margin-right: 2%;
    width: 31%;
}

p.lineLast { margin-right: 0%; }

.advancedSearchOptions p label {
    display: block;
    float: left;
    margin-right: 3%;
    text-align: right;
    width: 35%;
}

.advancedSearchOptions p input, .advancedFormOptionsContent p select {
    padding: 5px 2px;
    width: 55%;
}

.advancedSearchDates {
    border-top: 1px solid #d3d3d3;
    float: left;
    padding: 7px 0 0;
    width: 100%;
}

.advancedSearchDates p { width: 47%; }

.smallInput { width: 65px !important; }

.advancedSearchButtonBar {
    padding: 0 2%;
    text-align: right;
    width: 94%;
}

.advancedSearchButtonBar button { text-transform: uppercase; }

section .clear.separator {
    border-bottom: 1px solid #d3d3d3;
    margin-bottom: 10px;
    padding-top: 10px;
}

/* Ticket preview */

span.ellipsis {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

span.infoData.ellipsis { max-width: 300px; }

div.infoData { padding-left: 10px; }

span.activityNewValue.ellipsis,
span.activityOldValue.ellipsis { max-width: 65%; }

.previewButtonBar {
    background-color: #F0F0F0;
    padding: 15px 0;
    text-align: right;
    width: 100%;
}

.previewButtonBar button {
    margin-right: 1%;
    text-transform: uppercase;
}

#ticketPreviewData tr td { line-height: 1em; }

#TicketPreviewWidget { margin-right: 2%; }

.ticketPreviewTitle { font-weight: bold; }

#TicketsTab .k-detail-cell, .k-detail-cell .g12 {
    margin: 0;
    padding: 0;
}

#TicketsTab .k-detail-cell {
    background-color: #F0F0F0;
    padding: 0 15px 15px 15px !important;
}

.ticketPreviewFull {
    background-color: #FFF;
    width: 100%;
}

.ticketPreviewFull h3.handle { margin-bottom: 10px; }

.ticketPreviewFull i.widgetIcon {
    margin: 4px 4px 0 0;
}

.ticketTasksList, .ticketNotesList {
    margin: 0 0 5px 0;
    padding: 0;
}

.ticketTasksList .is-workflow-done {
    color: gray;
    font-style: italic;
}

.ticketTasksList .is-workflow-done a {
    color: gray;
    font-style: normal;
}

.scrollableContent {
    max-height: 100px;
    overflow: auto;
}

.ticketTasksList h4, .noteHeading {
    color: #999;
    font-size: 1.2em;
    margin: 0 0 5px 0;
    padding-right: 12px;
}

.ticketTasksList h4, .noteCreatorHeading {
    color: #999;
    font-size: 1.2em;
    margin: 0 0 5px 0;
}

.ticketTasksList span { }

.ticketPreviewActivitiesBlock {
    display: block;
    font-size: 1em;
    margin: 0 0 25px 0;
}

p.noteHeading {
    clear: left;
    padding-top: 15px;
}

span.activityFieldName {
    display: inline-block;
    width: 150px;
}

span.activityNewValue { }

span.activityOldValue { padding-left: 20px; }

.ticketNotesWidget .loading {
    max-height: 250px;
    overflow: auto;
    padding: 0;
}

.ticketPreviewActivitiesContainer { margin: 15px 0; }

.ticketWorkflowsWidget { margin: 0 0 2% 0; }

.previewTableField, .activityFieldName {
    font-weight: bold;
    text-transform: uppercase;
}

.activityOldValue {
    color: #999;
    font-style: italic;
    padding-left: 20px;
}

.widget { padding-bottom: 10px; }

.widgetContent {
    max-height: 250px;
    overflow-y: auto;
}

.grid-widget .widgetContent { max-height: inherit; }

.portalMode .widgetContent { overflow-x: hidden; }

.ci-form,
.client-form,
.enterprise-form { position: relative; }

.ci-form .manager-form,
.client-form .manager-form,
.enterprise-form .manager-form { margin-top: 40px; }

.manager-form.header-contains-message {
    margin-top: 62px;
}

.manager-form.header-contains-message-and-externalId-long-title {
    margin-top: 200px !important;
}
.manager-form.header-contains-externalId-long-title {
    margin-top: 180px !important;
}
.manager-form.header-contains-message-long-title {
    margin-top: 120px !important;
}
.manager-form.long-title {
    margin-top: 90px !important;
}

/* Page Ticket */
.ticketFooterSection {
    float: right;
}

.ticketFull {
    overflow: visible; /*For the client typeahead*/
    position: relative;
    width: 100%;
}

.ticketFull .custom-fields.g6 { margin-left: 1%; }

.ticketFull.readOnly .icon-remove { display: none; }

.ticketFull.draft-ticket { background: repeating-linear-gradient(45deg, rgba(0, 0, 0, 0.04), rgba(0, 0, 0, 0.04) 2px, rgba(0, 0, 0, 0.0) 2px, rgba(0, 0, 0, 0.0) 15px); }

.ticketHeader, .ci-header, .client-header, .enterprise-header {
    background-color: #EFEFEF;
    clear: both;
    left: 5px;
    padding: 4px;
    right: 5px;
    z-index: 100;
}

html.appMode .ticketHeader, html.appMode .ci-header, html.appMode .client-header, html.appMode .enterprise-header {
    left: 0;
    position: absolute;
    right: 0;
}

html.appMode .ci-header.affix, html.appMode .ticketHeader.affix, html.appMode .client-header.affix, html.appMode .enterprise-header.affix {
    left: 5px;
    position: fixed;
    right: 5px;
}

.ci-header.affix-top, .ticketHeader.affix-top, .client-header.affix-top, .enterprise-header.affix-top {
    left: 0;
    position: absolute;
    right: 0;
}

.ui-tabs-active .chronometerFormValue { color: #999; }

.ticketGridFormNumber {
    cursor: pointer;
    font-size: 16px;
    padding-left: 10px;
    padding-top: 10px;
}

/* Haut du ticket */

.ticketFormNumber {
    display: block;
    float: left;
    font-size: 16px;
    height: 18px;
    max-width: 500px;
    overflow: hidden;
    padding-left: 5px;
    padding-right: 20px;
    padding-top: 6px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

a.ticketFormNumber {
    cursor: pointer;
    font-size: 16px;
    padding-top: 5px;
}

.referenceTicketFormNumber { font-size: 15px; }

a.ticketNumber-formEmail {
    color: #005580;
    cursor: pointer;
    text-decoration: underline;
}

a.ticketFormNumber span { vertical-align: top; }

.ticketHeaderCenter {
    display: block;
    float: left;
    padding-right: 20px;
}

.ticketHeaderRight {
    display: block;
    float: right;
}

.canvasBackground {
    background: -webkit-gradient(linear, left top, left bottom, from(#efefef), to(#FFF));
    display: block;
    float: left;
    width: 100%;
}

.canvasBackground > .g6 {
    padding-bottom: 0;
    padding-top: 0;
}

.canvasTicket {
    border-bottom: 1px #D3D3D3 solid;
    display: block;
    padding: 0 1% 10px 1%;
}

.ticketWorkflows {
    margin-bottom: 10px;
    margin-top: 36px;
}

.ticketWorkflows.is-locked,
.ticketWorkflows.is-read-only,
.ticketWorkflows.is-status-not-updatable {
    margin-top: 57px;
}

.atWorkflowsCentered { margin: 0 auto; }

.atWorkflowsBullet {
    background-color: #555;
    background-position: center;
    /* background-size: contain; */
    border-radius: 30px;
    cursor: pointer;
    float: left;
    height: 36px;
    margin: 10px 15px;
    transition: background 0.4s linear, transform 0.1s linear;
    width: 36px;
}

.atWorkflowsBullet:hover { transform: scale(1.10); }

.atWorkflowsBullet.atWorkflowsBulletSmall {
    height: 36px;
    width: 38px;
}

.atWorkflowsBullet.atWorkflowsBulletSelected {
    background-color: #ca7111;
    transform: scale(1.1);
}

.atWorkflowsBulletDisabled {
    background-color: gray;
    cursor: default !important;
}

.atWorkflowsDot {
    background: transparent url(../images/workflow-dots.png) no-repeat center;
    float: right;
    height: 55px;
    width: 40px;
}

.atWorkflowsDot.atWorkflowsDotSmall {
    height: 40px;
    width: 40px;
}

.atWorkflowsText {
    clear: both;
    text-align: center;
}

.atWorkflowsTextDisabled { color: #BBB; }


.customgrid { margin-bottom: 8px; }

.customgrid .popover { min-width: 450px; }

.customgrid .popover input { width: auto !important; }

.customgrid .custom-fields-switch h3.custom-field-label { padding: 0; }

.customgrid thead tr.dark {
    background-color: #eee;
    color: #333;
}

.customgrid th.grid-header {
    padding: 0px;
    padding-left: 8px;
}

.customgrid td { padding: 2px; }

.customgrid th, .customgrid td { border-left: 1px #ccc solid; }

.customgrid .ciItemBox li.itemBox {
    height: 55px;
    width: 100px;
}

.customgrid li.itemBox .boxTemplate { height: 60px; }


.customgrid textarea,
.customgrid input,
.customgrid input.multiple-select { width: 93% !important; }

.customgrid input[at-numeric-input] { text-align: right; }

.customgrid tfoot input[type="checkbox"] { width: auto !important; }

.customgrid tfoot input { border-style: inset; }

.customgrid tfoot td {
    background-color: #fafafa;
    border-top-color: #ccc;
    border-top-style: solid;
    border-top-width: 2px;
}

.customgrid .typeahead-reading-status {
    left: 12px;
    top: 7px;
}

.customgrid .twitter-typeahead .tt-hint,
.customgrid .twitter-typeahead .tt-query {
    box-sizing: border-box;
    height: 30px;
    padding-right: 30px;
    width: 100% !important;
}

.customgrid .clear-field {
    margin-left: 0;
    right: 10px;
}

.custom-grid-container .invalid {
    border-color: red;
    border-style: solid;
    border-width: 1px;
}

.ticketRightSection input,
.portalRequestSection input,
.ticketRightSection input.multiple-select,
.ticketRightSection textarea .portalRequestSection textarea {
    width: 98%;
}

.ticketRightSection textarea { width: 100%; }

.ticketRightSection > div:first-of-type h4.collapsibleSectionHeader,
.ticketFormLeft > div:first-of-type h4.collapsibleSectionHeader { margin-top: 0; }

.k-popup .k-list .k-treeview-item {
    font-size: 12px;
    white-space: nowrap;
}

.k-list > .k-selected.k-focused {
    background-color: #0288d1 !important;
    background-image: none;
    border: none;
    border-radius: 0;
    color: #fff;
}

.k-popup .k-list .k-hover {
    background-color: #AAA;
    background-image: none;
    border-radius: 0;
}

.portalRequestSection textarea { height: 125px; }

.workflowContainer, .workflowContainer tr, .workflowContainer td {
    border: none;
    text-align: center;
}

.workflowContainer td.disabled { color: #BBB; }

.workflowContainer input { width: auto; }

.workflowContainer div.workflow-bullet { transition: background 0.4s linear; }

.workflowCanvasStatus { cursor: pointer; }

.previewButtonBar h2 { font-size: 2em; }

.previewButtonBar g2 span { padding: 0 2%; }

.ticketDetailBlock { font-weight: normal; }

.ticketDetailBlock label {
    display: block;
    float: left;
    padding-right: 3%;
    padding-top: 5px;
    text-align: right;
    width: 30%;
}

.ticketDetailBlock select {
    float: left;
    padding: 4px;
    width: 60%;
}

.ticketDetailBlock .generalDescSection label { text-align: left; }

.ticketDetailBlock textarea {
    padding: 1%;
    width: 98%;
}

.ticketDetailBlock textarea.descText {
    height: 130px;
    padding: 1%;
    width: 98%;
}

.ticketDetailBlock input[type="text"] {
    padding: 1%;
    width: 98%;
}

.ticketClientSelect { margin-bottom: 9px; }

.ticketResourceSelect {
    height: 1px;
    margin-bottom: 5px;
}

.lockedMessage,.readOnlyMessage {
    color: #ff0000;
}

.client-reaches-license-limit-message span {
    background-color: lightyellow;
    color: #ff0000;
    display: block;
    font-size: 12px;
    line-height: 15px;
    margin: 0;
    padding: 20px 15px;
}

.lockedMessage,
.readOnlyMessage,
.msg-status-not-updatable {
    margin-bottom: 6px;
    background-color: lightyellow;
    font-size: 12px;
    line-height: 21px;
    padding-left: 5px;
}

.ticket_empty_icon-image {
    float: right;
    height: 18px;
    width: 24px;
}

.TicketResource_SelectControl .g12 span.ui-combobox .ui-state-default, .TicketResource_SelectControl .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
    background: none;
    border-radius: 0px;
}

.ciItemBox li.itemBox {
    height: 40px;
    margin-bottom: 0;
    padding-left: 65px;
    padding-top: 10px;
    width: 200px;
}

.ciItemBox .boxTemplateImage {
    background-color: white;
    height: 45px;
    left: 9px;
    position: absolute;
    top: 9px;
    width: 45px;
}

.custom-field-cell.span3 .ciItemBox li.itemBox, .custom-field-cell.span4 .ciItemBox li.itemBox {
    height: 60px;
    padding-left: 67px;
    width: 96px;
}

.custom-field-cell.span3 .ciItemBox .boxTemplateImage, .custom-field-cell.span4 .ciItemBox .boxTemplateImage {
    padding: 3px;
    top: 14px;
}

/* CMDB + Client */

.ciFormTitle,
.clientFormTitle,
.enterpriseFormTitle {
    display: block;
    float: left;
    font-size: 18px;
    padding-right: 20px;
    padding-top: 4px;
}


/* Boites ressources, client et groupe */
li.itemBox, li.ticketClientItem, li.resourceInfo, li.resourceItem, li.groupMemberItem, li.ClientEnterpriseItem {
    background: #f5f5f5;
    border-radius: 2px;
    border-top: 12px solid #555;
    /*font-size: 14px;*/
    box-shadow: 1px 1px 2px grey;
    display: block;
    float: left;
    height: 56px;
    margin: 4px 8px 4px 0;
    padding: 8px 12px 10px 10px;
    position: relative;
    width: 108px;
}

.inactive-box {
    /*background-color: white;*/
    color: white;
    font-size: 8px;
    font-style: italic;
    font-style: normal;
    position: absolute;
    right: 8px;
    text-transform: uppercase;
    top: -9px;
}

li.itemBox.inactive,
li.ticketClientItem.inactive,
li.resourceInfo.inactive,
li.resourceItem.inactive,
li.groupMemberItem.inactive,
li.ClientEnterpriseItem.inactive,
.small-select-dropdown.inactive,
.twitter-typeahead .tt-query.inactive,
select.enterprise.inactive,
.categorization-section .inactive,
select.service-category.inactive,
select.request-service.inactive {
    font-style: italic;
}

.small-select-dropdown.inactive option, select.enterprise.inactive option, .categorization-section .inactive option { font-style: normal; }

select.service-category.inactive option,
select.request-service.inactive option { font-style: normal; }

li.itemBox .boxTemplate, li.ticketClientItem .boxTemplate, li.resourceInfo .boxTemplate, li.resourceItem .boxTemplate, li.groupMemberItem .boxTemplate, li.ClientEnterpriseItem .boxTemplate {
    height: 50px;
    overflow: hidden;
}


li.ticketClientItem:first-child, .principal-box li.itemBox:first-child, div.distinguish li.ClientEnterpriseItem:first-child, li.enterpriseItemBox:first-child {
    /*background: #89A600;*/
    border-top: 12px solid #89A600;
    /*font-weight:bold;*/
    color: black;
}

li.itemBox:hover, .principal-box li.itemBox:hover, li.ticketClientItem:hover, li.resourceInfo:hover, li.ClientEnterpriseItem:hover {
    border-top: 12px solid #f89115;
    box-shadow: 1px 3px 3px grey;
    color: black;
}

li.itemBox.error-box {
    border-top: 12px solid #C44747 !important;
    color: darkred;
}

li.itemBox.error-box .viewLink,
li.itemBox.error-box .editLink a { color: darkred; }

li.itemBox .popover,
.custom-field-cell .popover { min-width: 450px; }

li.itemBox.wide {
    padding-top: 10px;
    width: 297px;
}

li.ClientEnterpriseItem { height: 50px; }

li.eventClientItem {
    background: #f0f0f0;
    border: 1px solid #d3d3d3;
    display: block;
    float: left;
    height: 20px;
    margin-bottom: 5px;
    margin-right: 5px;
    padding: 10px 20px;
    position: relative;
    width: 83px;
}

li.resourceInfo { top: 10px; }

/* Position des noms des ressources et des clients */

.resourceItemLabel {
    bottom: 30px;
    font-size: 1.4em;
    left: 20px;
    position: absolute;
}

.itemLabel {
    left: 5px;
    position: absolute;
    top: 8px;
    width: 100px;
}

.itemFirstName {
    clear: both;
    font-size: 12px;
    margin-left: 0 !important;
    overflow: hidden;
    padding-bottom: 1px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.itemLastName {
    clear: both;
    margin-left: 0 !important;
    overflow: hidden;
    padding-bottom: 1px;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.itemOfficePhone {
    clear: both;
    margin-left: 0 !important;
    overflow: hidden;
    white-space: nowrap;
}

/* Lien delete */

.clientDelete, .deleteLink {
    background-color: #EEE;
    border: 1px solid #333;
    border-radius: 5px;
    color: #333;
    cursor: pointer;
    height: 13px;
    padding: 2px 3px;
    position: absolute;
    right: 5px;
    text-align: center;
    top: 5px;
    width: 11px;
}

.item-box-delete {
    color: #333;
    cursor: pointer;
    margin: 0 !important;
    position: absolute;
    right: 5px;
    top: 5px;
}

.item-box-remote-application {
    color: #333;
    cursor: pointer;
    margin: 0 !important;
    position: absolute;
    right: 5px;
    top: 25px;
}

/* Liens view et edit */

li.itemBox .viewLink, li.itemBox .viewRelationLink, li.itemBox .editLink, li.ticketClientItem input, li.ticketClientItem .clientView, li.ticketClientItem .clientEdit, li.ticketClientItem .clientCis, li.groupMemberItem .resourceView {
    cursor: pointer;
    display: none;
}

a.resourceEdit {
    color: blue;
    cursor: pointer;
    display: none;
    text-decoration: underline;
    text-transform: lowercase;
}

/* Hover */

li.groupMemberItem:hover .resourceView {
    bottom: 5px;
    display: block;
    font-size: 12px;
    position: absolute;
    right: 10px;
}


li.ticketClientItem:hover .itemLabel, li.groupMemberItem:hover .itemLabel, li.resourceInfo:hover .itemLabel { display: block; }

li.ticketClientItem:hover input {
    display: block;
    left: 5px;
    position: absolute;
    top: 5px;
}

li.itemBox:hover .viewLink, li.ticketClientItem:hover .clientView {
    bottom: 5px;
    display: block;
    font-size: 12px;
    left: 10px;
    position: absolute;
}

li.itemBox:hover .viewLink2, li.ticketClientItem:hover .clientView {
    bottom: 5px;
    display: block;
    font-size: 12px;
    left: 10px;
    position: absolute;
}

li.itemBox:hover .editLink, li.ticketClientItem:hover .clientEdit {
    background-color: #f5f5f5;
    bottom: 0;
    display: block;
    font-size: 12px;
    padding: 0 5px 5px 5px;
    position: absolute;
    right: 5px;
}

li.itemBox:hover .viewRelationLink {
    background-color: #f5f5f5;
    bottom: 1px;
    display: block;
    font-size: 12px;
    padding: 0 10px 5px 10px;
    position: absolute;
    right: 30px;
}

li.itemBox.impact-is-active:hover .viewRelationLink,
li.itemBox.impact-is-active:hover .viewRelationLink a,
li.itemBox.impact-is-active:hover .editLink,
li.itemBox.impact-is-active:hover .editLink a,
li.itemBox.impact-is-active .item-box-delete {
    background-color: inherit !important;
    color: inherit !important;
}

li.itemBox:hover .clientCis, li.ticketClientItem:hover .clientCis {
    bottom: 5px;
    display: block;
    font-size: 12px;
    left: 10px;
    position: absolute;
}

.intermail-config-box li.itemBox {
    padding-right: 15px;
}
.intermail-config-box li.itemBox .boxTemplate {
    word-wrap: break-word;
    line-height: 14px;
    height: 61px;
}

div.autoAssign {
    float: left;
    padding: 2px 10px;
}

div.autoAssign span {
    cursor: pointer;
    font-weight: bold;
    text-decoration: underline;
}

.ticketTopLeft {
    display: block;
    float: left;
    width: 75%;
}

.ticketTopLeft .previewButtonBar {
    display: block;
    float: left;
}

.ticketTimerBlock {
    float: left;
    margin-top: 3px;
    padding: 6px;
    width: 314px;
}

.ticketTimerInactive { color: #999999; }


/* div.textFieldLarge textarea { padding:1%; width:98%; } */

.ticketRightSection .btnTicketGridSlide {
    border: 0px;
    cursor: pointer;
    height: 71px;
    left: 0;
    margin-top: -35px;
    outline: none;
    position: absolute;
    top: 50%;
    width: 20px;
}

/* Common Manager Forms */

.managerDetailBlock { font-weight: 500; }

.managerDetailBlock h4 {
    border-bottom: 1px solid #D3D3D3;
    font-size: 100%;
    font-weight: bold;
    margin: 10px 0 10px 0px;
    padding-bottom: 3px;
    text-transform: uppercase;
}

.managerDetailBlock h5 {
    border-bottom: 1px solid #D3D3D3;
    font-size: 100%;
    font-weight: bold;
    margin: 10px 0 10px -40px;
    padding-bottom: 3px;
}

.managerDetailBlock label {
    display: block;
    float: left;
    padding-right: 3%;
    padding-top: 5px;
    text-align: left;
    width: 100%;
}

.managerDetailBlock input {
    display: block;
    float: left;
    width: 100%;
}

.managerDetailBlock input[type="checkbox"] { width: 16px; }

.managerDetailBlock select {
    float: left;
    padding: 4px;
}

.managerDetailBlock .c2AutoComplete { width: 290px; }

.managerDetailBlock .c2AutoComplete span.ui-combobox { width: 100%; }

.managerDetailBlock .c2AutoComplete input { width: 58%; }

.managerDetailBlock .checkboxListItem {
    display: inline-block;
    width: 100%;
}

.managerFormButtonSet {
    background: #f0f0f0;
    clear: both;
    display: block;
    margin: 0;
    width: 98%;
}

.managerFormButtonSet .buttonDialogBottomSet, .managerFormButtonSet .buttonDialogUpperSet { width: auto; }

li.resourceInfo:hover .informationLink {
    bottom: 5px;
    display: block;
    font-size: 12px;
    position: absolute;
    right: 5px;
}

.managerFormHeader, .groupFormHeader, .eventFormHeader {
    /*background: #f0f0f0 1% 15px no-repeat;*/
    font-size: 12px;
    height: 26px;
    padding: 8px 8px 8px 20px;
}

.managerFormHeader > p, .groupFormHeader > p, .eventFormHeader > p {
    display: block;
    float: left;
    line-height: 23px;
}

.managerFormHeader p input, .groupFormHeader p input {
    position: relative;
    top: -3px;
}

.event-header-datelabel {
    white-space: nowrap;
    margin-right: 5px;
}

.language-select {
    width: calc(100% - 20px)!important;
    margin-left: 10px!important;
}

.language-select-fr {
    width: calc(100% - 0px)!important;
    margin-left: 1px!important;
}


.managerFormHeader .formHeaderfirst { padding-right: 17px; }

.managerFormHeader .formHeaderlast { float: right; }

.managerFormHeader .formHeaderlast input,
.managerFormHeader .resourceFormHeaderLabel input {
    top: 1px;
}

.managerFormHeader .formHeaderlast span { font-size: 11px; }

.managerFormHeader .formHeaderlast:first-child { margin-right: 40px; }

.managerFormHeader .clientSearchHeader {
    float: left;
    margin-left: 7px;
    position: relative;
}

.managerFormHeader .clientSearchHeader input { width: 100%; }

.managerFormHeader .clientSearchHeader .clear-field { margin-left: -10px; }

.managerFormHeader .formHeaderfirst.ciSearchHeader {
    float: left;
    padding-right: 3px;
    padding-top: 2px;
}

.managerFormHeader .searchTypeHeader {
    position: relative;
    top: -2px;
    width: 88px;
}

.resourceFormHeaderLabel {
    display: inline;
    font-weight: bold;
    padding-right: 7px;
    vertical-align: top;
}

.managerFormDataLabel, .clientFormDataLabel {
    display: inline;
    padding: 0 7px;
    vertical-align: top;
}



.ticketDetailBlock label.error {
    font-size: 10px;
    margin: 5px 0;
    padding: 0;
    text-align: left;
    width: 100%;
}

.labelSpecial {
    float: left;
    width: 15%;
}

.labelSpecial label {
    display: block;
    padding-right: 3%;
    padding-top: 5px;
    text-align: right;
}

/*.inputSpecial { float:left; padding-left:6px; width:80%; }*/

.grid-inactive-record,
.grid-not-c2client-owner {
    color: #A0A0A0;
    font-style: italic;
    opacity: 0.65;
}

.fa-icon-lock {
    font: normal normal normal 14px/1 FontAwesome;
    font-size: 1.33333333em;
}

.fa-icon-lock:before { content: "\f023"; }

/* Client Manager */

.ClientManagementForm { background: #f0f0f0; }

.ClientManagementForm .advancedSearchButtonBar {
    margin-right: 10px;
    width: 99%;
}

p.clientHeaderfirst { padding-right: 17px; }

p.clientHeaderSecond {
    margin-top: 1px;
    width: 60%;
}

.ui-tabs-panel form { clear: both; }

.entrepriseEditLien {
    color: #363636;
    cursor: pointer;
    font-family: 'Lato', "Trebuchet MS", Arial, Helvetica, sans-serif !important;
    font-size: 10px;
    margin: 0 auto;
    padding-right: 5px;
    text-decoration: underline;
    text-transform: uppercase;
    width: 125px;
}

/* Groups Manager */

.GroupManagementForm { background: #f0f0f0; }

.groupFormHeaderLabel {
    display: inline;
    font-weight: bold;
    padding-right: 7px;
    vertical-align: top;
}

.groupMemberSelect { margin-bottom: 20px; }

.groupMemberSelect input { padding: 4px 2px; }

li.groupMemberItem input, li.groupMemberItem .resourceView, li.resourceInfo .resourceView, li.groupMemberItem .resourceEdit {
    cursor: pointer;
    display: none;
}

li.groupMemberItem .resourceDelete {
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    background: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#CCC));
    background: -moz-linear-gradient(top, #FFF, #CCC);
    border: 1px solid #333;
    border-radius: 5px;
    color: #333;
    cursor: pointer;
    padding: 2px 5px;
    position: absolute;
    right: 5px;
    top: 5px;
}

.resourceItemLabel {
    position: absolute;
    top: 40px;
    width: 120px;
}

li.groupMemberItem:hover input {
    display: block;
    left: 18px;
    position: absolute;
    top: 20px;
}

.featureSet {
    display: block;
    margin: 0 0 20px 80px;
}

/* Events Manager */

.EventManagementForm { background: #f0f0f0; }

.eventFormHeaderLabel {
    display: inline;
    font-weight: bold;
    padding-right: 7px;
    vertical-align: top;
}

/* Pop up du timer */

.ui-dialog-title {
    font-size: 16px;
    font-weight: normal;
    text-transform: uppercase;
}

.ui-dialog-content textarea.TicketTimerText {
    display: block;
    float: left;
    height: 100px;
    width: 98%;
}

.TimerPopupCommentSection .error {
    display: block;
    float: left;
    font-size: 10px;
    margin-top: 6px;
    width: 100%;
}

.dialog-timer-form section { line-height: 20px; }

/* Pop up des notes */

#addNoteForm section { margin-bottom: 10px; }

.k-editor {
    border-collapse: separate;
    border-style: solid;
    border-width: 0px;
    table-layout: fixed;
    vertical-align: top;
}

#noteTitle { width: 98%; }

#addNoteForm textarea { padding: 5px; }

/* Generic dialog definition */

form.dialog section {
    clear: both;
    margin-bottom: 10px;
    padding: 5px;
}

form.dialog label { float: left; }

form.dialog input {
    float: right;
    margin-left: 1%;
    width: 90%;
}

/* Pop up info client */

.toolTipDivision p {
    display: block;
    float: left;
    padding: 0;
    width: 100%;
}

.toolTipDivision p label.divisionLabel {
    padding-top: 2px;
    width: 90%;
}

/* Autocomplete */

.ui-autocomplete {
    max-height: 250px;
    overflow-x: hidden !important;
    z-index: auto;
}

.ui-autocomplete table { width: 100%; }

.ui-autocomplete table tr:hover { background-color: #F0F0F0; }

.ui-autocomplete table thead th {
    background-color: #d1d1d1;
    border: 1px solid #CCCCCC;
    padding: 6px 3px;
}

.ui-autocomplete table tr td {
    border: 1px solid #CCC;
    padding: 6px 3px;
}

.ui-autocomplete-input {
    padding: 5px;
    /*height: 18px;*/
}

.toolTipDataField .ui-autocomplete-input { top: 2px; }

.toolTipDataField .ui-combobox input { width: 125px; }

.toolTipDataField select { width: 77%; }

/* combobox jQuery */

.c2AutoComplete .ui-combobox {
    display: block;
    float: left;
    height: 20px;
    margin-bottom: 4px;
    padding-bottom: 5px;
    position: relative;
}

.c2AutoComplete .ui-combobox input {
    display: block;
    float: left;
    height: 16px;
    position: relative;
    /*padding: 5px 2px;*/
}

.c2AutoComplete .ui-combobox a.ui-button {
    display: block;
    float: left;
    height: 16px;
    left: -2px;
    margin-left: 2px;
    margin-top: 2px;
    padding: 5px 2px;
    position: relative;
    width: 20px;
}

.c2AutoComplete .ui-button-icon-only .ui-icon {
    left: 4px;
    margin-left: 0;
}

.c2AutoComplete .ui-button-text { padding: 0px 0px; }

.ticketDetailBlock.c2AutoComplete .ui-combobox { padding: 0px; }

.ticketDetailBlock.c2AutoComplete .ui-combobox input { margin-right: 2px; }

/* Invalidation de jQuery UI */

.ui-widget {
    font-family: 'Lato', "Trebuchet MS", Arial, Helvetica, sans-serif !important;
    font-size: 1em;
}

.ui-widget-content { color: #363636; }

.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: 'Lato', "Trebuchet MS", Arial, Helvetica, sans-serif !important; }

/*.ui-widget input { -moz-box-sizing: content-box; padding:5px 2px; }*/

.ui-tabs {
    padding: 0;
    position: relative;
}

.ui-tabs .ui-tabs-nav { padding: 0; }

.ui-widget-header {
    background: none;
    border: 0px;
    color: #222222;
    font-weight: bold;
}

.ui-button-text {
    padding: 3px 10px;
    width: auto;
}

.ticketDetailBlock .ui-combobox input { width: 132px; }

/* Thème */

.advancedSearchTitle {
    color: #555;
    cursor: pointer;
    font-size: 12px;
    font-weight: bold;
}

.advancedSearchTitle:hover { color: #fe6a00; }

#MenuWidget ul.menuNavSubmenu li:hover a, .g2 .k-hover, .g2 .k-selected { color: #fe6a00; }

#MainTabs ul.ui-tabs-nav li a {
    font-size: 12px;
    margin-right: 10px;
    padding-right: 0;
    padding-top: 0;
    text-align: center;
    width: 100%;
}

#MainTabs ul li span.k-selected {
    background-color: #f0f0f0;
    border-color: lightgray;
    font-weight: bold;
}

#MainTabs ul li.ui-state-default.ui-corner-top:not(.ui-tabs-active) { border-bottom: 1px solid lightgray !important; }

#MainTabs ul li.ui-state-default .fa {
    border: 1px solid transparent;
    color: #888;
    cursor: pointer;
    margin-top: 8px;
    padding: 1px 4px;
    position: relative;
    position: absolute;
}

#MainTabs ul li.ui-tabs-active .fa { margin-top: 9px; }

#MainTabs ul li.ui-state-default .fa-times.close-tab {
    right: 4px;
    top: -1px;
}

#MainTabs ul li.ui-state-default .fa-thumb-tack.pin-tab {
    right: 18px;
    top: -3px;
    transform: rotate(90deg);
}

#MainTabs ul li.ui-state-default .fa-thumb-tack.is-pinned {
    color: #FF9334;
    transform: none;
    visibility: visible !important;
}

#MainTabs ul li.ui-state-default .fa-times.close-tab:hover { cursor: pointer; }

#MainTabs ul li.ui-state-default .fa.fa-thumb-tack { visibility: hidden; }

#MainTabs ul li.ui-state-default.ui-tabs-active .fa.fa-thumb-tack,
#MainTabs ul li.ui-state-default:hover .fa.fa-thumb-tack { visibility: visible !important; }

#MainTabs ul li.ui-state-default.ui-tabs-active a { cursor: pointer !important; }

#MainTabs ul li.ui-state-default .fa.fa-thumb-tack {
    margin-right: 7px;
    padding: 4px;
    padding-left: 2px;
}

#MainTabs ul li.ui-state-default .fa:hover {
    /*border: 1px solid #CCC;
    border-radius: 3px;
    background-color: #EEE;*/
    color: #FF9334;
}

#MainTabs ul li a.timer-running {
    line-height: 0.8;
    padding-top: 0 !important;
}

#MainTabs ul li a.timer-running div.timer { display: block; }

.activityFieldName, .ticketNoteTitle, .ticketPreviewTitle, .manager-message, .pinMessage {
    background: url(../images/orange_bullet.png) left 0.35em no-repeat;
    line-height: 1.2em;
    padding-left: 15px;
}

.ticketNotePrivate { background: url(../images/gray_bullet.png) left 0.35em no-repeat; }

.ticketTaskSequenceNumber {
    font-weight: bold;
    line-height: 1.2em;
}

.ticket-note-number {
    color: blue;
    cursor: pointer;
    font-size: 12px;
    line-height: 1.2em;
    padding: 5px 0;
    text-decoration: underline;
    text-overflow: clip;
}

.ticketsFilter, .ticketTaskSequenceNumber, .ticket-note-number { cursor: pointer; }

li.groupMemberItem:hover {
    background: #f89115;
    border: 1px solid #b95337;
    color: #fff;
}

.viewLink, .editLink, .clientView, .clientEdit, .clientCis, .resourceView {
    color: #222;
    text-decoration: underline;
}

/* Largeur des formulaires */

.w960 {
    display: block;
    margin: 0;
    max-width: 960px;
    padding: 1%;
}

.w960 .g1, .w960 .g2, .w960 .g3, .w960 .g4, .w960 .g5, .w960 .g6, .w960 .g7, .w960 .g8, .w960 .g9 .w960 .g10, .w960 .g11, .w960 .g12 {
    padding-bottom: 1px;
    padding-top: 1px;
}


.w960 .g3 select { width: 100%; }

.w960 .g10 table, .w960 .g11 table,
.w960 .g1 textarea, .w960 .g2 textarea, .w960 .g3 textarea, .w960 .g4 textarea, .w960 .g5 textarea, .w960 .g6 textarea, .w960 .g7 textarea, .w960 .g8 textarea, .w960 .g9 textarea, .w960 .g10 textarea, .w960 .g11 textarea, .w960 .g12 textarea,
.w960 .g1 label, .w960 .g2 label, .w960 .g3 label, .w960 .g4 label, .w960 .g5 label, .w960 .g6 label, .w960 .g7 label, .w960 .g8 label, .w960 .g9 label, .w960 .g10 label, .w960 .g11 label, .w960 .g12 label,
.w960 .g1 input, .w960 .g2 input, .w960 .g3 input, .w960 .g4 input, .w960 .g5 input, .w960 .g6 input, .w960 .g7 input, .w960 .g8 input, .w960 .g9 input, .w960 .g10 input, .w960 .g11 input, .w960 .g12 input,
.w960 .g1 select, .w960 .g2 select, .w960 .g3 select, .w960 .g4 select, .w960 .g5 select, .w960 .g6 select, .w960 .g7 select, .w960 .g8 select, .w960 .g9 select, .w960 .g10 select, .w960 .g11 select, .w960 .g12 select,
.w960960 .g1 span, .w960 .g2 span, .w960 .g3 span, .w960 .g4 span, .w960 .g5 span, .w960 .g6 span, .w960 .g7 span, .w960 .g8 span, .w960 .g9 span, .w960 .g10 span, .w960 .g11 span, .w960 .g12 span { margin-left: 15px; }

.w960 .c2AutoComplete input, .w960 span.ui-icon-triangle-1-s { margin-left: 0px; }

.w960 .advancedFormOptionsContent { line-height: 18px; }

.w960 .advancedFormOptionsContent input { width: 75%; }

.w960 .advancedFormOptionsContent select { width: 79%; }

/*.w960 .c2AutoComplete select
    {
        width: 100%;
    }*/

/*---------------------------------
  Attachments
  ---------------------------------*/

.attachmentsGrid.span6,
.attachmentsGrid.span12 {
    padding-top: 8px;
}

.attachmentsGrid .deleteAttachment {
    background: url(../images/delete_small.png) no-repeat;
    cursor: pointer;
    float: left;
    height: 16px;
    margin-left: 5px;
    margin-right: 5px;
    width: 16px;
}

.attachmentsGrid th, .attachmentsGrid td {
    padding-left: 10px;
    text-align: left;
}

.openLink {
    color: #0000ff;
    cursor: pointer;
    text-decoration: underline;
}

.attachmentsGrid .ticketPreviewLink { margin-left: 15px; }

.attachmentsGrid .image_file {
    background: url(../images/icons/attachment_image.png) no-repeat;
    display: inline-block;
    height: 16px;
    margin-left: 5px;
    margin-right: 5px;
    width: 16px;
}

.attachmentsGrid .fa-ban {
    margin-left: 7px;
    margin-right: 7px;
    color: red;
    font-size: 14px;
}


i.widgetIcon {
    color: #F29A3C;
    float: left;
    margin-left: 6px;
    margin-right: 8px;
}

i.widgetIcon.grey { color: #888; }

.attachmentsGrid .excel_file {
    background: url(../images/icons/attachment_excel.png) no-repeat;
    display: inline-block;
    height: 16px;
    margin-left: 5px;
    margin-right: 5px;
    width: 16px;
}

.attachmentsGrid .word_file {
    background: url(../images/icons/attachment_word.png) no-repeat;
    display: inline-block;
    height: 16px;
    margin-left: 5px;
    margin-right: 5px;
    width: 16px;
}

.attachmentsGrid .powerpoint_file {
    background: url(../images/icons/attachment_powerpoint.png) no-repeat;
    display: inline-block;
    height: 16px;
    margin-left: 5px;
    margin-right: 5px;
    width: 16px;
}

.attachmentsGrid .pdf_file {
    background: url(../images/icons/attachment_pdf.png) no-repeat;
    display: inline-block;
    height: 16px;
    margin-left: 5px;
    margin-right: 5px;
    width: 16px;
}

.attachmentsGrid .text_file {
    background: url(../images/icons/attachment_text.png) no-repeat;
    display: inline-block;
    height: 16px;
    margin-left: 5px;
    margin-right: 5px;
    width: 16px;
}

.attachmentsGrid .zip_file {
    background: url(../images/icons/attachment_zip.png) no-repeat;
    display: inline-block;
    height: 16px;
    margin-left: 5px;
    margin-right: 5px;
    width: 16px;
}

.attachmentsGrid .unknown_file {
    background: url(../images/icons/attachment_unknown.png) no-repeat;
    display: inline-block;
    height: 16px;
    margin-left: 5px;
    margin-right: 5px;
    width: 16px;
}

.attachmentsPreview {
    border-left: 1px solid lightgray;
}

/*
.emailTextBox { width: 100%;}
.nameTextBox { width: 70%;}
.phoneTextBox { width: 100px;}
.postalCodeTextBox { width:20%;}

.cityTextBox {width:60%;}
*/

.addressTextBox { width: 98%; }

/*Ticket Grid Event*/

.LayoutContextBtn { border: solid 1px #CCC; }

.eventSourceType {
    border: none;
    display: inline-block;
    height: 30px;
    margin-right: 2px;
    width: 30px;
}

.eventButtons {
    padding: 4px;
    width: 260px;
}

.eventActionArea { margin-right: 0px; }

.btn-group > button:nth-child(2) { margin-top: 0px; }

.eventSummary, .eventClientSearch {
    padding-top: 10px !important;
    /*margin-right: 0px;*/
}

.eventRightSection { padding: 0px; }

.eventClientFilter {
    padding-right: 0px;
    padding-top: 2px;
    text-align: right;
}

.eventSummaryInput {
    margin-right: 0px;
    padding-top: 4px;
}

.eventClientSearchInput { margin-right: 0px; }

.peopleList { margin-left: 15px; }

/* Widgets Styles */

.widgetHeader {
    background-color: #f0f0f0;
    background-position: left;
    background-repeat: no-repeat;
    background-size: 16px 16px;
    border-bottom: 1px solid #D3D3D3;
    border-top: 2px solid rgba(136, 166, 0, .6);
    cursor: pointer;
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 5px;
    padding: 0 0 0 10px;
}

.widgetHeader .expanded {
    background-image: url(../images/collapse.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 10px 6px;
}

.widgetHeader .collapsed {
    background-image: url(../images/expand.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 10px 6px;
}

.widgetContent { clear: both; }

.filtersWidget {
    font-size: 12px;
    padding-left: 17px;
}

.filtersWidget > div {
    padding-bottom: 5px;
    padding-top: 6px;
}

.filtersWidget > div label { display: inline; }

input[type="radio"].radio-inline { display: none; }

label.radio-inline { text-decoration: underline; }

label.radio-inline.enterprises-widget-label {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

label.radio-inline.boldActive {
    font-weight: bold;
    text-decoration: none;
}

label.radio-inline.active { text-decoration: none; }


#enterprise-widget { background-image: url(../images/icons/list.png); }

/* Dashboard style */

.dashboard-stat {
    font-size: 12px;
    margin-left: 15px;
    padding: 0;
}

.dashboard-stat div { padding-bottom: 5px; }

.enterprise-widget-stat {
    font-size: 12px;
    margin-left: 15px;
    padding: 0;
}

.dashboard-value {
    font-weight: bold;
    text-align: right;
}

.dashboard-label.ticketsFilter { text-decoration: underline; }

.dashboard-label.ticketsFilter.filterSelected {
    cursor: default;
    font-weight: bold;
    text-decoration: none;
}

.dashboard-chart .textEditor .panel-body ol,
.dashboard-chart .textEditor .panel-body ul {
    margin: 10px 30px 15px 30px;
}
.dashboard-chart .textEditor .panel-body ol {
    list-style: decimal;
}
.dashboard-chart .textEditor .panel-body ul {
    list-style: disc;
}

#client_search_button {
    background: url(../images/search.png) no-repeat;
    background-position: center;
    background-size: 12px 12px;
    border: 0;
    cursor: pointer;
    margin-left: 0;
}

#client_search_button.disabled { cursor: default; }

#client_clear_button {
    background: url(../images/delete.png) no-repeat;
    background-position: center;
    background-size: 12px 12px;
    border: 0;
    cursor: pointer;
}

#client_clear_button.disabled { cursor: default; }

.eventInputButton {
    height: 12px;
    margin-left: 0px;
    position: absolute;
    top: 18px;
    width: 12px;
}

div.activate input {
    border: #2F96B4 solid 1px;
    color: #EEE;
}

div.activate input:hover {
    border: #f29a3c solid 1px;
    color: #333;
}

em.activate {
    /*background-color:#99c2ff;
    color:#333;*/
    background-color: rgba(47, 150, 180, 150);
    border-radius: 3px;
    color: #EEE;
    cursor: help;
    padding: 0 2px;
    /*margin-bottom:2px;*/
}

em.activate:hover {
    background-color: #f29a3c;
    color: #333;
}

.trainingControl, .helpControl {
    color: white;
    cursor: pointer;
    float: right;
    margin-left: 20px;
    margin-top: 8px;
    text-align: center;
}

.trainingControl .fa, .helpControl .fa { padding: 5px; }

.helpControl button, .trainingControl button {
    background-color: #ccc;
    color: black;
    font-weight: bold;
}

.helpControl button:hover, .trainingControl button:hover {
    background-color: #888;
    color: black;
    font-weight: bold;
}

.helpControl .fa.active { text-shadow: 0px 1px 13px #FFF; }

.helpControl:hover .help-control-tooltip {
	display: inline-block;
    /* display: none; */
    color: #fff;
    position: absolute;
    width: 216px;
    right: 79.5px;
    margin-top: 31px;
    font-size: 11px;
    opacity: 0.9;
    visibility: visible;
    padding: 8px;
    text-align: center;
    text-decoration: none;
    background-color: #000;
    border-radius: 4px;
    z-index: 100;
    line-height: 1.4;
}

.helpControl:hover .help-control-tooltip::after {
	content: " ";
	position: absolute;
	bottom: 100%;
	left: 50%;
	margin-left: -5px;
	border-width: 5px;
	border-style: solid;
	border-color: transparent;
	border-bottom-color: #000;
}

.helpControl .help-control-tooltip {
	display: none;
}

.tooltip.in {
    filter: alpha(opacity=50);
    opacity: 0.9;
}

.popover p {
    font-size: 100%;
    line-height: 1.4;
    padding-bottom: 9px;
}

.clientSection { padding-bottom: 0px; }

.clientSection .popover, .TicketCI_SelectControl .popover { min-width: 350px; }

.clientSection .popover, .clientAssigneesSection .popover, .TicketClient_SelectControl_List .popover { min-width: 450px; }

.clientSection .popover .popover-content, .clientAssigneesSection .popover .popover-content, .TicketClient_SelectControl_List .popover .popover-content {
    max-height: 370px;
    overflow-y: auto;
}

.headerControls .popover, .nav .popover { min-width: 350px; }

.popover-template .g6 { width: 98%; }

.popover-template .relationSection > div:first-child {
    font-weight: bold;
    padding: 10px 0;
}

.popover-template .relationSection > div { padding-left: 10px; }

.popover {
    color: black;
    font-family: 'Lato', "Trebuchet MS", Arial, Helvetica, sans-serif !important;
    font-size: 13px;
    font-weight: normal;
    line-height: 13px;
    max-width: 400px;
    text-shadow: none;
    text-transform: none;
    width: auto;
}

.panel-default.textEditor > .panel-heading .popover {
    max-width: 600px;
    width: 600px;
}

.popoverCIName { border-top: 1px solid lightgray; }

.popoverClientContent {
    height: 40px;
    line-height: 25px;
}

.treeview-icon {
    -mox-border-radius: 5px;
    -webkit-border-radius: 5px;
    background-color: transparent;
    background-repeat: no-repeat;
    background-size: 16px 16px;
    border-radius: 5px;
    display: inline-block;
    font-size: 0;
    height: 16px;
    line-height: 0;
    margin: 0;
    overflow: hidden;
    vertical-align: top;
    width: 16px;
}

.treeview-icon.delete { background-image: url(../images/delete_item.png); }

.treeview-icon.add { background-image: url(../images/add_item.png); }

.workflow-dot {
    background: transparent url(../images/workflow-dots.png) no-repeat center;
    height: 75px;
    width: 50px;
}

.workflow-bullet {
    background-position: center;
    cursor: pointer;
    height: 75px;
    width: 75px;
}

.workflow-disabled {
    background: transparent url(../images/workflow-disabled.png) no-repeat center !important;
    cursor: default !important;
}

.workflow-selected { background: transparent url(../images/workflow-selected.png) no-repeat center !important; }

.workflow-unselected { background: transparent url(../images/workflow-unselected.png) no-repeat center; }

.workflowContainer.smallDisplay td { padding: 0; }

.workflowContainer.smallDisplay div.workflow-bullet {
    height: 36px;
    margin: 0;
    width: 38px;
}

.workflowContainer.smallDisplay div.workflow-dot {
    height: 40px;
    /*  background: transparent url(../images/workflow-dots.png) no-repeat center;*/
    width: 40px;
}

.workflowContainer.smallDisplay .rowText { display: none; }

.workflowContainer.smallDisplay {
    margin: 0 !important;
    width: auto !important;
}

tr.nowrap td p {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Template Manager */

.TemplatesManagementForm { background: #f0f0f0; }

/*OVERIDE FOR CLOSE EVENT DROPDOWN*/

/*ENLEVER LES !IMPORTANT*/

.dropdown-menu.pull-right {
    left: auto;
    right: 0;
}

.dropdown-menu li > a {
    display: block;
    line-height: 20px;
    padding: 3px 20px;
    text-align: left;
}

.dropdown-menu li > a:hover, .dropdown-menu li > a:focus, .dropdown-submenu:hover > a {
    background-color: #FF9334;
    background-image: none;
    color: white;
    cursor: pointer;
}

.open > .dropdown-menu { display: block; }

/* ------ Buttons group with active button(s) ---------------------------- */

/* Tickets grid, Notes & Emails, Activities, Calendars */

.btn-group .btn.active, .btn-group .btn.active:focus,
.calendar.fc .fc-button-primary:not(:disabled).fc-button-active, .calendar.fc .fc-button-primary:not(:disabled).fc-button-active:focus {
    background-color: #ff9334;
    border: 1px solid #ca7111;
    color: white;
}
.calendar.fc .fc-button-primary:not(:disabled).fc-button-active:focus {
    box-shadow: none;
}
.btn-group .btn.active:hover,
.calendar .fc-button-active:hover {
    background-color: #e8852d;
}

/*.btn-group .btn {
    margin-right: 5px;
}*/

/* --------------------------------------------------------------------------- */

.btn-group > .btn {
    font-size: 12px;
    margin-left: 2px;
    margin-top: 0px;
    /*font-weight: bold;*/
    /*-moz-border-radius: 5px;*/
    /*border-radius: 5px;*/
}

.btn-group > .btn.actionToggle {
    -moz-border-radius-bottomright: 0px;
    -moz-border-radius-topright: 0px;
    -webkit-border-bottom-right-radius: 0px;
    -webkit-border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    border-top-right-radius: 0px;
    margin-right: 0px;
}

/*span.caret {
    padding-left: 0px;
}

.caret {
    vertical-align: top;
    border-top: 4px solid #ffffff;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
}*/

/*A TESTER SI NECESSAIRE...*/

ul.dropdown-menu {
    -moz-background-clip: padding;
    -moz-border-radius: 6px;
    -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    -webkit-background-clip: padding-box;
    -webkit-border-radius: 6px;
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    background-clip: padding-box;
    background-color: white;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 6px;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    display: none;
    min-width: 160px;
    padding: 5px 0;
    position: absolute;
    z-index: 1000;
}

.popover .dropdown-menu{
    border-style: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    -moz-box-shadow:none;
    position:relative;
}

#aria_active_cell { border-color: lightgrey; }

.k-grid td.k-focused {
    -webkit-box-shadow: none;
    box-shadow: none;
}

.k-grid .k-virtual-scrollable-wrap.k-selected {
    background-color: #ffffff;
    background-image: none;
}

/* This is to avoid to lost lines at the bottom of a grid. */

.k-grid .k-virtual-scrollable-wrap td { white-space: nowrap; }

#noteContentReadOnly {
    -moz-border-radius: 3px;
    -moz-box-shadow: inset 0 0 3px 0px #888;
    -webkit-box-shadow: inset 0 0 3px 0px #888;
    background-color: rgb(235, 235, 228);
    border: 1px solid #777;
    border-radius: 3px;
    box-shadow: inset 0 0 3px 0px #888;
    min-height: 150px;
    padding: 5px;
}

div.subjectInput { margin-right: 15px; }

input.timePickerCtrl { margin-left: 0 !important; }

.previewButtonBar .workflowCanvas {
    float: left;
    margin: 0;
    padding: 0;
}

.previewButtonBar .workflowContainer { padding: 0; }

.previewButtonBar .workflowContainer td { border: none !important; }
.ticket-grid .k-grid-content .previewButtonBar .workflowContainer tr:hover { background-color: transparent !important; }

/* Information Section Style */

.TicketFollowUpSection .k-datetimepicker,
.TicketPlanificationSection .k-datetimepicker,
.TicketFollowUpSection select,
.TicketInformationSection select { width: 95%; }

.TicketFollowUpSection input { width: 87%; }



.TicketFollowUpSection section,
.TicketInformationSection section,
.TicketPlanificationSection section { padding-bottom: 0; }

.ticket-info {
    font-size: 12px;
    padding: 0;
}

.ticket-info div { padding-bottom: 5px; }

.ticket-value {
    font-weight: bold;
    text-align: right;
}

.ticket-label { /*text-decoration: underline;*/ }

.widget-slide button.close,
.btnTicketGridSlide.close { opacity: 1; }

#browseImageListView.k-selectable { width: auto; }

#browseImageListView .k-selected {
    background-color: #BBB;
    background-image: none;
}

.imageItems {
    cursor: pointer;
    float: left;
    height: 64px;
    margin: 6px;
    width: 64px;
}

.modal-header h3 {
    font-size: 14px;
    font-weight: bold;
}

/* Layout fixes */

.managerDetailBlock input.short-text {
    display: block;
    float: left;
    width: 100px;
}

.managerDetailBlock input.long-text {
    display: block;
    float: left;
    width: 320px;
}

/* Ticket References Section */

div.add-reference-section {
    /*float: right;*/
    margin-right: 10px;
    /*text-align: right;*/
}

div.add-reference-section label {
    display: inline-block;
    float: none;
    /*margin-top: 6px;*/
    width: 98%;
}

div.add-reference-section span.add-reference-control {
    float: right;
    text-align: left;
    width: 100%;
}

div.add-reference-section input[type="text"] {
    margin-top: 3px;
    padding: 3px;
    width: 160px;
}

div.ticket-references { clear: both; }

div.ticket-references li.ticket-reference {
    background: #f0f0f0;
    border: 1px solid #d3d3d3;
    display: block;
    float: left;
    height: 32px;
    margin-bottom: 10px;
    margin-right: 10px;
    overflow: hidden;
    padding: 10px 12px;
    position: relative;
    width: 130px;
}

/* DMZ #8531 (start) : overide our default NO style for <ol> and <ul>. Give a style based on the field Description. */

div.ticket-references .popover-content ul,
div.ticket-references .popover-content ol {
    -webkit-margin-after: 1em;
    -webkit-margin-before: 1em;
    -webkit-margin-end: 0px;
    -webkit-margin-start: 0px;
    -webkit-padding-start: 20px;
    display: block;
    line-height: 1.2;
    width: auto;
}

div.ticket-references .popover-content ul { list-style-type: disc; }

div.ticket-references .popover-content ol { list-style-type: decimal; }

/* DMZ #8531 (end) */

div.ticket-references li.ticket-reference:hover {
    background-color: #f29a3c;
    border: 1px solid #f29a3c;
    color: #fff;
    cursor: pointer;
}

div.ticket-references.readonly li.ticket-reference { width: 108px; }

li.ticket-reference .ticket-number {
    float: left;
    font-size: 16px;
    margin-left: 0 !important;
}

li.ticket-reference .deleteLink { margin-top: 1px; }

.w960 .advancedFormOptionsContent .k-input { margin-left: 0px; }

#noteContent {
    max-height: 300px;
    min-height: 150px;
    width: 740px;
}

#emailBody {
    max-height: 300px;
    min-height: 150px;
    width: 740px;
}

.navbar-inverse .nav li.dropdown.open > .dropdown-toggle { background-color: rgba(0, 0, 0, 0.00); }

.checkboxLabel {
    display: inline;
    padding-right: 7px;
    vertical-align: middle;
}

/* Ticket Tasks Section Styles */

div.create-task-section div.add-task-control { display: inline-block; }

span.add-task-control {
    float: right;
    text-align: left;
    width: 100%;
}

div.add-task-control label {
    display: inline-block;
    float: none;
    width: 98%;
}

div.create-task-section { padding: 5px; }

div.create-task-section input[type="text"] {
    padding: 3px;
    width: 160px;
}

div.itemTemplate,
div.taskTemplate,
div.ticket-workflow {
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    background-position: left;
    background-repeat: no-repeat;
    border: 1px solid lightgray;
    border-radius: 5px;
    cursor: default;
    display: inline-block;
    margin: 2px 0 0 0;
    padding-left: 5px;
    width: 98%;
}

div.associatedTickets .itemTemplate {
    margin-right: 5px;
    width: 49%;
}

div.itemTemplate,
div.taskTemplate {
    background-color: white;
    background-image: none;
}

div.itemTemplate.inactive {
    background-color: #f4f4f4;
}

div.ticket-workflow { margin-left: 5px; }

div.ticket-workflow.incident {
    background-image: url(../images/icons/incident_ticket.png) !important;
    background-position: 9px 11px !important;
}

div.ticket-workflow.service-request {
    background-image: url(../images/icons/service_request_ticket.png) !important;
    background-position: 9px 11px !important;
}

div.ticket-workflow.problem {
    background-image: url(../images/icons/problem_ticket.png) !important;
    background-position: 9px 11px !important;
}

div.ticket-workflow.change-request {
    background-image: url(../images/icons/change_request_ticket.png) !important;
    background-position: 9px 11px !important;
}

div.ticket-workflow.project {
    background-image: url(../images/icons/project_ticket.png) !important;
    background-position: 9px 11px !important;
}

div.ticket-workflow.task {
    background-image: url(../images/icons/task_ticket.png) !important;
    background-position: 9px 11px !important;
}

div.ticket-workflow.approval {
    background-image: url(../images/icons/ticket_flag_locked.png) !important;
    background-position: 9px 11px !important;
}

div.ticket-workflow.not-ready { background-color: #F0F0F0; }

/*div.ticket-workflow.not-ready.task {
            background-image: url(../images/task0.png) !important;
        }*/

div.ticket-workflow.task.new {
    background-image: url(../images/task1.png) !important;
    background-position: 2px 4px !important;
}

div.ticket-workflow.task.in-progress {
    background-image: url(../images/task2.png) !important;
    background-position: 2px 4px !important;
}

div.ticket-workflow.task.closed {
    background-image: url(../images/task3.png) !important;
    background-position: 2px 4px !important;
}

div.ticket-workflow.approval.pending {
    background-image: url(../images/approval_waiting.png) !important;
    background-position: 5px 8px !important;
    background-size: 27px 27px !important;
}

div.ticket-workflow.approval.approved {
    background-image: url(../images/icons/approved.png) !important;
    background-position: 5px 8px !important;
}

div.ticket-workflow.approval.refused {
    background-image: url(../images/icons/refused-notblock.png) !important;
    background-position: 5px 8px !important;
}

div.ticket-workflow.approval.refused.is-blocking {
    background-image: url(../images/icons/refused.png) !important;
    background-position: 5px 8px !important;
}


div.itemTemplate div.item-info,
div.taskTemplate div.task-info,
div.ticket-workflow div.task-info {
    display: inline-block;
    float: right;
    padding: 12px 10px 5px 0;
    text-align: right;
}

div.itemTemplate div.item-overview,
div.taskTemplate div.task-overview,
div.ticket-workflow div.task-overview {
    border-right: 1px;
    /*width: 50%;*/
    display: inline-block;
    padding: 10px;
}

div.itemTemplate div.item-actions,
div.taskTemplate div.task-actions,
div.ticket-workflow div.task-actions {
    clear: both;
    float: right;
    padding: 5px;
}

div.ticket-workflow div.task-actions button { margin-right: 0; }

div.itemTemplate div.task-overview div.item-summary,
div.taskTemplate div.task-overview div.task-summary,
div.ticket-workflow div.task-overview div.task-summary {
    font-weight: bold;
    padding-left: 20px;
}

div.itemTemplate div.item-overview div.item-summary,
div.taskTemplate div.task-overview div.task-summary { padding-left: 0px; }

div.itemTemplate div.item-overview div.item-description,
div.taskTemplate div.task-overview div.task-description,
div.ticket-workflow div.task-overview div.task-description {
    padding-left: 30px;
    padding-top: 5px;
}

div.taskTemplate div.task-info div.task-number,
div.ticket-workflow div.task-info div.task-number {
    display: inline-block;
    height: 20px;
    width: 128px;
}

div.item-step { float: left; }

div.itemTemplate div.item-info,
div.itemTemplate div.item-overview { padding-top: 15px; }

div.itemTemplate {
    margin-top: 5px;
    padding-bottom: 2px;
}

div.itemTemplate div.item-info { width: auto; }

div.itemTemplate div.item-number { padding-right: 10px; }

div.ticket-workflow div.task-info div.task-date {
    display: inline-block;
    height: 20px;
    text-align: left;
    width: 100px;
}

div.taskTemplate div.task-info div.task-resources,
div.ticket-workflow div.task-info div.task-resources {
    display: inline-block;
    height: 20px;
    padding-left: 20px;
    text-align: left;
    width: 90px;
}

div.ticket-workflow div.task-info div.task-queue {
    display: inline-block;
    height: 20px;
    text-align: left;
    width: 130px;
}

/* END OF: Ticket Tasks Section Styles */

.typeahead-type {
    float: left;
    left: -10px;
    position: relative;
}

.typeahead-category {
    font-size: 14px;
    font-style: italic;
    padding-left: 20px;
}

.typeahead-service {
    font-size: 12px;
    font-weight: bold;
    padding-left: 20px;
}

.typeahead-request {
    font-size: 14px;
    font-weight: bold;
    padding-left: 20px;
}

.typeahead-clientNumber { font-size: 12px; }

div.tt-suggestion {
    clear: both;
    font-size: 100%;
    line-height: 20px;
    white-space: normal !important;
}

.typeahead-clientFullName, .typeahead-ticketSequenceNumber, .typeahead-group, .typeahead-print-templates {
    font-size: 14px !important;
    font-weight: bold;
    padding-bottom: 0 !important;
}

.typeahead-clientFullName i.resource-state {
    float: right;
    padding-top: 2px;
}

.typeahead-print-templates i {
    border: 1px solid #ffffff;
    border-radius: 2px;
}

.typeahead-print-templates-public-false i,
.print-template-box.private { color: #888; }

.typeahead-print-templates-public-true i,
.print-template-box.public { color: #F29A3C; }

.print-template-box {
    border: 1px solid #ffffff;
    border-radius: 4px;
    top: 5px;
}

.typeahead-clientEnterprise {
    font-size: 16px;
    font-style: italic;
    padding-bottom: 0 !important;
}

.typeahead-clientUserName, .typeahead-ticketSummary {
    font-size: 12px; /*for responsive design : use 0.66em*/
    padding-bottom: 0 !important;
}

.typeahead-ticketEnterprise {
    font-size: 12px;
    font-weight: bold;
}

.typeahead-searchField1, .typeahead-searchField2 {
    font-size: 12px;
    padding-bottom: 0 !important;
}

.typeahead-CINumber, .typeahead-SequenceNumber {
    float: right;
    font-size: 12px;
    font-style: italic;
}

.typeahead-CIName, .typeahead-Name { font-size: 16px; }

.typeahead-CIType {
    float: left;
    padding-right: 10px;
    width: 24px;
}

.typeahead-CIType img {
    height: 24px;
    width: 24px;
}

.typeahead-reading-status {
    left: 5px;
    position: absolute;
    top: 12px;
    z-index: 99;
}

.typeahead-reading-status .fa-check { color: #F29A3C; }

form[name=TicketsGridAdvancedSearchForm] .field-value .typeahead-reading-status { margin-top: -23px; }

.dialog-timer-form .typeahead-reading-status { top: 8px; }

.events-c2client-selection .typeahead-reading-status { top: 4px; }

form[name=ticketTypesManagerForm] .typeahead-reading-status,
form[name=searchFormAction] .multiple-select.typehead-template .typeahead-reading-status { padding-top: 18px; }

.select-request .typeahead-reading-status,
.atom-client-template .typeahead-reading-status,
.field-value .typeahead-reading-status,
.anonymousClient .typeahead-reading-status,
.client-file-change-request .typeahead-reading-status,
.portal-chat-request .typeahead-reading-status,
form[name=processesManagerForm] .typehead-template .typeahead-reading-status,
form[name=bankedHoursManagerForm] div[name=enterprise] .typeahead-reading-status,
form[name=bankedHoursManagerForm] div[name=ci] .typeahead-reading-status,
form[name=customFieldsManagerForm] .custom-button-configuration .typehead-template .typeahead-reading-status { padding-top: 17px; }

.popover .field-value .typeahead-reading-status {
    padding-top: 0;
    top: 7px;
}

.typehead-template { position: relative; }

.dialog-timer-form .twitter-typeahead { display: inline !important; }

.enterpriseList .typeahead-reading-status { margin-left: 0 !important; }

.RequestsManagerCtrl .enterpriseList .typeahead-reading-status,
.TaskTemplatesManagerCtrl .enterpriseList .typeahead-reading-status { top: 28px !important; }

.RequestsManagerCtrl div[name='usable-print-templates'] .typeahead-reading-status { top: 12px !important; }


.tt-is-under-cursor .typeahead-CIType { /*-webkit-filter: invert(100%);*/ }

.pointer { cursor: pointer; }

.block-centered {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

div.ticket-grid { margin-left: 4px; }

div.ticket-grid .k-hierarchy-cell, div.ticket-grid .k-hierarchy-col {
    border: 0px;
    padding: 0px;
    width: 1px;
}

div.ticket-grid .k-hierarchy-cell a, div.ticket-grid .k-hierarchy-col a { display: none; }

div.tickets-grid-toolbar {
    display: flex;
    height: 35px;
    padding: 0 1px 0 4px;
}

div.tickets-grid-toolbar .toggle-buttons {
    flex: 1;
}

.span12 .custom-fields {
    margin: 0;
    min-height: 50px;
    padding: 0;
}

.custom-fields {
    margin: 0;
    margin-left: 5px;
    /*min-height: 79px;*/
    padding: 0;
}

.custom-fields textarea {
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    box-sizing: border-box; /* Opera/IE 8+ */
}

.custom-fields label {
    margin-bottom: 2px;
    min-height: 14px;
}

.custom-field-label-area {
    display: block;
    cursor: default;
}

.custom-field-label-area .custom-field-attributes {
    display: inline-block;
}

.custom-field-label-area .custom-field-attributes .import-order {
    border: 2px solid gray;
    cursor: default;
    font-size: 10px;
    padding: 1px 5px;
}

.custom-field-label-area .custom-field-attributes .attribute-required {
    color: red
}

.custom-field-label-area .custom-field-attributes .attribute-readonly {
    margin-top: 2px;
}

.custom-field-label-area .custom-field-attributes .attribute-binding {
    font-size: medium;
}

.custom-field-label-area .custom-field-attributes .attribute-do-not-copy {
    height: 14px;
    margin-top: -12px;
    width: 14px;
}

.custom-field-label-area .custom-field-attributes .attribute-do-not-copy i {
    font-weight: bold;
}

.custom-field-label-area .custom-field-attributes .attribute-do-not-copy span {
    color: red;
    font-size: 27px;
    font-weight: bold;
    margin-top: -1px;
}

.custom-field-label-area .custom-field-attributes .attribute-validations {
    color: red;
    font-size: medium;
}

.custom-field-label-area .attribute-secured {
    margin-top: 4px;
}

.custom-field-label-area .custom-field-name-build-mode {
    line-height: 20px;
    word-wrap: break-word;
    position: relative;
    top: 2px;
}

.custom-field-label-area .custom-field-name {
    word-wrap: break-word;
}

.custom-field-label-area .custom-field-number {
    line-height: 20px;
    position: relative;
    top: 2px;
}

/* Hack depending of where the directive is located */
.build-custom-fields .custom-fields {
    min-height: 85px;
}

.build-custom-fields .custom-field-cell {
    min-height: 70px !important;
    padding: 3px;
    position: relative;
}

.build-custom-fields .custom-field-cell,
.condition-group,
.ldap-configuration-container {
    border: 2px dashed gray;
}

.condition-group {
    padding: 5px;
}

.ldap-configuration-container {
    margin: 10px 0;
    padding: 10px;
}

.custom-field-cell .icon-pencil {
    position: absolute;
    right: 20px;
}

.custom-fields-switch { }

.custom-fields-switch > div,
.custom-fields-switch > div textarea {
    float: left;
    width: 100%;
}

.custom-fields-switch span.twitter-typeahead { margin-left: 0; }

.custom-fields-switch input[type="checkbox"] {
    margin-left: 6px;
    margin-right: 5px;
    width: auto;
}

.custom-fields-switch i.icon-remove {
    float: right;
    margin-right: 10px;
    margin-top: 27px;
}

.custom-fields-switch label.checkbox-label {
    padding-bottom: 0;
    padding-top: 4px;
}

/*Hack for kendo in 2 mode: Editable and normal mode for customFields directive*/

.k-datetimepicker input,
.k-datepicker input,
.k-timepicker input {
    height: 28px;
    margin-bottom: 0;
    border: none;
}

.k-datetimepicker button:active,
.k-datepicker button:active,
.k-timepicker button:active,
.k-pager-sizes .k-dropdownlist .k-button:active {
    background-image: none;
}

.k-datetimepicker button:hover,
.k-datepicker button:hover,
.k-timepicker button:hover {
    border-color: var(--kendo-color-border-alt)
}

.build-custom-fields .custom-fields-switch .k-datetimepicker,
.build-custom-fields .custom-fields-switch .k-datepicker,
.build-custom-fields .custom-fields-switch .k-timepicker {
    height: 30px;
    margin-bottom: 0;
}

.custom-fields .k-datetimepicker .k-input,
.custom-fields .k-datepicker .k-input,
.custom-fields .k-timepicker .k-input,
.custom-fields .build-custom-fields .custom-fields-switch .k-datetimepicker,
.custom-fields .build-custom-fields .custom-fields-switch .k-datepicker,
.custom-fields .build-custom-fields .custom-fields-switch .k-timepicker {
    height: 24px;
    min-height: 24px;
}


.custom-fields-switch .k-datetimepicker,
.custom-fields-switch .k-datepicker,
.custom-fields-switch .k-timepicker {
    margin-bottom: 3px;
    width: 100%;
}

.custom-fields-switch .k-datetimepicker input,
.custom-fields-switch .k-datepicker input,
.custom-fields-switch .k-timepicker input {
    margin-left: 0;
    padding-bottom: 3px;
}

.custom-fields-switch h3.custom-field-label {
    border-bottom: 1px solid #D3D3D3;
    font-size: 100%;
    font-weight: bold;
    margin: 4px 0;
    padding: 3px 0 3px;
}

label.required-field-checkbox {
    margin-left: 0 !important;
    padding-left: 16px;
    padding-top: 0 !important;
    width: 31% !important;
}

label.required-field-checkbox input { margin-left: 5px !important; }


.Association .select2-search-field input,
.atAssociationTemplate .twitter-typeahead .tt-query, .atAssociationTemplate .twitter-typeahead .tt-hint,
.association-template-customizable .twitter-typeahead .tt-query, .association-template-customizable .twitter-typeahead .tt-hint { width: 444px !important; }

.build-custom-fields .select2-container {
    margin: 3px 0;
    padding-right: 1px;
    width: 99%;
}

.add-task-control input { width: 160px !important; }

/* Managers Style (New Bootstrap stuff) */

.Manager { background: linear-gradient(to right, white, white 80%, #f0f0f0); }

div.manager-form {
    background: white;
    max-width: 960px;
    padding: 12px;
}

div.button-bar {
    display: inline-block;
    float: right;
}

div.button-bar button { margin: 2px; }

#newTicketWizard h4, .portal-form h4, .customButtonPopupForm h4 {
    font-size: 14px;
    height: 22px;
}

div.manager-form h4 {
    border-bottom: 1px solid #D3D3D3;
    font-size: 14px;
    font-weight: bold;
    margin: 5px 0 5px 0;
    padding-bottom: 4px;
}

div.manager-form div.collapsibleContent { padding: 0 0 10px 20px; }

form[name=ciForm] .ci-clients-section .collapsibleContent,
form[name=ciForm] .ci-enterprises-section .collapsibleContent,
form[name=ciForm] .impacted-cis-section .collapsibleContent,
form[name=ciForm] .dependent-cis-section .collapsibleContent {
    padding-top: 10px;
}

#userpreferences div.manager-form div.collapsibleContent {
    padding-top: 5px;
}

#userpreferences div.manager-form .sub-section-title {
    font-weight: bold;
    margin-bottom: 11px;
}

#userpreferences div.manager-form .sub-section label { font-weight: bold; }

#userpreferences div.manager-form .sub-section .sub-section-label { font-weight: normal; }

#userpreferences div.manager-form .sub-section {
    border-left: 1px solid #D3D3D3;
    margin: 10px 20px 30px 0;
    padding-left: 17px;
}

#userpreferences #ticketform table { border-top: none; }

div.manager-form label {
    display: block;
    float: left;
    padding-top: 5px;
    text-align: left;
    width: 100%;
}

div.manager-form label.checkbox span {
    display: block;
    padding-top: 5px;
}

div.manager-form div.save-as-group {
    padding-left: -2px;
    padding-right: 2px;
    padding-top: 20px;
}

div.manager-form input, div.manager-form textarea,
.actions-popup input, .conditions-popup input {
    box-sizing: border-box;
    min-height: 30px;
    padding-left: 7px;
    padding-right: 7px;
    width: 100%;
}

div.manager-form input[type="checkbox"],
.actions-popup input[type="checkbox"],
.conditions-popup input[type="checkbox"] {
    min-height: inherit;
    width: auto;
}

input.select2-offscreen { width: 96% !important; }

div.popup-form h4 {
    border-bottom: 1px solid #D3D3D3;
    font-size: 100%;
    font-weight: bold;
    margin: 10px 0 10px 0px;
    padding-bottom: 3px;
    text-transform: uppercase;
}

div.popup-form label {
    font-weight: bold;
    text-transform: uppercase;
}

div.checkbox-list {
    margin-bottom: 10px;
    width: 100%;
}

div.checkbox-list .checkbox-list-item {
    display: inline-block;
    margin-left: 1.333333333333333%;
    width: 31%;
}

.manager-message {
    color: black;
    display: inline-block;
    font-weight: bold;
    text-align: left;
}

.ticketFormLeft {
    min-width: 350px;
    padding-right: 0px;
    vertical-align: top;
    width: 350px;
}

.ticketFormLeft .ticketClientSelect .twitter-typeahead { width: 80%; }

.ticketFormLeft .ciSection .ciItemBox li.itemBox { height: 55px; }

.ticketFormLeft .ciSection .ciItemBox li.itemBox .boxTemplate { height: 60px; }

/* sibling element */

/*.collapsibleSectionHeader.autocomplete.expanded + .collapsibleContent,
.autocomplete .collapsibleSectionHeader.expanded + .collapsibleContent {*/

.collapsibleSectionHeader.expanded + .collapsibleContent {
    margin-top: 2px;
    overflow: inherit !important; /*this is required for the typeahead*/
}

.loadingGif { background-image: url(../images/loading.gif) !important; }

.atRequestWorkflows .loadingGif {
    display: inline-block;
    height: 16px;
    margin-left: 3px;
    width: 16px;
}

communication-container:focus { outline: none; }

span.activity-row {
    background-color: white;
    border-bottom: 1px solid white;
    min-height: 48px;
    overflow: hidden;
    padding: 5px 0px;
}

span.activity-row .modified-on {
    font-weight: bold;
}

span.activity-row .modified-on img {
    height: 16px;
    padding-right: 20px;
    width: 16px;
}

span.activity-row.client-notes { min-height: 53px; }

span.activity-row span,
span.my-activity-row span { word-wrap: break-word; }

div.communication-container:focus { border: none !important }

div.communication-container span.activity-row span {
    font-size: 12px;
    overflow: hidden;
    padding: 5px 0px;
    text-overflow: ellipsis;
}

div.communication-container span.activity-row span .fa-paperclip { font-size: 16px; }

span.activity-row.light { background-color: #f0f0f0; }

span.activity-row.dark {
    background-color: darkgrey;
    color: white;
}

/* Activities in managers */
.activity-grouping-row .field-name {
    padding-left: 10px;
}
span.activity-grouping-row {
    border-bottom: 1px solid lightgrey;
    font-size: 12px !important;
}
.activity-grouping-row,
.activity-grouping-row span,
.activity-grouping-name {
    min-height: 1em !important;
    padding: 3px 0;
}
.activity-grouping-name {
    padding-top: 13px;
    font-weight: 600;
    font-size: 12px !important;
}

form[name=groupsManagerForm] .activity-row .modified-on,
form[name=resourcesManagerForm] .activity-row .modified-on,
form[name=reportManagerForm] .activity-row .modified-on {
    font-weight: normal;
}
form[name=groupsManagerForm] .activity-row,
form[name=resourcesManagerForm] .activity-row,
form[name=reportManagerForm] .activity-row {
    font-size: 12px;
}
form[name=groupsManagerForm] .activity-row .username,
form[name=resourcesManagerForm] .activity-row .username,
form[name=reportManagerForm] .activity-row .username {
    padding-top: 3px;
}
form[name=groupsManagerForm] .activity-row .username .atomicon-user,
form[name=resourcesManagerForm] .activity-row .username .atomicon-user,
form[name=reportManagerForm] .activity-row .username .atomicon-user {
    float: left;
    margin-top: -2px;
}
form[name=groupsManagerForm] .activity-row .title,
form[name=resourcesManagerForm] .activity-row .title,
form[name=reportManagerForm] .activity-row .title {
    padding: 4px 0 0 0;
}

.atomicon-user {
    background: url(../images/icons/user.png) no-repeat;
    display: inline-block;
    height: 20px;
    width: 20px;
}

.atomicon-chevron-right {
    background-image: url(../images/icons/chevron-right.png);
    display: inline-block;
    height: 20px;
    width: 20px;
}

.atomicon-calendar {
    background: url(../images/calendar.png) no-repeat;
    display: inline-block;
    height: 20px;
    width: 20px;
}

.atomicon-edit-pen {
    background: url(../images/icons/edit-icon.png) no-repeat;
    display: inline-block;
    height: 20px;
    width: 20px;
}

.ticketRightSection { }

.ticketRightSection .service-catalog input { width: 92%; }

div.ci-grid-control { margin-left: 240px; }

div#folder-left-pane {
    display: inline-block;
    width: 300px;
}

div.folders-treeview {
    background-color: #f8f8f8;
    border: 1px solid #d3d3d3;
    float: left;
    margin-left: 20px;
    min-height: 300px;
    padding: 0;
    width: 310px;
}

.enterprise-grid div.folders-treeview,
.ci-grid div.folders-treeview { min-height: 125px; }

div.folders-treeview > div.k-treeview {
    max-height: 285px;
    padding-top: 5px;
}

div.folders-treeview div.treeview-title {
    font-weight: bold;
    margin: 10px 0 0 10px;
}

.enterprise-grid div.folders-treeview > div.k-treeview { max-height: 600px; }

.grid-widget {
    border-right: 1px solid #89a600;
    float: left;
    padding-left: 5px;
    padding-right: 4px;
    width: 300px;
}

#TicketsTab .grid-widget { width: 242px; }

.grid-widget .widgetHeader {
    margin-left: 0;
    padding: 0 0 0 4px;
}

.grid-widget .widgetHeader .g9 {
    margin-left: 0;
    padding-right: 20px;
}

.grid-widget .filters {
    margin-left: 20px;
    width: 100%;
}

.grid-widget .folders-treeview { width: 100%; }

div.folder-grid { margin-left: 350px; }

.grid-with-widget { margin-left: 315px; }

#TicketsTab .grid-with-widget { margin-left: 5px; }
#TicketsTab #calendarResourceView .grid-with-widget { margin-left: 0; }

.grid-widget .k-treeview-item .k-image,
.folders-treeview .k-treeview-item .k-image {
    width: 16px;
}

#ResourcesGroupsTree .k-treeview-item .k-image { width: auto; }

.cIFoldersManagerCtrl .folders-treeview .k-treeview-item .k-image,
.CICategoriesManagerCtrl .folders-treeview .k-treeview-item .k-image,
.ci-grid #widget-categories .k-treeview-item .k-image {
    width: 25px;
}

.cIFoldersManagerCtrl .folders-treeview .k-treeview-item .k-treeview-leaf,
.CICategoriesManagerCtrl .folders-treeview .k-treeview-item .k-treeview-leaf,
.ci-grid #widget-categories .k-treeview-item .k-treeview-leaf { line-height: 23px; }

.cIFoldersManagerCtrl .folders-treeview .k-treeview-item .k-treeview-leaf .fa-folder,
.cIFoldersManagerCtrl .folders-treeview .k-treeview-item .k-treeview-leaf .fa-home { margin-top: 6px; }

form[name=cicategoriesManagerForm] .visible-to-groups .twitter-typeahead,
form[name=cicategoriesManagerForm] .visible-to-groups .twitter-typeahead input.tt-hint,
form[name=cicategoriesManagerForm] .visible-to-groups .twitter-typeahead input.tt-query,
form[name=cicategoriesManagerForm] .visible-to-groups .typeahead-reading-status { margin-left: 0 !important; }

.enterpriseList .twitter-typeahead {
    margin-left: 0 !important;
    width: 92%;
}

.enterpriseList .g6 input { margin-left: 0; }

.multipleselector-boxpadding ul li { margin: 20px 20px 0 0; }

.multipleselector input .tt-query { width: 93%; }

.clear-field {
    background: url(../images/delete.png) no-repeat;
    border: 0;
    cursor: pointer;
    height: 12px;
    margin-left: -20px;
    margin-top: 11px;
    position: absolute;
    width: 12px;
}

.span7 .clear-field, .ci-form .clear-field { margin-left: -30px; }

.ticketRightSection .span12 .custom-fields-switch .clear-field { margin-left: -35px; }


/* Priority Matrix CSS */

table.priority-matrix {
    margin: 10px 0;
    width: 100%;
}

td.priorityMatrixCell {
    background-color: white;
    border: solid 1px grey;
    min-height: 50px;
    padding: 4px;
    text-align: center;
    width: 100px;
}

.priorityMatrixHeader {
    border: solid 1px grey;
    font-weight: bold;
    height: 30px;
    text-align: center;
}

div.header { font-weight: bold; }

div.priority-label { padding: 10px 20px; }

div.modifier-name {
    height: 50px;
    padding: 20px;
}

.Manager.Dashboard .row {
    margin-left: 20px;
    margin-right: 40px;
}

.google-chart > div { margin: 0 auto; }

.google-chart svg > g > g:last-child { pointer-events: none }

.ticketResource_Control { padding-bottom: 2px; }

html.windowsAuth button.reset-password,
html.identityAuth button.reset-password { display: none !important; }

html.windowsAuth .headerControlLogout,
html.identityAuth .headerControlLogout { display: none; }

html.windowsAuth #changePasswordMenuItem,
html.identityAuth #changePasswordMenuItem { display: none; }

.warning-error {
    color: red;
    display: block;
    padding-bottom: 10px;
    padding-right: 10px;
}

div.ticket-form input, div.ticket-form textarea {
    margin: 2px 0;
    padding: 5px;
    width: 95%;
}

div.ticket-form div.row-fluid { padding-top: 10px; }

.large-box li { width: 100px !important; }

.compact-box li { height: 40px !important; }

.small-compact-box li {
    height: 35px !important;
    width: 77px;
}


/* Kendo Time Picker in parameters manager has some display issues. */

span.timePickerCtrl { margin-top: 5px; }

span.timePickerCtrl span.k-timepicker {
    margin-left: 0;
    padding-bottom: 0;
}

#workingStartTime, #workingEndTime { margin-left: 0px; }

.workingHours { margin-bottom: 4px; }

.strip-kendo-upload .k-upload-status, .strip-kendo-upload .k-upload-files { display: none; }

/* Process editor for InterAction */

button.add-remove-button,
a.add-remove-button {
    margin-top: 20px;
    padding: 5px 10px;
}

div.save-load-template {
    margin-right: 4px;
    margin-top: 20px;
    padding: 0;
}

.save-load-template .fa-upload,
.save-load-template .fa-download {
    background-color: white;
    padding: 6px 10px 7px 10px;
    position: relative;
}

.save-template-popup {
    display: block;
    left: 236px;
    position: relative;
    top: 47px;
}

div.border-bottom {
    border-bottom: lightgrey 1px solid;
    margin-bottom: 20px;
    padding-bottom: 5px;
}

div.compact-box div.g6 { padding: 0; }

.parentCheckBox { padding-top: 22px; }

.redactorContent, .redactorContent p, .redactorContent li, .redactorContent ol, .redactorContent ul, .redactorContent span, .redactorContent div {
    line-height: 1.5rem;
    margin: auto;
}

.redactorContent ul { list-style: disc inside; }

.redactorContent ol { list-style: decimal inside; }

input.multiple-select { width: 93%; }

.dont-remove-first .itemBox:first-child .deleteLink { display: none !important; }

.visibility-hidden { visibility: hidden; }

#redactor_modal input[type="text"], #redactor_modal input[type="password"], #redactor_modal input[type="email"], #redactor_modal textarea { z-index: 1003 !important; }

span.bold { font-weight: bold; }

.description-section-content { min-height: 270px; }

.disabled-user-select {
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}

.screenshotContainer {
    height: auto;
    width: auto;
}

.noteAttachment img {
    border: 1px solid lightgray;
    border-radius: 4px;
    display: inline;
    height: auto;
    margin: 10px;
    margin-top: 5px;
    padding: 8px;
    width: 256px;
}

.fa-paperclip {
    font-size: 16px;
    position: relative;
    top: 2px;
    transform: rotate(90deg);
}


.at-attachments .k-upload-button { text-transform: uppercase; }

.at-attachments.strip-kendo-upload { margin: 5px auto; }

.at-attachments .invalid-file-message {
    margin-top: 10px;
    display: inline-block;
}

.ticket-item-vertical-spacing { margin: 1em 0 2em 0; }

.ListFiltersManagerCtrl .custom-treeview ul {
    font-size: 12px;
    overflow: auto;
    padding: 5px 20px;
    white-space: nowrap;
}

.ListFiltersManagerCtrl .custom-treeview ul li {
    cursor: default;
    height: 22px;
}

.ListFiltersManagerCtrl .custom-treeview ul li span {
    border-radius: 4px;
    padding: 1px 4px 3px 2px;
}

.ListFiltersManagerCtrl .custom-treeview ul li span.selected,
.ListFiltersManagerCtrl .custom-treeview ul li span.selected:hover {
    background-color: #F4AD61;
    border: 1px solid #B95337;
}

.ListFiltersManagerCtrl .custom-treeview ul li span:hover {
    background-color: #A99F9A;
    border: 1px solid #B95337;
}

.noselect {
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
}


.ticket-grid td.sequenceNumber:hover,
.ci-grid .ciNumber:hover,
.search-grid td.sequenceNumber:hover,
.search-grid .ciNumber:hover,
.client-grid td.sequenceNumber:hover,
.resource-grid td.sequenceNumber:hover,
.enterprise-grid td.sequenceNumber:hover { color: #005580; }

.ticket-grid td.sequenceNumber span:hover,
.ci-grid .ciNumber span:hover,
.search-grid td.sequenceNumber span:hover,
.search-grid .ciNumber span:hover,
.client-grid td.sequenceNumber span:hover,
.resource-grid td.sequenceNumber span:hover,
.enterprise-grid td.sequenceNumber span:hover { text-decoration: underline; }

.enterprise-grid .folders-treeview { height: 625px; }

td.entity-manager-ctrl-id:hover,
td.entity-manager-ctrl-id span:hover {
    color: #005580;
    text-decoration: underline;
}

/*TicketGrid DragNDrop Feature*/

.widgetReached {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; /*IE8 support for transparency*/
    background-color: #e0e0e0;
    border-color: #06c;
    opacity: 0.6;
}

span.checkall-image {
    background: transparent url(../images/icons/checkall.png) center center no-repeat;
    display: inline-block;
    height: 18px;
    width: 19px;
}

span.uncheckall-image {
    background: transparent url(../images/icons/uncheckall.png) center center no-repeat;
    display: inline-block;
    height: 18px;
    width: 19px;
}

.isPrivateFilter {
    background: url(../images/gray_bullet.png) left 0.35em no-repeat;
    line-height: 1.2em;
    padding-left: 15px;
}

.isPublicFilter {
    background: url(../images/orange_bullet.png) left 0.35em no-repeat;
    line-height: 1.2em;
    padding-left: 15px;
}

.tt-dropdown-menu {
    color: black;
    max-height: 400px;
    overflow-y: auto;
}

body.intro-enabled .tt-dropdown-menu { z-index: 2000 !important; }

.custom-field-sections .popover-content {
    line-height: 20px;
    padding: 0 14px 9px 14px;
}

.custom-field-sections .custom-field-row { margin: 6px 0 5px 0; }

.custom-fields .custom-geolocation-control .popover {
    left: auto !important;
    right: 0 !important;
}

.custom-fields .custom-geolocation-control .popover .arrow { display: none; }

.custom-geolocation-control .popover-content { padding: 0; }


div.manager-form .custom-field-sections input[type="text"],
div.portal-kb-header-box .custom-field-sections input[type="text"] {
    box-sizing: border-box;
    height: 30px;
    margin-bottom: 2px;
    width: 100%;
}

div.manager-form .custom-field-sections textarea { width: 100%; }

div.manager-form .custom-field-sections .k-datetimepicker input[type="text"],
div.manager-form .custom-field-sections .k-datepicker input[type="text"],
div.manager-form .custom-field-sections .k-timepicker input[type="text"] {
    box-sizing: initial;
    /*height: auto;*/
}

div.manager-form .custom-field-sections .build-custom-fields label {
    margin-bottom: 5px;
    /*width: auto;*/
    padding-right: 35px;
}

div.manager-form .custom-field-sections .build-custom-fields label.checkbox-label { padding-right: 0; }

i.icon-required {
    background: url(../images/icons/required.png) center center no-repeat !important;
    display: inline-block;
}

.square-plus-button,
#addNoteButton {
    height: 30px;
    text-decoration: none;
    width: 32px;
}

#userpreferences #ticketform .expanded-section,
#userpreferences #ciform .expanded-section {
    background-color: #ffffff;
    border-radius: 7px;
    color: #a09f9f;
    font-style: italic;
    padding: 3px 0px 3px 7px;
}

#userpreferences #ticketform,
#userpreferences #ciform { padding-right: 90px; }

#userpreferences #ticketform.sub-section h4,
#userpreferences #ciform.sub-section h4 {
    margin: 0;
    margin-bottom: 2px;
    padding: 10px 0 5px 20px;
}

.ticketFull .g12 { padding: 0; }

.groupFeatureSet .row-fluid { padding-bottom: 10px; }

.groupFeatureSet input[type='checkbox'] { float: left; }

.groupFeatureSet label {
    float: none !important;
    margin-left: 20px !important;
    padding-top: 2px !important;
    width: auto !important;
}

.groupFeatureSet h4 span {
    font-weight: bold;
    margin-right: 10px;
}

.groupFeatureSet .g3 {
    margin-bottom: 4px;
    padding: 0;
}

.cIFoldersManagerCtrl li.itemBox {
    padding-right: 13px;
    width: 100px;
}

i.ui-icon-rating {
    background: url(../rateit-custom/star-gold32.png) no-repeat;
    display: inline-block;
    height: 32px;
    width: 32px;
}

h4.collapsibleSectionHeader.noCollapsible { background-image: none !important; }

.ticketFull .row-fluid .span3, .ticketFull .row-fluid .span2 { padding: 5px 0 0 0; }

/* Used for custom field (string and memo) */

.uppercase { text-transform: uppercase; }

.lowercase { text-transform: lowercase; }

span.timestamp-tag {
    color: #6d6d6d;
    font-style: italic;
}

/* TextAngular */

.ta-editor {
    border-bottom: 1px solid #ccc;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    font-family: inherit;
    font-size: 100%;
    min-height: 100px !important;
    overflow: auto;
}

.ta-toolbar {
    background: linear-gradient(#ffffff, #e5e5e5);
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    border-top: 1px solid #ccc;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    margin: 0;
    padding: 7px;
}

.unread-note-or-email { font-weight: bold; }

.add-note {
    background: transparent url(../images/icons/journal_addnote.png) no-repeat left;
    padding-right: 5px;
}

div.task-number { display: inline-block; }

.add-note, .add-note-container {
    display: inline-block;
    height: 24px;
    width: 24px;
}

div.task-description { padding: 7px; }

div.task-number:hover,
.notification-number {
    color: #005580;
    text-decoration: underline;
}

div.ticket-workflow div.task-overview div.task-description { padding-left: 83px; }

div.ticket-workflow {
    background-position: left;
    background-position-y: 7px;
}

div.animate-background-color div { transition: background-color 0.5s linear; }

div.row-highlight {
    background-color: #CCCC00;
    background-color: rgba(255, 255, 0, 0.4);
}

.ticket-activity-paging .pagination { padding-left: 20px; }

.advanced-search .field-value label,
.advanced-search .field-value .time-unit { display: none; }

.advanced-search .field-value .time-value {
    margin: 0;
    width: 100%;
}

.advanced-search .field-value input,
.variable-values input { width: 90%; }

.advanced-search .field-value select,
.advanced-search .field-value .k-widget,
.variable-values select,
.variable-values .k-widget { width: 95% !important; }

.advanced-search .field-value .clear-field,
.variable-values .clear-field { margin-left: -32px; }

.variable-values .typeahead-reading-status { top: 6px; }

/* Bypass validation on advanced search */

.advanced-search .val-hasError,
.advanced-search .val-hasError2 { border: 1px solid #CCC !important; }

.ui-tooltip-validation {
    background: #C44747;
    border: 0;
}

.ui-tooltip-validation .ui-tooltip-content { text-align: center; }

.main-client-search .popover {
    max-width: 335px;
    top: -65px !important;
}

.error-select-only { color: red; }

.error-select-only option { color: black; }

.ticketFull .btn-group .btn { margin-right: 0; }

ul.remote-application {
    list-style: disc;
    margin-left: 15px;
}

ul.remote-application li {
    cursor: pointer;
    height: 25px;
}

.fc-state-default {
    box-shadow: none !important;
    text-shadow: none !important;
}

.fc-more-popover .fc-event-container {
    max-height: 400px;
    overflow: auto;
}

#calendar button.fc-state-down, #calendar button.fc-state-active {
    background-color: #f29a3c !important;
    border: #f29a3c !important;
}

#calendar .fc-print-button:before,
#timesheet-calendar .fc-print-button:before {
    content: "\f02f";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
}

#calendar .fc-print-button,
#timesheet-calendar .fc-print-button {
    font-size: 18px;
    margin-right: 10px;
    margin-right: 15px !important;
    width: 41px;
    padding-top: 1px;
}

.pagination ul > li > a:focus, .pagination ul > li > a:hover, .pagination ul > .active > a, .pagination ul > .active > span {
    background-color: #ff9334;
    border: 1px solid #ca7111;
    border-radius: 2px;
    color: white;
    cursor: pointer;
    font-weight: bold;
}


.encryption-form h1 {
    font-size: 18px;
    font-weight: bold;
    margin: 20px 0;
    text-align: center;
}

.encryption-form section {
    background-color: white;
    border: 1px solid black;
    margin: auto;
    padding: 20px;
    text-align: center;
    width: 500px;
}

.encryption-form section input { width: 98%; }

.encryption-form section label {
    margin: 5px 0;
    text-align: left;
}

.encryption-form section button { margin: 20px 0; }

.chat-form .chat-messages {
    bottom: 63px;
    left: 10px;
    overflow: auto;
    position: absolute;
    right: 0;
    top: 0;
}

.chat-form .chat-messages .chat-message {
    margin: 5px 0;
    text-align: right;
}

.chat-form .chat-messages .chat-message.other-user { text-align: left }

.chat-form .chat-messages .chat-message-text {
    background-color: #ff9334;
    border-radius: 0 5px 5px 5px;
    border-radius: 4px;
    color: #111;
    display: inline-block;
    margin-right: 10px;
    padding: 4px 10px 9px 10px;
    position: relative;
    text-align: left;
    word-break: break-word;
}

.chat-form .chat-messages .chat-message.other-user .chat-message-text {
    background-color: #ddd;
    color: black;
    margin: 5px 10px 0 45px;
}

.chat-form .chat-messages .chat-message.from-system .chat-message-text {
    background-color: black;
    color: white;
    margin-left: 45px;
    margin-right: 10px;
}

.chat-form .chat-messages .chat-message.error-message .chat-message-text {
    color: red;
    font-weight: bold;
    margin-left: 45px;
    margin-right: 10px;
}

.chat-form .chat-messages .chat-message .chat-message-text .chat-bubble-start {
    background-color: #ff9334;
    border-radius: 0 0 12px 0;
    display: block;
    height: 10px;
    position: absolute;
    right: -2px;
    top: 0;
    width: 10px;
}

.chat-form .chat-messages .chat-message.other-user .chat-message-text .chat-bubble-start {
    background-color: #ddd;
    border-radius: 0 0 0 12px;
    display: block;
    height: 10px;
    left: -2px;
    position: absolute;
    top: 0;
    width: 10px;
}

.chat-form .chat-messages .chat-message.from-system .chat-message-text .chat-bubble-start {
    background-color: black;
    border-radius: 0 0 0 12px;
    right: -2px;
}

.chat-form .chat-input {
    left: 0;
    position: absolute;
    right: 0;
}

.chat-form .chat-input.send-message,
.chat-form .chat-input.filter-users,
.chat-form .chat-input.accept-client-request,
.chat-form .chat-input.is-processing { bottom: 10px; }

.chat-form .k-upload-button-wrap .k-button.k-upload-button,
.chat-form .k-upload-button-wrap:hover .k-button.k-upload-button,
.chat-form .k-upload-button-wrap:hover:not(.k-disabled) .k-button.k-upload-button {
    min-width: 20px;
    background-color: transparent !important;
}

.chat-form .k-button.k-upload-button {
    border: none !important;
    box-shadow: none !important;
    padding: 0;
    width: 20px;
    height: 20px;
}

.chat-form .k-upload {
    transform: rotate(45deg);
}

.chat-form .k-upload-button span::before {
    content: "\f0c6";
    font-family: FontAwesome;
    font-size: 24px;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    color: black;
}

.chat-form .k-upload-button span { color: transparent; }

.chat-input .k-upload {
    bottom: 23px;
    position: absolute;
    right: 20px;
    width: 20px;
}

.chat-input .k-upload-status,
.chat-input .k-upload-files { display: none; }

.chat-input .invalid-file-message {
    background-color: #ffffff;
    color: red;
    float: right;
    margin: 0 17px -2px 0;
    padding: 2px 5px;
}

.chat-form .chat-input.accept-client-request { text-align: center; }

.chat-form .chat-input.is-processing {
    background-image: url('../images/ajax-loader-dialog.png');
    background-position-x: center;
    background-repeat: no-repeat;
    height: 25px;
}

.chat-form .chat-input.channel-name { top: 10px; }

.chat-form .chat-input textarea {
    border: none;
    border-top: 1px solid #CCC;
    box-sizing: border-box;
    padding-left: 10px;
    padding-right: 45px;
    resize: none;
    width: 100%;
}

.chat-form .chat-input textarea:focus {
    border-top: 1px solid #ff9334;
    outline: none;
}

i.chat-in-portal-mode {
    color: #000000;
    margin-right: 5px;
}

.end-portal-mode {
    bottom: 0;
    cursor: pointer;
    position: absolute;
    right: 19px;
}

.end-portal-mode i {
    color: #C44747;
    font-size: 24px;
}

#userpreferences #origins button.eventSelected,
.eventButtons button.eventSelected {
    background-color: #F29A3C;
    border: 1px solid #F29A3C;
}

.import-errorCount {
    color: #ff0000;
    padding: 12px 0;
    text-align: right;
}

.import-row-odbc {
    display: flex;
    align-items: baseline;
}

.import-row {
    display: flex;
    align-items: center;
    padding: 8px 0;
}

.import-type { line-height: 3em; }

.import-button { display: inline-block; }

.import-button.validate { margin-right: 8px; }

.ticket-copy-popup select { width: 25%; }

.item-step .icon-chevron-up { margin-bottom: 5px; }

/* Little arrows for sortable columns in the directive CommunicationsSection */

.communications-section .header .fa-sort-asc {
    float: left;
    padding: 7px 5px 0 0;
}

.communications-section .header .fa-sort-desc {
    float: left;
    padding: 1px 5px 0 0;
}

.communications-section .header span {
    min-height: 25px;
    padding: 5px 0 0 0;
}

.communications-section .header label {
    font-size: 90%;
    font-weight: bold;
    padding-top: 3px;
    width: auto;
}

/* CKEDITOR */

.ck-inline-memo-field {
    border: 1px solid #ccc;
    border-radius: 4px;
    max-height: 300px;
    min-height: 100px;
    overflow: auto;
    padding: 4px 6px;
}

/* override class */
.cke_focus {
    border: 1px solid rgba(255, 100, 0, 0.5);
    outline: 1px auto rgba(255, 100, 0, 0.5);
    box-shadow: none;
}

.ticketHeader .draft-image img {
    float: left;
    height: 30px;
    padding-right: 10px;
    width: 30px;
}

@-moz-document url-prefix() {
    div.service-level-section input, .service-level-section input[type="text"] {
        max-width: 145px;
    }
}

.draft-row { background: repeating-linear-gradient(45deg, rgba(0, 0, 0, 0.04), rgba(0, 0, 0, 0.14) 2px, rgba(0, 0, 0, 0.0) 2px, rgba(0, 0, 0, 0.0) 20px); }

.k-grid-content { color: black; }

.ticket-grid .k-grid-content,
.enterprise-grid .k-grid-content,
.client-grid .k-grid-content,
.resource-grid .k-grid-content,
.ci-grid .k-grid-content { min-height: 300px; }

.enterprise-grid .kendo-grid,
.client-grid .kendo-grid,
.resource-grid .kendo-grid,
.ci-grid .kendo-grid { height: inherit !important; }

.managerFormHeader p input.ci-grid-search-input {
    width: 194px;
}

.ticket-grid .k-grid-content tr.k-alt:not(:hover) > td.k-selected { background: #F5F5F5 !important; }

.ticket-grid .k-grid-content tr:not(.k-alt):not(:hover) > td.k-selected { background: white !important; }

.ticket-grid .k-grid-content tr:hover,
.ticket-grid .k-grid-content tr:hover > td.k-selected { 
    background-color: #eaeaea !important; 
}

#nav > li:hover,
.update-menu-item:hover,
.left-section .fa-search:hover,
.left-section .fa-commenting-o:hover,
.left-section .fa-bell-o:hover,
.left-section .fa-question-circle-o:hover { text-shadow: 0px 0px 6px #ddd; }


.k-treeview .k-selected {
    background: #888 !important;
    color: white;
}

.k-treeview-leaf.k-hover {
    background-color: #CCC;
    background-image: none;
}

.custom-attachements {
    display: inline-block;
    width: 100%;
}

.k-block,
.k-button,
.k-textbox,
.k-drag-clue,
.k-touch-scrollbar,
.k-window,
.k-window-titleless .k-window-content,
.k-window-action,
.k-inline-block,
.k-grid .k-filter-options,
.k-grouping-header .k-group-indicator,
.k-autocomplete,
.k-datepicker,
.k-datetimepicker,
.k-timepicker,
.k-numeric-wrap,
.k-list-container,
.k-calendar-container,
.k-calendar td,
.k-calendar .k-link,
.k-treeview .k-hover,
.k-treeview .k-selected,
.k-editor-button .k-hover,
.k-editor-button .k-active,
.k-tooltip,
.k-tile,
.k-slider-track,
.k-slider-selection,
.k-textbox > input,
.k-autocomplete .k-input,
.k-datepicker.k-input,
.k-datetimepicker.k-input,
.k-timepicker.k-input,
.k-numeric-wrap .k-input,
.k-numeric-wrap .k-link,
.k-colorpicker .k-selected-color,
.k-progress,
.k-progress-status,
.select2-container-multi ul.select2-choices,
.select2-container .select2-choice,
select,
textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"],
.uneditable-input {
    -webkit-border-radius: 0;
    border-radius: 0;
}

#ResourcesGroupsTree div.k-treeview { overflow: inherit; }

.k-datetimepicker { height: 30px; }

.task-summary .badge { padding: 6px 10px; }

.fc-state-default { background-image: none; }

#calendar {
    padding: 0;
}

.fc-unthemed .fc-today { background-color: #ffe9d6; }

.fc-toolbar {
    background-color: #FAFAFA;
    border-top: 1px solid #D3D3D3;
    margin: 48px 0 0 0;
    padding: 6px 1px 4px 0;
}

.fc-toolbar .fc-next-button { margin-left: 3px; }

/* Calendar title (current Month and Year. Ex.: August 2015) */

    .fc-toolbar h2 {
    font-size: 18px;
    font-weight: bold;
    line-height: 38px;
}

/* Days of week (Monday,
etc) */

.fc th {
    background: #f2f2f2;
    padding: 3px 0;
}

/* Each event (day) */

.fc-event {
    background-color: #ffffff;
    border: 1px solid #bebebe;
    cursor: pointer;
    font-size: 95%;
    line-height: 1.1;
}
#calendar .fc-daygrid-event-dot,
.reservation-calendar .fc-daygrid-event-dot {
    display: none;
}
#calendar .fc-event-time {
    padding: 1px 2px;
}

#calendar .fc-event-title {
    padding-left: 18px;
}

.fc-time-grid-event .fc-title { padding: 0 1px 0 18px; }

.fc button {
    background: white;
    border: 1px solid #AAA;
    border-radius: 0;
    border-radius: 2px;
    font-size: 12px;
    font-weight: normal;
    height: 30px;
    margin: 0 1px !important;
    padding: 4px 12px;
    text-transform: none;
}

.fc button:focus { outline-color: transparent; }

.fc-state-default.fc-corner-right {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
}

.fc-state-default.fc-corner-left {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
}


/* Selected day */

#calendar .fc-highlight {
    background: #EEE;
    opacity: 1;
}

.fc-daygrid-dot-event {
    padding: 0;
}

/* ----------------------- Styles per Ticket Type ----------------------------- */

.fc-event { background-color: #f0f0f0; }

.fc-event.draft .fc-event-time {
    background: url('../images/icons/draft16x16.png') right top no-repeat !important;
    padding-right: 20px;
}

.fc-event.service-request .fc-event-time { background-color: blue; }

.fc-event.service-request .fc-event-title {
    background: transparent url('../images/icons/service_request_ticket.png') left top no-repeat;
    background-size: 14px;
    color: black;
}

.fc-event.incident .fc-event-time {
    background-color: grey;
}

.fc-event.incident .fc-event-title {
    background: transparent url('../images/icons/incident_ticket.png') left top no-repeat;
    background-size: 14px;
    color: black;
}

.fc-event.project .fc-event-time {
    background-color: #f29a3c;
}

.fc-event.project .fc-event-title {
    background: transparent url('../images/icons/project_ticket.png') left top no-repeat;
    background-size: 14px;
    color: black;
}

.fc-event.problem .fc-event-time {
    background-color: red;
}

.fc-event.problem .fc-event-title {
    background: transparent url('../images/icons/problem_ticket.png') left top no-repeat;
    background-size: 14px;
    color: black;
}

.fc-event.change-request .fc-event-time {
    background-color: purple;
}

.fc-event.change-request .fc-event-title {
    background: transparent url('../images/icons/change_request_ticket.png') left top no-repeat;
    background-size: 14px;
    color: black;
}

.fc-event.task .fc-event-time {
    background-color: green;
}

.fc-event.task .fc-event-title {
    background: transparent url('../images/icons/task_ticket.png') left top no-repeat;
    background-size: 14px;
    color: black;
}

.fc-event.approval .fc-event-time {
    background-color: #799600;
}

.fc-event.approval .fc-event-title {
    background: transparent url('../images/icons/ticket_flag_locked.png') left top no-repeat;
    background-size: 15px;
    color: black;
}

/* Overide all .fc-time colors predefined. Colors were conflicting with other colors having signification.*/

#timesheet-calendar .fc-event .fc-event-time {
    background-color: grey !important;
    padding: 1px 2px;
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px;
    color: #ffffff;
}
#timesheet-calendar .fc-event.timesheet .fc-event-title {
    padding-left: 18px;
    margin-left: 3px;
    color: #000000;
    font-weight: normal;
}

/* --- Timesheet related styles --- */

#timesheet-calendar .fc-toolbar { margin: 3px 0 0 0; }

/* Display the font-awesome icon without the use of <i> */

#timesheet-calendar .fc-icon-add-button:before {
    content: "\f271";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
}
.fc-event.timesheet {
    overflow: hidden;
}
.fc-event.timesheet,
.fc-event.timesheet-duration {
    color: #f29a3c;
}

.fc-event.timesheet-duration .fc-time { display: none; }

.fc-event.timesheet-summary .fc-title { padding-left: 5px; }

.fc-event.timesheet-duration .fc-title {
    display: inline-block;
    max-height: 12px;
    overflow: hidden;
    padding-left: 5px;
    text-overflow: ellipsis;
}

.fc-event.under { background-color: red !important; }

.fc-event.over { background-color: green !important; }

/* Loading spinner while ajax call */

.calendar-loading .fc-event-title {
    -moz-opacity: 0.75;
    background-image: url('../images/ajax-loader-dialog.png') !important;
    background-position-x: 20px;
    background-repeat: no-repeat;
    cursor: wait;
    filter: alpha(opacity=75);
    left: 0;
    left: 20px;
    opacity: .75;
    top: 0;
    z-index: 100;
}

.fc-state-default { background-image: none; }

div.manager-form .custom-field-sections .k-datetimepicker input[type="text"],
div.manager-form .custom-field-sections .k-datepicker input[type="text"],
div.manager-form .custom-field-sections .k-timepicker input[type="text"] {
    height: 24px;
    min-height: 24px;
}

div.timesheet-typeahead > span.twitter-typeahead { display: inline !important; }

.center-in-div {
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    position: relative;
    text-align: center;
    top: 50%;
    transform: translateY(-50%);
}

.chart-placeholder {
    display: inline;
    float: left;
    height: 399px;
    width: 31.333%;
}

.Dashboard .drag-handle { cursor: move; }

.dashboard-counter {
    font-size: 200px;
    top: 45%;
}

.dashboard-chart.g3 .dashboard-counter { font-size: 100px; }

.dashboard-chart.g4 .dashboard-counter { font-size: 125px; }

.dashboard-chart.g6 .dashboard-counter { font-size: 150px; }

.warning-message {
    color: red;
    font-weight: bold;
    padding: 10px 0;
}

.warning-message ul { list-style-type: square; }

.warning-message li { margin: 10px 0 10px 25px; }

.btn-info:hover, .btn-info:focus, .btn-info:active, .btn-info.active, .open .dropdown-toggle.btn-info { background-color: #5e5e5e; }

.custom-geolocation-control .position {
    display: inline-block;
    width: 49%;
}

.custom-geolocation-control .position input {
    box-sizing: border-box;
    height: 30px;
}

.user-event-related-number {
    float: right;
    margin-top: 3px;
    padding-left: 10px;
}

a.userevent-link,
a.activity-link { color: #005580; }

.userevents-read-unread-selected { background-image: none; }

.warning-a-lot-of-tickets-to-print { color: red; }

.single-line-box li.itemBox {
    height: 13px;
    width: 170px;
}

.single-line-box li.itemBox .boxTemplate p {
    max-width: 170px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

select.white-options option {
    background-color: #ffffff;
    color: #555;
}

ul.dropdown-save a {
    padding: 3px 20px;
    text-align: right;
}

button.share-button.active, button.share-button.active:hover {
    background-color: #F29A3C !important;
    border: 1px solid #F29A3C !important;
}

.button.refresh-button {
    margin-right: 4px;
    padding: 7px 40px;
}

.minicolors-theme-default .minicolors-swatch {
    top: 9px;
}

.collapsible-no-padding > .collapsibleContent { padding-left: 0 !important; }

.association-template-status {
    float: right;
    font-weight: bold;
    margin-right: 22px;
    padding-top: 16px;
}

.association-template-image-class {
    float: left;
    padding-top: 11px;
}

form[name=formTicket] .clientSection input.tt-query,
form[name=formTicket] .ciSection input.tt-query,
form[name=formTicket] .resourceSection input.tt-query,
form[name=formTicket] .clientAssigneesSection input.tt-query,
form[name=formTicket] .groupSection input.tt-query { width: 95%; }

button.draft-tickets-filter.btn { margin-right: -3px !important; }

#ticket-kanban {
    min-height: 350px;
    overflow-x: auto;
    white-space: nowrap;
}

#ticket-kanban .ticket-box.isClosed { background-color: #CCC; }

#ticket-kanban .title {
    border-bottom: 1px #CCC solid;
    font-size: 12px;
    font-weight: bold;
    min-height: 25px;
    padding: 8px 25px 8px 8px;
    text-align: center;
    white-space: normal;
}

#ticket-kanban .row-field {
    border-bottom: 1px solid #aaa;
    margin: 10px;
    padding-bottom: 10px;
}

#ticket-kanban .column {
    border: 1px solid #CCC;
    display: inline-block;
    margin: 0 10px 10px 10px;
    vertical-align: top;
    width: 260px;
}

#ticket-kanban .row-field-slider i {
    color: #aaa;
    font-size: 18px;
}

#ticket-kanban .column ul { overflow: auto; }

#ticket-kanban .request-image {
    display: inline-block;
    height: 28px;
    margin: -7px;
    width: 28px;
}

#ticket-kanban .request-image svg,
#ticket-kanban .request-image img {
    height: 28px;
    position: relative;
    width: 28px;
}

#ticket-kanban .request-image svg path { fill: grey; }

#ticket-kanban .column .fa-times {
    cursor: pointer;
    float: right;
    margin: 4px;
}

#ticket-kanban .column.state-highlight { background-color: #ff9334; }

#ticket-kanban .ticket-box {
    background-color: #FAFAFA;
    border: 1px solid #AAA;
    border-radius: 2px;
    box-shadow: 2px 2px 2px #999;
    cursor: pointer;
    margin: 7px auto 7px auto;
    min-width: 220px;
    padding: 6px;
    padding-bottom: 3px;
    padding-left: 9px;
    width: 220px;
}

#ticket-kanban .ticket-box:hover { transform: scale(1.01); }

#ticket-kanban .ticket-box { padding-left: 5px; }

#ticket-kanban .ticket-box .sequencenumber {
    color: #333;
    float: right;
    font-size: medium;
    font-weight: bold;
    margin-top: 1px;
}

#ticket-kanban .ticket-box .summary {
    border-top: 1px solid #ccc;
    line-height: 1.25;
    margin-top: 23px;
    max-height: 75px;
    min-height: 30px;
    padding: 6px 0px 0px 0px;
    text-overflow: ellipsis;
    white-space: normal;
}



#ticket-kanban .ticket-box .type { float: left; }

#ticket-kanban .ticket-box .footer {
    display: inline-block;
    font-size: 11px;
    font-weight: bold;
    padding-top: 5px;
    width: 100%;
}

#ticket-kanban .ticket-box .status {
    border-left: 2px solid #ff9334;
    color: grey;
    float: left;
    font-size: 10px;
    overflow: hidden;
    padding: 0 0 0 3px;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
    width: 118px;
}

#ticket-kanban .ticket-box .creation-date { float: right; }

#ticket-kanban .ticket-box.has-unread-item .summary { font-weight: bold; }

#ticket-kanban .user-circle-picture {
    float: right;
    height: 30px;
    margin-top: -3px;
    width: 30px;
}

#ticket-kanban .user-circle-picture span {
    font-size: 14px;
    padding-top: 8px;
}

.gantt_task_line.gantt_task_inline_color { border-color: transparent; }

.gantt_link_line_up, .gantt_link_line_down, .gantt_link_line_left, .gantt_link_line_right { background-color: #f29a3c !important; }

.gantt_link_arrow_right { border-left-color: #f29a3c !important; }

.kanban-icon {
    font-size: 11px;
    left: 14px;
    position: absolute;
    top: 4px;
}

.filtersWidget .kanban-icon {
    left: 2px;
    top: 1px;
}

.system-fields-configuration .icon-pencil,
.system-fields-configuration .fa-asterisk,
.system-fields-configuration .icon-eye-open {
    position: absolute;
    top: 4px;
}

.system-fields-configuration .icon-pencil {
    right: 21px;
}
.system-fields-configuration .fa-asterisk {
    top: 6px;
}
.system-fields-configuration .icon-eye-open {
    left: 28px;
}

.popover-status-field-content th { padding: 7px 5px; }

.popover-status-field-content td.field-value {
    padding: 4px 0;
    text-align: center;
}

.popover-status-field-form .field-property { white-space: nowrap; }

.boxTemplate .system-field-name {
    clear: both;
    overflow: auto;
    padding: 0 10px 0 0;
    position: absolute;
    top: 24px;
    height: 30px;
}

.atRequestWorkflows {
    background: white;
    display: table;
    width: 100%;
}

.atRequestWorkflows .workflow-type-system {
    background-color: #e0e0e0;
    border-radius: 10px;
    border-top: 12px solid #f19a3c;
    box-shadow: 1px 1px 2px grey;
    margin: 0 auto;
    padding: 11px 0 13px 0;
    position: relative;
    text-align: center;
    width: 90px;
}

.atRequestWorkflows .workflow-box {
    background-color: #e0e0e0;
    border-top-left-radius: 10px;
    box-shadow: 1px 1px 2px grey;
    margin: auto;
    min-height: 60px;
    position: relative;
    transition: all 0.5s ease;
    width: 250px;
}

.atRequestWorkflows .workflow-box.highlighted {
    border: none;
    outline: none;
}

.atRequestWorkflows .workflow-box.highlighted .header-toolbar { background-color: #F29A3C !important; }

.atRequestWorkflows .workflow-box.highlighted .item-step { background-color: #F29A3C !important; }

.atRequestWorkflows .workflow-box .item-subdetails { display: none; }

.atRequestWorkflows .workflow-box.maximized .item-subdetails {
    display: block;
    font-size: 12px;
    margin-left: 10px;
    overflow: hidden;
    padding: 5px 0 0 0;
}

.atRequestWorkflows .workflow-box .header-toolbar {
    border-top-left-radius: 15px;
    color: white;
    height: 24px;
    line-height: 24px;
    padding-left: 35px;
    transition: all 0.5s ease;
}

.atRequestWorkflows .workflow-box .header-toolbar a {
    color: white;
    cursor: pointer;
    position: relative;
    top: -3px;
}

.atRequestWorkflows .workflow-box.request .header-toolbar { background-color: #89A600; }

.atRequestWorkflows .workflow-box.task .header-toolbar { background-color: #0288d1; }

.atRequestWorkflows .workflow-box.action .header-toolbar { background-color: #be4d4d; }

.atRequestWorkflows .workflow-box.is-not-ready .header-toolbar { background-color: #8e8e8e; }

.atRequestWorkflows .workflow-box.is-done {
    background-color: #808080;
    color: white;
}

.atRequestWorkflows .workflow-box.is-done .header-toolbar { background-color: #353535; }

.atRequestWorkflows .workflow-box.blocked .header-toolbar { background-color: darkred; }

.atRequestWorkflows .workflow-box.new-item {
    background-color: white;
    border: 1px dotted #5e5e5e;
    padding: 5px 0;
}

.atRequestWorkflows .workflow-box.new-item .item-header {
    background-color: initial;
    color: #000;
    font-weight: normal;
    margin: 0 5px;
    padding: 0 5px;
    padding-top: 10px;
}

.atRequestWorkflows .workflow-box.new-item .item-details,
.atRequestWorkflows .workflow-box.new-item .item-subdetails { margin: 0 5px; }

.atRequestWorkflows .workflow-box.new-item .item-remove {
    color: #000;
    position: absolute;
    right: 4px;
    top: 4px;
}

.atRequestWorkflows .workflow-box.new-item .item-content { margin-left: 0; }

.atRequestWorkflows .itemTemplate {
    background: none;
    border: none;
    display: block;
    margin: 0;
    padding: 0;
    width: auto;
}

.atRequestWorkflows .item-box {
    background-color: #fff;
    border: 1px solid #d3d3d3;
    border-radius: 4px;
    margin-left: 30px;
    min-height: 50px;
}

.atRequestWorkflows .item-header {
    background-color: #F29A3C;
    color: #fff;
    padding: 5px;
}

.atRequestWorkflows .item-header .ticket-type {
    float: left;
    left: -3px;
    position: relative;
    top: -3px;
}

.atRequestWorkflows .item-header .ticket-type.ApprovalTemplate-image { background-image: url(../images/icons/ticket_flag_locked_dark.png); }

.atRequestWorkflows .item-content {
    margin-left: 30px;
    padding: 5px;
}

.atRequestWorkflows .item-details,
.atRequestWorkflows .item-subdetails {
    line-height: 15px;
    padding: 5px;
    padding-left: 3px;
}

.atRequestWorkflows .item-details .fa,
.atRequestWorkflows .item-subdetails .fa {
    color: black;
    font-size: 13px;
    width: 15px;
}

.atRequestWorkflows .item-step [class^="icon-"] {
    background-image: url("../bootstrap/img/glyphicons-halflings-white.png");
    margin-left: 7px;
}

.atRequestWorkflows .item-step {
    background-color: #353535;
    border-top-left-radius: 10px;
    bottom: 0;
    color: #fff;
    font-weight: bold;
    position: absolute;
    top: 0;
    transition: all 0.5s ease;
    width: 26px;
}

.atRequestWorkflows .item-step.is-not-ready { background-color: #8e8e8e; }

.atRequestWorkflows .item-step .number { padding: 6px 6px 3px 6px; }

.atRequestWorkflows .item-step .icon-chevron-up {
    margin-bottom: 0;
    margin-top: 4px;
}

.atRequestWorkflows .item-condition .item-step {
    background-color: transparent;
    bottom: -25px;
    left: -25px;
    top: -4px;
}

.atRequestWorkflows .item-condition .has-result .fa-info-circle { top: 10px !important; }

.atRequestWorkflows .item-condition .has-result .item-step { top: 5px; }

.atRequestWorkflows .item-condition .item-step .icon-chevron-up {
    left: 46px;
    position: relative;
    top: -48px;
}

.atRequestWorkflows .item-condition .item-step .icon-chevron-down {
    left: 46px;
    position: relative;
    top: -8px;
}

.atRequestWorkflows .item-condition a.item-label {
    color: white;
    cursor: pointer;
    line-height: 17px;
}

.atRequestWorkflows .item-horizontal-line {
    background-color: #F29A3C;
    display: block;
    height: 2px;
    margin: auto;
    width: 100%;
}

.atRequestWorkflows .item-vertical-line {
    background-color: #F29A3C;
    display: block;
    height: 10px;
    margin: auto;
    position: relative;
    width: 2px;
}

.atRequestWorkflows tr.has-result td .item-horizontal-line { background-color: #fbd6b4; }

.atRequestWorkflows .item-add {
    height: 22px;
    margin: 0 auto;
    width: 26px;
}

.atRequestWorkflows .item-add .fa-plus {
    background-color: white;
    border: 1px solid #5e5e5e;
    border-radius: 4px;
    box-shadow: 1px 1px 2px grey;
    padding: 3px 7px;
    position: relative;
}

.atRequestWorkflows .item-remove,
.atRequestWorkflows .item-edit,
.atRequestWorkflows .item-add-note,
.atRequestWorkflows .item-maximize,
.atRequestWorkflows .item-minimize {
    cursor: pointer;
    float: right;
    margin: 0 4px;
}

.atRequestWorkflows .atRequestWorkflowsAddButton { margin: auto; }

.atRequestWorkflows .atRequestWorkflowsAddButton .select2-container,
.atRequestWorkflows .atRequestWorkflowsAddButton .select2-search-field input { width: 100% !important; }

.atRequestWorkflows .workflow-type-add-new-task {
    margin: auto;
    width: 200px;
}

.atRequestWorkflows .select-request {
    color: #000;
    margin-right: 4px;
    text-align: left;
}

.atRequestWorkflows .select-request .typeahead-reading-status { padding-top: 0px; }

.atRequestWorkflows .update-status .atWorkflowsBullet.atWorkflowsBulletSmall {
    background-size: 15px 15px;
    height: 15px;
    width: 15px;
}

.atRequestWorkflows .update-status .atWorkflowsDot.atWorkflowsDotSmall {
    height: 15px;
}

.ticketRightSection .atRequestWorkflows .update-status .atWorkflowsDot.atWorkflowsDotSmall {
    height: 35px;
}

.atRequestWorkflows .item-details.update-status {
    border-top: 1px solid #353535;
    margin-left: -8px;
    margin-right: -5px;
    margin-top: 5px;
    padding: 15px 0 12px 0;
}

.atRequestWorkflows .item-details.update-status table td {
    min-width: inherit;
    width: auto;
}

.atRequestWorkflows .update-status table {
    border-top: none;
    margin: auto;
}

.atRequestWorkflows .update-status table {
    border-top: none;
    margin: auto;
}

.atRequestWorkflows .item-icon {
    float: left;
    min-width: 19px;
    padding-right: 6px;
    padding-top: 2px;
}

.atRequestWorkflows .item-icon .fa {
    color: black;
    line-height: inherit;
    overflow: hidden;
    padding-left: 3px;
    padding-right: 1px;
    position: relative;
    top: -2px;
}

.atRequestWorkflows .item-icon .fa.task { }

.atRequestWorkflows .item-icon .fa.task.new:before,
.atRequestWorkflows .item-icon .fa.task.in-progress:before,
.atRequestWorkflows .item-icon .fa.task.closed:before { content: "\f0c9"; }

.atRequestWorkflows .item-icon .fa.task.new {
    margin-top: 8px;
    max-height: 6px;
}

.atRequestWorkflows .item-icon .fa.task.in-progress {
    margin-top: 4px;
    max-height: 12px;
}

.atRequestWorkflows .item-icon .fa.approval.pending:before { content: "\f017"; }

.atRequestWorkflows .item-icon .fa.approval.approved:before { content: "\f00c"; }

.atRequestWorkflows .item-icon .fa.approval.refused:before { content: "\f057"; }

.atRequestWorkflows .item-icon .fa.approval.refused.is-blocking:before { content: "\f05c"; }

.atRequestWorkflows .item-icon .fa.approval.refused.is-blocking,
.atRequestWorkflows .item-icon .fa.approval.approved { color: white; }


.atRequestWorkflows.disabled .workflow-type-system,
.atRequestWorkflows.disabled .item-condition:before { border-color: #8e8e8e !important; }

.atRequestWorkflows.disabled .item-condition:before,
.atRequestWorkflows.disabled .item-vertical-line,
.atRequestWorkflows.disabled .item-horizontal-line,
.atRequestWorkflows.disabled .sub-workflows > table td:before { background-color: #8e8e8e !important; }

.atRequestWorkflows .item-condition {
    background: none;
    background-color: transparent !important;
    border: none;
    box-shadow: none;
    height: 70px;
    margin-bottom: 20px;
    text-align: center;
    width: 70px;
}

.atRequestWorkflows .item-condition:before {
    background-color: #f19a3c;
    border: 10px solid #f19a3c;
    border-radius: 10px;
    box-shadow: 1px 1px 2px grey;
    content: '';
    height: 100%;
    left: -10px;
    position: absolute;
    top: 0;
    transform: rotateX(45deg) rotateZ(45deg);
    width: 100%;
}

.atRequestWorkflows td.workflow-discarded .item-condition:before {
    background: repeating-linear-gradient(-55deg, #DDD, #DDD 5px, #BBB 5px, #BBB 10px);
    border: none;
    height: 125%;
    width: 125%;
}

.atRequestWorkflows .item-condition .item-condition-content {
    color: white;
    position: relative;
    top: 37px;
}

.atRequestWorkflows .item-condition .item-condition-content.has-result { top: 28px; }

.atRequestWorkflows .item-condition .item-condition-content.has-result .value {
    letter-spacing: 1px;
    margin: 3px 0;
}

.atRequestWorkflows .sub-workflows {
    display: table;
    width: 100%;
}

.atRequestWorkflows .sub-workflows > table {
    border: none;
    width: 100%;
}

.atRequestWorkflows .sub-workflows > table td.td-subworkflows {
    background: white;
    min-width: 260px;
    position: relative;
    vertical-align: top;
    width: 50%;
}

.actions-popup .field-value .typeahead-reading-status,
.conditions-popup .field-value .typeahead-reading-status { padding-top: 0; }

.actions-popup div.popup-form label,
.conditions-popup div.popup-form label {
    font-weight: inherit;
    text-transform: inherit;
}

.actions-popup div.popup-form div.save-as-group {
    padding-left: -2px;
    padding-right: 2px;
    padding-top: 15px;
}

.atRequestWorkflows .workflow-discarded .item-vertical-line,
.atRequestWorkflows .workflow-discarded .item-horizontal-line,
.atRequestWorkflows tr.workflow-discarded-false > td.workflow-discarded > div.item-horizontal-line,
.atRequestWorkflows tr.workflow-discarded-true > td.workflow-discarded > div.item-horizontal-line { background-color: #fbd6b4; }

.atRequestWorkflows .workflow-discarded .workflow-box,
.atRequestWorkflows .workflow-discarded .workflow-type-system,
.atRequestWorkflows .workflow-discarded .item-horizontal-line span { pointer-events: none; }

.atRequestWorkflows .workflow-discarded .item-horizontal-line span { opacity: 0.5; }

.atRequestWorkflows .workflow-discarded .workflow-box.is-not-ready { background: repeating-linear-gradient(-55deg, #DDD, #DDD 5px, #BBB 5px, #BBB 10px); }

.atRequestWorkflows .workflow-discarded .workflow-box.is-not-ready .header-toolbar { background-color: #BBB; }

.atRequestWorkflows .workflow-discarded .workflow-box.is-not-ready .item-step { background-color: #BBB; }

.atRequestWorkflows .workflow-discarded .workflow-box.is-not-ready .item-content { opacity: 0.5; }

.atRequestWorkflows .workflow-discarded .item-add { display: none; }

.RequestsManagerCtrl .request-workflow-container,
.TaskTemplatesManagerCtrl .request-workflow-container {
    max-height: 500px;
    max-width: 1280px;
    overflow: auto;
    padding-bottom: 80px;
}

.ticketFull .request-workflow-container {
    overflow-x: auto;
    padding-bottom: 80px;
}

.request-workflow-container.maximized {
    height: auto;
    max-height: initial;
    overflow: visible;
    width: auto;
}

.request-workflow-container > div > .atRequestWorkflows { margin-top: 35px !important; }

.request-workflow-container.zoom-1 > .atRequestWorkflows, .request-workflow-container.zoom-1 > div > .atRequestWorkflows {
    transform: scale(0.85);
    transform-origin: 0 0;
}

.request-workflow-container.zoom-2 > .atRequestWorkflows, .request-workflow-container.zoom-2 > div > .atRequestWorkflows {
    transform: scale(0.7);
    transform-origin: 0 0;
}

.request-workflow-container.zoom-3 > .atRequestWorkflows, .request-workflow-container.zoom-3 > div > .atRequestWorkflows {
    transform: scale(0.55);
    transform-origin: 0 0;
}

.request-workflow-container.zoom-4 > .atRequestWorkflows, .request-workflow-container.zoom-4 > div > .atRequestWorkflows {
    transform: scale(0.40);
    transform-origin: 0 0;
}

.request-workflow-container.zoom-5 > .atRequestWorkflows, .request-workflow-container.zoom-5 > div > .atRequestWorkflows {
    transform: scale(0.25);
    transform-origin: 0 0;
}

.ticketFull .request-workflow-container.maximized { max-width: 500px; }

/* (start) ---------------- Elements pinned on top of page (enabled in UserPreferences) ----------------------------- */

/* Apply only when min-width is 1035px because fixed elements does not scroll when scrolling horizontally on smaller width */

.pinned .layout_header,
.pinned .ticketGridEventContext,
.pinned #MainTabs .ui-tabs-nav {
    min-width: 1035px;
    position: fixed;
}


.pinned #MainTabs {
    margin-top: 109px;
    min-width: 1035px;
}

.pinned #MainTabs .ui-tabs-nav {
    border-bottom: 1px solid #CCC;
    left: 12px;
    right: 12px;
    top: 77px;
    z-index: 1001;
}

.pinned.training-videos #MainTabs .ui-tabs-nav { top: 440px; }


.pinned .ticketHeader.affix,
.pinned .ci-header.affix,
.pinned .client-header.affix,
.pinned .enterprise-header.affix {
    border-bottom: 1px solid lightgray;
    border-style: solid;
    border-top: 5px solid lightgray;
    margin-left: 8px;
    margin-right: 8px;
    margin-top: -5px;
    min-width: 1025px;
}

.pinned .ci-header.affix, .pinned .client-header.affix, .pinned .enterprise-header.affix { width: auto; }

.pinned #alert-area {
    background: white;
    left: 12px;
    padding-bottom: 15px;
    position: fixed;
    right: 12px;
    text-align: center;
    top: 62px;
    z-index: 1001;
}

.pinned.training-videos #alert-area { top: 437px; }

.pinned section#content { margin-top: 0; }

/* (end) ------------------ Elements pinned on top of page (enabled in UserPreferences) ----------------------------- */

/* (start) INTRO ---------------------------------------------------------------------------------------------- */

form[name=introForm] .section-title {
    color: #454545;
    font-size: 120%;
    font-weight: bold;
}

form[name=introForm] .modal-body { padding-top: 7px; }

form[name=introForm] li { margin-bottom: 30px; }

.intro-selection {
    background: url(../images/intro-quick-ticket.png) left top no-repeat;
    background-position-y: -8px;
    background-size: 40px 40px;
    color: #F29A3C;
    cursor: pointer;
    font-size: 200%;
    font-weight: bold;
    margin-bottom: 6px;
    padding-left: 50px;
}

.intro-description {
    color: #5e5e5e;
    font-style: italic;
}

.intro-tooltip-data {
    color: #00c9ff;
    display: inline-block;
    font-weight: bold;
    margin-top: -3px;
}

.resource-state-item {
    cursor: pointer;
    padding: 5px 0;
}

.resource-state-item i {
    float: left;
    margin-right: 10px;
}

.resource-state-item div { overflow: hidden; }

.resource-state-unauthorized {
    color: #C44747;
    font-style: italic;
    padding: 20px 0;
}

.resource-box-template i.resource-state {
    background-color: #ffffff;
    bottom: -2px;
    padding: 1px 0 0 2px;
    position: absolute;
    right: -1px;
}

li.itemBox:hover .resource-box-template.with-state .editLink {
    right: 10px;
}

.resource-box-template .editLink i {
    bottom: 5px;
    position: absolute;
}

.resource-box-template.with-state .editLink i {
    right: 10px;
}

.resource-box-template:not(.with-state) .editLink i {
    right: -1px;
}

.resource-box-template div.with-picture {
    float: left;
    padding: 6px 0 0 10px;
}

#ResourcesGroupsTree .k-treeview-item .k-treeview-item { padding-left: 0; }

.reason-for-rejection textarea { width: 99%; }

form[name=portalTicket] .ticketWorkflows { margin-top: 0; }

form[name=portalTicket] .canvasBackground { background: none; }

.portal-status-task { margin-top: 0 !important; }

/* NotReadOnlyGroups for System fields & Custom fields POPUP  */

.popover-cell-form .is-read-only-option { line-height: 20px; }

.popover-cell-form .is-read-only-option input[type=checkbox] { margin-top: 6px; }

.popover-cell-form .not-readonly-groups { margin-left: 22px; }

.popover-cell-form .not-readonly-groups .not-readonly-groups-label {
    margin-bottom: 6px;
    margin-top: 6px;
}

.popover-cell-form .not-readonly-groups .single-line-box li.itemBox {
    margin: 2px 5px 2px 0;
    padding: 5px 20px 5px 10px;
    width: 155px;
}

.popover-cell-form .not-readonly-groups .single-line-box li.itemBox .boxTemplate { height: auto; }

.popover-cell-form .not-readonly-groups .single-line-box li { height: 18px !important; }

.popover-cell-form .is-read-only-option { padding-left: 22px; }

.ck-inline-memo-field p {
    overflow-wrap: break-word;
    word-break: break-word;
    word-wrap: break-word;
}

.folders-treeview li.k-hover {
    background-color: white;
    background-image: none;
    color: black;
}

.folders-treeview div.focus {
    border-color: white;
    box-shadow: none;
}

.communications-clear-search {
    background-color: transparent;
    border: none;
    color: #ccc;
    float: right;
    font-size: 12px;
    position: relative;
    right: 12px;
    top: -27px;
}

.grid-template-editor .k-grid-header-wrap { height: 76px; }

.grid-template-editor .k-grid-content { height: 0 !important; }

.k-grid .k-grid-header { position: relative;}

.k-grid .k-grid-header .k-cell-inner > .k-link > .k-sort-icon {
    position: absolute;
    left: -8px;
}

.k-grid .k-grid-header .k-cell-inner > .k-link { padding-inline: var(--kendo-spacing-3, .5em); }

form[name=searchFormCondition] .button-bar .btn-group + .btn-group { margin-left: 0 !important; }

/* --------------------------- RESERVATION POPUP ---------------------------- */

form[name=reservationForm] #error-message {
    border: 1px solid red;
    border-radius: 4px;
    color: red;
    font-weight: bold;
    margin-bottom: 5px;
    padding: 7px 20px;
}

/* Reservation Filters */

form[name=reservationForm] .filters {
    padding: 10px 0 0 10px;
    min-width: 290px;
    max-width: 290px;
    float: left;
}

form[name=reservationForm] .filters div.filter {
    width: 70%;
    margin-bottom: 5px;
}

form[name=reservationForm] .filters .cis-search-for input.tt-query { width: 273px; }

/* Reservation Calendar */

form[name=reservationForm] .reservation-calendar .fc-toolbar {
    margin-top: 0;
    margin-bottom: 0;
}

form[name=reservationForm] .reservation-calendar .fc-toolbar h2 {
    font-size: 150%;
}

form[name=reservationForm] .reservation-calendar .fc-event.reserved {
    background-color: #ff0000;
    color: #ffffff;
}

form[name=reservationForm] .reservation-calendar .fc-event.new-reservation {
    background-color: #799600;
    color: #ffffff;
}

form[name=reservationForm] .reservation-calendar .fc-event-time { display: none; }

form[name=reservationForm] .reservation-calendar .fc-event-title {
    padding-left: 0;
    vertical-align: top;
}

form[name=reservationForm] .reservation-calendar .fc-content { height: 14px; }

form[name=reservationForm] .reservation-calendar .fc-content .ticket-number {
    background-color: #ffffff;
    color: #000000;
    font-size: 86%;
    padding: 0 4px;
}

/* --------------------------- CUSTOM FIELD MANAGER: BUTTON ---------------------------- */

.custom-button-configuration .title label {
    font-weight: bold;
    margin: 15px 0 5px 0;
    text-transform: uppercase;
}

/* Force gray colors when button is disabled */

.custom-button-control button.disabled {
    background-color: #c1c1c1 !important;
    color: #555 !important;
}

.ticketPreviewWidget .resolution ul {
    list-style: inherit;
    padding-left: 18px;
}

.ticketPreviewWidget .resolution ul li { list-style: inherit; }

.ticketPreviewWidget .resolution ol {
    list-style: decimal;
    padding-left: 18px;
}

.ticketPreviewWidget .resolution ol li { list-style: decimal; }

.client-communications .communications-data {
    background-color: #ffffff;
    border: 1px solid #ccc;
    margin-top: 7px;
    padding: 5px;
}

.modal-body .manager-form { padding: 0; }

.modal-body .manager-form h4 {
    font-size: 18px;
    font-weight: normal;
}

.modal-body .manager-form h4.collapsibleSectionHeader {
    font-size: 14px;
    font-weight: bold;
}

.modal-body .manager-form .collapsibleContent { padding: 0; }



/* Generic Calendar */

#calendar-directive .fc-toolbar { margin-top: 0; }

    #calendar-directive .fc-toolbar h2 {
        font-size: 150%;
        padding-top: 5px;
    }

#calendar-directive .fc-event.new-reservation {
    background-color: #799600;
    color: #ffffff;
}

#calendar-directive .fc-event-time {
    display: none;
}

#calendar-directive .fc-title {
    padding-left: 0;
    vertical-align: top;
}

#calendar-directive .fc-content {
    height: 14px;
}

#calendar-directive .ticket-number {
    background-color: #ffffff;
    color: #000000;
    font-size: 86%;
    padding: 2px 4px;
    float: left;
}

#calendar-directive .fc-event.reserved {
    background-color: #ff0000;
    color: #ffffff;
}

.bootbox.modal .button-col1 { padding: 4px 12px; }

.default-cursor { cursor: default !important; }

.communication-entity { font-weight: bold; }

.communication-entity:hover {
    color: #005580;
    text-decoration: underline;
}

.ticket-directive { word-wrap: break-word; }

.ticket-directive p { margin: 5px 0; }

.ticket-directive ol,
.ticket-directive ul {
    list-style: initial;
    margin: 0 0 10px 25px;
}

.grid-template-selector i {
    border: 1px solid #ffffff;
    border-radius: 2px;
    font-size: 85%;
    margin-right: 5px;
}

.grid-template-item-selector-private { color: #888; }

.grid-template-item-selector-public { color: #F29A3C; }

.private-filter { color: #888; }

.public-filter { color: #F29A3C; }

.portalButtonBar button.print { padding: 8px 12px; }

.url-readonly {
    max-width: 600px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.diagnostic {
    margin-left: auto;
    margin-right: auto;
    margin-top: 50px;
    max-width: 1200px;
    padding: 0 20px;
}

.diagnostic .header {
    font-size: 16pt;
    margin: 10px 0;
    text-align: center;
}

.center-cell {
    display: inline-block;
    text-align: center;
    width: 100%;
}

.right-cell {
    display: inline-block;
    text-align: right;
    width: 100%;
}

#my-activities-grid .k-selected { background-image: none; }

#my-activities-grid .k-grid-content .k-selected { background-color: transparent !important; }

#my-activities-grid i.pointer:hover { color: #005580; }

.my-activities-manager span.my-activity-row {
    border-top: 1px solid lightgray;
    margin-left: 10px;
    overflow: hidden;
    padding: 12px 0;
}

.export-c2client-header {
    font-size: 16px;
    font-weight: bold;
    margin: 15px 0;
    text-align: center !important;
}

/* Loading spinner while ajax call */

.loading-spinner {
    background-image: url('../images/ajax-loader-dialog.png');
    background-repeat: no-repeat;
    height: 25px;
    width: 25px;
}

.dialog-clean {
    background-image: url('../images/dialog-clean.png');
    background-repeat: no-repeat;
    height: 25px;
    width: 25px;
}

form[name=formTicket] div[name=clients-multiple-selector] li.itemBox { height: 65px; }

form[name=formTicket] div[name=clients-multiple-selector] .boxTemplate { height: 88px; }

form[name=formTicket] .ticketCountLink {
    cursor: pointer;
    font-size: 85%;
    font-style: italic;
    margin-top: 2px;
}

form[name=formTicket] .ticketCountLink:hover { color: #005580; }

div.mce-fullscreen { z-index: 10000; }

.angular-form.management-menu > section,
.angular-form.my-options-menu > section,
.angular-form.cmdb-menu > section { padding: 1em 1.4em; }

.angular-form.management-menu h4,
.angular-form.my-options-menu h4,
.angular-form.cmdb-menu h4 {
    margin-bottom: 10px;
    padding-bottom: 6px;
}

.angular-form.management-menu li,
.angular-form.my-options-menu li,
.angular-form.cmdb-menu li { margin: 5px; }

.angular-form.management-menu li.separator,
.angular-form.my-options-menu li.separator,
.angular-form.cmdb-menu li.separator { margin: 20px; }

#layout_menu #nav a { text-transform: none; }

#layout_menu #nav li { padding-top: 6px; }

#layout_menu #nav li i.fa {
    color: white;
    margin-bottom: 7px;
}

#layout_menu #nav li a {
    display: inline-block;
    text-align: center
}

#layout_menu #nav li a span { display: block; }

#layout_menu.hide-title li { padding-top: 15px !important; }

#layout_menu.hide-title li span.title-menu { display: none !important; }

#layout_menu.hide-menu li { display: none !important; }

.user-circle-widget {
    float: left;
    margin: -4px 0px;
}

.header-outer-user-circle-picture {
    border-style: outset;
    border-width: 3px;
    height: 40px !important;
    width: 40px !important;
}

.header-inner-user-circle-picture {
    border-radius: 50px;
    height: 38px;
    left: 1px;
    overflow: hidden;
    position: relative;
    top: 1px;
    width: 38px;
}

.user-circle-picture {
    border-radius: 50%;
    height: 38px;
    overflow: hidden;
    position: relative;
    width: 38px;
}

.user-circle-picture span,
.chat-user-circle-picture span {
    color: #000000;
    font-family: 'Lato', "Trebuchet MS", Arial, Helvetica, sans-serif !important;
    font-size: 16px;
    padding-top: 10px;
    position: absolute;
    text-align: center;
    text-transform: uppercase;
    width: 100%;
}

.chat-user-circle-picture span { padding-top: 12px; }

.chat-user-circle-picture {
    border-radius: 50%;
    float: left;
    height: 38px;
    margin-top: -5px;
    overflow: hidden;
    position: relative;
    width: 38px;
}

.chat-user-circle-picture img,
.user-circle-picture img {
    display: inline;
    height: 100%;
    margin: 0 auto;
    width: auto;
}

.user-circle-picture i {
    color: #555555;
    font-size: 24px;
    padding: 6px 0 0 11px;
}

.treegroups-user-circle-picture {
    display: inline-block;
    height: 20px;
    width: 20px;
    z-index: 1;
}

/* These are a workaround to Angular's `$sce.getTrustedHtml` that strips style tags */
.treegroups-user-circle-picture.user-color-\#FF9334 {
    background-color: #FF9334 !important;
}

.treegroups-user-circle-picture.user-color-\#89A600 {
    background-color: #89A600 !important;
}

.treegroups-user-circle-picture.user-color-\#EEFC57 {
    background-color: #EEFC57 !important;
}

.treegroups-user-circle-picture.user-color-\#C3C3C3 {
    background-color: #C3C3C3 !important;
}

.treegroups-user-circle-picture.user-color-\#C2576A {
    background-color: #C2576A !important;
}

.treegroups-user-circle-picture.user-color-\#7C7D96 {
    background-color: #7C7D96 !important;
}

.treegroups-user-circle-picture.user-color-\#6FA9A6 {
    background-color: #6FA9A6 !important;
}


.treegroups-user-circle-picture span {
    font-size: 12px;
    padding-top: 2px;
}

.treegroups-user-status {
    font-size: 10px;
    margin: -16px 0px 0px 16px;
    position: absolute;
}

.treegroups-user-name {
    padding: 0 8px 0 4px;
}

.user-offline { color: #ddd; }

.user-online { color: #92B001; }

.resource-box-template .user-circle-picture,
form[name=resourcesManagerForm] .user-circle-picture,
form[name=clientsManagerForm] .user-circle-picture { float: left; }

.resource-box-template .user-circle-picture,
#ResourcesGroupsTree .user-circle-picture,
form[name=resourcesManagerForm] .user-circle-picture,
form[name=clientsManagerForm] .user-circle-picture,
form[name=picturePopupForm] .user-circle-picture,
#chatWidget .chat-user-circle-picture,
#messages .user-circle-picture {
    background-color: white;
    box-shadow: 1px 2px 2px grey;
}

#messages .user-circle-picture { position: absolute; }

form[name=picturePopupForm] .openLink,
form[name=picturePopupForm] .image_file { display: none; }

form[name=picturePopupForm] .cropper-view-box,
form[name=picturePopupForm] .cropper-face { border-radius: 50%; }

.user-circle-widget .header-user-circle {
    border: 1px solid #555;
    border-radius: 25px;
    float: left;
    margin-top: 4px;
    padding: 11px 5px;
    text-align: center;
    width: 28px;
}

.user-circle-widget .header-user-circle .initials {
    color: #363636;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.user-circle-widget .popover-title,
.user-circle-widget .popover-content {
    padding: 0;
    width: 250px;
}

/*.user-circle-widget .arrow {
        left: 77% !important;
    }*/

.user-circle-widget ul {
    padding-bottom: 5px;
    padding-top: 10px;
}

.user-circle-widget li {
    color: #333;
    padding: 6px 20px;
}

.user-circle-widget li.link:hover {
    background-color: #f89115;
    color: white;
    cursor: pointer;
}

.user-circle-widget li.separator {
    border-bottom: 1px solid #CCC;
    margin: 5px 0;
    padding: 0;
}

.user-circle-widget li i.fa { margin-right: 15px; }

.user-circle-widget li i.fa-toggle-on,
.user-circle-widget li i.fa-toggle-off { margin-right: 6px; }

.user-circle-widget li i.fa-clock-o,
.user-circle-widget li i.fa-sliders {
    margin-right: 16px;
}

.user-circle-widget li i.fa-table{
    margin-right: 14px;
}

.user-circle-widget li i.fa-square {
    margin-right: 19px;
}

.user-circle-widget li i.fa-bell {
    margin-right: 13px;
}

.user-circle-widget li i.fa-globe {
    margin-right: 12px;
}

.user-circle-widget li.fullname {
    color: black;
    font-size: 16px;
    font-weight: bold;
    padding: 5px 20px;
}

.user-circle-widget li.username {
    font-style: italic;
    padding: 5px 20px;
}

.user-circle-resource-state {
    display: flex;
}

button[name='button-chat-tickets'] { border-top: 3px solid #88a600 !important; }

button[name='button-chat-resources'] { border-top: 3px solid #333 !important; }

button[name='button-chat-channels'] { border-top: 3px solid #f89115 !important; }

.chat-ticket-portal-mode {
    color: #88a600 !important;
    float: left;
    font-size: 15px;
    margin: 3px 0 0 1px;
}

.user-events-badge .fa,
.messages-badge .fa {
    color: white;
    cursor: pointer;
    padding: 5px;
}

.user-events-badge .badge-count,
.messages-badge .badge-count {
    background-color: #c54646;
    border-radius: 15px;
    color: white;
    cursor: pointer;
    display: block;
    margin-left: 13px;
    margin-top: -30px;
    padding: 3px 6px 2px 4px;
    position: absolute;
    text-align: center;
}

html.portalMode .user-events-widget {
    float: right !important;
    margin-right: 20px;
    margin-top: 8px;
}

.user-events-widget {
    float: left;
    margin-right: 20px;
    margin-top: 8px;
}

.user-events-widget:focus { border: none; }

.user-events-widget .popover-title,
.user-events-widget .popover-content { padding: 0; }

.user-events-widget ul {
    padding-bottom: 5px;
    padding-top: 10px;
}

.user-events-widget li {
    color: #333;
    padding: 8px 20px;
}

.user-events-widget li.link:hover {
    background-color: #f8911511;
    cursor: pointer;
}

.user-events-widget li.separator {
    border-bottom: 1px solid #CCC;
    margin: 5px 0;
    padding: 0;
}

.user-events-widget li i.fa { margin-right: 10px; }

.user-events-widget li.title {
    color: black;
    font-size: 16px;
    font-weight: bold;
    padding: 5px 20px 10px 20px;
}

.messages-widget {
    color: white;
    float: left;
    margin-left: 20px;
    margin-right: 20px;
    margin-top: 7px;
    position: relative;
}

.messages-widget .popover { max-width: 440px; }

.messages-widget .popover-title,
.messages-widget .popover-content {
    padding: 0;
    width: 440px;
}

.messages-widget .header {
    background-color: #EEE;
    border-bottom: 1px solid #AAA;
    padding: 15px;
}

.messages-widget .body {
    overflow: auto;
    padding: 5px;
}

.messages-widget ul { padding-bottom: 5px; }

div.tab-content.tickets li {
    border-bottom: 1px solid lightgray;
    height: 31px;
    padding-bottom: 15px;
    padding-left: 0px;
}

.messages-widget li {
    border-bottom: 1px solid #ddd;
    color: #333;
    padding: 10px 5px 4px 5px;
    width: auto;
}

.messages-widget li.link:hover {
    background-color: #f8911511;
    cursor: pointer;
}

.messages-widget li.separator {
    border-bottom: 1px solid #CCC;
    margin: 5px 0;
    padding: 0;
    width: auto;
}

.search-widget {
    color: white;
    float: left;
    margin-top: 4px;
    position: relative;
}

.search-widget .fa {
    cursor: pointer;
    padding: 5px;
}

.search-widget .search-input {
    -webkit-transition: width 0.15s; /* Safari */
    background: none;
    border: none;
    border-bottom: 1px solid #AAA;
    color: white;
    font-size: 16px;
    padding: 4px 0;
    transition: width 0.15s;
    width: 0;
}

.search-widget .search-input:focus {
    border: none;
    border-bottom: 1px solid #FFF;
    outline: none;
}

.search-widget .search-input.visible {
    padding: 4px 20px 4px 4px;
    width: 150px;
}

.search-widget .search-clear {
    position: absolute;
    right: 0;
    top: 3px;
}

.headerUpperRight {
    color: white;
    float: right;
    margin-right: 10px;
}

.headerUpperRight input,
.headerUpperRight .btn { box-shadow: none !important; }

.headerUpperRight > div.separator {
    border-left: 1px solid #CCC;
    float: left;
    height: 62px;
    margin: 0 25px;
    position: relative;
}

.headerUpperRight .left-section {
    float: left;
    margin-top: 12px;
}

.headerUpperRight .right-section { float: left; }

.headerUpperRight .right-section .create-button-widget {
    float: right;
    margin-top: 16px;
}

.headerUpperRight .right-section .create-button-widget .btn-group { float: right; }

.headerUpperRight .right-section .create-button-widget button {
    background: none;
    border: 1px solid #89A600 !important;
    color: white !important;
}

.headerUpperRight .right-section .create-button-widget button:hover { background: #444; }

.headerUpperRight .right-section .create-button-widget .btn-group > .btn + .dropdown-toggle {
    line-height: 20px;
    margin-left: 1px;
    padding: 4px 6px;
}

.headerUpperRight.animation-disabled .right-section .ticket-toolbar {
    -webkit-transition: width 0s !important; /* Safari */
    transition: width 0s !important;
}

.headerUpperRight.animation-disabled .search-widget .search-input {
    -webkit-transition: width 0s !important; /* Safari */
    transition: width 0s !important;
}

.headerUpperRight .right-section .ticket-toolbar {
    -webkit-transition: width 0.15s; /* Safari */
    float: left;
    position: relative;
    transition: width 0.15s;
    width: 0;
}

.headerUpperRight .right-section .ticket-toolbar.active { width: 585px; }

.headerUpperRight .right-section .ticket-toolbar .tt-hint { display: none; }

.headerUpperRight .right-section .ticket-toolbar .tt-query {
    background: none !important;
    border: none;
    border-bottom: 1px solid #FFF;
    color: white;
    font-size: 16px;
    padding-right: 20px;
    text-indent: 0 !important;
    width: 180px;
}

.headerUpperRight .right-section .ticket-toolbar .tt-query::placeholder { font-size: 14px; }

.headerUpperRight .right-section .ticket-toolbar .tt-query:focus {
    border: none;
    border-bottom: 1px solid #FFF;
    outline: none;
}

.headerUpperRight .right-section .ticket-toolbar .tt-query:disabled { border-color: #555; }

.headerUpperRight .right-section .ticket-toolbar .tt-query:disabled::placeholder { color: #555; }

.headerUpperRight .right-section .typeahead-reading-status { top: 10px; }

.headerUpperRight .right-section .typeahead-reading-status .fa {
    color: white;
    left: -18px;
    position: relative;
}

.headerUpperRight .right-section .client-selection-section {
    float: left;
    width: 294px;
}

.headerUpperRight .right-section .client-selection {
    float: left;
    margin-right: 10px;
}

.headerUpperRight .right-section .client-selection-actions {
    left: 188px;
    margin-top: 4px;
    position: absolute;
}

.headerUpperRight .right-section .client-selection-actions .fa {
    cursor: pointer;
    float: right;
    padding: 5px;
}

.headerUpperRight .right-section .back-button { float: right; }

.headerUpperRight .right-section .back-button,
.headerUpperRight .right-section .add-client-button,
.headerUpperRight .right-section .search-client-button,
.headerUpperRight .right-section .add-client-note-button {
    background: none;
    border-color: white;
    color: white;
}

.headerUpperRight .right-section .back-button:hover,
.headerUpperRight .right-section .add-client-button:hover,
.headerUpperRight .right-section .search-client-button:hover,
.headerUpperRight .right-section .add-client-note-button:hover { background: #444; }

.headerUpperRight .right-section .add-client-note-button.disabled {
    border-color: #555;
    color: #555;
}

.headerUpperRight .right-section .request-selection-section {
    float: left;
    margin-left: 25px;
}

.headerUpperRight .right-section .request-selection-section .tt-dropdown-menu { left: -155px !important; }

.btn-group.ticket-view li a { position: relative; }

.btn-group.ticket-view li a i.kanban-icon { left: 23px; }

.btn-group.ticket-view li span { margin-left: 10px; }

.search-manager-template-selector { margin-left: -4px !important; }

.search-manager-template-selector .btn-group { margin-left: -5px !important; }

.grid-template-selector li.separator {
    border-bottom: 1px solid #CCC;
    margin: 5px 0;
    padding: 0;
}

.popover-print-tickets {
    display: inline;
    vertical-align: top;
}

.popover-print-tickets div.separator {
    border-bottom: 1px solid #CCC;
    margin: 5px 0 13px 0;
    padding: 0;
}

.chat-actions {
    bottom: 50px;
    position: absolute;
    right: 30px;
    z-index: 1;
}

.chat-actions button {
    background-color: rgb(137, 166, 0);
    border: 1px solid lightgrey;
    border-radius: 25px !important;
    color: #ffffff;
    cursor: pointer;
    padding: 10px;
}

.chat-actions button.cancel {
    background-color: #ffffff;
    color: grey;
}

.chat-users {
    height: 305px;
    margin: 0 10px;
    position: absolute;
    top: 45px;
    width: 95%;
}

.chat-users .users.selected {
    border-bottom: 1px dotted lightgrey;
    height: 40%;
    margin-bottom: 6px;
    overflow-y: auto;
    padding-bottom: 6px;
}

.chat-users .users.unselected {
    height: 55%;
    overflow-y: auto;
    width: 100%;
}

.chat-users .user { margin: 3px 0; }

.chat-users i {
    color: lightgrey;
    margin-right: 2px;
}

.chat-users label { display: inline; }

.chat-users .online { color: #92B001; }

.chat-load-more {
    background-color: #ffffff;
    border-radius: 0 0 0 4px;
    cursor: pointer;
    opacity: 0.8;
    padding: 2px 5px;
    text-align: center;
    z-index: 1;
}

#chatWidget { overflow: hidden; }

#chatWidget .nav { margin-bottom: 0; }

#chatWidget .tabbable { padding: 0; }

#chatWidget .nav-tabs > .active > a { font-weight: bold; }

#chatWidget .nav-tabs > li {
    background-color: #e0e0e0;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}

#chatWidget .nav-tabs > li.active { background-color: #ffffff; }

#chatWidget .nav-tabs > li > a { padding: 4px 5px; }

#chatWidget #chatCreateChannel { font-weight: bold; }

#chatWidget #chatCreateChannel a { cursor: pointer; }

form[name='formTicket'] .unread-message-count,
#chatWidget .body .unread-message-count {
    background-color: #c54646;
    border-radius: 15px;
    color: white;
    cursor: pointer;
    font-size: 10px;
    text-align: center;
}

#chatWidget .body .unread-message-count {
    float: left;
    padding: 2px 5px 1px 4px;
}

#chatWidget .body .tickets .unread-message-count { margin-top: -3px; }

form[name='formTicket'] .unread-message-count {
    height: 11px;
    padding: 0 5px 4px 5px;
    position: absolute;
    right: 1px;
    top: 1px;
}

#chatWidget .body .last-message,
#chatWidget .body .ticket {
    margin-left: 24px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#chatWidget .body .ticket .number {
    color: #89a600;
    font-size: 15px;
}

#chatWidget .body .ticket .summary {
    font-weight: bold;
    margin: 0 5px;
}

#chatWidget .body .last-message { margin-top: 4px; }

#chatWidget .body .last-message-sent-on {
    background-color: #f5f5f5;
    border-radius: 4px;
    color: #000000;
    float: right;
    font-size: 11px;
    padding: 0px 2px;
}

#chatWidget .body .has-no-unread-message { visibility: hidden; }

#chatWidget .header .unread-message-count {
    background-color: #c54646;
    border-radius: 15px;
    color: white;
    cursor: pointer;
    float: right;
    font-size: 10px;
    height: 5px;
    line-height: 10px;
    margin-top: 7px;
    padding: 1px;
    text-align: center;
    width: 5px;
}

#chatWidget .ressource-name {
    display: inline-block;
    float: left;
    margin-left: 10px;
    margin-top: 8px;
    max-width: 80%;
    overflow: hidden;
    text-overflow: ellipsis;
}

#chatWidget .channel-name,
#chatWidget .ticket-name {
    display: inline-block;
    float: left;
    max-width: 86%;
    overflow: hidden;
    text-overflow: ellipsis;
}

#chatWidget .tab-content.channels { overflow-x: hidden; }

#chatWidget .user-online {
    color: #92B001;
    float: left;
}

#chatWidget .user-offline {
    color: #ddd;
    float: left;
}

/*.chat-message .user-circle {
    position: absolute;
    background-color: #CCC;
    width: 28px;
    padding: 5px 2px 7px 2px;
    text-align: center;
    border: 1px solid #CCC;
    border-radius: 25px;
}*/

.chat-message .user-circle .initials {
    color: black;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.chat-message .user-circle-picture img[alt]::after {
    content: attr(data);
    font-size: 17px;
    position: absolute;
    text-align: center;
    width: 100%;
}

.manage-channel {
    cursor: pointer;
    position: relative;
    right: 16px;
}

.chat-message .message-time {
    color: #AAA;
    font-size: 10px;
    line-height: 12px;
    margin: 3px 10px 10px 10px;
    text-align: right;
}

.chat-message.other-user .message-time {
    margin-left: 5px;
    text-align: left;
}

.chat-message.other-user .chat-message-attachment img { margin-left: 40px; }

.chat-message .chat-message-download-link .openLink {
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 6px 11px;
}

.chat-message .chat-message-download-link { margin: 14px 9px; }

.chat-message.other-user .chat-message-download-link {
    margin-left: 45px;
    padding-top: 5px;
}

form[name='channelPopupForm'] .warning-message { padding-top: 0; }

form[name='channelPopupForm'] .tt-query { width: 95%; }

form[name='channelPopupForm'] .tt-dropdown-menu { min-width: 300px; }

form[name='channelPopupForm'] div[name='resources-multiple-selector'],
form[name='channelPopupForm'] div[name='groups-multiple-selector'] {
    margin-left: 0;
    padding-top: 0;
}

.move-to-ticket-selector { width: 100% !important; }

.copyright span {
    color: #555;
    vertical-align: top !important;
}

.copyright a {
    color: #555;
    vertical-align: top !important;
}

/* unvisited link */

.copyright a:link { color: #555; }

/* visited link */

.copyright a:visited { color: #555; }

/* mouse over link */

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

/* selected link */

.copyright a:active { color: #555; }

.atRequestWorkflows .sub-workflows > table td.td-subworkflows:before {
    background-color: #F29A3C;
    content: '';
    height: calc(100% - 2px);
    position: absolute;
    right: calc(50% - 1px);
    width: 2px;
}

.atRequestWorkflows .sub-workflows > table td.workflow-discarded:before,
.atRequestWorkflows .sub-workflows > table td.workflow-discarded td:before { background-color: #fbd6b4; }

.atRequestWorkflows .end-condition-design .item-vertical-line.fill-height { height: 0; }

.atRequestWorkflows .end-condition-design .item-horizontal-line.workflow-end-condition-true {
    bottom: 0;
    left: 50%;
    position: absolute;
    width: 50%;
}

.atRequestWorkflows .end-condition-design .item-horizontal-line.workflow-end-condition-false {
    bottom: 0;
    left: 0;
    position: absolute;
    width: 50%;
}

.typeahead-ticketSequenceNumber { font-weight: bold; }

.ticket-box-template .ticket-type-image {
    left: 3px;
    position: absolute;
    top: 3px;
}

.ticket-box-template .ticket-priority-image {
    left: 24px;
    position: absolute;
    top: 4px;
}

.ticket-box-template .ticket-priority-image:after { top: 0 !important; }

.ticket-box-template .sequence-number {
    font-weight: bold;
    left: 43px;
    position: absolute;
    top: 6px;
}

.ticket-box-template .summary {
    font-size: 12px;
    margin-top: 16px;
}

.communication-list {
    border: 1px solid lightgray;
    margin: 0 4px;
    max-height: 400px;
    min-height: 400px !important;
    overflow: auto;
    overflow-x: hidden;
}

.javascript-function label { margin-bottom: 6px; }

.javascript-function .function-signature {
    color: #708;
    margin-left: 45px;
}

.javascript-function .javascript-function-editor {
    border: 1px solid lightgray;
    height: 150px;
}

i.ticket-has-chat { color: #da812e; }

i.kbitem-is-subscribed {color: #da812e;}

.dropdown-kb-like-item i { float: right; }

.select2-results .select2-result-selectable {
    line-height: 16px;
    padding: 3px 0;
}

.select2-results ul.select2-result-sub > li .select2-result-label { font-size: 13px; }

.solution-found-thumbs { float: right; }

.solution-found-thumbs i {
    font-size: 28px;
    margin-top: -5px;
}

.solution-found-thumbs span {
    padding-left: 2px;
    position: absolute;
    top: 0;
}

.c2client-not-owner {
    float: right;
    margin-left: 4px;
}

.button-bar .c2client-not-owner { margin-top: 2px; }

.formHeaderlast .include-master-c2client { display: none !important; }

html.has-master-c2client .formHeaderlast .include-master-c2client {
    display: inline !important;
}

.licenses-manager .table td { line-height: 30px; }

.licenses-manager .table td.is-expired {
    color: red;
    font-weight: bold;
}

.licenses-manager .table i.fa-check { margin-right: 10px; }

.external-data-object {
    padding-bottom: 8px;
    padding-top: 8px;
}

.is-shown-processing { min-height: 1000px; }

.is-shown-processing .is-shown { visibility: hidden; }

.app-feature-help {
    cursor: pointer;
    display: inline-block;
    padding: 0 0 0 5px;
    vertical-align: bottom;
}

.app-feature-help i {
    color: #f58220;
    font-size: 14px;
}

i.mapping-error {
    color: #C44747;
    margin: 12px 5px;
    position: absolute;
}

.has-array-mapping-error i.mapping-error { margin: 7px 0 5px 2px; }

.has-array-mapping-error label { margin-left: 18px; }

.swal2-styled.swal2-confirm { background-color: #89A600; }

.update-status .key {
    font-weight: bold;
    line-height: 25px;
    margin-right: 10px;
}

label.field-grid-column-is-total {
    float: right !important;
    margin: -1px 0 -2px 0;
    min-height: 14px;
    padding: 0px 0 1px 0px;
    width: auto !important;
}

label.field-grid-column-is-total input[type=checkbox] {
    float: none;
    margin: 0;
}

form[name='updateManagerForm'] td[role='gridcell'] .k-selected {
    background: none;
    background-color: initial !important;
    background-image: none;
}

form[name='updateManagerForm'] textarea.logs {
    font-family: monospace !important;
    font-size: 13px;
}

.customgrid-grid-overflow { overflow: auto; }

form[name=snapshotsManagerForm] .message {
    border: 1px solid #dddddd;
    margin-top: 10px;
    padding: 8px 10px 0 10px;
    width: 98%;
}

form[name=snapshotsManagerForm] .message-icon { float: left; }

form[name=snapshotsManagerForm] .message i { font-size: 20px; }

form[name=snapshotsManagerForm] .message .success { color: #89A600; }

form[name=snapshotsManagerForm] .message .error { color: red; }

form[name=snapshotsManagerForm] .message .info { color: darkgrey; }

form[name=snapshotsManagerForm] .message div.message-text {
    font-weight: bold;
    margin-left: 30px;
    margin-top: 5px;
}

form[name=snapshotsManagerForm] .results .header {
    font-weight: bold;
    height: auto;
    margin: 10px 0 0 0;
    min-height: 24px;
    padding-right: 17px;
}

form[name=snapshotsManagerForm] .results .count { text-align: center; }

form[name=snapshotsManagerForm] .results .data {
    border-bottom: 1px solid #f0f0f0;
    height: 24px;
    min-height: 24px;
    padding: 5px 0;
}

form[name=snapshotsManagerForm] .results .result-data {
    height: 300px;
    overflow: auto;
}

.waiting-dots {
    background-image: url(../images/waiting-dots.gif) !important;
    background-repeat: no-repeat;
    background-size: 40px 24px;
    height: 20px;
    width: 40px;
}

custom-url-control .url-readonly { line-height: 30px; }

.login-ctrl.isApplicationPoolIA .form-content.app { display: none; }

.login-ctrl.isApplicationPoolIA .form-content.interaction {
    color: #f07725;
    display: flex !important;
    font-size: 16px;
    font-weight: bold;
    letter-spacing: 3px;
}

.snapshot-c2client-selector input.tt-query { width: 350px; }

.snapshot-c2client-selector .tt-dropdown-menu { top: 18px !important; }

.snapshot-c2client-selector .typeahead-reading-status { top: 4px; }

.snapshot-c2client-selector .clear-field { top: -2px; }

.move-to-ticket .clear-field {
    margin-left: -10px;
    top: 5px;
}

.communications-section .tokenfield.form-control .token .token-label { font-size: 13px; }

.communications-section .tokenfield.form-control .token { display: flex; }

.communications-section .attachmentsGrid input { width: 13px; }

.communications-section .row-fluid .attachmentsGrid [class*="span"] {
    margin-left: 5px;
}

.communications-section .noteAttachment { margin-left: 0 !important; }

.communications-section .noteAttachment img {
    margin: 5px 2px !important;
    padding: 0;
}

.communications-section .noteAttachment .deleteLink {
    right: 0;
    top: -2px;
}

.communications-section .k-button.k-upload-button { padding: 3px; }

.communications-section span[name=PasteHere] {
    display: inline-block;
    font-size: 90%;
    margin-top: 8px;
}

.communications-section .note-left-section .row-fluid { padding-bottom: 5px; }

.communications-section .dropdown-menu li div { padding: 6px 15px 4px 15px; }

.communications-section .dropdown-menu li a {
    display: inline-block;
    padding-bottom: 2px;
}

.communications-section .dropdown-menu li:hover,
.communications-section .dropdown-menu div:hover {
    background-color: #e8852d;
    color: #ffffff;
    cursor: pointer;
}

.communications-section .dropdown-menu li:hover a,
.communications-section .dropdown-menu div:hover a { color: #ffffff; }

.communications-section .dropdown-menu a:hover {
    color: #ffffff;
    cursor: pointer;
    text-decoration: none;
}

.at-attachments .progress-striped .bar { background-color: #ff9334; }

#MainTabs #ticket-kanban i.cannot-drag-drop-animation {
    animation-duration: 1s;
    animation-iteration-count: infinite;
    animation-name: cannotDragDrop;
}

@keyframes cannotDragDrop {
    0% {
        color: grey;
    }

    25% {
        color: red;
    }

    50% {
        color: #ffffff;
    }

    75% {
        color: #000000;
    }

    100% {
        color: grey;
    }
}

.ticket-banked-hours {
    border: 1px solid lightgrey;
    margin-top: 10px;
    padding: 10px 5px 5px 5px;
}

.grid-background-button { background-color: #f0f0f0; }

.k-dropdownlist,
.k-dropdownlist.k-hover,
.k-dropdownlist.k-focused,
.k-datepicker,
.k-datepicker.k-hover,
.k-datepicker.k-focused,
.k-datetimepicker,
.k-datetimepicker.k-hover,
.k-datetimepicker.k-focused,
.k-timepicker,
.k-timepicker.k-hover,
.k-timepicker.k-focused,
.k-calendar .k-hover,
.k-calendar .k-hover a,
.k-treeview .k-hover,
.k-treeview .k-hover a,
.ui-dialog {
    background: none;
    background-image: none !important;
}

.btn:focus
a:focus {
    outline: none;
}

.draggable-ticket {
    background-color: #f0f0f0;
    border-color: #808080;
    border-radius: 4px;
    border-style: solid;
    border-width: 1px;
    padding: 5px 5px;
}

.communication-border { border: 1px solid lightgrey; }

.communication-border-title {
    border-left: 1px solid #CCC;
    border-right: 1px solid #CCC;
    border-top: 1px solid #CCC;
}

.k-datepicker,
.k-datepicker.k-hover,
.k-datepicker.k-focused,
.k-datetimepicker,
.k-datetimepicker.k-hover,
.k-datetimepicker.k-focused,
.k-timepicker,
.k-timepicker.k-hover,
.k-timepicker.k-focused,
.k-calendar .k-hover,
.k-calendar .k-hover a,
.k-treeview .k-hover,
.k-treeview .k-hover a,
#QueuesTree .k-hover,
.ui-dialog {
    background-color: #CCC;
    color: #2e2e2e;
}

.ui-dialog.ui-draggable { background-color: white; }

.banked-hours-dropdown option,
.banked-hours-dropdown optgroup { color: #555; }

.banked-hours-dropdown.expired,
.banked-hours-dropdown option.expired { color: red !important; }

.banked-hours-section .child-association .extraInfo1 {
    display: inline-block;
    float: right;
    padding: 17px 10px 0 10px;
    text-align: right;
    width: 80px;
}

.banked-hours-section .child-association .extraInfo2 {
    display: inline-block;
    float: right;
    padding-top: 18px;
}

.banked-hours-time-calculations-values {
    height: 27px;
}

.banked-hours-time-calculations-signs {
    font-size: 24px;
    margin-top: 34px;
    text-align: center;
}

.btn-group.btn-border { border: 1px solid #cccccc; }

.black-color { color: #000000; }

.CIRelationsCtrl .overlay { border: solid #ddd 2px; }

.association-template-customizable .header {
    align-items: flex-end;
    display: flex;
    margin-bottom: 5px;
}

.association-template-customizable .header span {
    align-items: flex-end;
    display: flex;
}

.association-template-customizable .header,
.association-template-customizable .data { width: 98%; }

.association-template-customizable .data {
    border: 1px solid lightgray;
    border-radius: 5px;
    line-height: 40px;
    margin-bottom: 5px;
}

.association-template-customizable .data [class*="span"]:first-child { padding-left: 15px; }

.association-template-customizable .data .sequence-number {
    padding-right: 15px;
    text-align: right;
}

.association-template-customizable .align-right {
    justify-content: flex-end;
    text-align: right;
}

.tickets-section .ticket-type-image {
    background-size: 20px !important;
    height: 40px;
}

.timesheets-section .open-timesheet:before {
    content: "\f017";
    cursor: pointer;
    font-family: FontAwesome;
    font-size: 20px;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
}

.tickets-section .summary,
.timesheets-section .comment {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.Dashboard .dashboard-chart .popover.fade.in {
    z-index: 1;
}
.Dashboard .dashboard-chart .popover.fade.in:has(.tox-fullscreen) {
    z-index: 1031;
}

.k-menu .k-animation-container .k-animation-container, .k-menu .k-group .k-group, .k-menu-vertical .k-animation-container, .k-menu-vertical .k-group {
    height: auto !important;
    max-height: 500px !important;
    top: 0 !important;
}

.association-template-customizable .typehead-template { margin-bottom: 6px; }

.association-template-customizable .nowrap {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.managerFormHeader .k-datetimepicker { height: 27px; }

.managerFormHeader .k-datetimepicker input { margin-top: 2px; }

.k-timepicker input.k-input-inner, .k-datepicker input.k-input-inner, .k-datetimepicker input.k-input-inner {
    padding-left: 4px !important;
    outline-offset: -1px;
    margin: 0;
    border: none;
}

.event-header-row {
    width: auto;
}

.event-header-row .event-header-item {
    display: flex;
    align-items: center;
}

.event-header-row .event-header-item.input-search input {
    width: 100%;
}

.event-header-row .event-header-item select {
    margin-left: 12px;
}

.event-header-row .event-header-item .k-datetimepicker {
    width: 270px;
}

.event-header-row .event-header-item .k-datetimepicker input {
    font-size: 12px;
}

.event-header-row .event-header-buttons {
    justify-content: flex-end;
}

.event-header-row .event-header-buttons button {
    width: 48px;
}
.events-manager-form .CodeMirror {
    width: 98% !important;
}

.events-manager-form {
    padding: 10px 20px;
}

.events-manager-form .url {
    font-weight: bold;
    margin: 10px 0;
}

.events-manager-form .collapsibleContent .collapsibleContent {
    padding-top: 5px;
    padding-left: 15px;
}

.grid-events-user {
    width: 100%;
}

.grid-events-user i.fa-user { color: #ccc; }

.grid-events-user span {
    color: #000000 !important;
    font-weight: bold;
    margin-top: 6px;
}

.grid-events-level {
    text-align: center;
}

.grid-events-level.error i {
    color: red !important;
}

.grid-events-level.warning i {
    color: orange !important;
}

/* Resource number in the resource header */
#calendarResource .resource-number {
    float: left;
    font-weight: normal;
    padding-left: 5px;
    font-size: 11px;
}
/* The remove "X" link of a resource in the resource header */
#calendarResource a.remove-resource-link {
    float: right;
    padding: 2px;
    margin-right: 3px;
    text-decoration: none;
    cursor: pointer;
    color: #ffffff;
    background-color: #8b0000;
    font-size: 12px;
}
/* The remove "X" button to remove all resources in the header button bar */
#calendarResource .fc-removeResources-button {
    color: #ffffff !important;
    margin-left: 10px !important;
    background-color: #8b0000 !important;
}

/* The remove "X" link of an event (unassign resource from a ticket) */
#calendarResource .remove-event-link {
    float: right;
    color: #ffffff;
    cursor: pointer;
    font-weight: bold;
    font-size: 12px;
    padding: 2px;
    background-color: #8b0000;
}

/* Icon displayed for the calendar resource for the main dropdown menu of view's type selection */
.calendar-resource-icon {
    font-size: 9px;
}
.calendar-resource-icon .fa-calendar {
    font-size: 16px;
    margin-left: -7px;
}
.calendar-resource-icon .fa-user {
    padding-top: 4px;
    padding-left: 4px;
    font-size: 14px;
}

/* Item calendar resource in the main dropdown menu of view's type selection */
.dropdown-menu .calendar-resource-icon {
    font-size: 10px;
}
.dropdown-menu .calendar-resource-icon .fa-calendar {
    margin-left: -12px;
}
.dropdown-menu .calendar-resource-icon .fa-user {
    padding-left: 0;
}
.dropdown-menu .calendar-resource-icon-text {
    margin-left: -6px !important;
}

/* Tooltip over event */
.fc-event .tooltip div {
    text-align: left;
    white-space: normal;
}
.fc-event .tooltip .is-draft {
    text-transform: uppercase;
    font-style: italic;
}
.fc-event .tooltip .sequence-number {
    font-weight: bold;
}
.fc-event .tooltip .summary {
    opacity: 0.8;
}

#calendar .fc-toolbar,
#calendarResource .fc-toolbar {
    margin: 10px 0 0 0;
}

#calendar .fc-event-time {
    color: #ffffff;
}
#calendar .fc-event-title,
#calendarResource .fc-event-main {
    color: #333;
}

/* Resource selector */
#calendar-resource-selector {
    margin-top: 21px;
    position: absolute;
    margin-left: 143px;
    z-index: 900;
}
.calendar-resource-selector .tt-hint,
.calendar-resource-selector .tt-query {
    width: 165px;
}

.create-ticket-dropdown .popover-content {
    padding: 0;
}

.maintenanceManagerForm .results,
#normalizationData {
    color: #89A600;
    font-weight: bold;
    margin-top: 24px;
    padding: 10px;
    border: 1px solid #dddddd;
}
.maintenanceManagerForm .results .title,
#normalizationData .title {
    text-decoration: underline;
    text-transform: uppercase;
    font-size: 14px;
}
#normalizationData .explanation {
    font-style: italic;
    font-size: 12px;
    margin: 5px 0 7px 0;
}
#normalizationData .no-field-to-normalize {
    margin-top: 15px;
}
#normalizationData .header {
    line-height: 28px;
    margin-bottom: 5px;
}
.maintenanceManagerForm .results .header {
    line-height: 28px;
    margin-bottom: 5px;
    align-items: flex-end;
    display: flex;
}
.maintenanceManagerForm .results .header div,
#normalizationData .header div {
    border-bottom: 1px solid;
}
.maintenanceManagerForm .results .result .header {
    font-weight: normal;
    line-height: 18px;
}
.maintenanceManagerForm .result .header div {
    border-bottom: 1px dotted;
}

.maintenanceManagerForm .results .hidden {
    visibility: hidden;
    height: 0;
}
.maintenanceManagerForm .results .execution-time {
    margin-top: 30px;
}
.maintenanceManagerForm .results .time {
    margin: 20px 0;
}
.maintenanceManagerForm .results .time div {
    margin-top: 5px;
    font-weight: normal;
}

#normalizationData .result.odd {
    background-color: #dddddd;
}
.maintenanceManagerForm .results .result.odd {
    background-color: #f5f5f5;
}

#normalizationData .result div {
    min-height: 25px;
    padding: 5px 7px;
}
.maintenanceManagerForm .results .result div {
    min-height: 25px;
    padding: 7px 1px;
}
.maintenanceManagerForm .item-info-tip {
    margin-top: 2px;
}

.maintenanceManagerForm .results .items-description {
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 10px;
}
.maintenanceManagerForm .results .not-deletable-items {
    margin-top: 25px;
    font-weight: normal;
    font-size: 12px;
    color: #333;
}
.maintenanceManagerForm .results .not-deletable-items .result div {
    padding: 1px;
    min-height: 20px;
}
.maintenanceManagerForm .results .not-deletable-items .result {
    line-height: 20px;
}
.maintenanceManagerForm .alert {
    margin-top: 10px;
}
.maintenanceManagerForm .results .alert {
    margin-bottom: 15px;
}
.maintenanceManagerForm .items label {
    padding: 2px;
    margin: 4px 0;
}
.maintenanceManagerForm .items label:not(.has-dependencies) {
    padding-left: 3px;
}
.maintenanceManagerForm .items label.has-dependencies {
    border: 1px solid #e8e8a2;
    border-radius: 4px;
}

#normalizationData .number {
    text-align: right;
}

.my-subscriptions-container {
    padding: 12px
}

.my-subscriptions-container label {
    display: inline;
}

.my-subscriptions-title {
    font-size: large;
    font-weight: bold;
    margin: 20px 0 12px 0;
}

.my-subscriptions-content {
    position: relative;
}

.my-subscriptions-top-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.my-subscriptions-top-bar-buttons {
    display: flex;
    gap: 4px;
}

.my-subscriptions-top-bar-unsubscribe {
    display: flex; width: max-content;
}

button[name="searchRequestSectionClose"] {
    margin-top: 15px;
    margin-left: 5px;
}

input.communication-section-only-unread-checkbox {
    float: left;
    width: auto;
}

.communication-section-only-unread-checkbox-label {
    display: inline-block;
    padding: 2px 0 0 0;
}

.communication-section-above-list-titles {
    padding-top: 5px;
    white-space: nowrap;
}

.communication-section-above-email-buttons,
.communication-section-move-to-ticket {
    margin-top: -3px;
    white-space: nowrap;
}

.communication-section-move-to-ticket-ok-button {
    margin: 7px 0 0 20px;
}

.communications-section .note-button-group {
    float: right;
    margin-top: 10px;
}

/*mce-tinymce signature*/
div.signature > div.mce-tinymce {
    margin-top: 20px;
}

.custom-field-sections .section-visibility {
    padding-top: 8px;
}

.custom-schedule-control .timePickerCtrl.custom-schedule-time-picker {
    height: 25px !important;
    margin: 0px 3px 0px 0px;
    padding: 0px !important;
    width: 25%;
}

.ci-header-buttons,
.client-header-buttons,
.enterprise-header-buttons {
    display: inline-block;
    float: right;
    padding-right: 16px;
}

.btn-ci-group,
.btn-client-group,
.btn-ressource-group,
.btn-enterprise-group {
    display: inline-block;
    float: left;
    padding: 2px;
}

.btn-client-group .btn.action-toggle,
.btn-ressource-group .btn.action-toggle {
    margin-right: 0 !important;
}

.btn-client-group .btn-group > .btn,
.btn-ressource-group .btn-group > .btn {
    padding: 4px 4px;
    margin-left: -2px;
    margin-right: 1px;
}

.save-load-header-icon {
    float: left;
    margin-left: 10px;
}

.ticketHeader .save-load-header-icon {
    float: left;
    margin-left: 0;
}

.external-login-param {
    margin-bottom: 6px;
}

.collapsibleSectionHeader.section-locked span.locked-icon::after {
    content: "\f023";
    font-family: FontAwesome;
    font-size: 16px;
    float: right;
    padding-right: 30px;
}

.collapsibleSectionHeader.section-locked.collapsed,
.collapsibleSectionHeader.section-locked.expanded {
    background-position-y: center;
}

.scroll-up-to-calendar {
    width: 34px;
    height: 34px;
    position: fixed;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 1;
}
.scroll-up-to-calendar i {
    font-size: 34px;
    color: #ff9334;
}

.kanban-field-is-readonly {
    color: red;
    margin: 5px 0 10px 10px;
}
.kanban-field-is-readonly i {
    font-size: 16px;
    vertical-align: top;
    margin-left: 5px;
    cursor: pointer;
}

/* Client Credentials manager style */
input.grid-header-search-by-name[type="text"] {
    width: 200px;
}

/* Client Credentials manager style */
.azure-client-secret-test-button {
    font-weight: normal !important;
    margin-top: 10px;
}

.azure-client-secret-test-succeed {
    color: green;
    margin-left: 8px;
    position: relative;
    top: 10px
}

.azure-client-secret-test-error-message {
    margin-top: 10px;
}

.dropdown-menu.email-actions span {
    display: inline-block;
    width: 22px;
}
.dropdown-menu.email-actions i {
    float: right;
}

button.convert-email-to-note {
    padding: 6px 8px;
}
.convert-email-to-note i.fa-arrow-right {
    font-size: 10px;
    padding-top: 3px;
}

div.communication-container span.activity-row span span {
    float: left;
    margin-right: 2px;
}
div.communication-container i.fa-arrow-right,
div.communication-container i.fa-file-text {
    float: left;
}
div.communications-data i.fa-file-text,
div.communication-container i.fa-file-text {
    font-size: 14px;
}
div.communication-container span.is-unread,
div.communication-container span.is-read {
    padding-top: 3px;
}
div.communication-container span.activity-row span span.has-attachments i {
    transform: rotate(45deg);
    top: 0;
}
div.communication-container span.activity-row span span.has-follow-up {
    padding-top: 7px;
}

.activity-row .title {
    padding: 8px 0 0 0;
}

.occurrence-section {
    margin-top: 10px;
}
.occurrence-section .row-fluid {
    margin-bottom: 10px;
}

.occurrence-section ul.configuration {
    margin: 10px 0 0 15px;
    line-height: 1.7;
}

.occurrence-section ul.configuration li i {
    width: 22px;
}

.occurrence-section ul.configuration.sections i.fa-circle,
.occurrence-section ul.configuration.fields i.fa-asterisk,
.occurrence-section ul.configuration.fields i.fa-check {
    color: red;
}

.alert.no-action {
    cursor: default;
}

@media print {
    .no-export-entity-grid,
    .ticket-no-export {
        display: none !important;
    }
}

.no-export-entity-grid {
    -webkit-touch-callout: none !important; /* iOS Safari */
    -webkit-user-select: none !important; /* Safari */
    -moz-user-select: none !important; /* Firefox */
    -ms-user-select: none !important; /* Internet Explorer/Edge */
    -o-user-select: none !important; /* old pre-WebKit versions of Opera */
    user-select: none !important; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

.custom-field-directive {
    margin: 24px 0 10px 0;
}

/* d3's svg settings is affecting tinyMCE svgs so this is to avoid it */
div[class^='tox'] *,
div[class*=' tox'] * {
    height: initial;
    left: initial;
    overflow: initial;
    position: initial;
    top: initial;
    width: initial;
}

.tox-promotion,
.tox-statusbar__branding {
    display: none;
}

.tox-tinymce-aux {
    z-index: 900 !important;
}

.maintenanceManagerForm .toggle-all {
    margin-top: 15px;
}
.maintenanceManagerForm .toggle-all a {
    cursor: pointer;
    text-decoration: underline;
}
.maintenanceManagerForm .item-group {
    margin-top: 15px;
    font-weight: bold;
}
.maintenanceManagerForm label {
    margin-bottom: 5px;
}

.maintenanceManagerForm .footer {
    margin-top: 15px;
    display: flex;
    align-items: flex-end;
}

.custom-field-popup > div:not(:first-child):not(:last-child) {
    margin-top: 6px;
}

/* ---------- Custom field CHECKBOX ---------------------------------*/
.custom-fields .checkbox-container {
    display: table-row;
}
.custom-fields .checkbox-container span {
    margin-top: 2px;
}
.custom-fields .checkbox-input-container {
    display: table-cell;
    vertical-align: top;
}

.cIFoldersManagerCtrl .formHeaderCenterLeft,
.iaFoldersManagerCtrl .formHeaderCenterLeft {
    margin-left: 90px;
}

.cIFoldersManagerCtrl .formHeaderCenterLeft input,
.iaFoldersManagerCtrl .formHeaderCenterLeft input {
    top: 1px;
}

/* Set DueDate and/or ResponseDate in italic when ticket's state is on hold and the date is exceeded */
.ticket-date-exceeded {
    font-style: italic;
}

/* ------------------------------------------------ */
.checkbox-in-box-template {
    position: absolute;
    bottom: 5px;
    left: 7px;
}

.managerFormHeader .formHeaderfirst .formHeaderDropdownLabel {
    display: inline-block;
    margin: -5px 0 0 20px;
}

.managerFormHeader .formHeaderfirst .formHeaderDropdown {
    width: 200px;
    margin: -5px 0 0 0;
}

.managerFormHeader .formHeaderfirst .searchboxLabel {
    display: inline-block;
    margin: -5px 0 0 40px;
}

.managerFormHeader .resourceFormHeaderGroupDropdown {
    position: relative;
    top: -4px;
    width: 200px;
    margin-right: 17px;
}

.managerFormHeader .typeaheadLabel {
    display: inline-block;
    margin: -5px 0 0 40px;
}

.managerFormHeader .typeaheadContainer {
    display: inline-block;
    margin: -3px 0 0 2px;
    width: 300px;
}

.managerFormHeader .formHeaderlast .ciGridCheckboxes {
    display: inline-block;
}

.shareResolution {
    float: right;
    margin-top: 1px;
}

.searchFilterButtons {
    width: 96%;
    padding: 3px 5px;
}

form[name="resourcesManagerForm"] .userCirclePictureOffset,
form[name="clientsManagerForm"] .userCirclePictureOffset {
    margin-top: 10px;
}

form[name="picturePopupForm"] .modal-body .k-upload .k-upload-button input {
    width: 100%;
}

.searchResultsHeader {
    height: 24px;
}

.mailbox-status {
    text-align: center !important;
}
.mailbox-connected {
    color: green !important;
}

.mailbox-disconnected {
    color: red !important;
}

div.warning-custom-field-active-state-changes {
    font-size: 13px;
}

div.warning-custom-field-active-state-changes p {
    text-align: left;
}

div.warning-custom-field-active-state-changes ul {
    list-style-type: disc;
    padding: 10px 75px;
    text-align: left;
    columns: 2;
}

div.warning-custom-field-active-state-changes ul ul {
    columns: 1;
    padding: 3px 10px;
    list-style-type: circle;
}

.custom-fields-manager-ctrl .deactivation-date div {
    padding-top: 28px;
}

.custom-field-cell .inactive-field {
    text-transform: uppercase;
    font-size: 10px;
    padding: 0px 12px;
    color: white;
    font-weight: bold;
    transform: rotate(35deg);
    display: inline-block;
    right: -18px;
    top: 21px;
    letter-spacing: 3px;
    line-height: 1.4;
    position: absolute;
    z-index: 1;
    height: 0px;
    text-align: center;
    border-bottom: 15px solid gray;
    border-left: 22px solid transparent;
    border-right: 11px solid transparent;
}

[ng-controller="TicketEmailFormCtrl"] button[at-label="JSLBL_OK"] {
    float: left;
    margin: 2px 0 0 20px;
}

.client-send-activation-email {
    margin-top: 22px;
}

.resource-send-activation-email {
    margin-top: 18px;
}

.ci-copy-popup-section {
    position: relative;
}

.time-value .range-start,
.time-value .range-end {
    margin-bottom: 7px
}

.note-popup-title {
    display: flex;
    flex-direction: column;
    padding-bottom: 5px
}

div.note-and-email-section .send-email-button {
    float: right;
    margin-top: 10px;
}

form[name=IntermailForm] div[name=notification-groups-multiple-selector] .typeahead-reading-status,
form[name=IntermailForm] div[name=notification-resources-multiple-selector] .typeahead-reading-status {
    top: 29px;
}

form[name=taskTemplatesManagerForm] .security-groups .twitter-typeahead,
form[name=taskTemplatesManagerForm] .security-groups .tt-query {
    margin-left: 0;
}

form[name=taskTemplatesManagerForm] .security-groups .twitter-typeahead {
    width: 93%;
}

form[name=taskTemplatesManagerForm] .security-groups .typeahead-reading-status {
    margin-left: 5px;
}

#timesheet-groups-and-resources {
    margin-left: 15px;
    margin-top: 5px;
    padding-top: 4px;
}

div[ng-controller=ClientGridCtrl] .managerFormHeader p.formHeaderfirst input {
    width: 284px;
}
div[ng-controller=ResourceGridCtrl] .managerFormHeader p.formHeaderfirst input {
    width: 284px;
}
div[ng-controller=ClientGridCtrl] .search-by-enterprise {
    float: left;
    margin: -3px 0 0 -5px;
    width: 300px;
}
div[ng-controller=ClientGridCtrl] .search-by-enterprise input {
    width: 287px;
}

div[ng-controller=TicketEmailFormCtrl] .move-email-to-ticket {
    margin-left: 4px;
}

.labeled-password-input {
    display: flex;
    flex-direction: column;
}

.editable-password-input {
    display: flex;
    gap: 8px;
}

.password-input {
    position: relative;
    flex: 1;
}

.password-input .eye-icon {
    position: absolute;
    right: 10px;
    top: 12px;
    cursor: pointer;
}

.password-input input {
    flex: 1;
    margin-bottom: 0px !important;
    padding-right: 30px !important;
}

.editable-password-input .change-password-btn {
    display: flex;
    align-items: center;
    width: 30px;
    border: none;
    background-color: transparent;
}

.editable-password-input .change-password-btn:disabled {
    color: #777 !important;
    cursor: default;
}

.editable-password-input .change-password-btn i {
    font-size: 20px;
}

.read-only-queue {
    font-style: italic;
}

.k-table .k-table-th.k-header:hover {
    text-decoration: underline;
}

#ResourcesGroupsTree .k-treeview-group.k-treeview-lines .k-treeview-item {
    padding-left: 16px;
}

#ResourcesGroupsTree .k-treeview-group.k-treeview-lines .k-treeview-item .k-treeview-item {
    padding-left: 0px;
}

.ticket-grid-icon {
    padding: 0;
    text-overflow: clip !important;
}

.ticket-grid-icon span {
    display: block;
    margin: 0 auto;
}

.k-pager-sizes .k-dropdownlist.k-hover,
.k-pager-sizes .k-dropdownlist.k-hover:hover {
    color: var(--kendo-color-on-base) !important;
}

.k-pager-sizes .k-dropdownlist .k-button:hover {
    border-color: transparent;
}

.k-pager-sizes .k-input-inner {
    padding-right: 0;
}

.k-pager.k-grid-pager .k-button-icon.k-svg-i-arrow-rotate-cw svg {
    position: relative;
}

.k-grid .k-grid-header {
    border-top-width: 1px;
}

#TicketsList .k-grid .k-grid-header {
    border-top: none;
}

div[ng-controller=TimesheetPopupCtrl] .k-datetimepicker {
    width: 190px;
}

div[ng-controller=TimesheetPopupCtrl] .k-timepicker {
    width: 130px;
}

div[ng-controller=TimesheetPopupCtrl] .k-datetimepicker .k-input-inner,
div[ng-controller=TimesheetPopupCtrl] .k-timepicker .k-input-inner {
    font-size: 100%;
}

#MainTabs .ui-tabs-nav li a:focus {
	outline: none;
}

.ui-dialog-titlebar-close {
    border: none;
    border-radius: 4px !important;
    background-color: transparent;
    color: black !important;
}

.ui-dialog-titlebar-close:hover {
    border-radius: 4px !important;
}

.ui-dialog-titlebar-close:active { 
    border: 1px solid #ccc;
    background: #e4e4e4;
}

.ui-dialog-titlebar-close .ui-icon {
    background-image: url(images/ui-icons_444444_256x240.png) !important;
}

#TicketsList .k-table-td.k-detail-cell,
#TicketsListCalendarResource .k-table-td.k-detail-cell {
    overflow: visible;
}
.gantt-btn-previous-next{
    padding-bottom: 4px; 
    padding-left: 4px;
}
.gantt-btn-view{
    float: right; 
    padding-bottom: 4px;
}
#ticket-gantt{
    padding-left: 4px; 
    padding-top: 2px;
}

.oauth2-token-button {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
}

.oauth2-token-button .has-token {
    opacity: 0.6;
}

i.grid-edit-mode-message {    
    padding: 2px 0 0 5px;
}

.k-grid .k-master-row td {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.custom-attachements .attachment-validation-element.val-isValid {
    display:none;
}
.custom-attachements .attachment-validation-element.validation-failed {
    width: 108px;
    min-height: 40px;
    background: none;
    margin-bottom: -47px;
    margin-left: -5px;
    cursor: default;
    position: absolute;
}

.custom-attachements .k-upload {
    z-index: 1;
    width: 100px;
}

.otp-inputs {
    display: flex;
    gap: 10px;
    justify-content: space-between;
    width: 100%;
    max-width: 100%;
}

.otp-input {
    width: 45px !important;
    text-align: center !important;
    padding: 5px !important;
    font-size: 18px;
    border-radius: 5px;
    border: 1px solid #ccc;
}

/* Portal Mode */
html.portalMode .custom-fields .icon-lock { display: none !important; }

html.portalMode .hidden-portal, html.accountMode .hidden-portal { display: none !important; }


html.portalMode #TicketsTab .TicketsTabTable { min-height: inherit; }

html.portalMode #TicketsTab .TicketsTabMenu { width: 200px; }

html.portalMode #TicketsTab .ticketGridSlideBtn .btnTicketGridSlide.close { left: 188px; }

.navbar-inverse .brand, .navbar-inverse .nav > li > a { color: #DDD; }

html.portalMode .ticketsPortalToolbar {
    display: block;
    padding: 7px 10px 8px 10px;
    position: relative;
}

html.portalMode .portalButtonBar {
    display: inline-block;
    float: right;
    font-size: 85%;
    right: 7px;
    text-align: right;
    top: 6px;
}

/* Wizards Styles */

div.wizard .custom-field-sections label { padding-top: 0; }

div.wizard label { padding-top: 10px; }

div.wizard input { width: 99%; }

div.wizard textarea {
    margin-bottom: 10px;
    width: 99%;
}

li.selectCatalogButton { overflow: hidden; }

li.selectCategoryButton { overflow: hidden; }

div.selectServiceButton, div.selectRequestButton {
    background-color: #fff;
    box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.07);
    height: 155px;
    overflow: hidden;
}

div.selectServiceButton:hover, div.selectRequestButton:hover, li.selectCategoryButton:hover, li.selectCatalogButton:hover { background-color: #f8f8f8; }

div .selectServiceButton img, div.selectRequestButton img {
    float: left;
    height: 48px;
    width: 48px;
}

div.selectServiceButton h1 {
    padding-left: 60px;
    padding-top: 16px;
}

div.selectServiceButton ol,
div.selectRequestButton ol,
li.selectCategoryButton ol {
    list-style-position: inside;
    list-style-type: decimal;
}

div.selectServiceButton ul,
div.selectRequestButton ul,
li.selectCategoryButton ul {
    list-style-position: inside;
    list-style-type: disc;
}

div.selectServiceButton ul ul,
div.selectServiceButton ol ul,
div.selectRequestButton ul ul,
div.selectRequestButton ol ul,
li.selectCategoryButton ul ul,
li.selectCategoryButton ol ul,
ol ul { list-style-type: circle; }

div.selectServiceButton p { margin-bottom: 13px; }

div.selectRequestButton h1 {
    padding-left: 60px;
    padding-top: 0px;
}

div.selectRequestButton p {
    margin-bottom: 13px;
    margin-top: 13px;
}

div.selectServiceButton .padding {
    height: 80px;
    overflow: hidden;
}

.catalog-selection-description-text,
.category-selection-description-text {
    font-size: medium;
    text-align: center;
}

/*This is for the landing page*/
.menu-static-right {
    position: fixed;
    right: 0;
    top: 0;
}

.menu-static-right.paddedright {
    position: fixed;
    right: 50px;
    top: 0;
}

.pagecontainer {
    margin-left: 3%;
    min-height: 600px;
    position: relative;
}

/*.pagecontainer .row {
        margin-bottom: 40px;
    }*/

.pagecontainer .row-fluid { margin-top: 40px; }

img.padaround { margin: 20px; }

.container {
    margin-left: 0px;
    margin-right: 0px;
}

.jumbotron.noimg {
    background: none;
    background-color: #EEE;
    height: 160px;
    margin-left: 3%;
}

.jumbotron.noimg h1 { padding-top: 30px; }

.jumbotron {
    background: top right no-repeat;
    background-image: url("../images/smallbg_grad.jpg"); /* fallback */
    background-image: url("../images/smallbg_grad.jpg"), -webkit-linear-gradient(top, #777, #BBB, #444); /* Chrome 10+, Saf5.1+ */
    background-image: url("../images/smallbg_grad.jpg"), -moz-linear-gradient(top, #777, #BBB, #444); /* FF3.6+ */
    background-image: url("../images/smallbg_grad.jpg"), -ms-linear-gradient(top, #777, #BBB, #444); /* IE10 */
    background-image: url("../images/smallbg_grad.jpg"), -o-linear-gradient(top, #777, #BBB, #444); /* Opera 11.10+ */
    background-image: url("../images/smallbg_grad.jpg"), linear-gradient(top, #777, #BBB, #444); /* W3C */
    margin-right: auto;
    min-height: 360px;
    position: relative;
    width: auto;
}

.jumbotron.small {
    background: top right no-repeat;
    background-image: url("../images/smallbg_grad.jpg"); /* fallback */
    background-image: -webkit-linear-gradient(top, #444, #999, #444); /* Chrome 10+, Saf5.1+ */
    background-image: -moz-linear-gradient(top, #444, #999, #444); /* FF3.6+ */
    background-image: -ms-linear-gradient(top, #444, #999, #444); /* IE10 */
    background-image: -o-linear-gradient(top, #444, #999, #444); /* Opera 11.10+ */
    background-image: linear-gradient(top, #444, #999, #444); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#444444', endColorstr='#999999', GradientType=0);
    height: 220px;
    min-height: 0;
}

.jumbotron .content {
    margin-left: 3%;
    width: 60%;
}

.jumbotron h1 {
    font-size: 500%;
    line-height: 0.7;
    padding-top: 40px;
    text-align: left;
}

.jumbotron h3 {
    color: #FFF;
    font-size: 350%;
    line-height: 0.9;
    padding-bottom: 0px;
    padding-top: 40px;
    text-align: left;
    width: 65%;
}

.jumbotron p {
    color: #444;
    font-size: 30px;
    line-height: 1;
    padding-bottom: 10px;
    padding-top: 10px;
    text-align: left;
    width: 65%;
}

.navbar-fixed-top { margin: 0px; }

.navbar .nav-collapse { background-color: #333; }

.navbar-inverse .navbar-inner {
    background-color: #333;
    background-image: none;
    box-shadow: 2px 2px 12px #888;
    filter: none;
    margin: 0px;
    padding: 0px;
}

/*.navbar-inverse .brand {
    padding-left: 5px;
}*/

.navbar-inner .brand.logo {
    margin: 0px;
    padding: 0px;
}

.navbar .nav > li > a {
    font-size: 16px;
    padding: 21px 30px 21px 30px;
}

.navbar .nav > li > a {
    font-size: 16px;
    padding: 21px 30px 21px 30px;
}

.navbar-form { padding-top: 10px; }

.account {
    background: #f2f2f2 url(../images/body_bg.jpg) left top repeat;
    padding-top: 40px;
    width: 100%;
}

.infotext p {
    font-size: 120%;
    line-height: 0.9;
}

.infotext .title {
    font-size: 200%;
    padding-top: 26px;
}


/*Login form*/

.subscription-form { /*margin-top: 20px;*/ }

.login-form { }

.container-fluid {
    padding-left: 0px;
    /*padding-right: 0px;*/
}

.subscription-headerBar,
.login-headerBar {
    background-color: #454545;
    color: #FFF;
    height: 44px;
}

.subscription-headerBarImg,
.login-headerBarImg {
    background: url(../images/new-atom-logo-large.png) left top no-repeat;
    display: block;
    float: left;
    height: 62px;
    width: 207px;
}

.subscription-headerBarText,
.login-headerBarText {
    -webkit-text-shadow: 0.05em 0.05em #121212;
    font-size: 130%;
    left: 20px;
    position: relative;
    text-shadow: 0.05em 0.05em #121212;
    top: 15px;
}

.subscription-formWrapper,
.login-formWrapper {
    background-color: #fff;
    border: 1px solid #d3d3d3;
    border-top: 0px;
    padding-bottom: 20px;
}

.subscription-formWrapper .subscription-text,
.login-formWrapper .login-text {
    font-size: 11px;
    padding-top: 10px;
}

.subscription-formContent fieldset,
.login-formContent fieldset {
    border: 0px;
    font-size: 13px;
    padding: 0 39px;
}

.login-formContent section {
    margin-bottom: 2px;
    padding-bottom: 20px;
}

.subscription-formContent section {
    margin-bottom: 2px;
    padding-bottom: 5px;
}

.subscription-formContent section label,
.login-formContent section label, .login-forgotPassContent section label {
    display: block;
    float: left;
    font-size: 13px;
    height: 1em;
    line-height: 1em;
    margin: 0 0 5px 0;
    min-height: 1em;
    padding: 0;
    width: 100%;
}

.login-formContent div input { width: 97%; }

.login-forgotPassContent section { padding-left: 25px; }

.login-forgotPassContent input {
    margin-bottom: 10px;
    width: 200px;
}

.login-forgotPassContent button {
    position: relative;
    top: -2px;
}


p.login-keepSigned { margin-bottom: 20px; }

p.login-keepSigned input {
    line-height: 16px;
    vertical-align: middle;
}

p.login-keepSigned span.login-keepSigneText { padding-left: 5px; }

section div.login-button button { width: 100%; }

div.login-forgotDiv, .login-forgotPassContent {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size: 14px;
}

.login-forgotPassContent button {
    position: relative;
    top: -5px;
}

div.login-forgotDiv, div.login-subscriptionDiv {
    background: transparent;
    padding-right: 10px;
    padding-top: 10px;
    text-align: right;
}

div.login-forgotDiv a, div.login-subscriptionDiv a {
    color: #363636;
    text-decoration: underline;
}

.errorMessage {
    color: red;
    padding-bottom: 5px;
    text-align: center;
}

.waitingicon {
    display: inline-block;
    height: 17px;
    width: 20px;
}

.emailIsUnique {
    background: url(../images/green_bullet.png) 10px 0.35em no-repeat;
    color: #00A60B;
    font-size: 9pt;
    line-height: 1.2em;
    margin-top: 10px;
    padding-left: 25px;
}

sub { bottom: -0.35em; }

html.portalMode body, html.accountMode body { min-width: 350px; }

html.portalMode div.pagecontent { margin: 72px 10px 10px 10px; }

html.portalMode #SearchControl #SearchTerm {
    border-radius: 3px 0 0 3px;
    border-right: none;
    padding-right: 24px;
}

html.portalMode #SearchControl {
    display: flex;
    align-items: center;
    position: relative;
}

html.portalMode button#ClearSearch {
    background-color: transparent;
    position: absolute;
    border: none;
    margin-top: 0px;
    right: 38px;
    height: 100%;
    z-index: 2;
}

html.portalMode .login-headerBarImg {
    background-image: url(../images/logo.svg);
    background-size: 52px 52px;
    background-position: center right 0px;
    background-repeat: no-repeat;
    display: block;
    float: left;
    height: 62px;
    width: 62px;
}

.subscription-formContent input { width: 96%; }

.subscription-formContent select { width: 100%; }


.subscription-button,
.subscription-button button { width: 100%; }

header.portalMode { margin-bottom: 20px; }

.thumbnail {
    height: 242px;
    overflow-y: auto;
}

.thumbnail:hover, .thumbnail:focus { text-decoration: none; }

html.portalMode .custom-fields { margin-left: 0; }

.approval-box div { min-height: 15px; }

.approval-box .title,
.approval-box .content { padding-bottom: 10px; }

.approval-box .title > span {
    float: left;
    font-size: 16px;
    font-weight: bold;
}

.approval-box .content div { padding-bottom: 5px; }

.approval-box .content div:first-child { font-weight: bold; }

.approval-box .content div span:first-child {
    display: inline-block;
    width: 75px;
}

.approval-box .reason { margin-right: 10px; }

.approval-box .reason textarea {
    height: 75px;
    width: 100%;
}

.deleteAttachment {
    background: url(../images/delete_small.png) no-repeat;
    cursor: pointer;
    float: left;
    height: 16px;
    margin-left: 5px;
    width: 16px;
}

.padding { padding-left: 60px; }

li.noteAttachment {
    display: inline;
    height: auto;
    margin: 15px;
    width: 175px;
}

html.anonymous #TicketsTab div.popover-print-tickets,
html.anonymous #changePasswordMenuItem,
html.anonymous #portalContactInfoMenuItem,
html.anonymous #logoutMenuItem,
html.anonymous #portalSettingsDivider,
html.anonymous div.form-search,
html.anonymous div.portal-kb-my-subscriptions,
html.anonymous div.portal-kb-header-box .subscriptions,
html.anonymous div.user-events-widget {
    display: none;
}

div.ckeditor ol {
    list-style: decimal;
    margin: 10px 0 10px 40px;
}

div.ckeditor ul {
    list-style: disc;
    margin: 10px 0 10px 40px;
}

div.portal-form {
    margin-left: auto;
    margin-right: auto;
    max-width: 1024px;
}

div.portal-form input { width: 99%; }

div.portal-form .portal-form-content {
    background-color: white;
    border: 1px solid #D3D3D3;
    margin-top: 50px;
    padding: 20px;
}

div.portal-form-content > h4 {
    border-bottom: 1px solid #D3D3D3;
    font-size: 18px;
    height: 24px;
    padding-top: 10px;
    text-transform: uppercase;
}

html.portalMode .ciViewLink,
html.portalMode li.itemBox:hover .ciViewLink { display: none; }


html.portalMode .restrict-association {
    background: #AAA;
    cursor: not-allowed;
    opacity: 0.8;
    text-decoration: none;
}

html.portalMode .restrict-association:hover {
    border-color: #DDD;
    color: black;
}

#newTicketWizard { margin: 12px; }

#newTicketWizard .row { margin: 0 !important; }

html.portalMode #MainTabs table.k-selectable tr td span.ticket_flag_unlocked-image { display: none; }

.draft-ticket-full { background: repeating-linear-gradient(45deg, rgba(0, 0, 0, 0.04), rgba(0, 0, 0, 0.04) 2px, rgba(0, 0, 0, 0.0) 2px, rgba(0, 0, 0, 0.0) 15px); }

.portalTicket .custom-field-sections input { width: 98%; }

.portal-kb-my-subscriptions {
    float: right;
    padding-top: 10px;
}

.portal-kb-header-box {
    border-radius: 8px;
    padding: 24px;
    margin-bottom: 12px;
}

.portal-kb-msg-and-search {
    max-width: 1024px;
}

.portal-kb-title {
    font-size: large;
    font-weight: bold;
    padding-bottom: 12px;
}

.portal-kb-subtitle {
    border-bottom: 1px solid rgb(200, 200, 200);
    font-size: larger;
    font-weight: bold;
    margin-bottom: 12px;
    padding-bottom: 12px;
}

.portal-kb-body-box {
    background-color: white;
    border-radius: 8px;
    padding: 24px;
}

.portal-kb-row { margin-bottom: 36px; }

.portal-kb-item { margin-bottom: 10px; }

.portal-kb-icon { margin-right: 12px; }

.portal-view-container {
    background-color: white;
    padding-left: 4px;
}

.portal-view-header {
    font-size: large;
    font-weight: bold;
    padding: 14px 10px 8px 10px;
}

.portal-directive { padding-top: 10px; }

.portal-directive .cke_chrome { border: 0; }

/* Slider of the home page for custom portal settings from Enterprise or Parameters */

html.has-custom-portal-style .btnCustomPortalSlider {
    background-image: none !important;
    height: 58px;
    width: 21px;
}

html.has-custom-portal-style .btnCustomPortalSlider.close { border-radius: 72px 0 0 72px; }

html.has-custom-portal-style .btnCustomPortalSlider.open { border-radius: 0 72px 72px 0; }

html.has-custom-portal-style .btnCustomPortalSlider i { font-size: 25px; }

.ticket-detail-errors ul {
    color: red;
    float: left;
    list-style-type: square;
    margin: 15px 0 0 47px;
}

.ticket-detail-errors li { line-height: 1.5em; }

#chat-widget {
    border-radius: 35px;
    bottom: 30px;
    cursor: pointer;
    font-size: 16px;
    padding: 20px 3px !important;
    position: fixed;
    right: 30px;
    text-align: center;
    width: 50px;
}

/* LIKE on KB item detail */

html.portalMode .like-thumbs:not(.selected):not(.is-anonymous-access) i { cursor: pointer; }

.like-thumbs i {
    color: darkgrey;
    font-size: 24px;
}

html.portalMode .like-thumbs:not(.selected) i.i-custom-portal-button-bg-color { color: darkgrey !important; }

html.portalMode .like-thumbs:not(.is-anonymous-access) i:not(.i-custom-portal-button-bg-color):hover,
html.portalMode .like-thumbs.selected i:not(.i-custom-portal-button-bg-color) { color: #f89115; }

.like-count.up { margin-right: 12px; }

/* LIKE on KB item list */

.grid-like-thumbs span {
    color: #000000;
    font-size: 11px;
    font-weight: bold;
}

.grid-like-thumbs i {
    color: #f89115;
    opacity: .3;
}

.portal-kb-body-box .grid-like-thumbs { margin-right: 6px; }

.portal-kb-body-box .grid-like-thumbs i {
    float: left;
    font-size: 32px;
}

.portal-kb-body-box .grid-like-thumbs span { padding-left: 3px; }

.portal-kb-body-box .grid-like-thumbs .fa-thumbs-up { margin-top: -6px; }

html.portalMode .popover-print-tickets .popover.fade.bottom.in {
    left: initial !important;
    right: 0 !important;
}

html.portalMode .popover-print-tickets .popover.bottom .arrow { left: 75% !important; }

html.portalMode div#portal-home { padding: 2px 0; }

/* Subscription on KB item detail */
html.portalMode .subscriptions i {
    color: darkgrey;
    font-size: 24px;
    cursor: pointer;
}

html.portalMode .portal-kb-header-box .subscriptions {
    margin-right: 40px;
}

html.portalMode .subscriptions:not(.selected) i.i-custom-portal-button-bg-color {
    color: darkgrey !important;
}

html.portalMode .subscriptions:not(.is-anonymous-access) i:not(.i-custom-portal-button-bg-color):hover,
html.portalMode .subscriptions.selected i:not(.i-custom-portal-button-bg-color) {
    color: #f89115;
}


/* Home banner */

html.portalMode div#home-banner {
    background-image: url('../images/portal-home-banner.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    height: 250px;
    width: 100%;
    /* box-shadow: inset 0 0 0 2000px rgba(119,165,217,0.4); */
}

html.portalMode div#home-banner .tt-hint,
html.portalMode div#home-banner .tt-query { border-radius: 0 14px 14px 0; }

html.portalMode div#home-banner i.fa-search {
    color: darkgray;
    float: right;
    font-size: 24px;
}

html.portalMode div.home-search {
    background-color: #ffffff;
    border-radius: 14px;
    height: 39px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 10px;
    position: relative;
    width: 500px;
}

html.portalMode div#home-banner input[type="text"]:focus { outline: none; }

/* Home buttons */

html.portalMode div#home-buttons {
    padding: 50px 0;
    text-align: center;
}

html.portalMode div#home-buttons button {
    height: 150px;
    padding: 0;
    width: 150px;
}

html.portalMode div#home-buttons button span {
    display: block;
    font-size: 14px;
    font-weight: bold;
    padding: 0 15px 7px 15px;
}

html.portalMode div#home-buttons button i { font-size: 50px; }

html.portalMode div#home-banner .home-search .home-search-icon { display: inline-block; }

html.portalMode div#home-banner .home-search .home-search-typeahead {
    display: inline-block;
    width: 94%;
}

html.portalMode div#home-banner .home-search-request { top: 80px; }

html.portalMode div#home-banner .home-search-kb { top: 105px; }

html.portalMode div#home-buttons .middle-button { margin: 0 20px; }

html.portalMode .widget-portal-filters .dashboard-stat {
    margin-left: 2px;
}

html.portalMode .widget-portal-filters .dashboard-value {
    font-weight: normal;
}

html.portalMode .widget-portal-enterprises .widgetContent {
    max-height: unset;
    padding: 0 3px 5px 3px;
}

html.portalMode .widget-portal-enterprises .enterprise-row {
    clear: both;
}

html.portalMode .widget-portal-enterprises .tickets-count {
    float: right;
    margin-top: 1px;
}

html.portalMode .widget-portal-enterprises .enterprise-name {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

html.portalMode .widget-portal-enterprises .enterprise-name input {
    margin-right: 3px;
    margin-top: 0;
}

html.portalMode .widget-portal-enterprises .sub-enterprise {
    padding-left: 10px;
}

html.portalMode .widget-portal-enterprises .sub-enterprise .enterprise-row {
    padding-top: 8px;
}

html.portalMode a.portal-button-kb {
    float: left;
    padding: 15px 12px 10px 28px
}

html.portalMode a.portal-button-kb .kb-icon {
    text-align: center;
}

html.portalMode a.portal-button-kb .kb-label {
    margin-top: 5px;
}

html.portalMode .nav .dropdown-menu {
    left: 45px;
}

/* Some SVG of the C2 catalog images use a clip-path and it cuts some parts of the image.
   So, by setting the clip-path to none, we have the full image.
*/
html.portalMode #newTicketWizard .is-c2-image svg .st1,
html.portalMode #newTicketWizard .is-c2-image svg .st2,
html.portalMode #newTicketWizard .is-c2-image svg .st3 {
    clip-path: none !important;
}

/* MOBILE ONLY */
@media only screen and (max-width: 767px) {
    html .portalMode div#home-banner { height: 100px !important; }

    html.portalMode div#home-banner .home-search {
        background-color: #e0e0e0;
        width: 97%;
    }

    html.portalMode div#home-banner .home-search-request { top: 110px; }

    html.portalMode div#home-banner .home-search-kb { top: 130px; }

    html.portalMode div#home-banner .home-search .home-search-icon { display: inline-block; }

    html.portalMode div#home-banner .home-search .home-search-typeahead {
        display: inline-block;
        width: 90%;
    }

    html.portalMode div#home-buttons {
        margin: 150px 0;
        padding: 0;
    }

    html.portalMode div#home-buttons button {
        height: 100px;
        width: 100px;
    }

    html.portalMode div#home-buttons button span { font-size: 12px; }

    html.portalMode div#home-buttons .middle-button { margin: 0 10px; }
}

@media only screen and (max-width: 1250px) {
    body { font-size: 80%; }

    .headerControls { float: right; }

    .headerControls ul { padding: 5px 0 0; }

    section#content {
        clear: both;
        margin: 0 auto;
        margin-top: 3px;
        width: 100%;
    }

    .previewButtonBar .g4 {
        /*float: none;*/
        width: 31%;
    }

    td.k-detail-cell { min-height: 250px; }

    p.nowrap_100 { /*max-width:100px;*/ }

    .custom-geolocation-control .position { width: 48%; }
}

@media only screen and (max-width: 979px) {
    .subscription-headerBarText, .login-headerBarText { font-size: medium; }

    .navbar-inverse .btn-navbar { margin-top: 15px; }

    .menu-static-right {
        margin-top: 12px;
        position: fixed;
        right: 50px;
        top: 0;
    }

    .menu-static-right.paddedright {
        margin-top: 12px;
        position: fixed;
        right: 100px;
        top: 0;
    }

    .navbar-fixed-top .navbar-inner, .navbar-fixed-bottom .navbar-inner { padding: 0px; }

    .navbar-fixed-top { margin: 0px; }

    body { padding: 0px; }

    .account { padding-top: 0px; }

    .jumbotron {
        background-image: -webkit-linear-gradient(top, #777, #BBB, #444); /* Chrome 10+, Saf5.1+ */
        background-image: -moz-linear-gradient(top, #777, #BBB, #444); /* FF3.6+ */
        background-image: -ms-linear-gradient(top, #777, #BBB, #444); /* IE10 */
        background-image: -o-linear-gradient(top, #777, #BBB, #444); /* Opera 11.10+ */
        background-image: linear-gradient(top, #777, #BBB, #444); /* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#444444', endColorstr='#999999', GradientType=0);
        position: relative;
        width: auto;
    }

    .jumbotron .content {
        margin-left: 3%;
        width: auto;
    }

    .jumbotron h3 {
        height: auto;
        margin: 0px;
        padding-top: 20px;
        position: relative;
        width: auto;
    }

    html.portalMode div.pagecontent { margin: 10px; }

    div.selectServiceButton img {
        float: left;
        height: 32px;
        width: 32px;
    }

    div.selectServiceButton h1 {
        padding-left: 48px;
        padding-top: 8px;
    }

    div.selectServiceButton { height: 170px; }

    div.selectServiceButton .padding { height: 100px; }
}

td.visible-desktop, th.visible-desktop { display: table-cell !important; }

@media only screen and (max-width: 1100px) {
    td.visible-desktop, th.visible-desktop { display: none !important; }

    #TicketsTab .k-detail-cell { padding: 0px 10px 10px 10px; }

    .mobileButton { width: 98%; }

    .workflowContainer.smallDisplay div.workflow-bullet {
        -moz-background-size: 15px 15px !important;
        -o-background-size: 15px 15px !important;
        -webkit-background-size: 15px 15px !important;
        background-size: 15px 15px !important;
        height: 15px;
        width: 15px;
    }
}

@media only screen and (max-width: 767px) {
    .navbar-fixed-top, .navbar-fixed-bottom, .navbar-static-top { margin: 0px; }

    .subscription-form { width: 100%; }

    .pagecontainer { padding: 5px; }

    .jumbotron p {
        padding-bottom: 0px;
        width: 100%;
    }

    div.selectRequestButton { height: auto; }

    div.selectServiceButton { height: auto; }

    div.selectServiceButton .padding { height: auto; }

    .custom-field-cell { position: inherit; }
}

.paddingtop {
    margin-left: auto;
    margin-right: auto;
    margin-top: 100px;
    max-width: 1200px;
}
:root {
    /*
    --background-color-dark: #282c2d;
    --background-color-darker: #191b1c;
    --foreground-color: #d0cbc2;
    --border-color: #4c5255;
    --hyperlink-color: #3683ff;
    */
    --background-color-dark: #3E4243;
    --background-color-darker: #2F3132;
    --foreground-color: #E5E0D7;
    --border-color: #62686B;
    --hyperlink-color: #3683ff;
}

html.dark header.layout_header,
html.dark .widget .widgetHeader,
html.dark .k-header,
html.dark .k-master-row,
html.dark .k-alt,
html.dark .button-col3:hover,
html.dark .btn-group.open .btn.dropdown-toggle,
html.dark .k-hover,
html.dark #QueuesTree .k-hover,
html.dark .k-hover .k-mid,
html.dark .k-hover a,
html.dark .k-popup .k-list .k-hover,
html.dark .k-list-container,
html.dark .k-loading-image,
html.dark .k-separator,
html.dark .k-menu .k-hover > .k-active,
html.dark .messages-widget .header,
html.dark #TicketsTab .k-detail-cell,
html.dark .previewButtonBar,
html.dark .handle,
html.dark .k-calendar-container,
html.dark .ticketGridToolbar,
html.dark .draggable-ticket,
html.dark .bootbox .modal-footer,
html.dark .collapsibleSectionHeader,
html.dark #MainTabs ul.ui-tabs-nav li,
html.dark .itemBox,
html.dark li.itemBox:hover .editLink,
html.dark li.ticketClientItem:hover .clientEdit,
html.dark li.itemBox:hover .viewRelationLink,
html.dark .resource-box-template i.resource-state,
html.dark button.disabled, html.dark button.disabled:hover, html.dark .btn[disabled], html.dark .k-disabled .k-button.k-upload-button,
html.dark .cke_top, html.dark .cke_bottom, html.dark a.cke_dialog_ui_button,
html.dark .ticketHeader, html.dark .ticketHeader.bg-white,
html.dark .atRequestWorkflows .workflow-box,
html.dark .atRequestWorkflows .item-add .fa-plus,
html.dark .atRequestWorkflows .workflow-type-system,
html.dark div.ticket-references li.ticket-reference,
html.dark .clientDelete, html.dark .deleteLink,
html.dark .loadmask,
html.dark span.activity-row.light,
html.dark .mce-container-body, html.dark .mce-btn,
html.dark .k-dropdownlist, html.dark .k-dropdownlist.k-hover, html.dark .k-dropdownlist.k-focused, html.dark .k-datepicker, html.dark .k-datetimepicker, html.dark .k-timepicker, html.dark .k-datepicker.k-hover, html.dark .k-datepicker.k-hover, html.dark .k-timepicker.k-hover, html.dark .k-datepicker.k-focused, html.dark .k-datetimepicker.k-focused, html.dark .k-timepicker.k-focused, html.dark .k-calendar .k-hover, html.dark .k-calendar .k-hover a, html.dark .k-treeview .k-hover, html.dark .k-treeview .k-hover a, html.dark .ui-dialog,
html.dark .panel-default > .panel-heading,
html.dark .select2-container-multi .select2-choices .select2-search-choice,
html.dark .google-visualization-tooltip,
html.dark .CodeMirror, html.dark .CodeMirror-gutters, html.dark .CodeMirror-gutter, html.dark .CodeMirror-linenumber, html.dark .CodeMirror-selected,
html.dark .fc-toolbar, html.dark .fc th,
html.dark #calendar .fc-highlight,
html.dark .fc-event, html.dark .badge,
html.dark .chat-form .chat-messages .chat-message.other-user .chat-message-text,
html.dark .chat-form .chat-messages .chat-message.other-user .chat-message-text .chat-bubble-start,
html.dark .login-ctrl .img-holder,
html.dark .swal2-styled.swal2-cancel,
html.dark .resource-box-template .user-circle-picture, html.dark #ResourcesGroupsTree .user-circle-picture, html.dark form[name=resourcesManagerForm] .user-circle-picture, html.dark form[name=clientsManagerForm] .user-circle-picture, html.dark form[name=picturePopupForm] .user-circle-picture, html.dark #chatWidget .chat-user-circle-picture, html.dark #messages .user-circle-picture,
html.dark .customgrid tfoot td,
html.dark #normalizationData .result.odd,
html.dark .maintenanceManagerForm .result.odd,
html.dark .popover-title button,
html.dark .fc .fc-button-primary:hover,
html.dark .k-grid-header .k-grid-header-menu:hover,
html.dark .k-column-menu.k-column-menu-popup .k-columnmenu-item:hover,
html.dark .k-column-menu.k-column-menu-popup .k-columnmenu-item-wrapper .k-column-list-item:hover {
    background-color: var(--background-color-dark);
}

    html.dark body,
    html.dark .pinned #alert-area,
    html.dark #MainTabs,
    html.dark #MainTabs .ui-tabs-nav,
    html.dark #MainTabs ul.ui-tabs-nav li.ui-state-active,
    html.dark #TicketsTab,
    html.dark .ui-tabs-panel,
    html.dark .button-col3,
    html.dark .dropdown-menu,
    html.dark .k-grouping-header,
    html.dark .k-master-row.k-alt,
    html.dark .k-grid-pager,
    html.dark .k-link,
    html.dark .k-link.visited,
    html.dark .grid-background-button,
    html.dark .k-grid-header,
    html.dark .k-grid-content,
    html.dark .k-input,
    html.dark .k-select,
    html.dark .k-list,
    html.dark .popover,
    html.dark .tt-dropdown-menu,
    html.dark .ticketPreviewFull,
    html.dark .k-calendar .k-content,
    html.dark .k-calendar .k-content th,
    html.dark .k-calendar .k-footer,
    html.dark .bootbox,
    html.dark .bootbox .modal-body,
    html.dark .ui-dialog,
    html.dark div.indicator,
    html.dark div.mce-edit-area,
    body.cke_editable.dark,
    html.dark .tox .tox-edit-area__iframe,
    html.dark .select2-drop,
    html.dark .select2-no-results,
    html.dark .atRequestWorkflows,
    html.dark .modal-footer .btn,
    html.dark .popover-title,
    html.dark .at-attachments .k-header,
    html.dark #cboxContent,
    html.dark #cboxLoadingGraphic,
    html.dark span.activity-row,
    html.dark .tokenfield.form-control,
    html.dark .tokenfield.form-control .token,
    html.dark .modal,
    html.dark .modal .modal-body,
    html.dark .modal-footer,
    html.dark div.manager-form,
    html.dark div.itemTemplate, html.dark div.taskTemplate,
    html.dark .client-communications .communications-data,
    html.dark .k-block, html.dark .k-widget,
    html.dark .panel-body,
    html.dark .panel,
    html.dark .select2-choices,
    html.dark .CodeMirror-scroll, html.dark .CodeMirror-sizer,
    html.dark .atRequestWorkflows .sub-workflows > table td.td-subworkflows,
    html.dark .fc-button,
    html.dark div.folders-treeview,
    html.dark .gantt_grid_scale, html.dark .gantt_task_scale, html.dark .gantt_row, html.dark .gantt_task_row,
    html.dark .k-grid-header-wrap .k-header,
    html.dark .k-grouping-row td, html.dark .k-group-cell,
    html.dark .table-striped tbody > tr:nth-child(odd) > td, html.dark .table-striped tbody > tr:nth-child(odd) > th,
    html.dark td.priorityMatrixCell,
    html.dark #userpreferences #ticketform .expanded-section, html.dark #userpreferences #ciform .expanded-section,
    html.dark .jsPanel-content,
    html.dark .select2-container-multi.select2-container-disabled .select2-choices,
    html.dark .login-ctrl .form-holder .form-content,
    html.dark .reset-password-tooltip,
    html.dark .reset-password-tooltip .ui-tooltip-titlebar,
    html.dark .CIRelationsCtrl .overlay,
    html.dark .swal2-popup,
    html.dark .fc th.fc-resource,
    html.dark #MainTabs ul.ui-tabs-nav .dropdown-tab-ul li,
    html.dark .k-column-menu.k-column-menu-popup,
    html.dark .k-column-menu.k-popup.k-grid-columnmenu-popup {
        background-color: var(--background-color-darker);
    }

        html.dark body,
        html.dark a,
        html.dark label,
        html.dark div[at-label],
        html.dark div span[at-label],
        html.dark .copyright a:link,
        html.dark .copyright a,
        html.dark .copyright span,
        html.dark #MainTabs ul.ui-tabs-nav li a,
        html.dark #TicketsTab,
        html.dark .k-treeview,
        html.dark .k-treeview .k-hover, html.dark .k-treeview .k-hover a,
        html.dark .btn-group,
        html.dark .dropdown-menu a,
        html.dark .k-grouping-header,
        html.dark .k-header a,
        html.dark .k-master-row td span,
        html.dark .k-pager-info,
        html.dark .k-link,
        html.dark .k-link.visited,
        html.dark .k-widget,
        html.dark .k-input,
        html.dark .k-dropdownlist.k-hover .k-input-inner,
        html.dark .k-dropdownlist.k-focus .k-input-inner,
        html.dark .k-list,
        html.dark .popover,
        html.dark .popover li,
        html.dark .tt-dropdown-menu,
        html.dark .handle,
        html.dark .ticketPreviewFull,
        html.dark .k-calendar .k-content th,
        html.dark .draggable-ticket,
        html.dark .bootbox .modal-body,
        html.dark .bootbox .modal-footer,
        html.dark .collapsibleSectionHeader,
        html.dark .itemBox,
        html.dark .itemBox:not(.impact-is-active) .boxTemplate,
        html.dark .item-box-delete,
        html.dark .typeahead-reading-status .fa,
        html.dark .autoAssign,
        html.dark .ui-dialog-titlebar,
        html.dark div.indicator,
        html.dark .cke_button_icon,
        body.cke_editable.dark,
        #tinymce.mce-content-body.dark,
        html.dark .cke_dialog_title,
        html.dark .ticketHeader,
        html.dark .canvasBackground,
        html.dark .select2-drop,
        html.dark .select2-no-results,
        html.dark .select2-container a,
        html.dark .atRequestWorkflows .workflow-box,
        html.dark .atRequestWorkflows .workflow-type-system,
        html.dark .modal-footer .btn,
        html.dark .viewLink, html.dark .editLink, html.dark .clientView, html.dark .clientEdit, html.dark .clientCis, html.dark .resourceView,
        html.dark .k-calendar .k-selected.k-focused > .k-link,
        html.dark .widgetTitle,
        html.dark div.ticket-references li.ticket-reference,
        html.dark .popover-title,
        html.dark .clientDelete, html.dark .deleteLink,
        html.dark .mce-menubtn button,
        html.dark .tokenfield.form-control,
        html.dark .modal,
        html.dark .modal .modal-body,
        html.dark .widgetHeader,
        html.dark .k-grid-content .fa,
        html.dark .k-grid td,
        html.dark div.itemTemplate, html.dark div.taskTemplate,
        html.dark .client-communications .communications-data,
        html.dark .btn:hover, html.dark .btn:focus,
        html.dark .communications-data,
        html.dark .at-attachments,
        html.dark .k-upload-button,
        html.dark #MainTabs .ui-tabs-nav li.ui-state-active a,
        html.dark .manager-form,
        html.dark .modal-header button,
        html.dark .Manager,
        html.dark .panel-default > .panel-heading,
        html.dark .select2-choices, html.dark .select2-container-multi .select2-choices .select2-search-choice,
        html.dark .select2-container-multi .select2-choices .select2-search-field input,
        html.dark .CodeMirror-scroll, html.dark .CodeMirror-sizer, html.dark .CodeMirror-gutter, html.dark .CodeMirror-gutters, html.dark .CodeMirror-linenumber,
        html.dark .atRequestWorkflows .workflow-box.new-item .item-header,
        html.dark .fc-toolbar, html.dark .fc-button, html.dark .fc th, html.dark .fc-event .fc-title, html.dark .fc-event:hover,
        html.dark #ticket-kanban .ticket-box,
        html.dark #ticket-kanban .ticket-box .sequencenumber, html.dark #ticket-kanban .ticket-box .status,
        html.dark .gantt_grid_scale, html.dark .gantt_task_scale, html.dark .gantt_row, html.dark .gantt_task_row, html.dark .gantt_grid_data .gantt_cell,
        html.dark .k-grid-header-wrap .k-header,
        html.dark .cke_combo_text,
        html.dark .black-color,
        html.dark .chat-form .chat-messages .chat-message.other-user .chat-message-text,
        html.dark .activity-row,
        html.dark .banked-hours-dropdown option, html.dark .banked-hours-dropdown optgroup,
        html.dark .login-ctrl .form-content h3, html.dark .login-ctrl .form-content p, html.dark .login-ctrl .form-content .form-button a,
        html.dark .login-ctrl .form-content select option,
        html.dark .popover button,
        html.dark .reset-password-tooltip .ui-tooltip-icon .ui-icon,
        html.dark .copyright.small-screen,
        html.dark .ck-inline-memo-field,
        html.dark .swal2-popup .swal2-content,
        html.dark .fc-unthemed td,
        html.dark .dialog-timer-form span, html.dark .dialog-timer-form .fa,
        html.dark div.association-template-customizable,
        html.dark .custom-fields-switch h3.custom-field-label,
        html.dark #clientExportImportConfigurationForm .message,
        html.dark #calendarResource .fc-event-main,
        html.dark #calendar .fc-event-title,
        html.dark #timesheet-calendar .fc-event.timesheet .fc-event-title,
        html.dark #timesheet-calendar .fc-timegrid-slot,
        html.dark #timesheet-calendar .fc-timegrid-axis,
        html.dark form[name=ticketEmailForm] .email-subject,
        html.dark .my-subscriptions-container,
        html.dark .dropdown-tab-li,
        html.dark div#DropdownTab,
        html.dark .change-password-btn,
        html.dark .k-pager,
        html.dark .k-pager .k-picker,
        html.dark .chat-form .k-upload-button span::before,
        html.dark .k-column-menu.k-popup.k-grid-columnmenu-popup,
        html.dark .k-column-menu.k-grid-columnmenu-popup .k-columnmenu-item-wrapper .k-expander,
        html.dark .k-column-menu.k-grid-columnmenu-popup .clear-search {
            color: var(--foreground-color);
        }

            html.dark .k-master-row td,
            html.dark .k-grid-header-wrap th,
            html.dark .k-grouping-header,
            html.dark .k-grid-header,
            html.dark #TicketsTab,
            html.dark #MainTabs ul.ui-tabs-nav,
            html.dark #MainTabs ul.ui-tabs-nav li,
            html.dark .button-col3,
            html.dark .kendo-grid,
            html.dark #TicketsTab .TicketsTabGrid,
            html.dark .k-grid-pager,
            html.dark .k-grid-header-wrap,
            html.dark .k-dropdownlist,
            html.dark .dropdown-menu,
            html.dark #MainTabs ul li span.k-selected,
            html.dark .k-hover,
            html.dark .k-list-container,
            html.dark .k-popup,
            html.dark .popover,
            html.dark .tt-dropdown-menu,
            html.dark .k-datepicker,
            html.dark .k-timepicker,
            html.dark .k-selectable tr td,
            html.dark .k-selectable-custom tr td,
            html.dark .ticketGridToolbar,
            html.dark .k-datepicker .k-input,
            html.dark .k-datetimepicker .k-input,
            html.dark .k-timepicker .k-input,
            html.dark .k-select,
            html.dark .draggable-ticket,
            html.dark .bootbox,
            html.dark .bootbox .modal-footer,
            html.dark .ui-tabs-panel,
            html.dark .k-datetimepicker,
            html.dark .ticket-banked-hours,
            html.dark button.disabled, html.dark button.disabled:hover, html.dark .btn[disabled], html.dark .k-disabled .k-button.k-upload-button,
            html.dark div.indicator,
            html.dark .cke_reset,
            html.dark a.cke_dialog_tab_selected,
            html.dark .ticketHeader,
            html.dark .pinned .ticketHeader.affix, html.dark .pinned .ci-header.affix, html.dark .pinned .client-header.affix, html.dark .pinned .enterprise-header.affix,
            html.dark .select2-drop,
            html.dark .select2-container a,
            html.dark .modal-footer .btn,
            html.dark div.ticket-references li.ticket-reference,
            html.dark .popover-title,
            html.dark .clientDelete, html.dark .deleteLink,
            html.dark .ticketFormRight,
            html.dark .k-button.k-upload-button,
            html.dark .noteAttachment img,
            html.dark hr,
            html.dark .communication-border,
            html.dark .communication-list,
            html.dark span.activity-row,
            html.dark span.activity-grouping-row,
            html.dark .communication-border-title,
            html.dark .mce-menubar,
            html.dark .mce-btn-group .mce-btn,
            html.dark .tokenfield.form-control,
            html.dark .tokenfield.form-control .token,
            html.dark .modal-header,
            html.dark .modal-footer,
            html.dark div.itemTemplate, html.dark div.taskTemplate,
            html.dark .client-communications .communications-data,
            html.dark #browseImageListView,
            html.dark .panel, html.dark .panel-heading,
            html.dark .select2-choices, html.dark .select2-container-multi .select2-choices .select2-search-choice,
            html.dark .btn-group.btn-border,
            html.dark div.border-bottom,
            html.dark .google-visualization-tooltip,
            html.dark .CodeMirror-cursor,
            html.dark .fc-toolbar, html.dark .fc-button, html.dark .fc-unthemed .fc-divider, html.dark .fc-unthemed .fc-popover .fc-header,
            html.dark .fc-unthemed th, html.dark .fc-unthemed td, html.dark .fc-unthemed thead, html.dark .fc-unthemed tbody, html.dark .fc-unthemed .fc-divider, html.dark .fc-unthemed .fc-row, html.dark .fc-unthemed .fc-popover,
            html.dark .fc-event,
            html.dark div.folders-treeview,
            html.dark #ticket-kanban .ticket-box, html.dark #ticket-kanban .column, html.dark #ticket-kanban .title,
            html.dark .gantt_grid_scale, html.dark .gantt_task_scale, html.dark .gantt_row, html.dark .gantt_task_row,
            html.dark .mce-panel,
            html.dark .k-grid, html.dark .k-group-indicator,
            html.dark .CodeMirror-gutters,
            html.dark td.priorityMatrixCell,
            html.dark .select2-container-multi.select2-container-disabled .select2-choices,
            html.dark .CIRelationsCtrl .overlay,
            html.dark .ck-inline-memo-field,
            html.dark .dialog-timer-form .tt-input,
            html.dark div.association-template-customizable .data,
            html.dark .customgrid tfoot td, html.dark .table-bordered, html.dark .customgrid th, html.dark .customgrid td,
            html.dark div.alert,
            html.dark .fc-theme-standard td,
            html.dark .fc .fc-button-primary:not(:disabled):active,
            html.dark .fc .fc-button-primary:not(:disabled).fc-button-active,
            html.dark .fc .fc-button-primary:hover,
            html.dark #normalizationData,
            html.dark .dropdown-tab-li,
            html.dark #MainTabs .ui-tabs-nav .dropdown-tab-ul li:first-child {
                border-color: var(--border-color);
            }

html.dark #MainTabs .ui-tabs-nav .dropdown-tab-ul li:last-child {
    border-color: var(--border-color) !important;
}

html.dark .button-col3,
html.dark .fc .fc-button-primary,
html.dark .fc .fc-button-primary:not(:disabled):active,
html.dark .fc .fc-button-primary:not(:disabled).fc-button-active {
    color: white;
}

html.dark .button-col3 .caret-white { border-top-color: white; }

html.dark button.disabled { color: #777 !important; }

html.dark .widget .widgetHeader,
html.dark .handle,
html.dark .collapsibleSectionHeader { border-bottom-color: var(--border-color); }

html.dark .cke_combo_arrow { border-top-color: var(--foreground-color); }

html.dark a:hover,
html.dark .openLink,
html.dark .openLink span,
html.dark .ticket-note-number,
html.dark form[name=formTicket] .ticketCountLink:hover,
html.dark #MainTabs .ui-tabs-nav a:hover,
html.dark .ticket-grid td.sequenceNumber:hover,
html.dark .ci-grid .ciNumber:hover,
html.dark .search-grid td.sequenceNumber:hover,
html.dark .search-grid .ciNumber:hover,
html.dark .client-grid td.sequenceNumber:hover,
html.dark .resource-grid td.sequenceNumber:hover,
html.dark .enterprise-grid td.sequenceNumber:hover { color: var(--hyperlink-color); }

/* SCOLLBAR */

html.dark ::-webkit-scrollbar-thumb { background-color: var(--border-color); }

html.dark ::-webkit-scrollbar,
html.dark ::-webkit-scrollbar-corner { background-color: var(--background-color-dark); }

/* INPUT */

html.dark textarea {
    background-color: var(--background-color-darker);
    border-color: var(--border-color);
    color: var(--foreground-color);
}

html.dark textarea:focus { outline-style: solid; }

html.dark input,
html.dark select,
html.dark select.white-options option {
    background-color: var(--background-color-darker);
    border-color: var(--border-color);
    color: var(--foreground-color);
}

input:-internal-autofill-selected {
    background-color: var(--background-color-darker) !important;
    color: var(--foreground-color) !important;
}

html.dark input:focus,
html.dark select:focus { outline-style: solid; }

html.dark input[disabled],
html.dark select[disabled],
html.dark textarea[disabled],
html.dark input[readonly],
html.dark select[readonly],
html.dark textarea[readonly] { background-color: var(--background-color-dark); }

html.dark textarea.highlighted,
html.dark input.highlighted,
html.dark .uneditable-input.highlighted { outline-style: solid; }

/* CKEDITOR */

body.cke_editable.dark.readonly {
    background-color: var(--background-color-dark);
}

/* override class */
html.dark .cke_focus { outline-style: solid; }

/* OVERRIDE EXCEPTION */

html.dark .button-orange,
html.dark .messages-widget li.link:hover,
html.dark .user-events-widget li.link:hover,
html.dark .fc-button.fc-state-active { background-color: #ff9334; }

html.dark .button-orange:hover { background-color: #d57d29; }

html.dark .cm-s-default .cm-tag { color: #19b100; }

html.dark .grid-inactive-record, html.dark .grid-not-c2client-owner {
    background-color: var(--background-color-dark);
    font-style: italic;
    opacity: 0.65;
}


    html.dark .k-grid .grid-inactive-record td, html.dark .grid-inactive-record .grid-not-c2client-owner, .k-grid .grid-inactive-record td span {
        color: #A0A0A0 !important;
    }

html.dark .CodeMirror,
html.dark .jsPanel { border: 1px solid var(--border-color) }

html.dark .fc-unthemed .fc-today,
html.dark .gantt_grid_data .gantt_row.gantt_selected, html.dark .gantt_grid_data .gantt_row.odd.gantt_selected, html.dark .gantt_task_row.gantt_selected,
html.dark .gantt_grid_data .gantt_row.odd:hover, html.dark .gantt_grid_data .gantt_row:hover { background-color: #4e4031; }

html.dark .canvasBackground { background: -webkit-gradient(linear, left top, left bottom, from(var(--background-color-dark)), to(var(--background-color-darker))); }

html.dark .Manager { background: linear-gradient(to right, var(--background-color-darker), var(--background-color-darker) 80%, var(--background-color-dark)); }

html.dark #ticket-kanban .ticket-box { box-shadow: 2px 2px 2px var(--background-color-dark); }

html.dark .k-treeview .k-selected,
html.dark .ticket-grid .k-grid-content tr.k-alt > td.k-selected,
html.dark .ticket-grid .k-grid-content tr:not(k-alt) > td.k-selected,
html.dark .k-grid-content .k-selected,
html.dark .k-master-row.k-selected,
html.dark .k-alt.k-selected,
html.dark tr:not(.k-selected) td.k-selected,
html.dark .k-calendar .k-selected.k-focused > .k-link,
html.dark .custom-button-control button.disabled { background-color: var(--background-color-dark) !important; }

html.dark #MainTabs ul li.ui-state-default.ui-corner-top:not(.ui-tabs-active) { border-bottom-color: var(--border-color) !important; }

html.dark .jsPanel .ui-icon-gripsmall-diagonal-se { color: var(--foreground-color) !important; }

html.dark .k-calendar .k-content .k-other-month a { color: #888; }

html.dark .dropdown-menu li > a:hover, html.dark .dropdown-menu li > a:focus, html.dark .dropdown-submenu:hover > a,
html.dark .atRequestWorkflows .item-details .fa, html.dark .atRequestWorkflows .item-subdetails .fa { color: white; }

html.dark span.target-0-image,
html.dark span.Incident-image,
html.dark span._d2b1fcc4-723d-4c36-ba1a-6f91b11d5c1c-image,
html.dark div.ticket-workflow.incident { background: url(../images/icons/incident_ticket_white.png) center center no-repeat; }

html.dark span.ServiceRequest-image,
html.dark span._19f57377-94fd-4391-a154-577446131999-image,
html.dark div.ticket-workflow.service-request { background: transparent url(../images/icons/service_request_ticket_white.png) center center no-repeat; }


html.dark span.Project-image,
html.dark span._df1f87cb-3979-4ce7-9bd3-b0716869e34b-image,
html.dark div.ticket-workflow.project { background: url(../images/icons/project_ticket_white.png) center center no-repeat; }

html.dark span.Problem-image,
html.dark span._acc5dff2-b0f4-40bc-bd98-e45a37b87faa-image,
html.dark div.ticket-workflow.problem { background: url(../images/icons/problem_ticket_white.png) center center no-repeat; }

html.dark span.ChangeRequest-image,
html.dark span._d3d76203-bc9f-4b59-a105-68bd9f236e6a-image,
html.dark div.ticket-workflow.change-request { background: url(../images/icons/change_request_ticket_white.png) center center no-repeat; }

html.dark span.Task-image,
html.dark span.TaskTemplate-image, html.dark span._e2609e13-0d39-4223-88a5-7090637706ee-image,
html.dark div.ticket-workflow.task { background: transparent url(../images/icons/task_ticket_white.png) center center no-repeat; }

html.dark .fc-event.service-request .fc-event-title,
html.dark #timesheet-calendar .fc-event.service-request .fc-title {
    background: transparent url('../images/icons/service_request_ticket_white.png') left top no-repeat;
}

html.dark .fc-event.incident .fc-event-title,
html.dark #timesheet-calendar .fc-event.incident .fc-title {
    background: transparent url('../images/icons/incident_ticket_white.png') left top no-repeat;
}

html.dark .fc-event.project .fc-event-title,
html.dark #timesheet-calendar .fc-event.project .fc-title {
    background: transparent url('../images/icons/project_ticket_white.png') left top no-repeat;
}

html.dark .fc-event.problem .fc-event-title,
html.dark #timesheet-calendar .fc-event.problem .fc-title {
    background: transparent url('../images/icons/problem_ticket_white.png') left top no-repeat;
}

html.dark .fc-event.change-request .fc-event-title,
html.dark #timesheet-calendar .fc-event.change-request .fc-title {
    background: transparent url('../images/icons/change_request_ticket_white.png') left top no-repeat;
}

html.dark .fc-event.task .fc-event-title,
html.dark #timesheet-calendar .fc-event.task .fc-title {
    background: transparent url('../images/icons/task_ticket_white.png') left top no-repeat;
}

html.dark [class^="icon-"],
html.dark [class*=" icon-"] { background-image: url(../bootstrap/img/glyphicons-halflings-white.png); }

html.dark a.cke_dialog_close_button { background-image: url(../ckeditor/skins/moono-dark/images/close.png); }

html.dark #cboxMiddleLeft, html.dark #cboxBottomLeft, html.dark #cboxBottomRight,
html.dark #cboxMiddleRight, html.dark #cboxTopRight, html.dark #cboxTopLeft,
html.dark #cboxClose { background-image: url(../images/controls-dark.png); }

html.dark #cboxTopCenter,
html.dark #cboxBottomCenter { background-image: url(../images/border-dark.png); }

html.dark div.bigstars div.rateit-range { background-image: url(../rateit-custom/star-black32.png) }

html.dark .ui-widget-content,
html.dark .select2-container .select2-choice,
html.dark .select2-container .select2-choice .select2-arrow,
html.dark .jsPanel,
html.dark .reset-password-tooltip .ui-tooltip-icon.ui-state-hover { background: none !important; }

html.dark .k-hover,
html.dark .k-hover:hover,
html.dark .select2-choices, html.dark .select2-container-multi .select2-choices .select2-search-choice { background-image: none !important; }

html.dark .select2-choices, html.dark .select2-container-multi .select2-choices .select2-search-choice { box-shadow: none !important; }

html.dark .ui-dialog.ui-draggable,
html.dark .reset-password-tooltip .ui-tooltip-icon .ui-icon,
html.dark .mce-btn:hover { background-color: var(--background-color-darker) !important; }

html.dark .google-visualization-tooltip-item span { color: var(--foreground-color) !important; }

html.dark .management-menu at-svg-img svg .st1,
html.dark .my-options-menu at-svg-img svg .st1,
html.dark .cmdb-menu at-svg-img svg .st1 { fill: var(--foreground-color); }

html.dark .modal-footer .btn.button-col1 {
    background: #89A600;
    border: 1px solid #6d820d;
}

html.dark .button-gray:hover, html.dark .button-col2:hover, html.dark .btn-group.open .btn.dropdown-toggle.button-col2, html.dark .button-col3:hover, html.dark .fc .fc-button-primary:hover {
    border-color: #ff9334 !important;
}

html.dark .button-col3.disabled:hover {
    border-color: var(--border-color) !important;
}

html.dark .button-green {
    background: #89A600;
    border: 1px solid #6d820d;
}

html.dark #MainTabs table.k-selectable tr td.SLStatus-3,
html.dark #MainTabs span.priority1-image { background-color: #ba0000 !important; }

html.dark .banked-hours-dropdown.expired, html.dark .banked-hours-dropdown option.expired { color: #ef3232 !important; }

html.dark svg.indicator g ellipse.SLStatus-3 { fill: #ba0000; }

html.dark .mce-btn i { text-shadow: 1px 1px #000; }

html.dark .warning-message,
html.dark .errorMessage { color: #ff4747; }

html.dark .login-ctrl .form-content input:disabled, html.dark .login-ctrl .form-content select:disabled {
    background-color: var(--background-color-dark) !important;
    border-color: var(--border-color) !important;
}

html.dark .login-ctrl .form-content input, html.dark .login-ctrl .form-content select, html.dark .login-ctrl .login-forgotPassContent input { transition: none !important }

html.dark .login-ctrl .form-content input:focus { outline: none; }

html.dark .CIRelationsCtrl .nodeText { fill: var(--foreground-color); }

html.dark .lockedMessage,html.dark .readOnlyMessage { background-color: #858241; }

html.dark .lockedMessage span,html.dark .readOnlyMessage span { color: #ffffff; }

html.dark .collapsibleSectionHeader.expanded,
html.dark .widgetHeader .expanded { background-image: url(../images/collapse-white.png); }

html.dark .collapsibleSectionHeader.collapsed,
html.dark .widgetHeader .collapsed { background-image: url(../images/expand-white.png); }

html.dark div.manager-form h4, html.dark .noCollapsibleSectionHeader, html.dark .collapsibleSectionHeader,
html.dark #MainTabs .ui-tabs-nav li.ui-state-active,
html.dark div.autoAssign span,
html.dark .widgetHeader, html.dark .handle,
html.dark #ticket-kanban .ticket-box .sequencenumber,
html.dark #ticket-kanban .ticket-box .footer,
html.dark #ticket-kanban .title { font-weight: normal !important; }

html.dark div.highlighted { outline: none !important; }

html.dark #ticket-kanban .ticket-box { background-color: var(--background-color-dark); }

html.dark .chat-form .chat-messages .chat-message-text { background-color: #ca7111; }

html.dark .chat-form .chat-messages .chat-message .chat-message-text .chat-bubble-start { background-color: #ca7111; }

html.dark .managerFormHeader .k-datetimepicker .k-select { height: 19px; }

html.dark .pagination ul > li:not(.active) > a,
html.dark .pagination ul > li:not(.active) > span {
    background-color: var(--background-color-darker);
    border-color: var(--border-color);
}

html.dark .pagination ul > .active > a,
html.dark .pagination ul > .active > span { color: #333; }

html.dark #calendar .fc-event-time,
html.dark #calendarResource .fc-event-main {
    color: #ffffff;
}

html.dark .calendar .fc-popover-title {
    color: #333;
}

@media (max-width: 1100px) {
    html .dark .website-logo { background-color: var(--background-color-dark); }
}

html.dark .attachmentsPreview {
    border-left: 1px solid var(--border-color);
}

html.dark div.itemTemplate.inactive {
    background-color: var(--background-color-dark);
}

html.dark .maintenanceManagerForm .results .not-deletable-items {
    color: #e8e8a2;
}

html.dark .msg-status-not-updatable {
    color: #333;
}

/* Selected row */
html.dark tr.k-selected > td { 
    background-color: #62686a !important;
    color: white !important;
}

/* Fix k-selected class that stick on Kendo UI grids cells */
/* Odd rows */
html.dark tr.k-alt td.k-selected {
    background-color: var(--background-color-dark) !important;
}
html.dark tr.k-alt.k-selected td.k-selected {
    background-color: var(--border-color) !important;
}

/* Even rows */
html.dark tr:not(.k-alt) td.k-selected {
    background-color: var(--background-color-darker) !important;
}
html.dark tr.k-selected:not(.k-alt) td.k-selected {
    background-color: var(--border-color) !important;
}

html.dark .k-grid tr:hover {
    background-color: #4f5455 !important;
}

html.dark .ticket-grid .k-grid-content tr.k-alt:not(:hover) > td.k-selected { background: var(--background-color-darker) !important; }

html.dark .ticket-grid .k-grid-content tr:not(.k-alt):not(:hover) > td.k-selected { background: var(--background-color-dark) !important; }

html.dark .ticket-grid .k-grid-content tr:hover,
html.dark .ticket-grid .k-grid-content tr:hover > td.k-selected { 
    background-color: #4f5455 !important; 
}

html.dark .k-datepicker .k-button,
html.dark .k-timepicker .k-button,
html.dark .k-datetimepicker .k-button {
    background-color: var(--background-color-darker);
    border-color: var(--border-color);
}

html.dark .k-datepicker .k-button .k-icon svg,
html.dark .k-timepicker .k-button .k-icon svg,
html.dark .k-datetimepicker .k-button .k-icon svg {
    color: var(--foreground-color);
}

html.dark .k-calendar {
    background-color: var(--background-color-darker);
}

html.dark .k-calendar .k-header,
html.dark .k-calendar .k-calendar-thead .k-calendar-th {
    background-color: var(--background-color-darker);
    color: var(--foreground-color);
}

html.dark .k-calendar .k-calendar-td.k-hover:not(.k-selected) .k-link {
    background-color: var(--background-color-dark);
    color: var(--foreground-color);
}

html.dark .k-upload {
    background-color: transparent;
}

html.dark .k-upload .k-dropzone {
    background-color: var(--background-color-darker);
}

html.dark .k-table-td,
html.dark .k-grid .k-table-td:last-child,
html.dark .k-grid .k-table-td:last-child,
html.dark .k-grid .k-table-row:last-child > .k-table-td {
    border-color: var(--border-color) !important;
}

html.dark .k-pager-sizes .k-dropdownlist.k-hover,
html.dark .k-pager-sizes .k-dropdownlist.k-hover:hover {
    color: var(--foreground-color) !important;
}

html.dark .chat-form .k-upload-button-wrap .k-button.k-upload-button,
html.dark .chat-form .k-upload-button-wrap:hover .k-button.k-upload-button,
html.dark .chat-form .k-upload-button-wrap:hover:not(.k-disabled) .k-button.k-upload-button {
    background-color: transparent !important;
}

html.dark .ui-dialog-titlebar-close .ui-icon {
    background-image: url(images/ui-icons_777777_256x240.png) !important;
}

html.dark .k-grid-header .k-grid-header-menu:hover,
html.dark .k-column-menu.k-column-menu-popup .k-columnmenu-item:hover {
    color: white;
}

html.dark .k-column-menu.k-column-menu-popup .k-columnmenu-item-wrapper {
    border-color: var(--foreground-color);
}

html.dark .k-column-menu.k-grid-columnmenu-popup .k-column-list-item .k-checkbox:not(:checked) {
    background-color: var(--foreground-color);
}

html.dark .itemBox.impact-is-active div span[at-label] {
    color: inherit;
}

html.dark.appMode #MainTabs table.k-selectable tr td span.task_flag_blocked-image {
    background: transparent url(../images/task_blocked_dark.png) center center no-repeat;
    background-size: 19px 18px;
}

@media print {
    .layout_header,
    .lockedMessage,
    .readOnlyMessage,
    .ticketFooterSection,
    .ticketHeaderRight,
    .ticketWorkflows,
    .ui-tabs-nav {
        display: none;
    }

    .tickets-grid-toolbar { display: none !important; }

    .ticketHeaderCurrentStatus { display: block !important; }

    .taskHeaderCurrentStatus { display: inline !important; }

    @page {
        margin: 0.5cm;
    }

    .ticketHeader {
        padding-bottom: 5px;
        padding-left: 0;
        position: static;
    }
}

/* Boutons CSS3 par Alex Whinfield  */
.buttonSmall {
    -khtml-border-radius: 2px !important;
    -moz-border-radius: 2px !important;
    -moz-box-sizing: border-box !important;
    -webkit-border-radius: 2px !important;
    -webkit-box-sizing: border-box !important;
    border-radius: 2px !important;
    box-sizing: border-box !important;
    cursor: pointer;
    display: inline-block;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 10px;
    font-weight: bold;
    line-height: 16px;
    outline: none !important;
    padding: 4px 8px;
    position: relative;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
}

.button {
    -khtml-border-radius: 2px !important;
    -moz-border-radius: 2px !important;
    -moz-box-sizing: border-box !important;
    -webkit-border-radius: 2px !important;
    -webkit-box-sizing: border-box !important;
    border-radius: 2px !important;
    box-sizing: border-box !important;
    cursor: pointer;
    display: inline-block;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 12px;
    font-weight: bold;
    line-height: 16px;
    outline: none !important;
    padding: 6px 12px;
    position: relative;
    text-align: center;
    text-decoration: none;
}

.buttonLarge {
    -moz-box-sizing: border-box !important;
    -webkit-box-sizing: border-box !important;
    box-sizing: border-box !important;
    cursor: pointer;
    display: inline-block;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 14px;
    font-weight: bold;
    line-height: 16px;
    outline: none !important;
    padding: 6px 16px;
    position: relative;
    text-align: center;
    text-decoration: none;
}

.button:hover { text-decoration: none; }

button::-moz-focus-inner, input::-moz-focus-inner { border: 0; }

.button span {
    display: inline-block;
    float: left;
    height: 16px;
    margin-right: 5px;
    position: relative;
    width: 16px;
}

button.disabled, button.disabled:hover, .btn[disabled], .btn[disabled]:hover,
.k-disabled .k-button.k-upload-button {
    background: #DDD;
    border: 1px solid #DDD;
    color: #777;
    cursor: default;
    opacity: 1.0;
}

html.dark .k-disabled .k-button.k-upload-button {
    border: 1px solid #DDD;
}

.btn[disabled] .caret { border-top-color: #555; }

.button-black, .button-col3, .k-button.k-upload-button, .calendar .fc-button-primary {
    background: #FFF;
    border: 1px solid #AAA;
    color: #333;
}

.button-black:hover, .button-col3:hover, .fc .fc-button-primary:hover {
    background: #DDD;
    border: 1px solid #888;
}
.fc .fc-button-primary:hover {
    color: #333;
}

.button-col3 .caret-white { border-top-color: #333; }

.button-col3:active, .button-col3:focus { background: none; }

.fc .fc-button-primary:not(:disabled):active, .fc .fc-button-primary:not(:disabled).fc-button-active {
    background: none;
    color: #333;
}

.fc .fc-button-primary:focus,
.fc .fc-button-primary:not(:disabled):active:focus,
.fc .fc-button-primary:not(:disabled).fc-button-active:focus {
    box-shadow: none;
}

.k-button.k-upload-button {
    background: none !important;
    border: 1px solid #AAA;
    border-radius: 2px;
    box-shadow: 0 2px rgba(0, 0, 0, .07) !important;
    cursor: pointer;
    font-size: 1em;
    font-weight: bold;
    padding: 4px 15px;
    text-transform: none;
}

.k-button.k-upload-button input { cursor: pointer; }
/* Make cursor: pointer work */
.k-button.k-upload-button input { font-size: 0px !important; }

.k-disabled .k-button.k-upload-button {
    background: #DDD !important;
    box-shadow: none !important;
}

.k-upload.k-disabled {
    font-size: var(--kendo-font-size, inherit);
}

.k-upload.k-disabled .k-button {
    border: none;
}

.k-upload-button-wrap:hover:not(.k-disabled) .k-button.k-upload-button {
    background: #DDD !important;
    border: 1px solid #888;
}

.k-widget.k-upload.k-header,
.k-upload-empty,
.k-upload-button {
	display: flex;
	width: max-content;
}

html.dark .k-button.k-upload-button {
	color: white;
}

html.dark .k-upload:hover:not(.k-disabled) .k-button.k-upload-button {
	background-color: var(--background-color-dark) !important;
	border-color: #ff9334 !important;
}

html.dark .k-upload.k-disabled .k-button.k-upload-button {
	background-color: var(--background-color-dark) !important;
	border-color: var(--border-color);
	color: #777;
	opacity: 1;
}

.button-gray, .button-col2, .button-gray:focus, .button-col2:focus {
    background: #555;
    border: 1px solid #333;
    color: #FFF;
}

.button-gray:hover, .button-col2:hover, .btn-group.open .btn.dropdown-toggle.button-col2 {
    background: #333;
    border: 1px solid #111;
    color: #FFF;
}

.button-orange {
    background-color: #ff9334;
    border: 1px solid #ca7111;
    color: #FFF;
}

.button-orange:hover { background-color: #d57d29; }

.button-orange:active, .button-orange:focus {
    background-color: #ff9334 !important;
    border: 1px solid #ca7111;
}

.button-red, .button-col4 {
    background-color: #C44747;
    border: 1px solid #5d2424;
    color: #FFF;
}

.button-red:hover, .button-col4:hover {
    background-color: #b13b3b;
    border: 1px solid #5d2424;
    color: #FFF;
}

.button-yellow, .button-col6 {
    background-color: #FFEB00;
    border: 1px solid #5d2424;
    color: #333;
}

.button-yellow:hover, .button-col6:hover {
    background-color: #ead912;
    border: 1px solid #5d2424;
    color: #333;
}

.button-blue {
    background: #0095cd;
    border: 1px solid #0095cd;
    color: #fff;
}

.button-blue:hover {
    background: #007ead;
    border: 1px solid #007ead;
    color: #fff;
}

.button-green {
    background: #89A600;
    border: 1px solid #6d820d;
    color: #FFF;
}

.button-col1 {
    background: #89A600;
    border: 1px solid #6d820d;
    color: #FFF;
    padding: 6px 40px;
}

    .button-green:hover, .button-col1:focus, .button-col1:active, .button-col1:hover,
    .btn-group.open .btn.dropdown-toggle.button-col1 {
        background: #7a9400;
        border: 1px solid #576902;
        color: #FFF;
    }

.create-button-widget .button-col1:hover,
.create-button-widget .btn-group.open .btn.dropdown-toggle.button-col1 {
    background: #768e04;
    border: 1px solid #768e04;
}


.button-col5 {
    background-color: #ff9334;
    border: 1px solid #ca7111;
    color: white;
    padding: 6px 40px;
}

.button-col5:hover {
    background-color: #e8852d;
    color: white;
}



.dialog-button-yes {
    background: #89A600;
    border: 1px solid #89A600;
    color: #fff;
}

.dialog-button-yes:hover {
    background: #799600;
    border: 1px solid #799600;
}

.LayoutContextBtn span {
    display: inline-block;
    padding-left: 2px;
}

.peopleEvent.eventEnabled:hover, .emailEvent.eventEnabled:hover, .phoneEvent.eventEnabled:hover, .otherEvent.eventEnabled:hover { cursor: pointer; }

.peopleEvent.eventEnabled { background: url(../images/icons/originpeople.png) no-repeat; }

.peopleEvent.eventSelected, .peopleEvent.eventEnabled:hover { background: url(../images/icons/originpeople_selected.png) no-repeat; }

.peopleEvent.eventDisabled, .peopleEvent.eventDisabled:hover { background: url(../images/icons/originpeople.png) no-repeat; }

.emailEvent.eventEnabled { background: url(../images/icons/originemail.png) no-repeat; }

.emailEvent.eventSelected, .emailEvent.eventEnabled:hover { background: url(../images/icons/originemail_selected.png) no-repeat; }

.emailEvent.eventDisabled, .emailEvent.eventDisabled:hover { background: url(../images/icons/originemail.png) no-repeat; }

.otherEvent.eventEnabled { background: url(../images/icons/originother.png) no-repeat; }

.otherEvent.eventSelected, .otherEvent.eventEnabled:hover { background: url(../images/icons/originother_selected.png) no-repeat; }

.otherEvent.eventDisabled, .otherEvent.eventDisabled:hover { background: url(../images/icons/originother.png) no-repeat; }

.phoneEvent.eventEnabled { background: url(../images/icons/originphone.png) no-repeat; }

.phoneEvent.eventSelected, .phoneEvent.eventEnabled:hover { background: url(../images/icons/originphone_selected.png) no-repeat; }

.phoneEvent.eventDisabled, .phoneEvent.eventDisabled:hover { background: url(../images/icons/originphone.png) no-repeat; }

.btn {
    -khtml-border-radius: 2px !important;
    -moz-border-radius: 2px !important;
    -webkit-border-radius: 2px !important;
    -webkit-text-shadow: none !important;
    background-image: none;
    border-radius: 2px !important;
    text-shadow: none !important;
}

.btn-danger { background: #DA4F49 !important; }

.btn-danger:hover { background: #BD362F !important; }

.dropdown-toggle.disabled .caret-white { border-top-color: #c0c0c0; }

.btn-spacer .btn { margin-right: 3px !important; }

.button, .btn { box-shadow: 0 2px rgba(0, 0, 0, .07) !important; }

.button.disabled, .btn.disabled { box-shadow: none !important; }

.svg-container {
    /*Thierry Koblentz's padding hack to make the svg responsive on IE9-11 as well*/
    height: 0;
    margin-left: 2%;
    /*prevents the tree from overflowing the viewport*/
    overflow: hidden;
    padding-top: 48%; /* =(svg height / svg width) * width-value; */
    position: relative;
    width: 96%;
}

svg {
    height: 96%;
    left: 0;
    overflow: hidden; /*IE fix*/
    /*part of the padding hack*/
    position: absolute;
    top: 0;
    width: 100%;
}

.overlay { background-color: #ffffff; }

.node { cursor: pointer; }

.node circle {
    fill: #fff;
    stroke: #f29a3c;
    stroke-width: 1.5px;
}

.node text {
    font-family: sans-serif;
    font-size: 10px;
}

.link {
    fill: none;
    stroke: #ccc;
    stroke-width: 1.5px;
}

/*Drag & Drop*/

.templink {
    fill: none;
    stroke: red;
    stroke-width: 3px;
}

.ghostCircle.show { display: block; }

.ghostCircle, .activeDrag .ghostCircle { display: none; }
/*
    Colorbox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper {
    -webkit-transform: translate3d(0, 0, 0);
    left: 0;
    overflow: hidden;
    position: absolute;
    top: 0;
    z-index: 9999;
}

#cboxWrapper { max-width: none; }

#cboxOverlay {
    height: 100%;
    position: fixed;
    width: 100%;
}

#cboxMiddleLeft, #cboxBottomLeft { clear: left; }

#cboxContent { position: relative; }

#cboxLoadedContent {
    -webkit-overflow-scrolling: touch;
    overflow: auto;
}

#cboxTitle { margin: 0; }

#cboxLoadingOverlay, #cboxLoadingGraphic {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow { cursor: pointer; }

.cboxPhoto {
    -ms-interpolation-mode: bicubic;
    border: 0;
    display: block;
    float: left;
    margin: auto;
    max-width: none;
}

.cboxIframe {
    border: 0;
    display: block;
    height: 100%;
    margin: 0;
    padding: 0;
    width: 100%;
}

#colorbox, #cboxContent, #cboxLoadedContent {
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
}

/* 
    User Style:
    Change the following styles to modify the appearance of Colorbox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/

#cboxOverlay {
    background: url(../images/overlay.png) repeat 0 0;
    filter: alpha(opacity = 90);
    opacity: 0.9;
}

#colorbox { outline: 0; }

#cboxTopLeft {
    background: url(../images/controls.png) no-repeat -101px 0;
    height: 21px;
    width: 21px;
}

#cboxTopRight {
    background: url(../images/controls.png) no-repeat -130px 0;
    height: 21px;
    width: 21px;
}

#cboxBottomLeft {
    background: url(../images/controls.png) no-repeat -101px -29px;
    height: 21px;
    width: 21px;
}

#cboxBottomRight {
    background: url(../images/controls.png) no-repeat -130px -29px;
    height: 21px;
    width: 21px;
}

#cboxMiddleLeft {
    background: url(../images/controls.png) left top repeat-y;
    width: 21px;
}

#cboxMiddleRight {
    background: url(../images/controls.png) right top repeat-y;
    width: 21px;
}

#cboxTopCenter {
    background: url(../images/border.png) 0 0 repeat-x;
    height: 21px;
}

#cboxBottomCenter {
    background: url(../images/border.png) 0 -29px repeat-x;
    height: 21px;
}

#cboxContent {
    background: #fff;
    overflow: hidden;
}

.cboxIframe { background: #fff; }

#cboxError {
    border: 1px solid #ccc;
    padding: 50px;
}

#cboxLoadedContent { margin-bottom: 28px; }

#cboxTitle {
    bottom: 4px;
    color: #949494;
    left: 0;
    position: absolute;
    text-align: center;
    width: 100%;
}

#cboxCurrent {
    bottom: 4px;
    color: #949494;
    left: 58px;
    position: absolute;
}

#cboxLoadingOverlay { background: url(../images/loading_background.png) no-repeat center center; }

#cboxLoadingGraphic { background: url(../images/loading.gif) no-repeat center center; }

/* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */

#cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {
    background: none;
    border: 0;
    margin: 0;
    overflow: visible;
    padding: 0;
    width: auto;
}

/* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */

#cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active { outline: 0; }

#cboxSlideshow {
    bottom: 4px;
    color: #0092ef;
    position: absolute;
    right: 30px;
}

#cboxPrevious {
    background: url(../images/controls.png) no-repeat -75px 0;
    bottom: 0;
    height: 25px;
    left: 0;
    position: absolute;
    text-indent: -9999px;
    width: 25px;
}

#cboxPrevious:hover { background-position: -75px -25px; }

#cboxNext {
    background: url(../images/controls.png) no-repeat -50px 0;
    bottom: 0;
    height: 25px;
    left: 27px;
    position: absolute;
    text-indent: -9999px;
    width: 25px;
}

#cboxNext:hover { background-position: -50px -25px; }

#cboxClose {
    background: url(../images/controls.png) no-repeat -25px 0;
    bottom: 0;
    height: 25px;
    position: absolute;
    right: 0;
    text-indent: -9999px;
    width: 25px;
}

#cboxClose:hover { background-position: -25px -25px; }

/*
  The following fixes a problem where IE7 and IE8 replace a PNG's alpha transparency with a black fill
  when an alpha filter (opacity change) is set on the element or ancestor element.  This style is not applied to or needed in IE9.
  See: http://jacklmoore.com/notes/ie-transparency-problems/
*/

.cboxIE #cboxTopLeft,
.cboxIE #cboxTopCenter,
.cboxIE #cboxTopRight,
.cboxIE #cboxBottomLeft,
.cboxIE #cboxBottomCenter,
.cboxIE #cboxBottomRight,
.cboxIE #cboxMiddleLeft,
.cboxIE #cboxMiddleRight { filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF, endColorstr=#00FFFFFF); }
@charset "UTF-8";/*!
Animate.css - http://daneden.me/animate
Licensed under the MIT license - http://opensource.org/licenses/MIT

Copyright (c) 2015 Daniel Eden
*/.animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.animated.infinite{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.animated.hinge{-webkit-animation-duration:2s;animation-duration:2s}.animated.bounceIn,.animated.bounceOut,.animated.flipOutX,.animated.flipOutY{-webkit-animation-duration:.75s;animation-duration:.75s}@-webkit-keyframes bounce{20%,53%,80%,from,to{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1);-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}40%,43%{-webkit-animation-timing-function:cubic-bezier(0.755,.050,.855,.060);animation-timing-function:cubic-bezier(0.755,.050,.855,.060);-webkit-transform:translate3d(0,-30px,0);transform:translate3d(0,-30px,0)}70%{-webkit-animation-timing-function:cubic-bezier(0.755,.050,.855,.060);animation-timing-function:cubic-bezier(0.755,.050,.855,.060);-webkit-transform:translate3d(0,-15px,0);transform:translate3d(0,-15px,0)}90%{-webkit-transform:translate3d(0,-4px,0);transform:translate3d(0,-4px,0)}}@keyframes bounce{20%,53%,80%,from,to{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1);-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}40%,43%{-webkit-animation-timing-function:cubic-bezier(0.755,.050,.855,.060);animation-timing-function:cubic-bezier(0.755,.050,.855,.060);-webkit-transform:translate3d(0,-30px,0);transform:translate3d(0,-30px,0)}70%{-webkit-animation-timing-function:cubic-bezier(0.755,.050,.855,.060);animation-timing-function:cubic-bezier(0.755,.050,.855,.060);-webkit-transform:translate3d(0,-15px,0);transform:translate3d(0,-15px,0)}90%{-webkit-transform:translate3d(0,-4px,0);transform:translate3d(0,-4px,0)}}.bounce{-webkit-animation-name:bounce;animation-name:bounce;-webkit-transform-origin:center bottom;transform-origin:center bottom}@-webkit-keyframes flash{50%,from,to{opacity:1}25%,75%{opacity:0}}@keyframes flash{50%,from,to{opacity:1}25%,75%{opacity:0}}.flash{-webkit-animation-name:flash;animation-name:flash}@-webkit-keyframes pulse{from{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}50%{-webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}to{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes pulse{from{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}50%{-webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}to{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}.pulse{-webkit-animation-name:pulse;animation-name:pulse}@-webkit-keyframes rubberBand{from{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(0.75,1.25,1);transform:scale3d(0.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}to{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes rubberBand{from{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(0.75,1.25,1);transform:scale3d(0.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}to{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}.rubberBand{-webkit-animation-name:rubberBand;animation-name:rubberBand}@-webkit-keyframes shake{from,to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}20%,40%,60%,80%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}}@keyframes shake{from,to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}20%,40%,60%,80%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}}.shake{-webkit-animation-name:shake;animation-name:shake}@-webkit-keyframes swing{20%{-webkit-transform:rotate3d(0,0,1,15deg);transform:rotate3d(0,0,1,15deg)}40%{-webkit-transform:rotate3d(0,0,1,-10deg);transform:rotate3d(0,0,1,-10deg)}60%{-webkit-transform:rotate3d(0,0,1,5deg);transform:rotate3d(0,0,1,5deg)}80%{-webkit-transform:rotate3d(0,0,1,-5deg);transform:rotate3d(0,0,1,-5deg)}to{-webkit-transform:rotate3d(0,0,1,0deg);transform:rotate3d(0,0,1,0deg)}}@keyframes swing{20%{-webkit-transform:rotate3d(0,0,1,15deg);transform:rotate3d(0,0,1,15deg)}40%{-webkit-transform:rotate3d(0,0,1,-10deg);transform:rotate3d(0,0,1,-10deg)}60%{-webkit-transform:rotate3d(0,0,1,5deg);transform:rotate3d(0,0,1,5deg)}80%{-webkit-transform:rotate3d(0,0,1,-5deg);transform:rotate3d(0,0,1,-5deg)}to{-webkit-transform:rotate3d(0,0,1,0deg);transform:rotate3d(0,0,1,0deg)}}.swing{-webkit-transform-origin:top center;transform-origin:top center;-webkit-animation-name:swing;animation-name:swing}@-webkit-keyframes tada{from{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}10%,20%{-webkit-transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg);transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg)}30%,50%,70%,90%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg);transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg)}40%,60%,80%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg);transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg)}to{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes tada{from{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}10%,20%{-webkit-transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg);transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg)}30%,50%,70%,90%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg);transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg)}40%,60%,80%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg);transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg)}to{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}.tada{-webkit-animation-name:tada;animation-name:tada}@-webkit-keyframes wobble{from{-webkit-transform:none;transform:none}15%{-webkit-transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg);transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg)}30%{-webkit-transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg);transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg)}45%{-webkit-transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg);transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg)}60%{-webkit-transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg);transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg)}75%{-webkit-transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg);transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg)}to{-webkit-transform:none;transform:none}}@keyframes wobble{from{-webkit-transform:none;transform:none}15%{-webkit-transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg);transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg)}30%{-webkit-transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg);transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg)}45%{-webkit-transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg);transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg)}60%{-webkit-transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg);transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg)}75%{-webkit-transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg);transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg)}to{-webkit-transform:none;transform:none}}.wobble{-webkit-animation-name:wobble;animation-name:wobble}@-webkit-keyframes jello{11.1%,from,to{-webkit-transform:none;transform:none}22.2%{-webkit-transform:skewX(-12.5deg) skewY(-12.5deg);transform:skewX(-12.5deg) skewY(-12.5deg)}33.3%{-webkit-transform:skewX(6.25deg) skewY(6.25deg);transform:skewX(6.25deg) skewY(6.25deg)}44.4%{-webkit-transform:skewX(-3.125deg) skewY(-3.125deg);transform:skewX(-3.125deg) skewY(-3.125deg)}55.5%{-webkit-transform:skewX(1.5625deg) skewY(1.5625deg);transform:skewX(1.5625deg) skewY(1.5625deg)}66.6%{-webkit-transform:skewX(-.78125deg) skewY(-.78125deg);transform:skewX(-.78125deg) skewY(-.78125deg)}77.7%{-webkit-transform:skewX(0.390625deg) skewY(0.390625deg);transform:skewX(0.390625deg) skewY(0.390625deg)}88.8%{-webkit-transform:skewX(-.1953125deg) skewY(-.1953125deg);transform:skewX(-.1953125deg) skewY(-.1953125deg)}}@keyframes jello{11.1%,from,to{-webkit-transform:none;transform:none}22.2%{-webkit-transform:skewX(-12.5deg) skewY(-12.5deg);transform:skewX(-12.5deg) skewY(-12.5deg)}33.3%{-webkit-transform:skewX(6.25deg) skewY(6.25deg);transform:skewX(6.25deg) skewY(6.25deg)}44.4%{-webkit-transform:skewX(-3.125deg) skewY(-3.125deg);transform:skewX(-3.125deg) skewY(-3.125deg)}55.5%{-webkit-transform:skewX(1.5625deg) skewY(1.5625deg);transform:skewX(1.5625deg) skewY(1.5625deg)}66.6%{-webkit-transform:skewX(-.78125deg) skewY(-.78125deg);transform:skewX(-.78125deg) skewY(-.78125deg)}77.7%{-webkit-transform:skewX(0.390625deg) skewY(0.390625deg);transform:skewX(0.390625deg) skewY(0.390625deg)}88.8%{-webkit-transform:skewX(-.1953125deg) skewY(-.1953125deg);transform:skewX(-.1953125deg) skewY(-.1953125deg)}}.jello{-webkit-animation-name:jello;animation-name:jello;-webkit-transform-origin:center;transform-origin:center}@-webkit-keyframes bounceIn{20%,40%,60%,80%,from,to{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}20%{-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}40%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}60%{opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03);transform:scale3d(1.03,1.03,1.03)}80%{-webkit-transform:scale3d(.97,.97,.97);transform:scale3d(.97,.97,.97)}to{opacity:1;-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes bounceIn{20%,40%,60%,80%,from,to{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}20%{-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}40%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}60%{opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03);transform:scale3d(1.03,1.03,1.03)}80%{-webkit-transform:scale3d(.97,.97,.97);transform:scale3d(.97,.97,.97)}to{opacity:1;-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}.bounceIn{-webkit-animation-name:bounceIn;animation-name:bounceIn}@-webkit-keyframes bounceInDown{60%,75%,90%,from,to{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,-3000px,0);transform:translate3d(0,-3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,25px,0);transform:translate3d(0,25px,0)}75%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}90%{-webkit-transform:translate3d(0,5px,0);transform:translate3d(0,5px,0)}to{-webkit-transform:none;transform:none}}@keyframes bounceInDown{60%,75%,90%,from,to{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,-3000px,0);transform:translate3d(0,-3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,25px,0);transform:translate3d(0,25px,0)}75%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}90%{-webkit-transform:translate3d(0,5px,0);transform:translate3d(0,5px,0)}to{-webkit-transform:none;transform:none}}.bounceInDown{-webkit-animation-name:bounceInDown;animation-name:bounceInDown}@-webkit-keyframes bounceInLeft{60%,75%,90%,from,to{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(-3000px,0,0);transform:translate3d(-3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(25px,0,0);transform:translate3d(25px,0,0)}75%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}90%{-webkit-transform:translate3d(5px,0,0);transform:translate3d(5px,0,0)}to{-webkit-transform:none;transform:none}}@keyframes bounceInLeft{60%,75%,90%,from,to{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(-3000px,0,0);transform:translate3d(-3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(25px,0,0);transform:translate3d(25px,0,0)}75%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}90%{-webkit-transform:translate3d(5px,0,0);transform:translate3d(5px,0,0)}to{-webkit-transform:none;transform:none}}.bounceInLeft{-webkit-animation-name:bounceInLeft;animation-name:bounceInLeft}@-webkit-keyframes bounceInRight{60%,75%,90%,from,to{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}from{opacity:0;-webkit-transform:translate3d(3000px,0,0);transform:translate3d(3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(-25px,0,0);transform:translate3d(-25px,0,0)}75%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}90%{-webkit-transform:translate3d(-5px,0,0);transform:translate3d(-5px,0,0)}to{-webkit-transform:none;transform:none}}@keyframes bounceInRight{60%,75%,90%,from,to{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}from{opacity:0;-webkit-transform:translate3d(3000px,0,0);transform:translate3d(3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(-25px,0,0);transform:translate3d(-25px,0,0)}75%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}90%{-webkit-transform:translate3d(-5px,0,0);transform:translate3d(-5px,0,0)}to{-webkit-transform:none;transform:none}}.bounceInRight{-webkit-animation-name:bounceInRight;animation-name:bounceInRight}@-webkit-keyframes bounceInUp{60%,75%,90%,from,to{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}from{opacity:0;-webkit-transform:translate3d(0,3000px,0);transform:translate3d(0,3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}75%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}90%{-webkit-transform:translate3d(0,-5px,0);transform:translate3d(0,-5px,0)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes bounceInUp{60%,75%,90%,from,to{-webkit-animation-timing-function:cubic-bezier(0.215,.61,.355,1);animation-timing-function:cubic-bezier(0.215,.61,.355,1)}from{opacity:0;-webkit-transform:translate3d(0,3000px,0);transform:translate3d(0,3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}75%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}90%{-webkit-transform:translate3d(0,-5px,0);transform:translate3d(0,-5px,0)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.bounceInUp{-webkit-animation-name:bounceInUp;animation-name:bounceInUp}@-webkit-keyframes bounceOut{20%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}50%,55%{opacity:1;-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}to{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}}@keyframes bounceOut{20%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}50%,55%{opacity:1;-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}to{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}}.bounceOut{-webkit-animation-name:bounceOut;animation-name:bounceOut}@-webkit-keyframes bounceOutDown{20%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}40%,45%{opacity:1;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}to{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}@keyframes bounceOutDown{20%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}40%,45%{opacity:1;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}to{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}.bounceOutDown{-webkit-animation-name:bounceOutDown;animation-name:bounceOutDown}@-webkit-keyframes bounceOutLeft{20%{opacity:1;-webkit-transform:translate3d(20px,0,0);transform:translate3d(20px,0,0)}to{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}@keyframes bounceOutLeft{20%{opacity:1;-webkit-transform:translate3d(20px,0,0);transform:translate3d(20px,0,0)}to{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}.bounceOutLeft{-webkit-animation-name:bounceOutLeft;animation-name:bounceOutLeft}@-webkit-keyframes bounceOutRight{20%{opacity:1;-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}to{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}@keyframes bounceOutRight{20%{opacity:1;-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}to{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}.bounceOutRight{-webkit-animation-name:bounceOutRight;animation-name:bounceOutRight}@-webkit-keyframes bounceOutUp{20%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}40%,45%{opacity:1;-webkit-transform:translate3d(0,20px,0);transform:translate3d(0,20px,0)}to{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}@keyframes bounceOutUp{20%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}40%,45%{opacity:1;-webkit-transform:translate3d(0,20px,0);transform:translate3d(0,20px,0)}to{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}.bounceOutUp{-webkit-animation-name:bounceOutUp;animation-name:bounceOutUp}@-webkit-keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes fadeIn{from{opacity:0}to{opacity:1}}.fadeIn{-webkit-animation-name:fadeIn;animation-name:fadeIn}@-webkit-keyframes fadeInDown{from{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}to{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInDown{from{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}to{opacity:1;-webkit-transform:none;transform:none}}.fadeInDown{-webkit-animation-name:fadeInDown;animation-name:fadeInDown}@-webkit-keyframes fadeInDownBig{from{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}to{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInDownBig{from{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}to{opacity:1;-webkit-transform:none;transform:none}}.fadeInDownBig{-webkit-animation-name:fadeInDownBig;animation-name:fadeInDownBig}@-webkit-keyframes fadeInLeft{from{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}to{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInLeft{from{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}to{opacity:1;-webkit-transform:none;transform:none}}.fadeInLeft{-webkit-animation-name:fadeInLeft;animation-name:fadeInLeft}@-webkit-keyframes fadeInLeftBig{from{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}to{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInLeftBig{from{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}to{opacity:1;-webkit-transform:none;transform:none}}.fadeInLeftBig{-webkit-animation-name:fadeInLeftBig;animation-name:fadeInLeftBig}@-webkit-keyframes fadeInRight{from{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}to{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInRight{from{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}to{opacity:1;-webkit-transform:none;transform:none}}.fadeInRight{-webkit-animation-name:fadeInRight;animation-name:fadeInRight}@-webkit-keyframes fadeInRightBig{from{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}to{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInRightBig{from{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}to{opacity:1;-webkit-transform:none;transform:none}}.fadeInRightBig{-webkit-animation-name:fadeInRightBig;animation-name:fadeInRightBig}@-webkit-keyframes fadeInUp{from{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}to{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInUp{from{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}to{opacity:1;-webkit-transform:none;transform:none}}.fadeInUp{-webkit-animation-name:fadeInUp;animation-name:fadeInUp}@-webkit-keyframes fadeInUpBig{from{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}to{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInUpBig{from{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}to{opacity:1;-webkit-transform:none;transform:none}}.fadeInUpBig{-webkit-animation-name:fadeInUpBig;animation-name:fadeInUpBig}@-webkit-keyframes fadeOut{from{opacity:1}to{opacity:0}}@keyframes fadeOut{from{opacity:1}to{opacity:0}}.fadeOut{-webkit-animation-name:fadeOut;animation-name:fadeOut}@-webkit-keyframes fadeOutDown{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes fadeOutDown{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}.fadeOutDown{-webkit-animation-name:fadeOutDown;animation-name:fadeOutDown}@-webkit-keyframes fadeOutDownBig{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}@keyframes fadeOutDownBig{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}.fadeOutDownBig{-webkit-animation-name:fadeOutDownBig;animation-name:fadeOutDownBig}@-webkit-keyframes fadeOutLeft{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@keyframes fadeOutLeft{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}.fadeOutLeft{-webkit-animation-name:fadeOutLeft;animation-name:fadeOutLeft}@-webkit-keyframes fadeOutLeftBig{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}@keyframes fadeOutLeftBig{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}.fadeOutLeftBig{-webkit-animation-name:fadeOutLeftBig;animation-name:fadeOutLeftBig}@-webkit-keyframes fadeOutRight{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}@keyframes fadeOutRight{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}.fadeOutRight{-webkit-animation-name:fadeOutRight;animation-name:fadeOutRight}@-webkit-keyframes fadeOutRightBig{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}@keyframes fadeOutRightBig{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}.fadeOutRightBig{-webkit-animation-name:fadeOutRightBig;animation-name:fadeOutRightBig}@-webkit-keyframes fadeOutUp{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@keyframes fadeOutUp{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}.fadeOutUp{-webkit-animation-name:fadeOutUp;animation-name:fadeOutUp}@-webkit-keyframes fadeOutUpBig{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}@keyframes fadeOutUpBig{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}.fadeOutUpBig{-webkit-animation-name:fadeOutUpBig;animation-name:fadeOutUpBig}@-webkit-keyframes flip{from{-webkit-transform:perspective(400px) rotate3d(0,1,0,-360deg);transform:perspective(400px) rotate3d(0,1,0,-360deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) scale3d(.95,.95,.95);transform:perspective(400px) scale3d(.95,.95,.95);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}to{-webkit-transform:perspective(400px);transform:perspective(400px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}@keyframes flip{from{-webkit-transform:perspective(400px) rotate3d(0,1,0,-360deg);transform:perspective(400px) rotate3d(0,1,0,-360deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) scale3d(.95,.95,.95);transform:perspective(400px) scale3d(.95,.95,.95);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}to{-webkit-transform:perspective(400px);transform:perspective(400px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}.animated.flip{-webkit-backface-visibility:visible;backface-visibility:visible;-webkit-animation-name:flip;animation-name:flip}@-webkit-keyframes flipInX{from{-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotate3d(1,0,0,10deg);transform:perspective(400px) rotate3d(1,0,0,10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-5deg);transform:perspective(400px) rotate3d(1,0,0,-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}}@keyframes flipInX{from{-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotate3d(1,0,0,10deg);transform:perspective(400px) rotate3d(1,0,0,10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-5deg);transform:perspective(400px) rotate3d(1,0,0,-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}}.flipInX{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInX;animation-name:flipInX}@-webkit-keyframes flipInY{from{-webkit-transform:perspective(400px) rotate3d(0,1,0,90deg);transform:perspective(400px) rotate3d(0,1,0,90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-20deg);transform:perspective(400px) rotate3d(0,1,0,-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotate3d(0,1,0,10deg);transform:perspective(400px) rotate3d(0,1,0,10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-5deg);transform:perspective(400px) rotate3d(0,1,0,-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}}@keyframes flipInY{from{-webkit-transform:perspective(400px) rotate3d(0,1,0,90deg);transform:perspective(400px) rotate3d(0,1,0,90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-20deg);transform:perspective(400px) rotate3d(0,1,0,-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotate3d(0,1,0,10deg);transform:perspective(400px) rotate3d(0,1,0,10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-5deg);transform:perspective(400px) rotate3d(0,1,0,-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}}.flipInY{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInY;animation-name:flipInY}@-webkit-keyframes flipOutX{from{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);opacity:1}to{-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);opacity:0}}@keyframes flipOutX{from{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);opacity:1}to{-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);opacity:0}}.flipOutX{-webkit-animation-name:flipOutX;animation-name:flipOutX;-webkit-backface-visibility:visible!important;backface-visibility:visible!important}@-webkit-keyframes flipOutY{from{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-15deg);transform:perspective(400px) rotate3d(0,1,0,-15deg);opacity:1}to{-webkit-transform:perspective(400px) rotate3d(0,1,0,90deg);transform:perspective(400px) rotate3d(0,1,0,90deg);opacity:0}}@keyframes flipOutY{from{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-15deg);transform:perspective(400px) rotate3d(0,1,0,-15deg);opacity:1}to{-webkit-transform:perspective(400px) rotate3d(0,1,0,90deg);transform:perspective(400px) rotate3d(0,1,0,90deg);opacity:0}}.flipOutY{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipOutY;animation-name:flipOutY}@-webkit-keyframes lightSpeedIn{from{-webkit-transform:translate3d(100%,0,0) skewX(-30deg);transform:translate3d(100%,0,0) skewX(-30deg);opacity:0}60%{-webkit-transform:skewX(20deg);transform:skewX(20deg);opacity:1}80%{-webkit-transform:skewX(-5deg);transform:skewX(-5deg);opacity:1}to{-webkit-transform:none;transform:none;opacity:1}}@keyframes lightSpeedIn{from{-webkit-transform:translate3d(100%,0,0) skewX(-30deg);transform:translate3d(100%,0,0) skewX(-30deg);opacity:0}60%{-webkit-transform:skewX(20deg);transform:skewX(20deg);opacity:1}80%{-webkit-transform:skewX(-5deg);transform:skewX(-5deg);opacity:1}to{-webkit-transform:none;transform:none;opacity:1}}.lightSpeedIn{-webkit-animation-name:lightSpeedIn;animation-name:lightSpeedIn;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}@-webkit-keyframes lightSpeedOut{from{opacity:1}to{-webkit-transform:translate3d(100%,0,0) skewX(30deg);transform:translate3d(100%,0,0) skewX(30deg);opacity:0}}@keyframes lightSpeedOut{from{opacity:1}to{-webkit-transform:translate3d(100%,0,0) skewX(30deg);transform:translate3d(100%,0,0) skewX(30deg);opacity:0}}.lightSpeedOut{-webkit-animation-name:lightSpeedOut;animation-name:lightSpeedOut;-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}@-webkit-keyframes rotateIn{from{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:rotate3d(0,0,1,-200deg);transform:rotate3d(0,0,1,-200deg);opacity:0}to{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateIn{from{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:rotate3d(0,0,1,-200deg);transform:rotate3d(0,0,1,-200deg);opacity:0}to{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:none;transform:none;opacity:1}}.rotateIn{-webkit-animation-name:rotateIn;animation-name:rotateIn}@-webkit-keyframes rotateInDownLeft{from{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}to{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateInDownLeft{from{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}to{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:none;transform:none;opacity:1}}.rotateInDownLeft{-webkit-animation-name:rotateInDownLeft;animation-name:rotateInDownLeft}@-webkit-keyframes rotateInDownRight{from{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}to{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateInDownRight{from{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}to{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:none;transform:none;opacity:1}}.rotateInDownRight{-webkit-animation-name:rotateInDownRight;animation-name:rotateInDownRight}@-webkit-keyframes rotateInUpLeft{from{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}to{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateInUpLeft{from{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}to{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:none;transform:none;opacity:1}}.rotateInUpLeft{-webkit-animation-name:rotateInUpLeft;animation-name:rotateInUpLeft}@-webkit-keyframes rotateInUpRight{from{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,-90deg);transform:rotate3d(0,0,1,-90deg);opacity:0}to{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateInUpRight{from{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,-90deg);transform:rotate3d(0,0,1,-90deg);opacity:0}to{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:none;transform:none;opacity:1}}.rotateInUpRight{-webkit-animation-name:rotateInUpRight;animation-name:rotateInUpRight}@-webkit-keyframes rotateOut{from{-webkit-transform-origin:center;transform-origin:center;opacity:1}to{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:rotate3d(0,0,1,200deg);transform:rotate3d(0,0,1,200deg);opacity:0}}@keyframes rotateOut{from{-webkit-transform-origin:center;transform-origin:center;opacity:1}to{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:rotate3d(0,0,1,200deg);transform:rotate3d(0,0,1,200deg);opacity:0}}.rotateOut{-webkit-animation-name:rotateOut;animation-name:rotateOut}@-webkit-keyframes rotateOutDownLeft{from{-webkit-transform-origin:left bottom;transform-origin:left bottom;opacity:1}to{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}}@keyframes rotateOutDownLeft{from{-webkit-transform-origin:left bottom;transform-origin:left bottom;opacity:1}to{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}}.rotateOutDownLeft{-webkit-animation-name:rotateOutDownLeft;animation-name:rotateOutDownLeft}@-webkit-keyframes rotateOutDownRight{from{-webkit-transform-origin:right bottom;transform-origin:right bottom;opacity:1}to{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}}@keyframes rotateOutDownRight{from{-webkit-transform-origin:right bottom;transform-origin:right bottom;opacity:1}to{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}}.rotateOutDownRight{-webkit-animation-name:rotateOutDownRight;animation-name:rotateOutDownRight}@-webkit-keyframes rotateOutUpLeft{from{-webkit-transform-origin:left bottom;transform-origin:left bottom;opacity:1}to{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}}@keyframes rotateOutUpLeft{from{-webkit-transform-origin:left bottom;transform-origin:left bottom;opacity:1}to{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}}.rotateOutUpLeft{-webkit-animation-name:rotateOutUpLeft;animation-name:rotateOutUpLeft}@-webkit-keyframes rotateOutUpRight{from{-webkit-transform-origin:right bottom;transform-origin:right bottom;opacity:1}to{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,90deg);transform:rotate3d(0,0,1,90deg);opacity:0}}@keyframes rotateOutUpRight{from{-webkit-transform-origin:right bottom;transform-origin:right bottom;opacity:1}to{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,90deg);transform:rotate3d(0,0,1,90deg);opacity:0}}.rotateOutUpRight{-webkit-animation-name:rotateOutUpRight;animation-name:rotateOutUpRight}@-webkit-keyframes hinge{0%{-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate3d(0,0,1,80deg);transform:rotate3d(0,0,1,80deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}40%,80%{-webkit-transform:rotate3d(0,0,1,60deg);transform:rotate3d(0,0,1,60deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;opacity:1}to{-webkit-transform:translate3d(0,700px,0);transform:translate3d(0,700px,0);opacity:0}}@keyframes hinge{0%{-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate3d(0,0,1,80deg);transform:rotate3d(0,0,1,80deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}40%,80%{-webkit-transform:rotate3d(0,0,1,60deg);transform:rotate3d(0,0,1,60deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;opacity:1}to{-webkit-transform:translate3d(0,700px,0);transform:translate3d(0,700px,0);opacity:0}}.hinge{-webkit-animation-name:hinge;animation-name:hinge}@-webkit-keyframes rollIn{from{opacity:0;-webkit-transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg);transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg)}to{opacity:1;-webkit-transform:none;transform:none}}@keyframes rollIn{from{opacity:0;-webkit-transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg);transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg)}to{opacity:1;-webkit-transform:none;transform:none}}.rollIn{-webkit-animation-name:rollIn;animation-name:rollIn}@-webkit-keyframes rollOut{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg);transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg)}}@keyframes rollOut{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg);transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg)}}.rollOut{-webkit-animation-name:rollOut;animation-name:rollOut}@-webkit-keyframes zoomIn{from{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}50%{opacity:1}}@keyframes zoomIn{from{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}50%{opacity:1}}.zoomIn{-webkit-animation-name:zoomIn;animation-name:zoomIn}@-webkit-keyframes zoomInDown{from{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomInDown{from{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomInDown{-webkit-animation-name:zoomInDown;animation-name:zoomInDown}@-webkit-keyframes zoomInLeft{from{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(10px,0,0);transform:scale3d(.475,.475,.475) translate3d(10px,0,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomInLeft{from{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(10px,0,0);transform:scale3d(.475,.475,.475) translate3d(10px,0,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomInLeft{-webkit-animation-name:zoomInLeft;animation-name:zoomInLeft}@-webkit-keyframes zoomInRight{from{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomInRight{from{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomInRight{-webkit-animation-name:zoomInRight;animation-name:zoomInRight}@-webkit-keyframes zoomInUp{from{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomInUp{from{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomInUp{-webkit-animation-name:zoomInUp;animation-name:zoomInUp}@-webkit-keyframes zoomOut{from{opacity:1}50%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}to{opacity:0}}@keyframes zoomOut{from{opacity:1}50%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}to{opacity:0}}.zoomOut{-webkit-animation-name:zoomOut;animation-name:zoomOut}@-webkit-keyframes zoomOutDown{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}to{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);-webkit-transform-origin:center bottom;transform-origin:center bottom;-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomOutDown{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}to{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);-webkit-transform-origin:center bottom;transform-origin:center bottom;-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomOutDown{-webkit-animation-name:zoomOutDown;animation-name:zoomOutDown}@-webkit-keyframes zoomOutLeft{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(42px,0,0);transform:scale3d(.475,.475,.475) translate3d(42px,0,0)}to{opacity:0;-webkit-transform:scale(.1) translate3d(-2000px,0,0);transform:scale(.1) translate3d(-2000px,0,0);-webkit-transform-origin:left center;transform-origin:left center}}@keyframes zoomOutLeft{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(42px,0,0);transform:scale3d(.475,.475,.475) translate3d(42px,0,0)}to{opacity:0;-webkit-transform:scale(.1) translate3d(-2000px,0,0);transform:scale(.1) translate3d(-2000px,0,0);-webkit-transform-origin:left center;transform-origin:left center}}.zoomOutLeft{-webkit-animation-name:zoomOutLeft;animation-name:zoomOutLeft}@-webkit-keyframes zoomOutRight{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-42px,0,0);transform:scale3d(.475,.475,.475) translate3d(-42px,0,0)}to{opacity:0;-webkit-transform:scale(.1) translate3d(2000px,0,0);transform:scale(.1) translate3d(2000px,0,0);-webkit-transform-origin:right center;transform-origin:right center}}@keyframes zoomOutRight{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-42px,0,0);transform:scale3d(.475,.475,.475) translate3d(-42px,0,0)}to{opacity:0;-webkit-transform:scale(.1) translate3d(2000px,0,0);transform:scale(.1) translate3d(2000px,0,0);-webkit-transform-origin:right center;transform-origin:right center}}.zoomOutRight{-webkit-animation-name:zoomOutRight;animation-name:zoomOutRight}@-webkit-keyframes zoomOutUp{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}to{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);-webkit-transform-origin:center bottom;transform-origin:center bottom;-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomOutUp{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}to{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);-webkit-transform-origin:center bottom;transform-origin:center bottom;-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomOutUp{-webkit-animation-name:zoomOutUp;animation-name:zoomOutUp}@-webkit-keyframes slideInDown{from{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0);visibility:visible}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes slideInDown{from{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0);visibility:visible}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.slideInDown{-webkit-animation-name:slideInDown;animation-name:slideInDown}@-webkit-keyframes slideInLeft{from{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);visibility:visible}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes slideInLeft{from{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);visibility:visible}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.slideInLeft{-webkit-animation-name:slideInLeft;animation-name:slideInLeft}@-webkit-keyframes slideInRight{from{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);visibility:visible}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes slideInRight{from{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);visibility:visible}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.slideInRight{-webkit-animation-name:slideInRight;animation-name:slideInRight}@-webkit-keyframes slideInUp{from{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0);visibility:visible}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes slideInUp{from{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0);visibility:visible}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.slideInUp{-webkit-animation-name:slideInUp;animation-name:slideInUp}@-webkit-keyframes slideOutDown{from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{visibility:hidden;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes slideOutDown{from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{visibility:hidden;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}.slideOutDown{-webkit-animation-name:slideOutDown;animation-name:slideOutDown}@-webkit-keyframes slideOutLeft{from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{visibility:hidden;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@keyframes slideOutLeft{from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{visibility:hidden;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}.slideOutLeft{-webkit-animation-name:slideOutLeft;animation-name:slideOutLeft}@-webkit-keyframes slideOutRight{from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{visibility:hidden;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}@keyframes slideOutRight{from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{visibility:hidden;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}.slideOutRight{-webkit-animation-name:slideOutRight;animation-name:slideOutRight}@-webkit-keyframes slideOutUp{from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{visibility:hidden;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@keyframes slideOutUp{from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{visibility:hidden;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}.slideOutUp{-webkit-animation-name:slideOutUp;animation-name:slideOutUp}