body {
    font-size: 15px;
    font-family: 'Open Sans', sans-serif;
}

img {
    height: auto;
    width: auto;
}

.clearfix {
    overflow: auto;
}

    .clearfix::after {
        content: "";
        clear: both;
        display: table;
    }

input, textarea, select, button {
    font-family: 'Open Sans', sans-serif;
    text-align: left;
}

.dx-fieldset {
    margin: 15px 0px;
    padding: 0;
}

.dx-popup-content {
    padding: 0;
    overflow: auto;
}

.dx-overlay-wrapper, dx-widget {
    font-family: 'Open Sans', sans-serif;
}

.dx-popup-wrapper > .dx-popup-fullscreen {
    background-color: #F0F0F0;
}

.clearfix {
    overflow: auto;
}

    .clearfix::after {
        content: "";
        clear: both;
        display: table;
    }

.no-padding {
    padding: 0;
}

.width-100 {
    width: 100%;
}

.dx-button-default {
    background-color: #2F80ED;
    font-size: 15px;
    border: none;
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.12);
    border-radius: 5px;
    -webkit-transition: .2s ease-out;
    transition: .2s ease-out;
}

.dx-list .dx-empty-message {
    padding: 200px 20px;
    display: block;
    margin: 0 auto;
    text-align: center;
    width: 100%;
    height: 100%;
    font-size: 15px;
    color: #999999;
}

.dx-button-default:hover {
    background-color: #66A7FF;
    border: none;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.3);
    border-radius: 4px;
    -webkit-transition: .2s ease-out;
    transition: .2s ease-out;
}

.dx-button-text {
    font-weight: 600;
    font-size: 15px;
}

.dx-field-item-label-text {
    color: #002455;
    font-weight: 600;
}

.dx-placeholder {
    color: #cccccc;
    padding-left: 12px;
    font-size: 15px;
}

    .dx-placeholder:before {
        padding: 4px 0px 4px;
    }

.dx-lookup-empty .dx-lookup-field {
    padding: 5px 10px;
}

.dx-lookup-popup-wrapper .dx-list-item-content {
    font-size: 15px;
    padding-left: 15px;
}

.dx-popup-bottom.dx-toolbar {
    border-top: 1px solid #ddd;
}

.dx-lookup-field {
    padding: 4px 24px 4px 10px;
    font-size: 1em;
}

.dx-texteditor.dx-editor-outlined {
    border-radius: 0px;
}

.dx-lookup-arrow {
    font: 14px/1 DXIcons;
    width: 50px;
    color: #333;
    font-size: 20px;
    text-align: center;
    line-height: 14px;
}

.dx-texteditor.dx-editor-outlined {
    border-radius: 0px;
}

/*LOGIN SCREEN*/
.login-wrapper {
    padding: -10px;
}

.login-container {
    background-color: #ffffff;
    display: block;
    padding: 25px 20px;
    max-width: 400px;
    margin: 0 auto;
    box-shadow: 0px 3px 2px rgba(0, 0, 0, 0.12);
}

.login-header {
    height: 50px;
    background-color: #2F80ED;
    color: #ffffff;
    font: 16px 300;
    text-align: center;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.12);
}

    .login-header span {
        padding-top: 15px;
        display: block;
    }

.login-container .dx-layout-manager .dx-label-h-align .dx-field-item-label, .login-container .dx-layout-manager .dx-label-h-align .dx-field-item-content, .login-container .dx-layout-manager .dx-label-h-align .dx-field-item-content-wrapper {
    display: block;
}

.dx-field-item-content.dx-field-item-content-location-right.display-block, .dx-field-item-label.dx-field-item-label-location-left.display-block {
    display: block;
    margin-bottom: 5px;
}

.dx-overlay-wrapper input {
    height: 50px;
    padding-left: 12px;
    font-size: 15px;
}

.dx-texteditor.dx-state-focused, dx-texteditor-input.dx-state-focused {
    border-color: #2F80ED;
    border-radius: 0;
}



.dx-texteditor.dx-state-hover {
}

.login-button .dx-button-has-text .dx-button-content {
    height: 40px;
}

.login-button {
    margin-top: 10px;
    font-size: 15px;
}

.dx-form-group-with-caption > .dx-form-group-content {
    border: none;
    padding: 20px;
}

.user-icon-container {
    display: block;
    width: 80px;
    height: 80px;
    margin: 0 auto;
    background: #FFFFFF;
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.25);
    margin-bottom: 25px;
    border-radius: 80px;
    padding-top: 21px;
}

.user-icon {
    background: url(../img/user-icon.svg);
    background-image: url(../img/user-icon.svg);
    display: block;
    width: 30px;
    height: 33px;
    margin: 0 auto;
}

.password-container {
    margin-top: 10px;
}

.login-checkbox {
    padding-top: 5px;
}

    .login-checkbox input {
        height: 20px;
        width: 20px;
        margin: 0 8px 0 0;
        display: block;
        float: left;
    }

    .login-checkbox label {
        height: 20px;
        display: block;
        float: left;
        line-height: 18px;
    }

@media (max-height: 500px) {
    .user-icon-container {
        width: 50px;
        height: 50px;
        margin: 0 auto;
        margin-bottom: 10px;
        padding-top: 7px;
    }

    .user-icon {
        width: 30px;
        height: 33px;
    }
}

@media (max-height: 400px) {
    .user-icon-container {
        display: none;
    }
}
/* TOOLBAR */
.dx-toolbar .dx-toolbar-items-container, .dx-device-mobile .dx-toolbar .dx-toolbar-items-container {
    height: 50px;
    overflow: visible;
    background-color: #2F80ED;
    font-weight: 300;
    color: white;
    font-size: 15px;
}

    .dx-toolbar .dx-toolbar-items-container .sreTitle {
        font-weight: 800;
    }

.dx-overlay-content.dx-popup-normal.dx-resizable .dx-toolbar .dx-toolbar-items-container, .dx-device-mobile .dx-overlay-content.dx-popup-normal.dx-resizable .dx-toolbar .dx-toolbar-items-container {
    height: 50px;
    overflow: visible;
    background-color: white;
    font-weight: 300;
    color: #2F80ED;
    font-size: 15px;
}

dx-texteditor-empty {
    display: inline;
    cursor: text;
    color: black;
}

#searchBar {
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.12);
    padding-bottom: 0;
    height: 50px;
}

    #searchBar .dx-texteditor-buttons-container {
        right: 10px;
    }

.dx-overlay-content.dx-popup-normal.dx-resizable .dx-popup-content .dx-responsivebox-screen-sm .dx-collection {
    padding: 15px;
}

.dx-toolbar-items-container .ng-scope.dx-button.dx-button-normal.dx-widget.dx-button-has-icon {
    border: none;
    background-color: transparent;
    height: 50px;
    padding-top: 13px;
    color: #ffffff;
    border-radius: 0;
}

.dx-device-mobile .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-list-item-selected {
    background-color: #4A91F0;
}

.dx-toolbar-items-container .ng-scope.dx-button.dx-button-normal.dx-widget.dx-button-has-icon:hover {
    background-color: #4A91F0;
}

.dx-searchbox .dx-texteditor-input {
    height: 50px;
    border-radius: 0;
    padding-left: 35px;
    font-size: 15px;
}

.dx-toolbar-items-container .ng-scope.dx-button.dx-button-normal.dx-widget.dx-button-has-icon i {
    color: #ffffff;
    padding: 0 10px;
}

.dx-searchbox .dx-icon-search {
    background: url(../img/search.svg) center no-repeat;
    margin-left: 7px;
}

    .dx-searchbox .dx-icon-search:before {
        content: none;
    }
/*SIDE MENU*/
.dx-slideoutview-menu-content {
    background-color: #2F80ED;
    color: #ffffff;
    font-size: 15px;
}

.dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-list-item-selected {
    background-color: #4A91F0;
}

    .dx-slideout-menu .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-hover, .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-list-item-selected.dx-state-hover:not(.dx-state-focused) {
        background-color: #4A91F0;
    }

.dx-scrollview-content .dx-slideout-menu .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-hover {
    background-color: initial;
}

.dx-slideoutview-menu-content .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-hover, .dx-dropdowneditor-overlay .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-hover {
    background-color: #4A91F0;
}

.dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-hover, .dx-scrollview-content .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-hover {
    background-color: #FAFAFA;
}

.dx-slideout-menu .dx-list-item-content {
    padding: 14px 15px;
    color: #ffffff;
    font-size: 15px;
    font-weight: 300;
}
/*SERVICE REQUEST EVENT*/
.dx-slideoutview-content {
    background-color: #F0F0F0;
}

.service-request-events .dx-scrollview-content {
    padding: 10px 10px 50px 10px;
    padding: 10px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

    .service-request-events .dx-scrollview-content .dx-list-item {
        margin-bottom: 0;
        background: transparent;
        padding: 10px;
        width: 49.8%;
        display: flex;
    }

        .service-request-events .dx-scrollview-content .dx-list-item:hover {
            background-color: transparent;
        }

        .service-request-events .dx-scrollview-content .dx-list-item .odd, .service-request-events .dx-scrollview-content .dx-list-item .even {
            background: #FFFFFF;
            padding: 0;
            width: 100%;
            display: flex;
            box-shadow: 0px 3px 2px rgba(0, 0, 0, 0.12);
        }

        .service-request-events .dx-scrollview-content .dx-list-item .grid-list.ng-scope {
            display: flex;
            width: 100%;
        }

.service-request-events .dx-field.sreTitle {
    border-bottom: 1px solid #ccc;
    margin-bottom: 10px;
    padding: 0;
    margin: 10px 15px 10px 10px;
    width: calc(100% - 25px);
}

.service-request-events .sreTitle .dx-field {
    padding: 0;
}

.service-request-events .sreTitle .dx-field-label {
    font-weight: bold !important;
}

.service-request-events .sreTitle .dx-field-value-static .ng-binding {
    font-weight: bold !important;
    font-size: 16px;
}

.list-content {
    margin: 0px;
    float: none;
    width: 100%;
    overflow: hidden;
    padding: 10px 10px 10px 5px;
    width: calc(100%-55px);
    display: flex;
    flex-wrap: wrap;
}

    .list-content div {
        width: 100%;
    }

    .list-content .dx-field-label, .list-content .ng-binding {
        font-size: 15px;
    }

.list-icon-cont {
    margin: 0px;
    background-color: #2F80ED;
    padding: 15px;
    width: 55px;
    display: flex;
}

.dx-field:last-of-type {
    margin: 0;
}

.service-request-events .dx-field-label {
    font-weight: 700;
    width: 100%;
    padding: 0;
}

.dx-field-value-static {
    width: 100%;
    text-align: left;
    padding: 0 0 5px 0;
}

.dx-device-mobile .dx-field:last-of-type {
    margin: 0;
}

.dx-device-mobile .dx-list, .dx-scrollable-native.dx-scrollable-vertical, #gridContainer .dx-scrollable-wrapper {
    padding-bottom: 20px;
}

.dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-focused {
    background-color: #dddddd;
    color: initial;
}

.dx-device-mobile .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-focused {
    background-color: #dddddd;
    color: #fff;
}

.dx-device-mobile .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-hover {
    background-color: #4A91F0;
    color: #333;
}

.dx-device-mobile .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-list-item-selected.dx-state-hover:not(.dx-state-focused) {
    background-color: #4A91F0;
    color: #333;
}

.service-request-events .dx-scrollview-content .dx-list-item .dx-device-mobile .dx-list-item-content, .service-request-events .dx-scrollview-content .dx-list-item .dx-list-item-content {
    padding: 0;
    box-shadow: 0px 3px 2px rgba(0, 0, 0, 0.12);
    display: flex;
}

@media (max-width: 768px) {
    .service-request-events .dx-scrollview-content {
        padding: 10px;
    }
}

@media (max-width: 685px) {
    .list-content .dx-field-label, .list-content .ng-binding {
        font-size: 15px;
    }

    .service-request-events .dx-scrollview-content .dx-list-item {
        margin-bottom: 0;
        background: transparent;
        position: relative;
        width: 100%;
        float: left;
        padding: 10px;
    }

    .list-content {
        padding: 10px 10px 10px 5px;
    }

    .service-request-events .dx-scrollview-content {
        padding: 10px 10px 50px 10px;
    }

    .service-request-events .dx-field.sreTitle {
        border-bottom: 1px solid #ccc;
        margin-bottom: 10px;
    }

    .service-request-events .sreTitle .dx-field-label {
        font-weight: bold !important;
    }

    .service-request-events .sreTitle .dx-field-value-static .ng-binding {
        font-weight: bold !important;
        font-size: 16px;
    }
}

@media (max-width: 320px) {
    .service-request-events .dx-scrollview-content {
        padding: 10px 10px 50px 10px;
    }

    .list-content {
        padding: 10px;
    }
}
/*CALENDAR*/
.dx-datebox.dx-auto-width.dx-dropdowneditor-button-visible .dx-texteditor-input, .dx-datebox:not(.dx-texteditor-empty).dx-auto-width.dx-dropdowneditor-button-visible .dx-texteditor-input {
    padding-right: 0;
    height: 47px;
    background-color: white;
    width: calc(-44px + 100%);
    pointer-events: none;
}

@media (max-width: 1024px) {
    .dx-datebox-wrapper-calendar .dx-calendar {
        width: 300px;
        margin: 0 auto;
    }

    .dx-datebox-wrapper {
        width: 100%;
    }

        .dx-datebox-wrapper .dx-overlay-content {
            transform: none !important;
            height: auto !important;
            margin-top: 50% !important;
            padding: 5px;
            position: absolute;
            right: 0;
            left: 0;
        }
}

@media (max-width: 320px) {
    .dx-datebox-wrapper-calendar .dx-calendar {
        width: 250px !important;
        margin: 0 auto;
    }
}
/* DETAILS VIEW*/
.details-container {
    background-color: #FFFFFF;
    margin: 20px 20px 50px;
    box-shadow: 0px 3px 2px rgba(0, 0, 0, 0.12);
    padding: 10px 20px 20px;
}

    .details-container #fieldsContainer {
        margin: 0;
        box-shadow: none;
        padding: 0;
    }

.detail {
    background-color: transparent;
    padding: 3px 5px 5px 0px;
    margin: 0 !important;
}

.dx-device-mobile .dx-fieldset {
    margin: 0;
    padding: 0;
}

.dx-field.detail {
    min-height: 50px;
    border-bottom: none;
    padding: 5px 0;
}

.dx-field-label {
    padding: 5px 0;
}

    .dx-field-label, .dx-field-label.label-right {
        width: 100%;
        font-size: 14px;
        font-weight: bold;
        font-family: 'Open Sans', sans-serif;
        text-transform: capitalize;
    }

        .dx-field-label.label-right {
            width: 100%;
            font-size: 14px;
            font-weight: normal;
            font-family: 'Open Sans', sans-serif;
            text-align: left;
        }

.dx-texteditor-input {
    font-size: 14px;
    text-align: left;
    padding: 15px 10px;
    min-height: 50px;
}


/* HEADER RESPONSIVE*/
.header {
    background-color: #2F80ED;
    position: absolute;
    top: 0;
    right: 0;
    width: 50px;
    height: 50px;
    z-index: 3;
}

    .header ul {
        margin: 0;
        padding: 0;
        list-style: none;
        overflow: hidden;
        background-color: #fff;
    }

    .header li a {
        display: block;
        padding: 20px 20px;
        border-right: 1px solid #f4f4f4;
        text-decoration: none;
    }

        .header li a:hover, .header .menu-btn:hover {
            background-color: #4A91F0;
        }
    /* MENU */
    .header .menu {
        clear: both;
        max-height: 0;
        transition: max-height .2s ease-out;
    }
    /* MENU ICON */
    .header .menu-icon {
        cursor: pointer;
        display: inline-block;
        float: right;
        padding: 24px 16px;
        position: relative;
        user-select: none;
        width: 100%;
    }

        .header .menu-icon .navicon {
            background: #ffffff;
            display: block;
            height: 3px;
            position: relative;
            transition: background .2s ease-out;
            width: 3px;
            margin: 0 auto;
        }

            .header .menu-icon .navicon:before, .header .menu-icon .navicon:after {
                background: #FFF;
                content: '';
                display: block;
                height: 100%;
                position: absolute;
                transition: all .1s ease-out;
                width: 100%;
            }

            .header .menu-icon .navicon:before {
                right: 9px;
            }

            .header .menu-icon .navicon:after {
                left: 9px;
            }
    /* MENU BTN */
    .header .menu-btn {
        display: none;
    }

        .header .menu-btn:checked ~ .menu {
            max-height: 100%;
            overflow: auto;
            position: fixed;
            top: 50px;
            right: 0;
            width: 100%;
            margin: 0 auto;
        }

        .header .menu-btn:checked ~ .menu-icon .navicon {
            background: transparent;
            margin: 0 0;
        }

            .header .menu-btn:checked ~ .menu-icon .navicon:before {
                transform: rotate(45deg);
                width: 18px;
                right: -15px;
            }

            .header .menu-btn:checked ~ .menu-icon .navicon:after {
                transform: rotate(-45deg);
                width: 18px;
                left: 0px;
            }

        .header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:before, .header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:after {
            top: 0;
        }
/* END OF HEAER RESPONSIVE*/
.dx-fieldset-header, dx-fieldset-header.ng-binding {
    font-size: 15px;
    color: #2F80ED;
    display: BLOCK;
    border-bottom: solid 2px #2F80Ed;
    min-height: 40px;
    padding: 10px 0px 0px;
    font-weight: 400;
}

.view-content .dx-fieldset {
    margin: 0;
}

.details-dropdown {
    display: block;
    width: 50px;
    height: 50px;
    background-color: black;
    cursor: pointer;
    z-index: 999999;
    position: fixed;
    right: 0;
    top: 0;
}

.btn-container {
    width: 100%;
    min-width: 320px;
    border: none;
    padding: 0;
    position: fixed;
    display: none;
    right: 0;
    z-index: 999999;
    top: 50px;
}

.details-dropdown:hover .btn-container {
    display: block;
}

.btn-child {
    border: none;
}

.act-margin {
    width: 100%;
    border: none;
    height: 65px;
}

.act-container {
    width: 100%;
    border: none;
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    /* NEW, Spec - Firefox, Chrome, Opera */
    padding: 0px;
    background-color: #FFFFFF;
    min-height: 65px;
    position: absolute;
    bottom: 0;
    box-shadow: 0px -2px 5px rgba(0, 0, 0, 0.2);
}

    .act-container .switch-field {
        padding: 0 0px;
    }

    .act-container .dx-button-content {
        border-radius: 0;
        padding: 0;
    }

    .act-container .dx-button:active {
        background-color: #F0F0F0;
    }

.act-child {
    border: none;
    display: inline-flex;
    width: 100%;
    font-size: 12px;
    text-transform: none;
}

    .act-child .dx-button {
        border: none;
        color: #2F80ED;
        background: transparent;
        width: 100%;
        text-align: center;
        border-radius: 0;
    }

        .act-child .dx-button span {
            display: block;
            margin: 7px auto 5px;
            width: 20px;
            height: 30px;
        }

        .act-child .dx-button .dx-icon {
            background-size: 100%;
            background-repeat: no-repeat;
        }

    .act-child.savenew .dx-button .dx-icon.dx-icon-holdicon {
        background-size: 100%;
        background-repeat: no-repeat;
        background-image: url(icons/cancel.svg);
    }

    .act-child .dx-button .dx-icon + div {
        color: #219653;
    }

    .act-child .dx-button .dx-icon.dx-icon-holdicon + div {
        color: #CB2316;
    }

    .act-child .dx-button .dx-icon.dx-icon-pendingicon + div {
        color: #E09400;
    }

    .act-child .dx-button .dx-icon.dx-icon-progressicon + div {
        color: #828282;
    }

    .act-child .dx-button .dx-icon.dx-icon-acknicon + div {
        color: #864CE5;
    }

    .act-child .dx-button .dx-icon.dx-icon-saveicon + div {
        color: #2F80ED;
    }

    .act-child .dx-button div {
        width: 100%;
        height: 60px;
    }

