/* Add here all your CSS customizations */

/*.main {
    overflow-x: auto;
}*/

/*Uncomment for TEST*/
/*div .header-body {
    background-color: #f4fdfe !important;
}*/

/*Uncomment for CMC*/
/*div .header-body {
    background-color: #EEF8EB !important;
}*/

html, body {
    font-family: 'Cairo', sans-serif !important;
    font-size: 16px;
}

.body {
    overflow-x: hidden;
}

#dimScreen {
    position: fixed;
    padding: 0;
    margin: 0;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(193,193,193,0.75);
}

    #dimScreen .center {
        margin: 0;
        position: absolute;
        top: 50%;
        left: 50%;
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }


.RTL h1, .RTL h2, .RTL h3, .RTL h4, .RTL h5, .RTL h6 {
    letter-spacing: 0px !important;
}

.RTL .nav .dropdown a {
    direction: rtl;
}

.user-menu .user-profile-pic {
    border-radius: 25px;
    display: inline-block;
    height: 25px;
    margin: -2px 5px 0px 0px;
    width: 25px;
}

nav i.fa {
    color: #444 !important;
}

.popupCloseButton {
    display: none;
}

.CenterForm {
    margin: auto;
}

#menu .fa {
    color: #4d9bd6 !important;
    min-width: 16px !important;
    text-align: center;
}

.toolbarGroupArrow .dxm-popOut {
    float: none !important;
    padding: 1px 5px 1px 5px !important;
}

#menu .active > .fa {
    color: #e62f36 !important;
}

#menu .active > a > .fa {
    color: #e62f36 !important;
}

.label-role {
    padding-top: 4px;
}

.formLayoutCenter {
    margin: 0 auto;
    float: none !important;
    display: table;
}

.wrapCaption {
    white-space: normal !important;
    word-wrap: break-word;
    line-height: 1 !important;
}

.attendanceGrid .attendanceRow:not([id$=GridViewAttendance_DXDataRow0]) span.dxIcon_content_checkbox_svg_32x32 {
    display: inline-block;
    height: 25px;
    width: 25px;
    background-image: url(/Core/Content/Images/ActionsClose32x32devav.jpg);
    background-repeat: no-repeat;
    background-position: 0;
    background-size: contain;
}

.attendanceGrid .individualAttendanceRow span.dxIcon_content_checkbox_svg_32x32 {
    display: inline-block;
    height: 25px;
    width: 25px;
    background-image: url(/Core/Content/Images/ActionsClose32x32devav.jpg);
    background-repeat: no-repeat;
    background-position: 0;
    background-size: contain;
}


.gridViewRow .draggable .hover {
    background-color: lightblue;
}


.gridViewRow .draggable .activeHover {
    background-color: lightgray;
}

.gridViewRow .draggable .ui-draggable-dragging {
    background-color: lightgreen;
    color: White;
}

/*.dxeDisabled_MaterialCompact:disabled {
    background: lightgray !important;
}*/


@media (min-width: 992px) {
    #header .header-nav {
        justify-content: flex-start !important;
    }
}

@media (max-width: 992px) {
    #menu {
        justify-content: flex-end !important;
    }
}

.container {
    max-width: 100% !important;
}

#gridView_DXPagerTop_PSB input, #gridView_DXPagerBottom_PSB input {
    width: 35px;
}

.treelist-pager-panel input {
    width: 35px !important;
}

.RTL .dxpgColumnFieldValue_MaterialCompact {
    text-align: right !important;
}

.RTL .dxeListBoxEllipsisSys {
    display: inherit !important;
}

.ltrCell {
    direction: ltr !important;
}

@media (min-width: 0px) and (max-width: 767px) {
    .text-md-right {
        text-align: left !important;
    }

    .RTL .text-md-right {
        text-align: right !important;
    }
}

