.ui-helper-hidden {
    display: none
}

.ui-helper-hidden-accessible {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px
}

.ui-helper-reset {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    line-height: 1.3;
    text-decoration: none;
    font-size: 100%;
    list-style: none
}

.ui-helper-clearfix:before, .ui-helper-clearfix:after {
    content: "";
    display: table;
    border-collapse: collapse
}

.ui-helper-clearfix:after {
    clear: both
}

.ui-helper-zfix {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    position: absolute;
    opacity: 0;
    filter: Alpha(Opacity=0)
}

.ui-front {
    z-index: 100
}

.ui-state-disabled {
    cursor: default !important;
    pointer-events: none;
    opacity: 0.5;
    pointer-events: none
}

.ui-icon {
    display: inline-block;
    vertical-align: middle;
    margin-top: -.25em;
    position: relative;
    text-indent: -99999px;
    overflow: hidden;
    background-repeat: no-repeat
}

.ui-widget-icon-block {
    left: 50%;
    margin-left: -8px;
    display: block
}

.ui-widget-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.ui-accordion .ui-accordion-header {
    display: block;
    cursor: pointer;
    position: relative;
    margin: 2px 0 0 0;
    padding: .5em .5em .5em .7em;
    font-size: 100%
}

.ui-autocomplete {
    position: absolute;
    top: 0;
    left: 0;
    cursor: default
}

.ui-menu {
    list-style: none;
    padding: 0;
    margin: 0;
    display: block;
    outline: 0
}

    .ui-menu .ui-menu {
        position: absolute
    }

    .ui-menu .ui-menu-item {
        margin: 0;
        cursor: pointer;
        list-style-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7")
    }

    .ui-menu .ui-menu-item-wrapper {
        position: relative;
        padding: 3px 1em 3px .4em
    }

    .ui-menu .ui-menu-divider {
        margin: 5px 0;
        height: 0;
        font-size: 0;
        line-height: 0;
        border-width: 1px 0 0 0
    }

    .ui-menu .ui-state-focus, .ui-menu .ui-state-active {
        margin: -1px
    }

.ui-menu-icons {
    position: relative
}

    .ui-menu-icons .ui-menu-item-wrapper {
        padding-left: 2em
    }

.ui-menu .ui-icon {
    position: absolute;
    top: 0;
    bottom: 0;
    left: .2em;
    margin: auto 0
}

.ui-menu .ui-menu-icon {
    left: auto;
    right: 0
}

.ui-button {
    padding: .4em 1em;
    display: inline-block;
    position: relative;
    line-height: normal;
    margin-right: .1em;
    cursor: pointer;
    vertical-align: middle;
    text-align: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    overflow: visible
}

    .ui-button, .ui-button:link, .ui-button:visited, .ui-button:hover, .ui-button:active {
        text-decoration: none
    }

.ui-button-icon-only {
    width: 2em;
    box-sizing: border-box;
    text-indent: -9999px;
    white-space: nowrap
}

input.ui-button.ui-button-icon-only {
    text-indent: 0
}

.ui-button-icon-only .ui-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -8px;
    margin-left: -8px
}

.ui-button.ui-icon-notext .ui-icon {
    padding: 0;
    width: 2.1em;
    height: 2.1em;
    text-indent: -9999px;
    white-space: nowrap
}

input.ui-button.ui-icon-notext .ui-icon {
    width: auto;
    height: auto;
    text-indent: 0;
    white-space: normal;
    padding: .4em 1em
}

input.ui-button::-moz-focus-inner, button.ui-button::-moz-focus-inner {
    border: 0;
    padding: 0
}

.ui-controlgroup {
    vertical-align: middle;
    display: inline-block
}

    .ui-controlgroup > .ui-controlgroup-item {
        float: left;
        margin-left: 0;
        margin-right: 0
    }

        .ui-controlgroup > .ui-controlgroup-item:focus, .ui-controlgroup > .ui-controlgroup-item.ui-visual-focus {
            z-index: 9999
        }

.ui-controlgroup-vertical > .ui-controlgroup-item {
    display: block;
    float: none;
    width: 100%;
    margin-top: 0;
    margin-bottom: 0;
    text-align: left
}

.ui-controlgroup-vertical .ui-controlgroup-item {
    box-sizing: border-box
}

.ui-controlgroup .ui-controlgroup-label {
    padding: .4em 1em
}

    .ui-controlgroup .ui-controlgroup-label span {
        font-size: 80%
    }

.ui-controlgroup-horizontal .ui-controlgroup-label + .ui-controlgroup-item {
    border-left: none
}

.ui-controlgroup-vertical .ui-controlgroup-label + .ui-controlgroup-item {
    border-top: none
}

.ui-controlgroup-horizontal .ui-controlgroup-label.ui-widget-content {
    border-right: none
}

.ui-controlgroup-vertical .ui-controlgroup-label.ui-widget-content {
    border-bottom: none
}

.ui-controlgroup-vertical .ui-spinner-input {
    width: 75%;
    width: calc( 100% - 2.4em)
}

.ui-controlgroup-vertical .ui-spinner .ui-spinner-up {
    border-top-style: solid
}

.ui-checkboxradio-label .ui-icon-background {
    box-shadow: inset 1px 1px 1px #cccccc;
    border-radius: .12em;
    border: none
}

.ui-checkboxradio-radio-label .ui-icon-background {
    width: 16px;
    height: 16px;
    border-radius: 1em;
    overflow: visible;
    border: none
}

.ui-checkboxradio-radio-label.ui-checkboxradio-checked .ui-icon, .ui-checkboxradio-radio-label.ui-checkboxradio-checked:hover .ui-icon {
    background-image: none;
    width: 8px;
    height: 8px;
    border-width: 4px;
    border-style: solid
}

.ui-checkboxradio-disabled {
    pointer-events: none
}

.ui-datepicker {
    width: 17em;
    padding: .2em .2em 0;
    display: none
}

    .ui-datepicker .ui-datepicker-header {
        position: relative;
        padding: .2em 0
    }

    .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
        position: absolute;
        top: 8px;
        width: 1.8em;
        height: 1.8em
    }

    .ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover {
        top: 1px
    }

    .ui-datepicker .ui-datepicker-prev {
        left: 2px
    }

    .ui-datepicker .ui-datepicker-next {
        right: 2px
    }

    .ui-datepicker .ui-datepicker-prev-hover {
        left: 1px
    }

    .ui-datepicker .ui-datepicker-next-hover {
        right: 1px
    }

    .ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span {
        display: block;
        position: absolute;
        left: 50%;
        margin-left: -8px;
        top: 50%;
        margin-top: -8px
    }

    .ui-datepicker .ui-datepicker-title {
        margin: 0 2.3em;
        line-height: 1.8em;
        text-align: center
    }

        .ui-datepicker .ui-datepicker-title select {
            font-size: 1em;
            margin: 1px 0;
            padding: 0.5rem
        }

    .ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year {
        width: 45%
    }

    .ui-datepicker table {
        width: 100%;
        font-size: .9em;
        border-collapse: collapse;
        margin: 0 0 .4em
    }

    .ui-datepicker th {
        padding: .7em .3em;
        text-align: center;
        font-weight: bold;
        border: 0
    }

    .ui-datepicker td {
        border: 0;
        padding: 1px
    }

        .ui-datepicker td span, .ui-datepicker td a {
            display: block;
            padding: .2em;
            text-align: right;
            text-decoration: none
        }

    .ui-datepicker .ui-datepicker-buttonpane {
        background-image: none;
        margin: .7em 0 0 0;
        padding: 0 .2em;
        border-left: 0;
        border-right: 0;
        border-bottom: 0
    }

        .ui-datepicker .ui-datepicker-buttonpane button {
            float: right;
            margin: .5em .2em .4em;
            cursor: pointer;
            padding: .2em .6em .3em .6em;
            width: auto;
            overflow: visible
        }

            .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
                float: left
            }

    .ui-datepicker.ui-datepicker-multi {
        width: auto
    }

.ui-datepicker-multi .ui-datepicker-group {
    float: left
}

    .ui-datepicker-multi .ui-datepicker-group table {
        width: 95%;
        margin: 0 auto .4em
    }

.ui-datepicker-multi-2 .ui-datepicker-group {
    width: 50%
}

.ui-datepicker-multi-3 .ui-datepicker-group {
    width: 33.3%
}

.ui-datepicker-multi-4 .ui-datepicker-group {
    width: 25%
}

.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header, .ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
    border-left-width: 0
}

.ui-datepicker-multi .ui-datepicker-buttonpane {
    clear: left
}

.ui-datepicker-row-break {
    clear: both;
    width: 100%;
    font-size: 0
}

.ui-datepicker-rtl {
    direction: rtl
}

    .ui-datepicker-rtl .ui-datepicker-prev {
        right: 2px;
        left: auto
    }

    .ui-datepicker-rtl .ui-datepicker-next {
        left: 2px;
        right: auto
    }

    .ui-datepicker-rtl .ui-datepicker-prev:hover {
        right: 1px;
        left: auto
    }

    .ui-datepicker-rtl .ui-datepicker-next:hover {
        left: 1px;
        right: auto
    }

    .ui-datepicker-rtl .ui-datepicker-buttonpane {
        clear: right
    }

        .ui-datepicker-rtl .ui-datepicker-buttonpane button {
            float: left
        }

            .ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current, .ui-datepicker-rtl .ui-datepicker-group {
                float: right
            }

    .ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header, .ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header {
        border-right-width: 0;
        border-left-width: 1px
    }

.ui-datepicker .ui-icon {
    display: block;
    text-indent: -99999px;
    overflow: hidden;
    background-repeat: no-repeat;
    left: .5em;
    top: .3em
}

.ui-dialog {
    position: absolute;
    top: 0;
    left: 0;
    padding: .2em;
    outline: 0
}

    .ui-dialog .ui-dialog-titlebar {
        padding: .4em 1em;
        position: relative
    }

    .ui-dialog .ui-dialog-title {
        float: left;
        margin: .1em 0;
        white-space: nowrap;
        width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        line-height: 2rem
    }

    .ui-dialog .ui-dialog-titlebar-close {
        position: absolute;
        right: .3em;
        top: 50%;
        width: 20px;
        margin: -10px 0 0 0;
        padding: 1px;
        height: 20px
    }

    .ui-dialog .ui-dialog-content {
        position: relative;
        border: 0;
        padding: .5em 1em;
        background: none;
        overflow: auto
    }

    .ui-dialog .ui-dialog-buttonpane {
        text-align: left;
        border-width: 1px 0 0 0;
        background-image: none;
        margin-top: .5em;
        padding: .3em 1em .5em .4em
    }

        .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
            float: right
        }

        .ui-dialog .ui-dialog-buttonpane button {
            margin: .5em .4em .5em 0;
            cursor: pointer
        }

    .ui-dialog .ui-resizable-n {
        height: 2px;
        top: 0
    }

    .ui-dialog .ui-resizable-e {
        width: 2px;
        right: 0
    }

    .ui-dialog .ui-resizable-s {
        height: 2px;
        bottom: 0
    }

    .ui-dialog .ui-resizable-w {
        width: 2px;
        left: 0
    }

    .ui-dialog .ui-resizable-se, .ui-dialog .ui-resizable-sw, .ui-dialog .ui-resizable-ne, .ui-dialog .ui-resizable-nw {
        width: 7px;
        height: 7px
    }

    .ui-dialog .ui-resizable-se {
        right: 0;
        bottom: 0
    }

    .ui-dialog .ui-resizable-sw {
        left: 0;
        bottom: 0
    }

    .ui-dialog .ui-resizable-ne {
        right: 0;
        top: 0
    }

    .ui-dialog .ui-resizable-nw {
        left: 0;
        top: 0
    }

.ui-draggable .ui-dialog-titlebar {
    cursor: move
}

.ui-draggable-handle {
    -ms-touch-action: none;
    touch-action: none
}

.ui-resizable {
    position: relative
}

.ui-resizable-handle {
    position: absolute;
    font-size: 0.1px;
    display: block;
    -ms-touch-action: none;
    touch-action: none
}

.ui-resizable-disabled .ui-resizable-handle, .ui-resizable-autohide .ui-resizable-handle {
    display: none
}

.ui-resizable-n {
    cursor: n-resize;
    height: 7px;
    width: 100%;
    top: -5px;
    left: 0
}

.ui-resizable-s {
    cursor: s-resize;
    height: 7px;
    width: 100%;
    bottom: -5px;
    left: 0
}

.ui-resizable-e {
    cursor: e-resize;
    width: 7px;
    right: -5px;
    top: 0;
    height: 100%
}

.ui-resizable-w {
    cursor: w-resize;
    width: 7px;
    left: -5px;
    top: 0;
    height: 100%
}

.ui-resizable-se {
    cursor: se-resize;
    width: 12px;
    height: 12px;
    right: 1px;
    bottom: 1px
}

.ui-resizable-sw {
    cursor: sw-resize;
    width: 9px;
    height: 9px;
    left: -5px;
    bottom: -5px
}

.ui-resizable-nw {
    cursor: nw-resize;
    width: 9px;
    height: 9px;
    left: -5px;
    top: -5px
}

.ui-resizable-ne {
    cursor: ne-resize;
    width: 9px;
    height: 9px;
    right: -5px;
    top: -5px
}

.ui-selectable {
    -ms-touch-action: none;
    touch-action: none
}

.ui-selectable-helper {
    position: absolute;
    z-index: 100;
    border: 1px dotted black
}

.ui-selectmenu-menu {
    padding: 0;
    margin: 0;
    position: absolute;
    top: 0;
    left: 0;
    display: none
}

    .ui-selectmenu-menu .ui-menu {
        overflow: auto;
        overflow-x: hidden;
        padding-bottom: 1px
    }

        .ui-selectmenu-menu .ui-menu .ui-selectmenu-optgroup {
            font-size: 1em;
            font-weight: bold;
            line-height: 1.5;
            padding: 2px 0.4em;
            margin: 0.5em 0 0 0;
            height: auto;
            border: 0
        }

.ui-selectmenu-open {
    display: block
}

.ui-selectmenu-text {
    display: block;
    margin-right: 20px;
    overflow: hidden;
    text-overflow: ellipsis
}

.ui-selectmenu-button.ui-button {
    text-align: left;
    white-space: nowrap;
    width: 14em
}

.ui-selectmenu-icon.ui-icon {
    float: right;
    margin-top: 0
}

.ui-widget.ui-widget-content {
    border: 1px solid #c5c5c5
}

.ui-widget-content {
    border: 1px solid #dddddd;
    background: #ffffff;
    color: #333333
}

.ui-widget-header {
    border: 1px solid #dddddd;
    background: #e9e9e9;
    color: #333333;
    font-weight: bold
}

    .ui-widget-header a {
        color: #333333
    }

.ui-icon {
    width: 16px;
    height: 16px
}

.ui-widget-overlay {
    background: #aaaaaa;
    opacity: .003;
    filter: Alpha(Opacity=0.3)
}

.ui-widget-shadow {
    -webkit-box-shadow: 0px 0px 5px #666666;
    box-shadow: 0px 0px 5px #666666
}
/*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */

html {
    line-height: 1;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%
}

body {
    margin: 0
}

article, aside, footer, header, nav, section {
    display: block
}

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

figcaption, figure, main {
    display: block
}

figure {
    margin: 1em 40px
}

hr {
    box-sizing: content-box;
    height: 0;
    overflow: visible
}

pre {
    font-family: monospace, monospace;
    font-size: 1em
}

a {
    background-color: transparent;
    -webkit-text-decoration-skip: objects
}

    a:active, a:hover {
        outline-width: 0
    }

abbr[title] {
    border-bottom: none;
    text-decoration: underline;
    text-decoration: underline dotted
}

code, kbd, samp {
    font-family: monospace, monospace;
    font-size: 1em
}

dfn {
    font-style: italic
}

mark {
    background-color: #ff0;
    color: #000
}

small {
    font-size: 80%
}

sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sub {
    bottom: -0.25em
}

sup {
    top: -0.5em
}

audio, video {
    display: inline-block
}

    audio:not([controls]) {
        display: none;
        height: 0
    }

img {
    border-style: none
}

svg:not(:root) {
    overflow: hidden
}

button, input, optgroup, select, textarea {
    line-height: 1.15;
    margin: 0
}

button, input {
    overflow: visible
}

button, select {
    text-transform: none
}

button, html [type="button"], [type="reset"], [type="submit"] {
    -webkit-appearance: button
}

    button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {
        border-style: none;
        padding: 0
    }

    button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring {
        outline: 1px dotted ButtonText
    }

fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em
}

legend {
    box-sizing: border-box;
    color: inherit;
    display: table;
    max-width: 100%;
    padding: 0;
    white-space: normal
}

progress {
    display: inline-block;
    vertical-align: baseline
}

textarea {
    overflow: auto
}

[type="checkbox"], [type="radio"] {
    box-sizing: border-box;
    padding: 0
}

[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button {
    height: auto
}

[type="search"] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

    [type="search"]::-webkit-search-cancel-button, [type="search"]::-webkit-search-decoration {
        -webkit-appearance: none
    }

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

details, menu {
    display: block
}

summary {
    display: list-item
}

canvas {
    display: inline-block
}

template {
    display: none
}

[hidden] {
    display: none
}

.main-content {
    padding-top: 1rem;
    padding-left: 1rem;
    padding-right: 1rem;
    flex: 1;
    -moz-transition: width 0.6s ease;
    -o-transition: width 0.6s ease;
    -webkit-transition: width 0.6s ease;
    transition: width 0.6s ease;
    position: relative;
    width: -webkit-calc(100% - 60px);
    width: -moz-calc(100% - 60px);
    width: -ms-calc(100% - 60px);
    width: -o-calc(100% - 60px);
    width: calc(100% - 60px)
}

.side-nav.expanded-nav + .main-content {
    width: -webkit-calc(100% - 200px);
    width: -moz-calc(100% - 200px);
    width: -ms-calc(100% - 200px);
    width: -o-calc(100% - 200px);
    width: calc(100% - 200px)
}

.crmBodyContainer {
    max-width: 1170px;
    margin: 0 auto
}

    .crmBodyContainer.withSidePanel {
        max-width: 100%
    }

        .crmBodyContainer.withSidePanel .page-header {
            max-width: 100%
        }

        .crmBodyContainer.withSidePanel .object-action-inner {
            max-width: 100%
        }

.body-content {
    position: relative;
    display: flex;
    display: -ms-flexbox;
    flex-direction: row;
    -ms-flex-direction: row;
    justify-content: flex-start;
    align-items: stretch;
    align-content: space-between;
    min-height: -webkit-calc(100vh - 92px);
    min-height: -moz-calc(100vh - 92px);
    min-height: -ms-calc(100vh - 92px);
    min-height: -o-calc(100vh - 92px);
    min-height: calc(100vh - 92px)
}

.flexbox-row {
    display: flex;
    flex-direction: row;
    display: -ms-flexbox;
    -ms-flex-direction: row
}

.flexbox-column {
    display: flex;
    flex-direction: column;
    display: -ms-flexbox;
    -ms-flex-direction: column
}

.flex-item {
    flex: 1;
    -ms-flex: 1;
    max-width: 100%
}

    .flex-item:last-child {
        margin-right: 0
    }

.flex-1 {
    flex: 1;
    -ms-flex: 1
}

.flex-2 {
    flex: 2;
    -ms-flex: 2
}

.flex-3 {
    flex: 3;
    -ms-flex: 3
}

.flex-4 {
    flex: 4;
    -ms-flex: 4
}

.flex-5 {
    flex: 5;
    -ms-flex: 5
}

.flex-6 {
    flex: 6;
    -ms-flex: 6
}

.flex-7 {
    flex: 7;
    -ms-flex: 7
}

.flex-8 {
    flex: 8;
    -ms-flex: 8
}

.flex-9 {
    flex: 9;
    -ms-flex: 9
}

.flex-10 {
    flex: 10;
    -ms-flex: 10
}

.flex-11 {
    flex: 11;
    -ms-flex: 11
}

.flex-12 {
    flex: 12;
    -ms-flex: 12
}

@media all and (max-width: 900px) {
    .flexbox-row.flex-wrap.mb3 {
        margin-bottom: 0
    }

    .flex-wrap > .flex-item {
        width: 100%;
        min-width: 100%;
        margin-bottom: 1rem;
        margin-right: 0
    }
}

@font-face {
}

@font-face {
}

.side-nav {
    width: 50px;
    -moz-transition: all 0.15s ease;
    -o-transition: all 0.15s ease;
    -webkit-transition: all 0.15s ease;
    transition: all 0.15s ease;
    position: relative;
    min-height: -webkit-calc(100vh - 88px);
    min-height: -moz-calc(100vh - 88px);
    min-height: -ms-calc(100vh - 88px);
    min-height: -o-calc(100vh - 88px);
    min-height: calc(100vh - 88px)
}

    .side-nav.expanded-nav .side-nav-list__container {
        position: relative;
        z-index: 10
    }

    .side-nav.expanded-nav .sub-menu .sub-menu__heading {
        display: none
    }

    .side-nav.expanded-nav #topnavdiv .side-nav-list__name {
        display: flex
    }

.side-nav-list {
    list-style-type: none;
    padding: 0;
    margin: 0;
    text-align: center;
    line-height: 1.5;
    font-size: 1.25rem
}

.side-nav-list__item {
    position: relative;
    float: left;
    width: 100%;
    -moz-transition: background-color 0.15s linear;
    -o-transition: background-color 0.15s linear;
    -webkit-transition: background-color 0.15s linear;
    transition: background-color 0.15s linear
}

    .side-nav-list__item:hover .sub-menu {
        display: block
    }

.side-nav-list__link {
    padding: 0;
    display: block;
    float: left;
    width: 50px;
    height: 48px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 18px
}

    .side-nav-list__link i {
        width: 50px !important
    }

.sub-menu {
    position: absolute;
    text-align: left;
    top: 0px;
    z-index: 101;
    clear: both;
    width: 220px;
    left: 100%;
    display: none
}

.sub-menu-list {
    display: block;
    max-height: 20rem;
    padding: .5rem 0;
    overflow: auto
}

.sub-menu__heading {
    font-family: "CRMSansLight",Arial,sans-serif;
    font-size: 1.065rem;
    font-weight: 400;
    padding: 10px 16px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.sub-menu-list__item {
    font-size: .8125rem;
    cursor: pointer;
    padding: 8px 2px 8px 16px;
    min-height: 26px;
    overflow: hidden
}

    .sub-menu-list__item a {
        display: flex;
        align-content: center
    }

        .sub-menu-list__item a span {
            white-space: pre;
            height: 18px
        }

    .sub-menu-list__item .icon {
        display: inline-block;
        vertical-align: middle;
        min-width: 14px
    }

.sub-menu-list__label {
    padding-left: .5rem;
    padding-right: .5rem;
    display: inline-block;
    vertical-align: middle;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 9rem;
    line-height: 19px
}

.list-hidden {
    width: 50px;
    overflow: hidden;
    -moz-transition: all 0.15s ease;
    -o-transition: all 0.15s ease;
    -webkit-transition: all 0.15s ease;
    transition: all 0.15s ease
}

.side-nav-list__container {
    width: 200px
}

.expanded-nav {
    width: 200px
}

.side-nav + .main-content {
    max-width: -webkit-calc(100% - 50px);
    max-width: -moz-calc(100% - 50px);
    max-width: -ms-calc(100% - 50px);
    max-width: -o-calc(100% - 50px);
    max-width: calc(100% - 50px)
}

.side-nav.expanded-nav + .main-content {
    max-width: -webkit-calc(100% - 200px);
    max-width: -moz-calc(100% - 200px);
    max-width: -ms-calc(100% - 200px);
    max-width: -o-calc(100% - 200px);
    max-width: calc(100% - 200px)
}

.expanded-nav .list-hidden {
    width: 200px;
    position: relative
}

    .expanded-nav .list-hidden:after {
        background: #404040;
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 4px;
        right: 0;
        z-index: 2;
        -moz-transition: all 0.15s;
        -o-transition: all 0.15s;
        -webkit-transition: all 0.15s;
        transition: all 0.15s
    }

.side-nav-list__name {
    float: left;
    font-size: .8125rem;
    line-height: 1;
    text-align: left;
    width: 140px;
    padding: 0;
    padding-right: 1.0rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 48px;
    display: flex;
    align-items: center;
    position: relative;
    -moz-transition: all 0.15s;
    -o-transition: all 0.15s;
    -webkit-transition: all 0.15s;
    transition: all 0.15s;
    border-left: 1px solid transparent;
    padding-left: .5rem
}

.expanded-nav .side-nav-list__item {
    -moz-transition: border-color 500ms linear;
    -o-transition: border-color 500ms linear;
    -webkit-transition: border-color 500ms linear;
    transition: border-color 500ms linear
}

    .expanded-nav .side-nav-list__item:hover .list-hidden:after {
        left: 50px
    }

    .expanded-nav .side-nav-list__item:hover .sub-menu {
        display: none
    }

.expanded-nav .sub-menu {
    position: relative;
    top: 0;
    width: 100%;
    box-shadow: none;
    border: 0;
    left: 0 !important;
    left: 70px;
    visibility: visible;
    opacity: 1;
    display: none;
    -moz-transition: all 0s;
    -o-transition: all 0s;
    -webkit-transition: all 0s;
    transition: all 0s
}

.expanded-nav .sub-menu-list__item {
    float: none;
    width: 100%;
    padding: .5rem 1rem;
    min-height: 0
}

.expanded-nav .side-nav-list__item .sub-menu.opened {
    display: block
}

.sub-menu.opened {
    box-shadow: none
}

    .sub-menu.opened .sub-menu__heading {
        padding: 0.4rem 1.4rem
    }

    .sub-menu.opened .sub-menu-list__item {
        padding: 0.5rem 1.4rem
    }

.has-sub-menu {
    position: relative
}

    .has-sub-menu:after {
        font-family: 'fontello';
        content: '\e9f3';
        -moz-transition: all 0.4s ease-in-out;
        -o-transition: all 0.4s ease-in-out;
        -webkit-transition: all 0.4s ease-in-out;
        transition: all 0.4s ease-in-out;
        position: absolute;
        top: 1rem;
        right: 0.5rem
    }

.active .has-sub-menu:after {
    -moz-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

#topnavdiv .side-nav-list {
    padding-bottom: 10rem
}

    #topnavdiv .side-nav-list::after {
        content: " ";
        display: table;
        clear: both
    }

    #topnavdiv .side-nav-list::before {
        content: " ";
        display: table
    }

    #topnavdiv .side-nav-list .side-nav-list__name {
        display: none
    }

.body-content.horizontal-menu {
    flex-direction: column
}

    .body-content.horizontal-menu .side-nav {
        display: flex;
        width: 100%;
        height: 40px;
        border-top: 1px solid;
        border-bottom: 1px solid;
        -moz-transition: all 0.15s ease;
        -o-transition: all 0.15s ease;
        -webkit-transition: all 0.15s ease;
        transition: all 0.15s ease
    }

        .body-content.horizontal-menu .side-nav #switch-nav {
            display: none
        }

        .body-content.horizontal-menu .side-nav .side-nav-list {
            display: flex
        }

            .body-content.horizontal-menu .side-nav .side-nav-list .side-nav-list__item {
                width: 50px;
                height: 38px;
                border-top-width: 0;
                border-bottom-width: 0;
                border-right-style: solid;
                border-right-width: 1px
            }

                .body-content.horizontal-menu .side-nav .side-nav-list .side-nav-list__item .list-hidden {
                    width: 50px;
                    height: 100%
                }

                    .body-content.horizontal-menu .side-nav .side-nav-list .side-nav-list__item .list-hidden .side-nav-list__link {
                        width: 50px;
                        padding: .25rem;
                        text-align: center
                    }

                .body-content.horizontal-menu .side-nav .side-nav-list .side-nav-list__item .sub-menu {
                    top: 100%;
                    left: 0
                }

    .body-content.horizontal-menu .main-content {
        width: 100%;
        padding-left: 1rem;
        padding-right: 1rem
    }