@media (max-width: 660px) {
    .act-child .dx-button div {
        font-size: 10px;
    }
}

@media (max-width: 520px) {
    .act-child .dx-button span {
        display: block;
        margin: 15px auto;
        width: 20px;
        height: 20px;
    }

    .act-child .dx-button div {
        font-size: 7px;
        text-transform: uppercase;
        letter-spacing: -0.2px;
    }
}

@media (max-width: 360px) {
    .act-child .dx-button .dx-button-content div {
        /*display: none;*/
    }

    .act-child .dx-button span {
        margin: 18px auto 5px;
    }
}

@media (max-width: 414px) {
    .btn-child {
        display: block;
    }
}

.switch-field {
    font-family: "Lucida Grande", Tahoma, Verdana, sans-serif;
    overflow: hidden;
    color: #ffffff;
}

    .switch-field input {
        position: absolute !important;
        clip: rect(0, 0, 0, 0);
        height: 1px;
        width: 1px;
        border: 0;
        overflow: hidden;
    }

    .switch-field label {
        float: left;
    }

    .switch-field label {
        display: inline-block;
        width: 100%;
        min-height: 35px;
        background-color: #2F80ED;
        color: white;
        font-family: Open Sans;
        font-style: normal;
        font-weight: 300;
        line-height: normal;
        font-size: 15px;
        text-align: center;
        text-shadow: none;
        padding: 15px 14px;
        border: none;
    }

@media (max-width: 380px) {
    .switch-field label {
        min-height: 50px;
    }
}

.switch-field label:hover {
    cursor: pointer;
}

.switch-field input:checked + label {
    background-color: #A5DC86;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.switch-field input:checked + .green-btn {
    background-color: #27AE60;
    color: #FFFFFF;
}

.switch-field input:checked + .red-btn {
    background-color: #EB5757;
    color: #FFFFFF;
}

.switch-field input:checked + .yellow-btn {
    background-color: #F2C94C;
}

.switch-field input:checked + .orange-btn {
    background-color: #F2994A;
}

.dx-texteditor-container {
    min-height: 50px;
    text-align: left;
}

.dx-field-value:not(.dx-switch):not(.dx-checkbox):not(.dx-button) {
    width: 100% !important;
    text-align: left;
    margin: 3px 0 !important;
    float: left;
    padding: 0px;
    box-shadow: none;
    min-height: 50px;
    font-size: 15px;
    border-radius: 0px;
    font-family: inherit;
}

.dx-texteditor.dx-editor-outlined.dx-state-focused {
    border-color: #2F80ED;
}

.dx-field-value:not(.dx-switch):not(.dx-checkbox):not(.dx-button) .dx-textbox.dx-texteditor {
    width: 100% !important;
}

.dx-device-mobile .dx-fieldset-header {
    font-family: Open Sans;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    font-size: 15px;
    margin-top: 20px;
    padding-bottom: 15px;
    border-bottom: solid 1px #2F80ED;
    text-transform: capitalize;
}

.dx-field-value:not(.dx-switch):not(.dx-checkbox):not(.dx-button) select {
    width: 100%;
    padding: 6px;
    border-color: #ddd;
}

.dx-field-value select::before {
    display: block;
    width: 50px;
    height: 50px;
    background-color: #000;
}

.dx-field-value .dx-field-value.margin-right-field::after {
    display: block;
    width: 50px;
    height: 50px;
    background-color: #000;
}


.dx-field-value:not(.dx-switch):not(.dx-checkbox):not(.dx-button) select option {
    height: 40px;
}

.dx-field-value.margin-right-field.ng-pristine.ng-untouched.ng-valid.dx-numberbox.dx-texteditor.dx-numberbox-spin.dx-widget.ng-not-empty.valid {
    padding: 0 5px;
    box-shadow: none;
    height: 40px;
}

.dx-field-label.dx-button.dx-button-normal.dx-widget.dx-button-has-text {
    padding: 5px 0;
    width: 50%;
    margin-bottom: 15px;
}

@media (max-width: 767px) and (min-width: 481px) {
    .dx-field-label, .ng-binding, .dx-field-value, .dx-field-item-label-text {
        font-size: 14px;
    }

    #viewList {
        width: 210px !important;
        background-color: transparent;
        border: none;
        height: 50px !important;
    }

        #viewList.dx-state-focused, #viewList.dx-state-hover, #viewList.dx-state-active {
            background-color: #4A91F0;
        }

        #viewList .dx-texteditor-input {
            color: #ffffff;
            font-size: 15px;
            font-weight: 300;
            background-color: transparent;
            text-align: center;
        }

        #viewList .dx-dropdowneditor-icon, #viewList .dx-dropdowneditor-icon.dx-state-hover, #viewList .dx-dropdowneditor-icon.dx-state-focused {
            color: #ffffff;
            background-color: transparent;
        }

    .service-request-events .sreTitle .dx-field-label {
        font-weight: bold !important;
    }

    .service-request-events .sreTitle .dx-field-value-static .ng-binding {
        font-weight: bold !important;
        font-size: 16px;
    }
}

@media (max-width: 420px) {
    .dx-field-value:not(.dx-switch):not(.dx-checkbox):not(.dx-button) {
        width: 100%;
        text-align: left;
    }

    #viewList {
        width: 210px !important;
        background-color: transparent;
        border: none;
        height: 50px !important;
    }

        #viewList.dx-state-focused, #viewList.dx-state-hover, #viewList.dx-state-active {
            background-color: #4A91F0;
        }

        #viewList .dx-texteditor-input {
            color: #ffffff;
            font-size: 15px;
            font-weight: 300;
            background-color: transparent;
            text-align: center;
        }

        #viewList .dx-dropdowneditor-icon, #viewList .dx-dropdowneditor-icon.dx-state-hover, #viewList .dx-dropdowneditor-icon.dx-state-focused {
            color: #ffffff;
            background-color: transparent;
        }
}

@media (max-width: 319px) {
    #viewList {
        width: 210px !important;
        background-color: transparent;
        border: none;
        height: 50px !important;
    }

        #viewList.dx-state-focused, #viewList.dx-state-hover, #viewList.dx-state-active {
            background-color: #4A91F0;
        }

        #viewList .dx-texteditor-input {
            color: #ffffff;
            font-size: 15px;
            font-weight: 300;
            background-color: transparent;
            text-align: center;
        }

        #viewList .dx-dropdowneditor-icon, #viewList .dx-dropdowneditor-icon.dx-state-hover, #viewList .dx-dropdowneditor-icon.dx-state-focused {
            color: #ffffff;
            background-color: transparent;
        }
}

.dx-field-label, .dx-field-value, .dx-field-item-label-text {
    font-size: 14px;
    word-break: break-word;
    text-overflow: unset;
    white-space: normal;
    padding-bottom: 0;
}

.no-definitions {
    font-size: 15px;
    font-weight: bold;
    text-align: justify;
}
/*SWITCH*/
.dx-switch-container {
    height: 30px;
}

.dx-switch-handle {
    height: 26px;
    width: 50px;
}

    .dx-switch-handle:before {
        width: 30px;
        background-color: lightgray;
    }

.dx-field-value.dx-switch, .dx-field-value:not(.dx-widget) > .dx-switch {
    margin: 5px 0;
    width: 65px;
    float: left;
    height: 28px;
}

.dx-switch-on:before {
    color: black;
    display: block;
    width: 30px;
    height: 30px;
    content: "YES";
    background-color: #fff;
    font-size: 10px;
}

.dx-switch-off:before {
    color: grey;
    display: block;
    width: 30px;
    height: 30px;
    content: "NO";
    background-color: #fff;
    font-size: 10px;
}

.dx-switch-on, .dx-switch-off {
    padding-right: 30px;
    line-height: 28px;
}

.dx-switch-wrapper {
    width: 65px;
}

.dx-numberbox-spin-button {
    background-color: #2F80ED;
    padding: 1px;
    float: right;
    width: 36px;
    display: block;
    margin: 0 5px;
    height: 100%;
    border-radius: 5px;
}

.dx-numberbox-spin .dx-texteditor-input {
    padding: 14px 92px 14px 10px;
}

.dx-numberbox-spin-up-icon:before, .dx-numberbox-spin-down-icon:before {
    position: absolute;
    display: block;
    width: 14px;
    top: 18px;
    margin-top: -7px;
    font-size: 20px;
    font-family: arial;
    font-weight: bold;
    left: 50%;
    margin-left: -7px;
    color: white;
}

.dx-numberbox-spin-up-icon:before {
    content: "+";
    top: 20px;
}

.dx-numberbox-spin-down-icon:before {
    content: "-";
}

.dx-datebox-calendar .dx-texteditor-buttons-container {
    height: 100% !important;
    padding: 5px 0 !important;
    right: 0px !important;
}

.dx-dropdowneditor-button, .dx-datebox-calendar .dx-dropdowneditor-icon {
    width: 44px;
}

.dx-numberbox-spin-container {
    overflow: hidden;
    width: 100px;
    border-radius: 4px;
    height: 100%;
    padding: 5px 0;
}

.dx-numberbox-spin-touch-friendly .dx-numberbox-spin-down, .dx-numberbox-spin-touch-friendly .dx-numberbox-spin-up {
    width: 38px;
    height: 38px;
    display: inline-block;
}

.dx-numberbox-spin-touch-friendly .dx-numberbox-spin-container {
    width: 100px;
}

.dx-state-hover.dx-numberbox-spin-button .dx-numberbox-spin-up-icon, .dx-state-hover.dx-numberbox-spin-button .dx-numberbox-spin-down-icon {
    background-color: #4A91F0;
}

.dx-dropdownmenu-popup-wrapper .dx-overlay-content.dx-popup-normal.dx-resizable {
    height: auto;
    left: 0px;
    top: 50px !important;
    width: 100% !important;
    transform: none !important;
    border: none;
}

.dx-popup-wrapper > .dx-overlay-content .dx-dropdownmenu-list {
    background-color: #2F80ED;
}