@media (min-width: 768px) {
    .text-md-right {
        text-align: right !important;
    }

    .RTL .text-md-right {
        text-align: left !important;
    }
}

    .card-text-color-hover-light:hover * {
        color: #2719D6 !important;
    }

    html .bg-color-hover-primary:hover {
        background-color: #F7F7F7 !important;
    }
    /* Grey changed to Egg White */
    .bg-color-grey {
        background-color: #FEFFFF !important;
    }

    html .bg-color-light-scale-1 {
        background-color: #fbf9f6 !important;
    }

    .dxmLite_MaterialCompact .dxctToolbar_MaterialCompact.dxm-main .dxm-item.dxm-hovered {
        background-color: #fbf9f6 !important;
    }

    .dxgvFilterRow_MaterialCompact td.dxgv {
        background-color: #DDF6FF !important;
    }

    .checkbox-caption {
        line-height: inherit !important;
    }

    .dxgvControl_MaterialCompact .dxgvHSDC {
        padding: 0px !important;
    }

    .disabledCheckbox span.dxICheckBox_MaterialCompact {
        display: inline-block;
        height: 20px;
        width: 20px;
        background-image: url(/Core/Content/Images/checkbox_disabled_16x16.png);
        background-repeat: no-repeat;
        background-position: 0;
        background-size: contain;
    }

    .WorkflowDesignerButtons {
        margin-top: -20px !important;
    }

    .dx-list-item-before-bag .dx-list-select-checkbox {
        margin-left: 0px !important;
    }

    .dx-checkbox-icon {
        padding-left: 20px;
    }

    .nav-link-session {
        background-color: red !important;
        color: white !important;
        font-weight: bold !important;
    }

    .dirLTR, .dirLTR a {
        direction: ltr !important;
    }

    .dirRTL, .dirRTL a {
        direction: rtl !important;
    }
    /* start region expression builder */
    div .exp-container {
        position: relative;
    }

        div .exp-container .dxeMemoEditAreaSys, input[type="text"].dxeEditAreaSys, input[type="password"].dxeEditAreaSys {
            padding-left: 23px;
        }

        div .exp-container .exp-notification {
            width: 20px;
            height: 20px;
            position: absolute;
            top: 15px;
            left: 5px;
            cursor: help;
        }

            div .exp-container .exp-notification span {
                display: none;
                color: #fff;
                width: 16px;
                height: 16px;
                line-height: 16px;
                border-radius: 10px;
                font-size: 10px;
                text-align: center;
            }


            div .exp-container .exp-notification .ok {
                background-color: #2b9223;
            }

            div .exp-container .exp-notification .error {
                background-color: #ba3636;
            }

        div .exp-container.invalid .dxeMemoEditAreaSys, input[type="text"].dxeEditAreaSys, input[type="password"].dxeEditAreaSys {
            border-color: #ba3636;
        }

        div .exp-container.invalid .exp-notification .ok {
            display: none;
        }

        div .exp-container.invalid .exp-notification .error {
            display: block;
        }

        div .exp-container.valid .exp-notification .ok {
            display: block;
        }

        div .exp-container.valid .exp-notification .error {
            display: none;
        }

        div .exp-container .exp-suggestions {
            width: 100%;
            background-color: white;
            box-shadow: 0px 5px 7px 2px rgba(0,0,0,0.3);
            min-height: 50px;
            max-height: 300px;
            overflow-y: auto;
            position: absolute;
            display: none;
            z-index: 1069;
        }

            div .exp-container .exp-suggestions.up {
                bottom: 36px;
            }

            div .exp-container .exp-suggestions .exp-suggestion-item {
                cursor: pointer;
                width: 100%;
                padding: 3px 5px;
                min-width: 400px;
            }

                div .exp-container .exp-suggestions .exp-suggestion-item.selected {
                    font-weight: bold;
                }

                div .exp-container .exp-suggestions .exp-suggestion-item:hover {
                    background-color: #337ab7;
                    color: white;
                }

    /* end region expression builder */