.webui-popover-inner .close {
    right: -10px;
    top: -7px
}

.quicklinkbox tr {
    float: none !important;
    position: relative
}

    .quicklinkbox tr td a {
        margin-left: 10px;
        font-size: .75rem
    }

.quicklink__value td {
    color: #333;
    font-size: .8125rem;
    padding-top: 0px
}

.quicklink__label td {
    color: #5c5656;
    font-size: .8125rem;
    padding-top: 10px
}

.qdh td {
    border-bottom: 1px solid #eaeaea;
    padding-bottom: 8px
}

    .qdh td:last-child {
        text-align: right
    }

.qdh b {
    font-size: .8125rem;
    color: #212121;
    font-family: "CRMSansSemiBold",Arial,sans-serif
}

.webui-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: .5rem
}

.webui__heading {
    font-family: "CRMSansSemiBold",Arial,sans-serif;
    color: #333;
    font-size: .9375rem;
    margin-left: 6px
}

.webui-header__icon {
    color: #333
}

#switch-nav:hover {
    border-top: 1px solid #ddd
}

#HeadingQL .sub-menu__heading {
    display: flex;
    flex-direction: row;
    justify-content: space-between
}

    #HeadingQL .sub-menu__heading a.fr {
        float: none
    }

        #HeadingQL .sub-menu__heading a.fr .icon {
            color: #fff
        }

.side-nav .side-nav-list__name {
    display: none
}

.sub-menu-list:empty {
    display: none
}

.side-nav.expanded-nav .side-nav-list__name {
    display: flex
}

.sub-menu-list::-webkit-scrollbar-track {
    background-color: #444444;
    width: 8px
}

.sub-menu-list::-webkit-scrollbar {
    background-color: #444444;
    width: 8px
}

.sub-menu-list::-webkit-scrollbar-thumb {
    background-color: #222222;
    width: 8px
}

@media screen and (min-width: 900px) {
    .newmoc__tree .card__tab, .quick__moc .card__tab {
        margin: 0 10px;
        margin-bottom: 5px
    }

        .newmoc__tree .card__tab .card__tab--li, .quick__moc .card__tab .card__tab--li {
            display: inline-block;
            text-align: center;
            padding: 10px;
            font-size: .875rem
        }

            .newmoc__tree .card__tab .card__tab--li:last-child, .quick__moc .card__tab .card__tab--li:last-child {
                margin-right: initial
            }

    .newmoc__tree .active__color--orange, .quick__moc .active__color--orange {
        cursor: pointer
    }

    .moc__component {
        float: left;
        width: 33%;
        height: 100%;
        text-align: center;
        padding: 10px;
        overflow: hidden;
        height: 217px
    }

    .moc__component_header {
        padding: 0px 10px 10px 10px
    }

    .moc__component_link {
        display: block;
        line-height: 25px;
        font-size: .8125rem
    }

    .newmoc__tree {
        padding: 10px;
        height: 374px;
        width: 35%
    }

        .newmoc__tree .jqx-icon-arrow-right, .jqx-icon-arrow-right-hover, .jqx-icon-arrow-right-selected {
            border-radius: 50%;
            width: 19px !important;
            height: 19px !important;
            text-align: center
        }

        .newmoc__tree .jqx-item {
            font-size: .8125rem;
            padding: 6px 6px 4px 6px !important
        }

    .moc__tree {
        padding: 0 10px;
        height: 374px
    }

        .moc__tree .jqx-icon-arrow-right, .jqx-icon-arrow-right-hover, .jqx-icon-arrow-right-selected {
            border-radius: 50%;
            width: 19px !important;
            height: 19px !important;
            text-align: center;
            margin-top: .25rem !important;
            position: relative
        }

        .moc__tree .jqx-item {
            font-size: .8125rem
        }

        .moc__tree .jqx-widget-content {
            border: 0 none !important
        }

    .moctree__dialog--left {
        width: 35%;
        overflow: hidden;
        min-height: 320px;
        max-height: 320px;
        float: left
    }

    .moctree__dialog--right {
        width: 65%;
        min-height: 320px;
        max-height: 320px;
        float: left
    }

    .moctree__tab--ul {
        padding: 0 10px
    }

    .moctree__tab--li {
        display: inline-block;
        width: 31.99%;
        padding: 10px;
        text-align: center
    }

    .moctree__dialog--pr {
        padding: 10px;
        font-size: .875rem
    }

    .moctree__dialog--left .jqx-tree-dropdown-root {
        width: 100% !important;
        min-width: initial !important
    }

    .moctree__tab--a {
        font-size: .875rem
    }

    .moctree__search--box {
        padding: 10px
    }

    .moctree__search {
        position: relative
    }

        .moctree__search .ff {
            height: 30px;
            padding: 0 10px
        }

    .moctree__search--icon {
        position: absolute;
        top: 0;
        margin-top: 6px;
        right: 0;
        font-size: 18px;
        transform: translate(-50%, 0)
    }

    .moc-ui-dialog .ui-dialog .ui-dialog-buttonpane {
        text-align: center !important;
        width: 100%;
        bottom: 10px;
        overflow: hidden
    }

        .moc-ui-dialog .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
            float: initial !important
        }

    .moc-ui-dialog .ui-dialog {
        height: 460px !important;
        min-height: 460px;
        border-radius: 0 !important
    }

    .moc__component_scroll {
        padding: 10px
    }

    .ui-moc-overlay {
        opacity: initial !important;
        background-color: rgba(0,0,0,0.6) !important;
        background-image: initial !important
    }

    .quick__moc {
        max-width: 401px !important;
        min-width: 400px !important;
        border: 0 none !important;
        min-height: 480px
    }

        .quick__moc .quick--webpd .bg-white {
            width: 100% !important
        }

            .quick__moc .quick--webpd .bg-white flexbox-row.items-center.bb.b--light-gray.pb2 {
                padding-top: .5rem
            }

        .quick__moc .base-background--white {
            box-shadow: none !important;
            -webkit-box-shadow: none !important;
            -moz-box-shadow: none !important;
            -o-box-shadow: none !important
        }

        .quick__moc .heading-box .heading-text {
            white-space: initial !important;
            text-overflow: initial !important;
            overflow: initial !important
        }

        .quick__moc .heading-icon {
            display: none !important
        }

        .quick__moc .webui-popover .webui-popover-content {
            padding: 0 14px !important
        }

    .mocplus {
        padding-top: 10px !important;
        padding-right: 10 !important
    }

        .mocplus a {
            margin-left: 5px;
            display: inline-block
        }

            .mocplus a .circle__plus {
                display: inline-block;
                text-align: center
            }

    .circle__cross--grey {
        margin-top: -14px !important;
        margin-right: -10px !important;
        border-radius: 50% !important;
        display: block !important;
        width: 27px !important;
        height: 27px !important;
        font-size: 30px !important;
        overflow: hidden !important;
        line-height: 25px !important;
        text-align: center !important
    }

    .newmoc__tree .quick--webpd .webui-popover-content, .quick__moc .quick--webpd .webui-popover-content {
        padding: 0 14px !important;
        overflow: hidden !important
    }

    #js-mocgroup .form--content .label--text {
        text-align: right !important;
        padding-top: 10px !important;
        padding-right: 0 !important
    }

    #js-mocgroup .overlay--form-container {
        height: 377px !important;
        min-width: 567px
    }

        #js-mocgroup .overlay--form-container .row {
            margin-bottom: 10px !important
        }

    .moctree__search ::-webkit-input-placeholder {
        font-size: 12px
    }

    .moctree__search :-moz-placeholder {
        font-size: 12px
    }

    .moctree__search ::-moz-placeholder {
        font-size: 12px
    }

    .moctree__search :-ms-input-placeholder {
        font-size: 12px
    }

    .quick__moc .jqx-tree-item {
        padding: 6px 8px 4px 6px !important
    }

        .quick__moc .jqx-tree-item img {
            margin-right: 7px !important
        }

    .notab__exist {
        min-width: 200px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        font-size: 20px;
        opacity: .8;
        max-width: 200px
    }

    .moh_object_image {
        border-radius: 50% !important;
        height: 20px !important;
        width: 20px !important
    }

    .newmoc__tree .jqx-tree-item-li, .quick__moc .jqx-tree-item-li {
        padding: 3px 5px;
        line-height: 1.3
    }

    .newmoc__tree .jqx-tree-item-arrow-collapse, .newmoc__tree .jqx-tree-item-arrow-expand, .quick__moc .jqx-tree-item-arrow-collapse, .quick__moc .jqx-tree-item-arrow-expand {
        margin-top: 3px !important;
        border-radius: 50%;
        width: 19px !important;
        height: 19px !important;
        background-position: center;
        background-repeat: no-repeat;
        position: relative
    }

        .newmoc__tree .jqx-tree-item-arrow-collapse:before, .newmoc__tree .jqx-tree-item-arrow-expand:before, .quick__moc .jqx-tree-item-arrow-collapse:before, .quick__moc .jqx-tree-item-arrow-expand:before {
            content: '';
            position: absolute;
            top: 1px;
            height: 44px;
            width: 38px;
            left: 1px
        }

    .newmoc__tree .jqx-tree-dropdown-root, .quick__moc .jqx-tree-dropdown-root {
        width: 100% !important
    }

        .newmoc__tree .jqx-tree-dropdown-root .jqx-tree-dropdown .jqx-tree-item-li, .quick__moc .jqx-tree-dropdown-root .jqx-tree-dropdown .jqx-tree-item-li {
            border-bottom: 0 !important
        }

    #moctree_45 ul#Tab_45, .moctree__tab--ul {
        display: flex;
        justify-content: space-around
    }

        #moctree_45 ul#Tab_45 li.card__tab--li, .moctree__tab--ul li.card__tab--li {
            text-align: center;
            padding: 14px 10px;
            font-size: .8125rem;
            cursor: pointer
        }
}

.header {
    width: 100%;
    padding-left: 1rem;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    height: 47px
}

.logoicons {
    display: flex;
    align-items: center
}

    .logoicons a {
        margin-right: 12px;
        font-size: 20px
    }

.header {
    border-bottom: none !important;
    display: flex !important;
    width: 100% !important;
    padding-bottom: 0 !important
}

.header-logo {
    text-align: left;
    height: 30px
}

.header-logo-inner {
    display: flex;
    align-items: center;
    height: 30px
}

    .header-logo-inner img {
        height: 30px
    }

    .header-logo-inner .link {
        position: absolute;
        left: 16px;
        top: 7px
    }

        .header-logo-inner .link i {
            font-size: 28px
        }

.header-search {
    flex-grow: 0;
    max-width: 26rem;
    width: -webkit-calc(100% - 26rem);
    width: -moz-calc(100% - 26rem);
    width: -ms-calc(100% - 26rem);
    width: -o-calc(100% - 26rem);
    width: calc(100% - 26rem)
}

    .header-search .field .textbox {
        font-style: italic
    }

    .header-search .field .textbox, .header-search .field .selectbox {
        font-size: .8125rem;
        line-height: 1.25;
        min-height: 30px;
        height: 30px;
        padding: 0 .5rem;
        min-width: 150px;
        padding-right: 32px
    }

    .header-search .input-icon {
        border-left: 0;
        font-size: .75rem
    }

.header-search__selectbox {
    border-right-style: solid;
    border-right-width: 1px;
    width: 8rem;
    border-color: #cccccc;
    min-width: 151px;
    padding-left: 1px
}

.header-profile {
    display: flex;
    align-items: center
}

.header__login-profile {
    position: absolute;
    right: 2px;
    z-index: 9999;
    top: 70px;
    width: 260px;
    opacity: 0;
    visibility: hidden
}

    .header__login-profile.isActive {
        opacity: 1;
        visibility: visible;
        -moz-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        -webkit-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
        top: 42px
    }

.h-line {
    height: .125rem;
    width: 100%
}

.alert__circle {
    position: absolute;
    border-radius: 3px;
    font-size: 0.75rem;
    top: 3px;
    right: 0.875rem;
    height: 16px;
    line-height: 1rem;
    padding: 0 5px
}

.notification.isActive {
    opacity: 1;
    visibility: visible;
    top: 42px
}

.notification {
    position: absolute;
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    top: 70px;
    width: 20rem;
    right: 0;
    background-color: #fff;
    box-shadow: 0 2px 3px rgba(0,0,0,0.34);
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    transition: all 0.3s
}

    .notification:before {
        content: " ";
        position: absolute;
        width: 0;
        height: 0;
        top: -12px;
        right: 9px;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent
    }

.notifications__header {
    height: 40px;
    display: flex;
    align-items: center;
    font-size: 1rem;
    padding: 0 1rem;
    border-bottom: 1px solid #eaeaea
}

.notification-list__item {
    text-align: left;
    color: #5c5656;
    padding: .5rem 1rem;
    border-bottom: 1px solid #eee
}

    .notification-list__item:last-child {
        border-style: none;
        border-width: 0
    }

.list__item--read {
    opacity: 0.7
}

.notification-item {
    position: relative;
    display: block;
    width: 100%;
    overflow: hidden
}

    .notification-item:hover .notification__close {
        display: block
    }

.notification__close {
    display: none;
    position: absolute;
    z-index: 2;
    right: 2px;
    top: 1px
}

.notification__action {
    margin-top: .5rem
}

    .notification__action:empty {
        display: none
    }

.notification__action--list {
    display: inline-block;
    text-align: center;
    margin-right: .5rem
}

.notific__action--link {
    font-size: .75rem
}

.notification-row .notification-close {
    display: block;
    color: #999;
    position: absolute;
    right: -8px;
    font-size: 8px;
    top: 4px
}

.notification-row .notification__subject {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin-bottom: 4px;
    max-width: 90%
}

    .notification-row .notification__subject .notification__title {
        font-size: .875rem
    }

    .notification-row .notification__subject i {
        font-size: 18px;
        color: #2a2075
    }

.notification-row .notification__content {
    padding-left: 26px;
    font-size: .875rem;
    color: #5c5656
}

.notification-row .notification-author {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: .6875rem;
    padding: 12px 0 0 26px;
    color: #999
}

@media screen and (max-width: 1023px) {
    .header {
        padding-left: .5rem;
        padding-right: .5rem
    }

    .header-serach__selectbox {
        width: 4rem
    }
}

.header__notification {
    text-align: center;
    cursor: center;
    position: relative
}

    .header__notification .header__notification__icon {
        font-size: 1rem;
        color: #777
    }

.header__help .header__help-link {
    font-size: .9375rem;
    color: #777
}

.header-profile__userpic {
    font-size: .9375rem;
    color: #777
}

.header__logout .header__logout--icon {
    font-size: 21px;
    color: #ff4136
}

.header-profile__userpic.header__item {
    height: 2rem;
    width: 2rem;
    margin: 0 1rem
}

.header__item {
    width: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 42px
}

.profile-popup {
    display: flex;
    align-items: start;
    padding: 10px
}

    .profile-popup .profile__image {
        width: 64px;
        border: 2px solid #eee;
        line-height: 0;
        height: 64px;
        overflow: hidden
    }

        .profile-popup .profile__image img {
            width: 100%;
            height: 100%;
            border-radius: 100%
        }

    .profile-popup .profile__content {
        flex: 1;
        padding: 0 .5rem
    }

    .profile-popup .profile__name {
        font-size: .8125rem;
        margin-bottom: 5px
    }

    .profile-popup .profile__scope {
        display: flex;
        align-items: center;
        margin-bottom: 8px
    }

        .profile-popup .profile__scope .profile-scope__label {
            width: 54px;
            color: #5c5656;
            font-size: .75rem
        }

        .profile-popup .profile__scope .profile-scope__value {
            font-size: .75rem;
            flex: 1;
            padding-left: .5rem
        }

    .profile-popup .profile__role {
        display: flex;
        align-items: center;
        margin-top: 2px
    }

        .profile-popup .profile__role .profile-role__label {
            width: 54px;
            font-size: .75rem;
            color: #5c5656
        }

        .profile-popup .profile__role .profile-role__select {
            flex: 1
        }

            .profile-popup .profile__role .profile-role__select select {
                padding: 4px 0;
                font-size: .75rem;
                overflow: hidden;
                padding-right: 24px;
                height: 34px;
                padding-left: .5rem
            }

.setuplink {
    border-top: 1px solid #eaeaea;
    display: flex;
    padding: 6px 0 0;
    justify-content: space-between;
    flex-direction: column
}

.setuplink__item {
    font-size: .8125rem;
    padding: 6px 10px;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    transition: all 0.3s
}

    .setuplink__item.setuplink__item--logout {
        padding: 10px;
        background: #fff;
        margin-top: 6px;
        border-top: 1px solid #eaeaea;
        color: #ff4136;
        background: rgba(241,241,241,0.25)
    }

.teamtree.isActive {
    top: 42px;
    opacity: 1;
    visibility: visible;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    transition: all 0.3s
}

.teamtree {
    position: absolute;
    z-index: 500;
    top: 70px;
    right: 2px;
    width: 320px;
    opacity: 0;
    visibility: hidden
}

    .teamtree .teamtree__header-close {
        font-size: 10px
    }

    .teamtree .teamtree__header {
        height: 48px;
        padding: 0 1rem;
        display: flex;
        align-items: center;
        justify-content: space-between
    }

.team-list-title {
    display: flex;
    align-items: center
}

.hideTree {
    display: none;
    margin-left: 1rem
}

.showTree {
    display: block;
    margin-left: 1rem
}

.paneltreeWatchSpan {
    width: 12px;
    height: 12px;
    margin-right: .5rem
}

.collapseData {
    width: 12px;
    height: 12px;
    margin-right: .5rem;
    cursor: pointer;
    position: relative
}

    .collapseData:after {
        font-family: "fontello";
        content: "\e9f3";
        position: absolute;
        left: 0;
        top: 0;
        font-size: .75rem
    }

.expandData {
    width: 12px;
    height: 12px;
    margin-right: .5rem;
    cursor: pointer;
    position: relative
}

    .expandData:after {
        font-family: "fontello";
        content: "\e9d2";
        position: absolute;
        left: 0;
        top: 0;
        font-size: .75rem
    }

.teamtree__profile {
    display: flex;
    align-items: center;
    padding: .5rem 1rem;
    background: #f8f8f8;
    border-bottom: 1px solid #eaeaea
}

.teamuser__img {
    width: 50px;
    height: 50px;
    border-radius: 100%;
    overflow: hidden;
    margin-right: .75rem
}

    .teamuser__img .teamuser__imgCircle {
        height: 50px;
        display: block
    }

        .teamuser__img .teamuser__imgCircle .teamuser-img {
            height: 50px
        }

.teamuser--name {
    flex: 1
}

.teamtree-scroll {
    max-height: 280px;
    overflow: auto;
    padding: .5rem 1rem
}

.teamtree .treeWatchContentDiv {
    display: flex;
    margin-bottom: 6px
}

    .teamtree .treeWatchContentDiv img {
        width: 30px;
        height: 30px;
        margin-right: 10px;
        border-radius: 100%
    }

    .teamtree .treeWatchContentDiv span {
        display: inline-flex;
        align-items: center;
        font-size: .875rem
    }

.teamtree .jqx-listing {
    flex: 1
}

.profilescope {
    border-top: 1px solid #eaeaea;
    padding: 6px 0
}

    .profilescope .profilescopr-row {
        display: flex;
        align-items: center;
        font-size: .8125rem
    }

        .profilescope .profilescopr-row .profilescope__label {
            padding: 6px 10px;
            flex: 1;
            max-width: 50%
        }

        .profilescope .profilescopr-row .profilescope__value {
            flex: 1;
            font-family: "CRMSansSemiBold",Arial,sans-serif;
            color: #333
        }

.header-profile__roles--select {
    font-size: .75rem
}

.appLauncher-link {
    font-size: 22px;
    margin-right: 10px;
    color: #5c5656
}

    .appLauncher-link:hover {
        color: #00a99d
    }

.appLauncherContainer.isOpen {
    transform: translate(-50%, -50%);
    transform: -webkit-translate(-50%, -50%);
    transform: -ms-translate(-50%, -50%);
    opacity: 1;
    visibility: visible
}

.appLauncherContainer {
    position: fixed;
    background: #f2f2f2;
    box-shadow: 0 0 0 14000px rgba(0,0,0,0.6);
    position: fixed;
    position: -ms-device-fixed;
    z-index: 1000;
    width: 100%;
    max-width: 1000px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    transform: -webkit-translate(-50%, -50%);
    transform: -ms-translate(-50%, -50%);
    border-radius: 4px;
    opacity: 0;
    visibility: hidden;
    -moz-transition: all 0.4s;
    -o-transition: all 0.4s;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
    min-height: 300px
}

    .appLauncherContainer .appLauncher__header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        height: 4rem;
        padding: 0 20px;
        border-bottom: 2px solid #ddd;
        background: #fff
    }

        .appLauncherContainer .appLauncher__header .appLauncher__title {
            color: #333;
            font-size: 18px
        }

        .appLauncherContainer .appLauncher__header .appLauncher__close {
            cursor: pointer
        }

        .appLauncherContainer .appLauncher__header .appLauncherSearch {
            width: 40%;
            border: 1px solid #ccc;
            border-radius: 4px;
            height: 32px;
            display: flex;
            align-items: center;
            font-size: 16px
        }

            .appLauncherContainer .appLauncher__header .appLauncherSearch .textbox {
                border: 0;
                font-size: 14px;
                text-transform: capitalize
            }

            .appLauncherContainer .appLauncher__header .appLauncherSearch i {
                color: #999;
                margin: 12px
            }

            .appLauncherContainer .appLauncher__header .appLauncherSearch:focus-within {
                border-color: #00a99d
            }

    .appLauncherContainer .appLauncher__content {
        display: flex;
        flex-wrap: wrap;
        padding: 10px;
        background: #f2f2f2;
        border-radius: 0 0 5px 5px
    }

        .appLauncherContainer .appLauncher__content .applauncher__item {
            padding: 10px;
            width: 33.33%
        }

            .appLauncherContainer .appLauncher__content .applauncher__item .appBox {
                width: 100%;
                min-height: 100%;
                display: flex;
                align-items: center;
                background: #fff;
                height: 90px;
                border-top: 3px solid;
                box-shadow: 1px 2px 3px rgba(0,0,0,0.16)
            }

                .appLauncherContainer .appLauncher__content .applauncher__item .appBox .appBox__icon {
                    width: 90px;
                    min-width: 90px;
                    border-right: 1px solid #ddd;
                    height: 86px;
                    background: #fff;
                    border-radius: 4px 0 0 4px;
                    color: #5c5656;
                    font-size: 43px;
                    display: flex;
                    align-items: center;
                    justify-content: center
                }

                .appLauncherContainer .appLauncher__content .applauncher__item .appBox .appBox__content {
                    padding: 12px
                }

                    .appLauncherContainer .appLauncher__content .applauncher__item .appBox .appBox__content .appBox__title {
                        color: #333;
                        font-size: 15px;
                        margin-bottom: 8px
                    }

                        .appLauncherContainer .appLauncher__content .applauncher__item .appBox .appBox__content .appBox__title:hover {
                            cursor: pointer;
                            color: #00a99d;
                            text-decoration: underline
                        }

                    .appLauncherContainer .appLauncher__content .applauncher__item .appBox .appBox__content .appBox__text {
                        font-size: 12px;
                        color: #5c5656;
                        line-height: 18px;
                        height: 38px;
                        overflow: hidden
                    }

            .appLauncherContainer .appLauncher__content .applauncher__item:nth-child(1) .appBox {
                border-color: #ffc107
            }

                .appLauncherContainer .appLauncher__content .applauncher__item:nth-child(1) .appBox .appBox__icon {
                    color: #ffc107
                }

            .appLauncherContainer .appLauncher__content .applauncher__item:nth-child(2) .appBox {
                border-color: #4caf50
            }

                .appLauncherContainer .appLauncher__content .applauncher__item:nth-child(2) .appBox .appBox__icon {
                    color: #4caf50
                }

            .appLauncherContainer .appLauncher__content .applauncher__item:nth-child(3) .appBox {
                border-color: #673ab7
            }

                .appLauncherContainer .appLauncher__content .applauncher__item:nth-child(3) .appBox .appBox__icon {
                    color: #673ab7
                }

            .appLauncherContainer .appLauncher__content .applauncher__item:nth-child(4) .appBox {
                border-color: #e91e63
            }

                .appLauncherContainer .appLauncher__content .applauncher__item:nth-child(4) .appBox .appBox__icon {
                    color: #e91e63
                }

            .appLauncherContainer .appLauncher__content .applauncher__item:nth-child(5) .appBox {
                border-color: #795548
            }

                .appLauncherContainer .appLauncher__content .applauncher__item:nth-child(5) .appBox .appBox__icon {
                    color: #795548
                }

            .appLauncherContainer .appLauncher__content .applauncher__item:nth-child(6) .appBox {
                border-color: #ff5722
            }

                .appLauncherContainer .appLauncher__content .applauncher__item:nth-child(6) .appBox .appBox__icon {
                    color: #ff5722
                }

.alert-shake {
    -moz-animation: shake 1.3s ease-in-out infinite;
    -o-animation: shake 1.3s ease-in-out infinite;
    -webkit-animation: shake 1.3s ease-in-out infinite;
    -ms-animation: shake 1.3s ease-in-out infinite;
    animation: shake 1.3s ease-in-out infinite
}

@keyframes shake {
    0%,100% {
        transform: rotateZ(0)
    }

    10% {
        transform: rotateZ(-30deg)
    }

    20% {
        transform: rotateZ(15deg)
    }

    30% {
        transform: rotateZ(-10deg)
    }

    40% {
        transform: rotateZ(7.5deg)
    }

    50% {
        transform: rotateZ(-6deg)
    }

    60% {
        transform: rotateZ(5deg)
    }

    70% {
        transform: rotateZ(-4.28571deg)
    }

    80% {
        transform: rotateZ(3.75deg)
    }

    90% {
        transform: rotateZ(-3.33333deg)
    }
}

.crm-search-control {
    flex-grow: 0;
    max-width: 30rem;
    width: -webkit-calc(100% - 30rem);
    width: -moz-calc(100% - 30rem);
    width: -ms-calc(100% - 30rem);
    width: -o-calc(100% - 30rem);
    width: calc(100% - 30rem);
    display: flex;
    align-items: center
}

.crm-search-control__item:first-child .field {
    max-width: 150px;
    min-width: 150px;
    width: 100%;
    border-radius: 3px 0 0 3px;
    border-right: 0
}

.crm-search-control__item:nth-child(2) .field {
    max-width: 250px;
    min-width: 250px;
    width: 100%;
    border-radius: 0 3px 3px 0
}