.dx-overlay-wrapper.dx-popup-wrapper.dx-popover-wrapper.dx-dropdownmenu-popup-wrapper.dx-dropdownmenu-popup.dx-popover-without-title.dx-position-bottom {
    width: 100%;
}

#detailToolbar .dx-toolbar-after .dx-button-has-icon .dx-button-content .dx-icon-overflow:before {
    content: none;
}

#detailToolbar .dx-toolbar-after .dx-device-mobile .dx-toolbar .dx-toolbar-menu-container {
    padding: 0;
}

#detailToolbar .dx-toolbar-after .dx-button-has-icon .dx-button-content {
    height: 50px;
    padding: 0;
}

#detailToolbar .dx-toolbar-after .dx-button {
    border: none;
    background-color: #2F80ED;
    border-radius: 0px;
    width: 50px;
}

    #detailToolbar .dx-toolbar-after .dx-button.dx-state-hover, #detailToolbar .dx-toolbar-after dx-dropdownmenu.dx-dropdownmenu-button.dx-button.dx-button-normal.dx-widget.dx-button-has-icon.dx-state-active {
        border: none;
        border-radius: 0px;
        background-color: #4A91F0;
    }

    #detailToolbar .dx-toolbar-after .dx-button .dx-icon.dx-icon-overflow {
        background: url(../img/more-icon.svg) center no-repeat;
        width: 100%;
        background-size: 25px;
        height: 50px;
    }

.dx-dropdownmenu-popup-wrapper .dx-dropdownmenu-list .dx-list-item-content {
    background-color: #4A91F0;
    color: #ffffff;
    text-align: center;
    font-size: 15px;
    font-weight: 300;
    border-bottom: 0;
    padding: 15px;
}

    .dx-dropdownmenu-popup-wrapper .dx-dropdownmenu-list .dx-list-item-content .dx-button-has-icon {
        background-color: #4A91F0;
        color: #ffffff;
        font-size: 15px;
        font-weight: 300;
        border-bottom: 0;
        padding: 0;
    }

.dx-toolbar-menu-section .dx-toolbar-hidden-button .dx-button {
    background-color: #4A91F0;
    color: #ffffff;
    font-size: 15px;
    font-weight: 300;
    border-bottom: 0;
    padding: 0;
}

    .dx-toolbar-menu-section .dx-toolbar-hidden-button .dx-button .dx-button-content {
        text-align: center;
    }

        .dx-toolbar-menu-section .dx-toolbar-hidden-button .dx-button .dx-button-content .dx-button-text {
            font-weight: 300;
        }

.dx-layout-manager .dx-label-h-align .dx-field-item-label {
    white-space: nowrap;
    display: block;
}

.dx-dropdownmenu-popup-wrapper .dx-dropdownmenu-list .dx-list-item-content .dx-button-has-icon .dx-button-content {
    width: 100%;
    text-align: center;
}

    .dx-dropdownmenu-popup-wrapper .dx-dropdownmenu-list .dx-list-item-content .dx-button-has-icon .dx-button-content .dx-button-text {
        font-weight: 300;
    }

    .dx-dropdownmenu-popup-wrapper .dx-dropdownmenu-list .dx-list-item-content .dx-button-has-icon .dx-button-content .dx-icon {
        display: inline-block;
        float: left;
        color: white;
    }

.dx-dropdownmenu-popup-wrapper .dx-overlay-content .dx-popup-content {
    padding: 0;
    border: none;
    border-radius: 0px;
}

.dx-scrollview-content #fieldsContainer {
    margin: 20px 20px 90px;
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.12);
}

    .dx-scrollview-content #fieldsContainer .form {
        padding: 20px;
        background: #ffffff;
    }

.details-container #fieldsContainer {
    margin: 0;
    box-shadow: none;
    padding: 0;
}

    .details-container #fieldsContainer .form {
        margin: 0;
        box-shadow: none;
        padding: 0;
    }
/*DROP NAVIGATION*/
#detailMenuItemBox {
    background: none;
    border: none;
    border-radius: 0;
}

    #detailMenuItemBox.dx-dropdowneditor-active .dx-dropdowneditor-input-wrapper.dx-selectbox-container .dx-texteditor-container .dx-texteditor-input {
        background-color: #4A91F0;
    }

    #detailMenuItemBox .dx-selectbox-container {
        background: none;
        border: none;
        border-radius: 0;
        height: 50px;
    }

    #detailMenuItemBox .dx-dropdowneditor-input-wrapper.dx-selectbox-container .dx-texteditor-container .dx-texteditor-input {
        background: none;
        border: none;
        border-radius: 0;
        color: #ffffff;
        font-size: 15px;
        font-weight: 300;
        text-align: center;
        padding-right: 5px;
    }

    #detailMenuItemBox .dx-dropdowneditor-input-wrapper.dx-selectbox-container .dx-texteditor-container .dx-texteditor-buttons-container .dx-dropdowneditor-icon {
        background-color: transparent;
        color: #FFFFFF;
    }

.dx-overlay-wrapper.dx-dropdowneditor-overlay.dx-popup-wrapper.dx-dropdownlist-popup-wrapper.dx-selectbox-popup-wrapper {
    width: 100% !important;
}

    .dx-overlay-wrapper.dx-dropdowneditor-overlay.dx-popup-wrapper.dx-dropdownlist-popup-wrapper.dx-selectbox-popup-wrapper .dx-overlay-content.dx-popup-normal.dx-resizable {
        border: none;
        border-radius: 0px;
        padding: 0 !important;
        min-height: unset !important;
    }

.dx-dropdownlist-popup-wrapper .dx-popup-content {
    padding: 0;
}

.detailMenuItemBox-parent {
    width: 100% !important;
    transform: none !important;
    top: 50px !important;
    max-height: 310px !important;
}

    .detailMenuItemBox-parent .dx-popup-content .dx-scrollable.dx-scrollview.dx-scrollable-customizable-scrollbars.dx-scrollable-vertical.dx-scrollable-simulated.dx-visibility-change-handler.dx-list.dx-widget.dx-collection {
        background-color: #2F80ED;
        padding-bottom: 0;
    }

        .detailMenuItemBox-parent .dx-popup-content .dx-scrollable.dx-scrollview.dx-scrollable-customizable-scrollbars.dx-scrollable-vertical.dx-scrollable-simulated.dx-visibility-change-handler.dx-list.dx-widget.dx-collection .dx-item-content.dx-list-item-content {
            color: white;
            font-size: 15px;
            font-weight: 300;
            border-bottom: none;
            padding: 15px;
            text-align: center;
        }

.dx-device-mobile .detailMenuItemBox-parent .dx-list-item-content {
    color: white;
    font-size: 15px;
    font-weight: 300;
    border-bottom: none;
    padding: 15px !important;
    text-align: center;
}

.dx-device-mobile .detailMenuItemBox-parent .dx-list {
    background-color: #2F80ED;
    padding-bottom: 0;
}

#filterlist {
    padding: 20px 20px 0 20px;
    width: 100%;
}

    #filterlist select {
        border: solid 1px #dddddd;
        height: 40px;
        width: 100%;
        border-radius: 4px;
        padding: 10px;
    }
/*ICONS*/
.dx-icon-acknicon {
    background-image: url('icons/acknowledged.svg');
}

.dx-icon-completedicon {
    background-image: url('icons/completed.svg');
}

.dx-icon-infocompleteicon {
    background-image: url('icons/infoComplete.svg');
}

.dx-icon-pendingicon {
    background-image: url('icons/pending.svg');
}

.dx-icon-progressicon {
    background-image: url('icons/in-progress.svg');
}

.dx-icon-holdicon {
    background-image: url('icons/customer-hold.svg');
}

.dx-icon-saveicon {
    background-image: url('icons/save.svg');
}

.dx-icon-incompleteequip {
    background: url('data:image/png; base64,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') 0 0 no-repeat;
}

.dx-icon-pendingequip {
    background: url('data:image/png; base64,iVBORw0KGgoAAAANSUhEUgAAACYAAAApCAYAAABZa1t7AAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAOxSURBVHgB7VhbVhpBEL0ziiefZAUOK4iuQFxBzAqU72iQFYArAKN+qyuIWYHsQLKCGVcg+ctRD51b/ZiMg2APDMhH6pw+08yDul1VXXW7gP9STALMIPEZ6lDYCtawI1eOKv+pqh8qDDlPZKgRfvFOv3aEPgqKN7C4i2q4gSaVHacg/CWhov7oCSe1FkGXAUwDqqCrgIOsIqXwk9YZoEJr/MGQCofpNxe04ggRp/UgwGdeo4zCKx+AU4HdX2gLdVILBbjh79OirtGu58IIch9uYSOC+4YrTANGAG1a4EA9Ydut/P5cW+nYvtfns4avGyYC7CIK1tGl1j2rvLd5iNZEYMk5bnmpE9wunjEIKvq3BPVQBVzZIXooUeLvOA5CAjQy4KJ3s6EgEuY/SkGJuZ/5QcmgROjCHhe8LTpEF3X+yL/zAhhjoJuCMqsYYEFS+2osZcHVJXQwCRic+xiY3InN5AwPdHOMRYFjzNJyXzgdSjzH52lMj7tSdiD9f6kDv3i+Kg5OLEdDGNVoS3p6HZiIWE3hVDZDdIgaFiwSc7z0OSRnti1Iu0sCpgzgmj9vZikh84ok5UDhTuaMvY8z1cq5AJzpanAp87w3MmnrZB1LElva2pmkneTfEUAELcCboc+fys6UQZcfYAahlfaY8WMHSgBIlcm/Z0Mo4agWsVgku5UA933Lky5BFe22ur0lpa01LT8KOfC2mMQCt3QDNhlSWcyEeCmKJ30jBIBWutOglM5TLf7P20lbmeeFgl8DWdc7uOnucd4ZPeLaWZDvSInp4qWVvAmAtXI8G4M1ADt5GhOuYZOu6Og7xkoNxs0NCohsEgJ7mCtd2NVJAd7K3pfkTJbSyTMGX2Ecq1LymOxWboy2BdWYN0GXBqxMca702pVLlQ2z01cP2GhFgYXmVLV6wJTNfysFzB7zIo5kpYCFNmHLqd2cK80Zcs8eQBK8g7hSJHPiqGmLjRR+AykTeBdxuqWFIMYxrnzWnFvKRz17UlmWCBOBCfpE+hoWoJHM6XhoWwUJliCWjRiuT2rl+hlp8OvTsRRf6JJwO41rlQjKkQBd+LNNlrFa6Q4E+HcaT7AYUK41EHH0hURmn4+lC4KRk7GwSFnN3SJizrLbWwfK6nwhE9kFk13PMVXfZttbkj8DaPcdvb7wqbQnw7OiFKAijZ6hcSfJM+1KerS3fFqdeRotYnqq0u4MacVHJI6t6t7DB44nggnxSRI3Mq1OX3ZbpDnsAO5kFXmJ4f8CqOdLt/8CNcyuDcSoGsIAAAAASUVORK5CYII==');
}

.dx-icon-completedequip {
    background: url('data:image/png; base64,iVBORw0KGgoAAAANSUhEUgAAADgAAAA4CAYAAACohjseAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAYMSURBVHgBzVu7UuNIFG0LJiJYT0QBwWq/YMyryhki22yYL8D7BcNmm2GiDYEvwPMFsF+AyKjiZX/BaBJgo3UBActzzrG7zbVooQey7FMl1Gq15Ht0u2/fvrcpqQFgcXGx8vj4uFQqlSrPz88VVJVRdmUb1AeoC1AMUG46jtM6Pj72Vc4oqRzgeV75+vraQ3GVlzjKKhvaOHwceycnJ99UDngXQRK7ublZgwa+quykokAN742Pj28fHh4GKiMyEYwjxi6Hk//09MRzC4L+d3Z29kO2mZ2d/RUnl90Y586hy6+FLJU2Hh4etprNZlulRGqC8/PzKzjtqBAxTWoPpLazCEJUKhUXY/EzimvhMQsEOOppu25ignqc1VH8GrpFTdWhoQOVI+bm5mo4rYeJ4noLxuhPlRCJCFarVff+/n4fRdfU0QriqOVNLIwIosGHDx+Wk4xNJ65BBLktaG120OSI09PTBn+LvymqOzJRtrjn39RgmBx+pI0vuZaXCU8LaJNjc129jP9YTUYStJHDl1yGAWmqIUI7Ebuiy75J0kpQG5Qz9UIu0OSsLykatLZjY2OUr6NJWnAt3yvrbR2D2lq6+mFq7suokCMoC6aTZdX1fGhZK3AI1m1tx8IVtFp44G9R9ReMyT9qxHB+fn45NTX1L2Rd0VXVmZmZA9QHsl0fQY47aKs3idNywYptqBHFxcVFEyTpyFd1lTc5Ofnt8vLy1rTp66Jwh2qqf9yNLDkDykhZ9SU9oT5HpGdktNX8Lu7VhjUdpIV2H3f1ZRtW9jdjcHoahPYkc3+UyHFqAIndhYWFTdt9yLqnusssoiy12CMINZvBSrXX1YiA5CAP5+MVyLiGKSJyxSHKbNexIx2C2t9zWWZ/LsIFSwJBzhi9QHVXFa/AaIAYi2VMG50P0SEIxp9NQ5TragRgIxc1mQs0TAHtGV3odVHP3MAAHbr23iAXvPUc16LisjPkHAxcT704r/6wPZas5AitXV9fljleHTy8ZBroVfnQ8B5yBpIDrOmSI+MgqPDVkJAHOY2WKZCbo0RsBXPhDzUE5EhOYZXR0yBjsg7+uOJ+oApGnuQIeGOBuCw7MtaRNRqWFXmTIyQHcouNyQwKgyAn0CM5bqt8C/AJKRSDtNvwHuoqAwZMrg9Sg7GhdwqmdO4BQq1jDq2rlCiIXI+LI/w3ZRzUKBwdHTXlPJOWZBHkJAe+nxqUg/KXuBdQoDBJhvPiniuqWyLC5poy03O0oj1hMYdU4l5AKxUmiXdsYmyuRj1T5JjDe11x2XakoLjpJXmJjSTQsJEskpx+v3Q9fYeZVVMRlb6yIQnJoskRkgNlK3FQomt+N0JgufQxzYTP5/GR9kMfp8YPVzS5UFypjVDGR0eTkR74apqXRmmyaHLE3d2dJy59/jEr+i1TKwKpiRFBslByhE7MGOzxT4cgVhFcxZtu6elFcCrYSBZJTsvsmt81UUHHCCfzb5zbVAYIkg3VzfwWlrDBb8mQom8KvcBv2NhA3cuD2LcyCOh8yo651oHfgOWeL2rR4k6c6zYKYKpPjj1ykL2mb7mko1JmLLpRKalRQijVF4Qia/3ZJWZlkK35H1/kd11VnZ6eDpDFaakRBAwLfeCeEhjRDgetrRleeCMN1d2WRbSZbORKQo0QLF4SU32vtpdYV/QYpGsyDM4XJdnRUBR0HpPZJDnXWlN9VoLC3Ae6qswNCXrBO1RQBshi2z9gdS8jYzK0RJg2vihhdKjJJGu/QQHkamldwNidTnr/2L6MvtG1g/ezUVQUzraNLKmXlGgrl42kyrg5Li3ognFOVqFtZEm9pMSb8fSyaBMka6FbPpOPeXs9mhinAE/W621kiXtP6u2UUbsAVdf/ayAmcpB1Ayu74tXV1ape0Xjynt5G9odOVydGpg2xusuuW7Rp4DNcgPsttAsmJiYC3/f7vjjJ3N7elrmGQ5tPem+3F34RieG0lXUfaiaCBoYoBbNo1AYjYKyP+15iBu8iKKE9erMpPRN0N2zC0aDTf5CHlc6NoAGNEYT8hMPTcRpGwV3bvxXg1CHERbI+WnlPPT8BHc71YI/ln4sAAAAASUVORK5CYII==') 0 0 no-repeat;
}

.dx-icon-exceptionequip {
    background: url('data:image/png; base64,iVBORw0KGgoAAAANSUhEUgAAADgAAAA5CAYAAABj2ui7AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAANISURBVHgB7ZpLbtpAGMc/243UJcvmIdU9Qd08pOzqnIAsuwvcoN21q8ANyAlCT5BkVXUF2bHg1Rt4BdmVSqxAQP8fnUFmMMSYSswQ/yQ0nsnE8s8ej795WLQh5+fn7nA4vMWha1lWvl6vV0kjbNoAIVfBoY+fOx6Ps6QZiQVDci7nJ5NJAMEb0gyLErBE7qLdbgekGWsLmiTHrCVomhwTW9BEOSaWoKlyjHVycnKJNLu3t1es1WqBWsFkOYYFfyPN4BdA8iIsmUTO9/1Mv9/3SAM46GBB+aFmZpJJ5M7OzjzUaZE+VO3RaJTnixcFU6nT01M/SbPEubR4chJctzvtZDzPc23briCWdCMqrfXOHR8f53Cej6QBuOE3s140StK0DiWKuc9EWHIX5JiF7yBLIuEm9mi6XErKS4G/myLk0w6HNgTRSw497h0OP+3v71O3230kjdhoTobl8Cm5lXl8XgLSjFeUEFUOT7HcbDa/k2YkmpNZIpcnDVlb0CQ5Zi1B0+SY2IImyjGxBE2VYxx8oEsHBwc/Dg8PrU6nU1UrmCzH8JTFZJaxrCLmMQoyn0QOUU0B9d6SHjxYGIFfQ6wgS6RkEjkRrt2RPvQcDq04xIKYLwp9NFkPQl9lrbjNEs38DZIcaQKu+2nWyahPMlRprXeOB8w4z9abKK77D5JgrhdVJU3rUKKYG02Em+suyKWkpKSk/Bd4TY9/tINYyjpgrtForJxX4SlCMYvWw+rNB0zv90hjeH2Qn5wr8mUEzFfLKospQr4Z0/9BQPCeNMfBGPAJwfU7HMvFy0vkA0Q1v8IVo0YXrVZLu51NKtNQDTL3iqR/dHT0k+U5Y/Kgdy7YRvMsI5FNtIe1wgukntEjerVAlaR/79sUyJUg94UMYmFtQmmur2U55AqQ+0aGETl1z2sMEAoX9RzHeaBnULeebBt4lBYWX8Sk0bVSnMF7WOF9MKtOOBgMfNJEjoHH57l3UJXjdw6JjzshxRZ2Q4XBdEUGT1qbSSdc//1MMEKO37kiX7TYeRFLUjemgsvkZN5kSZvnMlfJMRxv8p4Z/K0timRnoj02nsosWI6Sk4QkA1HkkgHIvWpZFkVs+ez6utgNdQXRapz62+Yv8sOs3/rcRX0AAAAASUVORK5CYII=') 0 0 no-repeat;
}
/*SERVICE REQUEST DROP*/
#viewList {
    width: 210px !important;
    background-color: transparent;
    border: none;
    height: 50px !important;
}

    #viewList.dx-state-focused, #viewList.dx-state-hover, #viewList.dx-state-active {
        background-color: #4A91F0;
    }

    #viewList .dx-texteditor-input {
        color: #ffffff;
        font-size: 15px;
        font-weight: 300;
        background-color: transparent;
        text-align: center;
    }

    #viewList .dx-dropdowneditor-icon, #viewList .dx-dropdowneditor-icon.dx-state-hover, #viewList .dx-dropdowneditor-icon.dx-state-focused {
        color: #ffffff;
        background-color: transparent;
    }

#serviceRequestEventToolBar .dx-toolbar-center .dx-toolbar-item-invisible {
    display: table;
}

#serviceRequestEventToolBar .dx-toolbar-after .dx-toolbar-button.dx-toolbar-menu-container {
    display: none;
}
/* Info Alert PopUp*/
.dx-dialog .dx-overlay-content.dx-popup-normal.dx-popup-draggable.dx-resizable {
    background: #ffffff;
    padding: 20px;
}

    .dx-dialog .dx-overlay-content.dx-popup-normal.dx-popup-draggable.dx-resizable .dx-popup-title.dx-toolbar .dx-toolbar .dx-toolbar-items-container {
        color: #333333;
        background: #ffffff;
    }