.crm-search-control__item:last-child a.button-icon-text {
    margin-left: .75rem
}

.crm-search-control__item .field:focus-within {
    border: 1px solid #ccc
}

.crm-search-control__item .field .textbox {
    font-style: italic
}

.crm-search-control__item .field .textbox, .crm-search-control__item .field .selectbox {
    font-size: .8125rem;
    line-height: 1.25;
    min-height: 30px;
    height: 30px;
    padding: 0 .5rem;
    min-width: 150px;
    padding-right: 32px
}

.crm-search-control__item .input-icon {
    border-left: 0;
    font-size: .75rem
}

.profile__content .profile-content__item {
    padding: 4px 0
}

    .profile__content .profile-content__item .form-element {
        display: flex;
        align-items: center;
        width: 100%
    }

    .profile__content .profile-content__item .form-element__label {
        font-size: .75rem;
        padding-right: .75rem;
        color: #5c5656
    }

    .profile__content .profile-content__item .form-element__control span {
        font-size: .9375rem;
        color: #333
    }

.profile__content .profile-content--userRole .field {
    border: 0;
    padding: 0;
    min-height: 0;
    max-height: 100%;
    height: auto
}

    .profile__content .profile-content--userRole .field .selectbox {
        padding-left: 0;
        padding-top: 0;
        padding-bottom: 0;
        min-height: 0;
        height: auto
    }

.advance-search-control {
    width: 100%;
    max-width: 66%;
    display: flex;
    align-items: center
}

    .advance-search-control #newobject {
        padding: 0
    }

    .advance-search-control .setupBodyContainer {
        display: flex;
        align-items: center
    }

        .advance-search-control .setupBodyContainer .react-form.form {
            width: -webkit-calc(100% - 100px);
            width: -moz-calc(100% - 100px);
            width: -ms-calc(100% - 100px);
            width: -o-calc(100% - 100px);
            width: calc(100% - 100px)
        }

    .advance-search-control .object-action-btn, .advance-search-control .react-form-btns {
        position: relative !important;
        width: auto
    }

        .advance-search-control .object-action-btn .button-icon-text, .advance-search-control .react-form-btns .button-icon-text {
            min-width: 34px;
            color: #fff
        }

        .advance-search-control .object-action-btn .object-action-inner, .advance-search-control .react-form-btns .object-action-inner {
            background-color: transparent !important;
            border-top: 0;
            box-shadow: none;
            border: 0 !important;
            display: block;
            padding: 0 !important;
            text-align: left
        }

            .advance-search-control .object-action-btn .object-action-inner a, .advance-search-control .react-form-btns .object-action-inner a {
                height: 36px;
                padding: 7px 12px;
                margin: 0;
                border: 1px solid #ccc;
                border-radius: 3px;
                min-width: 34px
            }

                .advance-search-control .object-action-btn .object-action-inner a i, .advance-search-control .react-form-btns .object-action-inner a i {
                    margin: 0;
                    display: block
                }

                    .advance-search-control .object-action-btn .object-action-inner a i:before, .advance-search-control .react-form-btns .object-action-inner a i:before {
                        font-family: "fontello";
                        content: '\ea63'
                    }

                .advance-search-control .object-action-btn .object-action-inner a span, .advance-search-control .react-form-btns .object-action-inner a span {
                    display: none
                }

    .advance-search-control .layout-container.form {
        margin: 0
    }

        .advance-search-control .layout-container.form .detailtab {
            border: 0 !important;
            box-shadow: none !important
        }

            .advance-search-control .layout-container.form .detailtab .detail-tab, .advance-search-control .layout-container.form .detailtab .formSwitcher {
                display: none !important
            }

            .advance-search-control .layout-container.form .detailtab .tab-content {
                min-height: 0
            }

                .advance-search-control .layout-container.form .detailtab .tab-content .tab__section {
                    display: none
                }

                .advance-search-control .layout-container.form .detailtab .tab-content .section-contents {
                    padding: 0;
                    display: flex
                }

                    .advance-search-control .layout-container.form .detailtab .tab-content .section-contents .form-row {
                        width: 100%
                    }

                        .advance-search-control .layout-container.form .detailtab .tab-content .section-contents .form-row .form-element--group {
                            max-width: 100% !important;
                            padding: 0;
                            width: 100%;
                            padding-right: 1rem
                        }

                            .advance-search-control .layout-container.form .detailtab .tab-content .section-contents .form-row .form-element--group .form-element__label {
                                display: none !important
                            }

                        .advance-search-control .layout-container.form .detailtab .tab-content .section-contents .form-row:first-child:nth-last-child(1) {
                            max-width: 100%
                        }

                        .advance-search-control .layout-container.form .detailtab .tab-content .section-contents .form-row:first-child:nth-last-child(2), .advance-search-control .layout-container.form .detailtab .tab-content .section-contents .form-row:first-child:nth-last-child(2) ~ .form-row {
                            max-width: 50%
                        }

                        .advance-search-control .layout-container.form .detailtab .tab-content .section-contents .form-row:first-child:nth-last-child(3), .advance-search-control .layout-container.form .detailtab .tab-content .section-contents .form-row:first-child:nth-last-child(3) ~ .form-row {
                            max-width: 33.33%
                        }

                        .advance-search-control .layout-container.form .detailtab .tab-content .section-contents .form-row:first-child:nth-last-child(4), .advance-search-control .layout-container.form .detailtab .tab-content .section-contents .form-row:first-child:nth-last-child(4) ~ .form-row {
                            max-width: 25%
                        }

                        .advance-search-control .layout-container.form .detailtab .tab-content .section-contents .form-row:first-child:nth-last-child(5), .advance-search-control .layout-container.form .detailtab .tab-content .section-contents .form-row:first-child:nth-last-child(5) ~ .form-row {
                            max-width: 20%
                        }

.page-header {
    padding: 12px 0;
    position: relative;
    z-index: 100;
    max-width: 1170px;
    margin: -1rem auto 0 auto
}

.page-title-row {
    flex: 1;
    display: flex;
    align-items: center;
    flex-direction: row
}

    .page-title-row .page-title-row-box--lt {
        flex: 1
    }

    .page-title-row .page-title-row-box--rt {
        text-align: right
    }

    .page-title-row .page-title-heading {
        display: flex;
        align-items: center
    }

        .page-title-row .page-title-heading .title-heading {
            font-family: "CRMSansRegular",Arial,sans-serif,Arial,sans-serif;
            font-size: 21px;
            line-height: 26px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis
        }

        .page-title-row .page-title-heading .icon-button {
            min-height: 30px
        }

            .page-title-row .page-title-heading .icon-button > div.page-title__iconcon:first-child {
                margin-left: 1.5rem
            }

        .page-title-row .page-title-heading .page-title__iconcon, .page-title-row .page-title-heading .page-title__link {
            vertical-align: middle;
            margin-left: .5rem
        }

            .page-title-row .page-title-heading .page-title__iconcon > a, .page-title-row .page-title-heading .page-title__link > a {
                display: flex;
                justify-content: center;
                align-items: center
            }

            .page-title-row .page-title-heading .page-title__iconcon .page-title__icon, .page-title-row .page-title-heading .page-title__iconcon .icon, .page-title-row .page-title-heading .page-title__link .page-title__icon, .page-title-row .page-title-heading .page-title__link .icon {
                border-radius: 9999px;
                font-size: .9375rem;
                padding: .5rem
            }

.page-header__text {
    font-size: .8125rem;
    color: #5c5656;
    line-height: 20px
}

.page-header .page-title-row .pricemorelink.singleButton {
    position: absolute;
    display: block !important;
    right: 0;
    top: -16px
}

    .page-header .page-title-row .pricemorelink.singleButton .more-listcon {
        border-top: 0;
        box-shadow: none
    }

        .page-header .page-title-row .pricemorelink.singleButton .more-listcon:after {
            display: none
        }

        .page-header .page-title-row .pricemorelink.singleButton .more-listcon .more-dropdown__list {
            padding: 0
        }

            .page-header .page-title-row .pricemorelink.singleButton .more-listcon .more-dropdown__list a {
                height: auto;
                padding: 3px 16px;
                -moz-transition: all 0.3s;
                -o-transition: all 0.3s;
                -webkit-transition: all 0.3s;
                transition: all 0.3s
            }

                .page-header .page-title-row .pricemorelink.singleButton .more-listcon .more-dropdown__list a i {
                    display: none
                }

.bulkproduct .page-header {
    display: none !important
}

.PtbtnsBottom .caret--up {
    display: none
}

.page-title-row .PtbtnsBottom .caret--up {
    display: block
}

.new-edit .breadcrums {
    padding-top: .5rem
}

.breadcrums {
    padding: 0;
    font-size: .8125rem;
    list-style-type: none;
    position: relative;
    z-index: 1;
    padding-top: 0px
}

.breadcrums__link {
    position: relative;
    padding-right: 24px;
    font-size: .6875rem !important
}

    .breadcrums__link::after {
        content: "\e82e";
        position: absolute;
        right: 6px;
        font-family: "fontello";
        font-size: 8px;
        top: 3px
    }

    .breadcrums__link:last-child::after {
        content: ""
    }

footer {
    height: 44px
}

.scroll::-webkit-scrollbar-track {
    background-color: #6b6969
}

.scroll::-webkit-scrollbar {
    width: 8px;
    background-color: #eee
}

.scroll::-webkit-scrollbar-thumb {
    background-color: #ccc
}

.cloud-nav {
    min-width: 15rem;
    width: 15rem;
    background: #3d3d3d;
    padding-top: .5rem;
    padding-bottom: .5rem
}

@-webkit-keyframes setupAni {
    from {
        top: -60px
    }

    to {
        top: 0
    }
}

@keyframes setupAni {
    from {
        top: -60px
    }

    to {
        top: 0
    }
}

.cloud-nav-list {
    padding-top: 42px;
    position: relative
}

    .cloud-nav-list .cloud-nav-item.fixedPos:first-child {
        position: fixed;
        -webkit-animation: setupAni .2s linear;
        animation: setupAni .2s linear;
        border-bottom: 1px solid rgba(221,221,221,0.27)
    }

    .cloud-nav-list .cloud-nav-item:first-child {
        position: absolute;
        width: 240px;
        background: #3d3d3d;
        z-index: 20;
        top: 0px;
        left: 0
    }

.cloud-nav-item {
    width: 100%;
    font-size: .8125rem
}

    .cloud-nav-item:after {
        z-index: 2;
        top: .75rem
    }

.cloud-nav-item--active:after {
    transform: rotateX(180deg)
}

.cloud-nav-item__link {
    display: block;
    position: relative;
    padding: .75rem 1rem;
    margin-bottom: 1px
}

    .cloud-nav-item__link:after {
        content: "";
        height: 100%;
        left: 0;
        top: 0;
        position: absolute;
        width: 0px;
        -moz-transition: all 0.2s ease-in-out;
        -o-transition: all 0.2s ease-in-out;
        -webkit-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
        z-index: -1
    }

    .cloud-nav-item__link:hover:after {
        width: 100%;
        z-index: 1
    }

    .cloud-nav-item__link .icon {
        position: relative;
        z-index: 2;
        margin-right: .25rem
    }

    .cloud-nav-item__link.link--active:after {
        width: 100%;
        z-index: 1
    }

.cloud-nav-item__label {
    position: relative;
    z-index: 2
}

.cloud-submenu {
    display: none
}

.cloud-submenu__link {
    display: block;
    padding-top: .5rem;
    padding-bottom: .5rem;
    padding-right: .5rem;
    padding-left: 2.5rem;
    font-size: .8125rem
}

.cloud-submenu__icon {
    display: none
}

.cloudSearch {
    border-bottom: 1px solid #635d5d;
    padding-bottom: 8px;
    padding-left: 8px;
    padding-right: 8px
}

    .cloudSearch .field {
        border: 0 !important;
        color: #fff;
        background: rgba(0,0,0,0.32);
        border-radius: 0
    }

        .cloudSearch .field input.textbox {
            color: #fff;
            border: 1px solid rgba(99,95,95,0.63);
            border-radius: 0
        }

#fetchSubnav {
    border-top-left-radius: 23px;
    border-bottom-left-radius: 23px
}

.softphonemenu-cont {
    z-index: 1000;
    position: fixed;
    bottom: 135px;
    margin-top: -20px;
    right: 38px;
    padding: 0;
    border-radius: 50px
}

    .softphonemenu-cont.active-menu {
        padding: 0 22px;
        border: 0px
    }

        .softphonemenu-cont.active-menu .softphonemenu-xtr {
            display: inline-block
        }

        .softphonemenu-cont.active-menu a {
            border-radius: 0 !important;
            display: inline-block;
            width: auto !important
        }

        .softphonemenu-cont.active-menu #show-list-icon {
            border: 0px;
            margin-left: -3px
        }

            .softphonemenu-cont.active-menu #show-list-icon i:before {
                content: "\e871"
            }

    .softphonemenu-cont .softphonemenu-xtr {
        display: none
    }

        .softphonemenu-cont .softphonemenu-xtr a {
            margin-left: -3px !important;
            margin-right: 0;
            display: inline-block;
            width: auto !important
        }

    .softphonemenu-cont a {
        border-radius: 50%;
        display: inline-block;
        padding: 10px !important;
        width: auto !important
    }

        .softphonemenu-cont a .icon {
            font-size: 20px;
            display: inline-block
        }

.softphone-popup-cont {
    padding: 0px;
    z-index: 2000;
    display: none;
    border-radius: 10px;
    width: 275px;
    max-width: 275px;
    padding: 0px !important;
    height: auto;
    min-height: 380px;
    position: absolute;
    top: 50%;
    left: 10%
}

    .softphone-popup-cont#call-popup {
        cursor: move
    }

    .softphone-popup-cont#dialer-popup {
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%)
    }

    .softphone-popup-cont .popup-btn-close, .softphone-popup-cont .softphone-chat-window .popup-btn-minimize, .softphone-chat-window .softphone-popup-cont .popup-btn-minimize {
        position: absolute;
        top: 0px;
        right: 0px;
        z-index: 99;
        padding: 4px 10px
    }

        .softphone-popup-cont .popup-btn-close .icon, .softphone-popup-cont .softphone-chat-window .popup-btn-minimize .icon, .softphone-chat-window .softphone-popup-cont .popup-btn-minimize .icon {
            font-size: 10px
        }

    .softphone-popup-cont .popup-btn-minimize {
        position: absolute;
        top: 15px;
        right: 30px
    }

        .softphone-popup-cont .popup-btn-minimize .icon {
            font-size: 10px
        }

    .softphone-popup-cont#dialer-popup .popup-userimg-section {
        height: 80px
    }

    .softphone-popup-cont#dialer-popup .number-cont {
        position: relative;
        padding: 5px 0
    }

        .softphone-popup-cont#dialer-popup .number-cont p {
            font-size: 24px;
            font-family: "CRMSansSemiBold",Arial,sans-serif;
            text-align: center
        }

        .softphone-popup-cont#dialer-popup .number-cont .icon {
            right: 10px;
            top: 50%;
            font-size: .875rem;
            margin-top: -7px
        }

    .softphone-popup-cont#dialer-popup .dailer-pad-cont {
        padding: 15px 20px 5px
    }

        .softphone-popup-cont#dialer-popup .dailer-pad-cont li {
            width: 33%;
            float: left;
            text-align: center;
            margin-bottom: 10px
        }

            .softphone-popup-cont#dialer-popup .dailer-pad-cont li a {
                border-radius: 50%;
                font-family: "CRMSansSemiBold",Arial,sans-serif;
                font-size: 20px;
                display: inline-block;
                line-height: 35px;
                width: 40px;
                height: 40px
            }

    .softphone-popup-cont .white-band {
        position: absolute;
        top: 0px;
        height: 2rem;
        background: white;
        width: 100%;
        border-top-right-radius: 5px;
        border-top-left-radius: 5px
    }

        .softphone-popup-cont .white-band .selectbox-container {
            margin-top: .5rem
        }

        .softphone-popup-cont .white-band a {
            position: absolute;
            top: 0px;
            right: 0px
        }

            .softphone-popup-cont .white-band a span i {
                color: rgba(255,255,255,0.43);
                font-weight: 100
            }

                .softphone-popup-cont .white-band a span i.icon-cross {
                    color: #000
                }

.popup-userimg-section {
    position: relative;
    height: auto;
    width: 100%
}

    .popup-userimg-section .calling-icon {
        position: absolute;
        right: 63px;
        top: 88%;
        padding: 6px 1px;
        border-radius: 50%
    }

        .popup-userimg-section .calling-icon i {
            border-radius: 50%;
            padding: 3px;
            font-size: 1rem
        }

    .popup-userimg-section .userimg {
        width: 150px;
        height: 150px;
        border-radius: 50%;
        overflow: hidden;
        position: relative;
        top: 40%;
        left: 50%;
        margin-left: -75px
    }

        .popup-userimg-section .userimg img {
            width: 100%
        }

    .popup-userimg-section.call-log-custom .userimg {
        width: 100px;
        height: 100px;
        top: 0px;
        left: 0px;
        margin: 0 auto
    }

    .popup-userimg-section.call-log-custom .calling-icon {
        right: 76px;
        top: 80%
    }

.softphn-login .textbox-with-icon {
    margin: 20px 16px 0 20px
}

.softphn-login input {
    border-radius: 30px;
    border: 0px;
    background: rgba(0,0,0,0.38);
    color: #fff;
    border: 0 !important
}

.dialer-band {
    position: relative !important
}

.popup-call-detail {
    padding-top: 18px;
    padding-bottom: 10px;
    position: relative;
    display: none;
    float: left;
    text-align: center;
    width: 100%;
    margin: 0px
}

    .popup-call-detail.is-active {
        display: block
    }

    .popup-call-detail#callLog p {
        position: absolute;
        top: 30px;
        left: 13%;
        font-size: .875rem
    }

    .popup-call-detail#callLog .user-detail p {
        position: absolute;
        top: 40px;
        right: 3%;
        left: auto
    }

    .popup-call-detail#callLog .user-detail h2 {
        position: absolute;
        top: 20px;
        right: 3%;
        font-size: 1rem
    }

    .popup-call-detail#callLog .user-call-log {
        padding: 0 10px
    }

        .popup-call-detail#callLog .user-call-log li {
            clear: both
        }

            .popup-call-detail#callLog .user-call-log li label {
                width: 30%;
                float: left;
                padding: .5rem 0;
                padding-right: 10px
            }

            .popup-call-detail#callLog .user-call-log li .callLog-control-content {
                width: 70%;
                float: right;
                font-size: .75rem;
                margin-bottom: 10px
            }

                .popup-call-detail#callLog .user-call-log li .callLog-control-content input {
                    height: 30px
                }

                .popup-call-detail#callLog .user-call-log li .callLog-control-content textarea {
                    min-height: 40px
                }

        .popup-call-detail#callLog .user-call-log .fb {
            margin-bottom: 10px;
            margin-right: 0
        }

    .popup-call-detail#callLog .callLog-form-label {
        font-family: "CRMSansRegular",Arial,sans-serif;
        font-size: .75rem;
        font-weight: normal;
        line-height: 14px;
        padding: 9px 0;
        text-align: right
    }

    .popup-call-detail#smsLog p {
        position: absolute;
        top: 30px;
        left: 13%;
        font-size: .875rem
    }

    .popup-call-detail#smsLog .user-detail p {
        position: absolute;
        top: 40px;
        right: 3%;
        left: auto
    }

    .popup-call-detail#smsLog .user-detail h2 {
        position: absolute;
        top: 20px;
        right: 3%;
        font-size: 1rem
    }

    .popup-call-detail#smsLog .user-call-log {
        padding: 0 10px
    }

        .popup-call-detail#smsLog .user-call-log li {
            clear: both
        }

            .popup-call-detail#smsLog .user-call-log li label {
                width: 30%;
                float: left;
                padding: .5rem 0;
                padding-right: 10px
            }

            .popup-call-detail#smsLog .user-call-log li .callLog-control-content {
                width: 70%;
                float: right;
                font-size: .75rem;
                margin-bottom: 10px
            }

                .popup-call-detail#smsLog .user-call-log li .callLog-control-content input {
                    height: 30px
                }

                .popup-call-detail#smsLog .user-call-log li .callLog-control-content textarea {
                    min-height: 40px
                }

        .popup-call-detail#smsLog .user-call-log .fb {
            margin-bottom: 10px;
            margin-right: 0
        }

    .popup-call-detail#smsLog .callLog-form-label {
        font-family: "CRMSansRegular",Arial,sans-serif;
        font-size: .75rem;
        font-weight: normal;
        line-height: 14px;
        padding: 9px 0;
        text-align: right
    }

    .popup-call-detail#smsLog .fb.right {
        min-width: 95px
    }

    .popup-call-detail p {
        font-family: "CRMSansSemiBold",Arial,sans-serif;
        font-size: 18px;
        text-align: center
    }

    .popup-call-detail h2 {
        font-family: "CRMSansSemiBold",Arial,sans-serif;
        font-size: 36px;
        text-align: center;
        padding: 0;
        line-height: normal
    }

.popup-call-option {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px
}

    .popup-call-option li {
        cursor: pointer;
        float: left;
        width: 25%;
        margin: 0;
        text-align: center
    }

        .popup-call-option li:hover a, .popup-call-option li:active a, .popup-call-option li:focus a {
            border-top: 2px solid
        }

        .popup-call-option li.is-active a {
            border-top: 2px solid
        }

        .popup-call-option li a {
            padding: 5px 0 6px;
            display: block;
            border-top: 2px solid
        }

        .popup-call-option li i {
            font-size: 20px
        }

        .popup-call-option li span {
            text-align: center;
            font-size: .6875rem;
            padding: 6px 0 0;
            display: block
        }

.popup-call-btn {
    cursor: pointer;
    text-align: center;
    padding: 20px 0 5px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px
}

    .popup-call-btn i {
        font-size: 1rem;
        border-radius: 50%;
        padding: .5rem
    }

    .popup-call-btn span {
        font-family: "CRMSansSemiBold",Arial,sans-serif;
        display: block;
        padding: 10px 0 2px;
        font-size: .875rem
    }

#afterlogin .popup-call-option {
    position: absolute;
    bottom: 0px;
    width: 100%
}

.dialer--info {
    padding: 20px 0px 10px;
    text-align: center
}

    .dialer--info h2 {
        color: #003B39;
        font-size: .875rem;
        font-weight: 400;
        font-family: "CRMSansSemiBold",Arial,sans-serif;
        text-transform: uppercase;
        letter-spacing: 1px
    }

    .dialer--info p {
        font-size: 1rem;
        font-weight: 100;
        color: #005E58
    }

.callLog {
    font-size: .6875rem;
    padding: 10px
}

.cti-form {
    padding: 4px 12px
}

    .cti-form label.callLog-form-label {
        margin-bottom: 0px;
        display: block
    }

    .cti-form input, .cti-form textarea {
        height: 23px;
        background: transparent !important;
        border: 0 !important;
        border-bottom: 1px solid #cccccc !important;
        padding: 0 !important
    }

    .cti-form .textareaBox {
        min-height: 60px;
        resize: none
    }

.softPhone {
    position: fixed;
    top: 245px;
    right: 0px;
    width: 50px;
    z-index: 99 !important
}

    .softPhone ul li {
        margin-bottom: 10px;
        border-top-left-radius: 23px;
        border-bottom-left-radius: 23px;
        font-size: 1rem
    }

        .softPhone ul li a {
            display: flex;
            align-items: center;
            justify-content: space-between;
            width: 100%;
            padding: 15px 20px
        }

            .softPhone ul li a span {
                margin-left: 1rem !important
            }

        .softPhone ul li .fetch-sub-nav {
            position: absolute;
            right: 0;
            min-width: 200px;
            top: 54px;
            display: none
        }

            .softPhone ul li .fetch-sub-nav .fetch-content {
                text-align: center
            }

                .softPhone ul li .fetch-sub-nav .fetch-content .fb {
                    margin-top: 20px
                }

            .softPhone ul li .fetch-sub-nav .heading--sub-nav {
                height: 50px;
                padding: 15px 15px;
                -webkit-transition: all 0.2s ease-in-out;
                -moz-transition: all 0.2s ease-in-out;
                -o-transition: all 0.2s ease-in-out;
                transition: all 0.2s ease-in-out
            }

                .softPhone ul li .fetch-sub-nav .heading--sub-nav::first-letter {
                    text-transform: lowercase
                }

                .softPhone ul li .fetch-sub-nav .heading--sub-nav a {
                    margin: 0
                }

                    .softPhone ul li .fetch-sub-nav .heading--sub-nav a .icon {
                        float: right
                    }

        .softPhone ul li i {
            font-size: 20px
        }

.softPhone-popup {
    width: 300px;
    position: absolute;
    z-index: 21;
    top: 50%;
    left: 50%;
    margin: -243px 0 0 -130px
}

.softPhone-popup-header {
    margin-bottom: 20px
}

.softPhone-popup-search {
    margin-bottom: 22px;
    padding-left: 20px
}

    .softPhone-popup-search .icon {
        font-size: 18px;
        margin: 6px 3px;
        display: inline-block
    }

.softPhone-popup-items {
    overflow: hidden
}

    .softPhone-popup-items li {
        padding-top: 15px;
        padding-bottom: 15px;
        min-height: 50px;
        width: 33%;
        float: left;
        font-size: 24px;
        text-align: center
    }

        .softPhone-popup-items li span {
            padding: 15px 19px;
            font-size: .875rem
        }

.softPhone-popup .button-icon-text-list li {
    padding: 0px 5px
}

.softPhone-close {
    text-align: right;
    float: right;
    margin: 10px 10px 0 0;
    cursor: pointer
}

    .softPhone-close .icon {
        font-size: .875rem
    }

.cti-content {
    width: 100%;
    padding: 30px 0px;
    z-index: 10;
    height: 380px;
    position: absolute;
    border-radius: 10px;
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=12, Direction=90, Color=rgba(0,0,0,0.4))";
    -moz-box-shadow: 0 0 12px rgba(0,0,0,0.4);
    -webkit-box-shadow: 0 0 12px rgba(0,0,0,0.4);
    box-shadow: 0 0 12px rgba(0,0,0,0.4);
    filter: progid:DXImageTransform.Microsoft.Shadow Strength=12,Direction=90,Color=rgba(0,0,0,0.4)
}

.caller-img {
    position: relative;
    margin: 30px auto 0px auto;
    background-color: transparent;
    text-align: center;
    z-index: 3;
    float: left;
    width: 100%
}

    .caller-img .call--status {
        position: absolute;
        height: 75px;
        width: 75px;
        top: 0px;
        left: 100px;
        background: rgba(0,0,0,0.5);
        border-radius: 50%;
        text-align: center
    }

        .caller-img .call--status span {
            color: #fff;
            font-size: .6875rem;
            line-height: 76px
        }

.caller-img-circular {
    position: relative;
    border-radius: 50%;
    box-shadow: 0px 0px 0px 6px rgba(0,0,0,0.1),0px 0px 0px 14px rgba(0,0,0,0.22);
    height: 75px;
    width: 75px;
    display: inline-block;
    background: #fff
}

.active-call {
    border: 6px solid transparent;
    border-top: 6px solid #ff8330;
    border-radius: 200px;
    width: 85px;
    height: 85px;
    position: absolute;
    top: -6%;
    left: 95px;
    z-index: 99
}