.dx-dialog .dx-popup-title.dx-toolbar {
    border-bottom: 1px solid #2F80ED;
}

.dx-dialog .dx-overlay-content.dx-popup-normal.dx-popup-draggable.dx-resizable .dx-toolbar-items-container {
    background-color: #ffffff;
    color: #333;
}

    .dx-dialog .dx-overlay-content.dx-popup-normal.dx-popup-draggable.dx-resizable .dx-toolbar-items-container .dx-toolbar-center .dx-toolbar-button .dx-button {
        background-color: #2F80ED;
        color: #ffffff;
    }

        .dx-dialog .dx-overlay-content.dx-popup-normal.dx-popup-draggable.dx-resizable .dx-toolbar-items-container .dx-toolbar-center .dx-toolbar-button .dx-button.dx-state-hover, .dx-dialog .dx-overlay-content.dx-popup-normal.dx-popup-draggable.dx-resizable .dx-toolbar-items-container .dx-toolbar-center .dx-toolbar-button .dx-button.dx-state-active, .dx-dialog .dx-overlay-content.dx-popup-normal.dx-popup-draggable.dx-resizable .dx-toolbar-items-container .dx-toolbar-center .dx-toolbar-button .dx-button.dx-state-focused {
            background-color: #4A91F0;
            color: #ffffff;
        }
/*EQUIPMENT*/
.new-equipment {
    display: flex;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 999999;
    width: 10em;
    text-align: center;
}

    .new-equipment .button-right {
        background-color: transparent;
        border: none;
        height: 50px;
        width: 100%;
        margin: auto;
        border-radius: 0;
    }

        .new-equipment .button-right .dx-icon {
            color: white;
        }

.button {
    font-size: 1.5rem;
    padding: 0.5rem 1rem;
    background-color: #337ab7;
    border: 0.1rem solid #337ab7;
    border-radius: 0.4rem;
    color: #fff !important;
    cursor: pointer;
    font-size: 1.1rem;
    font-weight: 700;
    height: 3.8rem;
    letter-spacing: .1rem;
    line-height: 3.8rem;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    white-space: nowrap;
}

#manualSearch {
    padding: 0.5rem 1rem;
    background-color: #337ab7;
    border: 0.1rem solid #337ab7;
    border-radius: 0.4rem;
    color: #fff !important;
    cursor: pointer;
    letter-spacing: .1rem;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    white-space: nowrap;
    font-weight: 700;
    font-family: 'Helvetica Neue', 'Segoe UI', Helvetica, Verdana, sans-serif;
}

#sourceSelect {
    width: 95%;
}

#sourceSelectPanel {
    margin-top: 2%;
    margin-left: 1.5em;
}

#scannerButtons {
    margin-top: 2%;
    margin-bottom: 2%;
    margin-left: 1.5em;
    margin-right: 1.5em;
    text-align: center;
}

#videoHolder {
    margin-top: 2%;
    margin-left: 1.5em;
    margin-right: 1.5em;
    text-align: center;
}

#video {
    width: 91%;
    height: auto;
    text-align: center;
}

pre {
    margin-left: 1.5em;
    overflow-x: auto !important;
    white-space: pre-wrap !important; /* Since CSS 2.1 */
    white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */
    white-space: -pre-wrap !important; /* Opera 4-6 */
    white-space: -o-pre-wrap !important; /* Opera 7 */
    word-wrap: break-word !important; /* Internet Explorer 5.5+ */
}

code {
    margin-left: 1.5em;
    white-space: normal !important;
}

#sourceSelectPanel {
    display: block;
}

#resultlabel {
    margin-left: 1.5em;
}

#equipmentToolBar .dx-toolbar-center .dx-toolbar-item-invisible {
    display: table;
}

#equipmentToolBar .dx-toolbar-after .dx-toolbar-button.dx-toolbar-menu-container {
    display: none;
}

.equipment-list .dx-scrollable-container .dx-scrollable-content {
    padding: 10px !important;
}

.equipment-list .dx-item.dx-list-item {
    background: #FFFFFF;
    box-shadow: 0px 3px 2px rgba(0, 0, 0, 0.12);
    margin-bottom: 20px;
}

.equipment-list .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-focused {
    color: #000000;
    background-color: #ffffff;
}

.equipment-list .dx-item.dx-list-item .dx-list-item-content {
    padding: 0;
    position: relative;
}

.equipment-list .labels-container {
    display: block;
    width: calc(100% - 50px);
}

    .equipment-list .labels-container .left-items {
        display: block;
        width: 50%;
        float: left;
    }

    .equipment-list .labels-container .right-items {
        display: block;
        width: 50%;
        float: right;
        padding-left: 15px;
    }

.equipment-list .dx-item-content {
    display: table;
}

.equipment-list .container {
    display: table-cell;
    padding: 15px;
    width: 100%;
}

.equipment-list .equipment-icon {
    display: table-cell;
    width: 55px;
    background-color: #2F80ED;
    vertical-align: middle;
    text-align: center;
}

    .equipment-list .equipment-icon img {
    }

@media (max-width: 420px) {
    .equipment-list .labels-container .left-items {
        display: block;
        width: 100%;
        float: left;
    }

    .equipment-list .labels-container .right-items {
        display: block;
        width: 100%;
        float: right;
        padding-left: 0;
    }
}

.add-edit-equipment .dx-scrollable-container {
    padding: 20px;
}

.add-edit-equipment .dx-scrollable-wrapper .dx-scrollable-content .dx-scrollview-content {
    background: #ffffff;
    box-shadow: 0px 3px 2px rgba(0, 0, 0, 0.12);
}

.add-edit-equipment #save, .add-edit-equipment #cancel {
    height: 30px;
    width: 98%;
    text-transform: capitalize;
}

.add-edit-equipment .dx-item.dx-box-item {
    margin-bottom: 10px;
    width: 100%;
    padding: 10px;
    float: left;
}

.add-edit-equipment .dx-texteditor-input {
    height: 40px;
}

@media (max-width: 720px) {
    .add-edit-equipment-form .dx-layout-manager .dx-label-h-align.dx-flex-layout:not(.dx-field-item-label-align) {
        display: block;
    }

    .add-edit-equipment-form .dx-layout-manager .dx-label-h-align.dx-flex-layout .dx-field-item-label {
        white-space: nowrap;
    }

    .add-edit-equipment .dx-item.dx-box-item, .add-edit-equipment .dx-box-item-content {
        margin-bottom: 10px;
        display: block !important;
    }

    .add-edit-equipment .dx-item.dx-box-item {
        margin-bottom: 10px;
        width: 100%;
        padding: 0;
        float: left;
    }
}

.menuEquipment {
    width: 40px;
    height: 40px;
    display: block;
    float: right;
}


    .menuEquipment .dx-menu-item-popout {
        display: none;
    }

    .menuEquipment .dx-context-menu-container-border {
        width: 40px;
        height: 40px;
        border: none;
    }

    .menuEquipment .dx-menu-item-has-submenu {
        width: 40px;
        height: 40px;
        border: none;
        background: url(../img/equipment-menu.svg) center no-repeat;
        background-color: #ffffff;
    }

        .menuEquipment .dx-menu-item-has-submenu:hover {
            background-color: #eeeeee;
        }

.edit-equipment {
    margin-top: 15px;
    position: absolute;
    top: 0px;
    right: 60px;
    width: 40px;
    height: 40px;
    border: none;
    border-radius: 0;
}

.right {
    width: calc(100% - 40px);
    float: left;
}

.menuEquipment .dx-submenu .dx-menu-items-container {
    /*position: absolute;
    right: -40px;
    display: block;
        */
    text-transform: uppercase;
    width: 250px;
    font-size: 11px;
    font-weight: 500;
}


.menuEquipment .dx-menu-items-container.dx-menu-no-icons .dx-menu-item-wrapper {
    width: 50%;
    float: left;
}

.menuEquipment .dx-submenu .dx-menu-items-container .dx-item.dx-menu-item-has-text {
    padding: 5px;
    display: block;
    width: 100%;
}

.menuEquipment .dx-submenu .dx-menu-items-container .dx-item .dx-icon {
    margin-right: 5px;
}

.dx-popup-wrapper > .dx-overlay-content.dx-popup-normal.dx-resizable, .dx-device-mobile .dx-popup-wrapper > .dx-overlay-content.dx-popup-normal.dx-resizable {
    height: auto !important;
}

    .dx-popup-wrapper > .dx-overlay-content.dx-popup-normal.dx-resizable .dx-field-item-label-text {
    }

    .dx-popup-wrapper > .dx-overlay-content.dx-popup-normal.dx-resizable .dx-first-row.dx-first-col.dx-last-col.dx-field-item.dx-field-item-optional.dx-col-0.dx-flex-layout.dx-label-h-align {
        align-items: center;
    }

    .dx-popup-wrapper > .dx-overlay-content.dx-popup-normal.dx-resizable .dx-toolbar-items-container {
        background-color: transparent;
    }

    .dx-popup-wrapper > .dx-overlay-content.dx-popup-normal.dx-resizable .dx-popup-content {
        height: auto;
    }

    .dx-popup-wrapper > .dx-overlay-content.dx-popup-normal.dx-resizable .dx-popup-title {
        border-bottom: none;
        min-height: unset;
        padding: 0;
    }

    .dx-popup-wrapper > .dx-overlay-content.dx-popup-normal.dx-resizable .dx-button-default {
        float: right;
        margin: 10px 0;
        min-height: 0px;
    }

        .dx-popup-wrapper > .dx-overlay-content.dx-popup-normal.dx-resizable .dx-button-default .dx-button-content {
            height: 44px;
            width: 100px;
        }