@keyframes spin {
    0% {
        -webkit-transform: rotateZ(0deg)
    }

    100% {
        -webkit-transform: rotateZ(360deg)
    }
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotateZ(0deg)
    }

    100% {
        -webkit-transform: rotateZ(360deg)
    }
}

.caller-info {
    color: #fff;
    margin-top: 80px
}

    .caller-info i, .caller-info h3, .caller-info p {
        display: inline-block
    }

    .caller-info i {
        font-size: 30px;
        margin-right: 15px
    }

.caller-name, .call-type {
    font-size: 27px;
    margin-right: 10px !important;
    text-align: center;
    color: #fff
}

.call-type {
    font-weight: bold
}

.pick-call, .end-call, hold-call {
    width: 30px;
    height: 30px;
    z-index: 200
}

    .pick-call i, .end-call i, .hold-call i {
        padding: .5rem;
        border-radius: 50%;
        color: #fff;
        font-size: .8125rem;
        vertical-align: middle
    }

.end-call {
    top: 2rem;
    right: 76px;
    position: absolute
}

.pick-call {
    top: 2rem;
    right: 76px;
    position: absolute
}

    .pick-call i {
        background-color: red
    }

.hold-call {
    top: 2rem;
    left: 76px;
    z-index: 200;
    position: absolute
}

    .hold-call i {
        background-color: #F99A00
    }

.rotate-90 {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg)
}

.end-call i {
    background-color: #f44336
}

canvas {
    position: absolute;
    top: 0;
    left: 0
}

.softphone-popup-cont.dialer-cont {
    display: none;
    width: 300px;
    height: auto;
    position: absolute;
    top: 50%;
    left: 5%
}

    .softphone-popup-cont.dialer-cont#dialer-popup {
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%)
    }

.popup-btn-minimize {
    position: absolute;
    top: 15px;
    right: 30px
}

    .popup-btn-minimize .icon {
        font-size: .6875rem
    }

#dialer-popup .popup-userimg-section {
    height: 80px
}

#dialer-popup .number-cont {
    position: relative;
    padding: 5px 0
}

    #dialer-popup .number-cont p {
        font-size: 24px;
        font-family: "CRMSansSemiBold",Arial,sans-serif;
        text-align: center
    }

    #dialer-popup .number-cont .icon {
        right: 10px;
        top: 50%;
        font-size: .875rem;
        margin-top: -7px
    }

#dialer-popup .dailer-pad-cont {
    padding: 15px 20px 5px
}

    #dialer-popup .dailer-pad-cont li {
        width: 33%;
        float: left;
        text-align: center;
        margin-bottom: 10px
    }

        #dialer-popup .dailer-pad-cont li a {
            border-radius: 50%;
            font-family: "CRMSansSemiBold",Arial,sans-serif;
            font-size: 20px;
            display: inline-block;
            line-height: 35px;
            width: 40px;
            height: 40px
        }

.softphone-chat-window {
    margin-left: -449px;
    left: 50%;
    top: 102px;
    border-radius: 0 !important;
    z-index: 99999
}

    .softphone-chat-window .popup-btn-close, .softphone-chat-window .popup-btn-minimize {
        font-size: -.125rem
    }

.sp-left-box {
    width: 28.5%;
    float: left
}

    .sp-left-box .sp-left-contact {
        width: 100%;
        position: relative
    }

        .sp-left-box .sp-left-contact .sp-left-bar {
            padding: 15px;
            float: left;
            width: 100%
        }

            .sp-left-box .sp-left-contact .sp-left-bar .lp-img {
                display: block;
                float: left;
                margin-right: .5rem;
                width: 50px;
                height: 50px;
                overflow: hidden
            }

                .sp-left-box .sp-left-contact .sp-left-bar .lp-img img {
                    width: 100%
                }

            .sp-left-box .sp-left-contact .sp-left-bar .lp-name, .sp-left-box .sp-left-contact .sp-left-bar .lp-status {
                display: block;
                padding: 5px 0 0;
                font-size: .875rem
            }

        .sp-left-box .sp-left-contact .sp-user-box {
            padding: 0;
            margin: 0 auto
        }

            .sp-left-box .sp-left-contact .sp-user-box .sp-search-bar {
                padding-left: 10px;
                width: 100%;
                margin: 0 auto
            }

                .sp-left-box .sp-left-contact .sp-user-box .sp-search-bar .sp-chat-search {
                    height: 25px;
                    border: 0px;
                    width: 87%;
                    display: inline-block
                }

                .sp-left-box .sp-left-contact .sp-user-box .sp-search-bar .icon-search2 {
                    font-size: 18px;
                    cursor: pointer
                }

            .sp-left-box .sp-left-contact .sp-user-box .sp-top-tab {
                margin: 0px 0 10px 0;
                font-size: 0
            }

                .sp-left-box .sp-left-contact .sp-user-box .sp-top-tab li {
                    display: inline-block;
                    width: 50%
                }

                    .sp-left-box .sp-left-contact .sp-user-box .sp-top-tab li a {
                        display: block;
                        line-height: 30px;
                        text-align: center
                    }

            .sp-left-box .sp-left-contact .sp-user-box .sp-users {
                margin: 0;
                height: 351px
            }

                .sp-left-box .sp-left-contact .sp-user-box .sp-users li {
                    padding: 5px 0 5px 5px;
                    overflow: hidden;
                    cursor: pointer;
                    position: relative
                }

                    .sp-left-box .sp-left-contact .sp-user-box .sp-users li .sp-user-img {
                        width: 50px;
                        height: 50px;
                        display: block;
                        overflow: hidden;
                        float: left
                    }

                        .sp-left-box .sp-left-contact .sp-user-box .sp-users li .sp-user-img img {
                            width: 100%
                        }

                    .sp-left-box .sp-left-contact .sp-user-box .sp-users li .sp-user-name {
                        display: inline-block;
                        line-height: 50px;
                        padding-left: 5px;
                        width: 140px;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        white-space: nowrap
                    }

                    .sp-left-box .sp-left-contact .sp-user-box .sp-users li .user-chat-notification {
                        position: absolute;
                        top: 7px;
                        right: 7px;
                        min-width: 20px;
                        height: 20px;
                        line-height: 20px;
                        font-size: .6875rem;
                        text-align: center
                    }

                    .sp-left-box .sp-left-contact .sp-user-box .sp-users li .user-chat-time {
                        position: absolute;
                        bottom: 7px;
                        right: 2px;
                        width: auto
                    }

                    .sp-left-box .sp-left-contact .sp-user-box .sp-users li .user-ol-status {
                        position: absolute;
                        bottom: 7px;
                        left: 41px;
                        width: 10px;
                        height: 10px
                    }

        .sp-left-box .sp-left-contact .sp-chat-status {
            width: 100%;
            position: relative
        }

            .sp-left-box .sp-left-contact .sp-chat-status span {
                width: 12px;
                height: 12px;
                display: inline-block;
                margin-right: 7px
            }

            .sp-left-box .sp-left-contact .sp-chat-status #sp-status {
                width: 170px;
                height: 30px;
                position: relative;
                padding: 10px;
                cursor: pointer
            }

                .sp-left-box .sp-left-contact .sp-chat-status #sp-status:before {
                    top: 14px;
                    right: 0px;
                    border: solid transparent;
                    content: " ";
                    height: 0;
                    width: 0;
                    position: absolute;
                    pointer-events: none;
                    border-width: 7px;
                    transform: rotate(180deg)
                }

            .sp-left-box .sp-left-contact .sp-chat-status .sp-status-icons {
                width: 130px;
                height: auto;
                position: absolute;
                top: 37px;
                left: 42px;
                z-index: 999
            }

                .sp-left-box .sp-left-contact .sp-chat-status .sp-status-icons div {
                    cursor: pointer;
                    padding: 10px;
                    display: none
                }

                    .sp-left-box .sp-left-contact .sp-chat-status .sp-status-icons div:first-child:before {
                        top: -20px;
                        left: 5px;
                        border: solid transparent;
                        content: " ";
                        height: 0;
                        width: 0;
                        position: absolute;
                        pointer-events: none;
                        border-width: 10px
                    }

.sp-right-box {
    width: 71%;
    float: right;
    min-height: 500px;
    position: relative
}

    .sp-right-box .sp-chat-title {
        padding: 15px;
        overflow: hidden;
        overflow: overlay
    }

        .sp-right-box .sp-chat-title .sp-user-profile {
            width: 70%
        }

            .sp-right-box .sp-chat-title .sp-user-profile .sp-rt-img {
                float: left;
                display: block;
                width: 50px;
                height: 50px;
                overflow: hidden
            }

                .sp-right-box .sp-chat-title .sp-user-profile .sp-rt-img img {
                    width: 100%
                }

            .sp-right-box .sp-chat-title .sp-user-profile .sp-rt-txt {
                line-height: 1rem;
                padding: 10px 0px 0px 10px;
                display: table-cell !important;
                vertical-align: middle
            }

        .sp-right-box .sp-chat-title .sp-right-nav {
            padding: 20px 0 0 0;
            margin-right: -10px
        }

            .sp-right-box .sp-chat-title .sp-right-nav ul li {
                padding: 0px;
                margin: 0 5px;
                display: inline-block;
                height: 30px;
                width: 30px;
                text-align: center;
                display: inline-table
            }

                .sp-right-box .sp-chat-title .sp-right-nav ul li a {
                    vertical-align: middle;
                    display: table-cell
                }

                    .sp-right-box .sp-chat-title .sp-right-nav ul li a .icon {
                        font-size: 1rem
                    }

    .sp-right-box .sp-chat-box {
        height: 355px;
        padding: 20px
    }

        .sp-right-box .sp-chat-box .sp-chat-me {
            width: 90%;
            min-height: 50px;
            position: relative;
            margin-left: 40px;
            padding: 10px;
            margin-bottom: 15px
        }

            .sp-right-box .sp-chat-box .sp-chat-me:before {
                top: 26px;
                left: -13px;
                content: " ";
                height: 0;
                width: 0;
                position: absolute;
                pointer-events: none;
                border-width: 6px;
                transform: rotate(270deg)
            }

            .sp-right-box .sp-chat-box .sp-chat-me:after {
                top: 26px;
                left: -12px;
                content: " ";
                height: 0;
                width: 0;
                position: absolute;
                pointer-events: none;
                border-width: 6px;
                transform: rotate(270deg)
            }

            .sp-right-box .sp-chat-box .sp-chat-me .chat-me-img {
                width: 40px;
                height: 40px;
                overflow: hidden;
                left: -45px;
                top: 2px;
                position: absolute
            }

                .sp-right-box .sp-chat-box .sp-chat-me .chat-me-img img {
                    width: 100%
                }

            .sp-right-box .sp-chat-box .sp-chat-me label {
                position: absolute;
                bottom: 6px;
                right: 8px;
                font-size: -.3125rem
            }

        .sp-right-box .sp-chat-box .sp-chat-client {
            width: 90%;
            min-height: 50px;
            padding: 10px;
            position: relative;
            margin-right: 40px;
            margin-bottom: 15px
        }

            .sp-right-box .sp-chat-box .sp-chat-client:before {
                top: 26px;
                right: -12px;
                content: " ";
                height: 0;
                width: 0;
                position: absolute;
                pointer-events: none;
                border-width: 6px;
                transform: rotate(90deg)
            }

            .sp-right-box .sp-chat-box .sp-chat-client:after {
                top: 26px;
                right: -11px;
                content: " ";
                height: 0;
                width: 0;
                position: absolute;
                pointer-events: none;
                border-width: 6px;
                transform: rotate(90deg)
            }

            .sp-right-box .sp-chat-box .sp-chat-client .chat-client-img {
                display: block;
                width: 40px;
                height: 40px;
                overflow: hidden;
                right: -45px;
                top: 2px;
                position: absolute
            }

                .sp-right-box .sp-chat-box .sp-chat-client .chat-client-img img {
                    width: 100%
                }

            .sp-right-box .sp-chat-box .sp-chat-client label {
                position: absolute;
                bottom: 6px;
                right: 8px;
                font-size: -.3125rem
            }

    .sp-right-box .sp-text-box {
        padding: 0 20px
    }

        .sp-right-box .sp-text-box textarea {
            width: 84%;
            height: 55px;
            float: left;
            padding: 10px
        }

        .sp-right-box .sp-text-box input[type="submit"] {
            width: 70px;
            height: 35px;
            margin: 10px 0 0 0;
            display: block;
            float: right
        }

    .sp-right-box .sp-hide {
        display: none
    }

    .sp-right-box .sp-call-wrapper {
        width: 100%;
        min-height: 500px;
        position: absolute;
        top: 0;
        left: 0
    }

        .sp-right-box .sp-call-wrapper .sp-calling-text {
            padding: 35px 0;
            font-size: 18px;
            text-align: center
        }

            .sp-right-box .sp-call-wrapper .sp-calling-text span {
                font-size: 18px
            }

        .sp-right-box .sp-call-wrapper .sp-calling-user {
            width: 70%;
            padding: 50px 0 200px 0;
            margin: 0 auto;
            position: relative
        }

            .sp-right-box .sp-call-wrapper .sp-calling-user .call-user {
                width: 27%;
                height: 127px;
                overflow: hidden;
                opacity: 0.8
            }

                .sp-right-box .sp-call-wrapper .sp-calling-user .call-user img {
                    width: 100%
                }

                .sp-right-box .sp-call-wrapper .sp-calling-user .call-user .icon {
                    font-size: 72px;
                    display: block;
                    line-height: 120px;
                    text-align: center
                }

            .sp-right-box .sp-call-wrapper .sp-calling-user .sp-connecter {
                position: absolute;
                width: 120px;
                top: 50%;
                left: 50%;
                overflow: hidden;
                margin: -10px 0 0 -60px
            }

        .sp-right-box .sp-call-wrapper .sp-discnt-box {
            width: 210px;
            margin: 0 auto;
            overflow: hidden
        }

            .sp-right-box .sp-call-wrapper .sp-discnt-box ul li {
                float: left;
                width: 105px
            }

                .sp-right-box .sp-call-wrapper .sp-discnt-box ul li a {
                    display: block;
                    text-align: center;
                    padding: 10px;
                    overflow: hidden;
                    font-size: .6875rem
                }

                    .sp-right-box .sp-call-wrapper .sp-discnt-box ul li a span {
                        width: 23px;
                        background-repeat: no-repeat;
                        height: 23px;
                        float: left;
                        background-size: contain;
                        display: block;
                        margin: 0 auto
                    }

                        .sp-right-box .sp-call-wrapper .sp-discnt-box ul li a span img {
                            width: 100%
                        }

                    .sp-right-box .sp-call-wrapper .sp-discnt-box ul li a label {
                        margin: 6px 0 0 5px;
                        display: block;
                        float: left
                    }

        .sp-right-box .sp-call-wrapper .sp-answer-box {
            width: 300px
        }

    .sp-right-box .sp-video-calling {
        position: relative;
        top: 0;
        left: 0;
        width: 100%;
        height: 500px
    }

    .sp-right-box .sp-incoming {
        width: 100%;
        height: 500px;
        position: absolute;
        top: 0;
        left: 0
    }

    .sp-right-box .sp-outgoing, .sp-right-box .sp-incoming2 {
        width: 200px;
        height: 150px;
        position: absolute;
        bottom: 10px;
        right: 10px
    }

    .sp-right-box .sp-incoming2 {
        top: 10px
    }

    .sp-right-box .orbit-container {
        height: 500px
    }

    .sp-right-box .orbit-bullets-container {
        bottom: 55px;
        position: absolute;
        z-index: 9999999;
        width: 100%
    }

        .sp-right-box .orbit-bullets-container .orbit-bullets li {
            width: 15px;
            height: 15px;
            margin-right: 25px
        }

    .sp-right-box .orbit-slide-number {
        display: none
    }

.call-hide {
    display: none !important
}

.video-calling-menu {
    position: absolute;
    bottom: 10px;
    left: 10px
}

    .video-calling-menu ul {
        overflow: hidden
    }

        .video-calling-menu ul li a {
            display: block;
            padding: 7px
        }

            .video-calling-menu ul li a img {
                margin-right: 5px
            }

.current-call-log {
    padding-top: 0px;
    display: block !important;
    padding-bottom: 0px;
    position: relative;
    float: left;
    width: 100%;
    height: 350px;
    overflow-y: auto
}

    .current-call-log ul.cti-tabs {
        background: #f5f5f5;
        display: flex
    }

        .current-call-log ul.cti-tabs li {
            text-align: center;
            flex: 1
        }

            .current-call-log ul.cti-tabs li a {
                padding: 8px 0px;
                font-size: .8125rem;
                display: block
            }

    .current-call-log .user-call-log li {
        clear: both
    }

        .current-call-log .user-call-log li .callLog-control-content {
            width: 70%;
            float: right;
            font-size: .75rem
        }

        .current-call-log .user-call-log li label {
            width: 30%;
            float: left;
            padding: 12px 10px 10px 0px
        }

    .current-call-log .user-call-log .callLog-form-label {
        font-size: .75rem;
        font-weight: normal;
        line-height: 1rem;
        text-align: left
    }

    .current-call-log .call-log-sub {
        padding: 12px 10px
    }

.call-variable {
    display: none
}

    .call-variable .menu-accessed-in {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 2px 8px
    }

        .call-variable .menu-accessed-in label, .call-variable .menu-accessed-in .app-custom-cls {
            width: 49%
        }

        .call-variable .menu-accessed-in label {
            text-align: left
        }

    .call-variable.cti-tab-active {
        display: block
    }

.call-disposition {
    padding: .5rem 0
}

    .call-disposition .callDisOptions {
        padding-bottom: 0;
        padding-top: 2px
    }

        .call-disposition .callDisOptions .radio-button {
            padding-top: 2px
        }

    .call-disposition .call-dis-label {
        font-size: .8125rem;
        font-family: "CRMSansSemiBold",Arial,sans-serif;
        margin-bottom: 6px;
        display: block
    }

.submit-call {
    border-top: none;
    padding: 10px !important;
    margin-top: 10px
}

    .submit-call span {
        width: 100px;
        margin: 0px auto;
        padding: 7px
    }

.softphone-popup-cont.dialer-cont .number-cont .dialer-field {
    width: 100%;
    border: none;
    height: 30px;
    padding: 0 10px;
    font-size: 24px;
    font-family: "CRMSansSemiBold",Arial,sans-serif;
    text-align: left
}

.softphone-popup-cont.dialer-cont .number-cont .icon-in .icon-contact {
    padding: 0 7px
}

.softphone-popup-cont.dialer-cont .number-cont .icon-in .icon-arrow-left2 {
    padding: 0 7px
}

.softphone-dialer {
    display: table;
    position: absolute;
    background: #fff;
    left: 275px;
    top: 0px;
    width: 240px;
    z-index: 8;
    height: 380px
}

    .softphone-dialer .popup-userimg-section {
        position: relative;
        height: auto;
        width: 100%
    }

        .softphone-dialer .popup-userimg-section .number-cont {
            position: relative;
            padding: 5px 0px;
            height: 40px
        }

            .softphone-dialer .popup-userimg-section .number-cont #dialNumber {
                font-size: 24px;
                font-family: "CRMSansSemiBold",Arial,sans-serif;
                text-align: center
            }

            .softphone-dialer .popup-userimg-section .number-cont .dialer-field {
                width: 100%;
                border: none;
                height: 30px;
                padding: 0 10px;
                font-size: .875rem;
                font-family: "CRMSansSemiBold",Arial,sans-serif;
                text-align: left
            }

            .softphone-dialer .popup-userimg-section .number-cont .icon-in .icon-contact {
                padding: 0 7px;
                font-size: 1rem
            }

            .softphone-dialer .popup-userimg-section .number-cont .icon-in .icon-arrow-left2 {
                padding: 0 7px;
                font-size: .875rem
            }

    .softphone-dialer .dailer-pad-cont {
        padding: 20px
    }

        .softphone-dialer .dailer-pad-cont .dailer-pad-cont-items {
            display: flex;
            flex-wrap: wrap
        }

        .softphone-dialer .dailer-pad-cont li {
            width: 33%;
            text-align: center;
            margin-bottom: 20px
        }

            .softphone-dialer .dailer-pad-cont li a {
                border-radius: 50%;
                font-family: "CRMSansSemiBold",Arial,sans-serif;
                font-size: 18px;
                display: inline-block;
                line-height: 35px;
                width: 35px;
                height: 35px;
                box-shadow: 0 0 0 1px #eee inset;
                -moz-transition: all 0.2s;
                -o-transition: all 0.2s;
                -webkit-transition: all 0.2s;
                transition: all 0.2s
            }

    .softphone-dialer .dial-btn {
        text-align: center;
        border-top: 1px solid #eee;
        height: 50px;
        display: flex;
        align-items: center;
        justify-content: center
    }

        .softphone-dialer .dial-btn .button-default {
            font-size: .875rem;
            padding: 4px 20px;
            border-radius: 3px;
            margin: 0 .25rem
        }

.dialerMsg {
    width: 100%;
    height: 218px;
    border: 1px solid #eee;
    resize: none;
    padding: 12px
}

.popup-btn-logout {
    top: 7px;
    right: 30px;
    position: absolute
}

    .popup-btn-logout i {
        font-weight: 700 !important
    }

.popup-userimg-section.call-log-custom .call-status {
    padding: 7px 10px
}

    .popup-userimg-section.call-log-custom .call-status .selectbox--customview::after {
        position: absolute;
        top: 1px;
        right: 2px;
        padding: 0px;
        content: "";
        font-size: 60%;
        line-height: 20px;
        pointer-events: none;
        border-radius: 0px;
        width: 17px;
        height: 14px
    }

.softphone-live-row {
    width: 100%;
    padding: 10px
}

    .softphone-live-row label {
        text-align: right;
        float: left;
        width: 49%
    }

    .softphone-live-row div {
        text-align: left;
        float: right;
        width: 49%
    }

.f-dropdown-s {
    width: 143px;
    max-width: none !important;
    min-width: 10px !important
}

    .f-dropdown-s li {
        width: 50%;
        float: left !important;
        height: auto
    }

        .f-dropdown-s li a {
            padding: 9px 0px 0px
        }

.contact-bk-wrap {
    position: fixed;
    width: 100%;
    display: none
}

    .contact-bk-wrap .contact-book {
        padding-top: 5px
    }

        .contact-bk-wrap .contact-book ul {
            padding: 0 5px
        }

        .contact-bk-wrap .contact-book .search-box {
            width: 90%;
            display: inline-block
        }

        .contact-bk-wrap .contact-book .search--in {
            width: 6%
        }

            .contact-bk-wrap .contact-book .search--in a {
                float: right;
                padding: 12px 7px
            }

.contact-list {
    height: 162px;
    overflow-y: auto
}

    .contact-list .highlight_list li {
        width: 100%;
        float: left;
        padding: 3px 6px
    }

    .contact-list .highlight_list .contact-list-li {
        width: 100%;
        margin: 0 auto
    }

        .contact-list .highlight_list .contact-list-li .contact-list--img {
            padding: 13px 0px;
            width: 12%;
            text-align: center;
            float: left
        }

            .contact-list .highlight_list .contact-list-li .contact-list--img img {
                float: left;
                width: 30px;
                height: 30px;
                border-radius: 50%
            }

        .contact-list .highlight_list .contact-list-li .contact-list--num {
            width: 88%;
            box-sizing: border-box;
            padding: 9px 0px 9px 5px;
            float: right
        }

            .contact-list .highlight_list .contact-list-li .contact-list--num .contact-list-name {
                color: #666;
                padding-bottom: 3px;
                font-size: .875rem
            }

.dependent-sub {
    width: auto;
    float: right;
    margin-right: -80px;
    border: medium none
}

.menu-accessed-in label {
    padding: 3px;
    display: inline-block;
    width: 30%;
    text-align: right
}

.menu-accessed-in .app-custom-cls {
    padding: 3px;
    display: inline-block;
    width: 68%;
    font-size: .8125rem
}

.send--txt {
    background: #f2f2f2;
    color: #666;
    border: 1px solid #C7BEBE;
    width: 86px;
    height: 86px;
    padding: 10px;
    margin-top: .25rem;
    margin-left: 3px;
    align-items: center
}

.message {
    width: 100%;
    height: 0px
}

.softphn-login ul li h3 {
    font-family: "CRMSansSemiBold",Arial,sans-serif;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: -0.5px;
    line-height: 29px;
    overflow: hidden;
    padding: 20px 0 23px 2px;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: center;
    padding: 0
}

.softphn-login ul li {
    float: left
}

.softphn-login ul li {
    width: 100%
}

.softphn-login li input.button--large {
    font-size: .875rem !important;
    height: 30px;
    line-height: 30px;
    background-color: #FB9900;
    width: 100px;
    margin: 16px auto;
    display: block;
    cursor: pointer
}

.sessionRefreshbutton {
    background-color: #FB9900;
    text-align: center;
    display: none;
    padding: 0px 1rem;
    border-radius: 30px;
    margin: 16px auto;
    width: 110px;
    padding: 8px 18px;
    color: #fff;
    font-size: .75rem;
    text-transform: uppercase;
    cursor: pointer
}

    .sessionRefreshbutton i {
        margin-right: .5rem;
        display: inline-block
    }

    .sessionRefreshbutton label {
        font-family: "CRMSansSemiBold",Arial,sans-serif
    }

.log-txt {
    padding: .5rem 0;
    clear: left
}

.onReadyState {
    border-color: green !important;
    background: green !important
}

    .onReadyState i {
        color: white !important;
        border-color: transparent !important;
        background-color: green !important
    }

.onCallState {
    color: orange;
    border-color: yellow !important;
    background: #f99420 !important
}

    .onCallState i {
        color: white !important;
        border-color: transparent !important;
        background-color: #f99420 !important
    }

.onNotReadyState {
    border-color: red !important;
    background: #FF0000 !important
}

    .onNotReadyState i {
        color: white !important;
        border-color: transparent !important;
        background-color: #FF0000 !important
    }

.call-consult .call--status {
    display: inline-block
}

#divMain p, #divMain h2, #divMain div {
    font-family: "CRMSansRegular",Arial,sans-serif;
    font-size: .875rem;
    line-height: 22px
}

.ready--state .active-call, .ready--state .call--status, .ready--state .end-call, .ready--state .hold-call, .ready--state .caller-2, .ready--state .caller-3, .ready--state #callerData, .ready--state #customerName, .ready--state #callerNumber, .ready--state #call-duration, .ready--state #holdcall-duration, .ready--state #AgentStatus, .ready--state #console-area, .ready--state #lblApiError, .ready--state .call--status, .ready--state .dialer--2, .ready--state #transfermsg, .ready--state .conf-button, .ready--state .dialer--info .arrow-left, .ready--state .dialer--info .arrow-right {
    display: none
}

.call--connect .call--status, .call--connect .end-call, .call--connect .hold-call, .call--connect .caller-2, .call--connect #callerData, .call--connect #customerName, .call--connect #callerNumber, .call--connect .caller-3, .call--connect #call-duration, .call--connect #holdcall-duration, .call--connect #AgentStatus, .call--connect .dialer--info .arrow-left, .call--connect .dialer--info .arrow-right, .call--connect #console-area, .call--connect #lblApiError, .call--connect .dialer--2, .call--connect #transfermsg, .call--connect .conf-button {
    display: none
}

.on--call .active-call, .on--call .call--status, .on--call .caller-2, .on--call #callerData, .on--call #customerName, .on--call #callerNumber, .on--call .caller-3, .on--call #deviceStatus, .on--call #holdcall-duration, .on--call #AgentStatus, .on--call .dialer--info .arrow-left, .on--call .dialer--info .arrow-right, .on--call #console-area, .on--call #lblApiError, .on--call .dialer--2, .on--call #transfermsg, .on--call .conf-button {
    display: none
}

.call--transfer-inprogress .dialer--info {
    width: 50%
}

.call--transfer-inprogress .caller-img {
    width: 50%
}

    .call--transfer-inprogress .caller-img .call--status {
        left: 31px
    }

    .call--transfer-inprogress .caller-img .end-call {
        right: 9px
    }

    .call--transfer-inprogress .caller-img .hold-call {
        left: 9px
    }

    .call--transfer-inprogress .caller-img .active-call {
        left: 26px
    }

.call--transfer-inprogress #callerData, .call--transfer-inprogress #customerName, .call--transfer-inprogress #callerNumber, .call--transfer-inprogress #call-duration, .call--transfer-inprogress #deviceStatus, .call--transfer-inprogress #holdcall-duration, .call--transfer-inprogress #AgentStatus, .call--transfer-inprogress .caller-3, .call--transfer-inprogress #console-area, .call--transfer-inprogress #lblApiError, .call--transfer-inprogress .conf-button, .call--transfer-inprogress .dialer--info .arrow-left, .call--transfer-inprogress .dialer--info .arrow-right {
    display: none
}

.call--transfer-inprogress .caller-1 .active-call {
    display: none
}

.call--transfer-inprogress .caller-2 .end-call, .call--transfer-inprogress .caller-2 .hold-call {
    display: none
}

.call--transfer-inprogress .conf-button {
    width: 100%;
    float: left;
    text-align: center;
    margin: 38px 0px
}

    .call--transfer-inprogress .conf-button #btn-status {
        background: #fff;
        border-radius: 30px;
        padding: 0px 18%;
        line-height: 30px;
        margin: 0px 0px 15px;
        height: 30px
    }

.call--conference .caller-1 {
    z-index: 4
}

.call--conference .dialer--2, .call--conference .conf-button {
    display: none
}

.call--conference .dialer--info .arrow-left, .call--conference .dialer--info .arrow-right {
    color: #fff;
    position: absolute;
    top: 20%;
    z-index: 200;
    transform: translateY(-50%)
}

.call--conference .dialer--info .arrow-left {
    left: 10%
}

.call--conference .dialer--info .arrow-right {
    right: 10%
}

.call--conference .caller-2, .call--conference .caller-3 {
    position: absolute;
    width: 30%;
    top: 89px
}

    .call--conference .caller-2 .conf-button, .call--conference .caller-2 .end-call, .call--conference .caller-2 .hold-call, .call--conference .caller-3 .conf-button, .call--conference .caller-3 .end-call, .call--conference .caller-3 .hold-call {
        display: none
    }

    .call--conference .caller-2 .caller-img-circular, .call--conference .caller-3 .caller-img-circular {
        width: 45px;
        height: 45px
    }

.call--conference .caller-2 {
    left: 19px
}

.call--conference .caller-3 {
    right: 19px
}

#countrycode:focus, #smsReceipient:focus {
    border: 1px solid #01a89e;
    outline: 0;
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(102,175,233,0.6)
}

.callScroll {
    max-height: 320px;
    overflow: auto
}

.font-light {
    font-weight: 300
}

.font-regular {
    font-family: "CRMSansRegular",Arial,sans-serif
}

.font-normal {
    font-family: "CRMSansSemiBold",Arial,sans-serif
}

.font-bold {
    font-family: "CRMSansSemiBold",Arial,sans-serif
}

.f12 {
    font-size: .75rem
}

.f13 {
    font-size: .8125rem
}

.f14 {
    font-size: .875rem
}

.f16 {
    font-size: 1rem
}

.w48 {
    width: 3rem
}

.h48 {
    height: 3rem
}

.mw70 {
    max-width: 70rem
}

.w100 {
    width: 100%
}

.w-15 {
    width: 15%
}

.mt-3 {
    margin-top: -1rem
}

.min-w0 {
    min-width: 0
}

.min-w100 {
    min-width: 100%
}

.min-h100 {
    min-height: 100%
}

.min-h0 {
    min-height: 0
}

.max-h100 {
    max-height: 100%
}

.w0 {
    width: 0
}

.w20 {
    width: 20rem
}

.h0 {
    height: 0
}

.mw-50 {
    box-shadow: none
}

.min-h1 {
    min-height: 1rem
}

.min-h2 {
    min-height: 2.1rem
}

.min-h3 {
    min-height: 3rem
}

.min-h5 {
    min-height: 5rem
}

.min-15 {
    min-height: 15rem
}

.min-20 {
    min-height: 20rem
}

.mh15 {
    max-height: 15rem
}

.mh18 {
    max-height: 18rem
}

.mh20 {
    max-height: 20rem
}

.mh24 {
    max-height: 24rem
}

.max-h25 {
    max-height: 25rem
}

.min-h-sm {
    min-height: 20rem
}

.min-h-md {
    min-height: 25rem
}

.min-h-lg {
    min-height: 30rem
}

.width5 {
    width: 5rem
}

.flex-grow {
    flex-grow: 1
}

.no-header {
    margin-top: -3rem !important
}

.pt48 {
    padding-top: 3rem !important
}

.no-footer {
    padding-bottom: 0 !important
}

.bottom-00 {
    bottom: 0 !important
}

.mb48 {
    margin-bottom: -3rem
}

.memberselection-container, .memberselection__selectbox, .table-cell__width {
    width: 12rem
}

.memberselection__selectbox {
    padding: 0.25rem;
    font-size: .8125rem;
    min-height: 10rem
}

    .memberselection__selectbox option {
        padding: 0.25rem
    }

.gray-shade-1 {
    background: #f2f4f8
}

.b--moon-gray {
    border-color: #eaeaea !important
}

.maxH10 {
    max-height: 10rem;
    padding: 0 0 1px 0
}

.bound {
    background-color: #fffedd
}

.field100 .textbox, .field100 .selectbox, .field100 .textarea {
    width: 100% !important
}

.tj {
    text-align: justify
}

.brWord {
    word-break: break-word
}

.secondaryColor {
    color: #5c5656
}

.mw0 {
    max-width: 0
}

.min20 {
    min-width: 20px
}

.min-w5 {
    min-width: 16rem !important
}

.ui-widget input, .ui-widget .textbox, .ui-widget textarea, .ui-widget select {
    font-size: .8125rem
}

.ui-widget button, .ui-widget .button, .ui-widget .ui-dialog .notificationWithActions.popup-with-footer .popup-sroll .object-action-btn .object-action-inner .button-icon-text, .ui-dialog .notificationWithActions.popup-with-footer .popup-sroll .object-action-btn .object-action-inner .ui-widget .button-icon-text, .ui-widget .ui-dialog .notificationWithActions.popup-with-footer .popup-sroll .react-form-btns .object-action-inner .button-icon-text, .ui-dialog .notificationWithActions.popup-with-footer .popup-sroll .react-form-btns .object-action-inner .ui-widget .button-icon-text, .ui-widget .ui-dialog .ui-dialog-buttonpane .ui-button, .ui-dialog .ui-dialog-buttonpane .ui-widget .ui-button, .ui-widget .widgetlistingDialog .ui-dialog .custom-btn-listing.button-list .tb, .widgetlistingDialog .ui-dialog .custom-btn-listing.button-list .ui-widget .tb {
    font-size: .8rem
}

.ui-widget-overlay {
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0
}

.ui-corner-all {
    border-style: none;
    border-width: 0;
    border-radius: 0
}

.footer--popup, .Popup .button-group--popup, .ui-dialog .ekyc_custom .crm-card__footer, .ui-dialog .ui-dialog-buttonpane {
    height: 3rem;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 3rem;
    position: absolute;
    width: 100%;
    left: 0;
    bottom: 0;
    z-index: 20
}

    .footer--popup .button-group__item:last-child, .Popup .button-group--popup .button-group__item:last-child, .ui-dialog .ekyc_custom .crm-card__footer .button-group__item:last-child, .ui-dialog .ui-dialog-buttonpane .button-group__item:last-child, .footer--popup #custom-div-button .more-listcon li:last-child, #custom-div-button .more-listcon .footer--popup li:last-child, .Popup .button-group--popup #custom-div-button .more-listcon li:last-child, #custom-div-button .more-listcon .Popup .button-group--popup li:last-child, .ui-dialog .ekyc_custom .crm-card__footer #custom-div-button .more-listcon li:last-child, #custom-div-button .more-listcon .ui-dialog .ekyc_custom .crm-card__footer li:last-child, .ui-dialog .ui-dialog-buttonpane #custom-div-button .more-listcon li:last-child, #custom-div-button .more-listcon .ui-dialog .ui-dialog-buttonpane li:last-child {
        margin-right: 0
    }

.Popup .detailpageView.classicview .crm-table-container .cardLoader {
    box-shadow: none;
    border: 0
}

.Popup .classicview .crm-table-wrapper {
    margin: 0 -.5rem
}

.Popup .whitebox {
    box-shadow: none
}

.Popup .crm-table .tableWrapper {
    box-shadow: none;
    margin-bottom: 0
}

.Popup .button-group--popup {
    z-index: 99
}

.Popup #ui-id-1 .ui-menu-item-wrapper {
    color: #333
}

.Popup .reportGroupCard {
    height: auto;
    box-shadow: none
}

.Popup .custom-btn-listing {
    background: #fff
}

.Popup .custompopuop .reportGroupCard, .Popup .custompopuop .crm-card {
    height: auto;
    box-shadow: none;
    border: 1px solid #eaeaea
}

    .Popup .custompopuop .reportGroupCard .crm-card, .Popup .custompopuop .crm-card .crm-card {
        border: 0
    }

.Popup .ui-dialog.ui-dialog--sm .ui-dialog--sm-container {
    padding: .5rem 1rem
}

.Popup .ui-dialog.ui-dialog--sm .ui-dialog-buttonpane {
    bottom: 0
}

.ui-dialog.react-ui-dialoag {
    padding-bottom: 0
}

    .ui-dialog.react-ui-dialoag .custom--filters .picker-box > .form {
        max-height: 300px;
        overflow: auto
    }

    .ui-dialog.react-ui-dialoag .footer--popup, .ui-dialog.react-ui-dialoag .Popup .button-group--popup, .Popup .ui-dialog.react-ui-dialoag .button-group--popup, .ui-dialog.react-ui-dialoag .ekyc_custom .crm-card__footer, .ui-dialog.react-ui-dialoag .ui-dialog-buttonpane {
        bottom: 0
    }

.ui-dialog {
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    position: fixed;
    z-index: 1000;
    padding: 0;
    padding-top: 3rem;
    padding-bottom: 3rem;
    border-radius: 4px !important
}

    .ui-dialog .layout-container.form {
        margin: 0
    }

    .ui-dialog .listing-container .crm-table .tableWrapper {
        border: 0
    }

    .ui-dialog .whitebox {
        box-shadow: none
    }

    .ui-dialog .ekyc_custom .object-action-inner {
        padding: 0
    }

    .ui-dialog .ekyc_custom .object-action-btn, .ui-dialog .ekyc_custom .react-form-btns {
        bottom: 0;
        border: 0;
        position: relative
    }

    .ui-dialog .ekyc_custom .crm-card__footer {
        position: relative
    }

    .ui-dialog .crm-table .tableWrapper {
        box-shadow: none;
        margin-bottom: 0
    }

    .ui-dialog .ui-dialog-titlebar .action-items {
        display: block
    }

    .ui-dialog .ui-dialog-titlebar-close {
        position: relative;
        width: 1rem;
        border: 0;
        right: 0;
        margin: 0;
        font-size: 0;
        top: auto;
        height: 1rem
    }

        .ui-dialog .ui-dialog-titlebar-close:after {
            content: "\ebf5";
            width: 100%;
            height: 100%;
            position: absolute;
            left: 0;
            top: 0;
            text-indent: 1px !important;
            font-size: .9375rem;
            font-family: 'fontello'
        }

    .ui-dialog #ProcessPickerimgpick_dialog.ui-dialog-content {
        overflow: hidden
    }

    .ui-dialog .ui-dialog-content.has-buttons {
        padding-bottom: 0
    }

    .ui-dialog .popup-with-footer {
        position: relative;
        padding-bottom: 3rem
    }

        .ui-dialog .popup-with-footer .popup-sroll {
            max-height: 300px;
            overflow: auto
        }

    .ui-dialog .notificationWithActions.popup-with-footer {
        padding-bottom: 0
    }

        .ui-dialog .notificationWithActions.popup-with-footer .popup-sroll {
            max-height: 100%
        }

            .ui-dialog .notificationWithActions.popup-with-footer .popup-sroll .react-form.form {
                max-height: 350px;
                overflow: auto
            }

                .ui-dialog .notificationWithActions.popup-with-footer .popup-sroll .react-form.form .tab-menu, .ui-dialog .notificationWithActions.popup-with-footer .popup-sroll .react-form.form .formSwitcher {
                    display: none
                }

                .ui-dialog .notificationWithActions.popup-with-footer .popup-sroll .react-form.form .layout-container .form-row {
                    display: block
                }

                    .ui-dialog .notificationWithActions.popup-with-footer .popup-sroll .react-form.form .layout-container .form-row .form-element--group .form-element .form-element__label {
                        max-width: 8rem;
                        width: 8rem
                    }

                    .ui-dialog .notificationWithActions.popup-with-footer .popup-sroll .react-form.form .layout-container .form-row .form-element--group:first-child:nth-last-child(1) {
                        max-width: 100%
                    }

                    .ui-dialog .notificationWithActions.popup-with-footer .popup-sroll .react-form.form .layout-container .form-row .form-element--group:first-child:nth-last-child(2), .ui-dialog .notificationWithActions.popup-with-footer .popup-sroll .react-form.form .layout-container .form-row .form-element--group:first-child:nth-last-child(2) ~ .form-element--group {
                        max-width: 100%
                    }

                    .ui-dialog .notificationWithActions.popup-with-footer .popup-sroll .react-form.form .layout-container .form-row .form-element--group:first-child:nth-last-child(3), .ui-dialog .notificationWithActions.popup-with-footer .popup-sroll .react-form.form .layout-container .form-row .form-element--group:first-child:nth-last-child(3) ~ .form-element--group {
                        max-width: 100%
                    }

                    .ui-dialog .notificationWithActions.popup-with-footer .popup-sroll .react-form.form .layout-container .form-row .form-element--group:first-child:nth-last-child(4), .ui-dialog .notificationWithActions.popup-with-footer .popup-sroll .react-form.form .layout-container .form-row .form-element--group:first-child:nth-last-child(4) ~ .form-element--group {
                        max-width: 100%
                    }

            .ui-dialog .notificationWithActions.popup-with-footer .popup-sroll .object-action-btn, .ui-dialog .notificationWithActions.popup-with-footer .popup-sroll .react-form-btns {
                position: relative;
                bottom: 0
            }

                .ui-dialog .notificationWithActions.popup-with-footer .popup-sroll .object-action-btn .object-action-inner, .ui-dialog .notificationWithActions.popup-with-footer .popup-sroll .react-form-btns .object-action-inner {
                    background: #f2f2f2;
                    border-top: 2px solid #ddd
                }

                    .ui-dialog .notificationWithActions.popup-with-footer .popup-sroll .object-action-btn .object-action-inner .button-icon-text, .ui-dialog .notificationWithActions.popup-with-footer .popup-sroll .react-form-btns .object-action-inner .button-icon-text {
                        margin-right: 1rem;
                        border-radius: 3px;
                        padding: 8px 16px;
                        min-width: 100px;
                        text-align: center
                    }

                        .ui-dialog .notificationWithActions.popup-with-footer .popup-sroll .object-action-btn .object-action-inner .button-icon-text i, .ui-dialog .notificationWithActions.popup-with-footer .popup-sroll .react-form-btns .object-action-inner .button-icon-text i {
                            display: none
                        }

    .ui-dialog .ui-dialog-content {
        padding: 0;
        position: static;
        max-height: 78vh;
        border-radius: 0 0 4px 4px;
        min-height: 150px
    }

        .ui-dialog .ui-dialog-content .jqx-reset-base {
            overflow: auto !important;
            width: 100% !important
        }

        .ui-dialog .ui-dialog-content .jqx-scrollbar {
            display: none
        }

    .ui-dialog .dialog--new.ui-dialog-content {
        min-height: 90px !important
    }

    .ui-dialog #rpt.ui-dialog-content {
        padding-bottom: 60px;
        font-size: .875rem;
        padding-top: .5rem;
        padding-left: 1rem;
        padding-right: 1rem
    }

    .ui-dialog .ui-dialog-titlebar {
        position: absolute;
        width: 100%;
        left: 0;
        top: 0;
        z-index: 20;
        height: 3rem;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        padding-left: 1rem;
        padding-right: 1rem;
        padding-top: 0;
        padding-bottom: 0;
        border-radius: 4px 4px 0 0
    }

        .ui-dialog .ui-dialog-titlebar span:first-child {
            font-family: "CRMSansSemiBold",Arial,sans-serif
        }

    .ui-dialog .ui-dialog-title {
        flex: 1;
        font-family: "CRMSansSemiBold",Arial,sans-serif
    }

    .ui-dialog .field {
        min-width: 2rem
    }

    .ui-dialog .ui-dialog-buttonpane {
        margin: 0;
        padding: 0
    }

        .ui-dialog .ui-dialog-buttonpane .ui-button:hover {
            border-style: none;
            border-width: 0
        }

        .ui-dialog .footer--popup .object-action-inner, .ui-dialog .Popup .button-group--popup .object-action-inner, .Popup .ui-dialog .button-group--popup .object-action-inner, .ui-dialog .ekyc_custom .crm-card__footer .object-action-inner, .ui-dialog .ui-dialog-buttonpane .object-action-inner {
            background-color: transparent;
            border-top: 0;
            box-shadow: none;
            margin: 0
        }

    .ui-dialog .form--horizontal .form-row {
        flex-wrap: wrap
    }

        .ui-dialog .form--horizontal .form-row .form-element--group {
            min-width: 100%
        }

            .ui-dialog .form--horizontal .form-row .form-element--group .form-element .form-element__label {
                min-height: 0;
                align-self: inherit !important
            }

    .ui-dialog .object-action-inner {
        background: transparent;
        box-shadow: none
    }

    .ui-dialog .fixed-stack-button {
        display: none !important
    }

    .ui-dialog .custom-btn-listing {
        background-color: #fff;
        border-top: 1px solid #eaeaea
    }

    .ui-dialog .crm-table .crm-table__header {
        min-height: 3rem
    }

    .ui-dialog.minimized {
        right: 0;
        width: 20rem !important;
        transform: translate(0, 0) !important;
        top: auto !important;
        bottom: 0 !important;
        left: auto !important;
        margin-top: -6.3rem;
        height: 3rem !important;
        overflow: hidden
    }

        .ui-dialog.minimized .ui-dialog-content {
            display: none
        }

.position--center {
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%)
}

.position--fixed {
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%)
}

    .position--fixed .ui-dialog-titlebar {
        cursor: default
    }

.ui-widget.ui-widget-content {
    border: medium none;
    z-index: 1500 !important
}

div.ui-widget.ui-widget-content.view_popup {
    z-index: 1505 !important
}

.ui-widget-header {
    border: medium none;
    border-radius: 0
}

.Popup {
    padding-bottom: 3rem;
    padding-top: 3rem
}

    .Popup .tab-container {
        box-shadow: none;
        border: 1px solid #eaeaea
    }

    .Popup .page-title-block, .Popup .page-header {
        padding: 0 1rem;
        height: 3rem;
        border-width: 1px;
        position: fixed;
        width: 100%;
        top: 0;
        left: 0;
        z-index: 100;
        max-width: 100%
    }

        .Popup .page-title-block .title-heading, .Popup .page-header .title-heading {
            font-size: .9375rem
        }

    .Popup .griddle-filter__selectbox .selectbox {
        min-height: 0
    }

    .Popup .filter-label, .Popup .pager-label {
        white-space: nowrap
    }

    .Popup .filter__item {
        font-size: .8125rem
    }

        .Popup .filter__item a {
            margin-right: 3px
        }

    .Popup .light-select {
        height: 26px;
        padding-top: 0;
        padding-bottom: 0
    }

        .Popup .light-select .selectbox {
            min-height: 0
        }

    .Popup .page-info {
        display: block
    }

    .Popup .page-header {
        display: flex;
        align-items: center
    }

    .Popup .footer--popup, .Popup .button-group--popup, .Popup .ui-dialog .ekyc_custom .crm-card__footer, .ui-dialog .ekyc_custom .Popup .crm-card__footer, .Popup .ui-dialog .ui-dialog-buttonpane, .ui-dialog .Popup .ui-dialog-buttonpane {
        bottom: 21px
    }

    .Popup .footer-fixed {
        position: fixed !important
    }

    .Popup .footer--popup.bottom-0, .Popup .bottom-0.button-group--popup, .Popup .ui-dialog .ekyc_custom .bottom-0.crm-card__footer, .ui-dialog .ekyc_custom .Popup .bottom-0.crm-card__footer, .Popup .ui-dialog .bottom-0.ui-dialog-buttonpane, .ui-dialog .Popup .bottom-0.ui-dialog-buttonpane {
        bottom: 0
    }

    .Popup .tab__section {
        border: 0
    }

        .Popup .tab__section:empty {
            display: none !important
        }

.ui-datepicker {
    border-radius: 0;
    padding: 0
}

.addmore-link {
    position: absolute;
    right: 0;
    top: -1rem;
    font-size: .75rem;
    text-decoration: underline
}

.loading-indicator-overlay, .loading-indicator {
    display: none !important
}

.ui-menu .ui-menu-item-wrapper {
    position: relative;
    padding-left: 1rem;
    padding-right: 1rem;
    padding-top: .5rem;
    padding-bottom: .5rem;
    font-size: .8125rem;
    border-style: none;
    border-width: 0
}

    .ui-menu .ui-menu-item-wrapper.ui-state-active {
        border-style: none;
        border-width: 0;
        margin: 0px
    }

.pv2 > .pv2 {
    padding-top: 0;
    padding-bottom: 0
}

.validation-summary .ui-dialog {
    position: fixed
}

    .validation-summary .ui-dialog .ui-dialog-content {
        text-align: center;
        padding: 1rem;
        overflow-y: auto;
        max-height: 13rem
    }

        .validation-summary .ui-dialog .ui-dialog-content .icon {
            font-size: 3rem
        }

    .validation-summary .ui-dialog li {
        line-height: 1.5;
        text-align: left;
        font-size: .8125rem;
        margin-bottom: .25rem
    }

        .validation-summary .ui-dialog li ul {
            margin-left: .5rem;
            margin-top: .5rem
        }

            .validation-summary .ui-dialog li ul li {
                cursor: pointer;
                position: relative;
                padding-left: 1.25rem
            }

                .validation-summary .ui-dialog li ul li::before {
                    content: "\e84d";
                    font-family: 'fontello';
                    margin-right: .5rem;
                    position: absolute;
                    left: 0
                }

.warning-dialog .ui-dialog {
    position: fixed
}

    .warning-dialog .ui-dialog .ui-dialog-titlebar {
        border-bottom: none;
        background: none
    }

    .warning-dialog .ui-dialog .ui-dialog-content {
        text-align: center;
        padding: 1rem
    }

        .warning-dialog .ui-dialog .ui-dialog-content .icon {
            font-size: 3rem
        }

        .warning-dialog .ui-dialog .ui-dialog-content .title {
            font-size: 26px;
            padding-bottom: 8px
        }

        .warning-dialog .ui-dialog .ui-dialog-content .warning__message {
            font-size: .8125rem;
            padding-bottom: 2rem
        }

    .warning-dialog .ui-dialog .footer--popup, .warning-dialog .ui-dialog .Popup .button-group--popup, .Popup .warning-dialog .ui-dialog .button-group--popup, .warning-dialog .ui-dialog .ekyc_custom .crm-card__footer, .warning-dialog .ui-dialog .ui-dialog-buttonpane {
        position: absolute;
        margin-top: 0;
        bottom: 0;
        background: #f2f2f2;
        border-top: 2px solid #ddd;
        border-radius: 0 0 4px 4px
    }

.picker-griddle .ui-dialog {
    overflow: hidden
}

.picker-griddle .griddle {
    height: 25rem;
    overflow: auto
}

.picker-griddle .griddle-container {
    padding-left: 1rem;
    padding-right: 1rem
}

.ui-menu.ui-widget.ui-widget-content.ui-autocomplete.ui-front {
    max-width: 2000rem;
    max-height: 10rem;
    position: absolute !important;
    overflow-y: auto;
    border-style: solid;
    border-width: 1px
}

    .ui-menu.ui-widget.ui-widget-content.ui-autocomplete.ui-front .ui-menu-item-wrapper {
        border-style: none;
        border-width: 0;
        font-size: 14px;
    }

.ui-helper-hidden-accessible {
    display: none
}

.h-auto-div > div {
    height: auto !important
}

#fileDiv {
    max-width: 5rem
}

.file--uploader #fileDiv {
    font-size: .8125rem;
    max-width: none
}

.SpecialBox {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    position: absolute;
    right: 1rem;
    top: .8125rem;
    align-items: center;
    z-index: 200
}

    .SpecialBox .checkbox-button {
        margin-left: 1rem
    }

#dpndntdiv {
    min-height: 400px !important
}

    #dpndntdiv:empty {
        min-height: 0 !important
    }

.dependent-chk--td {
    padding-top: 10px
}

#divmapctr {
    overflow: auto;
    padding-left: .25rem;
    padding-right: .25rem
}

.timepickerdiv > div {
    display: table
}

#custom-div-button .flexbox-row.justify-between.mv3 {
    margin-top: 0;
    margin-bottom: 0
}

#custom-div-button .more-listcon {
    width: 100%;
    text-align: center;
    padding-top: 1rem;
    border-style: none;
    border-width: 0
}

    #custom-div-button .more-listcon li {
        text-align: center;
        margin-right: .5rem;
        margin-left: .5rem;
        padding-left: 0;
        padding-right: 0;
        margin-bottom: 1rem;
        width: 5rem;
        display: inline-block;
        word-wrap: break-word;
        vertical-align: top
    }

        #custom-div-button .more-listcon li a {
            height: auto;
            display: block
        }

            #custom-div-button .more-listcon li a i.icon-button--rounded {
                font-size: 1.25rem;
                padding: 1rem;
                margin: 0 auto;
                display: inline-block;
                border: 1px solid
            }

            #custom-div-button .more-listcon li a label.label--vertical {
                display: block;
                text-align: center;
                cursor: pointer;
                font-size: .75rem;
                padding-top: .5rem;
                font-family: "CRMSansSemiBold",Arial,sans-serif
            }

.page-info {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    padding: .25rem 2rem;
    font-size: .8125rem;
    justify-content: space-between;
    display: flex
}

.reactwindowpopup.Popup #newobject {
    padding: 1rem;
    border: 1px solid #ddd;
    background: #fff
}