/* ATTACHMENTS */
#fileUploader {
    padding: 10px;
}

    #fileUploader .dx-fileuploader-wrapper {
        padding: 10px;
    }

        #fileUploader .dx-fileuploader-wrapper .dx-fileuploader-container {
            background: #FFFFFF;
            box-shadow: 0px 3px 2px rgba(0, 0, 0, 0.12);
            padding: 15px;
        }

    #fileUploader .dx-fileuploader-input-wrapper .dx-fileuploader-button.dx-button.dx-button-normal.dx-widget.dx-button-has-text .dx-button-content {
        width: 100%;
        height: 30px;
        background: #C4C4C4;
        box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.12);
        border-radius: 4px;
    }

    #fileUploader .dx-fileuploader-wrapper .dx-fileuploader-container .dx-fileuploader-input-wrapper {
        background: #EEEEEE;
        padding: 15px;
    }

    #fileUploader .dx-fileuploader-input-label {
        padding: 6px 10px;
        font-size: 15px;
    }

    #fileUploader .dx-fileuploader-file-container .dx-button {
        border: none;
    }

    #fileUploader .dx-fileuploader-button .dx-button-content {
        width: 28px;
    }

        #fileUploader .dx-fileuploader-button .dx-button-content .dx-icon-close {
            background: url(../img/clear.svg) center no-repeat;
        }

            #fileUploader .dx-fileuploader-button .dx-button-content .dx-icon-close:before {
                content: none;
            }

        #fileUploader .dx-fileuploader-button .dx-button-content .dx-icon-upload {
            background: url(../img/upload.svg) center no-repeat;
        }

            #fileUploader .dx-fileuploader-button .dx-button-content .dx-icon-upload:before {
                content: none;
            }

    #fileUploader .dx-fileuploader-content > .dx-fileuploader-upload-button {
        width: 100%;
        border: none;
    }

    #fileUploader .dx-fileuploader-wrapper .dx-fileuploader-button.dx-fileuploader-upload-button.dx-button.dx-button-normal.dx-widget.dx-button-has-text .dx-button-content {
        width: 100%;
        background: #2F80ED;
        color: #ffffff;
        margin: 0 auto;
        border-radius: 4px;
        box-shadow: 0px 3px 2px rgba(0, 0, 0, 0.12);
    }

    #fileUploader + #gridContainer .dx-scrollview-content {
        background: #ffffff;
        margin: 0 20px 20px 20px;
        box-shadow: 0px 3px 2px rgba(0, 0, 0, 0.12);
        padding: 15px;
    }

        #fileUploader + #gridContainer .dx-scrollview-content .dx-item.dx-list-item {
            border-bottom: 1px solid #ddd;
        }

            #fileUploader + #gridContainer .dx-scrollview-content .dx-item.dx-list-item.dx-state-focused {
                color: #333333;
            }
/* COMMENTS */
.comments-page .dx-scrollview-content {
    display: flex;
    flex-wrap: wrap;
}

.comments-page .dx-scrollable-container .dx-scrollable-content {
    padding: 10px !important;
}

.new-comment .dx-scrollable-content {
    background-color: #FFFFFF;
    margin: 20px 20px 50px;
    min-height: 500px;
    box-shadow: 0px 3px 2px rgba(0, 0, 0, 0.12);
    padding: 15px 20px 20px;
}

.comments-page .dx-item.dx-list-item {
    margin-bottom: 20px;
    display: flex;
    width: 49.9%;
}

.comments-page .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-focused {
    color: #000000;
    background-color: #ffffff;
}

.comments-page .dx-item.dx-list-item .dx-list-item-content {
    padding: 0px;
    position: relative;
    display: flex;
    background: #FFFFFF;
    box-shadow: 0px 3px 2px rgba(0, 0, 0, 0.12);
}

.comments-page .icon-comment {
    display: flex;
    width: 55px;
    text-align: center;
    background-color: #2F80ED;
    padding: 15px;
}

.comments-page .comment-content {
    width: calc(100% - 55px);
    word-break: break-word;
    padding: 10px;
}

    .comments-page .comment-content p {
        display: block;
        width: 100%;
    }

.comments-page .labels-container {
    display: block;
    width: calc(100% - 50px);
}

.comments-page .dx-item.dx-list-item {
    display: flex;
    width: 49.9%;
    float: left;
    margin: 0;
    padding: 10px;
}

@media (max-width: 740px) {
    .comments-page .dx-scrollview-content {
        display: block;
    }

    .comments-page .dx-item.dx-list-item {
        display: block;
        width: calc(100% - 0px);
        float: left;
        margin: 0px;
    }
}

#newCommentToolbar .dx-toolbar-items-container .dx-toolbar-after .dx-button, #editCommentToolbar .dx-toolbar-items-container .dx-toolbar-after .dx-item-content .dx-button {
    background-color: transparent;
    color: #ffffff;
    font-size: 15px;
    font-weight: 300;
    border: none;
    box-shadow: none;
}

    #newCommentToolbar .dx-toolbar-items-container .dx-toolbar-after .dx-button .dx-button-text, #editCommentToolbar .dx-toolbar-items-container .dx-toolbar-after .dx-button .dx-button-text {
        font-weight: 300;
    }

.new-comment .dx-field, .new-comment .dx-device-mobile .dx-field {
    margin: 0;
    padding: 15px;
}

.comment-detail .dx-scrollable-content {
    padding: 15px !important;
}

    .comment-detail .dx-scrollable-content .dx-scrollview-content {
        background: #FFFFFF;
        box-shadow: 0px 3px 2px rgba(0, 0, 0, 0.12);
        padding: 15px;
    }

        .comment-detail .dx-scrollable-content .dx-scrollview-content .dx-field-value-static.ng-binding {
            text-align: left;
            width: 100%;
            padding: 0;
        }

        .comment-detail .dx-scrollable-content .dx-scrollview-content .dx-field {
            padding: 0;
            margin: 0;
        }
/* STATUS */
.status-history .dx-scrollview-content {
    display: flex;
    flex-wrap: wrap;
}

.status-history .dx-scrollable-container .dx-scrollable-content {
    padding: 10px !important;
}

.status-history .dx-item.dx-list-item {
    background: #FFFFFF;
    box-shadow: 0px 3px 2px rgba(0, 0, 0, 0.12);
    display: flex;
    width: calc(100% - 20px);
    margin: 10px;
}

.status-history .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-focused {
    color: #000000;
    background-color: #ffffff;
}

.status-history .dx-item.dx-list-item .dx-list-item-content {
    padding: 0px;
    position: relative;
    display: table;
    height: 100%;
}

.status-history .icon-status {
    display: table-cell;
    vertical-align: middle;
    width: 55px;
    text-align: center;
    background-color: #2F80ED;
    padding: 16px;
}

.status-history .data-status {
    display: table-cell;
    vertical-align: middle;
    width: 100%;
    word-break: break-word;
    padding: 15px;
}

.dx-device-mobile .status-history .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-focused, .status-history .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-focused {
    color: #333333;
    background-color: #ffffff;
}

@media (max-width: 720px) {
    .status-history .dx-scrollview-content {
        display: block;
    }

    .status-history .dx-item.dx-list-item {
        display: block;
        width: calc(100% - 20px);
        float: left;
        margin: 10px;
    }
}
/* CONTACTS */
.contacts .dx-scrollview-content {
    display: flex;
    flex-wrap: wrap;
}

.contacts .dx-scrollable-container .dx-scrollable-content {
    padding: 0px !important;
}

.contacts .dx-item.dx-list-item {
    background: #FFFFFF;
    box-shadow: 0px 3px 2px rgba(0, 0, 0, 0.12);
    display: flex;
    width: calc(100% - 20px);
    margin: 10px;
}

.contacts .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-focused {
    color: #000000;
    background-color: #ffffff;
}

.contacts .dx-item.dx-list-item .dx-list-item-content {
    padding: 0px;
    position: relative;
    display: table;
    height: 100%;
}

    .contacts .dx-item.dx-list-item .dx-list-item-content .dx-item.dx-list-item {
        padding: 0px;
        position: relative;
        display: block;
        height: auto;
        box-shadow: none;
        margin: 0;
    }

.contacts .icon-contact {
    display: table-cell;
    vertical-align: middle;
    width: 55px;
    text-align: center;
    background-color: #2F80ED;
    padding: 16px;
}

.contacts .data-contacts {
    vertical-align: middle;
    width: 100%;
    word-break: break-word;
    padding: 15px;
}

    .contacts .data-contacts p {
        font-size: 15px;
    }

.dx-device-mobile .contacts .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-focused, .contacts .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-focused {
    color: #333333;
    background-color: #ffffff;
}

#phoneContainer {
}

@media (max-width: 720px) {
    .contacts .dx-scrollview-content {
        display: block;
    }

    .contacts .dx-item.dx-list-item {
        display: block;
        width: calc(100% - 20px);
        float: left;
        margin: 10px;
    }
}

/*SCROLL BAR*/



.dx-scrollable-scroll {
    padding: 2px;
    background-color: transparent;
    opacity: 1;
    overflow: hidden;
    -webkit-transition: opacity 0s linear;
    transition: opacity 0s linear;
}

    .dx-scrollable-scroll.dx-state-invisible {
        opacity: 0;
        -webkit-transition: opacity .5s linear 1s;
        transition: opacity .5s linear 1s;
    }

.dx-scrollable-scroll-content {
    width: 100%;
    height: 100%;
    background-color: rgba(191, 191, 191, 0.7);
    -webkit-box-shadow: 0 0 0 1px transparent;
    box-shadow: 0 0 0 1px transparent;
}

.dx-scrollbar-hoverable {
    background-color: transparent;
}

    .dx-scrollbar-hoverable.dx-state-hover,
    .dx-scrollbar-hoverable.dx-scrollable-scrollbar-active {
        background-color: rgba(191, 191, 191, 0.2);
    }

        .dx-scrollbar-hoverable.dx-scrollable-scrollbar-active .dx-scrollable-scroll-content {
            background-color: #000;
        }

    .dx-scrollbar-hoverable .dx-scrollable-scroll.dx-state-invisible {
        opacity: 1;
    }

        .dx-scrollbar-hoverable .dx-scrollable-scroll.dx-state-invisible .dx-scrollable-scroll-content {
            background-color: transparent;
            background-color: rgba(0, 0, 0, 0);
            -webkit-box-shadow: 0 0 0 1px transparent;
            box-shadow: 0 0 0 1px transparent;
        }