.reactwindowpopup.Popup .widget-page#newobject {
    padding: 0 0 51px 0
}

.Popup .autoflow {
    box-shadow: none;
    border: 1px solid #eaeaea
}

.Popup .html-label {
    flex: 1
}

.Popup .page-header {
    margin-top: 0
}

.Popup .form-wrapper {
    height: -webkit-calc(100vh - 6em);
    height: -moz-calc(100vh - 6em);
    height: -ms-calc(100vh - 6em);
    height: -o-calc(100vh - 6em);
    height: calc(100vh - 6em);
    overflow-y: auto;
    padding: 1rem;
    padding-bottom: 2rem
}

.Popup #newobject {
    padding-bottom: 0
}

.Popup .object-action-btn {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0
}

.Popup .detail-wrapper {
    padding: 1rem;
    height: -webkit-calc(100vh - 8em);
    height: -moz-calc(100vh - 8em);
    height: -ms-calc(100vh - 8em);
    height: -o-calc(100vh - 8em);
    height: calc(100vh - 8em);
    overflow-y: auto
}

    .Popup .detail-wrapper .fixed-action-button {
        bottom: 2rem;
        display: none
    }

    .Popup .detail-wrapper.detailpageView .fixed-action-button {
        display: block
    }

.eds-pop {
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    position: fixed
}

.icon-with-uiIcon {
    text-indent: 0 !important
}

.warningIcon {
    font-size: 3rem;
    color: #ff4136
}

.syslinkxmlHeight {
    max-height: 30rem
}

.bottom0 {
    bottom: 0 !important
}

.no-data.bg-transparent {
    background-color: rgba(0,0,0,0)
}

@keyframes uidialog {
    0% {
        top: 0%;
        opacity: 0
    }

    100% {
        top: 50%;
        opacity: 1
    }
}

@-webkit-keyframes uidialog {
    0% {
        top: 0%;
        opacity: 0
    }

    100% {
        top: 50%;
        opacity: 1
    }
}

@-ms-keyframes uidialog {
    0% {
        top: 0%;
        opacity: 0
    }

    100% {
        top: 50%;
        opacity: 1
    }
}

@-moz-keyframes uidialog {
    0% {
        top: 0%;
        opacity: 0
    }

    100% {
        top: 50%;
        opacity: 1
    }
}

.ui-dialog .tab-container {
    box-shadow: none
}

.ui-dialog.minimized {
    animation: inherit;
    -webkit-animation: inherit;
    -ms-animation: inherit
}

.ui-dialog {
    animation: uidialog .4s;
    -webkit-animation: uidialog .4s;
    -ms-animation: uidialog .4s;
    -moz-animation: uidialog .4s
}

    .ui-dialog .crm-table-container {
        margin: 0rem
    }

        .ui-dialog .crm-table-container .crm-table__filterBox {
            justify-content: flex-end
        }

            .ui-dialog .crm-table-container .crm-table__filterBox .action-links {
                flex: initial
            }

            .ui-dialog .crm-table-container .crm-table__filterBox .column--container {
                justify-content: flex-end
            }

                .ui-dialog .crm-table-container .crm-table__filterBox .column--container .form-element__control {
                    margin-right: 0;
                    margin-left: -1px
                }

    .ui-dialog .ui-timepicker-wrapper {
        max-height: 6rem;
        min-width: 90px;
        left: auto;
        right: 0
    }

.picker-dialog .ui-dialog .crm-table-container {
    position: static
}

    .picker-dialog .ui-dialog .crm-table-container .crm-table__body {
        position: static
    }

.picker-dialog .ui-dialog .filter-container {
    background: #f2f2f2;
    border-top: 2px solid #dddddd
}

.ui-button-icon.ui-icon.uidropdown {
    text-indent: inherit !important
}

.picker-box .page-header {
    margin-top: 3px;
    padding: .5rem 1rem;
    border-bottom: 1px solid #eaeaea
}

    .picker-box .page-header .title-heading {
        font-size: .8125rem !important;
        white-space: normal
    }

.picker-box .detailtab {
    box-shadow: none
}

    .picker-box .detailtab .detail-tab {
        display: none
    }

.picker-box .layout-container.form {
    margin: 16px
}

    .picker-box .layout-container.form .form-row {
        display: block
    }

        .picker-box .layout-container.form .form-row .form-element--group {
            padding: 0
        }

            .picker-box .layout-container.form .form-row .form-element--group .form-element {
                margin-bottom: 16px
            }

.form-row--flex .picker-box .layout-container.form .form-row {
    display: flex
}

.ui-tooltip {
    max-width: 300px;
    padding: .5rem;
    font-size: .8125rem;
    background: #e1e1e1
}

.filtersContainer {
    display: flex;
    justify-content: flex-start;
    align-items: center
}

.XMLTab {
    display: flex;
    border-bottom: 1px solid #eaeaea
}

    .XMLTab li span {
        padding: 10px 16px;
        font-size: .8125rem;
        color: #5c5656;
        display: block;
        border-bottom: 1px solid transparent;
        cursor: pointer
    }

.setxml-validation {
    height: 130px;
    display: flex;
    align-items: center;
    justify-content: center
}

#csvpreview {
    min-height: 150px !important;
    padding-bottom: .5rem
}

    #csvpreview .griddle .griddle-body {
        overflow-x: auto;
        height: 100%
    }

.oldpickerbox .pickertablefilter .label--right {
    width: 68px;
    min-width: 68px;
    margin-right: .5rem
}

.oldpickerbox .filter__item-inercon {
    font-size: .875rem;
    background: #fff;
    margin-top: 10px
}

.oldpickerbox .griddle--scroll .griddle-body {
    max-height: 58vh
}

    .oldpickerbox .griddle--scroll .griddle-body .nohscroll {
        max-height: 48vh;
        overflow: auto;
        margin-bottom: 16px
    }

    .oldpickerbox .griddle--scroll .griddle-body table tr td {
        white-space: normal;
        text-overflow: initial
    }

.fbfriends {
    padding: 0 1rem;
    margin: 0 !important
}

    .fbfriends .fb-cont {
        padding: 8px 0 !important;
        display: flex;
        align-items: center;
        border-bottom: 1px solid #eaeaea;
        height: auto !important
    }

    .fbfriends .left.fb-cont--lt {
        width: 60px;
        height: 60px;
        border-radius: 100%;
        margin-right: .75rem;
        position: relative;
        overflow: hidden
    }

        .fbfriends .left.fb-cont--lt img {
            width: 100%;
            height: 100%
        }

    .fbfriends .right.fb-cont--rt {
        flex: 1;
        position: relative;
        padding-right: 100px
    }

        .fbfriends .right.fb-cont--rt h3 {
            font-weight: 400;
            font-size: .9375rem;
            display: flex;
            align-items: center;
            color: #333;
            margin-bottom: 4px
        }

            .fbfriends .right.fb-cont--rt h3 img {
                margin-right: 6px
            }

        .fbfriends .right.fb-cont--rt p span {
            font-size: .8125rem;
            padding-left: 29px;
            color: #999
        }

        .fbfriends .right.fb-cont--rt span .fb {
            height: 24px;
            border: 1px solid #eaeaea;
            padding: 0 .75rem;
            background: transparent;
            position: absolute;
            right: 16px;
            top: 8px;
            cursor: pointer
        }

            .fbfriends .right.fb-cont--rt span .fb:hover {
                color: #fff
            }

.calenderCon .scrollable {
    padding-bottom: 0 !important;
    max-height: 350px;
    overflow: auto
}

.ui-datepicker.ui-widget.ui-widget-content {
    z-index: 2000 !important
}

    .ui-datepicker.ui-widget.ui-widget-content .ui-datepicker-prev {
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer
    }

        .ui-datepicker.ui-widget.ui-widget-content .ui-datepicker-prev:before {
            content: "\e831";
            font-family: "fontello"
        }

    .ui-datepicker.ui-widget.ui-widget-content .ui-datepicker-next {
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer
    }

        .ui-datepicker.ui-widget.ui-widget-content .ui-datepicker-next:before {
            content: "\e82e";
            font-family: "fontello"
        }

.overview .pa0 {
    padding: .5rem 0
}

#rollupdata {
    padding: .5rem 1rem
}

    #rollupdata .rollupClass {
        border-bottom: 1px solid #ddd;
        font-size: .875rem
    }

        #rollupdata .rollupClass td {
            padding: 8px 5px;
            cursor: pointer
        }

            #rollupdata .rollupClass td span {
                display: block;
                margin-top: 5px;
                font-size: .75rem
            }

.fc-event-container > .fc-event-hori {
    z-index: 20
}

.date-div.field {
    display: flex;
    align-items: center;
    justify-content: space-between
}

    .date-div.field .picker-icon {
        min-width: 2rem;
        border-left: 1px solid #ddd;
        height: 34px;
        display: flex;
        align-items: center;
        justify-content: center
    }

    .date-div.field .ui-datepicker-trigger {
        padding: 0;
        margin: 0 .5rem
    }

    .date-div.field .textbox {
        border-right: 1px solid #ddd !important
    }

.CardhtmlConter {
    word-break: break-all;
    line-height: 1.4;
    overflow-x: auto;
    font-size: .8125rem;
    padding: 0 1rem
}

    .CardhtmlConter table td {
        padding: 0 .25rem;
        word-break: normal
    }

.Popup .widget-conatiner .widgetListing--screenflow .custom-btn-listing.button-list {
    position: fixed;
    width: 100%;
    bottom: 22px;
    border-top: 1px solid #f2f2f2;
    left: 0;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    background: #f2f2f2
}

    .Popup .widget-conatiner .widgetListing--screenflow .custom-btn-listing.button-list .tb {
        display: flex;
        align-items: center;
        margin-bottom: 0
    }

        .Popup .widget-conatiner .widgetListing--screenflow .custom-btn-listing.button-list .tb i {
            font-size: .875rem;
            padding: 0;
            height: auto;
            width: auto;
            border: 0
        }

        .Popup .widget-conatiner .widgetListing--screenflow .custom-btn-listing.button-list .tb span {
            font-size: .875rem;
            padding-top: 0
        }

.widgetlistingDialog .ui-dialog .crm-table-container.relative {
    position: static
}

    .widgetlistingDialog .ui-dialog .crm-table-container.relative .filter-container {
        padding: .5rem
    }

.widgetlistingDialog .ui-dialog .custom-btn-listing.button-list {
    position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0
}

    .widgetlistingDialog .ui-dialog .custom-btn-listing.button-list .tb {
        margin-bottom: 0;
        display: inline-flex;
        min-width: 5rem;
        width: auto;
        align-items: center
    }

        .widgetlistingDialog .ui-dialog .custom-btn-listing.button-list .tb i {
            font-size: .875rem;
            padding: 0;
            height: auto;
            width: auto;
            border: 0;
            color: #fff;
            padding-left: .5rem;
            display: none
        }

        .widgetlistingDialog .ui-dialog .custom-btn-listing.button-list .tb span {
            font-size: .875rem;
            padding: 0.625rem 1rem;
            width: 100%
        }

.hiddencard-container {
    margin-bottom: -48px
}

    .hiddencard-container .hiddencard-row {
        display: flex;
        flex-wrap: wrap;
        padding: .5rem;
        background: #ccc
    }

        .hiddencard-container .hiddencard-row .form-element--group {
            padding: .5rem;
            width: 33%
        }

.form-element .CardhtmlConter table {
    width: 100% !important
}

.iframeDialog {
    position: fixed;
    border: 0;
    z-index: 2000;
    box-shadow: 0 0 0 10000px rgba(0,0,0,0.7);
    height: 90%;
    width: 90%;
    max-width: 1100px;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    margin: auto;
    background: url("imgcss/iframeloader.gif") no-repeat center center #fff
}

.longtextmessage {
    text-align: left;
    line-height: 17px;
    padding-bottom: 16px;
    display: flex;
    align-items: center;
    justify-content: center
}

.webPresenterDialog .ui-dialog-content {
    min-height: 100%
}

.webPresenterDialog .time-field-container {
    min-width: 90px
}

.webPresenterDialog .compositeControl .form-element__label {
    white-space: nowrap
}

.fileBrowse .fileBrowse__header {
    display: flex;
    align-items: center;
    background: #f2f2f2
}

    .fileBrowse .fileBrowse__header .fileBrowse__preview {
        width: 200px;
        border-left: 1px solid #ddd;
        height: 30px;
        display: flex;
        align-items: center;
        padding-left: 1rem;
        font-family: "CRMSansSemiBold",Arial,sans-serif;
        color: #222;
        font-size: .875rem;
        border-bottom: 1px solid #ddd
    }

    .fileBrowse .fileBrowse__header .fileBrowse__links {
        height: 30px;
        display: flex;
        align-items: center;
        border-bottom: 1px solid #ddd;
        flex: 1;
        padding: 0 1rem
    }

        .fileBrowse .fileBrowse__header .fileBrowse__links a {
            margin-right: .5rem
        }

.fileBrowse .fileBrowse__container {
    display: flex
}

    .fileBrowse .fileBrowse__container .fileBrowse__rows {
        flex: 1;
        word-break: break-all;
        padding: 0 1rem;
        max-height: 200px;
        overflow: auto
    }

        .fileBrowse .fileBrowse__container .fileBrowse__rows .fileBrowse__row {
            padding: 0px 1rem;
            font-size: .875rem;
            list-style: square;
            margin-left: 18px
        }

    .fileBrowse .fileBrowse__container .fileBrowse__previewArea {
        width: 200px;
        padding-left: 1rem;
        min-height: 120px;
        border-left: 1px solid #ddd
    }

.uploadImageArea .uploadImageArea__label {
    background: #f2f2f2;
    border-bottom: 1px solid #ddd;
    border-top: 1px solid #ddd;
    padding: .5rem 1rem;
    color: #222;
    font-size: .875rem;
    font-family: "CRMSansSemiBold",Arial,sans-serif;
    color: #222
}

.uploadImageArea .uploadImageArea__con {
    height: 50px;
    display: flex;
    align-items: center;
    padding: 0 1rem
}

.uploadImageArea .uploadButton {
    height: 34px;
    border-radius: 3px;
    margin-left: 1rem;
    overflow: hidden;
    position: relative
}

.uploadImageArea .uploadButton__file {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    left: 0;
    top: 0;
    height: 100%
}

.ui-dialog .layout-container .form-row .form-element--group:first-child:nth-last-child(1) {
    max-width: 100%
}

.ui-dialog .layout-container .form-row .form-element--group:first-child:nth-last-child(2), .ui-dialog .layout-container .form-row .form-element--group:first-child:nth-last-child(2) ~ .form-element--group {
    max-width: 100%
}

.ui-dialog .layout-container .form-row .form-element--group:first-child:nth-last-child(3), .ui-dialog .layout-container .form-row .form-element--group:first-child:nth-last-child(3) ~ .form-element--group {
    max-width: 100%
}

.ui-dialog .layout-container .form-row .form-element--group:first-child:nth-last-child(4), .ui-dialog .layout-container .form-row .form-element--group:first-child:nth-last-child(4) ~ .form-element--group {
    max-width: 100%
}

.ui-dialog .layout-container .form-row .form-element--group:first-child:nth-last-child(5), .ui-dialog .layout-container .form-row .form-element--group:first-child:nth-last-child(5) ~ .form-element--group {
    max-width: 100%
}

.ui-dialog .picker-box {
    padding-bottom: 3rem
}

.dashboardDialog .help-msg-box-content.help-msg-box-content-bottom0 {
    position: absolute;
    width: 100%;
    bottom: 0
}

.dashboardDialog .help-msg-box-content {
    background: rgba(255,235,59,0.4);
    bottom: 0;
    padding: .5rem 1rem;
    font-size: .8125rem;
    line-height: 20px
}

.dashboardDialog .dashlistinTable {
    padding: 1rem
}

.dashboardDialog .Listingtable {
    border-collapse: collapse
}

    .dashboardDialog .Listingtable .LtHeader th {
        font-size: .8125rem;
        color: #222;
        background: #f2f2f2;
        border: 1px solid #ddd;
        padding: 4px 8px;
        text-align: left
    }

    .dashboardDialog .Listingtable .LtBody .LtBody__row td {
        font-size: .8125rem;
        padding: 6px 8px;
        text-align: center;
        border: 1px solid #ddd;
        border-collapse: collapse;
        text-align: left
    }

.groupSummaryContainer {
    padding: .5rem
}

    .groupSummaryContainer .groupSummary__item {
        margin: 8px;
        box-shadow: 0 0 3px rgba(0,0,0,0.2)
    }

        .groupSummaryContainer .groupSummary__item .groupSummary__header {
            height: 40px;
            padding: 0 1rem;
            display: flex;
            align-items: center;
            justify-content: space-between;
            border-bottom: 1px solid #ddd
        }

            .groupSummaryContainer .groupSummary__item .groupSummary__header .groupSummary__title {
                font-size: .9375rem;
                font-family: "CRMSansSemiBold",Arial,sans-serif;
                color: #333
            }

            .groupSummaryContainer .groupSummary__item .groupSummary__header .groupSummary__toggle {
                border: 1px solid #ddd;
                background: #f2f2f2;
                font-size: .8125rem;
                display: flex;
                align-items: center;
                padding: 2px 8px;
                cursor: pointer
            }

        .groupSummaryContainer .groupSummary__item .groupSummary__content .groupSummaryTable table {
            width: 100%
        }

            .groupSummaryContainer .groupSummary__item .groupSummary__content .groupSummaryTable table th {
                font-size: .8125rem;
                font-family: "CRMSansSemiBold",Arial,sans-serif;
                font-weight: 400;
                height: 28px;
                border: 1px solid #ddd;
                background: #f2f2f2;
                text-align: left;
                padding: 0 1rem
            }

            .groupSummaryContainer .groupSummary__item .groupSummary__content .groupSummaryTable table td {
                font-size: .8125rem;
                height: 28px;
                padding: 0 1rem;
                border: 1px solid #ddd
            }

.ProcessPickerimgpick_dialog .jqx-overflow-hidden {
    overflow: auto !important
}

    .ProcessPickerimgpick_dialog .jqx-overflow-hidden .jqx-overflow-hidden {
        overflow: visible !important
    }

.react-ui-dialoag {
    width: 100%;
    max-width: 1000px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%)
}

.ring-assignment {
    display: flex;
    align-items: center;
    max-width: 500px;
    margin: 16px auto
}

.ring-assignmentbox {
    border-top: 1px solid #eee;
    padding: .5rem;
    max-height: 22rem;
    overflow: auto
}

.ring-assignment-container {
    display: flex;
    flex-wrap: wrap
}

    .ring-assignment-container .ring-assignment__item {
        padding: .5rem;
        width: 25%
    }

        .ring-assignment-container .ring-assignment__item .ring-assignment-box {
            border: 1px solid #eaeaea;
            border-radius: 3px;
            font-size: .9375rem;
            min-height: 100%
        }

            .ring-assignment-container .ring-assignment__item .ring-assignment-box a {
                width: 100%;
                display: block
            }

                .ring-assignment-container .ring-assignment__item .ring-assignment-box a .ringassignment__title {
                    text-align: center;
                    display: block;
                    font-family: "CRMSansRegular",Arial,sans-serif;
                    text-transform: capitalize;
                    height: 34px;
                    display: flex;
                    align-items: center;
                    justify-content: center
                }

            .ring-assignment-container .ring-assignment__item .ring-assignment-box .ringassignment__content {
                text-align: center;
                font-size: .8125rem
            }

            .ring-assignment-container .ring-assignment__item .ring-assignment-box .ringassignment__info {
                text-align: center;
                font-size: .8125rem
            }

.ringProcessHeading {
    font-family: "CRMSansRegular",Arial,sans-serif;
    color: #212121;
    background: rgba(242,242,242,0.32);
    border-bottom: 1px solid #eee;
    padding: .5rem 1rem
}

.ring-filter-container .filter-title {
    padding: .5rem 1rem;
    font-size: .9375rem;
    font-family: CrmSansSemiBold;
    color: #888
}

.ring-filter-container .ring-filter .flexbox-row.items-center.mb3 {
    padding: 0 1rem
}

.Popup.RunFlowContainer .flowWithNavigation {
    margin-bottom: 16px
}

    .Popup.RunFlowContainer .flowWithNavigation + .react-form.form {
        padding: 0 1rem
    }

    .Popup.RunFlowContainer .flowWithNavigation + #newobject {
        padding: 0 1rem
    }

.Popup.RunFlowContainer .custom-btn-listing {
    position: fixed
}

.Popup.RunFlowContainer .composite-layout {
    padding-bottom: 16px
}

    .Popup.RunFlowContainer .composite-layout .composite-layout__sidepanel .sidepanel-container .sidebarrows {
        box-shadow: none;
        border: 1px solid #ccc
    }

.Popup.RunFlowContainer .detail-wrapper {
    padding: 0px;
    height: -webkit-calc(100vh - 3em);
    height: -moz-calc(100vh - 3em);
    height: -ms-calc(100vh - 3em);
    height: -o-calc(100vh - 3em);
    height: calc(100vh - 3em)
}

    .Popup.RunFlowContainer .detail-wrapper .fixed-action-button {
        bottom: 2rem
    }

.has-buttons + .footer--popup, .Popup .has-buttons + .button-group--popup, .ui-dialog .ekyc_custom .has-buttons + .crm-card__footer, .ui-dialog .has-buttons + .ui-dialog-buttonpane {
    position: relative !important;
    bottom: 0;
    border-top: 0
}

.ui-dialog-content .filteroptions .filteroptions__body {
    padding: 1rem;
    overflow: auto;
    max-height: 400px;
    min-height: 150px
}

    .ui-dialog-content .filteroptions .filteroptions__body .form .form-row .form-element--group .column--container .form-element--group-column {
        flex: none;
        min-width: 150px
    }

        .ui-dialog-content .filteroptions .filteroptions__body .form .form-row .form-element--group .column--container .form-element--group-column .textbox, .ui-dialog-content .filteroptions .filteroptions__body .form .form-row .form-element--group .column--container .form-element--group-column select {
            min-width: 90px
        }

    .ui-dialog-content .filteroptions .filteroptions__body .form .form-row .flexbox-row .form-element__control {
        display: flex
    }

        .ui-dialog-content .filteroptions .filteroptions__body .form .form-row .flexbox-row .form-element__control .form-element__label {
            width: auto;
            text-align: left;
            white-space: nowrap;
            min-width: 0;
            max-width: 8rem
        }

    .ui-dialog-content .filteroptions .filteroptions__body .form .form-row .flexbox-row .form-element--group-column .form-element.form-element--labelLeft label.form-element__label {
        width: auto;
        text-align: left;
        min-width: 34px
    }

.ui-dialog-content .filteroptions .duration-field {
    display: flex
}

    .ui-dialog-content .filteroptions .duration-field .dib.mr2 {
        display: flex;
        align-items: center
    }

.ui-dialog-content .filteroptions .filteroptions__button {
    padding: 16px 0;
    display: flex;
    justify-content: flex-end
}

.ui-dialog-content .filteroptions .form--horizontal .form-row .form-element {
    display: flex;
    align-items: center;
    flex: 1
}

    .ui-dialog-content .filteroptions .form--horizontal .form-row .form-element .form-element__label {
        width: 8rem
    }

    .ui-dialog-content .filteroptions .form--horizontal .form-row .form-element .form-element__control {
        flex: inherit
    }

        .ui-dialog-content .filteroptions .form--horizontal .form-row .form-element .form-element__control .flex-1.flexbox-row {
            flex: auto
        }

        .ui-dialog-content .filteroptions .form--horizontal .form-row .form-element .form-element__control:first-child {
            min-width: 130px
        }

        .ui-dialog-content .filteroptions .form--horizontal .form-row .form-element .form-element__control .mr2.dib.v-mid .field {
            min-width: 0;
            width: 52px
        }

    .ui-dialog-content .filteroptions .form--horizontal .form-row .form-element .date-field-container {
        max-width: 180px
    }

    .ui-dialog-content .filteroptions .form--horizontal .form-row .form-element .time-field-container {
        max-width: 100px
    }

.ui-dialog-content .filteroptions .form--horizontal .form-row .column--container .form-element__control {
    display: flex;
    align-items: center
}

    .ui-dialog-content .filteroptions .form--horizontal .form-row .column--container .form-element__control .textarea {
        min-width: .8125rem
    }

    .ui-dialog-content .filteroptions .form--horizontal .form-row .column--container .form-element__control > div {
        width: 100%;
        min-width: 100%
    }

        .ui-dialog-content .filteroptions .form--horizontal .form-row .column--container .form-element__control > div.time-field-container {
            min-width: 100px
        }

    .ui-dialog-content .filteroptions .form--horizontal .form-row .column--container .form-element__control:nth-child(2) .form-element__label, .ui-dialog-content .filteroptions .form--horizontal .form-row .column--container .form-element__control:nth-child(3) .form-element__label {
        padding-left: .25rem;
        width: auto;
        white-space: nowrap
    }

.changeOwner-dialog {
    padding-bottom: 1rem;
    margin-bottom: 1rem
}

    .changeOwner-dialog + .ui-dialog-buttonpane {
        bottom: 0 !important
    }

.popupTable {
    padding: 1rem
}

    .popupTable table {
        width: 100%
    }

        .popupTable table tr th {
            border: 1px solid #ddd;
            background: #f2f2f2;
            font-size: 14px;
            font-weight: normal;
            text-align: left;
            height: 30px;
            padding: 0 1rem;
            color: #222
        }

        .popupTable table tr td {
            border: 1px solid #ddd;
            font-size: 13px;
            font-weight: normal;
            text-align: left;
            height: 30px;
            padding: 0 1rem
        }

.ui-dialog .react-grid-checkbox-label::after {
    -moz-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    -webkit-transform: scale(1);
    transform: scale(1)
}

.notifictionpopup .form .form-row .form-element--group .crm-table-wrapper {
    width: auto;
    margin: -12px
}

    .notifictionpopup .form .form-row .form-element--group .crm-table-wrapper .react-grid-Viewport {
        position: relative !important;
        top: 0 !important
    }

        .notifictionpopup .form .form-row .form-element--group .crm-table-wrapper .react-grid-Viewport .react-grid-Canvas {
            max-height: 100% !important;
            height: auto !important;
            position: relative !important;
            overflow: visible !important
        }

.notifictionpopup .form .form-row .form-element--group .form-element .form-element__control {
    font-size: .8125rem
}

.ui-dialog .crmTextPickerView .cardListing__row {
    border-bottom: 1px solid #ddd;
    padding: .75rem 1rem;
    min-height: 40px;
    position: relative;
    padding-left: 50px
}

    .ui-dialog .crmTextPickerView .cardListing__row > .relative.pointer {
        width: 20px;
        height: 20px;
        min-height: 20px;
        position: absolute;
        min-width: 20px;
        left: 1rem;
        top: 0;
        bottom: 0;
        margin: auto
    }

        .ui-dialog .crmTextPickerView .cardListing__row > .relative.pointer .cardSelection {
            width: 20px;
            height: 20px;
            border: 1px solid #ccc
        }

            .ui-dialog .crmTextPickerView .cardListing__row > .relative.pointer .cardSelection + i.icon {
                position: absolute;
                left: 5px;
                top: 3px;
                font-size: 12px;
                display: none
            }

            .ui-dialog .crmTextPickerView .cardListing__row > .relative.pointer .cardSelection.isSelected + i.icon {
                display: block
            }

    .ui-dialog .crmTextPickerView .cardListing__row .card-field-container .blogListing__title {
        font-size: 13px;
        line-height: 18px
    }

    .ui-dialog .crmTextPickerView .cardListing__row .blogListing__userDetail {
        display: none
    }