.dx-scrollbar-vertical .dx-scrollable-scroll {
    float: right;
    width: 8px;
}

.dx-scrollbar-vertical.dx-scrollbar-hoverable {
    width: 8px;
    -webkit-transition: width .2s linear .15s, background-color .2s linear .15s;
    transition: width .2s linear .15s, background-color .2s linear .15s;
}

    .dx-scrollbar-vertical.dx-scrollbar-hoverable .dx-scrollable-scroll {
        -webkit-transition: background-color .5s linear 1s, width .2s linear 150ms;
        transition: background-color .5s linear 1s, width .2s linear 150ms;
    }

        .dx-scrollbar-vertical.dx-scrollbar-hoverable .dx-scrollable-scroll .dx-scrollable-scroll-content {
            -webkit-transition: box-shadow .15s linear .15s, background-color .15s linear .15s;
            -webkit-transition: background-color .15s linear .15s, -webkit-box-shadow .15s linear .15s;
            transition: background-color .15s linear .15s, -webkit-box-shadow .15s linear .15s;
            transition: box-shadow .15s linear .15s, background-color .15s linear .15s;
            transition: box-shadow .15s linear .15s, background-color .15s linear .15s, -webkit-box-shadow .15s linear .15s;
        }

        .dx-scrollbar-vertical.dx-scrollbar-hoverable .dx-scrollable-scroll.dx-state-invisible {
            -webkit-transition: background-color .5s linear 1s, width .2s linear .15s;
            transition: background-color .5s linear 1s, width .2s linear .15s;
        }

            .dx-scrollbar-vertical.dx-scrollbar-hoverable .dx-scrollable-scroll.dx-state-invisible .dx-scrollable-scroll-content {
                -webkit-transition: box-shadow .5s linear 1s, background-color .5s linear 1s;
                -webkit-transition: background-color .5s linear 1s, -webkit-box-shadow .5s linear 1s;
                transition: background-color .5s linear 1s, -webkit-box-shadow .5s linear 1s;
                transition: box-shadow .5s linear 1s, background-color .5s linear 1s;
                transition: box-shadow .5s linear 1s, background-color .5s linear 1s, -webkit-box-shadow .5s linear 1s;
            }

    .dx-scrollbar-vertical.dx-scrollbar-hoverable.dx-state-hover,
    .dx-scrollbar-vertical.dx-scrollbar-hoverable.dx-scrollable-scrollbar-active {
        width: 15px;
    }

        .dx-scrollbar-vertical.dx-scrollbar-hoverable.dx-state-hover .dx-scrollable-scroll,
        .dx-scrollbar-vertical.dx-scrollbar-hoverable.dx-scrollable-scrollbar-active .dx-scrollable-scroll {
            width: 15px;
        }

.dx-scrollbar-horizontal .dx-scrollable-scroll {
    height: 8px;
}

.dx-scrollbar-horizontal.dx-scrollbar-hoverable {
    height: 8px;
    -webkit-transition: height .2s linear .15s, background-color .2s linear .15s;
    transition: height .2s linear .15s, background-color .2s linear .15s;
}

    .dx-scrollbar-horizontal.dx-scrollbar-hoverable .dx-scrollable-scroll {
        -webkit-transition: background-color .5s linear 1s, height .2s linear .15s;
        transition: background-color .5s linear 1s, height .2s linear .15s;
    }

        .dx-scrollbar-horizontal.dx-scrollbar-hoverable .dx-scrollable-scroll .dx-scrollable-scroll-content {
            -webkit-transition: box-shadow .15s linear .15s, background-color .15s linear .15s;
            -webkit-transition: background-color .15s linear .15s, -webkit-box-shadow .15s linear .15s;
            transition: background-color .15s linear .15s, -webkit-box-shadow .15s linear .15s;
            transition: box-shadow .15s linear .15s, background-color .15s linear .15s;
            transition: box-shadow .15s linear .15s, background-color .15s linear .15s, -webkit-box-shadow .15s linear .15s;
        }

        .dx-scrollbar-horizontal.dx-scrollbar-hoverable .dx-scrollable-scroll.dx-state-invisible {
            -webkit-transition: background-color .5s linear 1s, height .2s linear .15s;
            transition: background-color .5s linear 1s, height .2s linear .15s;
        }

            .dx-scrollbar-horizontal.dx-scrollbar-hoverable .dx-scrollable-scroll.dx-state-invisible .dx-scrollable-scroll-content {
                -webkit-transition: box-shadow .5s linear 1s, background-color .5s linear 1s;
                -webkit-transition: background-color .5s linear 1s, -webkit-box-shadow .5s linear 1s;
                transition: background-color .5s linear 1s, -webkit-box-shadow .5s linear 1s;
                transition: box-shadow .5s linear 1s, background-color .5s linear 1s;
                transition: box-shadow .5s linear 1s, background-color .5s linear 1s, -webkit-box-shadow .5s linear 1s;
            }

    .dx-scrollbar-horizontal.dx-scrollbar-hoverable.dx-state-hover,
    .dx-scrollbar-horizontal.dx-scrollbar-hoverable.dx-scrollable-scrollbar-active {
        height: 15px;
    }

        .dx-scrollbar-horizontal.dx-scrollbar-hoverable.dx-state-hover .dx-scrollable-scroll,
        .dx-scrollbar-horizontal.dx-scrollbar-hoverable.dx-scrollable-scrollbar-active .dx-scrollable-scroll {
            height: 15px;
        }

.dx-scrollable-scrollbars-alwaysvisible.dx-scrollable-vertical .dx-scrollable-content,
.dx-scrollable-scrollbars-alwaysvisible.dx-scrollable-both .dx-scrollable-content {
    padding-right: 8px;
}

.dx-rtl.dx-scrollable-scrollbars-alwaysvisible.dx-scrollable-vertical .dx-scrollable-content,
.dx-rtl.dx-scrollable-scrollbars-alwaysvisible.dx-scrollable-both .dx-scrollable-content,
.dx-rtl .dx-scrollable-scrollbars-alwaysvisible.dx-scrollable-vertical .dx-scrollable-content,
.dx-rtl .dx-scrollable-scrollbars-alwaysvisible.dx-scrollable-both .dx-scrollable-content {
    padding-right: 0;
    padding-left: 8px;
}

.dx-scrollable-scrollbars-alwaysvisible.dx-scrollable-horizontal .dx-scrollable-content,
.dx-scrollable-scrollbars-alwaysvisible.dx-scrollable-both .dx-scrollable-content {
    padding-bottom: 8px;
}

.dx-scrollable-customizable-scrollbars {
    -ms-scrollbar-base-color: #fff;
    -ms-scrollbar-arrow-color: #4b4b4b;
    -ms-scrollbar-track-color: #fff;
}

    .dx-scrollable-customizable-scrollbars ::-webkit-scrollbar:horizontal {
        height: 20px;
    }

    .dx-scrollable-customizable-scrollbars ::-webkit-scrollbar:vertical {
        width: 20px;
    }

    .dx-scrollable-customizable-scrollbars ::-webkit-scrollbar {
        background-color: #ddd;
    }

    .dx-scrollable-customizable-scrollbars ::-webkit-scrollbar-thumb {
        background-color: #ccc;
        border-right: 1px solid transparent;
        border-left: 1px solid transparent;
        background-clip: content-box;
        border-radius: 10px;
    }

    .dx-scrollable-customizable-scrollbars ::-webkit-scrollbar-track {
        background-color: transparent;
    }

    .dx-scrollable-customizable-scrollbars ::-webkit-scrollbar-corner {
        background-color: transparent;
    }

    .dx-scrollable-customizable-scrollbars ::-webkit-scrollbar-button {
        background-color: transparent;
    }

/*TAB STYLES*/
.dx-tabs {
    background: #2F80ED;
    color: #fff;
    border: none;
}

    .dx-tabs.dx-tabs-expanded, .dx-tabs.dx-tabs-scrollable {
        border: none;
    }

.dx-tabs-expanded .dx-tab, .dx-tabs-scrollable .dx-tab {
    vertical-align: unset;
    background-color: #2F80ED;
    color: #ffffff;
    border: none;
    padding: 12px;
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: 0.5px;
}

.dx-tabs-scrollable .dx-tab {
    font-size: 10px;
}

@media (max-width: 720px) {
    .dx-tabs-expanded .dx-tab {
        font-size: 10px;
    }
}

#detailNavbar .dx-tabs-wrapper .dx-item.dx-tab:nth-child(1),
#attachmentsNavbar .dx-tabs-wrapper .dx-item.dx-tab:nth-child(2),
#commentsNavbar .dx-tabs-wrapper .dx-item.dx-tab:nth-child(3),
#statusHistoryNavbar .dx-tabs-wrapper .dx-item.dx-tab:nth-child(4),
#contactsNavbar .dx-tabs-wrapper .dx-item.dx-tab:nth-child(5),
#equipmentNavbar .dx-tabs-wrapper .dx-item.dx-tab:nth-child(6) {
    background-color: #2F80ED;
    border-bottom: solid 2px #fff;
}

.dx-tabs-scrollable .dx-tabs-wrapper {
    border: none;
    background: #2F80ED;
}

.dx-tabs-scrollable {
    margin: 0px;
    height: auto;
}

.dx-button-mode-contained .dx-icon {
    color: #fff;
}

.dx-tabs-nav-button {
    background-color: #2774DC;
}

.dx-tabs-nav-buttons .dx-tabs-scrollable .dx-tabs-wrapper {
    border: none;
}

.dx-tabs-nav-button.dx-state-disabled {
    background: #2F80ED;
}

.dx-tab-selected:after {
    border-right: none;
    border-left: none;
    border-top: none;
    border-bottom: none;
}

.dx-button-mode-contained.dx-state-hover, .dx-button-mode-contained.dx-state-active {
    background-color: #4A91F0;
}

.act-container .dx-button-mode-contained.dx-state-hover, .act-container .dx-button-mode-contained.dx-state-active {
    background-color: #F0F0F0;
}