.searchControl .ui-dialog.react-ui-dialoag {
    padding: 0;
    border-radius: 0 !important;
    max-width: 100%;
    height: 84vh !important;
    width: 88vw !important;
    transform: none !important;
    left: 5vw !important;
    top: 8vh !important;
    animation: none !important;
    animation: none !important
}

    .searchControl .ui-dialog.react-ui-dialoag .crm-table .tableWrapper {
        border: 0 !important;
        margin-bottom: 34px
    }

        .searchControl .ui-dialog.react-ui-dialoag .crm-table .tableWrapper .react-grid-Container {
            width: 100% !important;
            border: 1px solid #eaeaea;
            border-top: 0
        }

        .searchControl .ui-dialog.react-ui-dialoag .crm-table .tableWrapper .crm-table__header {
            min-height: 0;
            padding: 0 0rem 1rem 0
        }

            .searchControl .ui-dialog.react-ui-dialoag .crm-table .tableWrapper .crm-table__header .tableSearchIcon {
                display: none
            }

            .searchControl .ui-dialog.react-ui-dialoag .crm-table .tableWrapper .crm-table__header .crm-table__title {
                margin-right: 1rem;
                font-family: "CRMSansSemiBold",Arial,sans-serif;
                font-size: 16px
            }

        .searchControl .ui-dialog.react-ui-dialoag .crm-table .tableWrapper .react-grid-Toolbar {
            display: none
        }

        .searchControl .ui-dialog.react-ui-dialoag .crm-table .tableWrapper .filter-container {
            display: none
        }

    .searchControl .ui-dialog.react-ui-dialoag header.ui-dialog-titlebar {
        position: relative;
        padding-top: 0;
        margin: 0;
        border-radius: 0;
        background: #f9f9f9
    }

    .searchControl .ui-dialog.react-ui-dialoag .footer--popup, .searchControl .ui-dialog.react-ui-dialoag .Popup .button-group--popup, .Popup .searchControl .ui-dialog.react-ui-dialoag .button-group--popup, .searchControl .ui-dialog.react-ui-dialoag .ekyc_custom .crm-card__footer, .searchControl .ui-dialog.react-ui-dialoag .ui-dialog-buttonpane {
        display: none !important
    }

    .searchControl .ui-dialog.react-ui-dialoag .picker-box > .form {
        max-height: 100%;
        overflow: auto
    }

    .searchControl .ui-dialog.react-ui-dialoag .picker-box {
        padding-bottom: 0
    }

        .searchControl .ui-dialog.react-ui-dialoag .picker-box .layout-container.form {
            margin: 0
        }

    .searchControl .ui-dialog.react-ui-dialoag .ui-dialog-content {
        height: -webkit-calc(100vh - 24vh);
        height: -moz-calc(100vh - 24vh);
        height: -ms-calc(100vh - 24vh);
        height: -o-calc(100vh - 24vh);
        height: calc(100vh - 24vh);
        max-width: 100%;
        overflow: auto;
        border-radius: 0;
        padding: 1rem;
        max-height: 100%
    }

.dialogListing .ui-dialog .ui-dialog-content {
    overflow: visible
}

.dialogListing .ui-dialog .picker-box {
    padding-bottom: 0
}

    .dialogListing .ui-dialog .picker-box .page-header {
        display: none
    }

    .dialogListing .ui-dialog .picker-box > .form {
        margin: 0;
        max-height: 100% !important
    }

        .dialogListing .ui-dialog .picker-box > .form .layout-container.form {
            margin: 0
        }

            .dialogListing .ui-dialog .picker-box > .form .layout-container.form .form-element--group .form-element {
                margin-bottom: 0
            }

.dialogListing .ui-dialog .crm-table .tableWrapper {
    height: 470px;
    overflow: auto
}

.dialogListing .ui-dialog .custom-btn-listing {
    background-color: #f2f2f2;
    border-top: 2px solid #ccc;
    padding: 8px
}

    .dialogListing .ui-dialog .custom-btn-listing .button-icon-text.disabled {
        background: #ccc;
        color: #fff
    }

        .dialogListing .ui-dialog .custom-btn-listing .button-icon-text.disabled span {
            color: #333333 !important
        }

    .dialogListing .ui-dialog .custom-btn-listing .button-icon-text {
        color: #fff !important;
        margin: 0 8px;
        padding: 8px 1rem;
        width: auto;
        border-radius: 3px;
        min-width: 110px
    }

        .dialogListing .ui-dialog .custom-btn-listing .button-icon-text span {
            color: #fff !important;
            margin: 0;
            padding: 0;
            font-size: 13px
        }

.dialogListing .footer--popup, .dialogListing .Popup .button-group--popup, .Popup .dialogListing .button-group--popup, .dialogListing .ui-dialog .ekyc_custom .crm-card__footer, .ui-dialog .ekyc_custom .dialogListing .crm-card__footer, .dialogListing .ui-dialog .ui-dialog-buttonpane, .ui-dialog .dialogListing .ui-dialog-buttonpane {
    display: none !important
}

.ui-widget.ui-widget-content.ui-resizable {
    height: auto !important
}

.digitalDialog .ui-dialog .picker-box {
    padding-bottom: 0
}

    .digitalDialog .ui-dialog .picker-box > .form {
        max-height: 100% !important;
        overflow: visible !important;
        min-height: 390px;
        margin: 2rem 0 2rem
    }

    .digitalDialog .ui-dialog .picker-box .layout-container.composite-layout.form {
        margin: 0
    }

.digitalDialog .ui-dialog .ui-dialog-titlebar {
    border-bottom: 0;
    border-radius: 0;
    margin-bottom: 0;
    padding: 0 1.5rem;
    height: 4rem
}

    .digitalDialog .ui-dialog .ui-dialog-titlebar .title__heading {
        font-size: 20px;
        font-family: "CRMSansBold",Arial,sans-serif
    }

.digitalDialog .ui-dialog .ui-dialog-content {
    max-height: 100%;
    height: auto;
    overflow: visible
}

    .digitalDialog .ui-dialog .ui-dialog-content .layout-container.form .form-row .form-element--group .column--container .form-element--group-column.cw-5 {
        max-width: 5rem !important
    }

    .digitalDialog .ui-dialog .ui-dialog-content .layout-container.form .form-row .form-element--group .field {
        border-radius: 0
    }

    .digitalDialog .ui-dialog .ui-dialog-content .layout-container.form .form-row .form-element--group .field--textbox, .digitalDialog .ui-dialog .ui-dialog-content .layout-container.form .form-row .form-element--group .textbox, .digitalDialog .ui-dialog .ui-dialog-content .layout-container.form .form-row .form-element--group .selectbox, .digitalDialog .ui-dialog .ui-dialog-content .layout-container.form .form-row .form-element--group .ff, .digitalDialog .ui-dialog .ui-dialog-content .layout-container.form .form-row .form-element--group .fo {
        border-radius: 0
    }

    .digitalDialog .ui-dialog .ui-dialog-content .layout-container.form .form-row .form-element--group .form-element .form-element__label {
        text-transform: uppercase;
        font-family: "CRMSansSemiBold",Arial,sans-serif;
        color: #333;
        font-size: .875rem;
        min-width: 12rem;
        justify-content: flex-start !important;
        width: auto
    }

    .digitalDialog .ui-dialog .ui-dialog-content .layout-container.form .form-row .form-element--group .form-element .form-element {
        margin-bottom: 0
    }

    .digitalDialog .ui-dialog .ui-dialog-content .section-contents {
        padding: 0
    }

    .digitalDialog .ui-dialog .ui-dialog-content .composite-layout .composite-layout__panel {
        max-width: 50%;
        padding: 0 1.5rem;
        margin: 0;
        flex: none;
        width: 100%;
        min-height: 402px
    }

    .digitalDialog .ui-dialog .ui-dialog-content .composite-layout .composite-layout__sidepanel {
        display: flex !important;
        min-width: 0;
        max-width: 50%;
        padding: 0 1.5rem;
        margin: 0;
        width: 100%;
        align-items: center;
        justify-content: center;
        border-left: 2px solid #ddd;
        min-height: 402px
    }

        .digitalDialog .ui-dialog .ui-dialog-content .composite-layout .composite-layout__sidepanel .sidepanel-container {
            padding: 0px;
            min-height: 0;
            flex: 1;
            width: 100%
        }

            .digitalDialog .ui-dialog .ui-dialog-content .composite-layout .composite-layout__sidepanel .sidepanel-container .sidebarrows {
                margin-bottom: 0;
                box-shadow: none;
                border: 0
            }

                .digitalDialog .ui-dialog .ui-dialog-content .composite-layout .composite-layout__sidepanel .sidepanel-container .sidebarrows .tab__section {
                    padding: 1rem 0;
                    height: auto;
                    text-align: center;
                    border: 0;
                    justify-content: center
                }

                    .digitalDialog .ui-dialog .ui-dialog-content .composite-layout .composite-layout__sidepanel .sidepanel-container .sidebarrows .tab__section .heading-group {
                        font-size: 1rem;
                        text-transform: uppercase;
                        font-family: "CRMSansBold",Arial,sans-serif
                    }

                .digitalDialog .ui-dialog .ui-dialog-content .composite-layout .composite-layout__sidepanel .sidepanel-container .sidebarrows .form-row .form-element--group .form-element {
                    margin-bottom: 0 !important
                }

                    .digitalDialog .ui-dialog .ui-dialog-content .composite-layout .composite-layout__sidepanel .sidepanel-container .sidebarrows .form-row .form-element--group .form-element .form-element__control {
                        max-width: 100% !important
                    }

                .digitalDialog .ui-dialog .ui-dialog-content .composite-layout .composite-layout__sidepanel .sidepanel-container .sidebarrows .field textarea {
                    min-height: 250px;
                    resize: none;
                    border-radius: 0;
                    border: 0;
                    box-shadow: none;
                    background: #fff !important;
                    color: #000;
                    line-height: 22px !important;
                    font-size: .8125rem;
                    padding: .5rem 1rem
                }

.digitalDialog .ui-dialog .footer--popup, .digitalDialog .ui-dialog .Popup .button-group--popup, .Popup .digitalDialog .ui-dialog .button-group--popup, .digitalDialog .ui-dialog .ekyc_custom .crm-card__footer, .digitalDialog .ui-dialog .ui-dialog-buttonpane {
    position: relative;
    border-radius: 0;
    height: auto;
    border: 0;
    background: transparent;
    padding-bottom: 1rem
}

    .digitalDialog .ui-dialog .footer--popup .object-action-inner, .digitalDialog .ui-dialog .Popup .button-group--popup .object-action-inner, .Popup .digitalDialog .ui-dialog .button-group--popup .object-action-inner, .digitalDialog .ui-dialog .ekyc_custom .crm-card__footer .object-action-inner, .digitalDialog .ui-dialog .ui-dialog-buttonpane .object-action-inner {
        padding-top: 0
    }

        .digitalDialog .ui-dialog .footer--popup .object-action-inner a.button-icon-text, .digitalDialog .ui-dialog .Popup .button-group--popup .object-action-inner a.button-icon-text, .Popup .digitalDialog .ui-dialog .button-group--popup .object-action-inner a.button-icon-text, .digitalDialog .ui-dialog .ekyc_custom .crm-card__footer .object-action-inner a.button-icon-text, .digitalDialog .ui-dialog .ui-dialog-buttonpane .object-action-inner a.button-icon-text {
            max-height: 100%;
            text-transform: uppercase;
            font-size: 16px;
            border-radius: 0
        }

            .digitalDialog .ui-dialog .footer--popup .object-action-inner a.button-icon-text i, .digitalDialog .ui-dialog .Popup .button-group--popup .object-action-inner a.button-icon-text i, .Popup .digitalDialog .ui-dialog .button-group--popup .object-action-inner a.button-icon-text i, .digitalDialog .ui-dialog .ekyc_custom .crm-card__footer .object-action-inner a.button-icon-text i, .digitalDialog .ui-dialog .ui-dialog-buttonpane .object-action-inner a.button-icon-text i {
                display: none
            }

.rc-tree {
    margin: 0;
    padding: 5px
}

    .rc-tree li {
        padding: 0;
        margin: 0;
        list-style: none;
        white-space: nowrap;
        outline: 0
    }

        .rc-tree li .draggable {
            color: #333;
            -moz-user-select: none;
            -khtml-user-select: none;
            -webkit-user-select: none;
            user-select: none;
            -khtml-user-drag: element;
            -webkit-user-drag: element
        }

        .rc-tree li ul {
            margin: 0;
            padding: 0 0 0 18px
        }

        .rc-tree li .rc-tree-node-content-wrapper {
            display: inline-block;
            padding: 1px 3px 0 0;
            margin: 0;
            cursor: pointer;
            text-decoration: none;
            vertical-align: top
        }

        .rc-tree li span.rc-tree-switcher {
            line-height: 10px;
            margin-right: 2px;
            width: 14px;
            height: 13px;
            display: inline-block;
            vertical-align: middle;
            border: 0 none;
            cursor: pointer;
            outline: none;
            background-color: inherit;
            background-repeat: no-repeat;
            background-attachment: scroll
        }

        .rc-tree li span.rc-tree-checkbox {
            line-height: 1rem;
            margin-right: 2px;
            width: 16px;
            height: 16px;
            display: inline-block;
            vertical-align: middle;
            border: 0 none;
            cursor: pointer;
            outline: none;
            background-color: #fff;
            background-repeat: no-repeat;
            background-attachment: scroll;
            width: 13px;
            height: 13px;
            margin: 0 3px;
            background-position: 0 0;
            border: 1px solid #ccc;
            position: relative
        }

        .rc-tree li .rc-tree-checkbox.rc-tree-checkbox-checked {
            border-color: #00a99d
        }

            .rc-tree li .rc-tree-checkbox.rc-tree-checkbox-checked:before {
                content: '\ed1e';
                font-family: 'fontello';
                color: #00a99d;
                position: absolute;
                font-size: 9px;
                left: 1px;
                top: -1px
            }

        .rc-tree li span.rc-tree-iconEle {
            line-height: 1rem;
            margin-right: 2px;
            width: 0px;
            height: 16px;
            display: inline-block;
            vertical-align: middle;
            border: 0 none;
            cursor: pointer;
            outline: none;
            background-color: transparent;
            background-repeat: no-repeat;
            background-attachment: scroll
        }

        .rc-tree li span.rc-tree-switcher.rc-tree-icon__customize {
            background-image: none
        }

        .rc-tree li span.rc-tree-checkbox.rc-tree-icon__customize {
            background-image: none
        }

        .rc-tree li span.rc-tree-iconEle.rc-tree-icon__customize {
            background-image: none
        }

        .rc-tree li span.rc-tree-icon_loading {
            margin-right: 2px;
            vertical-align: top;
            background: #ccc
        }

        .rc-tree li span.rc-tree-switcher.rc-tree-switcher-noop {
            cursor: auto
        }

        .rc-tree li span.rc-tree-switcher.rc-tree-switcher_open::before {
            content: '\f03e';
            font-family: 'fontello';
            color: #999;
            position: relative;
            font-size: .75rem
        }

        .rc-tree li span.rc-tree-switcher.rc-tree-switcher_close::before {
            content: '\f03d';
            font-family: 'fontello';
            color: #999;
            position: relative;
            font-size: .75rem
        }

        .rc-tree li span.rc-tree-checkbox-checked {
            background-position: -14px 0
        }

        .rc-tree li span.rc-tree-checkbox-indeterminate {
            background-position: -14px -28px
        }

        .rc-tree li span.rc-tree-checkbox-disabled {
            background-position: 0 -56px
        }

        .rc-tree li span.rc-tree-checkbox.rc-tree-checkbox-checked.rc-tree-checkbox-disabled {
            background-position: -14px -56px
        }

        .rc-tree li span.rc-tree-checkbox.rc-tree-checkbox-indeterminate.rc-tree-checkbox-disabled {
            position: relative;
            background: #ccc;
            border-radius: 3px
        }

            .rc-tree li span.rc-tree-checkbox.rc-tree-checkbox-indeterminate.rc-tree-checkbox-disabled::after {
                content: ' ';
                -webkit-transform: scale(1);
                transform: scale(1);
                position: absolute;
                left: 3px;
                top: 5px;
                width: 5px;
                height: 0;
                border: 2px solid #fff;
                border-top: 0;
                border-left: 0
            }

        .rc-tree li.drag-over > .draggable {
            background-color: #357edd;
            color: #fff;
            border: 1px #316ac5 solid;
            opacity: 0.8
        }

        .rc-tree li.drag-over-gap-top > .draggable {
            border-top: 2px blue solid
        }

        .rc-tree li.drag-over-gap-bottom > .draggable {
            border-bottom: 2px blue solid
        }

        .rc-tree li.filter-node > .rc-tree-node-content-wrapper {
            color: transperant !important;
            font-weight: bold !important
        }

    .rc-tree:not(.rc-tree-show-line) .rc-tree-switcher-noop {
        background: none
    }

    .rc-tree.rc-tree-show-line li:not(:last-child) > ul {
        background: transparent
    }

    .rc-tree.rc-tree-show-line li:not(:last-child) > .rc-tree-switcher-noop {
        background-position: -56px -18px
    }

    .rc-tree.rc-tree-show-line li:last-child > .rc-tree-switcher-noop {
        background-position: -56px -36px
    }

.rc-tree-child-tree {
    display: none
}

.rc-tree-child-tree-open {
    display: block
}

.rc-tree-treenode-disabled > span:not .rc-tree-switcher {
    color: #ccc;
    cursor: not-allowed
}

.rc-tree-treenode-disabled > a {
    color: #ccc;
    cursor: not-allowed
}

    .rc-tree-treenode-disabled > a span {
        color: #ccc;
        cursor: not-allowed
    }

.rc-tree-node-selected {
    background-color: #fbf1a9;
    border: 1px #ffb951 solid;
    opacity: 0.8
}

.rc-tree-icon__open {
    margin-right: 2px;
    background-position: -110px -16px;
    vertical-align: top
}

.rc-tree-icon__close {
    margin-right: 2px;
    background-position: -110px 0;
    vertical-align: top
}

.rc-tree-icon__docu {
    margin-right: 2px;
    background-position: -110px -2rem;
    vertical-align: top
}

.rc-tree-icon__customize {
    margin-right: 2px;
    vertical-align: top
}

.loaderCon {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff
}

.loaderCircle, .loaderCircle-btn {
    width: 40px;
    height: 40px;
    pointer-events: none;
    border: 5px solid transparent;
    border-radius: 50%;
    -webkit-animation: 1s loaderCircle linear infinite;
    animation: 1s loaderCircle linear infinite;
    position: relative;
    z-index: 10
}

    .loaderCircle:before, .loaderCircle-btn:before {
        content: '';
        display: block;
        position: absolute;
        top: -5px;
        left: -5px;
        bottom: -5px;
        right: -5px;
        border: 5px solid #999;
        border-radius: 50%;
        opacity: .2
    }

@-webkit-keyframes loaderCircle {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes loaderCircle {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

.loaderCircle-btn {
    width: 1rem;
    height: 1rem
}

.crm-card .crm-card .cardLoader {
    top: -46px
}

.crm-table-container .cardLoader {
    height: 29rem;
    position: relative;
    border: 1px solid #eaeaea;
    box-shadow: 0 1px 4px 0 rgba(0,0,0,0.14);
    background: #ffffff
}

.cardLoader {
    position: absolute;
    background: #fff;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    z-index: 200;
    display: flex;
    align-items: center;
    justify-content: center
}

    .cardLoader .cardLoader__progress {
        height: 2px;
        width: 100%;
        background: #f99420;
        position: absolute;
        left: 0;
        top: 0
    }

.cardLoader__circle {
    display: flex;
    align-items: center;
    justify-content: center
}

    .cardLoader__circle .loaderIcon {
        width: 10px;
        height: 10px;
        margin: 0 10px;
        border-radius: 100%;
        -webkit-animation: loaderIcon 1.4s ease-in-out infinite;
        animation: loaderIcon 1.4s ease-in-out infinite
    }

    .cardLoader__circle .greenCircle {
        background: #8bc34a;
        -webkit-animation-delay: 0.2s;
        animation-delay: 0.2s
    }

    .cardLoader__circle .redCircle {
        background: #f44336;
        -webkit-animation-delay: 0.4s;
        animation-delay: 0.4s
    }

    .cardLoader__circle .orangeCircle {
        background: #ff9800;
        -webkit-animation-delay: 0.6s;
        animation-delay: 0.6s
    }

@-webkit-keyframes loaderIcon {
    0%,100% {
        transform: scale(1);
        -ms-transform: scale(1);
        -webkit-transform: scale(1)
    }

    50% {
        transform: scale(1.7);
        -ms-transform: scale(1.7);
        -webkit-transform: scale(1.7)
    }
}

@keyframes loaderIcon {
    0%,100% {
        transform: scale(1);
        -ms-transform: scale(1);
        -webkit-transform: scale(1)
    }

    50% {
        transform: scale(1.7);
        -ms-transform: scale(1.7);
        -webkit-transform: scale(1.7)
    }
}

.cardLoader__text {
    margin-top: 18px;
    font-size: 10px;
    text-align: center
}

.cardLoader + .crm-card, .cardLoader + .crm-table {
    display: none
}

.notifictionpopup .cardLoader, .ui-dialog .cardLoader {
    position: absolute !important
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .form .form-row .form-element--group .form-element.form-element--labelLeft .form-element__label {
        height: auto;
        padding-top: 0.5rem
    }

    .form .form-row .form-element--group .isInformational.form-element.form-element--labelLeft .form-element__label {
        height: auto;
        padding-top: 0rem;
        min-height: 0
    }

    body, html {
        height: 100%
    }

    .ui-dialog .crm-table-container .crm-table__filterBox .filtersContainer {
        width: 100%
    }

        .ui-dialog .crm-table-container .crm-table__filterBox .filtersContainer .filterGroup .form-element {
            width: 100% !important;
            justify-content: flex-end
        }

        .ui-dialog .crm-table-container .crm-table__filterBox .filtersContainer .filterGroup:nth-child(2) {
            width: auto !important
        }

    .ui-dialog .crm-table-container .crm-table__filterBox .column--container .form-element__control .field .selectbox {
        height: 26px
    }

    div.action-hover .action-hover-icon {
        width: 15px;
        padding: 5px 0;
        margin: 4px 0px
    }

        div.action-hover .action-hover-icon .icon {
            margin-left: -4px;
            margin-top: -2px
        }

    div.action-hover .action-items-box {
        display: block;
        padding-right: 23px
    }

        div.action-hover .action-items-box .caret--up {
            top: 12px
        }

    .form--horizontal .form-row .form-element .form-element__label {
        padding-top: 0px
    }

    .crm-table__filterBox .filterGroup .form-element .form-element__label {
        padding-top: .25rem
    }

    .crm-table .crm-table__header {
        height: 3rem
    }

    .crm-card__header .popover-wrapper-trigger {
        display: flex;
        align-items: center
    }

    .card-social-box {
        padding-bottom: 48px
    }

    .detailpageView .form--horizontal .form-row .form-element .form-element__label {
        padding-top: 0
    }

    .designerbody .menuslider {
        flex: 1
    }

    .designerbody .ld-option__item {
        display: block;
        height: auto
    }

    .homepage-designer td .table-td--height td {
        border: 1px solid #ccc !important
    }

    .action-hover .action-items-box .action-items .action-hover__item a {
        padding: 4px 8px
    }

    .crm-card.crm-card--reportFavlisting, .crm-card.crm-card--reportlisting {
        min-width: 0px !important;
        max-width: 100% !important
    }

    .Popover .form-tooltip__popup {
        min-width: auto !important
    }

        .Popover .form-tooltip__popup > .react-form {
            min-width: 160px
        }

    .crm-card .crm-card__header .card-media {
        max-width: 100% !important
    }

    .assignmentRuleContainer .admin-side__listing {
        max-width: 100%
    }

        .assignmentRuleContainer .admin-side__listing #TblAssignmentRule {
            max-width: 100%
        }

            .assignmentRuleContainer .admin-side__listing #TblAssignmentRule .whitebox {
                max-width: 1170px
            }

            .assignmentRuleContainer .admin-side__listing #TblAssignmentRule .griddle--scroll {
                max-width: 100%
            }

    .clndrCSS .cell-label__width {
        min-width: 8rem
    }

        .clndrCSS .cell-label__width + .field {
            width: -webkit-calc(100% - 136px);
            width: -moz-calc(100% - 136px);
            width: -ms-calc(100% - 136px);
            width: -o-calc(100% - 136px);
            width: calc(100% - 136px)
        }

    .compositeControl .form-element__label {
        padding-left: 30px !important
    }

    .appLauncherContainer {
        display: none
    }

    .compositeControl .form-element__label {
        padding-left: 30px !important
    }

    .ReactFlipCard {
        perspective: 0;
        -ms-transform: perspective(0) !important;
        transform: perspective(0) !important
    }

    .crm-card .crm-card__body--casecard .action-hover {
        top: 3px !important
    }

        .crm-card .crm-card__body--casecard .action-hover .action-items-box {
            top: -3px !important
        }

    .lay-dialog .layout-form--controller .table--row td:first-child {
        width: 40%
    }

    .crm-card.crm-card--relatedProfile .crm-card__body .relatedProfile__container .relatedProfile__items:first-child:nth-last-child(1) {
        max-width: 100%
    }

    .crm-card.crm-card--relatedProfile .crm-card__body .relatedProfile__container .relatedProfile__items:first-child:nth-last-child(2), .crm-card.crm-card--relatedProfile .crm-card__body .relatedProfile__container .relatedProfile__items:first-child:nth-last-child(2) ~ .relatedProfile__items {
        max-width: 100% !important
    }

    .autoDoc-row .autoDoc__item {
        max-width: 100% !important
    }

    .custom-tab__label1 {
        float: left;
        padding-top: 8px
    }

        .custom-tab__label1 > .flex-1 {
            float: left;
            width: -webkit-calc(100% - 40px);
            width: -moz-calc(100% - 40px);
            width: -ms-calc(100% - 40px);
            width: -o-calc(100% - 40px);
            width: calc(100% - 40px)
        }

    .custom-tab__label2 {
        float: left;
        padding-top: 8px
    }

    .gridSearch .form-element__control {
        width: 140px
    }

    .timestampcard .combineValue__item .card-field__row {
        max-width: 100% !important
    }

    .countryList {
        transition-delay: 0.2s;
        -ms-transition-delay: 0.2s
    }

    .filteroptions .form--horizontal .form-row .column--container .form-element__control > div {
        width: 100%;
        min-width: 100%;
        display: flex;
        display: -ms-flexbox
    }

    .filteroptions .form--horizontal .form-row .column--container .form-element__control:nth-child(2) .form-element__label, .filteroptions .form--horizontal .form-row .column--container .form-element__control:nth-child(3) .form-element__label {
        padding-right: 20px;
        white-space: nowrap
    }

    .filteroptions .form--horizontal .form-row .column--container .date-field-container {
        width: 100%
    }

        .filteroptions .form--horizontal .form-row .column--container .date-field-container .picker-icon .popover-wrapper-trigger {
            display: block
        }

    .designerbody .menuslider {
        flex: 1
    }

    .designerbody .ld-option__item {
        display: block;
        height: auto
    }

    .homepage-designer td .table-td--height td {
        border: 1px solid #ccc !important
    }

    .action-hover .action-items-box .action-items .action-hover__item a {
        padding: 4px 8px
    }

    .crm-card.crm-card--reportFavlisting, .crm-card.crm-card--reportlisting {
        min-width: 0px !important;
        max-width: 100% !important
    }

    .Popover .form-tooltip__popup {
        min-width: auto !important
    }

        .Popover .form-tooltip__popup > .react-form {
            min-width: 160px
        }

    .crm-card .crm-card__header .card-media {
        max-width: 100% !important
    }

    .assignmentRuleContainer .admin-side__listing {
        max-width: 100%
    }

        .assignmentRuleContainer .admin-side__listing #TblAssignmentRule {
            max-width: 100%
        }

            .assignmentRuleContainer .admin-side__listing #TblAssignmentRule .whitebox {
                max-width: 1170px
            }

            .assignmentRuleContainer .admin-side__listing #TblAssignmentRule .griddle--scroll {
                max-width: 100%
            }

    .clndrCSS .cell-label__width {
        min-width: 8rem
    }

        .clndrCSS .cell-label__width + .field {
            width: -webkit-calc(100% - 136px);
            width: -moz-calc(100% - 136px);
            width: -ms-calc(100% - 136px);
            width: -o-calc(100% - 136px);
            width: calc(100% - 136px)
        }

    .compositeControl .form-element__label {
        padding-left: 30px !important
    }

    .appLauncherContainer {
        display: none
    }

    .compositeControl .form-element__label {
        padding-left: 30px !important
    }

    .ReactFlipCard {
        perspective: 0;
        -ms-transform: perspective(0) !important;
        transform: perspective(0) !important
    }

    .crm-card .crm-card__body--casecard .action-hover {
        top: 3px !important
    }

        .crm-card .crm-card__body--casecard .action-hover .action-items-box {
            top: -3px !important
        }

    .lay-dialog .layout-form--controller .table--row td:first-child {
        width: 40%
    }

    .crm-card.crm-card--relatedProfile .crm-card__body .relatedProfile__container .relatedProfile__items:first-child:nth-last-child(1) {
        max-width: 100%
    }

    .crm-card.crm-card--relatedProfile .crm-card__body .relatedProfile__container .relatedProfile__items:first-child:nth-last-child(2), .crm-card.crm-card--relatedProfile .crm-card__body .relatedProfile__container .relatedProfile__items:first-child:nth-last-child(2) ~ .relatedProfile__items {
        max-width: 100% !important
    }

    .autoDoc-row .autoDoc__item {
        max-width: 100% !important
    }

    .custom-tab__label1 {
        float: left;
        padding-top: 8px
    }

        .custom-tab__label1 > .flex-1 {
            float: left;
            width: -webkit-calc(100% - 40px);
            width: -moz-calc(100% - 40px);
            width: -ms-calc(100% - 40px);
            width: -o-calc(100% - 40px);
            width: calc(100% - 40px)
        }

    .custom-tab__label2 {
        float: left;
        padding-top: 8px
    }

    .gridSearch .form-element__control {
        width: 140px
    }

    .timestampcard .combineValue__item .card-field__row {
        max-width: 90% !important
    }

    .countryList {
        transition-delay: 0.2s;
        -ms-transition-delay: 0.2s
    }

    .reportPopup .ui-dialog .filteroptions__body .form-row:last-child {
        margin-bottom: 1rem
    }

    .discussionThread__image img {
        width: 100%
    }

    .layoutEdit td {
        border: 0 !important
    }

    .tab__section--convertobj td {
        padding: 20px !important
    }

    .react-form-wrapper .object-action-btn.fixed, .react-form-wrapper .fixed.react-form-btns {
        right: 17px;
        left: 50px
    }

    .form-row .form-element--group .isInformational.form-element .column--container .form-element--group-column .isInformational.form-element .form-element__control {
        flex: none
    }

    .more-container:hover .more-opt-con {
        top: 40px
    }

    .nohscroll.set__filter .table--filter td .field {
        min-width: 7rem
    }

    .crm-card .action-hover .action-items-box .action-items .action-hover__item a {
        max-width: 80px !important
    }

    .isInformational.phoneTypeField .form-element__label + .flex-1 {
        min-height: 38px !important
    }

    .Popover .popover-container {
        width: 250px !important
    }

    .summaryband__item .date-time-label {
        min-height: 30px !important;
        margin-bottom: 8px !important
    }

    .mappingfield--center table .field table {
        table-layout: auto !important
    }

    .flowWithNavigation.Style1 .ContentStyle5 .section-contents > .form-row .form-element--group .column--container .form-element--group-column.cw-5 {
        top: 46px !important
    }

    .participants__listing .enableScroll .react-grid-Canvas {
        overflow-x: hidden !important
    }

    .crm-card .crm-card__header .card-media .card-media__text, .crmCardFilterPolicy .crm-card__header .card-media .card-media__text {
        max-width: 99% !important
    }

    .duration .duration__item {
        flex: none !important
    }

        .duration .duration__item .duration__item--textbox {
            flex: none !important
        }
}

@media print {
    .detailtab .crm-table-wrapper div.react-grid-Container *, .detailtab .crm-table-wrapper div.react-grid-Container .react-grid-Canvas, .detailtab .crm-table-wrapper div.react-grid-Container .react-grid-Viewport, .detailtab .crm-table-wrapper div.react-grid-Container .react-grid-HeaderRow, .detailtab .crm-table-wrapper div.react-grid-Container .react-grid-HeaderCell, .detailtab .crm-table-wrapper div.react-grid-Container .react-grid-Header, .detailtab .crm-table-wrapper div.react-grid-Container .react-grid-Grid {
        position: static !important
    }

        .detailtab .crm-table-wrapper div.react-grid-Container .react-grid-Canvas, .detailtab .crm-table-wrapper div.react-grid-Container .react-grid-Viewport, .detailtab .crm-table-wrapper div.react-grid-Container .react-grid-Grid, .detailtab .crm-table-wrapper div.react-grid-Container .react-grid-Canvas > div {
            overflow: visible !important
        }

    .detailtab .crm-table-wrapper div.react-grid-Container .react-grid-Container div.react-grid-Cell {
        position: absolute !important
    }

    .detailtab .crm-table-wrapper div.react-grid-Container div.react-grid-Row, .detailtab .crm-table-wrapper div.react-grid-Container .react-grid-Row div.react-grid-Cell__value {
        position: relative !important
    }

    .bulkprint .form .form-row .form-element--group .form-element .form-element__control .f13, .bulkprint .form .form-row .form-element--group .form-element .form-element__control .f15 {
        word-break: break-all;
        width: 100%
    }
}

@media all and (max-width: 768px) {
    .overflow_isMobile {
        padding: 0
    }
}

@media print {
    .gridSearchCotainer, .crm-table__filterBox, .autoinfo {
        display: none !important
    }

    .react-form.form {
        border: 0px solid #ddd !important;
        padding: 0 !important;
        box-shadow: none !important;
        box-sizing: border-box !important;
        margin: 0 !important
    }

    .bigCalendar .gridSearch {
        display: none !important
    }

    .Popup .form-wrapper {
        height: auto !important;
        padding: 0 !important;
        display: block
    }

    * {
        box-shadow: none !important
    }

    .flowWithNavigation body.Popup .form-wrapper {
        height: auto !important;
        overflow: visible !important
    }

    .htmlHidden, * {
        overflow: visible !important
    }

    body, html {
        overflow: visible !important;
        min-height: 100vh
    }

    body {
        padding: 0;
        margin: 0;
        background: #fff
    }

    .page-header + div {
        border: 1px solid #eee
    }

    .main-content--setup, .main-content.main-content--setup {
        max-width: 100% !important
    }

        .main-content--setup .crmBodyContainer, .main-content--setup .page-header, .main-content.main-content--setup .crmBodyContainer, .main-content.main-content--setup .page-header {
            max-width: 100% !important
        }

    .whitebox, * {
        box-shadow: none !important
    }

    .fixed-action-button {
        display: none
    }

    .form-element__control {
        height: auto !important;
        overflow: hidden
    }

    .reportPopupScroll {
        overflow: visible !important
    }

        .reportPopupScroll #Report-container {
            height: auto;
            overflow: visible !important;
            page-break-after: always
        }

    .print-container:first-child .page-header {
        display: block
    }

    .print-container {
        page-break-after: always
    }

    .react-grid-Container, .react-grid-HeaderRow {
        width: 100% !important
    }

        .react-grid-Container .react-grid-Toolbar, .react-grid-Container .react-grid-checkbox, .react-grid-Container .react-grid-checkbox-container, .react-grid-HeaderRow .react-grid-Toolbar, .react-grid-HeaderRow .react-grid-checkbox, .react-grid-HeaderRow .react-grid-checkbox-container {
            display: none !important
        }

    .react-grid-Row {
        display: flex !important;
        width: 100% !important
    }

    .crm-grid-row.relative {
        width: 100% !important
    }

    .react-grid-HeaderRow > div {
        display: flex !important
    }

    .form-row .form-element--group {
        flex: auto
    }

        .form-row .form-element--group .form-element .crm-card {
            overflow: hidden !important
        }

    .custom-btn-listing, .fixed-action-button, .print, #pgt, .mass--print a, .PT_Links a, .softPhone, .filter-container, .action-links, .filterGroup__button, .sidebar-container, .cloud-nav, .relatedlinks, .PtbtnsBottom, #custom-div-button, .button-group, .breadcrums, .userspage .griddle-body table th:first-child, .userspage .griddle-body table td:first-child, .page-title-row-box--rt, .hidecal {
        display: none !important
    }

    .box-item {
        max-height: initial !important;
        overflow: visible !important
    }

    .reportPopupScroll {
        overflow: auto !important
    }

        .reportPopupScroll #Report-container {
            overflow: visible !important;
            height: auto !important
        }

    .side-nav, .header, footer, .object-action-btn, a.ml3.self-start {
        display: none !important
    }

    .main-content {
        max-width: 100%
    }

    .date .binds {
        display: none !important
    }

    .date .month {
        display: block;
        padding: 5px 0;
        font-size: .9375rem
    }

    .cogentview .cogentview-rightsection {
        display: none !important
    }

    .cogentview .cogentview-leftsection {
        width: 100%;
        margin: 0
    }

        .cogentview .cogentview-leftsection .mom-icons {
            display: none
        }

    .cogentview-leftsection {
        border: 1px solid #ccc
    }

    .side-nav, .header, footer, .no-print, #tlfnp, .action-hover, .share-tab-con, td.checkbox-td, [data-title="CheckBox"], .page-title__iconcon {
        display: none !important
    }

    .main-content {
        padding: .5rem 0
    }

    .card {
        box-shadow: none !important;
        border: 1px solid #ccc
    }

    .pagination {
        display: none !important
    }

    .report-header .report-actions {
        display: none !important
    }

    .date .month {
        background: #00a99d !important;
        border-top: 1px solid #00a99d;
        -webkit-print-color-adjust: exact
    }

    .react-grid-Main .react-grid-Cell--locked:last-of-type {
        border-right: 1px solid #ddd;
        box-shadow: none;
        min-width: 0
    }

    .filtersContainer .filterGroup .form-element__control {
        display: none
    }

    .filterGroup {
        display: block !important
    }

        .filterGroup .form-element {
            float: left !important;
            display: block !important
        }

        .filterGroup .form-element__control {
            float: left !important
        }

            .filterGroup .form-element__control .selectbox-container {
                border: 1px solid #eee !important
            }

                .filterGroup .form-element__control .selectbox-container select {
                    margin-right: 10px !important
                }

        .filterGroup .form-element__label {
            float: left !important
        }

        .filterGroup .form-element__label {
            min-height: 0 !important;
            float: left !important
        }

    .crm-reporttable__header {
        position: static !important
    }

    .crm-card-reportTable table thead {
        position: static !important
    }

    .reportPopupScroll .Popup.reportPopup {
        padding-top: 0 !important;
        padding-bottom: 0 !important
    }

    .htmlHidden {
        overflow: auto !important
    }

    body {
        overflow: auto !important
    }

    .flowWithNavigation body.bg-near-white.Popup.RunFlowContainer .form-wrapper {
        overflow: auto !important;
        height: auto !important;
        padding: 0 !important
    }

    .griddle-body {
        overflow: visible !important;
        max-height: 100% !important
    }

    .whitebox {
        box-shadow: none !important
    }

    .crm-table .crm-table__header {
        border-bottom: none !important
    }

    .page-header + div {
        border: 1px solid #eee
    }

    .crm-reporttable__header {
        position: static !important
    }

    .crm-card-reportTable table thead {
        position: static !important
    }

    .reportPopupScroll .Popup.reportPopup {
        padding-top: 0 !important;
        padding-bottom: 0 !important
    }

    .page-header + div {
        border: 1px solid #eee
    }

    .main-content--setup, .main-content.main-content--setup {
        max-width: 100% !important
    }

        .main-content--setup .crmBodyContainer, .main-content--setup .page-header, .main-content.main-content--setup .crmBodyContainer, .main-content.main-content--setup .page-header {
            max-width: 100% !important
        }

    .whitebox, * {
        box-shadow: none !important
    }

    html body *, html body div, html body span, html body label, html body p {
        white-space: normal !important
    }

    .form .form-row {
        display: flex !important
    }

        .form .form-row .form-element--group .form-element.form-element--labelLeft {
            display: flex !important;
            align-items: center
        }

            .form .form-row .form-element--group .form-element.form-element--labelLeft .form-element__label {
                justify-content: flex-end !important;
                align-self: flex-start !important;
                text-align: right !important;
                min-width: 12rem !important
            }

        .form .form-row .column--container {
            display: flex !important
        }

    .composite-layout .composite-layout__panel {
        max-width: 100% !important
    }

    body, html {
        overflow: visible !important
    }

    .reactwindowpopup.Popup {
        padding: 0
    }

        .reactwindowpopup.Popup #newobject {
            padding: 0;
            border: 0
        }

        .reactwindowpopup.Popup .page-title-block, .reactwindowpopup.Popup .page-header {
            position: relative
        }

    .bigCalendar .side-nav + .main-content .crm-calendar-wrapper .toggleRightPanel {
        display: none !important
    }

    .bigCalendar .side-nav + .main-content .crm-calendar-wrapper .button-cal-group {
        left: 60px !important
    }

        .bigCalendar .side-nav + .main-content .crm-calendar-wrapper .button-cal-group .button--calendar {
            margin: 0 !important;
            padding: 0 !important
        }

            .bigCalendar .side-nav + .main-content .crm-calendar-wrapper .button-cal-group .button--calendar:first-child, .bigCalendar .side-nav + .main-content .crm-calendar-wrapper .button-cal-group .button--calendar:nth-child(2) {
                opacity: 0
            }

            .bigCalendar .side-nav + .main-content .crm-calendar-wrapper .button-cal-group .button--calendar .icon-list4 {
                display: none !important
            }

            .bigCalendar .side-nav + .main-content .crm-calendar-wrapper .button-cal-group .button--calendar .date-field-container a {
                display: none !important
            }

    .bigCalendar .side-nav + .main-content .crm-calendar-wrapper .buttons-group .button-border-link {
        display: none !important
    }

    .bigCalendar .side-nav + .main-content .crm-calendar-wrapper .actionToolBar {
        right: 0
    }

    .bigCalendar .side-nav + .main-content .crm-calendar-wrapper .rbc-toolbar {
        right: 100px
    }
}

.composite-layout__sidepanel .form-row .form-element--group {
    max-width: 100% !important
}

@media screen and (min-width: 990px) {
    .layout-container .form-row .form-element--group:first-child:nth-last-child(1) {
        max-width: 100%
    }

    .layout-container .form-row .form-element--group:first-child:nth-last-child(2), .layout-container .form-row .form-element--group:first-child:nth-last-child(2) ~ .form-element--group {
        max-width: 50%
    }

    .layout-container .form-row .form-element--group.form-element--group--70 {
        min-width: 66.67%;
        max-width: 66.67% !important
    }

        .layout-container .form-row .form-element--group.form-element--group--70 + .form-element--group {
            max-width: 33.33% !important
        }

    .layout-container .form-row .form-element--group:first-child:nth-last-child(3), .layout-container .form-row .form-element--group:first-child:nth-last-child(3) ~ .form-element--group {
        max-width: 33.3333%
    }

    .layout-container .form-row .form-element--group:first-child:nth-last-child(4), .layout-container .form-row .form-element--group:first-child:nth-last-child(4) ~ .form-element--group {
        max-width: 25%
    }

    .layout-container .form-row .form-element--group:first-child:nth-last-child(5), .layout-container .form-row .form-element--group:first-child:nth-last-child(5) ~ .form-element--group {
        max-width: 20%
    }

    .maincontaint > #layoutmaincontainer {
        margin: -8px;
        width: auto
    }

        .maincontaint > #layoutmaincontainer > .flexbox-row {
            margin: 0
        }

            .maincontaint > #layoutmaincontainer > .flexbox-row > .flex-item {
                padding: .5rem;
                margin: 0
            }

                .maincontaint > #layoutmaincontainer > .flexbox-row > .flex-item:first-child:nth-last-child(1) {
                    max-width: 100%
                }

                .maincontaint > #layoutmaincontainer > .flexbox-row > .flex-item:first-child:nth-last-child(2), .maincontaint > #layoutmaincontainer > .flexbox-row > .flex-item:first-child:nth-last-child(2) ~ .flex-item {
                    max-width: 50%
                }

            .maincontaint > #layoutmaincontainer > .flexbox-row .flex-item.flex-2 {
                min-width: 66.67%;
                max-width: 66.67% !important
            }

                .maincontaint > #layoutmaincontainer > .flexbox-row .flex-item.flex-2 + .flex-item {
                    max-width: 33.33% !important
                }

            .maincontaint > #layoutmaincontainer > .flexbox-row > .flex-item:first-child:nth-last-child(3), .maincontaint > #layoutmaincontainer > .flexbox-row > .flex-item:first-child:nth-last-child(3) ~ .flex-item {
                max-width: 33.3333%
            }

            .maincontaint > #layoutmaincontainer > .flexbox-row > .flex-item:first-child:nth-last-child(4), .maincontaint > #layoutmaincontainer > .flexbox-row > .flex-item:first-child:nth-last-child(4) ~ .flex-item {
                max-width: 25%
            }

            .maincontaint > #layoutmaincontainer > .flexbox-row > .flex-item:first-child:nth-last-child(5), .maincontaint > #layoutmaincontainer > .flexbox-row > .flex-item:first-child:nth-last-child(5) ~ .flex-item {
                max-width: 20%
            }
}

@media (max-width: 400px) {
    .dashletContainer {
        display: none
    }
}

@media (max-width: 400px) {
    .dashletContainer {
        display: none
    }
}

@media all and (min-width: 767px) and (max-width: 1200px) {
    .form .form-row .form-element--group .form-element.form-element--labelLeft .form-element__label {
        min-width: 7rem;
        max-width: 7rem;
        width: 7rem
    }
}

@media all and (max-width: 1080px) {
    .main-content {
        max-width: -webkit-calc(100% - 60px);
        max-width: -moz-calc(100% - 60px);
        max-width: -ms-calc(100% - 60px);
        max-width: -o-calc(100% - 60px);
        max-width: calc(100% - 60px)
    }

    .expanded-nav + .main-content {
        max-width: -webkit-calc(100% - 200px);
        max-width: -moz-calc(100% - 200px);
        max-width: -ms-calc(100% - 200px);
        max-width: -o-calc(100% - 200px);
        max-width: calc(100% - 200px)
    }
}

@media all and (max-width: 1080px) {
    .main-content {
        max-width: -webkit-calc(100% - 60px);
        max-width: -moz-calc(100% - 60px);
        max-width: -ms-calc(100% - 60px);
        max-width: -o-calc(100% - 60px);
        max-width: calc(100% - 60px)
    }

    .expanded-nav + .main-content {
        max-width: -webkit-calc(100% - 200px);
        max-width: -moz-calc(100% - 200px);
        max-width: -ms-calc(100% - 200px);
        max-width: -o-calc(100% - 200px);
        max-width: calc(100% - 200px)
    }

    .form.form--stack .form-row .form-element--group .form-element.form-element--labelLeft .form-element__label {
        min-width: 0;
        max-width: 100%;
        width: 100%
    }
}

@media all and (max-width: 1024) {
    .crm-table-wrapper .crm-table-container .tableWrapper .cardListingScroll .cardListing__row {
        width: 29%
    }
}

@media screen and (min--moz-device-pixel-ratio: 0) {
    .react-grid-Cell:not(.editing):not(.rdg-child-cell) .react-grid-Cell__value {
        transform: translateY(-51%) !important
    }

    .custom-popup .checkbox-button {
        transform: translate(0, -1px) !important
    }

    .react-grid-Grid .react-grid-Cell__value .react-grid-checkbox-label {
        transform: translate(0, -1px) !important
    }
}

@media all and (max-width: 599px) {
    .attchementContainer {
        padding-top: 50px
    }

        .attchementContainer .attchement__header {
            height: 100px;
            flex-wrap: wrap;
            justify-content: center
        }

    .fc-view-agendaWeek .fc-agenda-days tr.fc-first th.fc-widget-header, .fc-view-agendaWeek .fc-agenda-allday tr.fc-first th.fc-widget-header {
        width: calc(100% / 8) !important
    }
}

@media all and (min-width: 421px) and (max-width: 550px) {
    .htmlHidden.surveyBuilderNew body.bg-near-white.reactwindowpopup.Popup div.npsDiv {
        padding: 40px 20px
    }

        .htmlHidden.surveyBuilderNew body.bg-near-white.reactwindowpopup.Popup div.npsDiv .tblExecuteSurvey-tr.nps table tr td.survey-qu--pdng .radio-button {
            height: 30px;
            width: 30px;
            font-size: 13px
        }

    .htmlHidden.surveyBuilderNew .alredayDoneMsgCntn .alredayDoneMsg {
        padding: 30px 10px !important
    }
}

@media all and (min-width: 0px) and (max-width: 420px) {
    .htmlHidden.surveyBuilderNew body.bg-near-white.reactwindowpopup.Popup div.npsDiv {
        padding: 30px 10px
    }

        .htmlHidden.surveyBuilderNew body.bg-near-white.reactwindowpopup.Popup div.npsDiv .tblExecuteSurvey-tr.nps table tr td.survey-qu--pdng .radio-button {
            width: 25px;
            height: 24px;
            font-size: 13px
        }

    .htmlHidden.surveyBuilderNew .alredayDoneMsgCntn .alredayDoneMsg {
        padding: 30px 10px !important
    }
}

body, html {
    min-height: 100%
}

.customModal {
    display: none;
    overflow: auto;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1050;
    -webkit-overflow-scrolling: touch;
    outline: 0;
    background-color: rgba(0,0,0,0.4);
}

    .customModal.fadeModal .customModal-dialog {
        -webkit-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1);
        -webkit-transition: all .25s linear; /*-webkit-transform 0.3s ease-out;*/
        -o-transition: all .25s linear; /*-o-transform 0.3s ease-out;*/
        transition: all .25s linear; /*transform 0.3s ease-out;*/
    }

    .customModal.in .customModal-dialog {
        -webkit-transform: scale(0);
        -ms-transform: scale(0);
        -o-transform: scale(0);
        transform: scale(0);
    }

.customModal-open .customModal {
    overflow-x: hidden;
    overflow-y: auto;
}

.customModal-dialog {
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
}

.customModal-content {
    position: relative;
    background-color: #ffffff;
    border: 1px solid #999999;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 6px;
    -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
    box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    outline: 0;
    -webkit-animation-name: animatetop;
    -webkit-animation-duration: 0.5s;
    animation-name: animatetop;
    animation-duration: 0.5s;
    margin: 0 auto;
}

.customModal-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1040;
    background-color: #000000;
}

    .customModal-backdrop.fadeModal {
        opacity: 0;
        filter: alpha(opacity=0);
    }

    .customModal-backdrop.in {
        opacity: 0.5;
        filter: alpha(opacity=50);
    }

.customModal-header {
    padding: 15px;
    border-bottom: 1px solid #e5e5e5;
    min-height: 16.42857143px;
}

    .customModal-header .close {
        margin-top: -2px;
        font-size: 20px;
    }

.customModal-title {
    margin: 0;
    line-height: 1.42857143;
}

.customModal-body {
    position: relative;
    padding: 5px;
}

.customModal-footer {
    padding: 15px;
    text-align: right;
    border-top: 1px solid #e5e5e5;
}

    .customModal-footer .btn + .btn {
        margin-left: 5px;
        margin-bottom: 0;
    }

    .customModal-footer .btn-group .btn + .btn {
        margin-left: -1px;
    }

    .customModal-footer .btn-block + .btn-block {
        margin-left: 0;
    }

.customModal-scrollbar-measure {
    position: absolute;
    top: -9999px;
    width: 50px;
    height: 50px;
    overflow: scroll;
}

.close {
    float: right;
    font-size: 21px;
    font-weight: bold;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    filter: alpha(opacity=20)
}

.ddlWithAddIcon {
    display: inline;
    width: 90%;
}

.addIcon {
    cursor: pointer;
    font-size: 25px;
}






@media all and (max-width: 750px) {
    .appLoader {
        width: 100%;
        height: 3px;
        position: fixed;
        top: 100px;
        left: 0;
        z-index: 999
    }

    .fixedFooter {
    }
}

@media all and (min-width: 750px) {
    .appLoader {
        width: 100%;
        height: 3px;
        position: fixed;
        top: 50px;
        left: 0;
        z-index: 999
    }

    .fixedFooter {
        position: fixed;
        bottom: 0;
        left: 0;
        width: 99%;
        background-color: #f9fafc;
        z-index:10;
    }
}

.appLoader .loader__item {
    top: 0;
    left: 0;
    width: 100%;
    bottom: 0;
    position: absolute;
    transition: transform 0.2s linear;
    transform-origin: left;
    background-color: #00c0ef;
}

.appLoader .item_1 {
    width: auto;
    animation: indeterminate1 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
    will-change: left, right
}

.appLoader .item_2 {
    width: auto;
    animation: indeterminate2 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
    will-change: left, right;
    animation-delay: 1.15s
}


#ui-datepicker-div {
    border: 1px solid rgb(197, 197, 197);
}

.btnCustomShadow {
    margin-top:3px;
    box-shadow: 1px 2px #888888;
}

.lblTitle {
    color: #c64333;
}

@keyframes indeterminate1 {
    0% {
        left: -35%;
        right: 100%
    }

    60% {
        left: 100%;
        right: -90%
    }

    100% {
        left: 100%;
        right: -90%
    }
}

@keyframes indeterminate2 {
    0% {
        left: -200%;
        right: 100%
    }

    60% {
        left: 107%;
        right: -8%
    }

    100% {
        left: 107%;
        right: -8%
    }
}





@keyframes animatetop {
    From {
        -webkit-transform: scale(0);
        transform: scale(0)
    }

    To {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}