/*Definition*/
@font-family: sans-serif;
@font-size: 14px;
@font-path: "common-images";
@border-size: 1px;
@border-type: solid;
@header-font-weight: bold;
@header-font-size: 16px;
@content-font-weight: normal;
@datepicker-image-top:5px;
@gheader-font-size: 14px;
@gantt-content-font-size: 12px;
@gantt-header-font-family: Segoe UI;
@gantt-header-font-size: 14px;
@gantt-parentGanttRecord-font-weight: bold;
@gantt-schedule-font-weight: 600;
@gantt-schedule-font-size: 13px;
@gantt-tooltip-font-size: 12px;
@gantt-tasklable-font-family: Segoe UI;
@gantt-tasklable-font-size: 12px;
@gantt-tasklable-font-style: normal;
@input-height: 34px;
@visual-mode-padding: 2px 19px 5px 4px;
@visual-mode-rtl-padding: 2px 4px 5px 19px;
@progressbar-height: 20px;
@toolbar-padding: 4px;
@toolbar-margin-right: 1px;
@toolbar-res-margin-top: 5px;
@menu-horizontal-line-height: 38px;
@menu-vertical-line-height: 38px;
@menu-hor-child-line-height: 24px;
@menu-ver-child-line-height: 24px;
@slider-size: 20px;
@slider-border-radius: 12px;
@slider-bs-border-radius: 12px;
@treeview-text-padding: .308em .6667em .4167em .5833em;
@treeview-edit-text-padding: 0 0 0 .5833em;
@treeview-rtl-edit-text-padding: 0 .5833em 0 0;
@treeview-ul-padding: 2px 0px 0px 10px;
@treeview-icon-margin: 10px;
@treeview-rtl-item-padding: 0px 16px 2px 0px;
@treeview-rtl-ul-padding: 2px 10px 0px 0px;
@treeview-ul-margin-bottom: -2px;
@treeview-chk-margin-top: 4px;
@treeview-fullrow-height: 31px;
@rte-ul-margin-buttom: 5px;
@rte-ul-margin-top: 6px;
@rte-split-height: 34px;
@rte-toolbar-res-margin-top: 12px;
@fe-treeview-image-top: 5px;
@button-height: 34px;
@border-radius: 4px;
@border-left-radius: @border-radius 0 0 @border-radius;
@border-right-radius: 0 @border-radius @border-radius 0;
@border-top-radius: @border-radius @border-radius 0 0;
@border-bottom-radius: 0 0 @border-radius @border-radius;
@inner-border-radius: @border-radius - 1;
@inner-border-left-radius: @inner-border-radius 0 0 @inner-border-radius;
@inner-border-right-radius: 0 @inner-border-radius @inner-border-radius 0;
@inner-border-top-radius: @inner-border-radius @inner-border-radius 0 0;
@box-shadow: rgba(0, 0, 0, 0.0745098) 0px 1px 1px inset;
@button-box-shadow: none;
@schedule-commonviewbutton: 7px 10px 7px 10px;
@schedule-input-height: 30px;
@schedule-viewstable-margin-top: -8px;
@schedule-agendaday-line-height: 42px;
@schedule-box-shadow: @box-shadow;
@schedule-commonviewbutton-box-shadow: @box-shadow;
@ribbon-line-height: 33px;
@ribbon-resizebtn-height: auto;
@tools-border-radius: 3px;
@ss_box-sizing: border-box;
@ss-button-height: 34px;
@ss-formula-border: none;
@ss-formula-wrapper-height: 26px;
@ss-button-bottom-margin: 4px;
@ss-button-left-margin: 11px;
@ss-pagercontainer-height: 28px;
@ss-pagercontainer-overflow: visible;
@ss-pager-height: 30px;
@ss-margin-bottom: 4px;
@ss-margin-top: 7px;
@ss-addnew-padding-top: 1px;
@ss-icon-margin:9px 3px 0px 7px;
@header-border-size: 1px;
@grid-box-shadow:none;

.e-ribbon.e-js .e-header .e-active a, .e-ribbon .e-header > .e-apptab .e-apptabanchor,
.e-ribbon .e-expandcollapse span, .e-ribbon .e-header .e-contextual, .e-ribbon .e-menu li.e-list.e-active.e-mfocused {
    border-radius: @border-radius;
}
.e-ribbon .e-menu.e-horizontal > .e-list > a, .e-menu.e-horizontal > .e-list > span {
    line-height: @ribbon-line-height;
}
.e-ribbon .e-groupdiv .e-resizebtn {
    height: @ribbon-resizebtn-height;
}

.e-datepicker .e-header .e-next, .e-datepicker .e-header .e-prev {
    top: @datepicker-image-top;
}

.e-ss-dialog .e-widget .e-addedrow .e-dlg-btnfields .e-btn-normal , 
.e-ss-dialog .e-widget .e-widget-content .e-dlg-btnfields input.e-btn.e-widget,
.e-ss-dialog .e-widget .e-widget-content .e-dlg-btnfields button.e-btn.e-widget,
.e-ss-dialog .e-widget .e-widget-content .e-dlg-btnfields .e-dlg-btnctnr input.e-btn.e-widget{
    box-sizing: @ss_box-sizing;
    height: @ss-button-height;
    margin-left: @ss-button-left-margin;
    margin-bottom: @ss-button-bottom-margin;
}

.e-spreadsheet .e-widget .e-content .e-groupdiv .e-ribGroupContent .e-innerdivrow .e-innerdivchild .e-ss-colorpicker,
.e-spreadsheet .e-ss-colorpicker.e-colorwidget,.e-spreadsheet .e-formulabar .e-indexbox,.e-ss-textarea, .ejinputtext{
    border-radius: @border-radius;
}

.e-spreadsheet .e-formulabar .e-inputbox{
    border: @ss-formula-border;
}

.e-spreadsheet .e-formulabar .e-inputbox .e-ss-autocomplete .e-in-wrap{
    height: @ss-formula-wrapper-height;
}

.e-spreadsheet .e-spreadsheetgrppanel .e-spreadsheetmainpanel .e-spreadsheetfooter{
    height: @ss-pager-height;
}

.e-spreadsheet .e-spreadsheetgrppanel .e-spreadsheetmainpanel .e-spreadsheetfooter .e-table .e-pager:first-child .e-pagercontainer {
    overflow: @ss-pagercontainer-overflow;
    height: @ss-pagercontainer-height;
}

.e-spreadsheet .e-spreadsheetgrppanel .e-spreadsheetmainpanel .e-spreadsheetfooter .e-pager:first-child .e-pagercontainer .e-numericcontainer .e-numericitem {
    padding-bottom: @ss-margin-bottom;
    padding-top: @ss-margin-top;
}

.e-spreadsheet .e-spreadsheetgrppanel .e-spreadsheetmainpanel .e-spreadsheetfooter .e-table .e-pager:first-child .e-pagercontainer .e-new{
    padding-top: @ss-addnew-padding-top;
}

.e-spreadsheet .e-spreadsheetgrppanel .e-spreadsheetmainpanel .e-spreadsheetfooter .e-pager:first-child .e-pagercontainer .e-firstpage,
.e-spreadsheet .e-spreadsheetgrppanel .e-spreadsheetmainpanel .e-spreadsheetfooter .e-pager:first-child .e-pagercontainer .e-prevpage, 
.e-spreadsheet .e-spreadsheetgrppanel .e-spreadsheetmainpanel .e-spreadsheetfooter .e-pager:first-child .e-pagercontainer .e-nextpage,
.e-spreadsheet .e-spreadsheetgrppanel .e-spreadsheetmainpanel .e-spreadsheetfooter .e-pager:first-child .e-pagercontainer .e-prevpage{
    padding: @ss-icon-margin;
}

@widget: none;

& {
    .mixin(@widget);
}

.mixin(@widget) when (@widget = common), (@widget = none) {

    .border-radius(@radius) when not(@radius = 0px) {
        /* Common Core */
        .e-atc-popup, .e-atc .e-in-wrap, .e-atc .e-in-wrap .e-input,
        .e-acrdn-scroller, .e-acrdn .e-select,
        .e-chkbox-wrap div > span,
        .e-datepicker.e-popup, .e-datewidget .e-in-wrap, .e-datewidget .e-in-wrap .e-input,
		.e-daterangepicker-popup.e-popup, .e-daterangewidget .e-in-wrap, .e-daterangewidget .e-in-wrap .e-input,
		.e-daterangepicker-popup.e-popup, .e-drpbuttons,.e-daterangepicker-popup.e-popup .e-custom-dateranges li,
        .e-datetime-popup.e-popup, .e-datetime-popup .e-dt-button, .e-datetime-wrap .e-in-wrap, .e-datetime-wrap .e-in-wrap .e-input,
        .e-dialog-wrap, .e-dialog-wrap > .e-header .e-dialog-icon,
        .e-ddl-popup.e-popup, .e-ddl .e-in-wrap, .e-ddl .e-in-wrap .e-input,
        .e-numeric .e-in-wrap, .e-numeric .e-in-wrap .e-input,
        .e-percent .e-in-wrap, .e-percent .e-in-wrap .e-input,
        .e-currency .e-in-wrap, .e-currency .e-in-wrap .e-input,
        .e-mask .e-in-wrap, .e-mask .e-in-wrap .e-input, .e-textbox,
        .e-menu,
        .e-tab,
        .e-time-popup.e-popup, .e-timewidget .e-in-wrap, .e-timewidget .e-in-wrap .e-input,
        .e-toolbar, .e-toolbar .e-tooltxt,
        .e-upload-box .e-selectpart, .e-upload-box .e-btn,
        .e-treeview .e-text, .e-fullrow-wrap .e-fullrow,
        .e-splitbutton,
        .e-fileexplorer .e-tilenode,
        .e-rte, .e-rte.e-dialog .e-inputtext,
        .e-btn.e-select,
        .e-progressbar,
        .e-check-wrap .e-chk-inact, .e-check-wrap .e-chk-act, .e-check-wrap .e-chk-indeter {
            border-radius: @radius;
        }

        .e-groupbutton li.e-grp-btn-item:first-child {
            border-top-left-radius: @border-radius;
            border-bottom-left-radius: @border-radius;
        }

        .e-groupbutton li.e-grp-btn-item:last-child {
            border-top-right-radius: @border-radius;
            border-bottom-right-radius: @border-radius;
        }

        .e-groupbutton.e-rtl li.e-grp-btn-item:first-child {
            border-top-right-radius: @border-radius;
            border-bottom-right-radius: @border-radius;
            border-top-left-radius: 0px;
            border-bottom-left-radius: 0px;
        }

        .e-groupbutton.e-rtl li.e-grp-btn-item:last-child {
            border-top-left-radius: @border-radius;
            border-bottom-left-radius: @border-radius;
            border-top-right-radius: 0px;
            border-bottom-right-radius: 0px;
        }
    }

    .border-radius(@border-radius);

    .e-colorwidget.e-split.e-disable .e-in-wrap .e-select:hover, .e-colorwidget.e-split.e-disable .e-color-container:hover,
    .e-dialog.e-disable .e-dialog-icon:hover, .e-dialog.e-disable > .e-header, .e-ddl .e-disable.e-select:hover,
    .e-in-wrap .e-disable.e-select .e-icon, .e-in-wrap .e-disable.e-select, .e-rte .e-horizontal .e-disable,
    .e-slider.e-disable .e-handle.e-select {
        cursor: default;
    }

    .e-corner, .e-corner .e-input,
    .e-acrdn-scroller.e-corner, .e-acrdn.e-corner .e-select,
    .e-corner .e-dt-button,
    .e-corner > .e-header .e-dialog-icon,
    .e-corner .e-tooltxt,
    .e-corner + .e-dialog, .e-corner + .e-dialog > .e-header .e-dialog-icon, .e-corner + .e-dialog > .e-btn {
        border-radius: 4px 4px 4px 4px;
    }

    .border-radius(@radius) when not(@radius = 0px) {
        .e-tab > ul.e-addborderright .e-item, .e-tab .e-addborderleft.e-content-item,
        .e-split .e-splitarrowleft .e-splitbutton, .e-split .e-splitarrowright .e-drp-btn, .e-rtl.e-split .e-splitarrowright .e-splitbutton, .e-rtl.e-split .e-splitarrowleft .e-drp-btn,
        .e-fileexplorer .e-grid tr td.e-last-rowcell, .e-fileexplorer .e-grid.e-rtl tr td:first-child {
            border-radius: @border-right-radius;
        }

        .e-tab > ul.e-addborderleft .e-item, .e-tab .e-addborderright.e-content-item,
        .e-split .e-splitarrowright .e-splitbutton, .e-split .e-splitarrowleft .e-drp-btn, .e-rtl.e-split .e-splitarrowleft .e-splitbutton, .e-rtl.e-split .e-splitarrowright .e-drp-btn,
        .e-fileexplorer, .e-fileexplorer .e-grid tr td:first-child, .e-fileexplorer .e-grid.e-rtl tr td.e-last-rowcell {
            border-radius: @border-left-radius;
        }

        .e-acrdn .e-select.e-active,
        .e-datepicker.e-popup .e-header,
        .e-tab > ul.e-addborderbottom .e-item, .e-tab .e-addbordertop.e-content-item,
        .e-split .e-splitarrowtop .e-drp-btn, .e-split .e-splitarrowbottom .e-splitbutton,
        .e-rte .e-toolbar,
        .e-datetime-popup .e-header,
        .e-fileexplorer .e-toolbar {
            border-radius: @border-top-radius;
        }

        .e-acrdn-content-active,
        .e-dialog-wrap .e-widget-content,
        .e-tab > ul.e-addbordertop .e-item, .e-tab .e-addborderbottom.e-content-item,
        .e-split .e-splitarrowbottom .e-drp-btn, .e-split .e-splitarrowtop .e-splitbutton,
        .e-rte .e-rte-footer,
        .e-datetime-popup .e-time-popup {
            border-radius: @border-bottom-radius;
        }
    }

    .e-corner.e-tab > ul.e-addborderright .e-item, .e-corner.e-tab .e-addborderleft.e-content-item,
    .e-split .e-splitarrowleft .e-splitbutton.e-corner, .e-split .e-splitarrowright .e-corner + .e-drp-btn, .e-rtl.e-split .e-splitarrowright .e-splitbutton.e-corner, .e-rtl.e-split .e-splitarrowleft .e-corner + .e-drp-btn {
        border-radius: 0 4px 4px 0;
    }

    .e-corner.e-tab > ul.e-addborderleft .e-item, .e-corner.e-tab .e-addborderright.e-content-item,
    .e-split .e-splitarrowright .e-splitbutton.e-corner, .e-split .e-splitarrowleft .e-corner + .e-drp-btn, .e-rtl.e-split .e-splitarrowleft .e-splitbutton.e-corner, .e-rtl.e-split .e-splitarrowright .e-corner + .e-drp-btn {
        border-radius: 4px 0 0 4px;
    }

    .e-acrdn.e-corner .e-select.e-active,
    .e-datepicker.e-popup.e-corner .e-header,
    .e-corner.e-tab > ul.e-addborderbottom .e-item, .e-corner.e-tab .e-addbordertop.e-content-item,
    .e-split .e-splitarrowtop .e-corner + .e-drp-btn, .e-split .e-splitarrowbottom .e-splitbutton.e-corner,
    .e-datetime-popup.e-corner .e-header {
        border-radius: 4px 4px 0 0;
    }

    .e-corner .e-acrdn-content-active,
    .e-corner.e-dialog-wrap .e-widget-content,
    .e-corner.e-tab > ul.e-addbordertop .e-item, .e-corner.e-tab .e-addborderbottom.e-content-item,
    .e-split .e-splitarrowbottom .e-corner + .e-drp-btn, .e-split .e-splitarrowtop .e-splitbutton.e-corner,
    .e-datetime-popup.e-corner .e-time-popup {
        border-radius: 0 0 4px 4px;
    }

    .border-radius(@radius) when not(@radius = 0px) {
        .e-progressbar .e-progress.e-complete {
            border-radius: @inner-border-radius;
        }

        .e-atc.e-rtl .e-in-wrap.e-padding .e-input, .e-atc .e-in-wrap.e-padding .e-select,
        .e-datewidget.e-rtl .e-in-wrap.e-padding .e-input, .e-datewidget .e-in-wrap.e-padding .e-select,
        .e-datetime-wrap.e-rtl .e-in-wrap.e-padding .e-input, .e-datetime-wrap .e-in-wrap.e-padding .e-select,
        .e-ddl.e-rtl .e-in-wrap .e-input, .e-ddl .e-in-wrap .e-select,
        .e-numeric.e-rtl .e-in-wrap.e-padding .e-input, .e-numeric .e-in-wrap.e-padding .e-select,
        .e-percent.e-rtl .e-in-wrap.e-padding .e-input, .e-percent .e-in-wrap.e-padding .e-select,
        .e-currency.e-rtl .e-in-wrap.e-padding .e-input, .e-currency .e-in-wrap.e-padding .e-select,
        .e-timewidget.e-rtl .e-in-wrap.e-padding .e-input, .e-timewidget .e-in-wrap.e-padding .e-select {
            border-radius: @inner-border-right-radius;
        }

        .e-atc .e-in-wrap.e-padding .e-input, .e-atc.e-rtl .e-in-wrap.e-padding .e-select,
        .e-datewidget .e-in-wrap.e-padding .e-input, .e-datewidget.e-rtl .e-in-wrap.e-padding .e-select,
        .e-datetime-wrap .e-in-wrap.e-padding .e-input, .e-datetime-wrap.e-rtl .e-in-wrap.e-padding .e-select,
        .e-ddl .e-in-wrap .e-input, .e-ddl.e-rtl .e-in-wrap .e-select,
        .e-numeric .e-in-wrap.e-padding .e-input, .e-numeric.e-rtl .e-in-wrap.e-padding .e-select,
        .e-percent .e-in-wrap.e-padding .e-input, .e-percent.e-rtl .e-in-wrap.e-padding .e-select,
        .e-currency .e-in-wrap.e-padding .e-input, .e-currency.e-rtl .e-in-wrap.e-padding .e-select,
        .e-timewidget .e-in-wrap.e-padding .e-input, .e-timewidget.e-rtl .e-in-wrap.e-padding .e-select,
        .e-progressbar .e-progress {
            border-radius: @inner-border-left-radius;
        }

        .e-dialog-wrap > .e-header {
            border-radius: @inner-border-top-radius;
        }
    }

    .e-listbox li {
        webkit-box-sizing: content-box;
        -moz-box-sizing: content-box;
        box-sizing: content-box;
    }

    .e-corner.e-progressbar .e-progress.e-complete {
        border-radius: 3px 3px 3px 3px;
    }

    .e-atc.e-rtl .e-corner.e-in-wrap.e-padding .e-input, .e-atc .e-corner.e-in-wrap.e-padding .e-select,
	.e-daterangewidget.e-rtl .e-corner.e-in-wrap.e-padding .e-input,.e-daterangewidget .e-corner.e-in-wrap.e-padding .e-select,
    .e-datewidget.e-rtl .e-corner.e-in-wrap.e-padding .e-input, .e-datewidget .e-corner.e-in-wrap.e-padding .e-select,
    .e-datetime-wrap.e-rtl .e-corner.e-in-wrap.e-padding .e-input, .e-datetime-wrap .e-corner.e-in-wrap.e-padding .e-select,
    .e-ddl.e-rtl .e-corner.e-in-wrap .e-input, .e-ddl .e-corner.e-in-wrap .e-select,
    .e-numeric.e-rtl .e-corner.e-in-wrap.e-padding .e-input, .e-numeric .e-corner.e-in-wrap.e-padding .e-select,
    .e-percent.e-rtl .e-corner.e-in-wrap.e-padding .e-input, .e-percent .e-corner.e-in-wrap.e-padding .e-select,
    .e-currency.e-rtl .e-corner.e-in-wrap.e-padding .e-input, .e-currency .e-corner.e-in-wrap.e-padding .e-select,
    .e-timewidget.e-rtl .e-corner.e-in-wrap.e-padding .e-input, .e-timewidget .e-corner.e-in-wrap.e-padding .e-select {
        border-radius: 0 3px 3px 0;
    }

    .e-atc .e-corner.e-in-wrap.e-padding .e-input, .e-atc.e-rtl .e-corner.e-in-wrap.e-padding .e-select,
    .e-datewidget .e-corner.e-in-wrap.e-padding .e-input, .e-datewidget.e-rtl .e-corner.e-in-wrap.e-padding .e-select,
	.e-daterangewidget .e-corner.e-in-wrap.e-padding .e-input,.e-daterangewidget .e-corner.e-in-wrap.e-padding .e-input,
    .e-datetime-wrap .e-corner.e-in-wrap.e-padding .e-input, .e-datetime-wrap.e-rtl .e-corner.e-in-wrap.e-padding .e-select,
    .e-ddl .e-corner.e-in-wrap .e-input, .e-ddl.e-rtl .e-corner.e-in-wrap .e-select,
    .e-numeric .e-corner.e-in-wrap.e-padding .e-input, .e-numeric.e-rtl .e-corner.e-in-wrap.e-padding .e-select,
    .e-percent .e-corner.e-in-wrap.e-padding .e-input, .e-percent.e-rtl .e-corner.e-in-wrap.e-padding .e-select,
    .e-currency .e-corner.e-in-wrap.e-padding .e-input, .e-currency.e-rtl .e-corner.e-in-wrap.e-padding .e-select,
    .e-timewidget .e-corner.e-in-wrap.e-padding .e-input, .e-timewidget.e-rtl .e-corner.e-in-wrap.e-padding .e-select,
    .e-corner.e-progressbar .e-progress {
        border-radius: 3px 0 0 3px;
    }

    .e-corner.e-dialog-wrap > .e-header {
        border-radius: 3px 3px 0 0;
    }

    input.e-input, input[type="text"].e-input, .e-input.e-placeholder, .e-ddl.e-widget .e-ul.e-boxes {
        -webkit-box-shadow: @box-shadow;
        box-shadow: @box-shadow;
    }

    .e-disable {
        opacity: .35;
        filter: Alpha(Opacity=35);
        background-image: none;
    }

    .e-corner-all {
        border-radius: 4px 4px 4px 4px;
    }

    .e-corner-top, .e-corner-left {
        -moz-border-radius-topleft: 4px;
        -webkit-border-top-left-radius: 4px;
        -khtml-border-top-left-radius: 4px;
        border-top-left-radius: 4px;
    }

    .e-corner-top, .e-corner-right {
        -moz-border-radius-topright: 4px;
        -webkit-border-top-right-radius: 4px;
        -khtml-border-top-right-radius: 4px;
        border-top-right-radius: 4px;
    }

    .e-corner-bottom, .e-corner-left {
        -moz-border-radius-topleft: 4px;
        -webkit-border-bottom-left-radius: 4px;
        -khtml-border-bottom-left-radius: 4px;
        border-bottom-left-radius: 4px;
    }

    .e-corner-bottom, .e-corner-right {
        -moz-border-radius-topright: 4px;
        -webkit-border-bottom-right-radius: 4px;
        -khtml-border-bottom-right-radius: 4px;
        border-bottom-right-radius: 4px;
    }

    .e-input, .e-tooltipbox, .e-btn, .e-time-popup, .e-datepicker.e-calendar, .e-menu, .e-uploadbox .e-file-name-txt, .e-uploadbox .e-selectpart,
    .e-uploadbox .e-uploadbtn, .e-waitpopup-pane .e-text, .e-tagcloud, .e-toolbar, .e-progressbar, .e-scale .e-tick .tick-value, .e-datetime-popup .e-dt-button, .e-grid, .e-ejinputtext, .e-pager,
    .e-fileexplorer, .e-textbox {
        font-family: @font-family;
        font-size: @font-size;
    }

    .e-menu, input.e-input, input[type="text"].e-input, .e-mask, .e-ul, .e-btn div, .e-tbtn.e-chkbx-hidden, .e-datepicker table, .e-datepicker table th, .e-datepicker table td,
    .e-menu.e-horizontal > .e-list, .e-menu.e-vertical > li.e-separator, .e-menu.e-context > li.e-separator, .e-tab.e-js > .e-header, .e-uploadbox .e-action-perform,
    .e-uploadbox .uploaddialog.e-dialog.e-dialog-content, .e-tagcloud .e-load, .e-scale, .e-select, .e-input.e-placeholder {
        margin: 0;
        padding: 0;
        outline: 0 none;
        line-height: normal;
    }

    .e-btn, .e-btn div, .e-datepicker .e-header .e-next, .e-datepicker .e-header .e-prev, .e-datepicker .e-header .e-text, .e-menu > .e-list > a > img, .e-menu > .e-list > span > img,
    .e-menu > .e-list > a > div, .e-menu > .e-list > span > div, .e-menu > .e-list > a > span, .e-menu > .e-list > span > span, .e-menu .e-list > a span.e-icon, .e-menu .e-list > span span.e-icon, .e-menu.e-horizontal > .e-list,
    .e-menu.e-vertical, .e-menu.e-context, .e-chkbox-wrap, .e-radiobtn-wrap, .e-chkbox-wrap div, .e-chkbox-wrap .e-text, .e-radiobtn-wrap .e-text,
    .e-tab.e-js > .e-header, .e-tab .e-header li, .e-tab .e-header li a, .e-dialog .e-dialog-icon, .e-dialog .e-icon, .e-uploadbox .e-selectpart, .e-uploadbox .e-file-list,
    .e-treeview .e-text, .e-tagcloud .e-cloud, .e-tagcloud .e-list, .e-tagcloud .e-cloud .e-tagitems, .e-h-scale .e-tick, .e-grid .e-groupheadercell,
    .e-grid .e-groupheadercell:hover, .e-pager, .e-pager .e-disableditem, .e-grid div.e-parentmsgbar, .e-grid .e-toolbaricons, .e-pager .e-pagercontainer {
        display: inline-block;
    }

    .e-ul {
        list-style-type: none;
    }

    input.e-input, input[type="text"].e-input, .e-input.e-placeholder {
        border: medium none;
        height: 100%;
        width: 100%;
        display: block;
        padding-left: 0.857em;
        line-height: 1.908em\9;
    }

    .e-rtl input.e-input, .e-rtl input[type="text"].e-input, .e-rtl .e-input.e-placeholder, .e-textbox.e-rtl {
        text-align: right;
        padding-left: 0;
        padding-right: 0.857em;
    }

    .e-in-wrap {
        display: block;
        height: 100%;
        position: relative;
        overflow: hidden;
        border: 1px solid;
    }

    .e-rtl {
        direction: rtl;
    }

    .e-widget, .e-widget [class^="e-"], .e-widget [class*=" e-"] {
        -webkit-box-sizing: content-box; /* Safari/Chrome, other WebKit */
        -moz-box-sizing: content-box; /* Firefox, other Gecko */
        box-sizing: content-box; /* Opera/IE 8+ */
    }

    .e-widget.e-box, .e-widget .e-box, .e-widget button.e-btn, button.e-btn.e-widget, input.e-btn.e-widget, input.e-input, input[type="text"].e-input, .e-input.e-placeholder, .e-widget input.e-input, .e-lv.e-js .e-header.e-box, .e-textbox {
        -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
        -moz-box-sizing: border-box; /* Firefox, other Gecko */
        box-sizing: border-box; /* Opera/IE 8+ */
    }
    .e-scheduledialog.e-dialog .e-dialog-scroller, .e-ss-dialog.e-dialog .e-dialog-scroller{
	    -webkit-box-sizing: content-box; /* Safari/Chrome, other WebKit */
        -moz-box-sizing: content-box; /* Firefox, other Gecko */
        box-sizing: content-box; /* Opera/IE 8+ */
	}
    .e-shadow {
        -moz-box-shadow: 0 0 9px rgba(0,0,0,.4);
        -webkit-box-shadow: 0 0 9px rgba(0,0,0,.4);
        box-shadow: 0 0 9px rgba(0,0,0,.4);
    }

    .e-overlay {
        background-color: gray;
        opacity: 0.5;
        filter: alpha(opacity= 50);
        width: 100%;
        height: 100%;
    }

    .e-tooltipbox {
        font-weight: 600;
        height: auto;
        padding: 2px;
        position: absolute;
        width: auto;
        min-width: 10px;
        text-align: center;
        z-index: 10000;
        border: 1px solid;
    }

    .e-input::-ms-clear {
        display: none;
    }

    .edge-browser ::-webkit-input-placeholder {
        opacity: 1 !important;
    }

    .e-input::-webkit-input-placeholder {
        .watermerk-style();
    }

    .e-input::-moz-placeholder {
        .watermerk-style();
    }

    .e-input:-moz-placeholder {
        .watermerk-style();
    }

    .e-input:-ms-input-placeholder {
        .watermerk-style();
    }

    .e-input.e-watermark {
        .watermerk-style();
    }

    .watermerk-style() {
        font-style: italic;
        opacity: 0.6;
        filter: alpha(opacity=60);
    }

    .e-widget .e-input.e-placeholder {
        top: 0;
        font-style: italic;
        position: absolute;
        color: #BBBBBB;
        white-space: nowrap;
    }

    .e-textbox {
        height: @input-height;
        width: 100%;
        padding-left: 0.857em;
        line-height: 1.908em\9;
        outline: medium none;
    }

    .e-pinch {
        -ms-touch-action: pinch-zoom;
        touch-action: pinch-zoom;
    }

    .e-pan-x {
        -ms-touch-action: pinch-zoom pan-x;
        touch-action: pinch-zoom pan-x;
    }

    .e-pan-y {
        -ms-touch-action: pinch-zoom pan-y;
        touch-action: pinch-zoom pan-y;
    }
}

.mixin(@widget) when (@widget = tooltip), (@widget = none) {

    .e-tooltip-wrap {
        display: none;
        position: absolute;
        max-width: 350px;
        min-width: 50px;
        visibility: visible;
        padding: 0px;
    }

    .e-tooltip-wrap .e-arrowTip {
        height: 10px;
        left: 50%;
        top: 100%;
        overflow: hidden;
        position: absolute;
        width: 20px;
    }

    .e-tooltip-wrap .e-tipContainer {
        position: relative;
        overflow: hidden;
    }

    .e-tooltipShadowLeft {
        box-shadow: 4px 4px 4px 0px rgba(0,0,0,0.06);
    }

    .e-tooltipShadowRight {
        box-shadow: -4px -4px 4px 0px rgba(0,0,0,0.06);
    }

    .e-tooltip-wrap .e-tipContainer .e-tooltipHeader {
        position: relative;
        padding: 5px 7px 5px 7px;
        overflow: hidden;
        display: block;
    }

    .e-tooltip-wrap .e-tipContainer .e-header {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        font-weight: bold;
        font-size: 15px;
        float: left;
    }

    .e-tooltip-wrap .e-tipContainer .e-tooltipHeader .e-tooltipTitle {
        font-weight: bold;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .e-tooltip-wrap .e-tipContainer .e-tooltipHeader .e-close:before {
        content: "\e6f7";
    }

    .e-tooltip-wrap .e-cross-circle:before {
        content: "\e60a";
        color: #474747;
    }

    .e-tooltip-wrap .e-cross-circle {
        top: -9px;
        right: -9px;
        float: right;
        position: absolute;
    }

    .e-tooltip-wrap .e-tipContainer .e-tooltipHeader .e-close {
        float: right;
        padding: 5px;
    }

    .e-def {
        word-wrap: break-word;
    }

    .e-tooltip-wrap .e-tipContainer .e-tipcontent {
        padding: 5px 7px;
    }

    .e-tooltip-wrap .e-corner {
        border-radius: 2px 2px 2px 2px;
    }

    .e-disable {
        opacity: 0.35;
        filter: alpha(opacity=35);
        background-image: none;
    }

    .e-rtl {
        direction: rtl;
    }
}

.mixin(@widget) when (@widget = button), (@widget = none) {

    .e-btn {
        cursor: pointer;
        overflow: hidden;
        text-align: center;
        text-decoration: none;
        border: medium none;
        box-shadow: @button-box-shadow;
    }

    .e-btn.e-select {
        border: 1px solid;
    }

    .e-btn, .e-btn div {
        vertical-align: middle;
        border-spacing: 0;
    }

    .e-btn .e-icon, .e-split-btn-div .e-icon {
        display: table-cell;
        padding: 4px 3px;
        visibility: visible;
        vertical-align: middle;
    }

    .e-btn.e-txt {
        padding: 0.1em 0.4em 0.3em;
    }

    .e-btn .e-btntxt {
        width: auto;
        cursor: default;
        display: table-cell;
        vertical-align: middle;
        line-height: normal;
        padding: 0.1em 0.15em 0.3em;
    }

    .e-btn.e-btn-mini {
        height: 28px;
        width: 63px;
        font-size: 12px;
    }

    .e-btn.e-btn-small {
        height: 32px;
        width: 89px;
        font-size: 13px;
    }

    .e-btn.e-btn-medium {
        height: 36px;
        width: 113px;
        font-size: 14px;
    }

    .e-btn.e-btn-large {
        height: 40px;
        width: 130px;
        font-size: 15px;
    }

    .e-btn.e-btn-normal {
        height: @button-height;
    }

    .e-tbtn-wrap {
        display: block;
    }

    .e-tbtn.e-chkbx-hidden {
        border: 0 none;
        height: 1px;
        margin: -1px;
        overflow: hidden;
        position: absolute;
        width: 1px;
        opacity: 0;
        filter: Alpha(Opacity=0);
    }

    .e-tbtn-wrap label {
        cursor: pointer;
        display: block;
        font-weight: normal;
        margin-bottom: 0;
    }

    .e-split {
        display: block;
        position: relative;
        margin: 0;
        overflow: hidden;
    }

    .e-split.e-btnrtl {
        padding: 0;
    }

    .e-split-btn, .e-split-btn.e-left-btn {
        height: 100%;
    }

    .e-split-btn.e-btn-txt {
        width: 24px;
        height: 100%;
    }

    .e-split-btn.e-left-btn {
        width: 100%;
    }

    .e-split-btn.e-rht-btn {
        width: 24px;
        height: 100%;
    }

    .e-split-btn.e-drp-btn {
        float: left;
        position: absolute;
    }

    .e-split-btn-div .e-icon {
        height: 12px;
        width: 12px;
        font-size: 10px;
    }

    .e-split .e-in-wrap {
        border: none;
    }

    .e-split .e-padding {
        padding: 0 24px 0 0;
    }

    .e-split.e-rtl .e-padding {
        padding: 0 0 0 24px;
    }

    .e-split.e-drop .e-padding {
        padding: 0;
    }

    .e-split .e-padding.e-splitarrowleft, .e-split.e-rtl .e-padding.e-splitarrowright {
        padding: 0 0 0 24px;
    }

    .e-split.e-rtl .e-padding.e-splitarrowleft, .e-split .e-padding.e-splitarrowright {
        padding: 0 24px 0 0;
    }

    .e-splitarrowleft .e-split-btn.e-rht-btn, .e-splitarrowleft .e-split-btn.e-btn-txt {
        width: 24px;
        height: 100%;
        left: 0;
    }

    .e-splitarrowleft .e-split-btn.e-left-btn {
        border-left: medium none;
    }

    .e-rtl .e-splitarrowleft .e-split-btn.e-rht-btn, .e-rtl .e-splitarrowleft .e-split-btn.e-btn-txt {
        right: 0;
    }

    .e-splitarrowright .e-split-btn.e-rht-btn, .e-splitarrowright .e-split-btn.e-btn-txt {
        width: 24px;
        height: 100%;
    }

    .e-splitarrowright .e-split-btn.e-left-btn {
        border-right: medium none;
    }

    .e-rtl .e-splitarrowright .e-split-btn.e-rht-btn, .e-rtl .e-splitarrowright .e-split-btn.e-btn-txt {
        left: 0;
    }

    .e-split .e-padding.e-splitarrowbottom {
        padding: 0 0 24px 0;
    }

    .e-splitarrowbottom .e-split-btn.e-rht-btn, .e-splitarrowbottom .e-split-btn.e-btn-txt {
        height: 24px;
        width: 100%;
        bottom: 0;
        left: 0;
    }

    .e-splitarrowbottom .e-split-btn.e-left-btn {
        border-bottom: medium none;
    }

    .e-split .e-padding.e-splitarrowtop {
        padding: 24px 0 0 0;
    }

    .e-splitarrowtop .e-split-btn.e-rht-btn, .e-splitarrowtop .e-split-btn.e-btn-txt {
        height: 24px;
        width: 100%;
        top: 0;
        left: 0;
    }

    .e-splitarrowtop .e-split-btn.e-left-btn {
        border-top: medium none;
    }

    .e-split.e-drop .e-droparrowleft, .e-split.e-drop.e-rtl .e-droparrowright {
        padding: 0 0 0 15px;
    }

    .e-split.e-drop.e-rtl .e-droparrowleft, .e-split.e-drop .e-droparrowright {
        padding: 0 15px 0 0;
    }

    .e-droparrowleft .e-split-btn-div {
        left: 0;
        top: 50%;
        margin-top: -10px;
    }

    .e-rtl .e-droparrowleft .e-split-btn-div {
        right: 0;
        left: auto;
        top: 50%;
        margin-top: -10px;
    }

    .e-droparrowright .e-split-btn-div {
        right: 0;
        top: 50%;
        margin-top: -10px;
    }

    .e-rtl .e-droparrowright .e-split-btn-div {
        left: 0;
        right: auto;
        top: 50%;
        margin-top: -10px;
    }

    .e-split.e-drop .e-droparrowbottom {
        padding: 0 0 15px 0;
    }

    .e-droparrowbottom .e-split-btn-div {
        bottom: 0;
        left: 50%;
        margin-left: -10px;
    }

    .e-split.e-drop .e-droparrowtop {
        padding: 10px 0 0 0;
    }

    .e-droparrowtop .e-split-btn-div {
        top: 0;
        left: 50%;
        margin-left: -10px;
    }

    .e-split.e-menu {
        border-radius: 0px;
        box-shadow: @box-shadow;
    }

    .e-split.e-menu.e-corner{
        border-radius:4px;
    }

    .e-split.e-context, .e-split.e-context li.e-list.e-haschild {
        overflow: visible;
    }

    .e-split.e-context li.e-list, .e-split.e-context li.e-list.e-haschild span {
        overflow: hidden;
    }
}

.mixin(@widget) when (@widget = editor), (@widget = none) {

    .e-numeric.e-error .e-in-wrap, .e-percent.e-error .e-in-wrap, .e-currency.e-error .e-in-wrap {
        border-color: #FF0000;
    }

    .e-numeric, .e-percent, .e-currency, .e-mask {
        display: block;
        overflow: visible;
        width: 143px;
        height: @input-height;
    }

    .e-numeric .e-spin, .e-percent .e-spin, .e-currency .e-spin {
        position: absolute;
        right: 0;
        border: 0 none;
        cursor: pointer;
    }

    .e-numeric .e-spin-up, .e-numeric .e-spin-down, .e-percent .e-spin-up, .e-percent .e-spin-down, .e-currency .e-spin-up, .e-currency .e-spin-down {
        display: block;
        height: 50%;
        width: 100%;
    }

    .e-numeric .e-spin-up, .e-percent .e-spin-up, .e-currency .e-spin-up {
        top: 0;
    }

    .e-numeric .e-spin-down, .e-percent .e-spin-down, .e-currency .e-spin-down {
        bottom: 0;
    }

    .e-numeric .e-padding, .e-percent .e-padding, .e-currency .e-padding {
        padding: 0 24px 0 0;
    }

    .e-numeric .e-icon, .e-percent .e-icon, .e-currency .e-icon {
        display: block;
        width: 100%;
        position: absolute;
        top: 50%;
    }

    .e-numeric .e-icon, .e-percent .e-icon, .e-currency .e-icon {
        height: 8px;
        margin-top: -4px;
        font-size: 10px;
    }

    .e-numeric .e-select, .e-percent .e-select, .e-currency .e-select, .e-mask .e-select {
        cursor: pointer;
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        width: 23px;
        height: 100%;
        text-align: left;
        border-left: 1px solid;
    }

    .e-numeric.e-rtl .e-select, .e-percent.e-rtl .e-select, .e-currency.e-rtl .e-select, .e-mask.e-rtl .e-select {
        border-right: 1px solid;
        border-left: none;
    }

    .e-numeric.e-rtl .e-in-wrap.e-padding, .e-percent.e-rtl .e-in-wrap.e-padding, .e-currency.e-rtl .e-in-wrap.e-padding {
        padding: 0 0 0 24px;
    }
}

.mixin(@widget) when (@widget = autocomplete), (@widget = none) {

    .e-atc {
        display: block;
        overflow: visible;
        width: 143px;
        height: @input-height;
    }

    .e-atc .e-padding {
        padding: 0 24px 0 0;
    }

    .e-atc .e-icon {
        display: block;
        width: 100%;
        position: absolute;
        top: 50%;
    }

    .e-atc .e-select {
        cursor: pointer;
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        width: 23px;
        height: 100%;
        text-align: left;
        border-left: 1px solid;
    }

    .e-atc.e-rtl .e-select {
        border-right: 1px solid;
        border-left: none;
    }

    .e-atc .e-in-wrap .e-iclose:before {
        content: "\e60a";
        width: 18px;
        right: 0px;
        color: #c8c8c8;
        font-size: 20px;
        margin-top: 4px;
        display: block;
    }

    .e-atc.e-rtl .e-in-wrap .e-iclose:before {
        width: 0px;
    }


    .e-atc .e-in-wrap .e-iclose {
        width: 14px;
        right: 10px;
        box-sizing: content-box;
        backface-visibility: hidden;
    }


    .e-atc .e-popup .e-iclose:before {
        float: right;
        padding-right: 45px;
    }



    .e-atc.e-rtl .e-popup .e-iclose:before {
        float: left;
        padding-left: 35px;
    }

    .e-atc .e-in-wrap .e-iclose {
        width: 24px;
        right: 0px;
        box-sizing: content-box;
        backface-visibility: hidden;
        top: 7px;
        height: inherit;
        vertical-align: middle;
    }



    .e-atc .e-reset .e-input {
        padding: 0 20px 0 7px;
    }

    .e-rtl .e-in-wrap.e-reset .e-input {
        padding: 0 7px 0 20px;
    }


    .e-atc.e-rtl .e-in-wrap .e-iclose {
        right: auto;
        left: 0;
        padding-left: 10px;
    }

    .e-atc.e-rtl .e-padding {
        padding: 0 0 0 24px;
    }

    .e-atc-popup {
        cursor: default;
        overflow: auto;
        position: absolute;
        border: 1px solid;
        outline: 0 none;
    }

    .e-atc-popup .e-hilight-txt {
        font-weight: bold;
    }

    .e-atc-popup ul li.e-category {
        font-weight: bold;
    }

    .e-atc-popup.e-rtl ul li.e-category {
        margin: 0 0.857em 0 0;
        padding: 5px 0 5px 5px;
    }

    .e-atc-popup ul li {
        padding: 5px 5px 5px 0.857em;
        min-height: 1.3em;
		white-space: nowrap;
    }

    .e-atc-popup.e-rtl ul li {
        padding: 5px 0.857em 5px 5px;
    }

    .e-atc .e-input.e-load {
        background-position: right center;
        background-repeat: no-repeat;
    }

    .e-atc.e-rtl .e-input.e-load {
        background-position: left center;
    }

    .e-atc .e-icon {
        height: 14px;
        margin-top: -7px;
    }

    .e-atc .e-options {
        border: 1px solid;
        border-radius: 4px;
        cursor: default;
        display: inline-block;
        float: left;
        margin: 2px 0 2px 2px;
        padding: @visual-mode-padding;
        position: relative;
    }

    .e-atc.e-rtl .e-options {
        margin: 2px 2px 2px 0;
        padding: @visual-mode-rtl-padding;
        float: right;
    }

    .e-atc .e-visual-mode.e-input {
        display: inline-block;
        max-width: 99%;
        text-indent: 0;
        float: left;
        height: @input-height - 2px;
        margin: 0 0 0 2px;
        padding-left: 0;
        box-shadow: none;
    }

    .e-atc.e-rtl .e-visual-mode.e-input {
        float: right;
        margin: 0 2px 0 0;
    }

    .e-atc .e-options .e-icon.e-close {
        font-size: 10px;
        cursor: pointer;
        height: 10px;
        margin-top: -5px;
        right: 4px;
        width: 10px;
        opacity: 0.75;
    }

    .e-atc .e-options .e-icon.e-close:hover {
        opacity: 1;
    }

    .e-atc.e-rtl .e-options .e-icon.e-close {
        left: 4px;
        right: auto;
    }

    .e-atc-popup .e-atc-tableContent tr td, .e-atc-popup .e-atc-tableHeaderContent th {
        padding: 5px 5px 5px .857em;
        min-height: 1.3em;
        white-space: nowrap;
    }

    .e-atc-popup .e-atc-tableContent, .e-atc-popup div.e-atc-tableHeader table {
        table-layout: fixed;
    }

    .e-atc-popup div.e-atc-tableHeaderScroll {
        padding-right: 19px;
    }

    .e-atc-popup div.e-atc-tableHeaderRTL {
        padding-left: 19px;
    }

    .e-atc-popup div.e-atc-tableHeader {
        table-layout: fixed;
        border-collapse: separate;
        margin-top: 0;
        border-spacing: 0;
        overflow: hidden;
        vertical-align: middle;
        clear: right;
    }

    .e-atc-popup div.e-atc-tableHeaderContent {
        overflow: hidden;
    }
     .e-atc .e-boxes.e-disable {
        pointer-events: none;
    }
}

.mixin(@widget) when (@widget = dropdownlist), (@widget = none) {

    .e-ddl {
        display: block;
        overflow: visible;
        width: 143px;
        height: @input-height;
        outline: 0 none;
    }

    .e-ddl .e-in-wrap {
        padding: 0 24px 0 0;
    }

    .e-ddl .e-icon {
        display: block;
        width: 100%;
        position: absolute;
        top: 50%;
    }

    .e-ddl .e-select {
        cursor: pointer;
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        width: 23px;
        height: 100%;
        text-align: left;
        border-left: 1px solid;
    }

    .e-ddl.e-rtl .e-select {
        border-right: 1px solid;
        border-left: none;
    }

    .e-ddl.e-rtl .e-in-wrap {
        padding: 0 0 0 24px;
    }

    .e-ddl-popup {
        cursor: default;
        overflow: auto;
        position: absolute;
        border: 1px solid;
        outline: 0 none;
    }

    .e-ddl-popup div > ul li, .e-ddl-popup div > .e-listbox li {
        padding: 5px 5px 5px 0.857em;
        min-height: 1.3em;
        line-height: 1.4;
    }

    .e-ddl-popup.e-rtl div > ul li {
        padding: 5px 0.857em 5px 5px;
    }

    .e-ddl .e-options {
        border: 1px solid;
        border-radius: 4px;
        cursor: default;
        display: inline-block;
        float: left;
        margin: 2px 0 2px 2px;
        padding: @visual-mode-padding;
        position: relative;
    }

    .e-ddl .e-input {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .e-ddl.e-rtl .e-options {
        margin: 2px 2px 2px 0;
        padding: @visual-mode-rtl-padding;
        float: right;
    }

    .e-ddl .e-options .e-icon.e-close {
        font-size: 10px;
        cursor: pointer;
        height: 10px;
        margin-top: -5px;
        right: 4px;
        width: 10px;
        opacity: 0.75;
    }

    .e-ddl .e-options .e-icon.e-close:hover {
        opacity: 1;
    }

    .e-ddl.e-rtl .e-options .e-icon.e-close {
        left: 4px;
        right: auto;
    }

    .e-ddl.e-rtl .e-in-wrap .e-select {
        border-left: 0 none;
        text-align: right;
    }

    .e-ddl-popup.e-atc-popup.e-rtl ul li.e-category {
        margin: 0;
        padding: 5px 0.857em 5px 5px;
    }

    .e-ddl-popup div > ul li {
        vertical-align: middle;
    }

    .e-ddl .e-in-wrap .e-select.e-load {
        background-position: center center;
        background-repeat: no-repeat;
        opacity: 0.35;
        filter: alphaa(opacity=35);
    }

    .e-ddl-popup div > ul li .e-align {
        float: left;
        vertical-align: middle;
    }

    .e-ddl-popup.e-rtl div > ul li .e-align {
        float: right;
    }

    .e-ejinputtext {
        padding-right: 4px;
        text-indent: 10px;
    }

    .e-ddl-popup .e-atc.e-search {
        width: 100%;
        height: 36px;
        border-bottom: 1px solid;
        position: relative;
    }

    .e-ddl-popup .e-atc.e-search .e-in-wrap {
        margin: 8px;
        height: 28px;
        position: relative;
    }

    .e-ddl-popup .e-atc.e-search .e-search, .e-ddl-popup .e-atc.e-search .e-cross-circle {
        width: 14px;
        right: 10px;
    }

    .e-ddl-popup .e-atc.e-search .e-input {
        padding: 0 20px 0 7px;
    }

    .e-ddl-popup .e-atc.e-search .e-search:before {
        content: "\e66e";
        font-size: 20px;
        margin-top: -3px;
    }

    .e-ddl-popup .e-atc.e-search .e-cross-circle:before {
        content: "\e60a";
        font-size: 20px;
        margin-top: -3px;
    }

    .e-ddl .e-icon {
        font-size: 12px;
        height: 12px;
        margin-top: -6px;
    }

    .e-ddl-popup.e-rtl .e-atc.e-search .e-input {
        padding: 0 7px 0 20px;
    }

    .e-ddl-popup.e-rtl .e-atc.e-search .e-search, .e-ddl-popup.e-rtl .e-atc.e-search .e-cross-circle {
        right: auto;
        left: 0;
        padding-left: 10px;
    }

    .e-ddl-popup.e-rtl .e-atc.e-search .e-search:before {
        -ms-transform: rotate(60deg); /* IE 9 */
        -webkit-transform: rotate(60deg); /* Chrome, Safari, Opera */
        transform: rotate(60deg);
        margin-top: 0;
    }

    .e-ddl-popup .e-checkwrap {
        height: 14px;
        width: 14px;
        cursor: pointer;
        margin-right: 10px;
        position: relative;
        top: 3px;
        font-size: 12px;
        z-index: 2;
        text-align: left;
    }

    .e-ddl-popup .e-check-act:before {
        content: "\e657";
        width: 100%;
        height: 100%;
        left: 1px;
        position: absolute;
        top: 1px;
    }

    .e-ddl-popup .e-check-input {
        display: none;
    }

    .e-ddl-popup.e-rtl .e-checkwrap {
        margin: 0 0 0 10px;
    }

    .e-ddl-popup .e-ddltxt, .e-ddl-popup .e-checkwrap {
        display: inline-block;
    }
}

.e-ddl-popup.e-rtl div > ul li .e-chkbox-wrap {
    padding-left: 10px;
    padding-right: 0px;
}

.e-ddl-popup div > ul li .e-chkbox-wrap {
    padding-right: 10px;
}

.mixin(@widget) when (@widget = timepicker), (@widget = none) {

    .e-timewidget {
        display: block;
        overflow: visible;
        width: 143px;
        height: @input-height;
    }

    .e-timewidget .e-padding {
        padding: 0 24px 0 0;
    }

    .e-timewidget .e-icon {
        display: block;
        width: 100%;
        position: absolute;
        top: 50%;
    }

    .e-timewidget .e-select {
        cursor: pointer;
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        width: 23px;
        height: 100%;
        text-align: left;
        border-left: 1px solid;
    }

    .e-timewidget.e-rtl .e-select {
        border-right: 1px solid;
        border-left: none;
    }

    .e-timewidget.e-rtl .e-padding {
        padding: 0 0 0 24px;
    }

    .e-time-popup {
        cursor: default;
        position: absolute;
        border: 1px solid;
        outline: 0 none;
    }

    .e-timewidget .e-input {
        letter-spacing: 1px;
    }

    .e-timewidget .e-icon {
        font-size: 12px;
        height: 12px;
        margin-top: -6px;
    }

    .e-time-popup {
        font-weight: @content-font-weight;
        letter-spacing: 1px;
    }

    .e-time-popup ul li {
        padding: 2px 2px 2px 0.857em;
    }

    .e-time-popup.e-rtl ul li {
        padding: 2px 0.857em 2px 2px;
    }

    .e-timewidget.e-error .e-in-wrap {
        border-color: #FF0000;
    }
}

.mixin(@widget) when (@widget = datepicker), (@widget = none) {

    .e-datewidget.e-error .e-in-wrap {
        border-color: #FF0000;
    }

    .e-datewidget {
        display: block;
        overflow: visible;
        width: 143px;
        height: @input-height;
    }

    .e-datewidget .e-padding {
        padding: 0 24px 0 0;
    }

    .e-datewidget .e-icon {
        display: block;
        width: 100%;
        position: absolute;
        top: 50%;
    }

    .e-datewidget .e-select {
        cursor: pointer;
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        width: 23px;
        height: 100%;
        text-align: left;
        border-left: 1px solid;
    }

    .e-datewidget.e-rtl .e-select {
        border-right: 1px solid;
        border-left: none;
    }

    .e-datewidget.e-rtl .e-in-wrap.e-padding {
        padding: 0 0 0 24px;
    }

    .e-datewidget .e-icon {
        font-size: 21px;
        height: 21px;
        margin-top: -11px;
    }

    .e-datepicker .e-datepicker-months td, .e-datepicker .e-datepicker-years td, .e-datepicker .e-datepicker-allyears td {
        height: 45px;
    }

    .e-datepicker .e-datepicker-months, .e-datepicker .e-datepicker-years, .e-datepicker .e-datepicker-allyears {
        width: 100%;
    }

    .e-datepicker.e-calendar {
        overflow: hidden;
        border: 1px solid;
        box-shadow: @box-shadow;
    }

    .e-datepicker.e-calendar .e-header, .e-datetime-popup .e-timecontainer .e-header {
        text-align: center;
        height: 30px;
        line-height: 29px;
    }

    .e-datepicker .e-header .e-next, .e-datepicker .e-header .e-prev {
        cursor: pointer;
        position: relative;
        top: 2px;
    }

    .e-datepicker .e-week-header {
        height: 35px;
    }

    .e-datepicker .e-icon {
        height: 18px;
        width: 18px;
        padding: 0px;
    }

    .e-datepicker .e-header .e-icon:before {
        top: 2px;
        left: 2px;
        position: absolute;
    }

    .e-datepicker .e-datepicker-days .e-state-default {
        height: 26px;
        border: 0 none;
    }

    .e-datepicker .e-icon.e-arrow-sans-left {
        float: left;
    }

    .e-datepicker .e-icon.e-arrow-sans-right {
        float: right;
    }

    .e-datepicker .e-icon.e-arrow-sans-right:before {
        left: 4px;
    }

    .e-datepicker.e-rtl .e-header .e-next {
        right: -10px;
    }

    .e-datepicker .e-header .e-next {
        right: 5px;
    }

    .e-datepicker.e-rtl .e-header .e-prev {
        left: -10px;
    }

    .e-datepicker .e-header .e-prev {
        left: 5px;
    }

    .e-datepicker .e-header .e-text {
        cursor: pointer;
        text-align: center;
        width: 83%;
    }

    .e-datepicker .e-header .e-text .e-datepicker-headertext {
        padding: 2px 7px 3px 8px;
        border-radius: 4px;
    }

    .e-datepicker .e-header a:hover, .e-datepicker .e-header a:focus {
        text-decoration: none;
        padding: 0px;
    }

    .e-datepicker .e-footer {
        text-align: center;
        cursor: pointer;
        padding: 3px;
        margin: 3px 0px 0px;
    }

    .e-datepicker .e-hide-date, .e-datepicker table td.e-disable > span.e-image {
        opacity: 0.34;
    }

    .e-datepicker table {
        border-collapse: collapse;
        border-style: none;
        position: relative;
        table-layout: fixed;
        *table-layout: auto;
        text-align: center;
        width: 100%;
    }

    .e-datepicker table th {
        cursor: default;
        font-weight: @content-font-weight;
        text-align: center;
        background: transparent;
        border: 0 none;
        font-size: inherit;
        vertical-align: middle;
    }

    .e-datepicker table td {
        cursor: pointer;
        border: medium none;
        vertical-align: middle;
        text-align: center;
    }

    .e-datepicker .e-dp-viewdays .e-current-month:hover {
        border-radius: 4px;
    }

    .e-rtl .e-select {
        right: auto;
        left: 0;
    }

    .e-datepicker.e-icons table .e-datepicker-days td, .e-datepicker.e-icons table th {
        text-align: right;
        padding-right: 10px;
    }

    .flag .e-image, .e-special-day .e-image {
        display: inline-block;
        margin-right: 3px;
        vertical-align: text-top;
    }

    .e-datepicker.e-calendar {
        width: 18em;
        position: absolute;
    }

    .e-datepicker.e-calendar.e-inline {
        position: static;
    }

    .e-datepicker.e-calendar.e-headerlong {
        width: 35em;
    }

    .e-datepicker table .e-datepicker-days td.e-state-default.e-week-end {
        font-weight: bold;
    }

    .e-selected-week, .e-selected-month {
        border-radius: 4px;
    }

    .e-datepicker .e-special-date-icon {
        width: 12px;
        height: 12px;
        display: inline-block;
        margin-right: 3px;
    }

    .e-datepicker.e-popup.e-disable table td,
    .e-datepicker.e-popup.e-disable .e-footer,
    .e-datepicker.e-popup.e-disable .e-header .e-text,
    .e-datepicker.e-popup.e-disable .e-header .e-next,
    .e-datepicker.e-popup.e-disable .e-header .e-prev,
     .e-daterangewidget .e-select.e-disable,.e-daterangewidget .e-select.e-disable .e-icon,
    .e-datewidget .e-select.e-disable, .e-datewidget .e-select.e-disable .e-icon {
        cursor: default;
    }
}
.mixin(@widget) when (@widget = daterangepicker), (@widget = none) {
		.e-daterangewidget.e-error .e-in-wrap {
		border-color: red;
		}
		.e-daterangewidget {
		display: block;
		overflow: visible;
		width: 143px;
		height: 30px;
		}
		.e-daterangewidget .e-padding {
		padding: 0 24px 0 0;
		}
		.e-daterangewidget .e-icon {
		display: block;
		position: absolute;
		top: 50%;
		font-size: 21px;
		height: 21px;
		margin-top: -11px;
		}
		.e-daterangewidget .e-select {
		cursor: pointer;
		display: block;
		position: absolute;
		top: 0;
		right: 0;
		width: 23px;
		height: 100%;
		text-align: left;
		border-left: 1px solid;
		}
		.e-daterangewidget.e-rtl .e-select {
		border-right: 1px solid;
		border-left: none;
		}
		.e-daterangewidget.e-rtl .e-in-wrap.e-padding{
		padding: 0 0 0 24px;
		}
		.e-daterangepicker-popup {
		display:inline-block;
		width:auto;
		box-sizing:content-box;
		position:absolute;
		}

		.e-daterangepicker-popup .e-datepicker .e-datepicker-days .e-state-default.e-state-hover,
		.e-daterangepicker-popup .e-datepicker .e-datepicker-days .e-state-default.today

		{
		border-radius:1px;

		}

		.e-daterangepicker-popup .e-custom-dateranges {
		width:auto;
		float:right;
		font-size:13px;
		-webkit-user-select: none; 
       -moz-user-select: none; 
        -ms-user-select: none; 
            user-select: none; 
		}
		.e-daterangepicker-popup  .e-datepickers-popup {
		display:inline-block;
		}
		.e-daterangepicker-popup  .e-right-datepicker {
		float:right;
		padding-right:5px;
		}
		.e-daterangepicker-popup  .e-left-datepicker {
		display:inline-block;
		}
		.e-daterangepicker-popup  .e-left-datepicker, .e-daterangepicker-popup  .e-right-datepicker {
		padding-left:5px;
		padding-top:5px;

		}
		.e-daterangepicker-popup  .e-left-datepicker .e-calendar, .e-daterangepicker-popup  .e-right-datepicker .e-calendar {
		padding-top:5px;
		-webkit-user-select: none; 
       -moz-user-select: none; 
        -ms-user-select: none; 
            user-select: none; 
		}
		.e-daterangepicker-popup  .e-left-datepicker .e-timewidget, .e-daterangepicker-popup  .e-right-datepicker .e-timewidget{
		float:right;
		padding-top:5px;
		-webkit-user-select: none; 
       -moz-user-select: none; 
        -ms-user-select: none; 
            user-select: none; 
		}
		
		.e-daterangepicker-popup .e-datepicker.e-popup.e-calendar {
		border:none;
		}
		.e-daterangepicker-popup .e-datepicker .e-header {
		border:none;
		}
		.e-daterangepicker-popup .e-datepicker .e-dp-viewdays 
		{
		border-collapse:separate;
		border-spacing:0 2px;
		}
		.e-datepickers-popup {
		display:inline-flex;
		}
		.e-daterangepicker-popup .e-datepicker .e-datepicker-days .e-state-default{
		height:30px;

		}
		.e-daterangepicker-popup .e-datepicker .e-datepicker-days .e-state-default.in-range:hover
		{
		border-radius:1px;
		}
		.e-daterangepicker-popup .e-datepicker .e-datepicker-days .e-state-default.e-start-date,
		.e-daterangepicker-popup .e-datepicker .e-datepicker-days .e-state-default.e-end-date

		{
		border-radius:24px !important;
		}
		.e-daterangepicker-popup .e-datepicker .e-datepicker-days .e-state-default:hover {
		font-weight:600;

		}
		.e-dateranges {
		height:104px;
		width:100px;

		}
        .e-daterange-timepopup.e-time-popup {
            font-size:13px;
        }
		.e-daterangepicker-popup .e-custom-dateranges ul {
		padding:0;
		margin-top:0;
		}
		.e-custom-dateranges li {
		cursor: pointer;
		list-style: none;
		line-height: 30px;
		padding: 0 10px 0 10px;
		margin: 5px;
		overflow: hidden;
        white-space: nowrap;
        max-width: 200px;
		-ms-text-overflow: ellipsis;
        -o-text-overflow: ellipsis;
        text-overflow: ellipsis;
		}
		.e-daterangepicker-popup .e-datepicker .e-datepicker-days  td.e-state-default.in-range:last-child , 
		.e-daterangepicker-popup .e-datepicker .e-datepicker-days  td.e-state-default.in-range:last-child :hover{
			border-bottom-right-radius: 12px;
			border-top-right-radius: 12px;
		}
		.e-daterangepicker-popup .e-datepicker .e-datepicker-days  td.e-state-default.in-range:first-child , 
		.e-daterangepicker-popup .e-datepicker .e-datepicker-days  td.e-state-default.in-range:last-child :hover{
			border-bottom-left-radius: 12px;
			border-top-left-radius: 12px;
		}

		/*apply buttons*/
		.e-daterangepicker-popup .e-drp-button {
		float: right;
		display: inline-block;
		text-align: center;
		cursor: pointer;
		border: 1px solid;
		margin-left: 10px;
		padding: 4px 16px;
		margin: 5px 5px 5px 5px;
		font-size:13px;
		}
		.e-daterangepicker-popup .e-drpbuttons div {
            overflow: hidden;
            white-space: nowrap;
            max-width: 100px;
            -ms-text-overflow: ellipsis;
            -o-text-overflow: ellipsis;
            text-overflow: ellipsis;
			-webkit-user-select: none; 
       -moz-user-select: none; 
        -ms-user-select: none; 
            user-select: none; 
            border-radius:@border-radius;
        }

		.e-daterangepicker-popup .e-drp-button.e-drp-reset {
		float:left;
		}
		.e-daterangepicker-popup .e-drp-button.e-drp-apply, .e-daterangepicker-popup .e-drp-button.e-drp-cancel {
		margin-left: 0;
		}

		/* responsive css*/
		.e-daterange-responsive {
			display: block;
		}

		.e-daterange-responsive .e-datepickers-popup {
			width: 100%;
			display:block;
		}
		.e-daterange-responsive .e-datepickers-popup > div {
			width:100%;
			display:block;
			padding:0;
		}
		.e-daterange-responsive .e-datepickers-popup .e-datewidget{
			padding:5px;
			width:95%
		}
		.e-daterange-responsive .e-drpbuttons {
		display:block;
		width:100%;
		float:none;
        max-width:200px;
		}
		.e-daterange-responsive .e-custom-dateranges  {
		width:100%;
		border-top:1px solid;
		}
		.e-daterange-responsive .e-drpbuttons div {
					max-width: 40px;
				}

	
}

.mixin(@widget) when (@widget = menu), (@widget = none) {

    .e-menu {
        font-size: 0;
        display: block;
        width: auto;
        height: auto;
        font-weight: @content-font-weight;
        border: 1px solid;
    }

    .e-menu * {
        list-style-image: none;
        list-style-position: outside;
        list-style-type: none;
    }

    .e-menu * a:focus {
        outline: none;
    }

    * .e-menu > .e-list > ul,
    * .e-menu > .e-list > ul .e-list > ul {
        left: 102%;
        top: -0.8px;
    }

    .e-menu > .e-list {
        border: 0 none;
        position: relative;
        text-align: left;
        cursor: pointer;
    }

    .e-menu .e-list > ul {
        position: absolute;
        visibility: inherit;
        padding: 1px;
        margin: 0;
        left: -1px;
        z-index: 1000;
        display: none;
    }

    * .e-menu .e-list > ul .e-list {
        border: 0 none;
        float: none;
        position: relative;
        line-height: @menu-hor-child-line-height;
        cursor: pointer;
    }

    .e-menu .e-list > .e-menulink
     {
        text-decoration: none;
        display: block;
        border: 0px none;
        min-height: 18px;
        width: auto;
        height: auto;
        position: relative;
        font-size: @font-size;
    }

    .e-menu .e-list > .e-menulink {
        padding: 3px 18px 3px 28px;
        height: inherit;
        white-space: nowrap;
    }


    .e-menu li.e-list > .e-menulink > img,
    .e-menu li.e-list > .e-menulink > div,
    .e-menu li.e-list > .e-menulink > span
    {
        left: 2px;
        top: 25%;
        margin: 0 4px 0 0;
        position: absolute;
        vertical-align: middle;
        border: 0 none;
    }

    .e-menu .e-list > .e-menulink > span.e-icon.e-arrowhead-down, .e-menu .e-list > .e-menulink > span.e-icon.e-arrowhead-right{
        left: auto;
        position: absolute;
        right: -4px;
        top: 35%;
        font-size: 10px;
    }

    .e-menu-res-wrap .e-check-wrap .e-chkbox-wrap {
        opacity: 0;
        width: 100%;
        height: 100%;
    }

    .e-menu-res-wrap {
        display: none;
        height: 32px;
        overflow: hidden;
    }

    .e-menu-res-wrap .e-menu-res-in-wrap {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    .e-menu-res-wrap .e-menu-res-in-wrap .e-check-wrap .e-res-icon,
    .e-menu-res-wrap .e-menu-res-in-wrap .e-check-wrap {
        cursor: pointer;
        display: block;
        height: 100%;
        position: absolute;
        right: 0;
        text-align: left;
        top: 0;
        margin: 0px;
        width: 30px;
    }

    .e-menu-res-wrap .e-menu-res-in-wrap .e-check-wrap {
        border-left: 1px solid #AAAAAA;
        background-position: 3px 7px;
        background-repeat: no-repeat;
    }

    .e-menu-res-wrap .e-menu-res-in-wrap .e-res-title {
        height: 100%;
        font-family: 'Segoe UI';
        font-size: 13px;
    }

    .e-menu-res-wrap .e-in-wrap.e-menu-res-in-wrap {
        padding: 5px 30px 5px 5px;
    }

    .e-menu.e-rtl,
    .e-menu.e-rtl > .e-list {
        text-align: right;
    }

    .e-menu.e-rtl .e-list > .e-menulink > img,
    .e-menu.e-rtl .e-list > .e-menulink > div,
    .e-menu.e-rtl .e-list > .e-menulink > span {
        margin: 0 0 0 4px;
    }

    .e-menu.e-rtl .e-list > .e-menulink > span.e-icon.e-arrowhead-down,
    .e-menu.e-rtl .e-list > .e-menulink > span.e-icon.e-arrowhead-right {
        left: -2px;
        margin-left: 5px;
        right: auto;
    }

    .e-menu.e-rtl .e-list > .e-menulink > span {
        right: 0px;
        margin-right: 0px;
    }

    .e-menu.e-horizontal > .e-list > .e-menulink {
        padding: 0 8px;
        height: 100%;
        line-height: @menu-horizontal-line-height;
    }

    .e-menu.e-horizontal .e-list > ul {
        border: 1px solid;
    }

    .e-menu.e-horizontal .e-list > ul li.e-list > .e-menulink,
    .e-menu.e-vertical .e-list > .e-menulink{
        display: block;
    }

    .e-menu.e-horizontal > .e-list a.e-arrow-space {
        padding-right: 24px;
    }

    .e-menu.e-horizontal > .e-list span.e-menu-arrow {
		height: 10px;
		bottom : -1px;
		overflow: hidden;
		position: absolute;
		bottom: -1px;
		left: 12%;
		z-index: 10005;
		width: 20px;
    }

    .e-menu.e-horizontal > .e-list span.e-menu-left  {
        left: 12%;
		right : auto;
    }

    .e-menu.e-rtl.e-horizontal > .e-list span.e-menu-left  {
        right: 12%;
		left : auto;
    }

    .e-menu.e-rtl.e-horizontal .e-list > ul {
        left: auto;
        right: -1px;
    }

    .e-context.e-menu .e-list > a.e-menulink {
        text-overflow: ellipsis;
        overflow: hidden;
    }

    .e-menu.e-rtl.e-horizontal .e-list > ul ul {
        right: auto;
        left: 102%;
    }

    .e-menu.e-horizontal > .e-list > .e-menulink > img,
    .e-menu.e-horizontal > .e-list > .e-menulink > div,
    .e-menu.e-horizontal > .e-list > .e-menulink > span {
        left: 2px;
        top: -2px;
        margin: 0 4px 0 0;
        position: relative;
        vertical-align: middle;
        border: 0px none;
    }

    .e-menu.e-rtl.e-horizontal > .e-list .e-arrow-space {
        padding-left: 24px;
        padding-right: 4px;
    }

    .e-menu.e-rtl .e-list > ul li.e-list .e-arrow-space {
        padding-right: 28px;
    }

    .e-menu.e-horizontal > .e-list,
    .e-menu.e-separator.e-horizontal > li:last-child, .e-menu.e-horizontal > li.e-separator:last-child, .e-menu.e-horizontal .e-list > ul .e-list.e-separator:last-child,
    .e-menu.e-separator.e-vertical > li:last-child, .e-menu.e-vertical > li.e-separator:last-child, .e-menu.e-vertical .e-list > ul .e-list.e-separator:last-child,
    .e-menu.e-rtl.e-horizontal > .e-list,
    .e-menu.e-rtl.e-separator.e-horizontal > li:last-child, .e-menu.e-rtl.e-horizontal > li.e-separator:last-child, .e-menu.e-rtl.e-horizontal .e-list > ul .e-list.e-separator:last-child,
    .e-menu.e-rtl.e-separator.e-vertical > li:last-child, .e-menu.e-rtl.e-vertical > li.e-separator:last-child, .e-menu.e-rtl.e-vertical .e-list > ul .e-list.e-separator:last-child,
    .e-menu.e-separator.e-context > li:last-child, .e-menu.e-context > li.e-separator:last-child, .e-menu.e-context .e-list > ul .e-list.e-separator:last-child,
    .e-menu.e-rtl.e-separator.e-context > li:last-child, .e-menu.e-rtl.e-context > li.e-separator:last-child, .e-menu.e-rtl.e-context .e-list > ul .e-list.e-separator:last-child {
        border: 0 none;
    }

    .e-menu.e-separator.e-horizontal > .e-list, .e-menu.e-horizontal > .e-separator {
        border-right: 1px solid;
    }

    .e-menu.e-horizontal .e-list > ul .e-list.e-separator,
    .e-menu.e-horizontal .e-list > ul .e-list.e-separator:hover,
    .e-menu.e-vertical .e-list > ul .e-list.e-separator,
    .e-menu.e-vertical .e-list > ul .e-list.e-separator:hover,
    .e-menu.e-context .e-list > ul .e-list.e-separator,
    .e-menu.e-context .e-list > ul .e-list.e-separator:hover,
    .e-menu.e-separator.e-vertical > .e-list, .e-menu.e-vertical > .e-separator,
    .e-menu.e-context > .e-separator {
        border-bottom: 1px solid;
    }

    .e-menu.e-separator.e-rtl.e-horizontal > .e-list, .e-menu.e-rtl.e-horizontal > .e-separator.e-list {
        border-right: 0 none;
        border-left: 1px solid;
    }

    .e-menu.e-rtl.e-vertical .e-list > ul li.e-list > .e-menulink, 
    .e-menu.e-rtl.e-horizontal .e-list > ul li.e-list > .e-menulink {
        padding: 3px 28px 3px 18px;
    }

    .e-menu.e-vertical > .e-list > .e-menulink {
        padding: 0 28px;
        zoom: 1;
    }

    .e-menu.e-vertical {
        width: 150px;
        border: 1px solid;
    }

    .e-menu.e-vertical .e-list, .e-menu.e-vertical > li.e-list.e-separator {
        line-height: @menu-vertical-line-height;
    }

    .e-menu.e-vertical .e-list > ul {
        margin: -0.8px 0 0 0;
        top: 0;
        left: 102%;
        border: 1px solid;
    }

    .e-menu.e-vertical .e-list > ul .e-list {
        line-height: @menu-ver-child-line-height;
    }

    .e-menu.e-vertical > .e-list > img {
        position: absolute;
    }

    .e-menu.e-vertical > .e-list > .e-menulink > img,
    .e-menu.e-vertical > .e-list > .e-menulink > div,
    .e-menu.e-vertical > .e-list > .e-menulink > span,
    .e-menu.e-context > .e-list > .e-menulink > img,
    .e-menu.e-context > .e-list > .e-menulink > div,
    .e-menu.e-context > .e-list > .e-menulink > span {
        left: 2px;
        margin: 0 4px 0 0;
        position: absolute;
        vertical-align: middle;
        border: 0px none;
    }

    .e-menu.e-context > .e-list > .e-menulink {
        display: block;
        padding: 1px 18px 1px 28px;
        font-size: 13px;
    }

    .e-menu.e-context li.e-list > ul li.e-list > .e-menulink {
        padding: 1px 18px 1px 28px;
        height: inherit;
        white-space: nowrap;
    }

    .e-menu.e-context {
        position: absolute;
        padding: 1px;
        z-index: 9998;
        width: 150px;
        border: 1px solid;
        font-size: 13px;
    }

    .e-menu.e-context .e-list > ul .e-list, .e-menu.e-context .e-list, .e-menu.e-context > li.e-list.e-separator {
        line-height: 27px;
    }

    .e-menu.e-context .e-list > ul {
        margin: -0.8px 0 0 0;
        top: 0;
        left: 102%;
        line-height: 23px;
        border: 1px solid;
    }

    .e-menu.e-context > .e-list > .e-menulink > img,
    .e-menu.e-context > .e-list > .e-menulink > div,
    .e-menu.e-context > .e-list > .e-menulink > span {
        float: left;
    }

    .e-menu.e-context.e-rtl > .e-list > .e-menulink {
        padding: 1px 28px 1px 18px;
    }

    .e-menu.e-rtl.e-context li.e-list > ul li.e-list > .e-menulink {
        padding: 1px 28px 1px 18px;
    }

    .e-menu .e-list.e-hidden-item {
        display: none;
    }
}

.mixin(@widget) when (@widget = accordion), (@widget = none) {

    .e-acrdn {
        outline: 0 none;
    }

    .e-acrdn > .e-select > .e-icon, .e-acrdn.e-rtl > .e-select > div.e-close {
        border: 0 none transparent;
        display: block;
        height: 16px;
        width: 16px;
        margin-left: -5px;
        margin-right: 6px;
        margin-top: 5px;
        cursor: pointer;
        float: left;
    }

    .e-acrdn .e-select:first-child {
        border-top: 1px solid;
    }

    .e-acrdn > .e-select {
        padding: 0.5em;
        padding-left: 1em;
        line-height: 23px;
        border-style: none solid solid;
        border-width: 1px;
    }

    .e-acrdn .e-select a {
        text-decoration: none;
        border-bottom-width: 0;
        outline: 0 none;
    }

    .e-acrdn > .e-content {
        padding: 1em 1.4em;
        text-align: justify;
        position: relative;
        border: 1px solid;
    }

    .e-acrdn.e-rtl .e-icon, .e-acrdn > .e-select > div.e-close {
        float: right;
        margin-left: 5px;
    }

    .e-acrdn .e-select.e-disable a, .e-acrdn .e-select.e-disable span.e-icon {
        cursor: default;
    }

    .e-acrdn > .e-select > div.e-close {
        visibility: hidden;
    }

    .e-acrdn > .e-select:hover > div.e-close {
        visibility: visible;
    }

    .e-acrdn > .e-select.e-disable:hover > div.e-close {
        visibility: hidden;
    }
}

.mixin(@widget) when (@widget = checkbox), (@widget = none) {

    .e-chkbox-wrap, .e-radiobtn-wrap {
        outline: 0 none;
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none;
    }

    .e-chkbox-wrap .e-text, .e-radiobtn-wrap .e-text {
        padding: 2px 2px 2px 5px;
        text-align: left;
        top: 0px;
        cursor: pointer;
    }

    .e-chkbox-wrap input.e-checkbox {
        display: none;
        z-index: 1;
        text-align: left;
        top: 2px;
    }

    .e-chkbox-wrap div > span, .e-radiobtn-wrap > span {
        display: block;
        cursor: pointer;
        z-index: 2;
        position: relative;
        border: 1px solid;
        text-align: left;
    }

    .e-chkbox-wrap.e-rtl div > span, .e-radiobtn-wrap.e-rtl > span, .e-rtl .e-chkbox-wrap.e-widget div > span, .e-rtl .e-radiobtn-wrap.e-widget > span {
        text-align: right;
    }

    .e-chkbox-wrap .e-chkbox-small > span {
        height: 14px;
        width: 14px;
        top: 3px;
    }

    .e-chkbox-wrap .e-chkbox-medium > span {
        height: 20px;
        width: 20px;
        top: 6px;
    }

    .e-chkbox-wrap .e-chk-image {
        height: 100%;
        position: absolute;
        width: 100%;
    }

    .e-chkbox-wrap .e-chkbox-small .e-stop, .e-chkbox-wrap .e-chkbox-small .e-checkmark {
        font-size: 12px;
        line-height: 15px;
    }

    .e-chkbox-wrap .e-chkbox-medium .e-stop, .e-chkbox-wrap .e-chkbox-medium .e-checkmark {
        font-size: 18px;
    }

    .e-chkbox-wrap .e-chkbox-medium .e-stop {
        line-height: 20px;
    }

    .e-chkbox-wrap .e-chkbox-medium .e-checkmark {
        line-height: 21px;
    }

    .e-chkbox-wrap .e-chk-image.e-stop:before {
        content: "\e692";
        width: 100%;
        text-indent: 1px;
        height: 100%;
    }

    .e-chkbox-wrap .e-chk-image.e-checkmark:before {
        content: "\e657";
        width: 100%;
        text-indent: 1px;
        height: 100%;
    }
}

.mixin(@widget) when (@widget = radiobutton), (@widget = none) {

    .e-radiobtn-wrap {
        vertical-align: middle;
        margin-bottom: 3px;
    }

    .e-radiobtn-wrap .e-radiobtn {
        display: none;
        height: 0px;
        width: 0px;
        z-index: 1;
        text-align: left;
    }

    .e-rad-outer {
        overflow: hidden;
    }

    .e-rad-outer.e-radiobtn-wrap .e-radiobtn {
        display: block;
    }

    .e-radiobtn-wrap > span .e-rad-icon {
        position: absolute;
        width: 100%;
        height: 100%;
    }

    .e-radiobtn-wrap .e-radmedium {
        height: 16px;
        width: 16px;
        border-radius: 15px;
        -moz-border-radius: 15px;
        -webkit-border-radius: 15px;
    }

    .e-radiobtn-wrap .e-radmedium .e-rad-icon {
        font-size: 9px;
        border-radius: 9px;
        -moz-border-radius: 9px;
        -webkit-border-radius: 9px;
    }

    .e-radiobtn-wrap .e-radmedium .e-rad-icon.e-icon:before {
        height: 9px;
        width: 9px;
        margin: 24% auto;
    }

    .e-radiobtn-wrap .e-radsmaller {
        height: 13px;
        width: 13px;
        border-radius: 13px;
        -moz-border-radius: 13px;
        -webkit-border-radius: 13px;
    }

    .e-radiobtn-wrap .e-radsmaller .e-rad-icon {
        font-size: 8px;
        line-height: 12px;
        text-indent: 2px;
        border-radius: 7px;
        -moz-border-radius: 7px;
        -webkit-border-radius: 7px;
        padding:0.5px;
    }
}

.mixin(@widget) when (@widget = tab), (@widget = none) {

    .e-tab {
        outline: 0 none;
    }

    .e-tab.e-js.e-widget.e-scrolltab {
        padding: 50px;
    }

    .e-tab .e-rtl-top-line {
        margin: 0 -1px -1px 1px;
    }

    .e-tab .e-rtl-bottom-line {
        margin: 0 -1px -1px 1px;
    }

    .e-tab.e-js .e-header > .e-rtl-top-line.e-active.e-top-hover {
        padding-bottom: 1px;
        border-bottom: transparent;
    }

    .e-tab .e-bottom-line, .e-tab .e-top-line, .e-tab .e-activetop, .e-tab .e-activebottom {
        border: @border-size @border-type;
    }

    .e-tab .e-top-line {
        margin: -1px 0px 0px 0px;
    }

    .e-tab .e-bottom-line.e-active {
        margin: 0px 0px -1px 0;
    }

    .e-tab .e-bottom-line, .e-tab .e-activebottom, .e-tab .e-left > .e-active, .e-tab .e-left > .e-active:hover, .e-tab .e-right > .e-active, .e-tab .e-right > .e-active:hover {
        border-bottom: 0 none;
    }

    .e-tab .e-top-line, .e-tab .e-activetop {
        border-top: 0 none;
    }

    .e-tab.e-js > .e-header {
        width: 99.9%;
        font-size: 0px;
        box-shadow: @box-shadow;
    }

    .e-tab .e-header li {
        border-right: @border-size @border-type;
        line-height: normal;
        list-style: none outside none;
    }

    .e-tab .e-header li a {
        text-decoration: none;
        border-bottom-width: 0;
        padding: 0.6em 0.9em;
        outline: 0 none;
    }

    .e-tab .e-header li.e-tab-active {
        margin-bottom: 0;
        padding-bottom: 1px;
    }

    .e-tab .e-content-item {
        display: none;
    }

    .e-tab .e-active-content {
        padding: 1em 1.4em;
        text-align: justify;
    }

    .e-tab .e-tab-active {
        font-weight: @header-font-weight;
    }

    .e-tab > .e-header .e-icon {
        float: right;
        height: 16px;
        width: 16px;
        margin-top: 11px;
        cursor: pointer;
        padding: 3px;
        background-color: transparent;
        background-image: none;
        margin-right: 3px;
    }

    .e-tab.e-rtl .e-header > .e-item:first-child {
        margin-right: 0;
    }

    .e-tab.e-rtl .e-icon, .e-tab .e-left, .e-tab.e-vertical .e-right .e-icon {
        float: left;
    }

    .e-tab.e-vertical .e-content {
        height: 100%;
    }

    .e-tab .e-left, .e-tab .e-right {
        line-height: normal;
        list-style: none outside none;
        margin: 0;
        text-align: left;
        padding: 0;
        box-shadow: @box-shadow;
    }

    .e-tab.e-vertical .e-right .e-icon {
        margin-left: 5px;
    }

    .e-tab.e-vertical .e-left .e-icon {
        margin-right: 5px;
    }

    .e-tab .e-right, .e-tab.e-vertical .e-left .e-icon {
        float: right;
    }

    .e-tab .e-left li a, .e-tab .e-right li a {
        display: inline-block;
        outline: 0 none;
        padding: 16px 5px;
        text-decoration: none;
        margin-left: 5px;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .e-tab.e-vertical .e-icon.e-close {
        background-position: -445px -24px;
        margin-top: 18.5px;
    }

    .e-tab .e-icon.e-chevron-circle-left, .e-tab .e-icon.e-chevron-circle-right {
        font-size: 40px;
    }

    .e-tab.e-vertical, .e-tab.e-vertical .e-active-content, .e-tab .e-left li a, .e-tab .e-right li a {
        overflow: hidden;
    }

    .e-tab.e-vertical .e-icon.e-reload {
        background-position: -82px 0;
        margin-top: 20px;
        display: inline-block;
    }

    .e-tab .e-left .e-icon, .e-tab .e-right .e-icon {
        background-image: none;
    }
}

.mixin(@widget) when (@widget = dialog), (@widget = none) {

    .e-dialog {
        outline: 0 none;
    }

    .e-dialog > .e-titlebar {
        padding: 0.7em;
        position: relative;
        overflow: hidden;
        z-index: inherit;
        box-shadow: @box-shadow;
    }

    .e-dialog > .e-header .e-title {
        display: inline-block;
        max-width: 60%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        vertical-align: top;
    }

    .e-dialog .e-draggable {
        cursor: move;
    }

    .e-dialog.e-dialog-wrap > .e-disable-overlay {
        position: absolute;
        height: 100%;
        width: 100%;
        top: 0px;
        left: 0px;
        z-index: 10001;
    }

    .e-dialog .e-dialog-icon {
        cursor: pointer;
        padding: 1px;
        right: 5px;
        top: 50%;
        float: right;
        height: 23px;
        width: 20px;
        text-align: center;
        position: relative;
    }

    .e-dialog .e-dialog-favicon {
        padding: 1px;
        height: 20px;
        width: 20px;
        text-align: center;
        position: relative;
        margin-right: 3px;
    }

    .e-dialog .e-dialog-favicon .e-dialog-custom {
        display: block;
        height: 100%;
        width: 100%;
        margin: 0 auto;
    }

    .e-dialog-icon.e-btn-normal.e-btn {
        background: none;
        border: none;
        color: inherit;
        filter: none;
    }

    .e-dialog-icon.e-btn-normal.e-btn > div {
        display: block;
        margin: 0 auto;
        width: 14px;
        height: 14px;
    }

    .e-dialog-icon.e-btn.e-select .e-icon {
        color: inherit;
        padding: 0px;
    }

    .e-dialog .e-widget-content {
        position: relative;
        border: 0;
        padding: .5em 1em;
        background: none;
        border-image: initial;
        min-height: 15px;
    }

    .e-dialog > .e-icon.e-resizable {
        bottom: 0;
        cursor: se-resize;
        display: block;
        height: 14px;
        position: absolute;
        right: 0;
        width: 16px;
    }

    .e-dialog > .e-icon.e-resizable:before {
        position: absolute;
        top: 0;
        left: 0;
    }

    .e-dialog.e-rtl .e-dialog-icon {
        float: left;
    }

    .e-dialog > .e-icon {
        height: 20px;
        width: 20px;
    }
}

.mixin(@widget) when (@widget = splitter), (@widget = none) {

    .e-h-arrow, .e-v-arrow {
        display: block;
        z-index: 10002;
    }

    .e-v-arrow.e-arrow-sans-down {
        margin-left: -9px;
        top: -4px;
    }

    .e-v-arrow.e-arrow-sans-up {
        top: -1.4px;
    }

    .e-splitter.e-rtl .e-h-arrow.e-arrow-sans-right {
        left: -2px;
    }

    .e-splitter.e-rtl .e-h-arrow.e-arrow-sans-left {
        left: -0.4px;
    }

    .e-h-arrow.e-arrow-sans-right {
        left: -4px;
        margin-top: -9px;
    }

    .e-h-arrow.e-arrow-sans-left {
        left: -1.4px;
    }

    .e-splitter .e-splitbar.e-resize.e-shadowbar {
        position: absolute;
        z-index: 10002;
        border-style: dotted;
    }

    .e-splitter {
        border-collapse: collapse;
        position: relative;
        overflow: hidden;
        height: 100%;
        width: 100%;
        display: block;
        border: 1px solid;
    }

    .e-splitter .e-splitbar {
        border-style: @border-type;
        display: block;
        float: left;
        position: relative;
        outline: 0 none;
        overflow: hidden;
    }

    .e-pane.e-splitter {
        border: none !important;
    }

    .e-splitter .e-splitbar.e-h-bar.e-resize {
        cursor: e-resize;
    }

    .e-splitter .e-splitbar.e-v-bar.e-resize {
        cursor: n-resize;
    }

    .e-splitter .e-splitbar.e-h-bar {
        border-style: solid;
        border-width: 0 1px;
        height: 100%;
        vertical-align: middle;
        width: 9px;
    }

    .e-splitter .e-splitbar.e-v-bar {
        border-style: solid;
        border-width: 1px 0;
        height: 9px;
        vertical-align: middle;
        width: 100%;
    }

    .e-splitter .e-splitbar .e-v-arrow, .e-splitter .e-splitbar .e-h-arrow {
        cursor: pointer;
        position: absolute;
    }

    .e-splitter .e-splitbar .e-v-arrow {
        float: left;
        height: 11px;
        width: 12px;
        left: 50%;
    }

    .e-splitter .e-splitbar .e-h-arrow {
        height: 12px;
        width: 11px;
        top: 50%;
    }

    .e-splitter .e-pane {
        border: none;
        cursor: default;
        float: left;
        position: relative;
        overflow-x: auto;
    }

    .e-splitter .e-pane.collapsed {
        overflow: hidden;
    }

    .e-splitter .e-h-pane {
        height: 100%;
    }

    .e-splitter .e-v-pane {
        width: 100%;
    }
}

.mixin(@widget) when (@widget = uploadbox), (@widget = none) {


    .e-upload-box.e-drag-wrapper {
        border: dashed 3px #C1C3C5;
        display: table;
        position: relative;
        box-sizing: border-box;
    }

    .e-upload-box.e-drag-wrapper .e-drag-container {
        display: table-cell;
        height: 100%;
        width: 100%;
        vertical-align: middle;
    }

    .e-upload-box .e-drag-text {
        color: #CCCCD3;
        font-size: 12pt;
        font-weight: bold;
        padding: 11px;
        display: block;
        margin: 0 auto;
        text-align: center;
    }

    .e-upload-box.e-drag-wrapper .e-uploadbox.e-widget {
        margin: 0 auto;
    }

    .e-uploadbox .e-selectpart {
        overflow: hidden;
        position: relative;
        width: auto;
    }

    .e-uploadbox .e-inputbtn {
        background-color: transparent;
        border: @border-size @border-type transparent;
    }

    .e-uploadbox.e-widget .e-selectpart.e-select {
        border: 1px solid;
        box-shadow: @box-shadow;

        .border-radius(@radius) when not(@radius = 0px) {
            border-radius: @border-radius;
        }

        .border-radius(@border-radius);
    }

    .e-uploadbox .e-action-container {
        width: 233px;
        margin: 0px auto 8px auto;
        padding-top: 16px;
    }

    .e-uploadbox .e-uploadinput {
        display: block;
        cursor: pointer;
        filter: alpha(opacity=0);
        opacity: 0;
        position: absolute;
        right: 0;
        top: 0px;
        margin: 0;
    }

    .e-uploadbox.e-browse-hide {
        opacity: 0;
        filter: alpha(opacity=0);
        top: 0;
        left: 0;
        width: 500px;
        height: 100px;
        cursor: pointer;
        position: absolute;
    }

    .e-uploadbox.e-browse-hide .e-select .e-inputbtn {
        filter: alpha(opacity=0);
    }

    .e-uploadbox .e-ul {
        width: 100%;
    }

    .e-uploadbox .e-file-list {
        height: 58px;
        text-align: center;
        text-indent: 3px;
        position: relative;
        top: 5px;
    }

    .e-uploadbox .e-file-list .file-status {
        float: left;
        min-width: 77px;
        padding-right: 0;
        padding-top: 5px;
        text-align: right;
    }

    .e-uploadbox .e-file-list .e-file-view {
        height: 85%;
    }

    .e-uploadbox .e-file-list .e-file-percentage {
        float: left;
        padding-left: 0;
        padding-right: 0;
        padding-top: 15px;
        width: 140px;
        font-size: 10px;
    }

    .e-uploadbox .e-file-progress {
        float: left;
        width: 200px;
        position: relative;
        overflow: hidden;
    }

    .e-uploadbox .e-file-name {
        display: block;
        height: 25px;
        text-align: left;
        width: 100%;
    }

    .e-uploadbox .e-file-progress-bar {
        height: 10px;
        width: 100%;
        margin: 2px;
    }

    .e-uploadbox .e-ul > li {
        height: 60px;
        width: 100%;
    }

    .e-uploadbox .e-ul li .e-file-list {
        width: 100%;
        clear: both;
    }

    .e-uploadbox .e-file-progress-status {
        height: 10px;
        width: 0%;
    }

    .e-uploadbox .e-file-list .e-file-size {
        float: left;
        min-width: 100px;
        padding-left: 0;
        padding-right: 0;
        width: 100px;
    }

    .e-uploadbox .e-file-name .e-file-name-txt, .e-uploadbox .e-drag-wrapper .e-file-name .e-file-name-txt, .e-uploadbox .e-file-head.e-head-name, .e-uploadbox .e-drag-wrapper .e-file-head.e-head-name {
        text-indent: 16px;
    }

    .e-uploadbox .e-file-size .e-file-name-txt {
        left: -11px;
        text-align: left;
    }

    .e-uploadbox .e-file-name-txt {
        position: relative;
        top: 13px;
        font-weight: @content-font-weight;
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        text-indent: 20px;
    }

    .e-uploadbox .e-file-upload {
        padding: 10px 0;
    }

    .e-uploadbox .e-uploadbtn, .e-uploadbox .e-uploadclosebtn {
        font-weight: @content-font-weight;
        border: 1px solid;
        text-overflow: ellipsis;
        white-space: nowrap;
        height: 40px;
        width: 100px;
        position: relative;
        margin-left: 15px;
    }

    .e-uploadbox .e-uploadinput, .e-uploadbox .e-selectpart, .e-uploadbox .e-select .e-inputbtn, .e-uploadbox.e-disable .e-select .e-inputbtn {
        height: 100%;
        width: 100%;
        border: none;
        padding: 0;
        margin: 0;
    }

    .e-uploadbox.e-rtl .e-icon.e-file-cancel:before,
    .e-uploadbox.e-rtl .e-icon.e-delete:before,
    .e-uploadbox.e-rtl .e-icon.e-reload:before {
        top: 0px;
        left: 2px;
    }

    .e-uploadbox.e-rtl .e-file-name-txt, .e-mobile-upload.e-uploadbox.e-dialog.e-rtl .e-file-name-txt {
        text-align: right;
        left: 0px;
    }

    .e-uploadbox.e-rtl .e-file-view, .e-uploadbox.e-rtl .e-file-head, .e-uploadbox.e-rtl .e-action-perform, .e-uploadbox.e-rtl .e-icon.e-file-cancel {
        float: right;
    }

    .e-uploadbox.e-rtl .e-action-perform {
        margin-left: 0px;
        margin-right: 15px;
    }

    .e-uploadbox.e-rtl .e-file-size .e-file-name-txt {
        left: 10px;
        text-align: right;
    }

    .e-uploadbox.e-rtl .e-file-list {
        text-align: right;
    }

    .e-uploadbox.e-rtl .e-upload-file .e-icon {
        margin-right: 35%;
        left: 0;
    }

    .e-uploadbox .e-file-progress {
        border: @border-size @border-type transparent;
    }

    .e-uploadbox .e-upload-progress {
        border: @border-size @border-type transparent;
    }

    .e-uploadbox.e-dialog .e-ul .e-action-perform .e-icon {
        float: left;
        height: 20px;
        margin-top: 5px;
        position: relative;
        width: 30px;
        cursor: pointer;
    }

    .e-uploadbox .e-file-list .e-checkmark, .e-uploadbox .e-file-list .e-file-percentage-failed {
        height: 23px;
        width: 23px;
        margin-top: -5px;
        left: 43%;
        border-radius: 60px 60px 60px 60px;
        position: relative;
    }

    .e-uploadbox .e-action-perform {
        border-radius: 4px 4px 4px 4px;
        float: left;
        height: 25px;
        margin-left: 15px;
        margin-top: 11px;
        width: 25px;
    }

    .e-uploadbox .e-icon.e-checkmark:before {
        top: 4px;
        position: relative;
        left: -3px;
    }

    .e-uploadbox .e-head-name, .e-uploadbox .e-head-status {
        width: 200px;
    }

    .e-uploadbox .e-file-list .e-image-wrapper {
        height: 85%;
        padding: 0 5px;
        float: left;
    }

    .e-uploadbox .e-file-list .e-image-wrapper {
        text-align: left;
        width: 30px;
        margin-top: 1%;
        margin-left: 1%;
    }

    .e-uploadbox .e-file-list .e-image-wrapper .e-fileformat-image {
        height: 40px;
        width: 40px;
        display: block;
    }

    .e-uploadbox .e-file-progress {
        width: 200px;
    }

    .e-uploadbox.e-rtl .e-icon.e-file-percentage-failed:before, .e-uploadbox.e-rtl .e-icon.e-checkmark:before {
        left: 3px;
    }

    .e-uploadbox .e-icon.e-file-cancel:before,
    .e-uploadbox .e-icon.e-delete:before,
    .e-uploadbox .e-icon.e-reload:before {
        top: 0px;
        position: relative;
        left: -7px;
        font-size: 16px;
    }

    .e-uploadbox .uploaddialog.e-dialog.e-dialog-content {
        position: relative;
        border: 0;
        background: none;
        overflow: auto;
        border-image: initial;
    }

    .e-uploadbox.e-dialog .e-titlebar {
        padding: 10px;
        position: relative;
    }

    .e-uploadbox.e-dialog .e-titlebar .e-title {
        margin-left: 3px;
        margin-right: 5px;
        position: relative;
        top: 1px;
    }


    .e-uploadbox.e-dialog .e-close {
        margin: 0px 2px 2px 2px;
    }

    .e-uploadbox.e-dialog .e-dialog-icon {
        top: 5px;
    }

    .e-uploadbox .e-file-head {
        float: left;
        font-weight: 900;
        height: 25px;
        position: relative;
        text-indent: 12px;
        top: 30%;
    }

    .e-uploadbox .e-head-size {
        width: 100px;
    }

    .e-uploadbox .e-file-head.e-head-status {
        text-indent: 50px;
    }

    .e-uploadbox .e-head-content {
        display: inline-block;
        height: 50px;
        vertical-align: middle;
        width: 100%;
    }

    .e-uploadbox .e-dialog.e-widget-content {
        padding: 0px;
    }

    .e-uploadbox.e-dialog .e-widget-content .e-icon {
        display: block;
        vertical-align: middle;
    }

    .e-mobile-upload.e-uploadbox .e-action-container {
        width: 160px;
        padding-top: 10px;
    }

    .e-uploadbox .e-action-container.sync {
        width: 125px;
    }

    .e-mobile-upload.e-uploadbox .e-action-container.sync {
        width: 75px;
    }

    .e-mobile-upload.e-uploadbox .e-uploadbtn, .e-mobile-upload.e-uploadbox .e-uploadclosebtn {
        margin-left: 0px;
    }

    .e-mobile-upload.e-uploadbox.e-dialog .e-header {
        padding: 4px;
        font-size: 14px;
    }

    .e-mobile-upload.e-uploadbox.e-dialog .e-uploadbtn.e-btn {
        margin-left: 15px;
        float: right;
    }

    .e-mobile-upload.e-rtl.e-uploadbox.e-dialog .e-uploadclosebtn.e-btn {
        margin-left: 0px;
        float: left;
    }

    .e-mobile-upload.e-rtl.e-uploadbox.e-dialog .e-uploadclosebtn.e-btn {
        margin-left: 15px;
        float: right;
    }

    .e-mobile-upload.e-rtl.e-uploadbox.e-dialog .e-uploadbtn.e-btn {
        margin-left: 0px;
        float: left;
    }

    .e-mobile-upload.e-uploadbox.e-dialog .e-head-content {
        display: none;
    }

    .e-mobile-upload.e-uploadbox.e-dialog .e-file-name-txt {
        top: 0px;
        font-size: 12px;
    }

    .e-mobile-upload.e-uploadbox.e-dialog .e-file-list > div {
        float: left;
        height: 20px;
    }

    .e-mobile-upload.e-uploadbox.e-dialog .e-file-percentage {
        padding-top: 0px;
        padding-left: 15px;
        width: 175px;
    }

    .e-mobile-upload.e-uploadbox.e-dialog .e-titlebar .e-title {
        margin-right: 15px;
        margin-left: 12px;
    }

    .e-mobile-upload.e-uploadbox.e-dialog .e-file-list .e-action-perform {
        float: right;
        margin-top: 0px;
        margin-right: 12px;
        width: 15px;
    }

    .e-mobile-upload.e-uploadbox.e-dialog .e-file-size > .e-file-name-txt {
        font-size: 10px;
        left: -1px;
        text-align: left;
    }

    .e-mobile-upload.e-uploadbox.e-dialog .e-file-progress-status, .e-mobile-upload.e-uploadbox.e-dialog .e-file-progress-bar {
        height: 12px;
    }

    .e-mobile-upload.e-uploadbox.e-dialog .e-file-upload button.e-btn {
        font-size: 12px;
        height: 30px;
        width: 70px;
        font-size: 12px;
    }

    .e-rtl.e-mobile-upload.e-uploadbox.e-dialog .e-file-upload > button {
        left: -4px;
    }

    .e-mobile-upload.e-uploadbox.e-dialog .e-ul .e-action-perform .e-icon {
        width: 10px;
        margin-left: 5px;
        top: -2px;
    }

    .e-mobile-upload.e-uploadbox.e-dialog .e-dialog-icon {
        top: 0px;
    }

    .e-mobile-upload.e-uploadbox .e-ul > li, .e-mobile-upload {
        height: 100%;
    }

    .e-mobile-upload.e-uploadbox .e-icon.e-close:before, .e-mobile-upload.e-uploadbox .e-icon.e-file-cancel:before {
        font-size: 12px;
    }

    .e-uploadbox .e-icon.e-checkmark:before, .e-uploadbox .e-icon.e-file-percentage-failed:before {
        top: 4px;
        position: relative;
        left: -3px;
    }

    .e-mobile-upload.e-uploadbox .e-file-upload {
        height: 50px;
        padding: 0px;
    }

    .e-mobile-upload.e-uploadbox .e-ul > li, .e-mobile-upload.e-uploadbox .e-ul li .e-file-list, .e-mobile-upload.e-uploadbox .e-ul li:nth-child(odd) > .e-file-list {
        height: 100%;
        border-bottom: none;
        top: 3px;
    }

    .e-mobile-upload.e-uploadbox .e-ul li .e-file-list {
        padding-bottom: 5px;
    }

    .e-mobile-upload.e-uploadbox .e-ul {
        border-bottom: 1px solid #c4c4c4;
    }

    .e-mobile-upload.e-rtl.e-uploadbox.e-dialog .e-file-list > div {
        float: right;
        height: 20px;
    }

    .e-rtl.e-mobile-upload.e-uploadbox.e-dialog .e-file-list .e-action-perform {
        float: left;
        margin-left: 5px;
    }

    .e-mobile-upload.e-rtl.e-uploadbox.e-dialog .e-file-size > .e-file-name-txt {
        text-align: right;
        left: 0px;
    }

    .e-mobile-upload.e-uploadbox.e-rtl.e-dialog .e-file-percentage {
        margin-right: 15px;
    }
}

.mixin(@widget) when (@widget = treeview), (@widget = none) {

    .e-treeview-wrap {
        white-space: nowrap;
        outline: 0 none;
        border-image: initial;
    }

    .e-treeview-wrap > .e-ul {
        overflow: auto;
        height: inherit;
    }

    .e-treeview .e-treeview-ul {
        background: 0;
        list-style-type: none;
        position: relative;
        margin-left: -12px;
        outline: 0 none;
    }

    .e-fullrow-wrap.e-treeview-wrap {
        position: relative;
    }

    .e-fullrow-wrap .e-treeview-ul {
        position: inherit;
    }

    .e-treeview .e-item {
        margin: 0;
        padding: 0px 0px 2px 16px;
        white-space: nowrap;
        outline: 0 none;
    }

    .e-treeview .e-text {
        border: @border-size @border-type transparent;
        padding: @treeview-text-padding;
        text-decoration: none;
        min-height: 15px;
        min-width: 10px;
        border-image: initial;
        font-size: 14px;
        margin-left: 2px;
    }

    .e-fullrow-wrap .e-text {
        vertical-align: top;
    }

    .e-fullrow-wrap .e-fullrow {
        width: 100%;
        position: absolute;
        left: 0;
        -webkit-user-select: none;
        margin-top: -@treeview-fullrow-height;
        height: @treeview-fullrow-height;
        box-sizing: border-box;
    }

    .e-fullrow-wrap .e-text-wrap {
        position: relative;
        z-index: 1;
        cursor: pointer;
    }

    .e-treeview .e-text.e-editable {
        background: none;
        border: none;
        padding: 0;
    }

    .e-treeview .e-text.e-editable .e-tree-input {
        box-sizing: border-box;
        padding: @treeview-edit-text-padding;
        margin: 0;
    }

    .e-treeview-wrap.e-rtl .e-text.e-editable .e-tree-input {
        padding: @treeview-rtl-edit-text-padding;
    }

    .e-dragedNode {
        z-index: 10002;
        padding: 0 10px 0 0;
        font-size: 14px;
        line-height: 1.42857143;
    }

    .e-rtl.e-dragedNode {
        padding: 0 0 0 5px;
    }

    .e-icon.e-dropedStatus:before {
        float: left;
        margin: 4px 5px;
    }

    .e-dragedNode .e-icon.e-minus:before, .e-dragedNode.e-rtl .e-icon.e-minus:before {
        content: "\e833";
    }

    .e-dragedNode .e-icon.e-plus:before, .e-dragedNode.e-rtl .e-icon.e-plus:before {
        content: "\e834";
    }

    .e-dragedNode .e-insertInbetween:before {
        content: "\e835";
    }

    .e-dragedNode .e-insertInbetween-rtl:before {
        content: "\e836";
    }

    .e-rtl .e-icon.e-dropedStatus:before {
        float: right;
    }

    .e-dragedNode .e-text {
        text-decoration: none;
    }

    .e-treeview .e-sibling {
        width: 80px;
        height: 5px;
        position: absolute;
        margin-top: -2px;
        z-index: 2;
    }

    .e-treeview.e-rtl .e-sibling {
        background: url('@{font-path}/tools/drop-sibling-rtl.png');
    }

    .e-icon.e-dropedStatus {
        width: 14px;
        height: 14px;
    }

    .e-drop-count {
        position: absolute;
        top: -10px;
        border: 1px solid;
        min-width: 12px;
        padding: 2px 4px;
        margin-left: 2px;
        text-align: center;
        font-size: 12px;
        border-radius: 15px;
        font-weight: 600;
    }

    .e-rtl .e-drop-count {
        left: -18px;
    }

    .e-treeview ul {
        padding: @treeview-ul-padding;
        width: auto;
        list-style-type: none;
        outline: 0 none;
    }

    .e-treeview.e-rtl ul {
        padding-right: 10px;
        padding-left: 0;
    }

    .e-treeview ul:first-child, .e-treeview {
        min-height: 15px;
    }

    .e-treeview .e-plus,
    .e-treeview .e-minus, .e-treeview .e-icon.e-load {
        background-repeat: no-repeat;
        border: 0 none transparent;
        float: left;
        width: 16px;
        padding-top: @treeview-icon-margin;
        margin-left: -16px;
        cursor: pointer;
    }

    .e-treeview-wrap .e-plus:before, .e-treeview-wrap .e-minus:before, .e-treeview-wrap .e-load:before {
        margin-right: 0;
    }

    .e-treeview-wrap.e-rtl .e-plus:before, .e-treeview-wrap.e-rtl .e-minus:before, .e-treeview-wrap.e-rtl .e-load:before {
        margin-right: 6px;
    }

    .e-treeview-wrap .e-icon.e-load {
        background-size: 10px;
    }

    .e-treeview .e-item img.e-align {
        vertical-align: middle;
        margin-left: 5px;
    }

    .e-treeview-wrap .e-item div > a > span, .e-treeview-wrap .e-item div > a > img {
        margin-right: 3px;
    }

    .e-treeview-wrap .e-item div > .e-chkbox-wrap {
        margin-left: 3px;
        margin-right: 4px;
        float: left;
        margin-top: @treeview-chk-margin-top;
    }

    .e-treeview-wrap.e-rtl .e-item div > span + span {
        margin-right: 6px;
        margin-left: 4px;
    }

    .e-treeview-wrap.e-rtl .e-item {
        padding: @treeview-rtl-item-padding;
    }

    .e-treeview-wrap.e-rtl .e-treeview {
        padding: 3px 14px 3px 0;
    }

    .e-treeview-wrap.e-rtl .e-treeview-ul {
        margin-left: 0px;
        padding: @treeview-rtl-ul-padding;
        margin-right: -12px;
    }

    .e-treeview-wrap.e-rtl .e-treeview.e-treeview-ul {
        padding: 0;
        margin: 0;
    }

    .e-treeview-wrap.e-rtl .e-item .e-icon {
        float: right;
    }

    .e-treeview-wrap.e-rtl .e-plus, .e-treeview-wrap.e-rtl .e-minus, .e-treeview-wrap.e-rtl .e-icon.e-load {
        margin-right: -16px;
    }

    .e-treeview-wrap.e-rtl .e-item img.e-align {
        vertical-align: middle;
        margin-right: 5px;
    }

    .e-treeview-wrap.e-rtl .e-text {
        margin-right: 2px;
    }

    .e-treeview-wrap.e-rtl .e-item div > .e-chkbox-wrap {
        margin-left: 3px;
        margin-right: 4px;
        float: right;
    }

    .e-treeview-wrap.e-rtl .e-chkbox-wrap div > span {
        text-align: right;
    }

    .e-treeview-wrap .e-chk-image.e-icon.e-stop {
        line-height: 14px;
    }

    .e-treeview-wrap.e-rtl .e-item div > a > span, .e-treeview-wrap.e-rtl .e-item div > a > img {
        margin-right: 0px;
        margin-left: 3px;
    }

    .e-treeview .e-treeview-ul {
        margin-bottom: @treeview-ul-margin-bottom;
    }

    .e-treeview .e-text , .e-autocomplete.e-disable {
        -moz-user-select: -moz-none;
        -khtml-user-select: none;
        -webkit-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

    .e-treeview .e-fe-popup span {
        display: inline-block;
        height: 16px;
        cursor: pointer;
        padding: 4px;
        border: 1px solid transparent;
        width: 16px;
    }

    .e-treeview .e-fe-popup .e-tail:before, .e-treeview .e-fe-popup .e-tail:after {
        border: 10px solid transparent;
        content: "";
        height: 0;
        left: 8px;
        position: absolute;
        width: 0;
    }

    .e-treeview .e-fe-popup {
        position: absolute;
        font-weight: normal;
        z-index: 99999;
    }

    .e-treeview .e-fe-popup .e-content {
        border-radius: 4px;
        font-size: 14px;
        padding: 4px 4px;
    }

    .e-treeview .e-fe-popup .e-content {
        border-width: 1px;
        border-style: solid;
    }

    .e-treeview .e-fe-popup .e-downtail:after {
        top: 34px;
    }

    .e-fullrow-wrap .e-treeview-ul {
        margin-bottom: -2px;
    }

    .e-fullrow-wrap .e-li-active .e-active, .e-fullrow-wrap .e-li-hover .e-node-hover, .e-fullrow-wrap .e-li-hover .e-node-focus, .e-fullrow-wrap .e-li-focus .e-node-focus {
        border: 0px;
        margin: 1px 1px 1px 3px;
    }
}

.mixin(@widget) when (@widget = waitingpopup), (@widget = none) {

    .e-waitpopup-pane {
        opacity: 0.85;
        filter: alpha(opacity=85);
        position: absolute;
    }

    .e-waitpopup-pane .e-image {
        background-position: center center;
        background-repeat: no-repeat;
        border-radius: 15px 15px 15px 15px;
        display: block;
        height: 70px;
        margin: 0 auto;
        position: relative;
        width: 70px;
    }

    .e-waitpopup-pane .e-text {
        font-size: @header-font-size;
        margin: 0;
        position: relative;
        text-align: center;
    }
}

.mixin(@widget) when (@widget = tagcloud), (@widget = none) {

    .e-tagcloud {
        width: 350px;
        display: block;
    }

    .e-tagcloud .e-title {
        font-size: @header-font-size;
        font-weight: 600;
        padding: 10px 6px 10px 11px;
        vertical-align: middle;
        border: 1px solid;
        box-shadow: @box-shadow;
    }

    .e-tagcloud ul.e-notitle {
        border-top-width: 1px;
    }

    .e-tagcloud .e-title-img {
        margin-right: 7px;
        vertical-align: middle;
    }

    .e-tagcloud .e-ul {
        font-size: @font-size;
        font-weight: 400;
        list-style-position: outside;
        width: 100%;
        overflow: hidden;
        display: block;
        padding: 6px;
        border: 1px solid;
        border-top-width: 0;
    }

    .e-tagcloud .e-list .e-tagitems, .e-tagcloud .e-cloud .e-tagitems {
        cursor: pointer;
        list-style-type: none;
        padding: 5px 3px;
    }

    .e-tagcloud .e-list .e-tagitems {
        display: block;
    }

    .e-tagcloud .e-tagitems .e-txt {
        outline: 0 none;
        text-decoration: none;
        line-height: 20px;
        padding: 0px 2px;
    }

    .e-tagcloud .e-load {
        min-height: 30px;
        width: 100%;
    }
}

.mixin(@widget) when (@widget = toolbar), (@widget = none) {

    .e-toolbar {
        margin-top: 0;
        border: 1px solid;
        outline: 0 none;
    }

    .e-toolbar.e-toolbarspan {
        width: 100%;
        box-shadow: @box-shadow;
    }

    .e-toolbar > ul > li {
        position: relative;
        border: @border-size @border-type transparent;
        cursor: default;
        list-style-type: none;
        padding: @toolbar-padding;
    }

    .e-toolbar > ul > li div.e-item-overlay {
        position: absolute;
        height: 100%;
        width: 100%;
        top: 0;
        left: 0;
        opacity: 0.10;
        filter: alpha(opacity=10);
    }

    .e-toolbar.e-js ul > li.e-tooltxt {
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -o-user-select: none;
        user-select: none;
    }

    .e-toolbar, .e-toolbar > .e-vertical, .e-toolbar > .e-horizontal, .e-toolbar div:first-child {
        *display: inline;
        overflow: hidden;
    }

    .e-toolbar > .e-horizontal.e-ul > li, .e-toolbar > .e-horizontal .e-spriteimg, .e-toolbar.e-rtl > .e-res-pos {
        float: left;
    }

    .e-toolbar > .e-horizontal.e-ul {
        vertical-align: middle;
        float: left;
        height: inherit;
    }

    .e-toolbar.e-rtl > .e-horizontal.e-comnrtl, .e-toolbar.e-rtl > .e-horizontal .e-comnrtl, .e-toolbar > .e-res-pos {
        float: right;
    }

    .e-toolbar > .e-vertical .e-comnrtl {
        direction: rtl;
    }

    .e-toolbar > .e-horizontal .e-align, .e-toolbar > .e-horizontal .e-tooltxt, .e-toolbar > .e-vertical .e-align, .e-toolbar > .e-vertical > .e-tooltxt {
        vertical-align: middle;
        outline: none;
    }

    .e-toolbar > .e-horizontal .e-disable, .e-toolbar > .e-vertical .e-disable {
        background-color: transparent;
        border: @border-size @border-type transparent;
    }

    .e-toolbar ul:last-child > li:last-child, .e-toolbar.e-rtl ul:first-child > li:last-child {
        margin-right: 0;
    }

    .e-toolbar > ul > li {
        margin-right: @toolbar-margin-right;
    }

    .e-toolbar .e-icon.e-toolbar-res-arrow {
        height: 28px;
        width: 28px;
        line-height: normal;
    }

    .e-toolbar .e-icon.e-toolbar-res-arrow:before {
        content: "\e76b";
        font-size: 21px;
        margin-top: @toolbar-res-margin-top;
        cursor: pointer;
    }

    .e-toolbar .e-display-none, .e-toolbar.e-display-none {
        display: none;
    }

    .e-toolbar .e-display-block, .e-toolbar.e-display-block {
        display: block;
    }

    .e-abs-position {
        position: absolute;
    }

    .e-rel-position {
        position: relative;
        right: 8px;
    }

    .e-rtl .e-rel-position {
        left: 8px;
        right: auto;
    }

    .e-toolbar.e-responsive-toolbar {
        width: 200px;
    }
}

.mixin(@widget) when (@widget = rating), (@widget = none) {

    .e-rating {
        display: inline-block;
        list-style-type: none;
        position: relative;
    }

    .e-rating.e-vertical .e-ul {
        -webkit-margin-before: 0.2em;
    }

    .e-rating.e-horizontal .e-ul, .e-rating.e-vertical .e-ul {
        padding: 0 2px;
        list-style-type: none;
        margin: 0px;
    }

    .e-rating.e-horizontal .e-shape-list, .e-rating.e-horizontal .e-shape, .e-rating.e-horizontal .e-reset {
        float: left;
    }

    .e-rating.e-horizontal .e-shape-list,
    .e-rating.e-vertical .e-shape-list,
    .e-rating.e-horizontal .e-shape,
    .e-rating.e-vertical .e-shape,
    .e-rating.e-horizontal .e-reset,
    .e-rating.e-vertical .e-reset {
        cursor: pointer;
    }

    .e-rating,
    .e-rating .e-shape-list {
        outline: 0 none;
    }
}

.mixin(@widget) when (@widget = progressbar), (@widget = none) {

    .e-progressbar {
        display: block;
        height: @progressbar-height;
        position: relative;
        width: 100%;
        border: 1px solid;

        .border-radius(@radius) when not(@radius = 0px) {
            border-radius: @border-radius;
        }

        .border-radius(@border-radius);
    }

    .e-progressbar .e-progress {
        border: none;
        height: 100%;
        width: 0;
    }

    .e-progressbar .e-progress-txt {
        position: absolute;
        text-align: center;
        width: 100%;
    }
}

.mixin(@widget) when (@widget = slider), (@widget = none) {

    .e-slider {
        display: block;
        outline: 0 none;
        position: relative;
        height: 100%;
        width: 100%;
        z-index: 10;
        border: 1px solid;
    }

    .e-slider-wrap.e-horizontal {
        height: @slider-size;
    }

    .e-slider-wrap.e-vertical {
        height: 100%;
        width: @slider-size;
    }

    .e-slider.e-corner, .e-slider.e-corner .e-handle, .e-slider.e-corner .e-range {
        border-radius: @slider-border-radius;
    }

    .e-slider, .e-slider .e-handle, .e-slider .e-range {
        border-radius: @slider-bs-border-radius;
    }

    .e-slider-wrap.e-horizontal .e-handle {
        top: -3px;
    }

    .e-slider-wrap.e-vertical .e-handle {
        left: -3px;
    }

    .e-slider .e-handle {
        cursor: pointer;
        outline: 0 none;
        position: absolute;
        border: 1px solid;
    }

    .e-slider-wrap.e-horizontal .e-range {
        height: 100%;
        top: 0;
    }

    .e-slider-wrap.e-vertical .e-range {
        left: 0;
        width: 100%;
    }

    .e-slider .e-range {
        border: 0 none;
        display: block;
        position: absolute;
    }

    .e-scale {
        list-style: none outside none;
        outline: 0 none;
        position: relative;
        z-index: 1;
    }

    .e-scale.e-h-scale {
        width: 100%;
    }

    .e-scale.e-v-scale {
        height: 100%;
    }

    .e-scale .e-tick {
        background-color: transparent;
        background-position: center center;
        cursor: default;
        position: relative;
        height: 100%;
    }

    .e-scale .e-tick .e-tick-value {
        font-size: 10px;
        position: absolute;
    }

    .e-h-scale .e-tick {
        background-repeat: repeat-y;
    }

    .e-v-scale .e-tick {
        background-repeat: repeat-x;
    }

    .e-h-scale .e-tick .e-tick-value {
        top: -15px;
    }

    .e-h-scale .e-tick.e-first-tick {
        background-position: left center;
    }

    .e-h-scale .e-tick.e-last-tick {
        background-position: right center;
    }

    .e-rtl .e-h-scale .e-tick.e-first-tick {
        background-position: right center;
    }

    .e-rtl .e-h-scale .e-tick.e-last-tick {
        background-position: left center;
    }

    .e-v-scale .e-tick.e-first-tick {
        background-position: center top;
    }

    .e-v-scale .e-tick.e-last-tick {
        background-position: center bottom;
    }
}

.mixin(@widget) when (@widget = common), (@widget = none) {
    /*SVG*/
    @font-face {
        font-family: 'ej-webfont';
        src: url('@{font-path}/ejicons.eot?-dzszjm');
        src: url('@{font-path}/ejicons.eot?#iefix-dzszjm') format('embedded-opentype'), url('@{font-path}/ejicons.woff?-dzszjm') format('woff'),url('@{font-path}/ejicons.woff') format('woff'), url('@{font-path}/ejicons.ttf?-dzszjm') format('truetype'), url('@{font-path}/ejicons.svg?-dzszjm#ejicons') format('svg');
        font-weight: normal;
        font-style: normal;
    }

    .e-icon, .e-rte-toolbar-icon, .e-background-color, .e-font, .e-rte-footericon, .e-resize-handle {
        font-family: 'ej-webfont';
        speak: none;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
        /* Better Font Rendering */
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }

    .e-icon {
        font-size: 14px;
    }

    .e-rte-toolbar-icon, .e-background-color, .e-font, .e-rte-footericon, .e-rte-footer .e-resize-handle {
        font-size: 16px;
    }

    .e-icon:before, .e-rte-toolbar-icon:before, .e-background-color:before, .e-font:before, .e-rte-footericon:before, .e-resize-handle:before {
        display: block;
        margin: 0 auto;
    }

    .e-rte-toolbar-icon:before, .e-background-color:before, .e-font:before, .e-rte-footericon:before, .e-resize-handle:before {
        width: 16px;
        height: 16px;
    }

    .e-icon:before {
        width: 14px;
        height: 14px;
    }

    .e-grid .e-filterbarcell .e-icon:before {
        display: block;
        margin: 0 auto;
    }

    .e-icon {
        width: 16px;
        height: 16px;
    }
    /*
.e-icon.e-ui-light
{
background-image: url('../@{font-path}/icons-gray.png');
}
.e-icon.e-ui-dark
{
background-image: url('../@{font-path}/icons-white.png');
}
*/
    /* icon positions */
    .e-menu.e-horizontal > .e-list > a span.e-arrowhead-down:before, .e-menu.e-horizontal > .e-list > span span.e-arrowhead-down:before,
    .e-menu.e-horizontal > .e-list:hover > a span.e-arrowhead-down:before, .e-menu.e-horizontal > .e-list:hover > span span.e-arrowhead-down:before,
    /* RTL menu */
    .e-menu.rtl > .e-list > a span.arrows:before, .e-menu.rtl > .e-list > span span.arrows, .e-menu.rtl > .e-list:hover > a span.arrows, .e-menu.rtl > .e-list:hover > span span.arrows:before,
    .e-menu.rtl.e-context > .e-list > a span.arrows:before, .e-menu.rtl.e-context > .e-list > span span.arrows:before,
    .e-menu.rtl.e-vertical > .e-list > a span.arrows:before, .e-menu.rtl.e-vertical > .e-list > span span.arrows:before,
    .e-menu.rtl .e-list > ul > .e-list > a span.arrows:before, .e-menu.rtl .e-list > ul .e-list:hover > span span.arrows:before,
    .e-menu.rtl.e-context > .e-list:hover span.arrows:before, .e-menu.rtl.e-vertical > .e-list:hover span.arrows:before {
        content: "\e627";
    }

    .e-menu .e-list > ul > .e-list > a span.e-arrowhead-right:before, .e-menu .e-list > ul > .e-list > span span.e-arrowhead-right:before,
    .e-menu.e-context > .e-list > a span.e-arrowhead-right:before, .e-menu.e-context > .e-list > span span.e-arrowhead-right:before,
    .e-menu.e-vertical > .e-list > a span.e-arrowhead-right:before, .e-menu.e-vertical > .e-list > span span.e-arrowhead-right:before,
    .e-menu .e-list > ul .e-list:hover > a span.e-arrowhead-right:before, .e-menu .e-list > ul .e-list:hover > span span.e-arrowhead-right:before,
    .e-menu > .e-list:hover > a span.e-arrowhead-right:before, .e-menu > .e-list:hover > span span.e-arrowhead-right:before {
        content: "\e622";
    }

    .e-menu.e-rtl .e-list > ul > .e-list > a span.e-arrowhead-right:before, .e-menu.e-rtl .e-list > ul > .e-list > span span.e-arrowhead-right:before,
    .e-menu.e-rtl.e-context > .e-list > a span.e-arrowhead-right:before, .e-menu.e-rtl.e-context > .e-list > span span.e-arrowhead-right:before,
    .e-menu.e-rtl.e-vertical > .e-list > a span.e-arrowhead-right:before, .e-menu.e-rtl.e-vertical > .e-list > span span.e-arrowhead-right:before,
    .e-menu.e-rtl .e-list > ul .e-list:hover > a span.e-arrowhead-right:before, .e-menu.e-rtl .e-list > ul .e-list:hover > span span.e-arrowhead-right:before {
        content: "\e623";
    }
    /*Map*/
    /* common icon position */
    .e-boardpin:before, .e-icon.e-unpin:before {
        content: "\e684";
    }

    .e-boardpin1:before, .e-icon.e-pin:before {
        content: "\e683";
    }

    .e-upload:before {
        content: "\e678";
    }

    .e-reload:before {
        content: "\e677";
    }

    .e-close:before {
        content: "\e605";
    }

    .e-addnew:before, .e-icon.e-plus:before {
        content: "\e676";
    }

    .e-minus:before, .e-icon.e-minus:before, .e-icon.e-minimize:before {
        content: "\e675";
    }

    .e-rarrowright-2x:before {
        content: "\e674";
    }

    .e-rarrowup-2x:before {
        content: "\e672";
    }

    .e-rarrowdown-2x:before {
        content: "\e673";
    }

    .e-rarrowleft-2x:before {
        content: "\e671";
    }

    .e-login:before {
        content: "\e670";
    }

    .e-orientationlanscape:before {
        content: "\e66f";
    }

    .e-searchfind:before, .e-icon.e-search:before {
        content: "\e66e";
    }

    .e-alignleft:before {
        content: "\e682";
    }

    .e-aligncenter:before {
        content: "\e66d";
    }

    .e-alignright:before {
        content: "\e66b";
    }

    .e-alignjustify:before {
        content: "\e66c";
    }

    .e-alignnone:before {
        content: "\e66a";
    }

    .e-filterset:before {
        content: "\e669";
    }

    .e-filternone:before {
        content: "\e668";
    }
    /**/
    .e-arrowheadup-2x:before {
        content: "\e667";
    }

    .e-arrowheaddown-2x:before {
        content: "\e666";
    }

    .e-arrowheadleft:before, .e-arrowheadleft-2x:before, .e-icon.e-left-arrow:before, .e-rtl .e-icon.e-right-arrow:before, :not(.e-splitter).e-rtl .e-icon.e-arrow-sans-right:before {
        content: "\e665";
    }

    .e-arrowheadright:before, .e-arrowheadright-2x:before, .e-icon.e-right-arrow:before, .e-rtl .e-icon.e-left-arrow:before, :not(.e-splitter).e-rtl .e-icon.e-arrow-sans-left:before {
        content: "\e664";
    }

    .e-numbering:before {
        content: "\e663";
    }

    .e-bullets:before {
        content: "\e661";
    }

    .e-maximize:before {
        content: "\e660";
    }

    .e-icon.e-delete:before {
        content: "\e681";
    }

    .e-chevron-circle-right:before {
        content: "\e73f";
    }

    .e-chevron-circle-left:before {
        content: "\e740";
    }

    .e-mediaback:before {
        content: "\e65f";
    }

    .e-mediaforward:before {
        content: "\e65e";
    }
    .e-arrowheadright-2x:before{
          content: "\e664";
    }
     .e-arrowheadleft-2x:before{
         content: "\e665";
     }

    .e-medianext:before {
        content: "\e65d";
    }

    .e-mediaprev:before {
        content: "\e65c";
    }

    .e-mediaeject:before {
        content: "\e65a";
    }

    .e-mediaclose:before {
        content: "\e65b";
    }

    .e-mediapause:before {
        content: "\e659";
    }

    .e-mediaplay:before {
        content: "\e658";
    }

    .e-righttick:before, .e-icon.e-checkmark:before {
        content: "\e657";
    }

    .e-cancel:before, .e-icon.e-file-cancel:before, .e-icon.e-file-percentage-failed:before {
        content: "\e656";
    }

    .e-smile:before {
        content: "\e655";
    }

    .e-information:before {
        content: "\e654";
    }
    /**/
    .e-cut:before {
        content: "\e680";
    }

    .e-edit:before {
        content: "\e653";
    }

    .e-swapleft:before {
        content: "\e652";
    }

    .e-swapright:before {
        content: "\e651";
    }

    .e-swapup:before {
        content: "\e650";
    }

    .e-swapdown:before {
        content: "\e64f";
    }

    .e-zoomin:before {
        content: "\e64e";
    }

    .e-zoomout:before {
        content: "\e64d";
    }

    .e-warningmessage:before {
        content: "\e64c";
    }

    .e-cursor:before {
        content: "\e64b";
    }

    .e-shoppingcart:before {
        content: "\e64a";
    }

    .e-handup:before {
        content: "\e648";
    }

    .e-palette:before {
        content: "\e67f";
    }

    .e-star:before {
        content: "\e647";
    }

    .e-copy:before {
        content: "\e646";
    }

    .e-paste:before {
        content: "\e645";
    }

    .e-settings:before {
        content: "\e644";
    }

    .e-clock:before {
        content: "\e643";
    }

    .e-hyperlink:before {
        content: "\e642";
    }

    .e-hyperlinkbreak:before {
        content: "\e641";
    }
    /**/
    .e-resizers:before, .e-icon.e-resize-handle:before, .e-resize-handle:before {
        content: "\e640";
    }

    .e-home:before {
        content: "\e63f";
    }

    .e-clipboard:before {
        content: "\e63e";
    }

    .e-userlogin:before {
        content: "\e63d";
    }

    .e-dataexport:before {
        content: "\e63c";
    }

    .e-arrowheadright:before {
        content: "\e658";
    }

    .e-arrowhead-down:before, .e-icon.e-down-arrow:before {
        content: "\e63b";
    }

    .e-arrowheadup:before, .e-icon.e-up-arrow:before {
        content: "\e63a";
    }

    .e-arrowheadleft:before {
        content: "\e639";
    }

    .e-undo:before {
        content: "\e637";
    }

    .e-redo:before {
        content: "\e638";
    }

    .e-bold:before {
        content: "\e636";
    }

    .e-italic:before {
        content: "\e635";
    }

    .e-underline:before {
        content: "\e634";
    }

    .e-strikethrough:before {
        content: "\e633";
    }

    .e-font:before {
        content: "\e632";
    }

    .e-rarrowdown:before {
        content: "\e631";
    }

    .e-rarrowleft:before {
        content: "\e630";
    }

    .e-rarrowup:before {
        content: "\e67d";
    }

    .e-rarrowright:before {
        content: "\e62f";
    }
    /**/
    .e-calender:before {
        content: "\e62e";
    }

    .e-datetimecalendar:before,
    .e-icon.e-datetime:before {
        content: "\e62d";
    }

    .e-icon.e-collapse-arrow:before {
        content: "\e624";
    }

    .e-icon.e-expand-arrow:before {
        content: "\e622";
    }

    .e-icon.e-maximize:before {
        content: "\e61e";
    }

    .e-icon.e-restore:before {
        content: "\e61d";
    }

    .e-icon.e-reload:before {
        content: "\e677";
    }

    .e-icon.e-plus:before {
        content: "\e676";
    }

    .e-icon.e-minus:before {
        content: "\e675";
    }

    .e-rtl .e-icon.e-plus:before {
        content: "\e676";
    }

    .e-rtl .e-icon.e-minus:before {
        content: "\e675";
    }

    .e-gridgroupbutton:before {
        content: "\e61c";
    }

    .e-gnextmedia {
        background-position: -51px -84px;
    }

    .e-gnext {
        background-position: -336px -84px;
    }

    .e-gprevmedia {
        background-position: -103px -84px;
    }

    .e-gprev {
        background-position: -313px -84px;
    }

    .e-gadd {
        background-position: -103px 1px;
    }

    .e-gedit {
        background-position: -26px -41px;
    }

    .e-gdelete {
        background-position: -181px -20px;
    }

    .e-save:before {
        content: "\e620";
    }

    .e-insertInbetween:before {
        content: "\e70c";
    }

    .e-insertInbetween-rtl:before {
        content: "\e70a";
    }

    .e-gcancel {
        background-position: -440px -20px;
    }

    .e-gsearch {
        background-position: -310px 4px;
    }

    .e-gdiagonalnext:before {
        content: "\e67c";
    }

    .e-gnextforward:before {
        content: "\e67e";
    }

    .e-gupward {
        background-position: -204px 2px;
    }

    .e-gdownward {
        background-position: -180px 2px;
    }

    .e-gclose {
        background-position: -445px -22px;
    }

    .e-guparrow:before {
        content: "\e625";
    }

    .e-gdownarrow:before {
        content: "\e627";
    }

    .e-gupdatenotify:before {
        content: "\e6ff";
        font-size: 10px;
    }
    /* Control Icon Properties */
    .e-datewidget .e-calendar.e-icon:before,
    .e-datetime-wrap .e-datetime.e-icon:before {
        height: 21px;
        width: 21px;
    }

    .e-timewidget .e-arrow-sans-down.e-icon:before,
    .e-ddl .e-arrow-sans-down.e-icon:before {
        height: 12px;
        width: 12px;
    }

    .e-numeric .e-icon:before,
    .e-percent .e-icon:before,
    .e-currency .e-icon:before {
        height: 8px;
        width: 10px;
    }

    .e-treeview-wrap .e-icon.e-plus:before {
        content: "\e664";
        font-size: 11px;
        width: 10px;
        height: 10px;
    }

    .e-treeview-wrap.e-rtl .e-icon.e-load:before,
    .e-treeview-wrap .e-icon.e-load:before {
        content: "";
    }

    .e-treeview-wrap .e-icon.e-minus:before {
        content: "\e67c";
        font-size: 8px;
        height: 10px;
        width: 10px;
    }

    .e-treeview-wrap.e-rtl .e-icon.e-plus:before {
        content: "\e665";
    }

    .e-treeview-wrap.e-rtl .e-icon.e-minus:before {
        content: "\e624";
    }

    .e-splitter .e-splitbar > .e-icon:before {
        height: 100%;
        width: 100%;
        font-size: 13px;
    }

    .e-splitter .e-splitbar > .e-icon.v-backward:before, .e-splitter .e-splitbar > .e-icon.e-arrow-sans-left:before {
        font-size: 12px;
    }

    .e-splitter .h-backward:before {
        content: "\e665";
    }

    .e-splitter .h-forward:before {
        content: "\e664";
    }

    .e-splitter .v-backward:before {
        content: "\e667";
    }

    .e-splitter .v-forward:before {
        content: "\e666";
    }

    .e-rowselect:before {
        content: "\e701";
    }

    .e-sortdirect:before {
        content: "\e700";
    }

    .e-tab .e-icon.e-close:before, .e-uploadbox.e-dialog .e-close:before {
        content: "\e605";
    }

    .e-tab .e-icon.e-chevron-circle-right:before {
        content: "\e73f";
    }

    .e-tab .e-icon.e-chevron-circle-left:before {
        content: "\e740";
    }

    .e-dialog .e-icon.e-collapse-arrow:before {
        content: "\e625";
    }

    .e-dialog .e-icon.e-expand-arrow:before {
        content: "\e627";
    }

    .e-scrollbar .e-vup.e-icon:before {
        content: "\e672";
        left: 5px;
    }

    .e-scrollbar .e-vdown.e-icon:before {
        content: "\e673";
    }

    .e-scrollbar .e-hup.e-icon:before {
        content: "\e671";
    }

    .e-scrollbar .e-hdown.e-icon:before {
        content: "\e674";
    }
    /*-------------------------------------Icons----------------------------------------------------------*/
    .e-icon.e-shrink:before {
        content: "\e600";
    }

    .e-icon.e-full-screen-collapse:before {
        content: "\e787";
    }

    .e-icon.e-list:before {
        content: "\e601";
    }

    .e-icon.e-list-numbered_01:before {
        content: "\e7a6";
    }

    .e-icon.e-indent:before {
        content: "\e603";
    }

    .e-icon.e-indent_01:before {
        content: "\e614";
    }

    .e-icon.e-outdent:before {
        content: "\e604";
    }

    .e-icon.e-outdent_01:before {
        content: "\e613";
    }

    .e-icon.e-close_01:before {
        content: "\e74e";
    }

    .e-icon.e-redo:before {
        content: "\e606";
    }

    .e-icon.e-redo_01:before {
        content: "\e737";
    }

    .e-icon.e-undo:before {
        content: "\e607";
    }

    .e-icon.e-undo_01:before {
        content: "\e736";
    }

    .e-icon.e-video_01:before {
        content: "\e608";
    }

    .e-icon.e-cross-circle:before {
        content: "\e60a";
    }

    .e-icon.e-clean-brush:before {
        content: "\e60b";
    }

    .e-icon.e-delete-column:before {
        content: "\e60c";
    }

    .e-icon.e-delete-row:before {
        content: "\e60d";
    }

    .e-icon.e-insert-column-left:before {
        content: "\e60e";
    }

    .e-icon.e-insert-column-left_01:before {
        content: "\e788";
    }

    .e-icon.e-insert-column-right:before {
        content: "\e60f";
    }

    .e-icon.e-insert-column-right_01:before {
        content: "\e789";
    }

    .e-icon.e-insert-row-below:before {
        content: "\e610";
    }

    .e-icon.e-insert-row-below_01:before {
        content: "\e78b";
    }

    .e-icon.e-insert-row-above:before {
        content: "\e611";
    }

    .e-icon.e-insert-row-above_01:before {
        content: "\e78a";
    }

    .e-icon.e-table:before {
        content: "\e612";
    }

    .e-icon.e-sigma:before {
        content: "\e615";
    }

    .e-icon.e-sigma_01:before {
        content: "\e735";
    }

    .e-icon.e-uppercase:before {
        content: "\e616";
    }

    .e-icon.e-lowercase:before {
        content: "\e617";
    }

    .e-icon.e-background-color:before {
        content: "\e618";
    }

    .e-icon.e-superscript:before {
        content: "\e61a";
    }

    .e-icon.e-subscript:before {
        content: "\e61b";
    }

    .e-icon.e-download:before {
        content: "\e61f";
    }

    .e-icon.e-save_01:before {
        content: "\e6b7";
    }

    .e-icon.e-mail:before, .e-icon.e-message:before {
        content: "\e621";
    }

    .e-icon.e-arrowhead-right_01:before {
        content: "\e7d3";
    }

    .e-icon.e-arrowhead-left:before {
        content: "\e623";
    }

    .e-icon.e-arrowhead-left_01:before {
        content: "\e7d2";
    }

    .e-icon.e-datetime_01:before {
        content: "\e733";
    }

    .e-icon.e-calendar_01:before {
        content: "\e75e";
    }

    .e-icon.e-calendar-plus:before {
        content: "\e759";
    }

    .e-icon.e-calendar-edit:before {
        content: "\e77c";
    }

    .e-icon.e-chevron-right_02:before {
        content: "\e69b";
    }

    .e-icon.e-chevron-left_02:before {
        content: "\e68b";
    }

    .e-icon.e-bold_01:before {
        content: "\e79b";
    }

    .e-icon.e-link:before {
        content: "\e794";
    }

    .e-icon.e-external-link:before {
        content: "\e73e";
    }

    .e-icon.e-external-link_01:before {
        content: "\e744";
    }

    .e-icon.e-copy_01:before {
        content: "\e77f";
    }

    .e-icon.e-zoom-in_02:before {
        content: "\e738";
    }

    .e-icon.e-zoom-out_02:before {
        content: "\e739";
    }

    .e-icon.e-arrow-circle-left_03:before {
        content: "\e778";
    }

    .e-icon.e-edit_02:before {
        content: "\e705";
    }

    .e-icon.e-edit_03:before {
        content: "\e749";
    }

    .e-icon.e-edit_05:before {
        content: "\e783";
    }

    .e-icon.e-notification_01:before {
        content: "\e6c3";
    }

    .e-icon.e-media-forward_01:before {
        content: "\e62c";
    }

    .e-icon.e-play-circle:before {
        content: "\e685";
    }

    .e-icon.e-media-fast-forward:before {
        content: "\e7ce";
    }

    .e-icon.e-full-screen-expand:before {
        content: "\e786";
    }

    .e-icon.e-full-screen-expand_01:before {
        content: "\e793";
    }

    .e-icon.e-filter-settings:before {
        content: "\e753";
    }

    .e-icon.e-search_01:before {
        content: "\e729";
    }

    .e-icon.e-image_01:before {
        content: "\e7ba";
    }

    .e-icon.e-minus_01:before {
        content: "\e693";
    }

    .e-icon.e-plus_01:before {
        content: "\e691";
    }

    .e-icon.e-code_01:before {
        content: "\e780";
    }

    .e-icon.e-code-hexagon:before {
        content: "\e77e";
    }

    .e-icon.e-cut_01:before {
        content: "\e7a0";
    }

    .e-icon.e-delete_01:before {
        content: "\e69d";
    }

    .e-icon.e-delete_02:before {
        content: "\e6d8";
    }

    .e-icon.e-delete_04:before {
        content: "\e706";
    }

    .e-icon.e-stop:before {
        content: "\e694";
    }

    .e-icon.e-circle-square:before {
        content: "\e6a5";
    }

    .e-icon.e-vertical-barchart:before {
        content: "\e6a6";
    }

    .e-icon.e-fullborders:before {
        content: "\e6a7";
    }

    .e-icon.e-diagonal-square:before {
        content: "\e6a8";
    }

    .e-icon.e-3d:before {
        content: "\e6a9";
    }

    .e-icon.e-file-excel:before {
        content: "\e6aa";
    }

    .e-icon.e-file-text:before {
        content: "\e6ab";
    }

    .e-icon.e-file-text_01:before {
        content: "\e6b5";
    }

    .e-icon.e-file-mdx:before {
        content: "\e6ac";
    }

    .e-icon.e-file-empty:before {
        content: "\e6ad";
    }

    .e-icon.e-hexagon-square:before {
        content: "\e6ae";
    }

    .e-icon.e-globe:before {
        content: "\e6af";
    }

    .e-icon.e-globe_01:before {
        content: "\e734";
    }

    .e-icon.e-file-delete_01:before {
        content: "\e6b4";
    }

    .e-icon.e-pentagon-square:before {
        content: "\e6b6";
    }

    .e-icon.e-vertical-barchart_01:before {
        content: "\e6bd";
    }

    .e-icon.e-triangle:before {
        content: "\e6bf";
    }

    .e-icon.e-inverted-triangle:before {
        content: "\e6b0";
    }

    .e-icon.e-power-cord:before {
        content: "\e6c1";
    }

    .e-icon.e-comments:before {
        content: "\e6c2";
    }

    .e-icon.e-horizontal-barchart:before {
        content: "\e6c5";
    }

    .e-icon.e-horizontal-barchart_01:before {
        content: "\e6c6";
    }

    .e-icon.e-triangle:before {
        content: "\e6bf";
    }

    .e-icon.e-inverted-triangle:before {
        content: "\e6b0";
    }

    .e-icon.e-pyramid:before {
        content: "\e6c9";
    }

    .e-icon.e-inverted-pyramid:before {
        content: "\e6c8";
    }

    .e-icon.e-pie-chart:before {
        content: "\e6ca";
    }

    .e-icon.e-table_01:before {
        content: "\e72d";
    }

    .e-icon.e-folder:before {
        content: "\e6e1";
    }

    .e-icon.e-folder-open:before {
        content: "\e6dd";
    }

    .e-icon.e-signal:before {
        content: "\e6e3";
    }

    .e-icon.e-print:before {
        content: "\e715";
    }

    .e-icon.e-word_01:before {
        content: "\e71d";
    }

    .e-icon.e-word-export:before {
        content: "\e6d5";
    }

    .e-icon.e-pdf_01:before {
        content: "\e71b";
    }

    .e-icon.e-pdf-export:before {
        content: "\e6d3";
    }

    .e-icon.e-excel_01:before {
        content: "\e71a";
    }

    .e-icon.e-excel-export:before {
        content: "\e6d4";
    }

    .e-icon.e-powerpoint-export:before {
        content: "\e6d2";
    }

    .e-icon.e-ie:before {
        content: "\e71c";
    }

    .e-icon.e-documents:before {
        content: "\e743";
    }

    .e-icon.e-question:before {
        content: "\e72b";
    }

    .e-icon.e-film:before {
        content: "\e732";
    }

    .e-icon.e-volume-up:before {
        content: "\e73c";
    }

    .e-icon.e-circle-four:before {
        content: "\e745";
    }

    .e-icon.e-circle-one:before {
        content: "\e746";
    }

    .e-icon.e-circle-two:before {
        content: "\e747";
    }

    .e-icon.e-circle-three:before {
        content: "\e748";
    }

    .e-icon.e-arrow-down:before {
        content: "\e74c";
    }

    .e-icon.e-arrow-down_01:before {
        content: "\e7cc";
    }

    .e-icon.e-arrow-left_01:before {
        content: "\e74d";
    }

    .e-icon.e-sync:before {
        content: "\e752";
    }

    .e-icon.e-sync-disabled:before {
        content: "\e754";
    }

    .e-icon.e-paperclip:before {
        content: "\e772";
    }

    .e-icon.e-paperclip_01:before {
        content: "\e78f";
    }

    .e-icon.e-circle:before {
        content: "\e782";
    }

    .e-icon.e-circle_01:before {
        content: "\e686";
    }

    .e-icon.e-clear:before {
        content: "\e756";
    }

    .e-icon.e-file-html:before {
        content: "\e798";
    }

    .e-icon.e-th:before {
        content: "\e7bc";
    }

    .e-icon.e-th-small:before {
        content: "\e7bd";
    }

    .e-icon.e-file-resize-four-direction:before {
        content: "\e7d7";
    }

    .e-icon.e-file-resize-horizontal:before {
        content: "\e7d8";
    }

    .e-icon.e-media-backward_01:before {
        content: "\e62a";
    }

    .e-icon.e-chevron-right_01:before {
        content: "\e674";
    }

    .e-icon.e-chevron-down_01:before {
        content: "\e673";
    }

    .e-icon.e-chevron-up_01:before {
        content: "\e672";
    }

    .e-icon.e-chevron-left_01:before {
        content: "\e671";
    }

    .e-icon.e-key:before {
        content: "\e670";
    }

    .e-icon.e-align-left:before {
        content: "\e682";
    }

    .e-icon.e-align-center:before {
        content: "\e66d";
    }

    .e-icon.e-align-right:before {
        content: "\e66b";
    }

    .e-icon.e-align-justify:before {
        content: "\e66c";
    }

    .e-icon.e-align-none:before {
        content: "\e66a";
    }

    .e-icon.e-filter:before {
        content: "\e669";
    }

    .e-icon.e-list-numbered:before {
        content: "\e663";
    }

    .e-icon.e-chevron-circle-right:before {
        content: "\e73f";
    }

    .e-icon.e-chevron-circle-left:before {
        content: "\e740";
    }

    .e-icon.e-media-backward:before {
        content: "\e65f";
    }

    .e-icon.e-media-forward:before {
        content: "\e65e";
    }

    .e-icon.e-media-previous:before {
        content: "\e65d";
    }

    .e-icon.e-media-next:before {
        content: "\e65c";
    }

    .e-icon.e-media-eject:before {
        content: "\e65b";
    }

    .e-icon.e-media-pause:before {
        content: "\e659";
    }

    .e-icon.e-media-play:before {
        content: "\e658";
    }

    .e-icon.e-checkmark:before {
        content: "\e657";
    }

    .e-icon.e-smiley:before {
        content: "\e655";
    }

    .e-icon.e-notification:before {
        content: "\e654";
    }

    .e-icon.e-arrow-circle-right:before {
        content: "\e652";
    }

    .e-icon.e-arrow-circle-down:before {
        content: "\e651";
    }

    .e-icon.e-arrow-circle-left:before {
        content: "\e650";
    }

    .e-icon.e-arrow-circle-up:before {
        content: "\e64f";
    }

    .e-icon.e-zoom-in:before {
        content: "\e64e";
    }

    .e-icon.e-zoom-out:before {
        content: "\e64d";
    }

    .e-icon.e-warning:before {
        content: "\e64c";
    }

    .e-icon.e-pointer:before {
        content: "\e648";
    }

    .e-icon.e-unlink:before {
        content: "\e641";
    }

    .e-icon.e-user:before {
        content: "\e63d";
    }

    .e-icon.e-export:before {
        content: "\e63c";
    }

    .e-icon.e-arrow-sans-down:before {
        content: "\e63b";
    }

    .e-icon.e-arrow-sans-up:before {
        content: "\e63a";
    }

    .e-icon.e-arrow-sans-left:before {
        content: "\e639";
    }

    .e-icon.e-reply:before {
        content: "\e637";
    }

    .e-icon.e-forward:before {
        content: "\e638";
    }

    .e-icon.e-chevron-down:before {
        content: "\e631";
    }

    .e-icon.e-chevron-left:before {
        content: "\e630";
    }

    .e-icon.e-chevron-up:before {
        content: "\e67d";
    }

    .e-icon.e-chevron-right:before {
        content: "\e62f";
    }

    .e-icon.e-calendar:before {
        content: "\e62e";
    }

    .e-icon.e-arrowhead-right:before {
        content: "\e622";
    }

    .e-icon.e-arrow-sans-right:before {
        content: "\e67e";
    }

    .e-icon.e-arrowhead-up:before {
        content: "\e625";
    }

    .e-icon.e-arrowhead-down:before {
        content: "\e627";
    }

    .e-icon.e-print_02:before {
        content: "\e741";
    }

    .e-icon.e-excel:before {
        content: "\e718";
    }

    .e-icon.e-word:before {
        content: "\e716";
    }

    .e-icon.e-pdf:before {
        content: "\e717";
    }

    .e-icon.e-edit_04:before {
        content: "\e7c2";
    }

    .e-icon.e-delete_03:before {
        content: "\e7c1";
    }

    .e-icon.e-save_02:before {
        content: "\e7c8";
    }

    .e-icon.e-sort-alpha-asc_01:before {
        content: "\e7ca";
    }

    .e-icon.e-sort-alpha-desc_01:before {
        content: "\e7c9";
    }

    .e-icon.e-arrow-sans-right_01:before {
        content: "\e7c6";
    }

    .e-icon.e-media-forward_03:before {
        content: "\e7c5";
    }

    .e-icon.e-arrow-sans-left_01:before {
        content: "\e7c7";
    }

    .e-icon.e-media-backward_03:before {
        content: "\e7c3";
    }

    .e-icon.e-full-screen-collapse_01:before {
        content: "\e792";
    }

    .e-icon.e-italic_01:before {
        content: "\e7a4";
    }

    .e-icon.e-underline_01:before {
        content: "\e7ad";
    }

    .e-icon.e-strikethrough_01:before {
        content: "\e7aa";
    }

    .e-icon.e-align-left_01:before {
        content: "\e799";
    }

    .e-icon.e-align-center_01:before {
        content: "\e79d";
    }

    .e-icon.e-align-right_01:before {
        content: "\e79a";
    }

    .e-icon.e-align-justify_01:before {
        content: "\e7a5";
    }

    .e-icon.e-bullets_01:before {
        content: "\e79c";
    }

    .e-icon.e-filternone_01:before {
        content: "\e751";
    }

    .e-icon.e-copy_02:before {
        content: "\e79f";
    }

    .e-icon.e-paste_01:before {
        content: "\e7a7";
    }

    .e-icon.e-link_01:before {
        content: "\e7b6";
    }

    .e-icon.e-unlink_01:before {
        content: "\e7b4";
    }

    .e-icon.e-image:before {
        content: "\e7a8";
    }

    .e-icon.e-video:before {
        content: "\e797";
    }

    .e-icon.e-table_02:before {
        content: "\e78c";
    }

    .e-icon.e-insert-row-above_02:before {
        content: "\e7b0";
    }

    .e-icon.e-insert-row-below_02:before {
        content: "\e7b1";
    }

    .e-icon.e-insert-column-left_02:before {
        content: "\e7b2";
    }

    .e-icon.e-insert-column-right_02:before {
        content: "\e7b3";
    }

    .e-icon.e-delete-row_01:before {
        content: "\e78e";
    }

    .e-icon.e-delete-column_01:before {
        content: "\e78d";
    }

    .e-icon.e-superscript_01:before {
        content: "\e7ac";
    }

    .e-icon.e-subscript_01:before {
        content: "\e7ab";
    }

    .e-icon.e-uppercase_01:before {
        content: "\e796";
    }

    .e-icon.e-lowercase_01:before {
        content: "\e791";
    }

    .e-icon.e-file-code:before {
        content: "\e7b5";
    }

    .e-icon.e-delete_05:before {
        content: "\e7a2";
    }

    .e-icon.e-arrow-left:before {
        content: "\e74b";
    }

    .e-icon.e-arrow-right:before {
        content: "\e74a";
    }

    .e-icon.e-print_01:before {
        content: "\e71f";
    }

    .e-icon.e-exit:before {
        content: "\e720";
    }

    .e-icon.e-file-settings:before {
        content: "\e6d1";
    }

    .e-icon.e-media-backward_04:before {
        content: "\e721";
    }

    .e-icon.e-filter_01:before {
        content: "\e728";
    }

    .e-icon.e-file-list:before {
        content: "\e719";
    }

    .e-icon.e-document:before {
        content: "\e72a";
    }

    .e-icon.e-media-forward_04:before {
        content: "\e724";
    }

    .e-icon.e-zoom-in_01:before {
        content: "\e725";
    }

    .e-icon.e-print_03:before {
        content: "\e7d0";
    }

    .e-icon.e-zoom-out_01:before {
        content: "\e726";
    }

    .e-icon.e-media-backward_02:before {
        content: "\e7d1";
    }

    .e-icon.e-media-forward_02:before {
        content: "\e7d4";
    }

    .e-icon.e-sort-alpha-asc:before {
        content: "\e714";
    }

    .e-icon.e-sort-alpha-desc:before {
        content: "\e713";
    }

    .e-icon.e-folder_01:before {
        content: "\e768";
    }

    .e-icon.e-folder-open_01:before {
        content: "\e769";
    }

    .e-icon.e-checkmark_01:before {
        content: "\e77a";
    }

    .e-icon.e-folder-add:before {
        content: "\e76a";
    }

    .e-icon.e-arrow-circle-left_01:before {
        content: "\e773";
    }

    .e-icon.e-arrow-circle-right_01:before {
        content: "\e774";
    }

    .e-icon.e-arrow-up:before {
        content: "\e74f";
    }

    .e-icon.e-arrow-circle-left_02:before {
        content: "\e775";
    }

    .e-icon.e-arrow-circle-right_02:before {
        content: "\e776";
    }

    .e-icon.e-info:before {
        content: "\e777";
    }

    .e-icon.e-edit_01:before {
        content: "\e69c";
    }

    .e-icon.e-th-list:before {
        content: "\e7b9";
    }

    .e-icon.e-th-large:before {
        content: "\e7bb";
    }

    .e-icon.e-shoppingcart_01:before {
        content: "\e649";
    }

    .e-icon.e-enlarge:before {
        content: "\e679";
    }

    .e-icon.e-code:before {
        content: "\e67b";
    }

    .e-icon.e-view-details:before {
        content: "\e7be";
    }
    /*-----------------------------------Icons end-------------------------------------------*/
}

.mixin(@widget) when (@widget = scroller), (@widget = none) {

    .e-scrollbar {
        background-color: #ecedee;
        cursor: default;
    }

    .e-scrollbar.e-hscrollbar {
        float: left;
    }

    .e-scrollbar .e-hhandlespace,
    .e-scrollbar .e-hup,
    .e-scrollbar .e-hdown,
    .e-scrollbar.e-rtl .e-vscroll {
        float: left;
    }

    .e-scrollbar .e-hhandlespace,
    .e-scrollbar .e-hup,
    .e-scrollbar .e-hdown {
        height: inherit;
        display: inline-block;
    }

    .e-scrollbar .e-hhandle, .e-scrollbar .e-hscroll {
        height: inherit;
    }

    .e-scrollbar .e-vscroll .e-button.e-icon {
        width: inherit;
    }

    .e-scrollbar .e-hscroll .e-button.e-icon, .e-scrollbar .e-vscroll .e-button.e-icon {
        display: table;
    }

    .e-scrollbar .e-icon {
        font-size: 9px;
    }

    .e-scrollbar .e-vhandle.e-v-line {
        width: 100%;
        margin: 0 auto;
    }

    .e-scrollbar .e-v-line:before {
        width: 16px;
    }

    .e-scrollbar .e-vscroll .e-icon:before,
    .e-scrollbar .e-hscroll .e-icon:before {
        height: inherit;
        text-align: center;
        display: table-cell;
        vertical-align: middle;
    }

    .e-scrollbar .e-vscroll .e-button.e-icon:before,
    .e-scrollbar .e-hscroll .e-button.e-icon:before,
    .e-scrollbar .e-hscroll .e-hhandle.e-icon:before {
        width: inherit;
    }

    .e-scrollbar .e-vscroll,
    .e-scrollbar .e-hscroll,
    .e-scrollbar .e-unselectable {
        -moz-user-select: -moz-none;
        -khtml-user-select: none;
        -webkit-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

    .e-scrollbar .e-vscroll {
        vertical-align: top;
        width: inherit;
        float: right;
    }

    .e-scrollbar .e-vhandle,
    .e-scrollbar .e-hhandle,
    .e-scrollbar .e-button {
        position: relative;
    }

    .e-scrollbar.e-rtl {
        direction: rtl;
    }

    .e-scrollbar.e-rtl .e-content,
    .e-scrollbar.e-rtl .e-hscroll {
        float: right;
    }

    .e-scroller, .e-scroller > .e-content {
        overflow: hidden;
    }

    .e-scroller.e-autohide {
        position: relative;
    }

    .e-scroller.e-autohide .e-vscrollbar,
    .e-scroller.e-autohide .e-vscroll {
        position: absolute;
        right: 0;
    }

    .e-scroller.e-autohide .e-hscrollbar,
    .e-scroller.e-autohide .e-hscroll {
        position: absolute;
        bottom: 0;
    }

    .e-scroller > .e-content, .e-scroller.e-rtl .e-vscrollbar, .e-scroller.e-rtl .e-vscroll,
    .e-scroller .e-hscroll, .e-scroller .e-hscroll .e-hhandle {
        float: left;
    }

    .e-scroller.e-rtl .e-content, .e-scroller.e-rtl .e-hscrollbar,
    .e-scroller.e-rtl .e-hscroll, .e-scroller.e-rtl .e-hscroll .e-hhandle {
        float: right;
    }

    .e-scroller .e-vscrollbar {
        float: right;
    }

    .e-scroller .e-hscrollbar {
        float: left;
    }

    .e-scroller.e-rtl {
        direction: rtl;
    }

    .e-scroller.e-rtl > .e-content, .e-scroller.e-rtl .e-hscroll {
        float: right;
    }
}

.mixin(@widget) when (@widget = datetimepicker), (@widget = none) {

    .e-datetime-wrap.e-error .e-in-wrap {
        border-color: #FF0000;
    }

    .e-datetime-wrap {
        display: block;
        overflow: visible;
        width: 143px;
        height: @input-height;
    }

    .e-datetime-wrap .e-padding {
        padding: 0 24px 0 0;
    }

    .e-datetime-wrap .e-icon {
        display: block;
        width: 100%;
        position: absolute;
        top: 50%;
    }

    .e-datetime-wrap .e-select {
        cursor: pointer;
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        width: 23px;
        height: 100%;
        text-align: left;
        border-left: 1px solid;
    }

    .e-datetime-wrap.e-rtl .e-select {
        border-right: 1px solid;
        border-left: none;
        right: auto;
    }

    .e-datetime-wrap.e-rtl .e-padding {
        padding: 0 0 0 24px;
    }

    .e-datetime-wrap .e-icon {
        font-size: 21px;
        height: 21px;
        margin-top: -11px;
    }

    .e-datetime-popup {
        cursor: default;
        overflow: auto;
        position: absolute;
        border: 1px solid;
        outline: 0 none;
        box-shadow: @box-shadow;
    }

    .e-datetime-wrap .e-datetime {
        background-position: -26px -85px;
    }

    .e-datetime-popup .e-popup-container {
        display: inline-flex;
        padding:5px;
    }

    .e-datetime-popup .e-button-container {
        display: block;
        padding: 0 5px 5px;
    }

    .e-datetime-popup .e-datecontainer, .e-datetime-popup .e-timecontainer {
        display: inline-block;
    }

    .e-datetime-popup .e-datecontainer {
        float: left;
        margin: 0 5px 0 0;
    }

    .e-datetime-popup.e-rtl .e-datecontainer {
        float: right;
        margin: 0 0 0 5px;
    }

    .e-datetime-popup .e-timecontainer .e-time-popup {
        border-top: medium none;
    }

    .e-datetime-popup .e-timecontainer .e-header {
        border-style: solid solid none;
        border-width: 1px;
    }

    .e-datetime-popup.e-corner .e-header {
        border-radius: 4px 4px 0 0;
    }

    .e-datetime-popup.e-corner .e-time-popup {
        border-radius: 0 0 4px 4px;
    }

    .e-datetime-popup .e-timecontainer.e-focus {
        border-radius: 4px;
    }

    .e-datetime-popup .e-dt-button {
        cursor: pointer;
        display: inline-block;
        padding: 3px 28px;
        text-align: center;
        border: 1px solid;
    }

    .e-datetime-popup .e-dt-button.e-dt-today {
        margin: 0 5px 0 0;
    }

    .e-datetime-popup.e-rtl .e-dt-button.e-dt-today {
        margin: 0 0 0 5px;
    }

    .e-datetime-popup .e-dt-button.e-dt-done {
        float: right;
    }

    .e-datetime-popup.e-rtl .e-dt-button.e-dt-done {
        float: left;
    }

    .e-dt-responsive.e-datetime-popup .e-popup-container {
        display: inline-block;
    }

    .e-dt-responsive.e-datetime-popup .e-datecontainer {
        float: none;
        margin: 0 0 5px 0;
    }

    .e-dt-responsive.e-datetime-popup .e-dt-button.e-dt-today, .e-dt-responsive.e-datetime-popup .e-dt-button.e-dt-now {
        margin: 0 8px 0 0;
    }

    .e-dt-responsive.e-datetime-popup .e-dt-button {
        padding: 3px 14px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        vertical-align: top;
    }

    .e-dt-responsive.e-datetime-popup .e-datecontainer, .e-dt-responsive.e-datetime-popup .e-timecontainer {
        display: block;
    }

    .e-dt-responsive.e-datetime-popup .e-dt-button.e-dt-today {
        width: 36px;
    }

    .e-dt-responsive.e-datetime-popup .e-dt-button.e-dt-now {
        width: 59px;
    }

    .e-dt-responsive.e-datetime-popup .e-dt-button.e-dt-done {
        width: 31px;
    }

    .e-drill-down.e-datetime-popup {
        border: 0px;
    }

    .e-drill-down.e-datetime-popup .e-popup-container {
        padding: 0px;
    }

    .e-drill-down.e-datetime-popup .e-datecontainer {
        margin: 0px;
    }

    .e-datetime-popup .e-dp-viewhours .e-timepicker-hours .e-state-default,
    .e-datetime-popup .e-dp-viewmins .e-timepicker-mins .e-state-default {
        height: 26px;
        border: 0 none;
    }

    .e-drillDowncontainer .e-timepicker table {
        box-sizing: content-box;
        border-collapse: collapse;
        border-style: none;
        position: relative;
        table-layout: fixed;
        *table-layout: auto;
        text-align: center;
        width: 100%;
    }

    .e-drillDowncontainer .e-timepicker table td {
        cursor: pointer;
        border: medium none;
        vertical-align: middle;
        text-align: center;
    }

    .e-drillDowncontainer .e-dp-viewhours td,
    .e-drillDowncontainer .e-dp-viewmins td {
        text-align: right;
        padding: 3px;
    }

    .e-drillDowncontainer .e-dp-viewhours .e-timepicker-hours,
    .e-drillDowncontainer .e-dp-viewmins .e-timepicker-mins {
        width: 100%;
    }

    .e-timepicker.e-time-hours, .e-timepicker.e-time-minitues {
        font-family: @font-family;
        font-size: @font-size;
        width: 18em;
        position: absolute;
        overflow: hidden;
        border: 1px solid;
    }

    .e-timepicker table,
    .e-timepicker table th,
    .e-timepicker table td {
        margin: 0;
        padding: 0;
        outline: 0 none;
        line-height: normal;
    }

    .e-datetime-popup .e-drillDowncontainer .e-timepicker.e-popup {
        display: inline-block;
        z-index: 10000;
        position: static;
        display: block;
    }

    .e-drillDowncontainer .e-timepicker.e-popup .e-header-pm {
        margin-top: 10px;
    }
    /*Footer design*/
    .e-drillDowncontainer .e-timepicker.e-popup .e-footer {
        text-align: center;
        cursor: pointer;
        padding: 3px;
        margin: 4px 0 0;
    }
    /*Prev, Next icon style*/
    .e-drillDowncontainer .e-timepicker.e-popup .e-icon.e-arrow-sans-left {
        float: left;
    }

    .e-drillDowncontainer .e-timepicker.e-popup .e-icon.e-arrow-sans-right {
        float: right;
    }

    .e-drillDowncontainer .e-timepicker.e-popup .e-icon {
        height: 18px;
        width: 18px;
    }

    .e-drillDowncontainer .e-timepicker.e-popup .e-header .e-icon:before {
        top: 2px;
        left: 2px;
        position: absolute;
    }

    .e-drillDowncontainer .e-timepicker.e-popup .e-header .e-next,
    .e-drillDowncontainer .e-timepicker.e-popup .e-header .e-prev {
        cursor: pointer;
        position: relative;
        top: 2px;
    }

    .e-drillDowncontainer .e-timepicker.e-popup .e-icon.e-arrow-sans-right:before {
        left: 4px;
    }

    .e-drillDowncontainer .e-timepicker.e-popup .e-header .e-prev {
        left: 5px;
    }

    .e-drillDowncontainer .e-timepicker.e-popup .e-header .e-next {
        right: 5px;
    }

    .e-drillDowncontainer .e-timepicker.e-popup .e-header .e-next,
    .e-drillDowncontainer .e-timepicker.e-popup .e-header .e-prev,
    .e-drillDowncontainer .e-timepicker.e-popup .e-header .e-text,
    .e-drillDowncontainer .e-timepicker.e-popup .e-header-am .e-text,
    .e-drillDowncontainer .e-timepicker.e-popup .e-header-pm .e-text,
    .e-drillDowncontainer .e-timepicker.e-popup .e-mins-header .e-text {
        display: inline-block;
    }
    /*Header Text style*/
    .e-drillDowncontainer .e-timepicker.e-popup .e-header .e-text,
    .e-drillDowncontainer .e-timepicker.e-popup .e-header-am .e-text,
    .e-drillDowncontainer .e-timepicker.e-popup .e-header-pm .e-text,
    .e-drillDowncontainer .e-timepicker.e-popup .e-mins-header .e-text {
        cursor: pointer;
        text-align: center;
        width: 83%;
    }

    .e-drillDowncontainer .e-timepicker.e-popup .e-header .e-text .e-hours-headertext,
    .e-drillDowncontainer .e-timepicker.e-popup .e-header .e-text .e-minitues-headertext,
    .e-drillDowncontainer .e-timepicker.e-popup .e-header-am .e-text .e-hours-meridiantxt-am,
    .e-drillDowncontainer .e-timepicker.e-popup .e-header-pm .e-text .e-hours-meridiantxt-pm,
    .e-drillDowncontainer .e-timepicker.e-popup .e-mins-header .e-text .e-minitues-meridiantxt {
        padding: 2px 7px 3px 8px;
        border-radius: 4px;
    }

    .e-drillDowncontainer .e-timepicker.e-popup .e-header,
    .e-drillDowncontainer .e-timepicker.e-popup .e-header-am,
    .e-drillDowncontainer .e-timepicker.e-popup .e-header-pm,
    .e-drillDowncontainer .e-timepicker.e-popup .e-mins-header {
        text-align: center;
        height: 30px;
        line-height: 29px;
    }

    .e-drillDowncontainer .e-timepicker.e-popup .e-header {
        margin-bottom: 4px;
    }
    /*disable hours and minutes*/
    .e-timepicker table td.e-disable {
        opacity: 1;
    }

    .e-timepicker.e-popup.e-disable table td,
    .e-timepicker.e-popup.e-disable .e-footer,
    .e-timepicker.e-popup.e-disable .e-header .e-text,
    .e-timepicker.e-popup.e-disable .e-header .e-next,
    .e-timepicker.e-popup.e-disable .e-header .e-prev {
        cursor: default;
    }

    .e-timepicker .e-disable.e-arrow-sans-left:hover,
    .e-timepicker .e-disable.e-arrow-sans-right:hover {
        background: none;
        border-radius: 0px;
        cursor: default;
    }

    .e-timepicker.e-popup.e-disable table td:hover,
    .e-timepicker.e-popup.e-disable td.e-state-hover {
        background: none;
        font-weight: normal;
        border-radius: 0px;
    }

    .e-timepicker.e-popup.e-disable .e-arrow-sans-left:hover,
    .e-timepicker.e-popup.e-disable .e-arrow-sans-left:hover {
        background: none;
        border-radius: 0px;
    }

    .e-time-minitues .e-hide-mins.e-disable, .e-time-hours .e-hide-hour.e-disable {
        visibility: hidden;
    }
}

.mixin(@widget) when (@widget = grid), (@widget = none) {
    /*Grid core*/
    .e-filtertext::-ms-clear {
        display: none;
    }
    .e-grid.e-rtl .e-headercell .e-descending, .e-grid.e-rtl .e-headercell .e-ascending{
        float: none;      
     }
    ej-grid {
        display: block;
    }

    .e-grid .e-filtertext::-webkit-search-cancel-button,
    .e-grid .e-responsesearch .e-ejinputtext::-webkit-search-cancel-button {     
        -webkit-appearance: none;
    }

    .e-grid .e-gridsummary .e-indentcell {
        width: 30px !important;
        background-color: white;
        border-right: none;
        border-top: 1px solid #c4c4c4;
    }

    .e-grid .e-gridcontent tr.e-editedrow.e-batchrow:first-child td {
        border-top-width: 0px;
    }

    .e-grid .e-gridcontent tr td.e-gupdatenotify:empty:before {
        margin-top: -21px !important;
    }

    .e-grid .e-gridcontent tr td.e-gupdatenotify.e-icon {
        height: 14px !important;
    }

    .e-grid {
        height: auto;
        outline: 0 none;
        border-width: @border-size;
        border-style: none @border-type @border-type @border-type;
    }

    .e-grid .e-textover .e-headercelldiv {
        text-overflow: ellipsis;
    }

    .e-grid, .e-grid .e-groupcaption, .e-grid .e-groupcaptionsummary, .e-grid .e-headercell, .e-grid .e-headercell-hover,
    .e-grid .e-groupheadercell, .e-grid .e-groupheadercell:hover, .e-grid .e-rowcell, .e-grid .e-indentcell,
    .e-grid .e-recordpluscollapse, .e-grid .e-recordplusexpand, .e-grid .e-filterbarcell, .e-grid .e-filterbarcelldisabled,
    .e-grid .e-tabletd {
        border-collapse: collapse;
    }

    .e-grid .e-tableLastCell {
        border-right: 1px solid !important;
        border-style: solid !important;
    }

    .e-grid .e-gridcontent, .e-grid .e-groupdroparea, .e-grid .e-headercell, .e-grid .e-headercell-hover, .e-grid .e-headercelldiv,
    .e-grid .e-groupheadercell, .e-grid .e-groupheadercell:hover, .e-grid .e-rowcell, .e-grid .e-indentcell, .e-grid .e-recordpluscollapse,
    .e-grid .e-recordplusexpand, .e-grid .e-filterbarcell, .e-grid .e-filterbarcelldisabled, .e-grid .e-summaryrow,
    .e-grid .e-headercontent, .e-grid .e-gridheader, .e-grid .e-gridfooter {
        overflow: hidden;
        vertical-align: middle;
    }

    .e-grid .e-dialog .e-addedrow table, .e-grid .e-dialog .e-editedrow table, .e-grid .e-inlineformedit table, .e-grid .e-externalformedit table {
        border-collapse: separate;
        border-spacing: 11px;
    }

    .e-grid .e-dialog .e-addedrow label, .e-grid .e-dialog .e-editedrow label, .e-grid .e-inlineformedit label, .e-grid .e-externalformedit label {
        display: inline;
        font-weight: normal;
        margin-bottom: 0px;
        white-space: nowrap;
    }

    .e-grid .e-dialog .e-editedrow, .e-grid .e-dialog .e-addedrow {
        padding-bottom: 1px;
    }

    .e-grid .e-validError {
        position: relative;
        overflow: visible;
    }

    .e-grid [class ^="e-"], .e-grid .e-unboundcelldiv > button {
        -webkit-box-sizing: content-box;
        -moz-box-sizing: content-box;
        box-sizing: content-box;
    }

    .e-grid .e-widget [class^="e-"] {
        box-sizing: border-box;
    }

    .e-grid .e-dialog.e-widget .e-dialog-icon, .e-grid .e-widget .e-pagercontainer > .e-icon, .e-grid .e-widget .e-pagercontainer .e-numericitem,
    .e-grid .e-widget .e-filtericon, .e-grid .e-widget .e-filtertext, .e-grid .e-widget .e-predicate span, .e-grid .e-widget .e-value .e-chk-act, .e-grid .e-detailcell .e-groupheadercell,
    .e-grid .e-detailcell .e-ungroupbutton, .e-grid .e-excelfilter .e-chk-act {
        box-sizing: content-box;
    }

    .e-table, .e-grid table {
        max-width: none;
    }

    .e-grid .e-editedrow *, .e-grid .e-addedrow *, .e-grid .e-dlgcontainer * {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    .e-grid .e-unboundcelldiv button {
        margin: 0px 0px 0px 7px;
        padding: 0;
    }

    .e-grid .e-gridcontent .e-table > tbody > tr:first-child td.e-editCell .e-table {
        border-top-width: 0;
        border-top-style: none;
    }

    .e-grid > .e-gridcontent > div > .e-table, .e-grid > .e-gridheader > div > .e-table, .e-grid > .e-gridfooter > .e-gridsummary, .e-grid .e-tabletd .e-table {
        border-spacing: 0px;
    }

    .e-grid table th:first-child .e-headercell-hover {
        border-width: @border-size 0 @border-size 0;
    }

    .e-grid .e-gridcontent tr:first-child td,
    .e-grid tr.e-editedrow:first-child td.e-rowcell,
    .e-grid .e-gridcontent .e-firstrow > td {
        border-top: 0 none;
    }

    .e-grid .e-gridcontent .e-addedrow.e-normaledit .e-lastrowcell {
        border-top-width: 1px;
        border-top-style: solid;
        border-top-color: #c8c8c8;
    }

    .e-grid .e-groupdroparea,
    .e-grid .e-groupTopLeftcell {
        border-style: solid none;
        border-width: 1px 0px 0px;
    }

    .e-grid .e-number {
        border-radius: 65%;
        width: 7px;
        height: 15px;
        padding: 1px 5px;
        line-height: 15px;
        margin-top: 7px;
    }

    .e-grid .e-grid-icon {
        float: left;
    }

    .e-grid .e-table, .e-grid .e-gridsummary {
        width: 100%;
        table-layout: fixed;
        border: 0 none;
        border-collapse: separate;
        margin-top: 0px;
    }

    .e-grid .e-columnheader {
        cursor: pointer;
    }

    .e-grid .e-columnheader.e-defaultcursor, .e-grid .e-headercell.e-defaultcursor {
        cursor: default;
    }

    .e-grid .e-gridcontent {
        outline: none;
    }

    .e-grid .e-groupdroparea {
        padding-top: 5px;
        padding-bottom: 8px;
        text-indent: 10pt;
        width: 100%;
    }

    .e-grid .e-icon.e-print:before {
        content: "\e741";
    }

    .e-grid .e-excelIcon:before {
        content: "\e718";
    }

    .e-grid .e-wordIcon:before {
        content: "\e716";
    }

    .e-grid .e-pdfIcon:before {
        content: "\e717";
    }

    .e-grid .e-icon.e-delete:before {
        content: "\e681";
    }

    .e-icon.e-contextadd:before {
        content: "\e7bf";
    }

    .e-icon.e-contextedit:before {
        content: "\e7c2";
    }

    .e-icon.e-contextdelete:before {
        content: "\e7c1";
    }

    .e-icon.e-contextcancel:before {
        content: "\e7c0";
    }

    .e-icon.e-contextsave:before {
        content: "\e7c8";
    }

    .e-icon.e-contextgrouping:before {
        content: "\e7c4";
    }

    .e-icon.e-contextungrouping:before {
        content: "\e7cb";
    }

    .e-icon.e-contextascending:before {
        content: "\e7ca";
    }

    .e-icon.e-contextdescending:before {
        content: "\e7c9";
    }

    .e-icon.e-contextnext:before {
        content: "\e7c6";
    }

    .e-icon.e-contextlast:before {
        content: "\e7c5";
    }

    .e-icon.e-contextprevious:before {
        content: "\e7c7";
    }

    .e-icon.e-contextfirst:before {
        content: "\e7c3";
    }

    .e-columnChooser {
        min-width: 200px;
        padding: 0px;
        font-family: Segoe UI;
        height: 307px !important;
        background: none white;
    }

    .e-columnChooser .e-searchbox {
        position: relative;
        margin: 0px 10px 5px 11px;
    }

    .e-columnChooser .e-searchbox input {
        width: 96%;
        height: 21px;
        border-radius: 4px;
    }

    div.e-dialog.e-columnChooser {
        padding-left: 0;
        padding-right: 0;
    }

    .e-gridheader {
        clear: right;
    }

    .e-columnChooser .e-searchbox span {
        cursor: pointer;
        display: block;
        height: 16px;
        position: absolute;
        right: 6px;
        top: 18%;
    }

    .e-columnChooser .e-scroller {
        outline: none;
    }

    .e-columnChoosertail {
        height: 0;
        position: relative;
        width: 0;
        top: 7px;
        left: 1239px;
        border: 10px solid transparent;
    }

    .e-columnChoosertailAlt {
        height: 0;
        position: relative;
        width: 0;
        top: 7px;
        left: 1239px;
        border: 10px solid transparent;
    }

    .e-columnChooserListDiv label {
        width: auto;
        margin-left: 15px;
        margin-right: 17px;
        display: inline-block;
        margin-bottom: 0px;
        font-weight: inherit;
    }

    .e-columnChooserListDiv {
        line-height: 2.5;
        white-space: nowrap;
        padding: 0 13px;
    }

    .e-columnChooser .e-vscroll,
    .e-columnChooser .e-vscrollbar {
        width: 10px !important;
    }

    .e-columnChooser .e-hhandle {
        height: 8px !important;
        border-radius: 10px;
    }

    .e-columnChooser .e-hhandlespace {
        margin-top: 0px;
    }

    .e-columnChooser .e-content {
        width: 214px;
    }

    .e-columnChooserSplitter {
        margin-left: -14px;
        width: 115%;
        border-bottom: 0px;
    }

    .e-columnChooser .e-hscrollbar {
        height: 11px !important;
        margin-top: 8px;
    }

    .e-grid.e-columnChooser .e-hscroll, .e-grid.e-columnChooser .e-vscroll {
        border: 0px;
    }

    .e-columnChooser .e-vhandle.e-v-line {
        width: 8px;
        margin-left: -3px;
        border-radius: 10px;
    }

    .e-columnChooser .e-scrollbar .e-hscroll .e-button,
    .e-columnChooser .e-scrollbar .e-vscroll .e-button {
        display: none;
    }

    .e-grid .e-gridellipsis {
        text-overflow: ellipsis;
    }

    .e-grid .e-groupcaption,
    .e-grid .e-groupcaptionsummary {
        border-style: @border-type;
        border-width: @border-size 0;
        display: table-cell;
        font-weight: normal;
        line-height: 30px;
        padding-left: 0.7em;
        padding-right: 0.7em;
    }

    .e-grid .e-headercell,
    .e-grid .e-headercell-hover {
        height: 40px;
        padding: 0 0.5em;
        text-overflow: ellipsis;
        white-space: nowrap;
        text-align: left;
    }

    .e-grid .e-headercelldiv {
        font-weight: bold;
        font-size: @gheader-font-size;
        display: block;
        border: 0 none;
        height: 29px;
        line-height: 29px;
        margin: -7px;
        padding: 0 0.7em;
        text-align: left;
        white-space: nowrap;
    }

    .e-grid .e-stackedHeaderCell {
        padding: 0 0.7em;
    }

    .e-grid .e-groupheadercell,
    .e-grid .e-groupheadercell:hover {
        font-size: @font-size;
        font-weight: normal;
        margin-left: 10px;
        padding: 7px;
        cursor: pointer;
        height: 17px;
        border: @border-size @border-type;
    }

    .e-grid .e-rowcell, .e-grid .e-indentcell {
        border-style: @border-type;
        display: table-cell;
    }

    .e-grid .e-rowcell {
        border-width: @border-size 0 0 @border-size;
        padding: 0.7em;
        line-height: 14px;
        white-space: nowrap;
        width: auto;
        vertical-align: middle;
    }

    .e-grid .e-rowcell:empty {
        height: 14px !important;
    }

    .e-grid .e-verticallines .e-rowcell,
    .e-grid .e-verticallines .e-normaledit td.e-rowcell,
    .e-grid .e-verticallines .e-detailrowcollapse,
    .e-grid .e-verticallines .e-detailrowcollapse.e-lastrowcell,
    .e-grid .e-verticallines .e-detailrowexpand,
    .e-grid .e-verticallines .e-filterbarcell {
        border-width: 0 0 0 @border-size;
    }

    .e-grid.e-rtl .e-verticallines .e-rowcell,
    .e-grid.e-rtl .e-verticallines .e-normaledit td.e-rowcell,
    .e-grid.e-rtl .e-verticallines .e-detailrowcollapse,
    .e-grid.e-rtl .e-verticallines .e-detailrowexpand,
    .e-grid.e-rtl .e-verticallines .e-filterbarcell {
        border-width: 0 @border-size 0 0;
    }

    .e-grid .e-verticallines .e-detailcell,
    .e-grid .e-horizontallines .e-detailcell,
    .e-grid .e-hidelines .e-detailcell,
    .e-grid .e-verticallines .e-detailindentcell,
    .e-grid .e-horizontallines .e-detailindentcell,
    .e-grid .e-hidelines .e-detailindentcell,
    .e-grid.e-rtl .e-hidelines .e-rowcell,
    .e-grid.e-rtl .e-hidelines .e-normaledit td.e-rowcell,
    .e-grid.e-rtl .e-hidelines tr.e-editedrow td.e-rowcell,
    .e-grid .e-hidelines .e-rowcell,
    .e-grid .e-hidelines .e-normaledit td.e-rowcell,
    .e-grid .e-hidelines tr.e-editedrow td.e-rowcell,
    .e-grid .e-hidelines .e-detailrowcollapse,
    .e-grid .e-hidelines .e-detailrowcollapse.e-lastrowcell,
    .e-grid .e-hidelines .e-detailrowexpand,
    .e-grid .e-horizontallines .e-headercell,
    .e-grid .e-hidelines .e-headercell,
    .e-grid.e-rtl .e-horizontallines .e-headercell,
    .e-grid.e-rtl .e-hidelines .e-headercell,
    .e-grid .e-hidelines .e-filterbarcell,
    .e-grid.e-rtl .e-hidelines .e-filterbarcell {
        border-width: 0px;
    }

    .e-grid .e-verticallines .e-detailcell,
    .e-grid .e-horizontallines .e-detailcell {
        padding: 0px;
    }

    .e-grid .e-horizontallines .e-rowcell,
    .e-grid .e-horizontallines .e-normaledit td.e-rowcell,
    .e-grid .e-horizontallines .e-detailrowcollapse,
    .e-grid .e-horizontallines .e-detailrowexpand,
    .e-grid.e-rtl .e-horizontallines .e-rowcell,
    .e-grid.e-rtl .e-horizontallines .e-normaledit td.e-rowcell,
    .e-grid.e-rtl .e-horizontallines .e-detailrowcollapse,
    .e-grid.e-rtl .e-horizontallines .e-detailrowexpand,
    .e-grid .e-horizontallines .e-filterbarcell {
        border-width: @border-size 0 0 0;
    }

    .e-grid .e-horizontallines td.e-lastrowcell,
    .e-grid .e-horizontallines .e-normaledit td.e-rowcell {
        border-width: @border-size 0 @border-size 0;
    }

    .e-grid.e-wrap .e-columnheader .e-headercelldiv,
    .e-grid.e-wrap .e-rowcell, .e-grid.e-wrap.e-responsive .e-rowcell,
    .e-grid .e-columnheader.e-wrap .e-headercelldiv,
    .e-grid .e-gridcontent.e-wrap .e-rowcell,
    .e-grid.e-responsive .e-gridcontent.e-wrap .e-rowcell {
        height: Auto;
        white-space: normal;
        line-height: 18px;
    }

    .e-grid.e-wrap .e-columnheader .e-headercelldiv {
        margin-bottom: 2px;
        margin-top: 0px;
    }

    .e-grid .e-normaledit .e-rowcell {
        padding: 1px 3px;
    }

    .e-grid .e-normaledit .e-boolcell {
        padding-left: 0.7em;
    }

    .e-grid .e-normaledit .e-unboundcell {
        padding: 0.7em;
    }

    .e-grid .e-lastrowcell {
        border-bottom-width: @border-size;
    }

    .e-grid .e-boolrowcell {
        padding-bottom: 0px;
        padding-top: 0px;
        padding-left: 0px;
    }

    .e-grid .e-indentcell {
        border-width: 0 @border-size 0 0;
        line-height: 0.3em;
        padding: 0px;
    }

    .e-grid .e-recordpluscollapse, .e-grid .e-recordplusexpand {
        display: table-cell;
        cursor: pointer;
        padding: 0px;
    }


    .e-grid .e-recordplusexpand {
        white-space: nowrap;
    }

    .e-grid .e-recordpluscollapse ~ td {
        border-bottom: 0 none;
    }

    .e-grid .e-detailrowcollapse, .e-grid .e-detailrowexpand, .e-grid .e-recordpluscollapse, .e-grid .e-recordplusexpand {
        border-style: @border-type;
        border-width: @border-size 0px 0px;
    }

    .e-grid .e-detailrowcollapse.e-lastrowcell {
        border-bottom-width: @border-size;
    }

    .e-grid .e-headercell .e-descending, .e-grid .e-headercell .e-ascending,
    .e-grid .e-togglegroup, .e-grid .e-toggleungroup {
        padding-left: 7px;
    }

    .e-grid .e-togglegroup,
    .e-grid .e-toggleungroup {
        margin-left: 7px;
    }

    .e-grid.e-rtl .e-togglegroup,
    .e-grid.e-rtl .e-toggleungroup {
        margin-left: 3px;
    }

    .e-grid .e-toolbaricons {
        min-height: 26px;
        min-width: 26px;
        text-decoration: none;
        vertical-align: middle;
        line-height: 26px;
        margin: 0;
    }

    .e-grid .e-toolbar.e-toolbarspan {
        border-width: @border-size 0 0;
        border-style: @border-type;
        display: block !important;
    }

    .e-grid .e-editcell, .e-grid .e-tabletd {
        padding: 0px;
    }

    .e-grid .e-editcell .e-table {
        border-style: @border-type;
    }

    .e-grid .e-grid-filterstatusbar,
    .e-grid .e-grid-filterstatusbarbottom {
        height: 10px;
        border-style: @border-type;
        padding-bottom: 4px;
        padding-top: 5px;
        display: none;
        position: absolute;
    }

    .e-grid .e-grid-filterstatusbar {
        margin-top: -20px;
        border-width: @border-size @border-size 0px @border-size;
        -moz-border-radius: 4px 4px 0px 0px;
    }

    .e-grid .e-grid-filterstatusbarbottom {
        margin-top: @border-size;
        border-width: 0px @border-size @border-size @border-size;
        -moz-border-radius: 0px 0px 4px 4px;
    }

    .e-grid .e-filterbarcell input {
        width: 89%;
        border-width: @border-size;
        text-indent: @border-size;
        font-family: @font-family;
        font-weight: normal;
        font-size: @font-size;
        padding-right: 10%;
        height: 26px;
    }

    .e-grid .e-filterbarcell,
    .e-grid .e-filterbarcelldisabled {
        border-width: @border-size 0 0 @border-size;
        height: 27px;
        padding: 0px;
        border-style: @border-type;
        cursor: default;
        padding-left: 7px;
        padding-right: 9px;
    }

    .e-grid-filterstatusbar .e-msgdiv,
    .e-grid-filterstatusbarbottom .e-msgdiv {
        margin-left: 5px;
        margin-top: -3px;
        position: absolute;
    }

    .e-grid .e-headercell .e-filtericon, .e-grid .e-headercell .e-filteredicon {
        float: right;
        height: 10px;
        margin: -17px -34px -1px 3px;
        padding: 3px;
        width: 10px;
    }

    .e-grid .e-headercell .e-filtericon, .e-grid .e-headercell .e-filteredicon {
        width: 16px;
        height: 16px;
    }

    .e-grid.e-dlgcontainer .e-predicate {
        border-width: 0;
        border-style: solid;
        padding: 10px 5px 0 0;
        text-align: left;
    }

    .e-grid.e-dlgcontainer .e-caption {
        margin: 0 9px 0 6px;
        position: relative;
        top: -2px;
    }

    .e-grid.e-dlgcontainer .e-value .e-caption {
        margin: 0 5px 0 0;
    }

    .e-grid.e-dlgcontainer .e-dlgBtns {
        padding: 10px 0;
        text-align: right;
    }

    .e-grid.e-dlgcontainer .e-dlgBtns .e-filter {
        margin-right: 6%;
    }

    .e-grid.e-dlgcontainer .e-dlgBtns .e-clear, .e-grid.e-dlgcontainer .e-dlgBtns .e-filter {
        width: 47%;
    }

    .e-grid.e-filterDialoge .e-input {
        line-height: 20px;
    }

    .e-grid.e-dlgcontainer .e-operator, .e-grid.e-dlgcontainer .e-value {
        padding-top: 10px;
    }

    .e-grid.e-dlgcontainer select {
        padding: 0;
        height: 20px;
        width: 100%;
    }

    .e-grid .e-filterdialoglarge .e-dlgcontainer input[type='text'] {
        width: 197px;
    }

    .e-grid .e-summaryrow {
        font-weight: bold;
        border-style: solid;
        border-width: @border-size 0 0;
        padding: 0.5em;
        height: auto;
        line-height: 18px;
        white-space: normal;
        word-wrap: break-word;
    }

    .e-grid .e-summaryscroll {
        padding-right: 18px;
    }

    .e-grid .e-summaryscroll .e-rtl {
        padding-left: 18px;
    }

    .e-grid .e-boolrowcell input[type='checkbox'] {
        margin-left: 0.7em;
        width: auto;
        height: auto;
    }

    .e-grid .e-icon {
        background-repeat: no-repeat;
        background-attachment: scroll;
    }

    .e-grid .e-recordpluscollapse > div,
    .e-grid .e-detailrowcollapse > div,
    .e-grid .e-recordplusexpand > div,
    .e-grid .e-detailrowexpand > div {
        height: 19px;
        vertical-align: middle;
        width: 23px;
        padding: 0px;
        background-repeat: repeat;
        cursor: pointer;
    }

    .e-grid .e-dialog .e-close {
        background-repeat: repeat;
    }

    .e-grid .e-ungroupbutton {
        float: right;
        width: 16px;
        height: 16px;
        display: none;
        padding-top: 2px;
    }

    .e-grid .e-grid-icon .e-ascending,
    .e-grid .e-grid-icon .e-descending {
        padding-left: 7px;
    }

    .e-grid .e-headertemplate > .e-headercelldiv {
        padding: 0 8px;
    }

    .e-gridwaitingpopup.e-waitpopup-pane {
        background-color: transparent !important;
    }

    .e-grid .e-gridheader .e-headercell, .e-grid .e-rowcell {
        -moz-user-select: -moz-none;
        -khtml-user-select: none;
        -webkit-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

    .e-grid div.e-error, .e-grid .e-gridpopup {
        position: absolute;
        font-weight: normal;
        z-index: 9999;
    }

    .e-grid .e-gridpopup .e-content {
        border-width: 1px;
        border-style: solid;
    }

    .e-grid .e-gridpopup .e-content {
        border-radius: 4px;
        font-size: 14px;
        padding: 4px 4px;
    }

    .e-grid .e-gridpopup span {
        display: inline-block;
        height: 16px;
        cursor: pointer;
        padding: 4px;
        border: 1px solid transparent;
        width: 16px;
    }

    .e-grid div.e-error .e-errortail {
        height: 0;
        position: relative;
        width: 0;
        border: 10px solid transparent;
    }

    .e-grid .e-filterdiv,
    .e-grid .e-fltrtempdiv {
        position: relative;
        width: 100%;
        text-align: center;
        padding-right: 7%;
    }

    .e-grid .e-normaledit td {
        border-bottom: none;
    }

    .e-grid .e-addedrow .e-indentcell {
        border-top: 1px solid #c4c4c4;
    }

    .e-grid .e-dialog .e-addedrow td {
        border: none;
    }

    .e-grid .e-externalformedit .e-addedrow td {
        border: none;
    }

    .e-grid .e-addedrow .e-inlineformedit td {
        border: none;
    }

    .e-grid .e-filterdiv.e-fltrinputdiv span {
        display: block;
        height: 16px;
        position: absolute;
        right: 10%;
        top: 8px;
        cursor: pointer;
        width: 21px;
    }

    .e-grid .e-filterdiv.e-searchinputdiv span {
        display: block;
        height: 16px;
        position: absolute;
        right: 10%;
        top: 5px;
        cursor: pointer;
        width: 21px;
    }

    .e-grid .e-gridpopup .e-tail:before, .e-grid .e-gridpopup .e-tail:after {
        border: 10px solid rgba(0, 0, 0, 0);
        content: "";
        height: 0;
        left: 8px;
        position: absolute;
        width: 0;
    }

    .e-grid .e-gridpopup .e-downtail:after {
        top: 34px;
    }

    .e-grid div.e-error .e-toparrow {
        left: 10%;
        border-top-width: 2px;
        display: block;
    }

    .e-grid.e-rtl div.e-error .e-toparrow {
        right: 10%;
    }

    .e-grid .e-headercellfilter {
        padding-right: 35px;
    }

    .e-grid.e-rtl .e-headercellfilter {
        padding-right: 15px;
    }

    .e-grid.e-rtl .e-filterdiv {
        padding-right: 2%;
    }

    .e-reSizeColbg {
        position: absolute;
        border-left-width: 1px;
        border-left-style: dotted;
    }

    .e-grid .e-gridtoolbar li {
        padding: 4px 0 4px 6px;
    }

    .e-grid .e-gridtoolbar li a {
        padding-left: 3px;
    }

    .e-grid .e-groupheadercell .e-togglegroupbutton {
        padding-top: 2px;
    }

    .e-grid .e-scrollcss {
        padding-right: 18px;
    }

    .e-grid .e-animatebutton {
        width: 16px;
        height: 10px;
        font-size: 12px;
        padding-right: 26px;
        float: right;
    }

    .e-grid tr td:first-child, .e-grid tr th:first-child {
        border-left: 0px;
    }

    .e-grid .e-filterbarcell,
    .e-grid .e-filterbarcelldisabled {
        height: 40px;
    }

    .e-grid .e-dialog .gridform .e-rowcell {
        border: none;
        padding: 0.1em;
    }

    .e-grid .e-headercell,
    .e-grid .e-grouptopleftcell {
        border-width: 0 0 0 @border-size;
        border-style: @border-type;
    }

    .e-grid .e-grouptopleftcell,
    .e-grid.e-rtl .e-grouptopleftcell,
    .e-grid .e-verticallines .e-grouptopleftcell {
        cursor: default;
        border-width: 0px;
        padding: 0px;
    }

    .e-grid .e-reorderindicate {
        border-right-width: 3px;
    }

    .e-grid .e-groupdroparea {
        font-size: 19px;
        font-weight: lighter;
        text-align: center;
        border-top-width: @border-size;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
    }

    .e-grid .e-cloneproperties {
        padding: 4px 5px;
        border-style: solid;
        border-width: @border-size;
        text-align: center;
        vertical-align: middle;
        overflow: hidden;
        opacity: 0.6;
        white-space: nowrap;
    }

    .e-grid .e-cloneproperties.draganddrop {
        padding: 0px;
    }

    .e-grid .e-draganddrop {
        background-color: #179bd7;
        border-color: #5396bc;
        border-width: 1px;
        opacity: 0.5;
    }

    .e-grid .e-griddragarea {
        border: 1px solid #fff;
        background-color: rgba(255,255,255,0.3);
        opacity: 0.6;
    }

    .e-grid .e-draganddrop .e-rowcell {
        border-color: #b4daef;
        color: #fff;
        opacity: 0.8;
    }

    .e-grid .e-allowRowDrop {
        cursor: url('@{font-path}/grid/dropPointer.cur'), default;
    }

    .e-grid .e-draganddrop tr:first-child td {
        border-top-width: 0px;
    }

    .e-grid .e-dialog .e-buttons {
        clear: both;
        float: right;
    }

    .e-grid .e-detailcell {
        padding: 0.4em 0.6em;
    }

    .e-grid .e-gridheader {
        border-bottom-width: @header-border-size;
        border-bottom-style: @border-type;
        box-shadow:@grid-box-shadow;
    }

    .e-grid .e-externalformedit .e-rowcell,
    .e-grid .e-inlineformedit .e-rowcell {
        border: none;
    }

    .e-grid .e-inlineformedit .e-rowcell {
        border-top: 0 none;
    }

    .e-grid .e-inlineform-titlebar {
        font-weight: bold;
        padding: 0.7em;
    }

    .e-grid .e-inlineformedit .e-editform-btn {
        float: right;
        padding: 13px;
    }

    .e-grid .e-externalformedit .e-editform-btn {
        float: right;
        padding: 0px 0px 13px 0px;
    }

    .e-grid .e-inlineformedit form div,
    .e-grid .e-externalformedit form div {
        display: inline-block;
        padding-left: 0px;
        padding-right: 0.7em;
    }

    .e-grid .e-inlineformedit div > label,
    .e-grid .e-externalformedit div > label {
        display: inline-block;
        width: 80px;
        white-space: normal;
        word-wrap: break-word;
    }

    .e-grid .e-inlineformedit .e-display div,
    .e-grid .e-externalformedit .e-display div {
        display: block;
    }

    .e-grid .e-inlineformedit form table div,
    .e-grid .e-externalformedit form table div {
        display: block;
        padding-left: 0px;
        padding-right: 0.7em;
    }

    .e-grid .e-inlineformedit table div > label,
    .e-grid .e-externalformedit table div > label {
        display: block;
        width: 80px;
        white-space: normal;
        word-wrap: break-word;
    }

    .e-grid .e-inlineformedit {
        padding: 0px;
    }

    .e-grid .e-form-container {
        border-width: 0 @border-size @border-size @border-size;
        border-style: @border-type;
    }

    .e-grid .e-externalform {
        padding: 1.5em 1em 3em 1em;
    }

    .e-grid .e-form-titlebar {
        font-size: 16px;
        font-weight: normal;
        padding: 0.7em;
    }

    .e-grid .e-form-togglebtn {
        cursor: pointer;
        display: inline-block;
        float: right;
        height: 20px;
        padding: 0 0 4px 5px;
        right: 5px;
        top: 50%;
        width: 20px;
    }

    .e-grid .e-form-toggle-icon.e-bottomleft:before {
        content: "\e672";
    }

    .e-grid .e-form-toggle-icon.e-topright:before {
        content: "\e671";
    }

    .e-grid .e-form-toggle-icon {
        display: inline-block;
        height: 20px;
        width: 20px;
    }

    .e-grid .e-editedbatchcell {
        padding: 1px 3px;
    }

    .e-grid td.e-editedbatchcell.e-boolrowcell {
        padding-bottom: 0px;
        padding-top: 0px;
        padding-left: 0px;
        padding-right: 0.7em;
    }

    .e-grid .e-detailrowcollapse, .e-grid .e-detailcell, .e-grid tr.e-editedrow td.e-rowcell {
        border-top-width: @border-size;
        border-top-style: @border-type;
    }

    .e-grid .e-hscrollcss, .e-grid .e-detailindentcell {
        border-right-width: @border-size;
        border-right-style: @border-type;
    }

    .e-grid .e-gridheader {
        border-top-width: @border-size;
        border-top-style: @border-type;
    }

    .e-grid .e-lastgrouptopleftcell {
        border-right: 0 none;
    }

    .e-grid .e-detailrowcollapse + td,
    .e-grid .e-detailrowexpand + td {
        border-left: none;
    }

    .e-grid .e-gridcontent .e-detailrowvisible {
        border-left: none;
    }


    .e-grid .e-pagermsgdiv {
        padding-left: 9px;
        padding-top: 0;
        -webkit-user-select: none;
        -ms-user-select: none;
        -moz-user-select: none;
        -khtml-user-select: none;
        user-select: none;
    }

    .e-grid .e-inlineform-titlebar {
        border-bottom-width: 1px;
        border-style: solid;
        border-width: 0 0 1px 0;
    }

    .e-grid .e-inlineformedit form {
        padding-left: 10px;
        padding-top: 10px;
    }

    .e-grid .e-inlineformedit .e-editform-btn {
        padding-top: 0;
    }

    .e-grid .e-movablecontent,
    .e-grid .e-movableheader {
        border-left: 1px solid;
    }

    .e-grid .e-frozeny {
        border-bottom: 1px solid !important;
    }

    .e-grid .e-movablecontent,
    .e-grid .e-movableheader,
    .e-grid .e-movablefooter {
        overflow: hidden;
    }

    .e-grid .e-frozencontentdiv,
    .e-grid .e-frozenheaderdiv,
    .e-grid .e-frozenfooterdiv {
        float: left;
    }

    .e-grid .e-frozenunbound {
        padding-top: 4px;
        padding-bottom: 4px;
    }

    .e-grid .e-error div.e-field-validation-error {
        border-radius: 7px;
        font-size: 14px;
        padding: 7px;
        text-align: left;
    }

    .e-grid div.e-error .e-toparrow.e-bottomarrow {
        border-color: #fffe92 transparent transparent;
        border-top-width: 10px;
    }

    .e-grid .e-hide {
        display: none !important;
    }

    .e-grid .emptyrecord {
        white-space: nowrap;
    }

    .e-grid .e-frozeny {
        border-bottom-width: 1px !important;
        border-bottom-style: solid !important;
    }

    .e-grid .e-frozenrow + tr > td {
        border-top-width: 0px;
    }

    .e-grid .e-widget .e-select .e-icon:before {
        display: block;
    }

    .e-grid .e-icon:before {
        display: inline-block;
    }

    .e-grid .e-updatedtd:before {
        float: left;
        margin-left: -11px;
        margin-top: -14px;
        text-align: left;
        font-family: 'ej-webfont';
        color: red;
    }

    .e-grid .e-boolrowcell.e-updatedtd:before {
        float: left;
        margin-left: -1px;
        margin-top: -12px;
        text-align: left;
        width: 0px;
        font-family: 'ej-webfont';
        color: red;
    }

    .e-grid .e-excelfilter .e-ejinputtext::-ms-clear {
        display: none;
    }

    .e-grid .e-toolbar.e-toolbarspan .e-ejinputtext::-ms-clear {
        display: none;
    }

    .e-grid .e-toolbar.e-toolbarspan .e-gridsearchbar {
        box-sizing: content-box;
    }

    .e-grid form .e-icon:before {
        display: block;
    }

    .e-grid .e-icon.e-animatebutton {
        font-size: 10px;
    }

    .e-grid .e-icon.e-gdiagonalnext {
        margin-left: 11px;
        font-size: 8px;
        margin-top: 12px;
    }

    .e-grid .e-icon.e-gnextforward {
        font-size: 10px;
        font-size: 10px;
        margin-left: 10px;
        margin-top: 10px;
    }

    .e-grid .e-groupheadercell .e-cancel {
        padding-right: 11px;
    }

    .e-grid .e-groupheadercell .e-icon:before {
        display: inline;
    }

    .e-grid .e-filterbarcell .e-icon:before, .e-grid .e-dialog .e-icon:before {
        display: block;
    }

    .e-grid .e-toolbaricons.e-searchfind {
        padding-left: 6px;
    }

    .e-grid .e-gridtoolbar .e-ejinputtext {
        vertical-align: middle;
        text-indent: 0px;
    }

    .e-grid .e-rowcell.e-updatedtd {
        font-size: @font-size;
        font-family: @font-family;
    }

    .e-grid .e-dlgBtns .e-button {
        cursor: pointer;
        overflow: hidden;
        text-align: center;
        text-decoration: none;
        margin: 0;
    }
    .e-grid.e-columnChooser .e-columnChooserListDiv * {
        box-sizing: content-box;
    }
    /*-------------- grid rtl----------------*/
    .e-grid.e-rtl {
        direction: rtl;
    }

    .e-grid.e-rtl .e-groupheadercell .e-icon:before {
        display: inline-block;
    }

    .e-grid.e-rtl .e-groupheadercell .e-cancel {
        padding-left: 23px;
        padding-right: 0px;
        padding-top: 2px;
    }

    .e-grid.e-rtl .e-gridtoolbar li a {
        padding-right: 5px;
        padding-left: 0px;
    }

    .e-grid.e-rtl .e-gridtoolbar li {
        padding: 4px 4px 4px 0;
    }

    .e-grid.e-rtl .e-headercell .e-descending,
    .e-grid.e-rtl .e-headercell .e-ascending,
    .e-grid.e-rtl .e-togglegroup,
    .e-grid.e-rtl .e-toggleungroup {
        padding-right: 7px;
    }

    .e-grid.e-rtl .e-icon.e-gdiagonalnext {
        margin-right: 9px;
    }

    .e-grid .e-icon.e-gnextforward {
        margin-right: 10px;
    }

    .e-grid.e-rtl .e-groupheadercell, .e-grid.e-rtl .e-groupheadercell:hover {
        margin-right: 10px;
    }

    .e-grid .e-rtl a, .e-grid.e-rtl .e-groupheadercell, .e-grid.e-rtl .e-groupheadercell:hover {
        float: right;
    }

    .e-grid.e-rtl .e-scrollcss >.e-headercontent  {
        border-left-width: @border-size;
        border-left-style: @border-type;
    }
    .e-grid.e-rtl .e-headercontent {
	     border-right-width: 0px;
	}
    .e-grid.e-rtl .e-headercell .e-filtericon, .e-grid.e-rtl .e-headercell .e-filteredicon {
        margin: -17px -4px -1px -5px;
    }

    .e-grid.e-dlgcontainer .e-dlgBtns .e-filter.e-rtl {
        margin-left: 6%;
        width: 47%;
        margin-right: 0px;
    }

    .e-grid.e-rtl .e-rowcell, .e-grid.e-rtl .e-filterbarcell, .e-grid.e-rtl .e-filterbarcelldisabled {
        border-width: @border-size @border-size 0 0;
    }

    .e-grid.e-rtl .e-lastrowcell {
        border-bottom-width: @border-size;
    }

    .e-grid.e-rtl .e-filterbarcell,
    .e-grid.e-rtl .e-filterbarcelldisabled {
        padding-left: 9px;
        padding-right: 7px;
    }

    .e-grid.e-rtl tr td:first-child, .e-grid.e-rtl tr th:first-child {
        border-right: 0 none;
    }

    .e-grid.e-rtl .e-indentcell {
        border-left-width: @border-size;
        border-left-style: @border-type;
    }

    .e-grid.e-rtl .e-headercell {
        border-width: 0px @border-size 0px 0px;
    }

    .e-grid.e-rtl .e-reorderindicate {
        border-left-width: 3px;
    }

    .e-grid.e-rtl .e-cloneproperties {
        border-width: @border-size @border-size 3px @border-size;
    }

    .e-grid.e-rtl div.e-pagermsgdiv {
        padding-left: 6px;
        text-align: left;
    }

    .e-grid .e-rtl .e-parentmsgbar {
        float: left;
        padding-left: 6px;
    }

    .e-grid.e-rtl .e-headercelldiv {
        text-align: right;
        padding: 0 0.7em;
		white-space: nowrap;
        -ms-text-overflow: ellipsis;
        -o-text-overflow: ellipsis;
        text-overflow: ellipsis; 
    }

    .e-grid.e-rtl .e-headercelldiv:not(:only-child) {
        text-align: right;
        padding: 0 0 0 2em;
    }

    .e-grid.e-rtl .e-recordpluscollapse > div:before, .e-grid.e-rtl .e-detailrowcollapse > div:before {
        content: "\e623";
    }

    .e-grid.e-rtl .e-recordplusexpand > div:before, .e-grid.e-rtl .e-detailrowexpand > div:before {
        content: "\e624";
    }

    .e-grid.e-rtl .e-headercell .e-filtericon, .e-grid.e-rtl .e-headercell .e-filteredicon, .e-grid.e-rtl .e-animatebutton, .e-grid.e-rtl .e-ungroupbutton {
        float: left;
    }

    .e-grid.e-rtl .e-filterbarcell input {
        float: right;
        margin-right: 4px;
    }

    .e-grid.e-rtl .e-scrollcss {
        padding-right: 0px;
        padding-left: 17px;
    }

    .e-grid .e-widget .e-pager.e-rtl {
        -webkit-box-sizing: content-box;
        -moz-box-sizing: content-box;
        box-sizing: content-box;
    }

    .e-grid.e-rtl .e-grid-filterstatusbar .e-msgdiv, .e-grid.e-rtl .e-grid-filterstatusbarbottom .e-msgdiv {
        margin-right: 5px;
    }

    .e-grid.e-rtl .e-animatebutton {
        padding-left: 26px;
        padding-right: 0px;
    }

    .e-grid.e-rtl .e-frozencontentdiv,
    .e-grid.e-rtl .e-frozenheaderdiv,
    .e-grid.e-rtl .e-frozenfooterdiv {
        float: right;
    }

    .e-grid.e-rtl .e-movablecontent,
    .e-grid.e-rtl .e-movableheader {
        border-left-width: 0px;
        border-right: 1px solid;
    }

    .e-grid.e-rtl .e-frozenrow + tr > td {
        border-top-width: 0px;
    }

    .e-grid.e-rtl .e-filterdiv:not(.e-fltrtempdiv) input {
        padding-left: 15%;
        padding-right: 3%;
        width: 75%;
    }

    .e-grid.e-rtl .e-filterdiv:not(.e-fltrtempdiv) span {
        right: 78%;
    }

    .e-grid.e-rtl .e-gridcontent .e-detailrowvisible {
        border-right: none;
    }

    .e-grid .e-scroller.e-rtl .e-columnChooserListDiv > label, .e-grid .e-scroller.e-rtl > #nomatches, .e-grid.e-rtl .e-searchcontainer {
        margin-right: 15px;
        margin-left: 0px;
    }

    .e-grid.e-rtl .e-checkboxlist.e-scroller.e-rtl .e-content > .e-ftrchk label, .e-grid.e-rtl .e-checkboxlist.e-scroller.e-rtl .e-content > .e-ftrchk, .e-grid.e-rtl .e-excelfilter .e-checkboxlist .e-ftrchk {
        margin-right: 10px;
    }

    .e-grid.e-rtl .e-excelfilter .e-menu.e-vertical.e-rtl .e-list {
        height: 27px;
    }

    .e-grid.e-rtl .e-excelfilter .e-menu.e-vertical.e-rtl .e-list.e-separator {
        height: 1px;
    }

    .e-grid.e-rtl .e-excelfilter .e-menu.e-rtl .e-list > ul li.e-separator {
        margin: 2px 0px 2px 0;
    }

    .e-grid.e-rtl .e-excelfilter .e-menu.e-rtl.e-vertical .e-list > ul .e-list > a {
        padding: 0px 22px 0px 15px;
    }

    .e-grid.e-rtl .e-excelfilter .e-searchbox .e-icon.e-search, .e-grid.e-rtl .e-excelfilter .e-searchbox .e-icon.e-cancel {
        position: absolute;
        right: 215px;
    }

    .e-grid.e-columnChooser .e-searchbox span.e-rtl {
        position: absolute;
        right: 189px;
    }

    .e-grid.e-rtl .e-excelfilter .e-menu.e-rtl .e-list > a span.e-filternone.e-icon, .e-grid.e-rtl .e-excelfilter .e-menu.e-rtl .e-list > a span.e-sortdesc.e-icon, .e-grid.e-rtl .e-excelfilter .e-menu.e-rtl .e-list > a span.e-sortasc.e-icon, .e-grid.e-rtl .e-excelfilter .e-menu.e-rtl .e-list > a span.e-exceltick.e-icon {
        right: 0px;
    }

    .e-grid.e-rtl .e-menu .e-list > a span.e-icon.e-arrowhead-right {
        right: 224px;
    }
}

.mixin(@widget) when (@widget = pager), (@widget = none) {
    /*---------------------Pager core ------------------------*/
    .e-pager, .e-grid .e-pagerstatusbar {
        border-style: @border-type;
        border-width: @border-size 0px 0px;
        padding-bottom: 9px;
        padding-top: 9px;
        width: 100%;
        white-space: normal;
    }

    .e-grid .e-widget .e-pagercontainer > .e-icon {
        box-sizing: content-box;
    }

    .e-pager div.e-parentmsgbar {
        float: right;
        padding-right: 6px;
        padding-top: 4px;
    }

    .e-pager .e-pagerstatusbar {
        padding-bottom: 9px;
    }

    .e-spreadsheet .e-pager .e-icon {
        display: inline-block;
        box-sizing: content-box;
    }

    .e-pager .e-icon {
        font-size: 10px;
    }

    .e-pager .e-numericitem {
        border-right-width: @border-size;
        border-right-style: @border-type;
        display: inline-block;
        min-width: 22px;
        text-align: center;
        line-height: 1;
    }

    .e-pager .e-NP {
        position: relative;
    }

    .e-pager div.e-pagermsgdiv {
        padding-right: 6px;
        padding-top: 4px;
        text-align: right;
    }

    .e-pager .e-firstpagedisabled,
    .e-pager .e-prevpagedisabled,
    .e-pager .e-nextpagedisabled,
    .e-pager .e-lastpagedisabled {
        /* IE 8 */
        -ms-filter: "progid:DXImageTraneorm.Microsoft.Alpha(Opacity=30)";
        /* IE 5-7 */
        filter: alpha(opacity=30);
        /* Netscape */
        -moz-opacity: 0.3;
        /* Safari 1.x */
        -khtml-opacity: 0.3;
        /* Good browsers */
        opacity: 0.3;
    }

    .e-pager .e-spacing,
    .e-pager .e-numericitem:hover,
    .e-pager .e-currentitem {
        cursor: pointer;
        padding: 6px 1px 7px 2px;
        text-decoration: none;
    }

    .e-pager .e-currentitem {
        border-width: @border-size;
        font-style: normal;
        font-variant: normal;
        font-weight: normal;
    }

    .e-pager div,
    .e-pager a {
        display: inline;
        -moz-user-select: -moz-none;
        -khtml-user-select: none;
        -webkit-user-select: none;
        -o-user-select: none;
        user-select: none;
    }

    .e-pager .e-icon:before {
        display: inline-block;
    }

    .e-pager .e-firstpage,
    .e-pager .e-prevpage,
    .e-pager .e-firstpagedisabled,
    .e-pager .e-prevpagedisabled,
    .e-pager .e-nextpage,
    .e-pager .e-lastpage,
    .e-pager .e-nextpagedisabled,
    .e-pager .e-lastpagedisabled {
        padding: 9px 3px 8px 8px;
        min-width: 17px;
        border-right-width: @border-size;
        border-right-style: @border-type;
    }

    .e-pager .e-pagercontainer {
        overflow: hidden;
    }

    .e-pager .e-lastpage, .e-pager .e-lastpagedisabled {
        border-right: none;
    }

    .e-pager .e-disableditem {
        height: 10px;
    }

    .e-pager .e-firstpage:hover,
    .e-pager .e-prevpage:hover,
    .e-pager .e-lastpage:hover,
    .e-pager .e-nextpage:hover {
        cursor: pointer;
    }

    .e-pager a.e-nextprevitemdisabled {
        display: none;
        padding-right: 5px;
        padding-left: 5px;
        margin-right: @border-size;
        margin-left: @border-size;
        text-decoration: none;
    }

    .e-pager .e-pagercontainer {
        border-width: @border-size;
        border-style: @border-type;
        border-radius: 4px 4px 4px 4px;
        margin: 0 6px 0 6px;
    }

    .e-pager .e-nextpage:hover,
    .e-pager .e-lastpage:hover,
    .e-pager .e-firstpage:hover,
    .e-pager .e-prevpage:hover {
        cursor: pointer;
        text-decoration: none;
    }

    .e-pager .e-lastpage:Hover {
        border-radius: 0px 4px 4px 0px;
    }

    .e-pager .e-firstpage:Hover {
        border-radius: 4px 0px 0px 4px;
    }

    .e-pager.e-rtl {
        direction: rtl;
    }

    .e-pager.e-rtl .e-pagercontainer, .e-pager.e-rtl div, .e-pager.e-rtl a {
        float: right;
    }

    .e-pager .e-pagermessage {
        display: block;
        margin: 6px;
    }

    .e-grid .e-pagerfiltermsg {
        display: block;
        margin: 6px 0px 6px;
        padding-left: 9px;
    }

    .e-pager.e-rtl .e-pagercontainer {
        float: none;
        margin-right: 6px;
        padding: 0px;
    }

    .e-pager.e-rtl .e-firstpage,
    .e-pager.e-rtl .e-prevpage,
    .e-pager.e-rtl .e-firstpagedisabled,
    .e-pager.e-rtl .e-prevpagedisabled,
    .e-pager.e-rtl .e-nextpage,
    .e-pager.e-rtl .e-lastpage,
    .e-pager.e-rtl .e-nextpagedisabled,
    .e-pager.e-rtl .e-lastpagedisabled {
        padding: 8px 8px 2px 2px;
        -webkit-padding-after: 2px;
    }

    .e-pager.e-rtl .e-firstpage:before,
    .e-pager.e-rtl .e-firstpage:hover,
    .e-pager.e-rtl .e-firstpagedisabled:before {
        content: "\e65e";
    }

    .e-pager.e-rtl .e-prevpage:before,
    .e-pager.e-rtl .e-prevpage:hover,
    .e-pager.e-rtl .e-prevpagedisabled:before {
        content: "\e664";
    }

    .e-pager.e-rtl .e-nextpage:before,
    .e-pager.e-rtl .e-nextpage:hover,
    .e-pager.e-rtl .e-nextpagedisabled:before {
        content: "\e665";
    }

    .e-pager.e-rtl .e-lastpage:before,
    .e-pager.e-rtl .e-lastpage:hover,
    .e-pager.e-rtl .e-lastpagedisabled:before {
        content: "\e65f";
    }

    .e-pager.e-rtl .e-nextpage,
    .e-pager.e-rtl .e-nextpagedisabled,
    .e-pager.e-rtl .e-prevpage,
    .e-pager.e-rtl .e-prevpagedisabled,
    .e-pager.e-rtl .e-firstpage,
    .e-pager.e-rtl .e-firstpagedisabled {
        border-left-width: @border-size;
        border-left-style: @border-type;
    }

    .e-pager.e-rtl .e-nextpage,
    .e-pager.e-rtl .e-nextpagedisabled,
    .e-pager.e-rtl .e-prevpage,
    .e-pager.e-rtl .e-prevpagedisabled {
        border-right-width: 0px;
        border-right-style: none;
    }

    .e-pager.e-rtl .e-firstpage, .e-pager.e-rtl .e-firstpagedisabled {
        border-right: medium none;
    }

    .e-pager.e-rtl .e-firstpage:hover {
        border-radius: 0px 4px 4px 0px;
    }

    .e-pager.e-rtl .e-lastpage:hover {
        border-radius: 4px 0px 0px 4px;
    }

    .e-pager.e-rtl .e-numericcontainer {
        float: none;
    }

    .e-pager.e-rtl .e-numericitem {
        border-right-width: 0px;
        border-right-style: none;
        border-left-width: 1px;
        border-left-style: solid;
    }

    .e-pager.e-rtl .e-numericitem {
        min-width: 25px;
    }

    .e-pager.e-rtl .e-spacing,
    .e-pager.e-rtl .e-numericitem:hover,
    .e-pager.e-rtl .e-currentitem {
        padding: 6px 1px 7px;
    }
}

.mixin(@widget) when (@widget = rotator), (@widget = none) {

    .e-rotator-wrap {
        position: relative;
        display: block;
        direction: ltr;
    }

    .e-rotator-wrap .e-in-wrap {
        border: medium none;
        overflow: visible;
    }

    .e-rotator-wrap .e-in-wrap .e-inner {
        position: relative;
        overflow: hidden;
    }

    .e-rotator-wrap .e-in-wrap.e-multiple {
        padding: 4px;
        border: 1px solid;
    }

    .e-rotator-wrap .e-in-wrap .e-single {
        border: 1px solid;
    }

    .e-rotator-wrap .e-in-wrap .e-inner > ul {
        position: relative;
        width: 1200px;
        left: 0;
        top: 0;
        overflow: hidden;
    }

    .e-rotator-wrap .e-in-wrap .e-inner.e-horizontal > ul > li {
        float: left;
    }

    .e-rotator-wrap .e-in-wrap .e-nav .e-nav-btn {
        height: 40px;
        width: 40px;
        opacity: 0.80;
        filter: alpha(opacity=80);
        position: absolute;
        top: 44%;
        display: none;
        background-repeat: no-repeat;
        cursor: pointer;
    }

    .e-rotator-wrap .e-in-wrap .e-nav .e-next {
        right: 2%;
    }

    .e-rotator-wrap .e-in-wrap .e-nav .e-previous {
        left: 2%;
    }

    .e-rotator-wrap .e-in-wrap .e-nav .e-next:before, .e-rotator-wrap .e-in-wrap .e-nav .e-previous:before {
        width: 40px;
        height: 40px;
    }

    .e-rotator-wrap .e-in-wrap .e-nav .e-next, .e-rotator-wrap .e-in-wrap .e-nav .e-previous {
        top: 47%;
        font-size: 40px;
    }

    .e-rotator-wrap .e-in-wrap .e-nav .play, .e-rotator-wrap .e-in-wrap .e-nav .pause {
        height: 66px;
        width: 66px;
        left: 46%;
    }

    .e-rotator-wrap .e-in-wrap .e-nav .play:before, .e-rotator-wrap .e-in-wrap .e-nav .pause:before {
        height: 60px;
        width: 60px;
        font-size: 60px;
    }

    .e-rotator-wrap .e-nav .e-nav-btn.e-show {
        visibility: visible;
    }

    .e-rotator-wrap .e-nav .e-nav-btn.e-hide {
        visibility: hidden;
    }

    .e-rotator-wrap .e-pager-wrap {
        display: block;
        text-align: center;
    }

    .e-rotator-wrap .e-pager-wrap .e-bullet {
        margin: 0px;
        padding: 10px;
        position: absolute;
    }

    .e-rotator-wrap .e-pager-wrap .e-bullet.default {
        left: 45%;
    }

    .e-rotator-wrap .e-pager-wrap .e-bullet > li {
        border: 1px solid;
        border-radius: 20px;
        display: inline-block;
        list-style-type: none;
        width: 10px;
        height: 10px;
        margin: 3px;
        background-repeat: no-repeat;
        background-position: 0 5px;
        cursor: pointer;
    }

    .e-rotator-wrap .e-pager-wrap .e-bullet > li:hover, .e-rotator-wrap .e-pager-wrap .e-bullet > li.e-active {
        border: 1px solid;
    }

    .e-rotator-wrap .e-pager-wrap .e-bullet {
        position: absolute;
    }

    .e-rotator-wrap .e-pager-wrap .e-bullet.e-topleft {
        left: 0;
        top: 0;
    }

    .e-rotator-wrap .e-pager-wrap .e-bullet.e-topright {
        right: 0;
        top: 0;
    }

    .e-rotator-wrap .e-pager-wrap .e-bullet.e-topCenter {
        left: 42%;
        top: 0;
    }

    .e-rotator-wrap .e-pager-wrap .e-bullet.e-bottomleft {
        bottom: 0;
        left: 0;
    }

    .e-rotator-wrap .e-pager-wrap .e-bullet.e-bottomright {
        bottom: 0;
        right: 0;
    }

    .e-rotator-wrap .e-pager-wrap .e-bullet.e-thumb-pos {
        bottom: 29%;
    }

    .e-rotator-wrap .e-pager-wrap .e-bullet.e-outside {
        margin: auto;
        position: relative;
    }

    .e-rotator-wrap .e-thumb {
        position: relative;
        overflow: hidden;
        margin: 2% 10%;
    }

    .e-rotator-wrap .e-thumb .e-thumb-items {
        position: relative;
        width: 1200px;
        height: 200px;
        left: 0;
        overflow: hidden;
    }

    .e-rotator-wrap .e-thumb .e-thumb-items li {
        float: left;
        list-style: none outside none;
        margin: 5px;
        position: relative;
        left: 0;
        overflow: hidden;
    }

    .e-rotator-wrap .e-thumb .e-thumb-items li img {
        width: 135px;
        height: 85px;
    }

    .e-rotator-wrap .e-thumb .e-thumb-items li:hover, .e-rotator-wrap .e-thumb .e-thumb-items li.e-active, .e-rotator-wrap .e-thumb .e-thumb-items li.e-thumbhover, .e-rotator-wrap.e-disable .e-thumb .e-thumb-items li.e-active:hover {
        border: 3px solid;
        padding: 4px;
    }

    .e-rotator-wrap .e-thumb .e-thumb-items li, .e-rotator-wrap.e-disable .e-thumb .e-thumb-items li:hover, .e-rotator-wrap.e-disable .e-thumb .e-thumb-items li.e-thumbhover {
        border: 1px solid;
        padding: 6px;
    }

    .e-rotator-wrap .e-thumb-nav .e-thumb-btn {
        height: 30px;
        width: 30px;
        position: absolute;
        top: 84%;
        visibility: visible;
        background-repeat: no-repeat;
        cursor: pointer;
        font-size: 30px;
    }

    .e-rotator-wrap.e-disable .e-thumb-nav .e-thumb-btn {
        cursor: default;
    }

    .e-rotator-wrap .e-thumb-nav .e-thumb-btn.e-previous {
        left: 3%;
    }

    .e-rotator-wrap .e-thumb-nav .e-thumb-btn.e-next {
        right: 3%;
    }

    .e-rotator-wrap .e-inner .e-caption {
        bottom: 0;
        left: 0;
        opacity: 0.50;
        filter: alpha(opacity=50);
        position: absolute;
        height: 50px;
        width: 100%;
        display: none;
    }

    .e-rotator-wrap .e-inner .e-caption.e-hide {
        visibility: hidden;
    }

    .e-rotator-wrap .e-inner .e-caption.e-show {
        visibility: visible;
    }

    .e-rotator-wrap .e-inner .e-caption > span {
        font-family: icon;
        font-size: 22px;
        margin-left: 20px;
        margin-right: 20px;
        padding-top: 11px;
        position: absolute;
    }
}

.mixin(@widget) when (@widget = groupbutton), (@widget = none) {

    .e-groupbutton {
        outline: 0 none;
        overflow: hidden;
    }

    .e-groupbutton > .e-ul {
        cursor: default;
        list-style-type: none;
        vertical-align: middle;
        overflow: hidden;
        display: table;
        height: 100%;
        width: 100%;
		border-collapse:separate;
		border-spacing:0px;
    }

    .e-groupbutton > .e-ul > .e-grp-btn-item .e-btn-content .e-center {
        display: block;
        margin: 0 auto;
    }

    .e-groupbutton > .e-ul > .e-grp-btn-item .e-btn-content .e-inline {
        display: inline-block;
        vertical-align: middle;
    }

    .e-groupbutton > .e-ul > .e-grp-btn-item .e-btn-content {
        display: block;
        vertical-align: middle;
        padding: 0.5em;
        text-align: center;
    }

    .e-groupbutton.e-no-border > .e-horizontal.e-ul {
        border-spacing: 1px 0;
    }

    .e-groupbutton > .e-horizontal.e-ul > .e-grp-btn-item {
        height: 100%;
        display: table-cell;
        vertical-align: middle;
    }

    .e-groupbutton > .e-vertical.e-ul > .e-grp-btn-item {
        width: 100%;
        display: block;
	    box-sizing: border-box;
    }

    .e-groupbutton.e-hidden, .e-groupbutton > .e-ul > .e-grp-btn-item.e-hidden {
        display: none;
    }

    .e-groupbutton > .e-horizontal.e-ul > .e-grp-btn-item {
        border: 1px solid;
    }


    .e-groupbutton > .e-vertical.e-ul > .e-grp-btn-item {
        border: 1px solid;
    }

    .e-groupbutton > .e-vertical.e-ul > .e-grp-btn-item.e-border-bottom {
        border: 1px solid;
    }
    .e-groupbutton.e-no-border, .e-groupbutton.e-no-border > .e-horizontal.e-ul > .e-grp-btn-item {
        border: none;
    }

    .e-groupbutton.e-no-border > .e-vertical.e-ul > .e-grp-btn-item {
        margin-bottom: 1px;
    }

    .e-groupbutton.e-no-border > .e-vertical.e-ul > .e-grp-btn-item.last {
        margin-bottom: 0;
    }

    .e-groupbutton.e-no-border.e-corner > .e-ul > .e-grp-btn-item {
        border-radius: 4px 4px 4px 4px;
    }
	    /* -------------------show rounder corener property------------------- */

	.e-groupbutton.e-corner > .e-ul > li.e-grp-btn-item:first-child {
        border-radius: 4px 0px 0px 4px;
    }
	.e-groupbutton.e-corner > .e-ul > .e-grp-btn-item.last{
        border-radius: 0px 4px 4px 0px;
    }
	.e-groupbutton.e-corner >  .e-vertical.e-ul > li.e-grp-btn-item:first-child {
        border-radius: 4px 4px 0px 4px;
    }
	.e-groupbutton.e-corner >  .e-vertical.e-ul > .e-grp-btn-item.last{
        border-radius: 0px 0px 4px 4px;
    }
	
    .e-grp-btn-mini {
        height: 28px;
        font-size: 12px;
    }
	.e-grp-btn-mini > .e-horizontal.e-ul > .e-grp-btn-item  .e-btntxt {
			line-height:0px;
	}.e-grp-btn-small > .e-horizontal.e-ul > .e-grp-btn-item  .e-btntxt {
			line-height:0px;
	}.e-grp-btn-medium > .e-horizontal.e-ul > .e-grp-btn-item  .e-btntxt {
			line-height:0px;
	}.e-grp-btn-large > .e-horizontal.e-ul > .e-grp-btn-item  .e-btntxt {
			line-height:0px;
	}
	.e-groupbutton.e-grp-btn-large>.e-ul>.e-grp-btn-item .e-btn-content {
	padding:0px;
	}.e-groupbutton.e-grp-btn-small>.e-ul>.e-grp-btn-item .e-btn-content {
	padding:0px;
	}.e-groupbutton.e-grp-btn-medium>.e-ul>.e-grp-btn-item .e-btn-content {
	padding:0px;
	}.e-groupbutton.e-grp-btn-mini>.e-ul>.e-grp-btn-item .e-btn-content {
	padding:0px;
	}

    .e-grp-btn-small {
        height: 32px;
        font-size: 13px;
    }

    .e-grp-btn-medium {
        height: 36px;
        font-size: 14px;
    }

    .e-grp-btn-large {
        height: 40px;
        font-size: 15px;
    }

    .e-groupbutton .e-grp-btn-item .e-icon {
        display: table-cell;
        padding: 4px 3px;
        visibility: visible;
        vertical-align: middle;
    }

    .e-groupbutton .e-grp-btn-item .e-btntxt {
        width: auto;
        cursor: default;
        display: table-cell;
        vertical-align: middle;
        line-height: normal;
        padding: 2px;
    }

    .e-groupbutton .e-grp-btn-item {
        text-align: center;
    }

    .e-groupbutton > .e-ul > .e-grp-btn-item .e-btn-content {
        display: inline-block;
    }

    .e-groupbutton .e-grp-btn-link {
        display: block;
    }
}

.mixin(@widget) when (@widget = rte), (@widget = none) {

    .e-rte-wrapper {
        display: block;
    }

    .e-rte-imageTab ul {
        list-style: none;
    }

    .e-rte .e-rte-toolbar {
        width: 100%;
        height: auto;
        margin-bottom: -2px;
    }

    .e-rte .editarea {
        margin-bottom: -4px;
        padding-top: 3px;
    }

    .e-rte .content-iframe {
        border: none;
    }

    .e-rte-fontgroup .e-split-btn-div .e-icon, .e-rte-lists .e-split-btn-div .e-icon {
        padding: 0px;
    }

    .e-rte-fontgroup .e-splitarrowright .e-split-btn.e-rht-btn, .e-rte-fontgroup .e-splitarrowright .e-split-btn.e-btn-txt, .e-rte-lists .e-splitarrowright .e-split-btn.e-rht-btn, .e-rte-lists .e-splitarrowright .e-split-btn.e-btn-txt {
        width: 15px;
    }

    .e-rte-fontgroup .e-split .e-padding.e-splitarrowright, .e-rte-lists .e-split .e-padding.e-splitarrowright {
        padding: 0px 15px 0 0;
    }

    .e-rte-fontgroup .e-split.e-rtl .e-padding.e-splitarrowright, .e-rte-lists .e-split.e-rtl .e-padding.e-splitarrowright {
        padding: 0px 0 0 15px;
    }

    .e-rte .e-resizable-handle {
        bottom: 0;
        cursor: se-resize;
        display: block;
        height: 16px;
        position: absolute;
        right: 0;
        width: 16px;
    }

    .e-rte-toolbar-icon:before {
        margin-top: 5px;
    }

    .e-rte-context-menu .e-rte-toolbar-icon:before {
        margin-top: 0px;
    }

    .e-rte-context-menu.e-context .e-list {
        cursor: default;
    }

    .e-rte .e-ipadscroll {
        overflow: auto;
        -webkit-overflow-scrolling: touch;
    }

    .e-rte.e-resizable .e-rte-overlay, .e-pane-overlay {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
    }

    .e-rte-format-ddl.e-ddl-popup div > ul li {
        padding: 5px 5px 5px 11px;
    }

    .e-rte-format-ddl.e-ddl-popup.e-rtl div > ul li {
        padding: 11px 5px 5px 5px;
    }

    .e-rte.e-rte-wrapper .e-ul.e-horizontal {
        margin-bottom: @rte-ul-margin-buttom;
        margin-top: @rte-ul-margin-top;
    }


    .e-rte .e-toolbar .e-icon.e-toolbar-res-arrow:before {
        margin-top: @rte-toolbar-res-margin-top;
        width: 21px;
        height: 21px;
    }
    /*-----------------------For Tab inside RTE Dialog----------------------*/
    .e-rte .e-dialog .e-tab .e-img-field-group {
        display: inline-block;
        width: 100%;
    }

    .e-rte .e-dialog .e-tab .e-rte-field {
        width: 67%;
    }

    .e-rte .e-dialog .e-tab .e-rte-label {
        width: 31%;
    }

    .e-rte .e-dialog .e-tab .e-img-border-field {
        width: 30%;
        float: left;
        padding-right: 0.6em;
    }

    .e-rte .e-dialog .e-tab .e-rte-field .e-inputtext {
        width: 95%;
    }

    .e-rte .e-dialog .e-tab .e-rte-field .e-dimensions {
        width: 50px;
    }

    .e-rte .e-dialog .e-rte-tablefields {
        padding: 1em 0.3em 0.3em;
    }

    .e-rte.e-rtl .e-dialog .e-tab .e-img-border-field:nth-child(1) {
        padding: 0;
    }

    .e-rte.e-rtl .e-dialog .e-tab .e-img-border-field {
        float: right;
    }

    .e-rte .e-dialog .e-tab .e-rte-stylefield {
        display: inline-block;
        float: right;
        margin-top: 1em;
        vertical-align: middle;
        width: 75%;
    }

    .e-rte .e-dialog .e-tab .e-rte-stylefield .e-inputtext {
        width: 95%;
    }

    .e-rte .e-dialog .e-dialog-tab .e-header {
        border-width: 0px;
    }

    .e-rte .e-tab .e-activetop, .e-rte .e-tab .e-activebottom {
        border: 0px solid;
    }

    .e-rte .e-tab .e-header .e-nofirst {
        margin-left: 4px;
    }

    .e-rte .e-dialog .e-dialog-tab.e-tab .e-bottom-line, .e-rte .e-dialog .e-dialog-tab.e-tab .e-top-line, .e-rte .e-dialog .e-dialog-tab.e-tab .e-activetop, .e-rte .e-dialog .e-dialog-tab.e-tab .e-activebottom {
        border: 0px solid;
    }

    .e-rte .e-dialog .e-dialog-tab.e-tab .e-header li {
        border-right: 1px solid;
    }

    .e-rte.e-dialog .e-rte-imgUrl, .e-rte.e-dialog .e-rte-fileUrl {
        text-overflow: ellipsis;
    }

    .e-rte-imgTab .e-content .e-colorwidget.e-widget {
        height: 30px;
    }
    /*-----------------------Toolbar CSS----------------------*/
    .e-rte .e-background-color, .e-rteItem-backgroundColor .e-background-color,
    .e-rte .e-font, .e-rteItem-fontColor .e-font,
    .e-rte-toolbar-icon {
        display: block;
        height: 24px;
        width: 24px;
    }

    .e-rte .e-horizontal .e-tooltxt {
        cursor: pointer;
    }

    .e-rte.e-rte-wrapper .e-horizontal {
        margin-bottom: 4px;
        margin-top: 4px;
        padding-left: 4px;
        padding-right: 4px;
    }

    .e-rte .e-toolbar .e-rte-format,
    .e-rte .e-toolbar .e-rte-fontgroup,
    .e-rte .e-toolbar .e-rte-lists {
        margin: 2px 0;
        padding-left: 2px;
        padding-right: 2px;
    }

    .e-rte .e-toolbar .e-rte-format > li,
    .e-rte .e-toolbar .e-rte-fontgroup > li,
    .e-rte .e-toolbar .e-rte-lists > li {
        border-width: 1px;
        padding: 1px;
    }

    .e-rte .e-rte-toolbar .e-input {
        font-size: 13px;
        line-height: 20px;
    }

    .e-rte .e-rte-toolbar .e-input.e-dropdownlist {
        line-height: 20px;
    }

    .e-rte-toolbar .e-responsive-toolbar.e-toolbarspan {
        border-style: solid;
        border-width: 1px;
    }
    /*-----------------Icon Set---------------------*/
    .e-rte-toolbar-icon.e-bold_01:before {
        content: "\e79b";
    }

    .e-rte-toolbar-icon.e-full-screen-expand_01:before {
        content: "\e793";
    }

    .e-rte-toolbar-icon.e-full-screen-collapse_01:before {
        content: "\e792";
    }

    .e-rte-toolbar-icon.e-italic_01:before {
        content: "\e7a4";
    }

    .e-rte-toolbar-icon.e-underline_01:before {
        content: "\e7ad";
    }

    .e-rte-toolbar-icon.e-strikethrough_01:before {
        content: "\e7aa";
    }

    .e-rte-toolbar-icon.e-align-left_01:before {
        content: "\e799";
    }

    .e-rte-toolbar-icon.e-align-center_01:before {
        content: "\e79d";
    }

    .e-rte-toolbar-icon.e-align-right_01:before {
        content: "\e79a";
    }

    .e-rte-toolbar-icon.e-align-justify_01:before {
        content: "\e7a5";
    }

    .e-rte-toolbar-icon.e-bullets_01:before {
        content: "\e79c";
    }

    .e-rte-toolbar-icon.orderedList, .e-rte-toolbar-icon.e-bullets_01 {
        padding: 0px;
    }

    .e-rte-toolbar-icon.e-bullets_01:before, .e-rte-toolbar-icon.orderedList:before {
        margin-top: 0px;
    }

    .e-rte-toolbar-icon.orderedList:before {
        content: "\e7e6";
    }

    .e-rte-toolbar-icon.indent:before {
        content: "\e7a3";
    }

    .e-rte-toolbar-icon.outdent:before {
        content: "\e7a1";
    }

    .e-rte-toolbar-icon.e-cut_01:before {
        content: "\e7a0";
    }

    .e-rte-toolbar-icon.e-copy_02:before {
        content: "\e79f";
    }

    .e-rte-toolbar-icon.e-paste_01:before {
        content: "\e7a7";
    }

    .e-rte-toolbar-icon.undo:before {
        content: "\e7ae";
    }

    .e-rte-toolbar-icon.redo:before {
        content: "\e7a9";
    }

    .e-rte-toolbar-icon.e-link_01:before {
        content: "\e7b6";
    }

    .e-rte-toolbar-icon.e-unlink_01:before {
        content: "\e7b4";
    }

    .e-rte-toolbar-icon.e-image:before, .e-rte-toolbar-icon.imageProperties:before {
        content: "\e7a8";
    }

    .e-rte-toolbar-icon.e-fileBrowser:before {
        content: "\e78f";
    }

    .e-rte-toolbar-icon.e-video:before {
        content: "\e797";
    }

    .e-rte-toolbar-icon.e-table_02:before, .e-rte-toolbar-icon.insertTable:before {
        content: "\e78c";
    }

    .e-rte-toolbar-icon.e-insert-row-above_02:before {
        content: "\e7b0";
    }

    .e-rte-toolbar-icon.e-insert-row-below_02:before {
        content: "\e7b1";
    }

    .e-rte-toolbar-icon.e-insert-column-left_02:before {
        content: "\e7b2";
    }

    .e-rte-toolbar-icon.e-insert-column-right_02:before {
        content: "\e7b3";
    }

    .e-rte-toolbar-icon.e-delete-row_01:before {
        content: "\e78e";
    }

    .e-rte-toolbar-icon.e-delete-column_01:before {
        content: "\e78d";
    }

    .e-rte-toolbar-icon.deleteTable:before, .e-rte-toolbar-icon.deleteTables:before {
        content: "\e7af";
    }

    .e-rte-toolbar-icon.e-superscript_01:before {
        content: "\e7ac";
    }

    .e-rte-toolbar-icon.e-subscript_01:before {
        content: "\e7ab";
    }

    .e-rte-toolbar-icon.e-uppercase_01:before {
        content: "\e796";
    }

    .e-rte-toolbar-icon.e-lowercase_01:before {
        content: "\e791";
    }

    .e-rte-toolbar-icon.e-zoom-in:before {
        content: "\e64e";
    }

    .e-rte-toolbar-icon.e-zoom-out:before {
        content: "\e64d";
    }

    .e-rte-toolbar-icon.print:before {
        content: "\e742";
    }


    .e-rte .e-file-code:before {
        content: "\e7b5";
    }

    .e-rte-footer .clearFormat:before, .e-rte-toolbar-icon.clearFormat:before {
        content: "\e79e";
    }

    .e-rte-footer .e-delete_05:before, .e-rte-toolbar-icon.e-delete_05:before {
        content: "\e7a2";
    }

    .e-rte .e-font:before, .e-rteItem-fontColor .e-font:before {
        content: "\e632";
        margin-top: 4px;
    }

    .e-rte .e-background-color:before, .e-rteItem-backgroundColor .e-background-color:before {
        content: "\e618";
        margin-top: 4px;
    }

    .e-dialog .customtable-image:before, .e-rte .e-dialog .e-table:before, .e-rte-toolbar-icon.tableProperties:before {
        content: "\e612";
    }

    .e-rte-listitems:before, .e-rte-unlistitems:before {
        font-size: 32px;
        width: 32px;
        height: 32px;
        margin: 0px;
    }

    .e-rte-toolbar-icon.e-loweralpha-icon:before {
        content: "\e7e9";
    }

    .e-rte-toolbar-icon.e-numbering-icon:before {
        content: "\e7eb";
    }

    .e-rte-toolbar-icon.e-upperalpha-icon:before {
        content: "\e7ed";
    }

    .e-rte-toolbar-icon.e-lowerroman-icon:before {
        content: "\e7ea";
    }

    .e-rte-toolbar-icon.e-upperroman-icon:before {
        content: "\e7ee";
    }

    .e-rte-toolbar-icon.e-circlelist-icon:before {
        content: "\e7e8";
    }

    .e-rte-toolbar-icon.e-squarelist-icon:before {
        content: "\e7ec";
    }

    .e-rte-toolbar-icon.e-disclist-icon:before {
        content: "\e7e7";
    }

    .e-rte-toolbar-icon.e-nonelist-icon:before {
        content: "\e7ef";
    }

    .e-rte-orderlistname.e-menu .e-list > span.e-rte-toolbar-icon,
    .e-rte-orderlistname.e-menu.e-context.e-rtl > .e-list > span.e-rte-toolbar-icon,
    .e-rte-unorderlistname.e-menu .e-list > span.e-rte-toolbar-icon,
    .e-rte-unorderlistname.e-menu.e-context.e-rtl > .e-list > span.e-rte-toolbar-icon {
        padding: 4px 4px 4px 4px;
    }
    /*-----------------Footer------------------------*/
    .e-rte .e-rte-footer {
        width: 100%;
        margin-top: 2px;
        font-family: monospace;
    }

    .e-rte .e-rte-footer:after {
        clear: both;
        content: ".";
        display: block;
        height: 0;
        visibility: hidden;
    }

    .e-rte .e-rte-footeritems {
        height: 16px;
        display: inline-block;
        vertical-align: middle;
        text-align: left;
    }

    .e-rte .e-rte-footer .e-rte-footer-left {
        display: inline-block;
        text-align: left;
        float: left;
    }

    .e-rte .e-rte-footer.e-rtl .e-rte-footer-left {
        float: right;
    }

    .e-rte .e-rte-footer .e-rte-footer-right {
        display: inline-block;
        text-align: right;
        float: right;
    }

    .e-rte .e-rte-footer.e-rtl .e-rte-footer-right {
        float: left;
    }

    .e-rte .e-rte-footericon {
        height: 16px;
        width: 16px;
        cursor: pointer;
        padding: 3px;
    }

    .e-rte .e-rte-htmltaginfo {
        margin-bottom: 5px;
        padding-left: 9px;
    }

    .e-rte .e-rte-wordcount, .e-rte .e-rte-charcount {
        padding: 2px 4px 4px 4px;
    }

    .e-ddl-popup .e-h1 {
        font-size: 2em;
        font-weight: bold;
    }

    .e-ddl-popup .e-h2 {
        font-size: 1.5em;
        font-weight: bold;
    }

    .e-ddl-popup .e-h3 {
        font-size: 1.16em;
        font-weight: bold;
    }

    .e-ddl-popup .e-h4 {
        font-size: 1em;
        font-weight: bold;
    }

    .e-ddl-popup .e-h5 {
        font-size: 0.83em;
        font-weight: bold;
    }

    .e-ddl-popup .e-h6 {
        font-size: 0.7em;
        font-weight: bold;
    }

    .e-rte .e-btntxt, .e-rteItem-fontColor .e-btntxt, .e-rteItem-backgroundColor .e-btntxt {
        display: table-caption;
        height: 0px;
        margin-top: -5px;
        margin-left: 1px;
        width: 16px;
    }

    .e-rte .e-background-color, .e-rteItem-backgroundColor .e-background-color,
    .e-rte .e-font, .e-rteItem-fontColor .e-font {
        padding: 0;
        margin-top: -5px;
    }

    .e-rte-context-menu.e-context .e-rte-separator {
        border-bottom: 1px solid;
    }
    /*------------------Table Style------------------*/
    .e-rte .e-rte-tablecell {
        border-style: solid;
        border-width: 1px;
        display: inline-block;
        height: 18px;
        margin: 1px;
        overflow: hidden;
        vertical-align: top;
        width: 18px;
    }

    .e-rte-palettetable {
        border-style: solid;
        border-width: 0;
        display: inline-block;
        height: 25px;
        overflow: hidden;
        vertical-align: top;
        width: 25px;
    }

    .e-rte .customtable-group {
        padding: 3px;
        cursor: pointer;
    }

    .e-rte .e-table {
        display: inline-block;
        height: 16px;
        width: 16px;
    }

    .e-rte .customtable-link {
        display: inline-block;
        text-decoration: none;
        padding-left: 5px;
        color: inherit;
    }
    /*Dialog Content*/
    .e-rte .e-rte-label {
        clear: both;
        float: left;
        padding: 0.4em 0.1em 1em;
        text-align: left;
        width: 29%;
    }

    .e-rte .e-rte-field {
        float: right;
        padding: 0em 0 0.6em;
        width: 69%;
    }

    .e-rte-label.e-rtlrte, .e-rte-field.e-rtlrte > label {
        float: right;
    }

    .e-rte-field.e-rtlrte, button.e-rtlrte {
        float: left;
    }

    .e-rtlrte .e-colorwidget .e-icon {
        left: -3%;
    }

    .e-rte .e-rte-elements {
        width: 100%;
        height: 82px;
        margin-top: 10px;
    }

    .e-rte .e-rte-tablefields {
        display: inline-block;
        width: 22%;
        padding: 0.3em;
        vertical-align: middle;
    }

    .e-rte .e-inputtext {
        height: @input-height - 4px;
        width: 98%;
        text-indent: 10px;
        font-family: @font-family;
        font-size: @font-size;
        font-size: @font-size;
    }

    .e-rte .e-dimensions {
        width: 50px;
    }

    .e-dialog .e-fieldseparate {
        border-style: dashed;
        border-width: 1px 0 0;
        padding-top: 0.6em;
    }

    .e-rte .e-fieldgroup {
        margin-bottom: 10px;
    }

    .e-dialog .e-rte-button {
        bottom: -1em;
        clear: both;
        text-align: right;
        margin-top: 10px;
    }

    .e-dialog .e-rte-imgTab {
        clear: both;
        margin-top: 10px;
    }

    .e-dialog .e-rte-btn {
        margin-left: 5px;
    }

    .e-dialog .e-rte-alertBtnRTL {
        float: left;
    }

    .e-dialog .e-rte-srctextarea {
        width: 600px;
        height: 400px;
        font-family: inherit;
        font-size: inherit;
    }

    .e-rte .e-rte-video {
        min-height: 100px;
        min-width: 370px;
    }

    .e-rte .e-rte-srcbutton {
        padding: 0.6em;
        text-align: right;
    }

    .e-rte.e-findandreplace.e-dialog .e-widget-content > span {
        color: #e24048;
        height: 22px;
        display: block;
        margin: 5px;
    }

    .e-rte-toolbar-icon.findAndReplace:before {
        content: "\e7f2";
    }

    .e-rte.e-findandreplace.e-dialog .e-widget-content .e-txtbox {
        margin: 0px 15px 0px 15px;
        width: 278px;
        height: 27px;
        border: 1px solid #c8c8c8;
    }

    .e-rte.e-findandreplace.e-dialog.e-rtl .e-widget-content .e-txtbox {
        margin-right: 15px;
    }

    .e-rte.e-findandreplace.e-dialog .e-widget-content .e-fd-btncol {
        height: 49px;
        border-top: 1px solid #c8c8c8;
    }

    .e-rte.e-findandreplace.e-dialog .e-widget-content .e-fd-checkboxlable {
        margin: 0px 0px 0px 5px;
        font-size: 13px;
        font-weight: 400;
    }

    .e-rte.e-findandreplace.e-dialog.e-rtl .e-widget-content .e-fd-checkboxlable {
        margin: 0px 5px 0px 0px;
    }

    .e-rte.e-findandreplace.e-dialog .e-widget-content .e-fd-btncol > .e-btn-left, .e-rte.e-findandreplace.e-dialog.e-rtl .e-widget-content .e-fd-btncol > .e-btn-right {
        float: left;
        margin: 0px 0px 0px 9px;
    }

    .e-rte.e-findandreplace.e-dialog .e-widget-content .e-fd-btncol > .e-btn-right, .e-rte.e-findandreplace.e-dialog.e-rtl .e-widget-content .e-fd-btncol > .e-btn-left {
        float: right;
        margin: 0px 16px 0px 0px;
    }

    .e-rte.e-findandreplace.e-dialog .e-widget-content .e-btn {
        margin: 13px 0px 13px 7px;
        max-width: 85px;
    }

    .e-rte.e-findandreplace.e-dialog .e-widget-content .e-fd-lable {
        width: 50px;
    }

    .e-rte.e-findandreplace.e-dialog .e-widget-content .e-fd-InnerContent {
        margin: 10px 0px 15px 65px;
    }

    .e-rte.e-findandreplace.e-dialog.e-rtl .e-widget-content .e-fd-InnerContent {
        margin: 15px 65px 10px 0px;
    }

    .e-rte.e-findandreplace.e-dialog .e-widget-content .e-fd-InnerContent .e-checkbx {
        margin: 0px 0px 0px 10px;
    }

    .e-rte.e-findandreplace.e-dialog.e-rtl .e-widget-content .e-fd-InnerContent .e-checkbx {
        margin: 0px 10px 0px 0px;
    }

    .e-rte.e-findandreplace.e-dialog .e-widget-content .e-maincontent {
        margin: 23px 0px 0px 15px;
        height: 110px;
    }

    .e-rte.e-findandreplace.e-dialog.e-rtl .e-widget-content .e-maincontent {
        margin: 23px 13px 15px 0px;
    }

    .e-rte.e-findandreplace.e-dialog .e-widget-content .e-maincontent > div {
        display: inline-block;
        float: left;
    }

    .e-rte.e-findandreplace.e-dialog.e-rtl .e-widget-content .e-maincontent > div, .e-rte.e-findandreplace.e-dialog.e-rtl .e-widget-content .e-maincontent > div > div {
        float: right;
    }

    .e-rte.e-findandreplace.e-dialog .e-widget-content {
        padding: 0px;
    }

    .e-rte.e-findandreplace.e-dialog .e-widget-content .e-maincontent > div > div {
        float: left;
    }

    .e-rte.e-findandreplace.e-dialog .e-widget-content .e-icon.e-chevron-left_02:before, .e-rte.e-findandreplace.e-dialog .e-widget-content .e-icon.e-chevron-right_02:before {
        margin-left: -2px;
    }

    .e-rte.e-findandreplace.e-dialog.e-rtl .e-widget-content .e-icon.e-chevron-left_02:before, .e-rte.e-findandreplace.e-dialog .e-widget-content .e-icon.e-chevron-right_02:before {
        margin-right: -2px;
    }
    .e-gantt-manualparenttaskbar, .e-gantt-manualparenttaskbar-left,
    .e-gantt-manualparenttaskbar-right{        
        z-index: 7;
        position:absolute;                  
    }

    .e-gantt-manualparenttaskbar-left{       
        border-right-style: none;
        border-top-style: none;
        border-left-style: solid;                      
    }
    .e-gantt-manualparenttaskbar-right{         
        border-top-style: none;
        border-left-style:none;
        border-right-style: solid;                    
    }
}

.mixin(@widget) when (@widget = tile), (@widget = none) {



    .e-tile-group {
        float: left;
    }

    .e-tile-group.aligncenter {
        display: table;
        float: none;
        margin: 0 auto;
        padding: 0;
    }

    .e-tile-small-col-2 {
        width: 160px;
        float: left;
    }

    .e-skew-bottomleft, .e-skew-bottomright, .e-skew-topright, .e-skew-topleft, .e-skew-top, .e-skew-bottom, .e-skew-left, .e-skew-right, .e-skew-center {
        transition: transform 250ms;
    }

    .e-skew-top {
        transform: perspective(1000px) rotateX(10deg);
        -webkit-transform: perspective(1000) rotate3d(1, 0, 0, 10deg);
        -moz-transform: perspective(1000) rotate3d(1, 0, 0, 10deg);
        -webkit-transition-duration: 350ms;
        -moz-transition-duration: 350ms;
    }

    .e-skew-bottom {
        transform: perspective(1000px) rotateX(-10deg);
        -webkit-transform: perspective(1000) rotate3d(1, 0, 0, -10deg);
        -moz-transform: perspective(1000) rotate3d(1, 0, 0, -10deg);
        -webkit-transition-duration: 350ms;
        -moz-transition-duration: 350ms;
    }

    .e-skew-left {
        transform: perspective(1000px) rotateY(-10deg);
        -webkit-transform: perspective(1000) rotateY(-10deg);
        -moz-transform: perspective(1000) rotateY(-10deg);
        -webkit-transition-duration: 350ms;
        -moz-transition-duration: 350ms;
    }

    .e-skew-right {
        transform: perspective(1000px) rotateY(10deg);
        -webkit-transform: perspective(1000) rotateY(10deg);
        -moz-transform: perspective(1000) rotateY(10deg);
        -webkit-transition-duration: 350ms;
        -moz-transition-duration: 350ms;
    }

    .e-skew-center {
        transform: perspective(1000px) scale(0.95);
        -webkit-transform: perspective(1000) scale(0.95);
        -moz-transform: perspective(1000) scale(0.95);
        -webkit-transition-duration: 350ms;
        -moz-transition-duration: 350ms;
    }

    .e-tile-backface {
        backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -webkit-backface-visibility: hidden;
        position: absolute;
    }

    .e-skew-topleft {
        transform: perspective(1000px) rotateX(10deg) rotateY(-10deg);
    }

    .e-skew-topright {
        transform: perspective(1000px) rotateX(10deg) rotateY(10deg);
    }

    .e-skew-bottomright {
        transform: perspective(1000px) rotateX(-10deg) rotateY(10deg);
    }

    .e-skew-bottomleft {
        transform: perspective(1000px) rotateX(-10deg) rotateY(-10deg);
    }

    .e-tile-group {
        float: left;
    }

    .e-tile-small-col-2 {
        width: 160px;
        float: left;
    }

    .e-tile-group .e-tile-column {
        float: left;
        overflow: hidden;
        padding-top: 5px;
        position: relative;
    }

    .e-tile-group .e-tile-column .e-tile.e-tile-wide,
    .e-tile-group .e-tile-column .e-tile.e-tile-small,
    .e-tile-group .e-tile-column .e-tile.e-tile-medium {
        float: left;
    }

    .e-tile-group {
        position: relative;
        margin: 0 auto;
        padding-left: 50px;
    }

    .e-tile-group .e-tile-column {
        max-height: 100%;
        max-width: 320px;
    }

    .e-tile-round-corner .e-tile-overlay {
        border-radius: 10px;
    }

    .e-tile * {
        box-sizing: border-box;
    }

    .e-tile {
        box-sizing: border-box;
        margin: 5px;
        overflow: hidden;
        position: relative;
        min-width: 70px;
        min-height: 70px;
    }

    .e-tile-wide {
        width: 310px;
        height: 150px;
        float: left;
    }

    .e-tile-small {
        float: left;
        height: 70px;
        width: 70px;
    }

    .e-tile-medium {
        float: left;
        height: 150px;
        width: 150px;
    }

    .e-tile-large {
        float: left;
        height: 310px;
        width: 310px;
    }

    .e-tile-wide.e-caption-outer {
        width: 310px;
        height: 200px;
    }

    .e-tile-medium.e-caption-outer {
        height: 200px;
        width: 150px;
    }

    .e-tile-large.e-caption-outer {
        height: 360px;
        width: 310px;
    }

    .e-tile-wide.e-caption-outer .e-image-parent, .e-tile-wide.e-caption-outer .e-tile-overlay {
        width: 310px;
        height: 150px;
    }

    .e-tile-medium.e-caption-outer .e-image-parent, .e-tile-medium.e-caption-outer .e-tile-overlay {
        height: 150px;
        width: 150px;
    }

    .e-tile-large.e-caption-outer .e-image-parent, .e-tile-large.e-caption-outer .e-tile-overlay {
        height: 310px;
        width: 310px;
    }

    .e-tile .e-tile-selected:after {
        position: absolute;
        display: block;
        border-left: 28px solid transparent;
        right: 0;
        content: "";
        top: 0;
        z-index: 101;
    }

    .e-tile.e-tile-web .e-image-parent .e-tile-image:not(.e-tile-imagefill) {
        background-size: 64px 64px;
        font-size: 64px;
    }

    .e-tile.e-tile-small .e-image-parent .e-tile-image:not(.e-tile-imagefill) {
        background-size: 32px 32px;
        font-size: 32px;
    }

    .e-tile.e-tile-web .e-image-parent .e-tile-image:not(.e-tile-imagefill) {
        background-repeat: no-repeat;
    }

    .e-tile.e-tile-large .e-image-parent .e-tile-image:not(.e-tile-imagefill) {
        background-size: 64px 64px;
        font-size: 64px;
    }

    .e-tile .e-tile-selected {
        border: 2px solid gray;
    }

    .e-tile .e-tile-overlay {
        height: 100%;
        width: 100%;
        display: block;
        position: absolute;
        top: 0px;
        right: 0px;
        left: 0px;
        bottom: 0px;
    }

    .e-tile.e-state-active .e-tile-overlay {
        background-color: rgba(0,0,0,0.5);
    }

    .e-tile-small.e-tile-badge.e-badge-position-topright::after {
        top: 5px;
        right: 5px;
    }

    .e-tile-small.e-tile-badge.e-badge-position-bottomright::after {
        bottom: 5px;
        right: 5px;
    }

    .e-tile.e-badge-position-bottomright::after {
        bottom: 6px;
    }

    .e-tile.e-caption-outer.e-badge-position-bottomright::after {
        bottom: 55px;
    }

    .e-tile.e-badge-position-topright::after {
        top: 10px;
    }

    .e-tile.e-tile-badge.e-tile-badge-value::after {
        content: attr(badgeValue);
        font-size: 14px;
        text-align: center;
    }

    .e-tile.e-tile-badge::after {
        color: white;
        font-size: 18px;
        line-height: 18px;
        right: 10px;
        min-height: 18px;
        min-width: 18px;
        position: absolute;
        z-index: 10;
    }

    .e-tile-caption.e-tile-caption-icon.e-caption-innertop::before {
        top: 10px;
    }

    .e-tile-caption.e-tile-caption-icon.e-caption-innerbottom::before {
        bottom: 10px;
    }

    .e-tile-caption-text.e-caption-innertop::before {
        top: 0px;
        margin-top: 10px;
    }

    .e-tile-caption-text.e-caption-innerbottom::before {
        bottom: 0px;
        margin-bottom: 6px;
    }

    .e-tile-caption-text.e-caption-innerbottom::before, .e-tile-caption-text.e-caption-innertop::before {
        max-height: 38px;
        height: auto;
        left: 0px;
    }

    .e-tile-caption-text.e-caption-outer::before {
        bottom: 0px;
        height: 45px;
        color: black;
    }

    .e-tile-caption-text::before {
        content: attr(text);
        width: 100%;
    }

    .e-tile-caption.e-tile-caption-icon::before {
        width: 30px;
        height: 30px;
        font-size: 30px;
    }

    .e-tile-caption.e-caption-outer.e-tile-caption-icon::before {
        bottom: 15px;
    }

    .e-tile-caption::before {
        font-size: 14px;
        position: absolute;
        display: block;
        float: left;
        overflow: hidden;
        z-index: 10;
    }

    .e-caption-align-right.e-caption-innertop.e-badge-position-topright.e-tile-caption-icon::before,
    .e-caption-align-right.e-caption-innerbottom.e-badge-position-bottomright.e-tile-caption-icon::before {
        right: 35px;
    }

    .e-caption-align-normal.e-tile-caption-icon::before,
    .e-caption-align-left.e-tile-caption-icon::before {
        left: 10px;
    }

    .e-tile-caption-icon.e-caption-align-center::before {
        margin-left: -10px;
        left: 50%;
    }

    .e-tile-caption-icon.e-caption-align-right::before {
        right: 10px;
    }

    .e-tile-caption-text.e-caption-align-right.e-caption-innertop.e-badge-position-topright::before,
    .e-tile-caption-text.e-caption-align-right.e-caption-innerbottom.e-badge-position-bottomright::before {
        padding-right: 34px;
    }

    .e-tile-caption-text.e-caption-align-normal::before, .e-tile-caption-text.e-caption-align-left::before {
        text-align: left;
    }

    .e-tile-caption-text::before {
        left: 0px;
        right: 0px;
        padding-left: 10px;
        padding-right: 10px;
    }

    .e-tile-caption-text.e-caption-align-center::before {
        text-align: center;
    }

    .e-tile-caption-text.e-caption-align-right::before {
        direction: rtl;
    }

    .e-tile.e-tile-web .e-image-parent .e-tile-image {
        background-repeat: no-repeat;
        overflow: hidden;
    }

    .e-tile.e-tile-web .e-image-parent .e-tile-image.e-tile-imagecenter {
        background-position: center center;
    }

    .e-tile.e-tile-web .e-image-parent .e-tile-image.e-tile-imagefill {
        background-size: 100% 100%;
    }

    .e-tile.e-tile-web .e-image-parent .e-tile-image.e-tile-imagetopcenter {
        background-position: top center;
    }

    .e-tile.e-tile-web .e-image-parent .e-tile-image.e-tile-imagebottomcenter {
        background-position: bottom center;
    }

    .e-tile.e-tile-web .e-image-parent .e-tile-image.e-tile-imageleftcenter {
        background-position: left center;
    }

    .e-tile.e-tile-web .e-image-parent .e-tile-image.e-tile-imagerightcenter {
        background-position: right center;
    }

    .e-tile.e-tile-web .e-image-parent .e-tile-image.e-tile-imagetopleft {
        background-position: top left;
    }

    .e-tile.e-tile-web .e-image-parent .e-tile-image.e-tile-imagetopright {
        background-position: top right;
    }

    .e-tile.e-tile-web .e-image-parent .e-tile-image.e-tile-imagebottomright {
        background-position: bottom right;
    }

    .e-tile.e-tile-web .e-image-parent .e-tile-image.e-tile-imagebottomleft {
        background-position: bottom left;
    }

    .e-tile.e-tile-caption.e-caption-outer {
        padding: 0px;
    }


    .e-tile:not(.e-tile-imagefill) {
        box-sizing: border-box;
    }

    .e-tile .e-tile-template {
        background-size: 100% 100%;
        width: inherit;
        height: inherit;
    }

    .e-tile .e-image-parent, .e-tile .e-tile-image {
        width: 100%;
        height: 100%;
        top: 0px;
        right: 0px;
        bottom: 0px;
        left: 0px;
        position: absolute;
    }

    .e-tile .e-image-parent.e-tile-flip, .e-tile .e-image-parent.e-tile-flipback {
        backface-visibility: hidden;
    }

    .e-tile-round-corner.e-caption-outer, .e-tile-round-corner .e-image-parent, .e-tile-round-corner .e-image-parent .e-tile-image {
        border-radius: 10px;
    }

    .e-tile .e-tile-selected::before {
        position: absolute;
        display: block;
        content: "";
        background-color: transparent;
        border-left: 2px solid #ffffff;
        border-bottom: 2px solid #ffffff;
        height: 5px;
        width: 10px;
        right: 3px;
        top: 3px;
        z-index: 102;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }
    //tile animation
    .e-tile.e-livetile-enable .e-tile-slideback {
        position: absolute;
        transform: translateY(0px);
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        transition-duration: 350ms;
        -webkit-transition-duration: 350ms;
        -moz-transition-duration: 350ms;
    }

    .e-tile.e-livetile-enable .e-tile-slide {
        position: absolute;
        transform: translateY(100%);
        -webkit-transform: translateY(100%);
        -moz-transform: translateY(100%);
        -ms-transform: translateY(100%);
        transition-delay: 350ms;
        -webkit-transition-delay: 350ms;
        -ms-transition-delay: 350ms;
        transition-duration: 0ms;
        -webkit-transition-duration: 0ms;
        -moz-transition-duration: 0ms;
        -ms-transition-duration: 0ms;
    }

    .e-tile.e-livetile-enable .e-tile-slideup {
        position: absolute;
        transform: translateY(-100%);
        -webkit-transform: translateY(-100%);
        -moz-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
        transition-duration: 350ms;
        -webkit-transition-duration: 350ms;
        -moz-transition-duration: 350ms;
    }

    .e-tile.e-livetile-enable .e-tile-carouselback {
        position: absolute;
        transform: translateX(0px);
        -webkit-transform: translateX(0px);
        -moz-transform: translateX(0px);
        -ms-transform: translateX(0px);
        transition-duration: 350ms;
        -webkit-transition-duration: 350ms;
        -moz-transition-duration: 350ms;
    }

    .e-tile.e-livetile-enable .e-tile-carousel {
        position: absolute;
        transform: translateX(100%);
        -webkit-transform: translateX(100%);
        -moz-transform: translateX(100%);
        -ms-transform: translateX(100%);
        transition-delay: 350ms;
        -webkit-transition-delay: 350ms;
        -ms-transition-delay: 350ms;
        transition-duration: 0ms;
        -webkit-transition-duration: 0ms;
        -moz-transition-duration: 0ms;
        -ms-transition-duration: 0ms;
    }

    .e-tile.e-livetile-enable .e-tile-carouselup {
        position: absolute;
        transform: translateX(-100%);
        -webkit-transform: translateX(-100%);
        -moz-transform: translateX(-100%);
        -ms-transform: translateX(-100%);
        transition-duration: 350ms;
        -webkit-transition-duration: 350ms;
        -moz-transition-duration: 350ms;
    }

    .e-tile.e-livetile-enable .e-image-parent.e-tile-flip {
        position: absolute;
        transform: perspective(1000px) rotateX(180deg);
        -webkit-transform: perspective(1000) rotateX(180deg);
        -moz-transform: perspective(1000) rotateX(180deg);
        transition-duration: 350ms;
        -webkit-transition-duration: 350ms;
        -moz-transition-duration: 350ms;
    }

    .e-tile.e-livetile-enable .e-image-parent.e-tile-flipback {
        position: absolute;
        transform: perspective(1000px) rotateX(0deg);
        -webkit-transform: perspective(1000) rotateX(0deg);
        -moz-transform: perspective(1000) rotateX(0deg);
        transition-duration: 350ms;
        -webkit-transition-duration: 350ms;
        -moz-transition-duration: 350ms;
    }
}

.gantt-textOverflow() {
    -ms-text-overflow: ellipsis;
    -webkit-text-overflow: ellipsis;
    -khtml-text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
}

.gantt-user-select() {
    -ms-user-select: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -o-user-select: none;
    -moz-user-select: -moz-none;
    user-select: none;
    -webkit-touch-callout: none;
}

.gantt-border-boxSizing() {
    -ms-box-sizing: border-box !important;
    -webkit-box-sizing: border-box !important;
    -khtml-box-sizing: border-box !important;
    -o-box-sizing: border-box !important;
    -moz-box-sizing: border-box !important;
    box-sizing: border-box !important;
}

.gantt-content-boxSizing() {
    -ms-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    -khtml-box-sizing: content-box;
    -o-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}

.e-gantt .e-gantt-criticaltask:before{
  content:"\e822";
}
.mixin(@widget) when (@widget = gantt), (@widget = none) {


    .e-gantt *:focus {
        outline: none;
    }

    .e-gantt-core {
        display: inline-block;
        -webkit-tap-highlight-color: rgba(0,0,0,0);
    }

    .e-gantt .e-gantt-Spliter {
        .gantt-user-select();
    }

    .e-gantt .e-treegridPane {
        overflow-y: hidden;
    }

    .e-gantt .e-ganttchartPane {
        overflow: hidden;
    }

    .e-gantt .e-gantttoolbar {
        height: 36px !important;
        display: block !important;
        background-repeat: no-repeat !important;
        background-attachment: scroll !important;
        -ms-user-select: none; /*selection*/
        -webkit-user-select: none;
        -khtml-user-select: none;
        -o-user-select: none;
        -moz-user-select: -moz-none;
        user-select: none;
        -webkit-touch-callout: none;
    }

    .e-gantt .e-toolbar {
        border-width: 1px 1px 0px 1px !important;
        outline: none;
        -webkit-user-select: none; /*unselectable*/
        -ms-user-select: none;
        -khtml-user-select: none;
        -o-user-select: none;
        -moz-user-select: -moz-none;
        user-select: none;
        -webkit-touch-callout: none;
        outline: none;
    }

    .e-gantt .e-toolbarspan {
        margin: 0;
    }

    .e-gantt .e-search.e-tooltxt.e-hover {
        background: none !important;
        border-color: transparent !important;
        padding: 2px !important;
    }

    .e-search.e-tooltx {
        box-shadow: none !important;
    }

    .e-gantt .e-disable.e-tooltxt:hover {
        background: none !important;
    }

    .e-treegrid .e-disable.e-tooltxt:hover {
        background: none !important;
    }


    .e-gantt .e-toolbaricons {
        font-size: 20px;
        float: left;
    }


    .e-gantt .e-gantt-collapseall:before {
        margin-left: 3px;
        margin-top: 5px;
    }

    .e-gantt .e-gantt-criticaltask:before {
        margin-left: 3px;
        margin-top: 5px;
    }

    .e-gantt .e-gantt-prevtimespan:before {
        content: "\e74b";
    }

    .e-gantt .e-gantt-nexttimespan:before {
        content: "\e74a";
    }

    #Task.e-menuitem > span.e-icon:before {
        content: "\e601";
        padding-top: 3px;
    }

    #Add.e-menuitem > div.e-icon:before,
    div.e-menuitem > div.e-expander:before {
        padding-top: 3px;
    }

    #Indent.e-menuitem > div.e-icon:before {
        padding-top: 3px;
    }

    #Outdent.e-menuitem > div.e-icon:before {
        padding-top: 3px;
    }

    #Delete.e-menuitem > div.e-icon:before {
        padding-top: 3px;
    }

    div.e-menuitem > div.e-expander:before, div.e-columnmenu span.e-expander:before,
    div.e-contextmenu div.e-expander:before,
    div.e-columnmenu div.e-expander:before {
        content: "\e67e" !important;
    }

    #PrevTimeSpan.e-menuitem > div.e-icon:before {
        padding-top: 3px;
    }

    #NextTimeSpan.e-menuitem > div.e-icon:before {
        padding-top: 3px;
    }

    .e-gantt .e-addnewitem {
        font-size: 14px;
        margin-left: 3px;
        padding-top: 4px;
    }

    .e-gantt .e-excelIcon:before {
        font-size: 14px;
        margin-left: 3px;
        padding-top: 4px;
        content: "\e718";
    }

    .e-gantt .e-searchitem {
    }

    .e-gantt .e-edititem {
        font-size: 14px;
        margin-left: 3px;
        padding-top: 4px;
    }

    .e-gantt .e-deleteitem {
        font-size: 14px;
        margin-left: 3px;
        padding-top: 4px;
    }

    .e-gantt .e-saveitem {
        font-size: 14px;
        margin-left: 3px;
        padding-top: 4px;
    }

    .e-gantt .e-cancel {
        font-size: 14px;
        margin-left: 3px;
        padding-top: 4px;
    }

    .e-gantt .e-indent {
        font-size: 14px;
        margin-left: 3px;
        padding-top: 4px;
    }

    .e-gantt .e-outdent {
        font-size: 14px;
        margin-left: 3px;
        padding-top: 4px;
    }

    .e-gantt .e-expandall {
        font-size: 12px;
        margin-left: 6px;
        padding-top: 7px;
    }

    .e-gantt .e-collapseall {
        font-size: 13px;
    }

    .e-gantt .e-criticaltask {
        font-size: 14px;
    }

    .e-gantt .e-prevtimespan,
    .e-gantt .e-nexttimespan {
        font-size: 14px;
        margin-left: 3px;
        padding-top: 5px;
    }

    .e-gantt .e-collapse,
    .e-gantt .e-h-arrow {
        z-index: 2 !important;
    }

    .e-gantt .e-splitter {
        border-style: solid !important;
        border-width: 1px 0px !important;
    }

    .e-gantt .e-dialog .e-titlebar {
        padding: 0.7em 0 0.2em 0 !important;
        border-bottom-width: 3px !important;
        border-style: none none solid none !important;
        margin: 0 auto !important;
        width: 95% !important;
        font-weight: 600;
    }

    .e-addpre.e-icon:before {
        background-color: #72af33;
        border: thin solid #72af33;
        border-radius: 11px;
        color: #ffffff;
        content: "\e691";
        display: inline;
        font-size: 14px;
        font-family: 'ej-webfont';
    }

    .e-addpre.e-icon {
        display: inline-block;
        width: 80px;
    }

    .e-deletepre.e-icon:before {
        background-color: #ec1e24;
        border: thin solid #ec1e24;
        border-radius: 9px;
        color: #ffffff;
        content: "\e693";
        display: inline;
        font-family: 'ej-webfont';
    }

    .e-gantt .e-editValue .e-treegrid .e-headercell {
        border-bottom-width: 1px;
    }

    .e-gantt .e-dialog .e-header {
        font-weight: 600;
    }

    .e-gantt .e-dialog-wrap.e-dialog {
        width: auto !important;
    }

    .e-gantt .e-shadow {
        box-shadow: none !important;
    }

    .e-gantt .e-dialog .e-numeric .e-padding,
    .e-gantt .e-dialog .e-percent .e-padding,
    .e-gantt .e-dialog .e-currency .e-padding,
    .e-gantt .e-dialog .e-atc .e-padding,
    .e-gantt .e-dialog .e-datewidget .e-padding,
    .e-gantt .e-dialog .e-ddl .e-in-wrap,
    .e-gantt .e-dialog .e-timewidget .e-padding,
    .e-gantt .e-dialog .e-datetime-wrap .e-padding {
        padding: 0 !important;
    }

    .e-gantt .e-dialog .e-dialog-content {
        width: auto !important;
        height: auto !important;
    }

    .e-gantt .e-dialog-scroller {
        height: auto !important;
    }

    .e-gantt .e-title {
        position: absolute;
        margin-top: -4px;
    }

    .e-gantt .e-dialog-icon .e-close {
        position: absoloute;
    }

    .e-gantt .e-icon.e-close {
        position: absolute;
    }

    .e-gantt .e-gantttoolbar li {
        padding: 4px 0 5px 5px;
    }

    .e-gantt .e-ejinputtext:focus {
        box-shadow: none;
    }

    .e-gantt .e-dialog .e-widget-content {
        padding: 0;
    }

    .e-gantt .e-field.e-ejinputtext {
        text-indent: 4px;
    }

    .e-gantt .e-datewidget input.e-input {
        line-height: 20px;
    }

    .e-gantt .e-splitter .e-splitbar.e-h-bar:before {
        top: 50%;
        left: 0.5px;
        position: absolute;
    }

    .e-gantt .e-datewidget input.e-input {
        line-height: 20px;
    }

    .e-gantt .e-splitter .e-splitbar.e-h-bar {
        font-family: 'ej-webfont';
        speak: none;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
        /* Better Font Rendering =========== */
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        font-size: 14px;
    }

    .e-gantt .e-splitter .e-splitbar.e-h-bar .e-h-arrow {
        display: none;
    }

    .e-ganttdialog .e-tab.e-js .e-header > .e-select, .e-ganttdialog .e-tab.e-js .e-header > .e-active {
        font-size: 16px !important;
    }

    .e-ganttdialog .e-titlebar {
        font-size: 16px !important;
    }
}

.mixin(@widget) when (@widget = treegrid), (@widget = none) {
    .e-treegrid-core {
        border-collapse: collapse;
        font-size: @gantt-content-font-size;
        height: auto;
        outline: 0 none;
        -webkit-tap-highlight-color: rgba(0,0,0,0);
    }

    .e-treegridtoolbar {
        border-color: #c3c3c3 !important;
        background-color: #fff;
        box-sizing: border-box !important;
        -webkit-box-sizing: border-box !important;
        -moz-box-sizing: border-box !important;
    }

    .e-treegrid .e-toolbarspan {
        margin: 0;
    }

    .e-treegrid .e-widget [class^="e-"] {
        box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
    }

    .e-treegrid *:focus {
        outline: none;
    }

    .e-treegrid .e-treegridexpand:before {
        content: "\e67c";
        font-size: 7px !important;
    }

    .e-treegrid .e-treegridcollapse:before {
        content: "\e67e";
    }

    .e-treegrid .e-treegridexpand {
        margin-top: 4px;
        margin-left: 2px;
    }

    .e-treegrid .e-detailsinfoiconshow {
        margin-left: 5px;
    }

    .e-treegrid .e-detailsinfoiconhide {
        margin-left: 5px;
    }

    .e-treegrid .e-detailsinfoiconshow:before {
        content: "\e77b";
        font-size: 4px;
        margin-left: 4px;
    }

    .e-treegrid .e-detailsinfoiconhide:before {
        content: "\e77b";
        font-size: 4px;
        margin-left: 4px;
    }

    .e-treegrid .e-detailsiconcell {
        border-radius: 5px;
        padding-top: 5px;
        height: 15px;
        width: 28px;
    }

    .e-treegrid .e-detailsrowcell {
        padding: 0px !important;
        cursor: default;
    }

    .e-treegrid .e-detailheadercell {
        border-top: none !important;
        background-color: transparent !important;
    }

    .e-treegrid .e-detailscellwrapper {
        overflow: auto;
        padding: 10px 10px 10px 10px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

    .e-detailscellwrapperfly {
        overflow: auto;
        padding: 10px 10px 10px 10px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        z-index: 1000;
        border-width: 1px;
        border-style: solid;
    }

    .e-treegrid .e-detailsrowcell {
        border-collapse: collapse;
        border-style: solid;
        border-width: 0 1px 1px 0;
        display: table-cell;
        overflow: hidden;
        width: auto;
        vertical-align: middle;
        .gantt-border-boxSizing();
        text-align: left;
        margin-left: 10px;
        padding-left: 10px;
        padding-right: 10px;
        padding-top: 0;
        padding-bottom: 0;
    }

    .e-treegrid .e-treegridcollapse {
        margin-top: 4px;
        margin-left: 2px;
    }

    .e-treegrid .e-treegridtoolbar li {
        padding: 5px 0 5px 5px;
        box-sizing: content-box !important;
        -webkit-box-sizing: content-box !important;
        -moz-box-sizing: content-box !important;
    }

    .e-treegrid .e-treegrid-collapseall:before {
        margin-left: 3px;
        margin-top: 5px;
    }

    .e-treegrid .e-treegrid-collapseall:before {
        margin-left: 3px;
        margin-top: 5px;
    }

    .e-treegrid .aboveIcon:before {
        content: "\e765";
        font-size: 20px;
        margin-top: -5px;
        margin-left: -4px;
    }

    .e-treegrid .belowIcon:before {
        content: "\e766";
        font-size: 20px;
        margin-top: 5px;
        margin-left: -4px;
    }

    .e-treegrid .childIcon:before {
        content: "\e764";
        font-size: 20px;
        margin-left: -4px;
    }

    .e-treegrid .cancelIcon:before {
        content: "\e767";
        font-weight: 200;
        font-size: 20px;
        margin-left: -4px;
    }

    .e-treegrid .e-table {
        width: 100%;
        table-layout: fixed;
        border: 0 none;
        margin-top: 0px;
        border-collapse: separate;
    }

    .e-ganttchart .e-ganttgridLinesTable,
    .e-ganttviewerbodyContianer-ganttViewTable {
        border-collapse: separate;
        margin-top: 0px;
    }

    .e-treegrid .e-hide {
        display: none !important;
    }

    .e-treegrid .e-scrollcss {
        padding-right: 17px;
    }

    .e-treegrid .e-gridheadercontainer {
        -webkit-user-select: none;
        /*unselectable*/
        -ms-user-select: none;
        -khtml-user-select: none;
        -o-user-select: none;
        -moz-user-select: -moz-none;
        user-select: none;
        -webkit-touch-callout: none;
    }

    .e-treegrid .e-scrollcss .e-gridheadercontainer {
        border-right-style: solid;
        border-right-width: 1px;
    }

    .e-treegrid .e-borderbox {
        box-sizing: border-box !important;
        -webkit-box-sizing: border-box !important;
        -moz-box-sizing: border-box !important;
        border-bottom-width: 16px;
        border-bottom-style: solid;
    }

    .e-treegrid .e-gridcontent {
        overflow: hidden;
        outline: none;
        -webkit-user-select: none; /*unselectable*/
        -ms-user-select: none;
        -khtml-user-select: none;
        -o-user-select: none;
        -moz-user-select: -moz-none;
        user-select: none;
        -webkit-touch-callout: none;
    }

    .e-treegrid .e-headercell {
        border-collapse: collapse;
        padding: 0 0.5em;
        overflow: hidden;
        .gantt-textOverflow();
        white-space: nowrap;
        text-align: left;
        border-style: solid;
        border-width: 0px 1px 0px 0px;
        outline: none;
        -ms-user-select: none; /*user select*/
        -webkit-user-select: none;
        -khtml-user-select: none;
        -o-user-select: none;
        -moz-user-select: -moz-none;
        user-select: none;
        -webkit-touch-callout: none;
        .gantt-border-boxSizing();
    }

    .e-treegrid .e-filterHeader {
        cursor: pointer;
    }

    .e-treegrid .e-spanstyle {
        cursor: pointer;
        display: block;
        height: 16px;
        position: absolute;
        right: 8%;
        top: 1px;
        width: 21px;
        color: gray;
        margin: 4px 0;
    }

    .e-treegrid .e-filterbarcell {
        border-style: solid;
        border-width: 1px 1px 0 0px;
        cursor: default;
        padding: 0;
        vertical-align: middle;
        font-weight: normal;
    }

    .e-treegrid .e-filterbarcell .e-filtertext {
        height: 24px;
    }

    .e-treegrid .e-filterbarcell .e-icon:before, .e-treegrid .e-dialog .e-icon:before {
        display: block;
    }

    .e-treegrid .e-filterbarcell .e-icon:before {
        display: block;
        height: 14px;
        margin: 0 auto;
    }

    .e-treegrid .e-filterbarcell .e-ddl .e-down-arrow.e-icon:before {
        display: block;
        height: 12px !important;
        margin: 0 auto;
        width: 12px !important;
    }

    .e-treegrid .e-field {
        padding: 1px;
    }

    .e-treegrid .e-filterdiv {
        left: 1px;
        position: relative;
        right: 1px;
        width: 100%;
        height: 30px;
        padding: 1px;
        box-sizing: border-box;
    }

    .e-treegrid tr th:last-child {
        border-right: 0;
    }

    .e-treegrid tr td:last-child {
        border-right: 0;
    }

    .e-treegrid .e-headercelldiv {
        font-weight: 600;
        font-size: @gantt-header-font-size;
        display: block;
        border: 0 none;
        height: 29px;
        line-height: 29px;
        overflow: hidden;
        margin: -7px;
        padding: 0 14px 0 7px;
        text-align: left;
        white-space: nowrap;
    }

    .e-treegrid .e-toolbar {
        border-width: thin !important;
        border-bottom-style: none !important;
        outline: none;
        -webkit-user-select: none; /*unselectable*/
        -ms-user-select: none;
        -khtml-user-select: none;
        -o-user-select: none;
        -moz-user-select: -moz-none;
        user-select: none;
        -webkit-touch-callout: none;
        outline: none;
    }

    .e-treegrid .e-treegridtoolbar {
        height: 36px !important;
        display: block !important;
        background-repeat: no-repeat !important;
        background-attachment: scroll !important;
        -ms-user-select: none; /*selection*/
        -webkit-user-select: none;
        -khtml-user-select: none;
        -o-user-select: none;
        -moz-user-select: -moz-none;
        user-select: none;
        -webkit-touch-callout: none;
    }

    .e-treegrid .e-toolbaricons {
        float: left;
    }

    .e-treegrid .e-edit {
        font-size: 14px;
        margin-left: 3px;
        padding-top: 4px;
    }

    .e-treegrid .e-addnew {
        font-size: 14px;
        margin-left: 3px;
        padding-top: 4px;
    }

    .e-treegrid .e-excelIcon:before {
        content: "\e718";
        padding-top: 3px;
    }

    .e-treegrid .e-pdfIcon:before {
        content: "\e717";
    }

    .e-treegrid .e-addnew, .e-treegrid .e-pdfIcon {
        font-size: 14px;
        margin-left: 3px;
        padding-top: 4px;
    }

    .e-treegrid .e-delete {
        font-size: 14px;
        margin-left: 3px;
        padding-top: 4px;
    }

    .e-treegrid .e-save {
        font-size: 14px;
        margin-left: 3px;
        padding-top: 4px;
    }

    .e-treegrid .e-cancel {
        font-size: 14px;
        margin-left: 3px;
        padding-top: 4px;
    }

    .e-treegrid .e-expandall {
        font-size: 12px;
        margin-left: 6px;
        padding-top: 5px;
    }

    .e-treegrid .e-collapseall {
        font-size: 13px;
    }

    .e-treegrid .e-treegridrowexpand, .e-treegrid .e-treegridrowcollapse .e-rowcell {
        font-weight: @gantt-parentGanttRecord-font-weight;
    }
    .e-treegrid .e-rowcell .e-cell ,
    .e-treegrid .e-rowcell .e-inner-treecolumn-container
    {
        word-wrap:normal;
        white-space: nowrap;
    }
    .e-treegrid .e-rowcell {
        border-collapse: collapse;
        border-style: solid;
        border-width: 0 1px 1px 0;
        display: table-cell;
        overflow: hidden;
        white-space: nowrap;
        width: auto;
        vertical-align: middle;
        .gantt-border-boxSizing();
        text-align: left;
        margin-left: 10px;
        padding-left: 10px;
        padding-right: 10px;
        padding-top: 0;
        padding-bottom: 0;
    }


    .e-dragrowcell {
        border-collapse: collapse;
        border-style: solid;
        border-width: 0 1px 1px 0;
        display: table-cell;
        overflow: hidden;
        white-space: nowrap;
        width: auto;
        vertical-align: middle;
        .gantt-border-boxSizing();
        text-align: left;
        margin-left: 10px;
        padding-left: 10px;
        padding-right: 10px;
        padding-top: 0;
        padding-bottom: 0;
    }


    .e-treegrid .e-descending:before {
        content: "\e673";
        display: inline-block;
        font-size: 14px;
        margin-left: 10px;
    }

    .e-treegrid .e-ascending:before {
        content: "\e672";
        display: inline-block;
        font-size: 14px;
        margin-left: 10px;
    }

    .e-treegrid .e-spacing {
        padding: 3px 9px;
        *float: left;
    }

    .e-treegrid .e-gridheader {
        overflow-x: hidden;
        background-repeat: repeat-x;
        background-attachment: scroll;
        background-position: 0 0;
        border-bottom-style: solid;
        border-bottom-width: 1px;
        .gantt-border-boxSizing();
    }

    .e-treegrid .e-treegrid-icon .e-ascending,
    .e-treegrid .e-treegrid-icon .e-descending {
        padding-right: 26px;
        padding-top: 2px;
    }

    .e-treegrid {
        border-top: none;
    }

    .e-treegrid .e-editedcell {
        padding: 2px;
        margin: 0;
    }

    .e-treegrid .e-editedfirstcell {
        padding: 0 0 4px;
    }

    .e-treegrid .e-tabletd {
        padding: 0;
        border-collapse: collapse;
    }

    .e-treegrid .e-ejinputtext {
        border-width: 1px;
        border-style: solid;
        outline: none;
        vertical-align: baseline;
        float: left;
    }

    .e-treegrid .e-ejinputtext:focus {
        box-shadow: 0 0 5px;
    }


    .e-treegrid .e-reSizeColbg {
        position: absolute;
        border-left: 1px dotted;
    }

    .e-treegrid .e-gridcontent .e-rowcell,
    .e-treegrid .e-gridheader .e-headercell {
        .gantt-user-select();
        vertical-align: middle;
    }

    .e-intend {
        padding-left: 0 !important;
    }

    .e-treegrid .e-icon.e-date:before {
        font-size: 22px;
    }

    .e-treegrid .e-icon.e-arrow:before {
        font-size: 8px;
        margin-left: 6px;
    }

    .e-treegrid .e-headercell .e-columnicon {
        height: 16px;
        width: 10px;
        float: right;
        margin-top: -17px;
        margin-right: -30px;
        padding: 3px;
        box-sizing: content-box;
        -webkit-box-sizing: content-box;
    }

    .e-treegrid .e-headercell .e-columnicon:before {
        font-size: 14px !important;
    }

    .e-treegrid .e-headercell .e-filtericon {
        height: 16px;
        width: 10px;
        float: right;
        margin-top: -17px;
        margin-right: -30px;
        padding: 3px;
        box-sizing: content-box;
        -webkit-box-sizing: content-box;
    }

    .e-treegrid .e-headercell .e-filtericon:before {
        font-size: 14px !important;
    }

    div.e-dialog.e-columnSelector {
        padding: 0;
    }

    .e-treegrid .e-columnmenu-icon:before {
        content: "\e76b";
    }

    .e-treegrid .e-summaryrow td,
    .e-treegrid .e-footersummaryrow td {
        font-weight: bold;
        border-width: 0px;
        font-size: 12px;
    }

    .e-treegrid .e-summaryrow td div,
    .e-treegrid .e-footersummaryrow td div {
        width: 40%;
    }

    .e-treegrid .e-summaryrow td:first-child div,
    .e-treegrid .e-footersummaryrow td:first-child div {
        width: 70%;
    }

    .e-treegrid .e-summaryrow td:last-child,
    .e-treegrid .e-footersummaryrow td:last-child {
        border-width: 0px 1px 0px 0px;
    }

    .e-columnMenuListDiv label {
        width: 175px;
        margin-left: 15px;
        display: inline-block;
        margin-bottom: 0px;
        font-weight: inherit;
    }

    .e-columnMenuListDiv {
        line-height: 1.9;
        white-space: nowrap;
        padding: 0px 8px 3px;
    }

    .e-column-insertleft-icon:before {
        content: "\e7f3";
    }

    .e-column-insertright-icon:before {
        content: "\e7f4";
    }

    .e-column-rename-icon:before {
        content: "\e7f5";
    }

    .e-column-filter-icon:before {
        content: "\e669";
    }

    .e-column-filtered-icon:before {
        content: "\e668";
    }

    .e-column-delete-icon:before {
        content: "\e7f6";
    }

    .e-columnmenu-ascending:before {
        content: "\e714";
    }

    .e-columnmenu-descending:before {
        content: "\e713";
    }

    .e-columnchooser-icon:before {
        content: "\e76e";
    }

    .e-treegrid .e-frozencontentdiv, .e-treegrid .e-frozenheaderdiv, .e-treegrid .e-frozenfooterdiv {
        float: left;
    }

    .e-treegrid .e-frozencontentdiv .e-table, .e-treegrid .e-movablecontentdiv .e-table {
        position: relative;
    }

    .e-treegrid .e-movablecontainer, .e-treegrid .e-movableheader, .e-treegrid .e-movablefooter {
        border-left-width: 1px;
        border-left-style: solid;
    }

    .e-treegrid .e-movablecontent, .e-treegrid .e-movableheader, .e-treegrid .e-movablefooter {
        overflow: hidden;
    }

    .e-freezecolumn-icon:before {
        content: "\e7da";
    }

    .e-unfreezecolumn-icon:before {
        content: "\e7d9";
    }

    .e-freezecolumnbefore-icon:before {
        content: "\e7db";
    }

    .e-treegrid .e-scrollcss .e-footercontainer {
        border-right-style: solid;
        border-right-width: 1px;
    }

    .e-treegrid .e-lastsummaryrow {
        border-bottom-width: 1px !important;
    }

    .e-columnmenuitem .e-icon {
        font-size: 16px !important;
    }

    .e-treegrid .e-headercelldiv div {
        display: inline-block;
    }

    .e-treegrid .e-headertemplate > .e-headercelldiv {
        padding: 0 8px;
    }

    .e-treegrid.e-wrap .e-headercelldiv {
        height: Auto;
        white-space: normal;
        line-height: 19px;
    }

    .e-treegrid.e-wrap .e-headercelldiv {
        margin-bottom: 2px;
        margin-top: 0px;
    }

    .e-treegrid .e-pager, .e-treegrid .e-pagerstatusbar {
        border-top-style: none !important;
        border-bottom-style: solid;
        border-bottom-width: 1px;
        border-left-style: solid;
        border-left-width: 1px;
        border-right-style: solid;
        border-right-width: 1px;
        padding-bottom: 9px;
        padding-top: 9px;
        white-space: normal;
    }

    .e-treegrid .e-pager .e-firstpage,
    .e-treegrid .e-pager .e-prevpage,
    .e-treegrid .e-pager .e-firstpagedisabled,
    .e-treegrid .e-pager .e-prevpagedisabled,
    .e-treegrid .e-pager .e-nextpage,
    .e-treegrid .e-pager .e-lastpage,
    .e-treegrid .e-pager .e-nextpagedisabled,
    .e-treegrid .e-pager .e-lastpagedisabled {
        padding: 9px 3px 8px 8px;
    }

    .e-treegrid .e-pagercontainer .e-icon:before {
        display: inline-block;
    }

    .e-treegrid .e-pager .e-numericitem {
        padding-right: 9px;
        padding-left: 9px;
        padding-bottom: 8px;
        padding-top: 6px;
    }

    .e-treegridicon {
        -webkit-box-sizing: content-box;
        box-sizing: content-box;
    }

    .e-treegrid .e-table {
        margin-top: 0px;
    }
    .e-treegrid .e-tableLastCell {
        border-right-width: 1px;
        border-style: solid;
    }
}

.mixin(@widget) when (@widget = ganttchart), (@widget = none) {
    .e-ganttchart .e-ganttviewercontainer {
        display: block;
        position: relative;
    }

    .e-ganttchart .e-widget [class^="e-"] {
        box-sizing: border-box;
    }

    .e-ganttchart .e-borderbox {
        box-sizing: border-box !important;
        -webkit-box-sizing: border-box !important;
        -moz-box-sizing: border-box !important;
        border-bottom-width: 16px;
        border-bottom-style: solid;
    }

    .e-ganttchart .e-ganttviewerheaderContainer {
        position: relative;
        overflow: auto;
        overflow-x: hidden;
        overflow-y: hidden;
        height: 45px;
        border-bottom-width: 1px;
        border-bottom-style: solid;
    }

    .e-ganttchart .e-ganttviewerbodyContianer {
        display: block;
        position: relative;
    }

    .e-ganttchart .e-ganttviewerbodyContianer-dependencyViewContainer {
        display: block;
        position: absolute;
        z-index: 1;
    }

    .e-ganttchart .e-ganttviewerbodyContianer-secondaryCanvas {
        display: block;
        position: absolute;
    }

    .e-ganttchart .e-gantt-schedule-container {
        display: block;
        position: static;
    }

    .e-ganttchart .e-ganttviewerbodyContianer-ganttViewTable {
        display: block;
        position: absolute;
        z-index: 2;
        margin-top: 0px;
        border-spacing: 0;
        overflow: hidden;
    }

    .e-ganttchart .e-ganttviewerbodyContent {
        display: block;
        position: relative;
    }

    .e-ganttchart-core {
        position: relative;
    }

    .e-ganttchart .e-schedule-headerrow-week > thead > tr > th,
    .e-ganttchart .e-schedule-headerrow-day > thead > tr > th {
        border-left: none;
    }

    .e-ganttchart .e-schedule-week-headercell-content {
        height: 22px;
    }

    .e-ganttchart .e-schedule-day-headercell {
        height: 25px;
        border-bottom: none !important;
    }

    .e-ganttchart .e-schedule-hour-headercell {
        height: 25px;
    }

    .e-ganttchart .e-schedule-day-headercell,
    .e-ganttchart .e-schedule-hour-headercell,
    .e-ganttchart .e-schedule-week-headercell {
        font-weight: @gantt-schedule-font-weight;
        font-size: @gantt-schedule-font-size;
        text-align: center;
        border-spacing: 0;
        border-style: solid;
        border-width: thin;
        white-space: nowrap;
        position: static;
        -ms-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -khtml-box-sizing: border-box;
        -o-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        .gantt-user-select();
        border-top: none;
        display: inline-block;
        padding: 0;
        margin: 0;
    }

    .e-ganttchart .e-ganttgridlines {
        display: table-cell;
        border-bottom-style: solid;
        border-bottom-width: 1px;
        -ms-box-sizing: border-box !important;
        -webkit-box-sizing: border-box !important;
        -khtml-box-sizing: border-box !important;
        -o-box-sizing: border-box !important;
        -moz-box-sizing: border-box !important;
        box-sizing: border-box !important;
        border-collapse: collapse;
        border-spacing: 0;
    }

    .e-ganttchart .gripper:before {
        content: "\e602";
        padding: 2px;
    }

    .e-ganttchart .taskbarresizer-right.e-icon.gripper {
        margin-left: -4px;
    }

    .e-ganttchart .taskbarresizer-left.e-icon.gripper {
        margin-left: -6px;
    }

    .e-ganttchart .e-schedule-headerrow-week,
    .e-ganttchart .e-schedule-headerrow-day {
        border-collapse: collapse;
        padding: 0;
        -ms-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -khtml-box-sizing: border-box;
        -o-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        border-width: 0;
        border-spacing: 0;
        margin: auto;
    }

    .e-ganttchart .e-chartcell {
        display: table-cell;
        border-bottom-style: solid;
        border-bottom-width: 1px;
        -ms-box-sizing: border-box !important;
        -webkit-box-sizing: border-box !important;
        -khtml-box-sizing: border-box !important;
        -o-box-sizing: border-box !important;
        -moz-box-sizing: border-box !important;
        box-sizing: border-box !important;
        border-collapse: collapse;
        border-spacing: 0;
        vertical-align: middle;
    }

    .e-ganttchart .e-tasknameContainer {
        text-align: right;
        position: relative;
    }


    .e-ganttchart .e-hoilday_label {
        -webkit-transform: rotate(270deg); /* Chrome & Safari */
        -moz-transform: rotate(270deg); /* Firefox */
        -ms-transform: rotate(270deg); /* IE 9+ */
        -o-transform: rotate(270deg); /* Opera */
        transform: rotate(270deg); /* CSS3 */
        filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678, sizingMethod='auto expand'); /* IE 7-8 */
    }

    .e-ganttchart .e-gantt-childtaskbar,
    .e-ganttchart .e-gantt-parenttaskbar-innerdiv {
        -ms-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -khtml-box-sizing: border-box;
        -o-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        margin: auto;
        border-spacing: 0;
        padding: 0;
        -moz-border-radius: 4px;
        -webkit-border-radius: 4px;
        border-radius: 4px;
        position: absolute;
        border-style: solid;
        border-width: 1px;
    }

    .e-ganttchart .milestone-top,
    .e-ganttchart .baseline-milestone-top,
    .e-ganttchart .milestone-bottom,
    .e-ganttchart .baseline-milestone-bottom {
        width: 0;
        height: 0;
        position: absolute;
        z-index: 3;
    }

    .e-ganttchart .taskbarresizer-left {
        position: absolute;
        z-index: 4;
    }

    .e-predecessor-false:before {
        background-color: #ec1e24;
        border: thin solid #ec1e24;
        border-radius: 9px;
        color: white;
        content: "\e656";
        display: inline;
        font-family: 'ej-webfont';
    }

    .e-predecessor-true:before {
        background-color: #72af33;
        border: thin solid #72af33;
        border-radius: 11px;
        color: white;
        content: "\e657";
        display: inline;
        font-size: 14px;
        font-family: 'ej-webfont';
    }

    .e-ganttchart .e-connectorpoint-left {
        position: absolute;
        z-index: 5;
    }

    .e-ganttchart .e-connectortouchpoint {
        position: absolute;
        z-index: 5;
        display: none;
    }

    .e-ganttchart .e-enableconnectortouchpoint {
        display: block;
    }

    .e-ganttchart .e-connectorpoint-right {
        position: absolute;
        z-index: 5;
    }

    .e-ganttchart .e-criticalconnectorline {
        z-index: 100 !important;
    }
    
    .e-ganttchart .e-criticalconnectorlinerightarrow {
        z-index: 100 !important;
    }
    
    .e-ganttchart .e-criticalconnectorlineleftarrow {
        z-index: 100 !important;
    }

    .e-ganttchart .e-connectorpoint-hover {
        cursor: pointer;
    }

    .e-ganttchart .e-gantt-parenttaskbar-innerdiv {
        position: absolute;
        z-index: 3;
    }

    .e-ganttchart .e-tasklabel {
        font-size: 11px;
        vertical-align: middle;
        margin-right: 10px;
        margin-left: 5px;
        display: block;
        font-weight: normal;
    }

    .e-ganttchart .e-gantt-childtaskbar-progress,
    .e-ganttchart .e-gantt-parenttaskbar-progress {
        position: static;
        margin: auto;
        border-top-left-radius: 4px;
        border-bottom-left-radius: 4px;
        -ms-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -khtml-box-sizing: border-box;
        -o-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        border-style: solid;
        border-width: 1px;
    }

    .e-ganttchart .e-progressright {
        border-top-right-radius: 4px;
        border-bottom-right-radius: 4px;
    }

    .e-ganttchart .e-ejganttschedule {
        display: inline-block;
        display: -moz-inline-stack;
        *display: inline;
        zoom: 1;
        white-space: nowrap;
        border-spacing: 0 !important;
        border-collapse: collapse;
        -ms-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -khtml-box-sizing: border-box;
        -o-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    .e-ganttchart td {
        position: static;
        margin: auto;
        border-spacing: 0;
        padding: 0;
        zoom: 1;
        white-space: nowrap;
        -ms-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -khtml-box-sizing: border-box;
        -o-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }


    .e-ganttchart .connectorline-rightarrow,
    .e-ganttchart .connectorline-leftarrow {
        border-top: 5px solid transparent;
        border-bottom: 5px solid transparent;
    }

    .e-ganttchart .connectorline-rightarrow {
        border-left-width: 10px;
        border-left-style: solid;
    }

    .e-ganttchart .connectorline-leftarrow {
        border-right-width: 10px;
        border-right-style: solid;
    }

    .e-tooltipgantt,
    .e-progressbartooltip,
    .e-editingtooltip,
    .e-tooltipganttpredecessor {
        width: auto;
        height: auto;
        min-height: 30px;
        position: relative;
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        border-radius: 3px;
        margin: 5px;
        display: block;
        overflow: hidden;
        z-index: 6;
        font-size: @gantt-tooltip-font-size;
        border-width: thin;
        border-style: solid;
        .gantt-user-select();
        padding: 5px;
    }

    .e-tooltiptaskname {
        font-size: @gantt-tooltip-font-size;
        font-weight: bold;
    }

    .e-ganttchart .e-progressbartooltip {
        width: 188px;
    }

    .e-ganttchart .e-childContainer,
    .e-ganttchart .e-parentContainer,
    .e-ganttchart .e-ganttviewerbodyContianer,
    .e-ganttchart .e-ganttviewerbodyContent {
        .gantt-user-select();
    }

    .e-ganttchart .e-taskbarname,
    .e-ganttchart .e-resourceinfo {
        font-size: @gantt-tasklable-font-size;
        .gantt-user-select();
        font-style: @gantt-tasklable-font-style;
        margin: 5px;
    }

    .customTooltip {
        z-index: 6;
        width: auto;
        padding: 3px;
    }

    .e-tooltiptable,
    .tooltiptd {
        margin: 5px;
        .gantt-content-boxSizing();
    }

    .e-tooltiptd-alignright {
        text-align: right;
    }

    .e-tooltiptd-alignleft {
        text-align: left;
    }

    .e-tooltiptd-aligncenter {
        text-align: center;
    }

    .e-ganttchart .e-holidays {
        position: absolute;
        white-space: nowrap;
        overflow: hidden;
    }

    .e-ganttchart .e-secondary-canvas-holiday {
        top: 0;
        position: absolute;
    }

    .e-ganttchart .e-holiday-label-ie8 {
        /* Internet Explorer */
        white-space: nowrap;
        position: relative;
        -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";
        filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
        display: inline-block;
    }

    .e-ganttchart .e-holiday-label {
        white-space: nowrap;
        position: relative;
        /* Safari */
        -webkit-transform: rotate(270deg);
        /* Firefox */
        -moz-transform: rotate(270deg);
        /* IE */
        -ms-transform: rotate(270deg);
        /* Opera */
        -o-transform: rotate(270deg);
        transform: rotate(270);
    }

    .e-ganttchart .e-striplinespan {
        color: white;
        white-space: nowrap;
        padding: 3px;
        position: absolute;
        height: auto;
        width: auto;
        font-size: 0.8em;
        top: 27px;
        left: -2px;
    }

    .e-ganttchart .e-stripline {
        top: 0;
        position: absolute;
        z-index: 4;
    }

    .e-ganttchart .e-stripLines {
        top: 0;
        position: absolute;
    }

    .e-ganttchart .e-weekends {
        position: absolute;
    }

    .e-ganttchart .e-progresshandle {
        width: 10px;
        height: 5px;
        position: absolute;
        left: 0;
        margin-left: 5px;
    }

    .e-progresshandleafter {
        position: absolute;
        left: 0;
        width: 0;
        height: 0;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
        border-bottom-width: 5px;
        border-bottom-style: solid;
        z-index: -100;
        margin-left: 5px;
    }

    .e-progresshandle .e-progresshandler-element {
        background: none repeat scroll 0 0 #FFFFFF;
        height: 4px;
        margin-bottom: 1px;
        margin-left: 1px;
        margin-right: 1px;
        width: 8px;
    }


    .e-progresshandleafter .e-progresshandlerafter-element {
        border-bottom: 5px solid #FFFFFF;
        border-left: 3px solid rgba(0, 0, 0, 0);
        border-right: 4px solid rgba(0, 0, 0, 0);
        height: 0;
        left: 0;
        margin-left: -3px;
        width: 0;
    }


    .e-ganttchart .e-headercell-weekend {
        -ms-background-clip: content-box;
        -webkit-background-clip: content-box;
        -khtml-background-clip: content-box;
        -o-background-clip: content-box;
        -moz-background-clip: content-box;
        background-clip: content-box;
    }

    .e-ganttchart .e-resourcename {
        outline: none;
    }

    .e-gantticon {
        -webkit-box-sizing: content-box;
        box-sizing: content-box;
    }

    .e-ganttchart .e-ganttgridLinesTable, .e-ganttchart .e-ganttviewerbodyContianer-ganttViewTable {
        margin-top: 0px;
    }
}

.mixin(@widget) when (@widget = recurrenceeditor), (@widget = none) {
    .e-recurrenceeditor .e-textlabel {
        font-weight: bold;
        text-align: left;
        cursor: default;
    }

    .e-recurrenceeditor table td {
        padding: 5px;
    }

    .e-recurrenceeditor .e-recurendsalign {
        margin-top: 8px;
    }

    .e-recurrenceeditor .e-recurendslabel {
        font-weight: bold;
        text-align: left;
        vertical-align: top;
        cursor: default;
    }

    .e-recurrenceeditor .e-labelcursor {
       cursor: default;
    }

    .e-recurrenceeditor .e-textmargin {
        margin: 4px;
    }
}

.mixin(@widget) when (@widget = schedule), (@widget = none) {

    .e-schedule.e-scheduleouter {
        font-family: @font-family;
        font-size: @font-size;
        overflow: hidden;
        display: block;
        visibility: visible;
        outline: medium none;
    }

    .e-schedule .e-scheduleoutertable {
        height: 100%;
        width: 100%;
        position: relative;
    }

    .e-schedule .e-scheduleoutertable td, e-schedule .e-scheduleoutertable tr {
        vertical-align: top;
    }

    .e-schedule .e-headrealldaytable td {
        vertical-align: middle;
    }

    .e-schedule .e-horizontalheader {
        vertical-align: middle !important;
    }

    .e-schedule .e-horizontalresheader {
        width: 100%;
        text-align: center;
        text-overflow: ellipsis;
        overflow: hidden;
    }

    .e-schedule .e-horizontaltimecells {
        position: relative;
        overflow: hidden;
        width: 100%;
    }

    .e-schedule .e-headertable {
        width: 100%;
    }

    .e-schedule .e-resourceheadertext {
        overflow: hidden;
        width: inherit;
        text-overflow: ellipsis;
        cursor: default;
        white-space: nowrap;
    }

    .e-schedule .e-headerdays {
        position: relative;
        width: 100%;
    }

    .e-schedule .e-agendacellstab {
        width: 100%;
        table-layout: fixed;
    }

    .e-schedule .e-agendacellstab td {
        height: 30px;
    }

    .e-schedule .e-agendaday {
        float: left;
        margin: 0 .2em 0 0;
        line-height: @schedule-agendaday-line-height;
        font-size: 3em;
        font-weight: normal;
    }

    .e-schedule .e-agendaweek {
        display: block;
        font-size: 1.1em;
        font-style: normal;
    }

    .e-schedule .e-agendamonth {
        font-size: .9em;
    }

    .e-schedule .e-datecolumn {
        width: 160px;
    }

    .e-schedule .e-timecolumn {
        width: 150px;
    }

    .e-schedule .e-resourcecolumn {
        width: 75px;
    }

    .e-schedule .e-agendacells {
        border-top: none;
        cursor: default;
    }

    .e-schedule .e-textwrapper {
        padding: 5px;
        margin-left: 5px;
        white-space: normal;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .e-schedule .e-hide {
        display: none !important;
    }

    .e-schedule .e-agendacolordiv {
        width: 14px;
        height: 14px;
        margin: 0 5px 0 0;
        display: inline-block;
        vertical-align: middle;
    }

    .e-schedule .e-scheduleallday:before {
        font-size: 16px;
    }

    .e-schedule .e-scheduleallday {
        margin-right: 5px;
        float: left;
    }

    .e-schedule .e-schedulerepeat:before,
    .e-schedule .e-recurapp:before {
        content: "\e7b7";
        font-size: 12px;
    }

    .e-schedule .e-appup:before {
        font-size: 16px;
    }

    .e-schedule .e-appdown:before {
        font-size: 16px;
    }

    .e-schedule .e-schedulerepeat,
    .e-schedule .e-schedulerepeatedit {
        display: inline-block;
        margin: 3px 5px 0 -2px;
        vertical-align: middle;
    }

    .e-schedule .e-schedulerepeatedit:before,
    .e-schedule .e-recureditapp:before {
        content: "\e7b8";
        font-size: 12px;
    }

    .e-schedule .e-firstcolumn {
        border-left: none !important;
    }

    .e-schedule .e-agendaappointment {
        position: relative;
        display: block;
        line-height: 14px;
    }

    .e-schedule .e-agendaappointment.e-selectedAppointment {
        border: none;
    }

    .e-schedule .e-agendacells:focus,
    .e-schedule .e-agendaappointment {
        outline: 0 none;
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none;
    }

    .e-schedule .e-agendahover {
        cursor: pointer;
        top: 0px;
        right: 0px;
        position: absolute;
        display: none;
        color: #2382c3;
        height: 14px;
    }

    .e-schedule .e-editapp:before {
        font-size: 16px;
    }

    .e-schedule .e-deleteapp:before {
        font-size: 16px;
    }

    .e-schedule .e-editapp,
    .e-schedule .e-deleteapp {
        padding-right: 10px;
        display: inline-block;
    }

    .e-schedule.e-rtl .e-textwrapper {
        padding: 5px;
        margin-right: 5px;
    }

    .e-schedule.e-rtl .e-scheduleallday,
    .e-schedule.e-rtl .e-agendaday {
        margin: 0 0 0 5px;
        float: right;
    }

    .e-schedule.e-rtl .e-schedulerepeat,
    .e-schedule.e-rtl .e-schedulerepeatedit,
    .e-schedule.e-rtl .e-agendacolordiv {
        margin: 0 -2px 0 5px;
    }

    .e-schedule.e-rtl .e-firstcolumn {
        border-right: none !important;
    }

    .e-schedule.e-rtl .e-agendahover {
        left: 0px;
        right: initial;
    }

    .e-schedule.e-rtl .e-editapp,
    .e-schedule.e-rtl .e-deleteapp {
        padding: 0 10px 0 0;
    }

    .e-schedule .e-horizontalheadertddate {
        vertical-align: middle !important;
        height: 30px;
        width: 70px;
    }

    .e-schedule .e-horizontalheaderdiv {
        text-align: center;
        overflow: hidden;
        height: 20px;
    }

    .e-schedule .e-horizontaltimetd {
        vertical-align: middle !important;
        height: 25px;
        overflow: hidden;
        text-align: center !important;
        position: static !important;
    }

    .e-schedule .e-horizontaltimespan {
        float: left;
        width: 25px;
    }

    .e-schedule .e-horizontaltimespandiv {
        font-size: 9px;
        margin-left: 22px;
        vertical-align: top;
        position: absolute;
    }

    .e-schedule .e-horizontalalternatetd {
        height: 25px;
        position: static !important;
    }

    .e-schedule .e-horizontmonthheaderdatetd {
        height: 15px;
    }

    .e-schedule .e-horizontmonthheaderdaytd {
        height: 15px;
        cursor: default;
    }

    .e-schedule .e-horizontresdiv {
        width: 100%;
        height: 100%;
        overflow: hidden;
        position: relative;
    }

    .e-schedule .e-horires {
        position: absolute;
        width: 100%;
        height: 100%;
    }

    .e-schedule .e-alternateworkcell {
        width: 25px;
    }

    .e-schedule .e-headerdays table tr:first td:first-child,
    .e-schedule .e-headerdays table tr:last td:first-child {
        border-left: none !important;
    }

    .e-scheduledialog .e-table,
    .e-schedule .e-table {
        border: 0 none;
        border-collapse: separate;
        margin: 0;
    }

    .e-categorizeMenuSelected {
        height: 18px;
        width: 18px;
    }

    .e-schedule .e-multipleCategory {
        position: absolute;
        bottom: 2px;
        right: 3px;
    }

    .e-schedule .e-table td {
        padding: 0;
    }

    .e-schedule .e-nextapp,
    .e-schedule .e-prevapp {
        cursor: pointer;
        position: absolute;
        border-radius: 7px 7px 0 0;
        text-align: center;
        width: 150px;
        height: 30px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .e-schedule .e-scheduleheader {
        height: 51px;
    }

    .e-schedule .e-contentarearow {
        height: 100%;
    }

    .e-schedule .e-horizontmonthdatealign {
        text-align: center;
        height: 15px;
        margin-left: 0px !important;
        margin-right: 0px !important;
    }

    .e-schedule .e-dateheadercell {
        height: 19px;
        margin: 5px;
        overflow: hidden;
        text-align: center;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .e-schedule .e-dateheaderselect {
        cursor: pointer !important;
    }

    .e-schedule .e-headercells {
        cursor: default;
    }

    .e-schedule .e-timecellpadding {
        padding-top: 0.45px;
    }

    .e-schedule .e-datecommondiv {
        border: none;
        cursor: pointer;
        float: left;
        padding: 8px 8px 8px 20px;
        position: absolute;
    }

    .e-schedule .e-viewsdiv {
        float: right;
        margin-right: 37px;
        height: 100%;
    }

    .e-schedule .e-viewstable {
        table-layout: fixed;
        margin-top: @schedule-viewstable-margin-top;
    }

    .e-schedule .e-viewstable tr, .e-schedule .e-viewstable td {
        border: none;
    }

    .e-schedule .e-datedisplay {
        border: none;
        font-size: 21px;
        cursor: pointer;
        text-align: center;
        outline: medium none;
        width: auto;
        display: inline-block;
        line-height: 1.42857;
    }

    .e-schedule.e-rtl .e-datedisplay {
        margin-left: 8px;
    }

    .e-schedule .e-commonviewbutton {
        cursor: pointer;
        height: 20px;
        padding: @schedule-commonviewbutton;
        text-align: center;
        margin-top: 15px;
        border-right: none;
        outline: none;
        box-shadow: @schedule-commonviewbutton-box-shadow;
    }

    .e-schedule .e-icon.e-topind:before {
        font-size: 12px;
    }

    .e-schedule .e-icon.e-bottomind:before {
        font-size: 12px;
    }

    .e-schedule .e-icon.e-bottomind {
        position: absolute;
        width: 100%;
        background-size: 19px;
        bottom: 0;
        left: 1px;
    }

    .e-schedule .e-icon.e-leftind:before {
        font-size: 12px;
    }

    .e-schedule .e-icon.e-leftind {
        position: absolute;
        background-size: 20px;
        top: 3px;
    }

    .e-schedule.e-rtl .e-icon.e-leftind {
        left: 3px;
        top: 3px;
    }

    .e-schedule .e-icon.e-rightind:before {
        font-size: 12px;
    }

    .e-schedule .e-icon.e-rightind {
        position: absolute;
        right: 0px;
        background-size: 19px;
        top: 3px;
    }

    .e-schedule .e-singleview {
        border-radius: 6px;
    }

    .e-schedule.e-rtl .e-lastview,
    .e-schedule .e-firstview {
        border-radius: 6px 0 0 6px;
    }

    .e-schedule.e-rtl .e-firstview,
    .e-schedule .e-lastview {
        border-radius: 0 6px 6px 0;
    }

    .e-schedule.e-rtl .e-lastview {
        border-right: none;
    }

    .e-schedule .e-schedulesettings {
        text-align: center;
    }

    .e-schedule .e-emptytrdesign {
        height: 3px;
        width: 100%;
    }

    .e-schedule .e-headrealldaytable {
        table-layout: fixed;
        height: 100%;
        position: relative;
        float: left;
    }

    .e-schedule .e-settingsindent,
    .e-schedule .e-leftindent, .e-schedule .e-workleftindent {
        width: 56px;
    }

    .e-schedule .e-leftindent {
        vertical-align: middle !important;
    }
    .e-schedule .e-fixedlayout,
    .e-schedule .e-leftindenttable {
        table-layout: fixed;
    }

    .e-schedule .e-workleftindent,
    .e-schedule .e-timecelltable tr:last-child td,
    .e-schedule .e-workcellstab tr:last-child td {
        border-bottom: none;
    }

    .e-schedule .e-lastcell {
        border-bottom: none !important;
    }

    .e-schedule .e-worktable {
        height: 100%;
        width: 100%;
        table-layout: fixed;
    }

    .e-schedule .e-workcells {
        border-top: none;
        cursor: default;
    }

    .e-schedule.e-scheduleouter,
    .e-scheduledialog {
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        overflow: hidden;
    }

    .e-schedule .e-monthcells {
        cursor: default;
    }

    .e-schedule .e-timecells {
        text-align: center;
        position: relative;
        cursor: default;
        width: 30px;
    }

    .e-schedule .e-timedivcells {
        width: 51px;
        overflow: hidden;
        text-align: center;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .e-schedule .e-headerareadiv {
        position: absolute;
        height: 100%;
        width: 100%;
    }

    .e-schedule .e-resourcecells {
        height: 27px;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .e-schedule .e-scrolltimecells {
        position: absolute;
    }

    .e-schedule .e-ampmdisplay {
        height: 20px;
    }

    .e-schedule .e-ampmstyle {
        font-size: 10px;
        text-align: center;
        overflow: hidden;
        text-overflow: ellipsis;
        width: 26px;
    }

    .e-schedule .e-ampmstyle,
    .e-schedule .e-commonviewbutton,
    .e-schedule .e-alldaycells {
        box-sizing: content-box;
    }

    .e-schedule .e-appointwrapper {
        position: relative;
    }

    .e-schedule .e-monthtimecells {
        -ms-transform: rotate(270deg);
        filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
        -moz-transform: rotate(270deg);
        -webkit-transform: rotate(270deg);
        -o-transform: rotate(270deg);
        text-align: justify;
    }

    .e-schedule .e-monthcurrenttime {
        font-weight: 600;
    }

    .e-schedule .e-highlightcurrenttimeline {
        height: 1px;
        position: absolute;
        z-index: 1;
    }

    .e-schedule .e-currenttime {
        height: 13px;
        width: 28px;
        margin-left: 25%;
        font-size: 9px;
        text-align: center;
    }

    .e-schedule .e-timewidth {
        width: 42px !important;
    }

    .e-schedule .e-appsoverflow {
        height: 15px;
        width: 15px;
        position: absolute;
        cursor: pointer;
    }

    .e-schedule .e-workareadiv {
        position: relative;
        height: 100%;
        overflow: hidden;
    }

    .e-schedule .e-workcellstab {
        width: 100%;
        table-layout: fixed;
    }

    .e-schedule .e-timecelltable {
        width: 100%;
    }

    .e-schedule .e-monthheader {
        padding-left: 5px;
        height: 20px;
        cursor: pointer;
    }

    .e-schedule .e-monthleftcells,
    .e-schedule .e-monthleftindent {
        width: 50px;
    }

    .e-schedule .e-monthappointment, .e-schedule .e-alldayappointment {
        box-sizing: border-box !important;
    }

    .e-schedule .e-monthappointment,
    .e-schedule .e-alldayappointment,
    .e-schedule .e-appointment {
        overflow: hidden;
        position: absolute;
        text-align: left;
        font-size: 12px;
        border-radius: @border-radius;
    }

    .e-schedule .e-scheduleheader > td {
        border-radius: @border-top-radius;
    }

    .e-schedule .e-contentarearow > td {
        border-radius: @border-bottom-radius;
    }

    .e-schedule .e-apptext {
        font-size: 11px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .e-schedule .e-apptime {
        white-space: nowrap;
        font-size: 10px;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .e-schedule .e-tophandle {
        height: 2px;
        position: absolute;
        top: 0;
        width: 100%;
    }

    .e-schedule .e-rowcursor {
        cursor: ns-resize;
    }

    .e-schedule .e-columncursor {
        cursor: e-resize;
    }

    .e-schedule .e-bottomhandle {
        height: 3px;
        position: absolute;
        width: 100%;
        bottom: 0;
    }

    .e-schedule .e-lefthandle {
        height: 100%;
        width: 10px;
        position: absolute;
        float: left;
        left: 0;
    }

    .e-schedule .e-righthandle {
        height: 100%;
        width: 10px;
        position: absolute;
        float: right;
        right: 0;
    }

    .e-schedule.e-rtl .e-horizontaltimespan {
        float: right;
        width: 25px;
        margin-right: 8px;
    }

    .e-schedule.e-rtl .e-navigateprevious,
    .e-schedule .e-navigateprevious {
        padding-right: 8px;
    }

    .e-schedule.e-rtl .e-navigatenext,
    .e-schedule .e-navigatenext {
        padding-left: 15px;
    }

    .e-schedule .e-lefttimeindicator {
        margin-left: -4px;
        margin-top: -19px;
        position: absolute;
    }

    .e-schedule .e-righttimeindicator {
        margin-top: -19px;
        position: absolute;
    }

    .e-scheduledialog .e-arrowtop {
        top: -10px !important;
    }

    .e-scheduledialog .e-datetimetd {
        width: 48%;
    }

    .e-scheduledialog .e-startenddate {
        width: 52%;
        float: left;
    }

    .e-scheduledialog .e-startendtime {
        width: 40%;
        float: left;
        margin-left: 20px;
    }

    .e-schedule.e-rtl .e-datecommondiv {
        float: right;
    }

    .e-schedule.e-rtl .e-viewsdiv {
        float: left;
        margin-left: 37px;
    }

    .e-schedule.e-rtl .e-headrealldaytable {
        float: right;
        border-right: medium none !important;
    }

    .e-schedule.e-rtl .e-currenttime {
        margin-right: 25%;
    }

    .e-schedule.e-rtl .e-lefttimeindicator {
        margin-right: -7px;
    }

    .e-schedule.e-rtl .e-righttimeindicator {
        margin-right: -6px;
        right: 100%;
    }

    .e-schedule .e-appointinnertext {
        overflow: hidden;
        padding: 1px 16px 1px 4px;
        text-align: left;
        vertical-align: top;
        height: 100%;
    }

    .e-schedule.e-rtl .e-appointinnertext {
        text-align: right;
        padding: 1px 4px 1px 16px;
    }

    .e-schedule .e-navigatenext,
    .e-schedule .e-navigateprevious {
        outline: medium none;
        display: inline-block;
        cursor: pointer;
        font-size: 16px;
    }

    .e-schedule .e-textellipsis {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        cursor: default;
    }

    .e-schedule .e-draggableworkarea {
        position: relative;
    }
    
    .e-schedule .e-headerscrolldiv {
        overflow: hidden;
    }
    
    .e-alldayappointment .e-appointinnertext {
        margin-top: -1px;
    }

    .e-schedule .e-blocktimewrapper {
        position: relative;
    }

    .e-schedule .e-blocktimeappointment {
        overflow: hidden;
        position: absolute;
        text-align: left;
        font-size: 12px;
        width: 100%;
    }

    .e-schedule .e-monthappointment,
    .e-schedule .e-alldayappointment,
    .e-schedule .e-appointment {
        z-index: 1;
    }

    .e-schedule .e-blockenable {
        z-index: 2;
    }

    .e-schedule .e-mobileNavigation {
        position: absolute;
        float: right;
        padding: 12px 10px 0px 0px;
    }

    .e-schedule .e-mobileNavigation:before {
        content: "\e75d";
        font-size: 20px;
    }

    .e-scheduledrawer .e-mAddEvent:before {
        content: "\e759";
        font-size: 36px;
        width: 36px;
        height: 36px;
        margin: 10px auto;
    }

    .e-scheduledrawer .e-mday:before {
        content: "\e75b";
        font-size: 36px;
        width: 36px;
        height: 36px;
        margin: 10px auto;
    }

    .e-scheduledrawer .e-mcustomview:before {
        content: "\e77c";
        font-size: 36px;
        width: 36px;
        height: 36px;
        margin: 10px auto;
    }

    .e-scheduledrawer .e-mweek:before {
        content: "\e760";
        font-size: 36px;
        width: 36px;
        height: 36px;
        margin: 10px auto;
    }

    .e-scheduledrawer .e-mworkweek:before {
        content: "\e762";
        font-size: 36px;
        width: 36px;
        height: 36px;
        margin: 10px auto;
    }

    .e-scheduledrawer .e-mmonth:before {
        content: "\e75e";
        font-size: 36px;
        width: 36px;
        height: 36px;
        margin: 10px auto;
    }

    .e-scheduledrawer .e-magenda:before {
        content: "\e781";
        font-size: 36px;
        width: 36px;
        height: 36px;
        margin: 10px auto;
    }

    .e-schedule .e-mobileNavigation,
    .e-scheduledrawer .e-mAddEvent,
    .e-scheduledrawer .e-mday,
    .e-scheduledrawer .e-mweek,
    .e-scheduledrawer .e-mworkweek,
    .e-scheduledrawer .e-mmonth,
    .e-scheduledrawer .e-mcustomview,
    .e-scheduledrawer .e-magenda {
        cursor: pointer;
    }

    .e-scheduledrawer .e-mAddEvent,
    .e-scheduledrawer .e-mday,
    .e-scheduledrawer .e-mweek,
    .e-scheduledrawer .e-mworkweek,
    .e-scheduledrawer .e-mmonth,
    .e-scheduledrawer .e-mcustomview,
    .e-scheduledrawer .e-magenda {
        height: 100% !important;
        width: 100% !important;
        margin-bottom: -3px;
        float: none !important;
    }

    .e-scheduledrawer .e-list-hdr > li > a > span {
        top: 0px !important;
        font-size: 12px !important;
        left: 0px !important;
        display: block;
        text-align: center;
        font-family: 'Segoe UI';
        padding-bottom: 5px;
        line-height: normal;
    }

    .navDrawerMenu li > a {
        padding: 0px !important;
    }

    .navDrawerMenu li {
        padding: 0px;
    }

    .e-schedule,
    .e-schedule [class^="e-"]:not(.e-box),
    .e-schedule [class*=" e-"]:not(.e-box) {
        -webkit-box-sizing: content-box;
        -moz-box-sizing: content-box;
        box-sizing: content-box;
    }

    .e-scheduledialog table td {
        padding: 5px;
    }

    .e-scheduledialog .e-appwindow,
    .e-scheduledialog .e-recurwindow {
        width: 550px;
    }

    .e-scheduledialog .e-inputtext {
        height: 26px;
        text-indent: 5px;
        width: 100%;
        padding: 1px;
        margin: 0;
        max-width: 100%;
        height: @schedule-input-height;
        border-radius: @border-radius;
    }

    .e-scheduledialog label {
        display: inline-block;
        font-size: inherit;
        font-weight: bold;
    }

    .e-scheduledialog .e-floatleft {
        float: left;
    }

    .e-scheduledialog .e-leftfields {
        width: 15%;
    }

    .e-scheduledialog .e-rightfields {
        width: 95%;
    }

    .e-scheduledialog .e-windowmargin {
        margin: 10px;
    }

    .e-scheduledialog .e-textlabel {
        font-weight: bold;
        text-align: left;
        cursor: default;
    }

    .e-scheduledialog .e-checkboxmargin {
        margin-bottom: 10px;
        margin-left: -3px;
    }

    .e-scheduledialog .e-textmargin {
        margin: 4px;
    }

    .e-scheduledialog .e-alldaytext {
        padding-right: 21px;
        white-space: nowrap;
    }

    .e-scheduledialog.e-rtl .e-chkbox-wrap .e-chk-image {
        margin-right: 0px;
    }

    .e-scheduledialog .e-appcheckbox {
        float: left;
    }

    .e-scheduledialog .e-apptextalign {
        float: left;
        padding-right: 15px;
    }

    .e-scheduledialog .e-controlalign {
        float: left;
        margin-right: 5px;
    }

    .e-scheduledialog.e-rtl .e-description {
        padding-right: 5px;
    }

    .e-scheduledialog .e-description {
        width: 99%;
        height: 70px;
        resize: vertical;
        text-indent: 0px;
        padding-left: 5px;
    }

    .e-scheduledialog .e-btnmargin {
        margin: 10px -3px 10px 13px;
    }

    .e-scheduledialog .e-recurendslabel {
        font-weight: bold;
        text-align: left;
        vertical-align: top;
    }

    .e-scheduledialog .e-recurendsalign {
        margin-top: 8px;
    }

    .e-scheduledialog .e-floatright {
        float: right;
    }

    .e-scheduledialog.e-rtl .e-floatright {
        float: left;
    }

    .e-scheduledialog .e-recurFinalRule,
    .e-scheduledialog .e-recurRule {
        padding-right: 10px;
        font-weight: normal;
    }

    .e-scheduledialog .e-recureditmsg {
        padding: 10px 0;
        cursor: default;
    }

    .e-scheduledialog .e-recureditopt {
        padding: 5px 0;
    }

    .e-scheduledialog .e-recureditlbl {
        padding: 0px 5px;
        position: relative;
        top: -3px;
    }

    .e-scheduledialog .e-recureditbtns {
        bottom: -1em;
        clear: both;
        padding: 0 7px 12px;
        text-align: right;
    }

    .e-scheduledialog.e-rtl .e-recureditbtns {
        bottom: -1em;
        clear: both;
        padding: 0 7px 35px;
        text-align: left;
    }

    .e-scheduledialog.e-rtl .e-recureditbtns .e-editonly {
        float: right;
        margin-left: 10px;
    }

    .e-scheduledialog .e-recureditbtns .e-editonly {
        margin-right: 10px;
    }

    .e-scheduledialog .e-recureditbtns .e-editseries {
        margin-right: 10px;
        width: auto;
    }

    .e-scheduledialog .tdpadding {
        padding-left: 0px;
    }

    .e-scheduledialog .e-alerttext {
        text-align: center;
        padding: 10px;
    }

    .e-scheduledialog .e-alertbtn {
        margin: 0 auto;
        text-align: center;
    }

    .e-scheduledialog .e-recuredit {
        display: none;
    }

    .e-scheduledialog .e-quickAppDone {
        margin-top: 2px;
        margin-right: 10px;
    }

    .e-scheduledialog .e-detailedapp {
        cursor: pointer;
        float: left;
        margin-left: 7px;
        width: 50%;
        font-size: 12px;
    }

    .e-scheduledialog.e-rtl .e-detailedapp {
        float: right;
    }

    .e-scheduledialog .e-detailedwindow {
        margin-top: 7px;
        outline: medium none;
    }

    .e-scheduledialog .icon-Pasteicon:before {
        float: left;
        margin-left: 10px;
        margin-top: 9px;
        vertical-align: middle;
    }

    .e-scheduledialog .icon-Close:before {
        float: right;
        cursor: pointer;
        font-size: 10px;
    }

    .e-schedulequickdialog > div {
        overflow: visible;
    }

    .e-scheduledialog .e-quickarrow {
        bottom: -1px;
        height: 10px;
        left: 40%;
        overflow: hidden;
        position: absolute;
        visibility: visible;
        width: 20px;
    }

    .e-scheduledialog .icon-Delete:before {
        font-size: 15px;
        margin-left: 5px;
        margin-top: 2px;
        position: absolute;
        cursor: pointer;
    }

    .e-schedule .icon-AddGrad:before {
        margin-top: 5px;
        float: right;
    }

    .e-scheduledialog .e-textellipsis {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .e-scheduledialog .e-editevents {
        font-size: 12px;
    }

    .e-scheduledialog .e-editevent {
        float: left;
        width: 100px;
        cursor: pointer;
        outline: medium none;
    }

    .e-scheduledialog .e-editseries {
        cursor: pointer;
        float: right;
        outline: medium none;
        margin-left: 12px;
        width: 88px;
        text-align: left;
    }

    .e-scheduledialog.e-rtl .e-editevent {
        float: right;
        margin-right: 2px;
        text-align: right;
    }

    .e-scheduledialog.e-rtl .e-editseries {
        float: left;
        text-align: right;
    }

    .e-scheduledialog .e-disableseries {
        cursor: default !important;
    }

    .e-scheduledialog .e-quickstartend {
        float: left;
        height: auto;
        width: 91%;
        font-size: 14px;
    }

    .e-scheduledialog.e-rtl .e-quickstartend,
    .e-scheduledialog.e-rtl .e-quicksubject {
        float: right;
    }

    .e-scheduledialog .e-quicksubject {
        padding-bottom: 4px;
        height: auto;
        width: 220px;
        float: left;
    }

    .e-scheduledialog .e-schedclosemargin {
        float: right;
        margin: 4px -10px 0 0;
    }

    .e-scheduledialog.e-rtl .e-schedclosemargin {
        float: left;
        margin: 4px 0 0 -10px;
    }

    .e-scheduledialog .e-pointercursor,
    .e-schedule .e-resourceicon {
        cursor: pointer;
        outline: medium none;
    }

    .e-scheduledialog .e-quickstartendtime {
        font-size: 12px;
        padding-bottom: 7px;
    }

    .e-scheduledialog .e-dialogouter {
        background: none repeat scroll 0 0 rgba(0, 0, 0, 0) !important;
        display: block;
        height: auto;
        margin-bottom: -9px !important;
        overflow: hidden;
        position: relative;
        z-index: 1001;
    }

    .e-scheduledialog .e-tableAppoint {
        background: none repeat scroll 0 0 rgba(0, 0, 0, 0) !important;
        position: relative;
        padding-bottom: 12px;
        padding-top: 0px;
        top: -3px;
    }

    .e-scheduledialog .e-tablePosition {
        padding-bottom: 0px;
        padding-top: 5px;
        top: 0px;
    }

    .e-scheduledialog.e-rtl .e-appdetails {
        padding-bottom: 27px;
    }

    .e-scheduledialog .e-qappwindow {
        width: 100%;
        cursor: default;
    }

    .e-scheduledialog .e-subjectlabel {
        width: 17%;
        font-size: 14px;
    }

    .e-schedule .e-priority {
        position: absolute;
        top: 0px;
        left: auto;
        right: 3px;
    }

    .e-schedule .e-alldayappointment .e-priority,
    .e-schedule .e-monthappointment .e-priority {
        top: -2px;
    }

    .e-schedule.e-rtl .e-priority {
        right: auto;
        left: 3px;
    }

    .e-priorwidth {
        width: 80%;
    }

    .e-none {
        height: 20px;
        width: 20px;
        float: left;
    }

    .e-high,
    .e-medium,
    .e-low {
        background: url('@{font-path}/schedule_priority.png');
        height: 12px;
        width: 20px;
        float: left;
        background-repeat: no-repeat;
        background-size: 60px;
        padding-top: 5px;
        padding-bottom: 5px;
    }

    .e-high {
        background-position: 0px;
    }

    .e-medium {
        background-position: -41px;
    }

    .e-low {
        background-position: -20px;
    }

    .e-schedule.e-rtl .e-navigatenext:before,
    .e-schedule .e-navigateprevious:before {
        content: "\e68b";
    }

    .e-schedule.e-rtl .e-navigateprevious:before,
    .e-schedule .e-navigatenext:before {
        content: "\e69b";
    }

    .e-schedule .e-resourceexpand:before {
        content: "\e664";
    }

    .e-schedule .e-resourcecollapse:before {
        content: "\e67c";
    }

    .e-schedule .e-resourceicon {
        font-family: "ej-webfont";
        font-size: 12px;
    }

    .e-schedule .e-resourcecollapse {
        font-size: 9px;
    }

    .e-scheduledialog .e-scheduledelete:before {
        font-size: 20px;
    }

    .e-scheduledialog .e-scheduleclose:before {
        content: "\e69e";
        font-size: 8px;
        margin: 4px 0 0 4px;
    }

    .e-scheduledialog.e-rtl .e-scheduleclose:before {
        margin: 4px 4px 0 0;
    }

    .e-schedule .e-schedulemouseclose:before {
        content: "\e779";
        font-size: 8px;
        width: 9px;
        height: 9px;
    }

    .e-schedule .e-schedulemouseclose:hover {
        cursor: pointer;
    }

    .e-schedule .e-icon.e-schedulemouseclose {
        top: 5px;
        display: none;
        position: absolute;
        z-index: 1;
        width: 9px;
        height: 9px;
        left: auto;
        right: 5px;
    }

    .e-schedule.e-rtl .e-icon.e-schedulemouseclose {
        right: auto;
        left: 5px;
    }

    .e-scheduledialog .e-alertbtn .e-alertOk {
        margin: 0px 10px 0px 10px;
    }

    .e-scheduledialog .e-alertbtn .e-alertCancel {
        margin-right: 10px;
    }

    .e-scheduledialog .e-recurtitle {
        font-size: 16px;
        font-weight: bold;
        padding: 8px;
    }

    .e-schedule .icon-AddGrad:before:before {
        content: "\e69f";
    }

    .e-schedule .e-timeidicatorcircle:before {
        font-size: 9px;
        top: 2px;
        left: -1px;
        position: absolute;
    }

    .e-schedule .e-ewexpand:before {
        content: "\e6fb";
        font-size: 14px !important;
    }

    .e-schedule .e-appointresizer-right {
        margin-right: -4px;
        margin-top: 2px;
    }

    .e-schedule .e-appointresizer-left {
        margin-left: 0;
        margin-top: 2px;
    }

    .e-schedule.e-rtl .e-appointresizer-left {
        margin-left: 4px;
        margin-top: 2px;
    }

    .e-schedule.e-rtl .e-appointresizer-right {
        margin-right: -8px;
        margin-top: 2px;
    }

    .e-schedule .e-nsexpand:before {
        content: "\e712";
        font-size: 14px !important;
        line-height: 0px;
    }

    .e-schedule .e-appointresizer-top {
        margin-top: 1px;
    }

    .e-schedule .e-appointresizer-bottom {
        margin-bottom: 0;
    }

    .e-schedule .e-appsoverflow:before {
        font-size: 12px;
    }

    .e-draggableAppointment {
        font-family: segoe UI;
        font-size: 11px;
        border: 1px solid black;
        background-color: #DBDBDE;
        overflow: hidden;
        z-index: 1;
    }

    .e-scheduletooltip {
        position: absolute;
        padding: 5px;
        margin-top: 15px;
        margin-left: 10px;
        text-align: left;
        font: 12px segoe UI;
        font-stretch: condensed;
        box-shadow: 0 0 9px rgba(0,0,0,.4);
        width: auto;
    }

    .e-schedule .e-upicon,
    .e-schedule .e-downicon {
        height: 20px;
        position: absolute;
        z-index: 1;
    }

    .e-schedule .e-appup,
    .e-schedule .e-appdown {
        float: right;
        margin-right: 2px;
        opacity: 0.5;
    }

    .e-schedule.e-rtl .e-appup,
    .e-schedule.e-rtl .e-appdown {
        float: left;
        margin-left: 2px;
        opacity: 0.5;
    }

    .e-schedule .e-recurapp,
    .e-schedule .e-recureditapp {
        display: inline-block;
        margin: 1px 5px 0 -1px;
        vertical-align: middle;
        float: left;
    }

    .e-schedule.e-rtl .e-recurapp,
    .e-schedule.e-rtl .e-recureditapp {
        margin: 1px 0 0 5px;
        float: right;
    }

    .e-schedule .e-scheduleAppGlassy {
        filter: alpha(opacity=60);
        -moz-opacity: 0.6;
        opacity: 0.6;
    }

    .e-scheduledialog div.e-error {
        position: absolute;
        z-index: 9999;
    }

    .e-scheduledialog div.e-error .e-errortail {
        height: 0;
        width: 0;
        position: relative;
        border-left: 8px solid transparent;
        border-right: 8px solid transparent;
        border-bottom: 8px solid;
    }

    .e-scheduledialog div.e-error .e-toparrow {
        left: 10%;
        border-top-width: 2px;
        display: block;
    }

    .e-scheduledialog.e-rtl div.e-error .e-toparrow {
        right: 10%;
    }

    .e-scheduledialog .e-error div.e-field-validation-error {
        border-radius: 4px;
        font-size: 14px;
        padding: 4px;
    }

    .e-scheduleAppGlassy { /*While enable external drag and drop the appointment rendered in body tag. The class applies only external drag and drop*/
        filter: alpha(opacity=60);
        -moz-opacity: 0.6;
        opacity: 0.6;
    }
}

.mixin(@widget) when (@widget = reportviewer), (@widget = none) {
    .e-reportviewer-icon {
        font-family: 'ej-webfont';
        speak: none;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        text-align: center;
        vertical-align: middle;
        line-height: normal !important;
        font-size: 17px;
        display: inline-block;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        cursor: default;
    }

    .e-reportviewer-toolbarcontainer {
        height: 38px;
        vertical-align: middle;
        border: 1px solid;
        border-bottom: none !important;
        -webkit-user-select: none;
        -ms-user-select: none;
        -moz-user-select: none;
    }

    .e-reportviewer-toolbarul {
        height: 34px;
        margin: .75px !important;
    }

    .e-reportviewer-toolbarli {
        margin: 2px 0px;
        width: 20px;
        height: 20px;
        padding: 4px !important;
    }

    .e-reportviewer-tbdiv {
        width: 16px;
        height: 16px;
        border: 1px solid;
        border-color: transparent;
        margin: 4px 0px;
    }

    .e-reportviewer-outerborder {
        background-color: transparent;
        border: 1px solid;
        border-color: transparent;
        width: 28px;
        height: 90%;
        margin: 1px;
        float: left;
    }

    .e-reportviewer-outerborder:hover {
        border: 1px solid;
    }

    .e-reportviewer-tbdiv.e-reportviewer-fittopagetip {
        width: auto;
        height: auto;
        min-height: 30.5px;
        min-width: 55px;
        position: absolute;
        padding: 1px;
        word-wrap: break-word;
        border: 1px solid;
        margin: 10px auto;
        z-index: 9999;
    }

    .e-reportviewer-tbdiv.e-reportviewer-exporttip {
        width: auto;
        height: auto;
        min-height: 30.5px;
        min-width: 55px;
        position: absolute;
        padding: 1px;
        word-wrap: break-word;
        border: 1px solid;
        margin: 10px auto;
        z-index: 9999;
    }

    .e-reportviewer-tbdiv.e-reportviewer-tooltip {
        width: auto;
        height: auto;
        min-height: 30.5px;
        min-width: 35px;
        position: absolute;
        padding: 1px;
        max-width: 250px;
        word-wrap: break-word;
        border: 1px solid;
        margin: 10px auto;
        z-index: 9999;
    }

    .e-reportviewer-headerspan {
        font-style: normal;
        font-weight: bold;
        padding: 1px;
        margin: 1.5px;
        word-wrap: break-word;
    }

    .e-reportviewer-contentspan {
        padding: 1px;
        margin-left: 15px;
        margin-bottom: 5px;
        margin: 0px 5px 5px 15px;
        word-wrap: break-word;
    }

    .e-reportviewer-ejdropdownlist {
        width: auto;
        height: 90%;
        margin: 3.7px 2px 2px 2px;
        float: left;
        border: 1px solid transparent;
    }

    .e-reportviewer-toolbarcontainer input.e-input, .e-reportviewer-viewerblockcontent input.e-input {
        line-height: normal !important;
    }

    .e-reportviewer-print, .e-reportviewer-emptyconetent, .e-reportviewer-pagefit, .e-reportviewer-export, .e-reportviewer-gotonext, .e-reportviewer-gotonext.e-reportviewer-disabled, .e-reportviewer-gotoprevious, .e-reportviewer-gotoprevious.e-reportviewer-disabled, .e-reportviewer-gotofirst, .e-reportviewer-gotofirst.e-reportviewer-disabled, .e-reportviewer-gotolast, .e-reportviewer-gotolast.e-reportviewer-disabled, .e-reportviewer-zoomin, .e-reportviewer-zoomout, .e-reportviewer-refresh, .e-reportviewer-parameter, .e-reportviewer-documentmap, .e-reportviewer-gotoparent, .e-reportviewer-preview, .e-reportviewer-pagesetup, .e-reportviewer-printsetup {
        width: 20px;
        height: 20px;
        margin-top: 1px;
    }

    .e-reportviewer-tbpage {
        background-color: transparent;
        float: left;
        text-align: center;
        margin-top: 3.6px;
        width: auto;
        height: 25px;
    }

    .e-reportviewer-pagenumber {
        min-height: 22px !important;
        min-width: 25px !important;
        height: 22px !important;
        width: 28px !important;
        text-align: center;
        margin-top: 3.7px;
        display: inline-block !important;
    }

    .e-reportviewer-tbdiv.e-reportviewer-zoomlist {
        border: 1px solid;
        margin: 4px 7px;
        width: 60px;
        height: 19px;
    }

    .e-reportviewer-viewer {
        width: 100%;
        text-shadow: none !important;
    }

    .e-reportviewer-viewerblock {
        width: 100%;
        border-top: 1px solid;
        border-bottom: 0px solid;
        border-left: 1px solid;
        border-right: 1px solid;
        overflow: auto;
        font-size: 11pt;
        color: #5B5B5B;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    .e-reportviewer-blockstyle {
        position: absolute;
        top: 0;
        left: 0;
        width: 99.5%;
        height: 100%;
        z-index: 10;
    }

    .e-reportviewer-viewerblockcontent {
        width: 100%;
    }

    .e-reportviewer-viewerblockcellcontent {
        border: 0;
        vertical-align: middle;
        -webkit-user-select: none;
        -ms-user-select: none;
        -moz-user-select: none;
    }

    .e-reportviewer-viewreport {
        border-left: 1px solid;
        border-right: 0;
        border-bottom: 0;
        border-top: 0;
        padding: 10px;
        text-align: center;
        vertical-align: top;
    }

    .e-reportviewer-viewreportbutton {
        line-height: normal;
        vertical-align: baseline;
        padding: initial;
        margin: initial;
        border: 1px solid;
    }

    .e-reportviewer-scrollcontainer {
        line-height: normal !important;
        position: relative;
        height: 100%;
        width: 100%;
        overflow: auto;
        text-align: left;
    }

    .e-reportviewer-pageviewcontainer {
        width: auto;
        height: auto;
        border: 1px none;
        margin: 0px auto;
    }

    .e-reportviewer-pageouterline {
        background-color: transparent;
        position: relative;
        border: 1px solid;
        border-color: transparent;
        margin: 0px auto;
        padding: 10px;
    }

    .e-reportviewer-pageview {
        position: absolute;
        -moz-box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.22);
        -webkit-box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.22);
        box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.22);
    }

    .e-reportviewer-elementalignments {
        border: 1px solid;
        margin: 0;
        padding: 1px !important;
    }

    .e-reportviewer-viewercontainer {
        border: 1px solid;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    .e-reportviewer-textbox {
        height: 23px;
        line-height: normal;
        text-indent: 10px;
        border: 1px solid;
        vertical-align: middle;
        padding: 0px;
    }

    .e-reportviewer-label, .e-reportviewer-labelpageno {
        border: none;
    }

    .e-reportviewer-documentmappopup {
        border: 1px solid;
    }

    .e-reportviewer-pagepopupinfo {
        height: 30px;
        width: auto;
        /*height: auto;*/
        min-width: 65px;
        position: absolute;
        padding: 1px;
        -ms-word-wrap: break-word;
        word-wrap: break-word;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        border-radius: 5px;
        border: 1px solid;
        margin: 10px auto;
        z-index: 9999;
        opacity: .5;
    }

    .e-reportviewer-popuppageno {
        min-width: 20px;
        height: 15px;
        display: table-cell;
    }

    .e-reportviewer-popuptotalpage {
        /*display: table-cell;*/
        /*vertical-align: middle;*/
    }

    .e-reportviewer-expandtoggle {
        background: url('@{font-path}/reports/plus.png') no-repeat center;
    }

    .e-reportviewer-collapsetoggle {
        background: url('@{font-path}/reports/minus.png') no-repeat center;
    }

    .e-reportviewer-sortingUpDown {
        background: url('@{font-path}/reports/updown.png');
        background-repeat: no-repeat;
        background-origin: padding-box;
        background-position: center;
        background-color: transparent;
        background-size: 10px;
    }

    .e-reportviewer-sortingUp {
        background: url('@{font-path}/reports/up.png');
        background-repeat: no-repeat;
        background-origin: padding-box;
        background-position: center;
        background-color: transparent;
        background-size: 10px;
    }

    .e-reportviewer-sortingDown {
        background: url('@{font-path}/reports/down.png');
        background-repeat: no-repeat;
        background-origin: padding-box;
        background-position: center;
        background-color: transparent;
        background-size: 10px;
    }

    .e-reportviewer-close {
        font-weight: bold;
        float: right;
        padding: 2px;
        margin-right: 15px;
        cursor: pointer;
    }

    .e-reportviewer-expandtoggle:hover, .e-reportviewer-collapsetoggle:hover, .e-reportviewer-drillhover:hover, .e-reportviewer-sortingUp:hover, .e-reportviewer-sortingDown:hover, .e-reportviewer-sortingUpDown:hover, .e-reportviewer-drillhover:hover {
        cursor: pointer;
    }

    .e-reportviewer-pagefit:before {
        content: "\e660";
    }

    .e-reportviewer-pagefittopage:before {
        content: "\e657";
    }

    .e-reportviewer-emptyconetent:before {
        content: "\00a0 \00a0";
    }

    .e-reportviewer-print:before {
        content: "\e71f";
    }

    .e-reportviewer-export:before {
        content: "\e720";
    }

    .e-reportviewer-pagesetup:before {
        content: "\e6d1";
    }

    .e-reportviewer-gotonext:before {
        content: "\e723";
    }

    .e-reportviewer-gotonext.e-reportviewer-disabled:before {
        content: "\e723";
    }

    .e-reportviewer-gotoprevious:before {
        content: "\e722";
    }

    .e-reportviewer-gotoprevious.e-reportviewer-disabled {
        content: "\e722";
    }

    .e-reportviewer-gotofirst:before {
        content: "\e721";
    }

    .e-reportviewer-gotolast:before {
        content: "\e724";
    }

    .e-reportviewer-gotolast.e-reportviewer-disabled {
        content: "\e724";
    }

    .e-reportviewer-gotofirst.e-reportviewer-disabled {
        content: "\e721";
    }

    .e-reportviewer-zoomin:before {
        content: "\e725";
    }

    .e-reportviewer-zoomout:before {
        content: "\e726";
    }

    .e-reportviewer-refresh:before {
        content: "\e727";
    }

    .e-reportviewer-parameter:before {
        content: "\e728";
    }

    .e-reportviewer-documentmap:before {
        content: "\e719";
    }

    .e-reportviewer-gotoparent:before {
        content: "\e71e";
    }

    .e-reportviewer-preview:before {
        content: "\e72a";
    }

    .e-reportviewer-close:before {
        content: "\e74e";
    }

    div[id*='toolbar_zoomSelection_popup'] {
        max-height: none !important;
    }

    div[id*='toolbar_zoomSelection_popup'] > div > ul {
        text-align: center !important;
    }

    .e-reportviewer-popupli {
        border: 0 none;
        float: none;
        position: relative;
        line-height: normal;
        cursor: pointer;
        list-style-type: none;
        text-align: left;
        padding-top: 3px;
        padding-bottom: 3px;
        padding-left: 4px;
    }

    .e-reportviewer-lispan {
        text-decoration: none;
        white-space: nowrap;
        padding: 2px !important;
        vertical-align: text-bottom;
    }
}

.mixin(@widget) when (@widget = pdfviewer), (@widget = none) {
    .e-pdfviewer-icon {
        font-family: 'ej-webfont';
        speak: none;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        text-align: center;
        vertical-align: middle;
        line-height: normal !important;
        font-size: 17px;
        display: inline-block;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        cursor: default;
    }

    .e-pdfviewer-toolbarcontainer {
        height: inherit;
        width: 100%;
        vertical-align: middle;
        border-width: 1px;
        border-style: solid;
        border-bottom: none;
        -webkit-user-select: none;
        -ms-user-select: none;
        -moz-user-select: none;
    }

    .e-pdfviewer-toolbarul {
        height: inherit;
        margin: 5px !important;
        position: relative;
        left: 1px;
        top: 1px;
    }

    .e-pdfviewer-toolbarli {
        margin: 2px 0px;
        width: 20px;
        height: 20px;
        padding: 4px !important;
    }

    .e-pdfviewer-tbdiv {
        width: 16px;
        height: 16px;
        border: 1px solid;
        border-color: transparent;
        margin: 4px 0px;
    }

    .e-pdfviewer-outerborder {
        background-color: transparent;
        border: 1px solid;
        border-color: transparent;
        width: 28px;
        height: 90%;
        margin: 1px;
        float: left;
    }

    .e-pdfviewer-outerborder:hover {
        border: 1px solid;
    }

    .e-pdfviewer-tbdiv.e-pdfviewer-fittopagetip {
        width: auto;
        height: auto;
        min-height: 30.5px;
        min-width: 55px;
        position: absolute;
        padding: 1px;
        word-wrap: break-word;
        border: 1px solid;
        margin: 10px auto;
        z-index: 9999;
    }

    .e-pdfviewer-tbdiv.e-pdfviewer-tooltip {
        width: auto;
        height: auto;
        min-height: 30.5px;
        min-width: 35px;
        position: absolute;
        padding: 1px;
        max-width: 250px;
        word-wrap: break-word;
        border: 1px solid;
        margin: 10px auto;
        z-index: 9999;
    }

    .e-pdfviewer-headerspan {
        font-style: normal;
        font-weight: bold;
        padding: 1px;
        margin: 1.5px;
        word-wrap: break-word;
    }

    .e-pdfviewer-contentspan {
        padding: 1px;
        margin-left: 15px;
        margin-bottom: 5px;
        margin: 0px 5px 5px 15px;
        word-wrap: break-word;
    }

    .e-pdfviewer-ejdropdownlist {
        width: auto;
        height: 90%;
        margin: 4.7px 2px 2px 2px;
        float: left;
        border: 1px solid transparent;
    }

    .e-pdfviewer-responsivesecondarytoolbar {
        width: 215px;
        left: 244px;
        top: 54px;
        z-index: 10235;
    }

    .e-pdfviewer-toolbarcontainer input.e-input, .e-pdfviewer-viewerblockcontent input.e-input {
        line-height: normal !important;
    }

    .e-pdfviewer-print, .e-pdfviewer-emptyconetent, .e-pdfviewer-fitpage, .e-pdfviewer-fitwidth, .e-pdfviewer-gotonext, .e-pdfviewer-gotonext.e-pdfviewer-disabled, .e-pdfviewer-gotoprevious, .e-pdfviewer-gotoprevious.e-pdfviewer-disabled, .e-pdfviewer-gotofirst, .e-pdfviewer-gotofirst.e-pdfviewer-disabled, .e-pdfviewer-gotolast, .e-pdfviewer-gotolast.e-pdfviewer-disabled, .e-pdfviewer-zoomin, .e-pdfviewer-zoomout, {
        width: 20px;
        height: 20px;
        margin-top: 1px;
    }

    .e-pdfviewer-tbpage {
        background-color: transparent;
        float: left;
        text-align: center;
        margin-top: 4.6px;
        width: auto;
        height: 25px;
    }

    .e-pdfviewer-pagenumber {
        min-height: 22px !important;
        min-width: 25px !important;
        height: 22px !important;
        width: 28px !important;
        text-align: center;
        margin-top: 3.7px;
        display: inline-block !important;
    }

    .e-pdfviewer-tbdiv.e-pdfviewer-zoomlist {
        border: 1px solid;
        margin: 4px 7px;
        width: 60px;
        height: 19px;
    }

    .e-pdfviewer-viewer {
        width: 100%;
        text-shadow: none !important;
        min-width:320px !important;
       -webkit-user-select:text;
    }

    .e-pdfviewer-viewerblock {
        width: 100%;
        border-top: 1px solid;
        border-bottom: 0px solid;
        border-left: 1px solid;
        border-right: 1px solid;
        overflow: auto;
        font-size: 11pt;
        color: #5B5B5B;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    .e-pdfviewer-blockstyle {
        position: absolute;
        top: 0;
        left: 0;
        width: 99.5%;
        height: 100%;
        z-index: 10;
    }

    .e-pdfviewer-viewerblockcontent {
        width: 100%;
    }

    .e-pdfviewer-viewerblockcellcontent {
        border: 0;
        vertical-align: middle;
        -webkit-user-select: none;
        -ms-user-select: none;
        -moz-user-select: none;
    }

    .e-pdfviewer-scrollcontainer {
        line-height: normal !important;
        position: relative;
        height: 100%;
        width: 100%;
        overflow: auto;
        text-align: left;
    }

    .e-pdfviewer-pageviewcontainer {
        width: auto;
        height: auto;
        border: 1px none;
        margin: 0px auto;
    }

    .e-pdfviewer-pageouterline {
        background-color: transparent;
        position: relative;
        border: 1px solid;
        border-color: transparent;
        margin: 0px auto;
        padding: 10px;
    }

    .e-pdfviewer-pageview {
        position: absolute;
        -moz-box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.22);
        -webkit-box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.22);
        box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.22);
    }

    .e-pdfviewer-elementalignments {
        border-width: 1px;
        border-style: solid;
        margin: 0;
        padding: 1px !important;
    }

    .e-pdfviewer-viewercontainer {
        border-width: 1px;
        border-style: solid;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    .e-pdfviewer-textbox {
        height: 23px;
        line-height: normal;
        text-indent: 10px;
        border: 1px solid;
        vertical-align: middle;
        padding: 0px;
    }

    .e-pdfviewer-label, .e-pdfviewer-labelpageno {
        border: none;
    }

    .e-pdfviewer-pagepopupinfo {
        height: 30px;
        width: auto;
        /*height: auto;*/
        min-width: 65px;
        position: absolute;
        padding: 1px;
        -ms-word-wrap: break-word;
        word-wrap: break-word;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        border-radius: 5px;
        border: 1px solid;
        margin: 10px auto;
        z-index: 9999;
        opacity: .5;
    }

    .e-pdfviewer-popuppageno {
        min-width: 20px;
        height: 15px;
        display: table-cell;
    }

    .e-pdfviewer-toolbarul-search{
        margin-left:4px;
        position:relative;
        left:1px;
        top:1px;
     }
     .e-pdfviewer-match-checkbox{
        float: left
     }
     .e-pdfviewer-toolbarli-search{
        width:20px;
        height:20px;
        padding:4px !important;
     }
     .e-pdfviewer-label{
        user-select:none;
        -moz-user-select:none;
        -webkit-user-select:none;
     }

    .e-pdfviewer-searchbox {
        z-index: 10;
        display: none;
        overflow: visible;
    }

    .e-pdfviewer-waitingpopup-print {
        opacity: 1;
    }

    .e-waitpopup-pane.e-pdfviewer-waitingpopup-print .e-text {
        color: white;
    }
    
    .e-pdfviewer-texthighlight {
        background-color:#000D3D;
        opacity:1;
        margin:-1px;
        padding:1px;
    }

    .e-pdfviewer-text-highlightother {
        background-color:#000D3D;
        opacity:0.4;
        margin:-1px;
        padding:1px;
    }

    .e-pdfviewer-nooccurrence {
        background-color:#FC7A7A !important;
    }

    .e-pdfviewer-arrow::before, .e-pdfviewer-arrow::after{
        font-family: 'ej-webfont';
        position:absolute;
        border:solid transparent;
        bottom:70%;
    }

    .e-pdfviewer-progressloader{
        background-image:url("common-images/pdfviewer/preloader-pdfviewer.gif");
        background-repeat:no-repeat;
        background-position:right;
    }

    .e-pdfviewer-arrow::before{
        content:"\e832";
    }

    .e-pdfviewer-arrow::after{
        content:"\e831";
    }

    .e-pdfviewer-popuptotalpage {
        /*display: table-cell;*/
        /*vertical-align: middle;*/
    }

    .e-pdfviewer-fitwidth:before {
        content: "\e82a";
    }

    .e-pdfviewer-disabled-fitWidthButton:before {
        content: "\e7d8";
    }

    .e-pdfviewer-fitpage:before {
        content: "\e82b";
    }

    .e-pdfviewer-disabled-fitPageButton:before {
        content: "\e7d7";
    }

    .e-pdfviewer-pagefittopage:before {
        content: "\e657";
    }

    .e-pdfviewer-emptyconetent:before {
        content: "\00a0 \00a0";
    }

    .e-pdfviewer-print:before {
        content: "\e82c";
    }

    .e-pdfviewer-gotonext:before {
        content: "\e827";
    }

    .e-pdfviewer-gotonext.e-pdfviewer-disabled:before {
        content: "\e7d3";
    }

    .e-pdfviewer-gotoprevious:before {
        content: "\e826";
    }

    .e-pdfviewer-gotoprevious.e-pdfviewer-disabled {
        content: "\e7d2";
    }

    .e-pdfviewer-gotofirst:before {
        content: "\e7d1";
    }

    .e-pdfviewer-gotolast:before {
        content: "\e7d4";
    }

    .e-pdfviewer-gotolast.e-pdfviewer-disabled {
        content: "\e7d4";
    }

    .e-pdfviewer-gotofirst.e-pdfviewer-disabled {
        content: "\e7d1";
    }

    .e-pdfviewer-zoomin:before {
        content: "\e829";
    }

	.e-pdfviewer-download:before {
        content: "\e82d";
    }
    .e-pdfviewer-zoomout:before {
        content: "\e828";
    }

    .e-pdfviewer-find:before {
        content:"\e82e";
    }

    .e-pdfviewer-prevfind:before{
        content:"\e82f";
    }

    .e-pdfviewer-nextfind:before {
        content:"\e830";
    }

    .e-pdfviewer-closefind:before {
        content:"\e837";
    }

    div[id*='toolbar_zoomSelection_popup'] {
        max-height: none !important;
    }

    div[id*='toolbar_zoomSelection_popup'] > div > ul {
        text-align: center !important;
    }

    .e-pdfviewer-popupli {
        border: 0 none;
        float: none;
        position: relative;
        line-height: normal;
        cursor: pointer;
        list-style-type: none;
        text-align: left;
        padding-top: 3px;
        padding-bottom: 3px;
        padding-left: 4px;
    }

    .e-pdfviewer-lispan {
        text-decoration: none;
        white-space: nowrap;
        padding: 2px !important;
        vertical-align: text-bottom;
    }
    .e-pdfviewer-custom-menu {
    z-index: 1000;
    position: absolute;
    border: solid 2px #000;
    background-color: #fff;
    min-width: 350px !important;
    padding: 5px 0;
    display: none;
}

    .e-pdfviewer-custom-menu ol {
        padding: 0;
        margin: 0;
        list-style-type: none;
        min-width: 350px !important;
        width: auto;
        max-width: 200px;
        font-family: Verdana;
        font-size: 12px;
    }

        .e-pdfviewer-custom-menu ol li {
            margin: 0;
            display: block;
            list-style: none;
            padding: 5px 5px;
        }

            .e-pdfviewer-custom-menu ol li:hover {
                background-color: #efefef;
            }

            .e-pdfviewer-custom-menu ol li:active {
                color: #fff;
            }

            .e-pdfviewer-custom-menu ol li a {
                color: #000;
                text-decoration: none;
                display: block;
                padding: 0 5px;
            }

                .e-pdfviewer-custom-menu ol li a:active {
                    color: #fff;
                background-color: #000;
                }

*.e-pdfviewer-pageCanvas {
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -o-user-select: none;
    user-select: none;
}

    *.e-pdfviewer-pageCanvas * {
        -moz-user-select: text;
        -khtml-user-select: text;
        -webkit-user-select: text;
        -o-user-select: text;
        user-select: text;
    }

.e-pdfviewer-textLayer::selection {
    background: #00f;
}

.e-pdfviewer-textLayer::-moz-selection {
    background: #00f;
}

.e-pdfviewer-droplet1 {
    background-color: blue;
    position: absolute;
    z-index: 1000;
    display: inline-block;
    transform: rotate(-30deg);
    width: 21px;
    height: 25px;
    border-top-left-radius: 50%;
    border-bottom-left-radius: 50%;
    border-bottom-right-radius: 50%;
    display: none;
}

.e-pdfviewer-droplet2 {
    background-color: blue;
    z-index: 1000;
    position: absolute;
    display: inline-block;
    transform: rotate(-30deg);
    width: 21px;
    height: 25px;
    border-top-left-radius: 50%;
    border-bottom-left-radius: 50%;
    border-bottom-right-radius: 50%;
    display: none;
}

.e-pdfviewer-touchCopy {
    z-index: 1000;
    position: absolute;
    background-color: white;
    padding: 5px 0;
    float: left;
    text-align: center;
    width: 65px !important;
}

.e-pdfviewer-touchDot {
    z-index: 1000;
    position: absolute;
    margin-left: 64px !important;
    background-color: white;
    padding: 5px 0;
    float: right;
    text-align: center;
    width: 65px !important;
}

.e-pdfviewer-touchcustom-menu {
    z-index: 1000;
    position: absolute;
    box-sizing: border-box;
    box-shadow: 0px 3px 3px 0 rgba(0, 0, 0, 0.4);
    width: 130px !important;
    padding: 5px 0;
    display: none;
    height: 35px;
    background: white;
}

    .e-pdfviewer-touchcustom-menu::after {
        content: "";
        z-index: 1000;
        position: absolute;
        width: 0;
        height: 0;
        margin-left: -9px;
        bottom: -8px;
        left: 50%;
        box-sizing: border-box;
        border: 5px solid black;
        border-color: white white;
        transform-origin: 0 0;
        transform: rotate(-45deg);
        box-shadow: -3px 3px 3px 0 rgba(0, 0, 0, 0.4);
    }

    .e-pdfviewer-touchcustom-menu div a {
        color: Black;
        text-decoration: none;
        display: block;
        padding: 0px 5px;
    }

        .e-pdfviewer-touchcustom-menu div a:active {
            color: White;
        }

.e-pdfviewer-pageCanvas {
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0) !important;
}
    .e-dropdownlist.e-input.e-pdfviewer-ddl, .e-ddl-popup.e-pdfviewer-ddl .e-ul li {
        text-align: center;
        padding-left: 0px;
    }
}

.mixin(@widget) when (@widget = excelfilter), (@widget = none) {
    /*Excel Filter Core*/
    .e-excelfilter.e-dlgcontainer {
        min-width: 266px;
        padding: 0px;
        width: 266px;
        padding: 4px 0px 16px 0px;
    }

    .e-excelfilter.e-dlgcontainer,
    .e-excelfilter .e-searchcontainer,
    .e-excelfilter .e-searchcontainer input {
        box-sizing: content-box;
    }

    .e-sortasc:before {
        content: "\e714";
    }

    .e-sortdesc:before {
        content: "\e713";
    }

    .e-exceltick:before {
        content: "\e77a";
    }

    .e-excelfilter .e-menu.e-vertical .e-list > a {
        margin: 0px 10px 0px 15px;
    }

    .e-excelfilter .e-menu.e-vertical .e-list > ul .e-list > a {
        padding-left: 15px;
    }

    .e-excelfilter .e-menu.e-vertical li.e-separator,
    .e-excelfilter .e-list > ul li.e-separator {
        margin: 4px 0px 4px 0px;
    }

    .e-excelfilter .e-menu.e-vertical {
        border: none;
    }

    .e-excelfilter .e-menu  .e-menulink .e-chkbox-wrap {
       top: 0 ;
       opacity: 1;
    }

    .e-excelfilter .e-menu.e-vertical .e-exceltick::before {
        margin-left: -7px;
    }

    .e-excelfilter .e-menu.e-vertical .e-exceltick:before {
        margin-left: ~"-7px\9";
    }

    .e-excelfilter .e-searchcontainer {
        position: relative;
        margin-left: 15px;
        margin-top: 4px;
    }

    .e-excelfilter .e-searchcontainer .e-fields {
        margin: 7px 0px;
    }

    .e-excelfilter .e-checkboxlist {
        width: 234px;
        height: 130px;
        outline: none;
    }

    .e-excelfilter .e-searchbox .e-icon:before {
        display: inline-block;
    }


    .e-excelfilter .e-searchbox .e-ejinputtext {
        width: 228px;
        height: 23px;
    }

    .e-excelfilter .e-searchinput::-ms-check {
        display: none;
    }

    .e-excelfilter .e-btncontainer.e-fields {
        width: 170px;
        margin: 16px 0px 0px 68px;
    }

    .e-excelfilter .e-btncontainer input,
    .e-excelfilter .e-checkboxlist .e-ftrchk {
        margin-left: 10px;
        margin-top: 2px;
    }

    .e-excelfilter .e-checkboxlist .e-ftrchk {
        white-space: nowrap;
    }

    .e-excelfilter .e-checkboxlist {
        padding-top: 3px;
    }

    .e-excelfilter .e-btncontainer > div {
        margin-bottom: 5px;
    }

    .e-excelfilter .e-checkboxlist label.e-ftrchk,
    .e-excelfilter .e-searchbox .e-searchitem {
        cursor: pointer;
        line-height: 11px;
    }

    .e-excelfilter.e-dlgcustom {
        width: 341px;
        padding: 10px 14px 0;
        box-sizing: content-box;
    }

    .e-excelfilter.e-dlgcustom .e-dlgfields {
        padding-bottom: 14px;
        box-sizing: content-box;
    }

    .e-excelfilter.e-dlgcustom fieldset.e-fieldset {
        padding: 14px 8px 13px;
        width: auto;
        margin: 0px 2px;
    }

    .e-excelfilter.e-dlgcustom .e-fieldset legend {
        width: auto;
        margin-left: 3px;
        margin-bottom: 2px;
        padding: 0 3px;
    }

    .e-excelfilter.e-dlgcustom .e-optable {
        border-collapse: separate;
        border-spacing: 1px;
    }

    .e-excelfilter.e-dlgcustom .e-optable td {
        width: 27px;
        padding: 0px 5px;
    }

    .e-excelfilter.e-dlgcustom .e-optable .e-predicate td {
        padding-top: 11px;
        padding-bottom: 11px;
    }

    .e-excelfilter.e-dlgcustom .e-optable .e-predicate td:last-child {
        padding-top: 8px;
    }

    .e-excelfilter.e-dlgcustom .e-dlgfields .e-btncontainer {
        width: 100%;
        margin-left: 35%;
        margin-top: -5px;
    }

    .e-excelfilter.e-dlgcustom .e-dlgfields .e-predicate .e-caption {
        margin-left: 5px;
        padding-right: 13px;
    }

    .e-excelfilter .e-hide {
        display: none !important;
    }

    .e-excelfilter .e-searchbox span {
        cursor: pointer;
        display: block;
        height: 16px;
        position: absolute;
        right: 6%;
        top: 6px;
        width: 21px;
    }

    .e-excelfilter.e-dlgcustom .e-widget [class^="e-"],
    .e-excelfilter.e-dlgcustom.e-dialog,
    .e-excelfilter.e-dlgcustom.e-dialog [class^="e-"] {
        box-sizing: content-box;
    }

    .e-excelfilter .e-ftrchk * {
        box-sizing: content-box !important;
    }

    .e-excelfilter.e-dlgcustom .e-ddl.e-widget [class^="e-"],
    .e-excelfilter.e-dlgcustom .e-atc.e-widget [class^="e-"],
    .e-excelfilter.e-dlgcustom .e-datewidget.e-widget [class^="e-"],
    .e-excelfilter.e-dlgcustom .e-numeric.e-widget [class^="e-"],
    .e-excelfilter.e-dlgcustom .e-ejinputtext {
        box-sizing: border-box;
    }

    .e-excelfilter .e-menu .e-list .e-bghdrcolor {
        padding: 0px;
        height: 26px;
    }

    .e-excelfilter .e-menu .e-list .e-fghdrcolor {
        padding-bottom: 4px;
        height: 26px;
    }

    .e-excelfilter .e-menu.e-vertical .e-list ul li.e-bghdrcolor > a, .e-excelfilter .e-menu.e-vertical .e-list ul li.e-fghdrcolor > a {
        padding: 0px;
    }
	
	.e-bghdrcolor > a, .e-fghdrcolor > a {
		font-size : 13px;
	}
	
    .e-excelfilter .e-menu .e-list .e-valcolor {
        margin: 0 auto;
        height: 16px;
        width: 70px;
        border-style: solid;
        border-width: 2px;
        padding: 2px;
    }

    .e-excustmfltr.e-ejinputtext {
        text-indent: 0px;
    }
}

.mixin(@widget) when (@widget = navigationdrawer), (@widget = none) {

    .e-nb.e-nb-home {
        width: 100%;
    }
    
    .e-nb.e-nb-container {
        direction: ltr;
     }

    .e-nb.e-nb-layout {
        margin-right: 6px;
        vertical-align: top;
        position: absolute;
        top: 0px;
        z-index: 1000;
    }
   .e-nb-fixed,.e-nb-normal {
        overflow: visible !important;
    }

   .e-nb-fixed:not(.e-nb-type-overlay) {
        width: 100%;
    }
    .e-nb-fixed-slide {
        position: absolute;
        width: 100%;
        height: 100%;
    }

    .e-nb.e-nb-animate {
        -moz-transition: transform 250ms ease 0s;
        -o-transition: transform 250ms ease 0s;
        -webkit-transition: transform 250ms ease 0s;
        transition: transform 250ms ease 0s;
        -moz-backface-visibility: hidden;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
    }

    .e-nb.e-user-select {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        -o-user-select: none;
        user-select: none;
    }

    .e-nb.e-nb-overlay {
        z-index: 999;
        width: 100%;
        height: 100%;
    }

    .e-nb.e-list-hdr.e-clearall {
        margin: 0;
        padding: 0;
    }

    .e-nb.e-nb-container {
        height: 100%;
        position: absolute;
        overflow: hidden;
        top: 0px;
    }

    .e-nb.e-nb-container .e-nb.e-nb-layout {
        position: relative;
    }

    .e-nb.e-nb-container.e-nb-right {
        float: right;
        right: 0;
    }
}

.mixin(@widget) when (@widget = radialmenu), (@widget = none) {
    /*------------------------------ Radial Menu Start ---------------------------------------*/
    .e-radialmenu .e-radial {
        border: 2px solid;
        height: 40px;
        border-radius: 50%;
        width: 40px;
        background-position: center;
        background-repeat: no-repeat;
        background-size: 60%;
        z-index: 1;
    }

    .e-radialmenu .e-radialslider {
        border-radius: 50%;
        top: 29px;
        left: 29px;
    }

    .e-radialmenu .e-radialimage {
        background-image: url('@{font-path}/radialmenu/radial.png');
    }

    .e-radialmenu .e-backimage {
        background-image: url('@{font-path}/radialmenu/back.png');
    }


    .e-radialmenu.e-overlow {
        overflow: hidden;
    }

    .e-radialmenu .e-itemdisabled {
        opacity: 0.4;
        pointer-events: none;
    }

    .e-radialmenu .e-pathdisabled {
        pointer-events: none;
    }

    .e-radialmenu.e-user-select {
        -webkit-user-select: none; /* Chrome all / Safari all */
        -moz-user-select: none; /* Firefox all */
        -ms-user-select: none; /* IE 10+ */ /* No support for these yet, use at own risk */
        -o-user-select: none;
        user-select: none;
        z-index: 100001;
    }

    .e-tile .e-user-select {
        -webkit-user-select: none; /* Chrome all / Safari all */
        -moz-user-select: none; /* Firefox all */
        -ms-user-select: none; /* IE 10+ */ /* No support for these yet, use at own risk */
        -o-user-select: none;
        user-select: none;
    }

    .e-radialmenu.e-abs, .e-radialmenu .e-abs {
        position: absolute;
    }

    .e-radialmenu .e-rel {
        position: relative;
    }

    .e-radialmenu.e-displaynone, .e-radialmenu .e-displaynone {
        display: none;
    }

    .e-radialmenu .e-textcolor {
        text-anchor: middle;
        font-size: 12px;
        font-family: 'Segoe UI';
    }

    .e-radialmenu .e-badgetext {
        text-anchor: middle;
        font-size: 10px;
        font-family: 'Segoe UI';
    }

    .e-radialmenu .e-radialshow {
        -moz-animation: radialshow 300ms;
        -webkit-animation: radialshow 300ms;
        -o-animation: radialshow 300ms;
        -ms-animation: radialshow 300ms;
        animation: radialshow 300ms;
    }

    @-moz-keyframes radialshow {
        from {
            -moz-transform: rotate(-70deg) scale(0.7);
        }

        to {
            -moz-transform: rotate(0deg) scale(1);
        }
    }

    @-webkit-keyframes radialshow {
        from {
            -webkit-transform: rotate(-70deg) scale(0.7);
        }

        to {
            -webkit-transform: rotate(0deg) scale(1);
        }
    }

    @-o-keyframes radialshow {
        from {
            -o-transform: rotate(-70deg) scale(0.7);
        }

        to {
            -o-transform: rotate(0deg) scale(1);
        }
    }

    @-ms-keyframes radialshow {
        from {
            -ms-transform: rotate(-70deg) scale(0.7);
        }

        to {
            -ms-transform: rotate(0deg) scale(1);
        }
    }

    @keyframes radialshow {
        from {
            transform: rotate(-70deg) scale(0.7);
        }

        to {
            transform: rotate(0deg) scale(1);
        }
    }

    .e-radialmenu .e-radialhide {
        -moz-animation: radialhide 300ms;
        -webkit-animation: radialhide 300ms;
        -o-animation: radialhide 300ms;
        -ms-animation: radialhide 300ms;
        animation: radialhide 300ms;
    }

    @-moz-keyframes radialhide {
        from {
            -moz-transform: rotate(0deg) scale(1);
        }

        to {
            -moz-transform: rotate(-70deg) scale(0.7);
        }
    }

    @-webkit-keyframes radialhide {
        from {
            -webkit-transform: rotate(0deg) scale(1);
        }

        to {
            -webkit-transform: rotate(-70deg) scale(0.7);
        }
    }

    @-o-keyframes radialhide {
        from {
            -o-transform: rotate(0deg) scale(1);
        }

        to {
            -o-transform: rotate(-70deg) scale(0.7);
        }
    }

    @-ms-keyframes radialhide {
        from {
            -ms-transform: rotate(0deg) scale(1);
        }

        to {
            -ms-transform: rotate(-70deg) scale(0.7);
        }
    }

    @keyframes radialhide {
        from {
            transform: rotate(0deg) scale(1);
        }

        to {
            transform: rotate(-70deg) scale(0.7);
        }
    }

    .e-radialmenu .e-scalehide {
        -moz-animation: scalehide 300ms;
        -webkit-animation: scalehide 300ms;
        -o-animation: scalehide 300ms;
        -ms-animation: scalehide 300ms;
        animation: scalehide 300ms;
    }

    @-moz-keyframes scalehide {
        from {
            -moz-transform: scale(1);
        }

        to {
            -moz-transform: scale(0.4);
        }
    }

    @-webkit-keyframes scalehide {
        from {
            -webkit-transform: scale(1);
        }

        to {
            -webkit-transform: scale(0.4);
        }
    }

    @-o-keyframes scalehide {
        from {
            -o-transform: scale(1);
        }

        to {
            -o-transform: scale(0.4);
        }
    }

    @-ms-keyframes scalehide {
        from {
            -ms-transform: scale(1);
        }

        to {
            -ms-transform: scale(0.4);
        }
    }

    @keyframes scalehide {
        from {
            transform: scale(1);
        }

        to {
            transform: scale(0.4);
        }
    }

    .e-radialmenu .e-scaleshow {
        -moz-animation: scaleshow 300ms;
        -webkit-animation: scaleshow 300ms;
        -o-animation: scaleshow 300ms;
        -ms-animation: scaleshow 300ms;
        animation: scaleshow 300ms;
    }

    @-moz-keyframes scaleshow {
        from {
            -moz-transform: scale(0.4);
        }

        to {
            -moz-transform: scale(1);
        }
    }

    @-webkit-keyframes scaleshow {
        from {
            -webkit-transform: scale(0.4);
        }

        to {
            -webkit-transform: scale(1);
        }
    }

    @-o-keyframes scaleshow {
        from {
            -o-transform: scale(0.4);
        }

        to {
            -o-transform: scale(1);
        }
    }

    @-ms-keyframes scaleshow {
        from {
            -ms-transform: scale(0.4);
        }

        to {
            -ms-transform: scale(1);
        }
    }

    @keyframes scaleshow {
        from {
            transform: scale(0.4);
        }

        to {
            transform: scale(1);
        }
    }
    /*------------------------------ Radial Menu End ---------------------------------------*/
}

.mixin(@widget) when (@widget = signature), (@widget = none) {
    /*------------------------------ Signature Start ---------------------------------------*/
    .e-signature {
        position: relative;
        height: 100%;
        width: 100%;
        border: 3px solid #000000;
    }

    .e-signature canvas {
        position: absolute;
        cursor: pointer;
        height: 100%;
        width: 100%;
    }

    .e-signature.e-disable {
        opacity: .35;
        filter: alpha(opacity=35);
        background-image: none;
        pointer-events: none;
    }
    /*------------------------------ Signature End ---------------------------------------*/
}

.mixin(@widget) when (@widget = listview), (@widget = none) {
    /*
==============================================
slideLeft animate
==============================================
*/
    .e-slideleft {
        animation-name: slideLeft;
        -webkit-animation-name: slideLeft;
        animation-duration: 0.23s;
        -webkit-animation-duration: 0.23s;
        animation-timing-function: ease;
        -webkit-animation-timing-function: ease;
        visibility: visible !important;
    }

    @keyframes slideLeft {
        0% {
            transform: translateX(100%);
        }

        100% {
            transform: translateX(0%);
        }
    }

    @-webkit-keyframes slideLeft {
        0% {
            -webkit-transform: translateX(100%);
        }

        100% {
            -webkit-transform: translateX(0%);
        }
    }
    /*
==============================================
slideRight Animate
==============================================
*/
    .e-slideright {
        animation-name: slideRight;
        -webkit-animation-name: slideRight;
        animation-duration: .23s;
        -webkit-animation-duration: .23s;
        animation-timing-function: ease;
        -webkit-animation-timing-function: ease;
        visibility: visible !important;
    }

    @keyframes slideRight {
        0% {
            transform: translateX(-100%);
        }

        100% {
            transform: translateX(0%);
        }
    }

    @-webkit-keyframes slideRight {
        0% {
            -webkit-transform: translateX(-100%);
        }

        100% {
            -webkit-transform: translateX(0%);
        }
    }

    .e-lv .e-grouptitle {
        font-size: 15px;
        height: 34px;
        line-height: 34px;
        padding-left: 6px;
    }

    .e-lv .e-header {
        cursor: pointer;
        height: 45px;
        padding-left: 5px;
        box-shadow: @box-shadow;
    }

    .e-htitle, .e-btn-text {
        font-weight: bold;
        padding: 10px 10px 10px 0px;
        vertical-align: middle;
    }

    .e-lv .e-clearall {
        margin: 0;
        padding: 0;
    }

    .e-lv .e-childcontainer, .e-lv .e-list-container, .e-lv .e-childitem {
        position: relative;
    }

    .e-lv .e-list .e-chevron-right_01 {
        text-decoration: none;
    }

    .e-lv .e-htitle, .e-lv .e-btn-text {
        font-size: @font-size;
        height: 25px;
    }

    .e-lv-inputdiv .e-lv-input {
        font-style: italic;
        line-height: 1.4;
        margin: 0;
        outline: 0 none;
        padding: 8px 0;
        text-indent: 5px;
        width: 100%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    .e-lv .e-list .e-chevron-right_01 {
        display: inline-block;
        outline: 0 none;
        padding-bottom: 12px;
        padding-top: 12px;
        vertical-align: middle;
        width: 100%;
    }

    .e-lv .e-list-hdr {
        list-style: none outside none;
        padding: 0px;
    }

    .e-lv .e-list .e-lv-checkdiv {
        float: right;
    }

    .e-lv .e-list {
        line-height: normal;
        padding: 0px 15px;
        cursor: pointer;
        vertical-align: middle;
    }

    .e-lv .e-header * {
        display: table-cell;
        vertical-align: middle;
    }

    .e-lv.e-js.e-parentlv {
        overflow: hidden;
    }

    .e-lv .e-list .e-list-img {
        background-size: cover;
        float: left;
        height: 30px;
        width: 30px;
    }

    .e-lv .e-arrow .e-chevron-right_01:before {
        float: right;
        font-size: 14px;
        position: relative;
        right: 0;
    }

    .e-lv .e-list.e-margin .e-chevron-right_01 span {
        left: 10px;
        position: relative;
        top: 6px;
    }

    .e-lv .e-list .e-chevron-right_01 [class*="icon-"] {
        width: 35px;
        height: 35px;
        float: left;
    }

    .e-lv :not(.e-arrow) > .e-icon.e-chevron-right_01:before {
        display: none;
    }
}

.mixin(@widget) when (@widget = colorpicker), (@widget = none) {

    .e-colorpicker .e-buttons .e-color-code.e-error {
        border-color: #FF0000;
    }

    .e-colorwidget .e-in-wrap {
        border-radius: 4px;
        border: 1px solid #dbdbde;
        cursor: default;
        display: inline-block;
        height: 100%;
        width: 100%;
    }

    .e-colorwidget .e-in-wrap.e-tool {
        border-radius: 4px;
        border: 1px solid #dbdbde;
        cursor: default;
        height: 100%;
        width: 100%;
        background: #ecedee;
    }

    .e-in-wrap .e-tool-icon {
        position: absolute;
        padding: 3px 3px 2px;
        background-repeat: no-repeat;
        width: 16px;
        height: 16px;
    }

    .e-colorwidget.e-widget {
        background-clip: border-box;
        box-sizing: content-box;
        border-radius: 4px;
        display: block;
        height: 28px;
        outline: 0 none;
        position: relative;
        width: 35px;
    }

    .e-colorwidget .e-in-wrap .e-input {
        color: transparent;
    }

    .e-colorwidget .e-selected-color {
        border-radius: 3px;
        height: 17px;
        width: 17px;
        position: absolute;
        left: 4px;
        top: 4px;
    }

    .e-colorwidget .e-color-container {
        height: 100%;
        width: 70%;
        display: inline-block;
        position: relative;
        cursor: pointer;
    }

    .e-colorwidget .e-color-container .e-tool-icon + .e-selected-color {
        height: 3px;
        top: 18px;
    }

    .e-colorwidget .e-icon {
        font-size: 10px;
        height: 12px;
        margin-top: -6px;
        display: block;
        width: 42%;
        position: absolute;
        top: 50%;
    }

    .e-colorwidget .e-select {
        cursor: pointer;
        display: inline-block;
        height: 100%;
        text-align: left;
        width: 30%;
    }

    .e-in-wrap .e-select .e-icon {
        cursor: pointer;
    }

    .e-colorpicker.e-popup {
        outline: 0 none;
        border-style: solid;
        border-width: 1px;
        height: auto;
        overflow: hidden;
        padding: 11px;
        width: 223px;
        box-shadow: @box-shadow;
    }

    .e-colorpicker .e-palette-color {
        position: relative;
    }

    .e-colorpicker .e-hsv-color {
        display: inline-block;
        position: relative;
        overflow: hidden;
        border: 3px solid;
        width: 75%;
    }

    .e-hsv-color .e-hsv-gradient {
        height: 146px;
        width: 100%;
    }

    .e-colorpicker .e-hsv-gradient {
        background: -moz-linear-gradient(top,rgba(0,0,0,0) 0,#000 100%),-moz-linear-gradient(left,#fff 0,rgba(255,255,255,0) 100%);
        background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,rgba(0,0,0,0)),color-stop(100%,#000)),-webkit-gradient(linear,left top,right top,color-stop(0%,#fff),color-stop(100%,rgba(255,255,255,0)));
        background: -webkit-linear-gradient(top,rgba(0,0,0,0) 0,#000 100%),-webkit-linear-gradient(left,#fff 0,rgba(255,255,255,0) 100%);
        background: -o-linear-gradient(top,rgba(0,0,0,0) 0,#000 100%),-o-linear-gradient(left,#fff 0,rgba(255,255,255,0) 100%);
        background: -ms-linear-gradient(top,rgba(0,0,0,0) 0,#000 100%),-ms-linear-gradient(left,#fff 0,rgba(255,255,255,0) 100%);
        background: -top-linear-gradient(top,rgba(0,0,0,0) 0,#000 100%),-left-linear-gradient(left,#fff 0,rgba(255,255,255,0) 100%);
        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(top, startColorstr=#f00 100%),(left, endColorstr=#000 0)";
        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(top, startColorstr='#00000000',(left, endColorstr='#FF000000')";
    }

    .e-colorpicker .e-hsv-color .e-color-image.e-draghandle {
        cursor: pointer;
        position: absolute;
        overflow: hidden;
        outline: 0 none;
        margin: -11px 0 0 -11px;
        width: 20px;
        height: 20px;
        background-position: 0px -876px;
        background-repeat: no-repeat;
    }

    .e-colorpicker .e-buttons .e-preview, .e-hsv-color .e-hsv-gradient {
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
    }

    .e-colorpicker .e-buttons .e-preview {
        border-style: solid;
        border-width: 3px;
        display: inline-block;
        outline: 0 none;
        height: 100%;
        position: relative;
        top: 6px;
        width: 13%;
    }

    .e-colorpicker .e-buttons .e-current, .e-colorpicker .e-buttons .e-previous {
        float: left;
        height: 27px;
        width: 100%;
    }


    .e-colorpicker .e-buttons .e-previous {
        border-top: 1px solid;
    }

    .e-colorpicker .e-buttons .e-color-code {
        border-radius: 4px;
        border-style: solid;
        border-width: 1px;
        color: #878787;
        display: block;
        font-size: 13px;
        height: 23px;
        padding-right: 10px;
        outline: 0 none;
        text-align: right;
        width: 93%;
    }

    .e-colorpicker .e-buttons .e-form {
        display: inline-block;
        position: relative;
        top: 7px;
        width: 82%;
    }

    .e-colorpicker .e-buttons .e-grpbtn {
        width: 93%;
        border-radius: 5px;
        border-style: solid;
        border-width: 1px;
        float: left;
        height: 25px;
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
    }

    .e-colorpicker .e-buttons .e-codeeditor {
        float: left;
        margin-top: 6px;
        width: 93%;
    }

    .e-colorpicker .e-buttons .e-grpbtn .e-btn.e-select {
        font-size: 12px;
    }

    .e-colorpicker .e-buttons .e-color-code::-ms-clear {
        display: none;
    }

    .e-colorpicker .e-buttons .e-grpbtn .e-rgbButton, .e-colorpicker .e-buttons .e-grpbtn .e-hexButton, .e-colorpicker .e-buttons .e-grpbtn .e-hsvButton {
        border-radius: 5px;
        height: 25px;
        border: 0px;
        margin-left: 2px;
        width: 32%;
    }

    .e-colorpicker .e-buttons .e-grpbtn .e-click {
        border-radius: 5px;
        font-weight: bold;
        height: 25px;
        margin-left: 1px;
    }

    .e-colorpicker .e-buttons .e-grpbtn .e-btn.e-select.e-click:hover {
        font-weight: bold;
    }

    .e-colorpicker .e-slider-wrap .e-handle {
        background: transparent;
        border: 3px solid #fff;
        box-shadow: rgb(146, 146, 146) 0px 0px 5px inset;
    }

    .e-colorpicker .e-popupWrapper .e-slider-wrap {
        display: inline-block;
        height: 151px;
        padding-left: 7px;
        width: 13px;
    }

    .e-colorpicker .e-slider-wrap .e-handle.e-select, .e-colorpicker .e-slider-wrap .e-handle.e-select:hover {
        border-radius: 12px;
        border-width: 2px;
        border-color: #fff;
    }

    .e-colorpicker .e-slider-wrap .e-hue.e-common {
        background: -moz-linear-gradient(bottom,#f00 0,#ff0 16%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 84%,#ff0004 100%);
        background: -webkit-gradient(linear,left top,right top,color-stop(0%,#f00),color-stop(16%,#ff0),color-stop(33%,#0f0),color-stop(50%,#0ff),color-stop(67%,#00f),color-stop(84%,#f0f),color-stop(100%,#ff0004));
        background: -webkit-linear-gradient(bottom,#f00 0,#ff0 16%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 84%,#ff0004 100%);
        background: -o-linear-gradient(bottom,#f00 0,#ff0 16%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 84%,#ff0004 100%);
        background: -ms-linear-gradient(bottom,#f00 0,#ff0 16%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 84%,#ff0004 100%);
        background: -left-linear-gradient(bottom,#f00 0,#ff0 16%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 84%,#ff0004 100%);
    }

    .e-colorpicker .e-slider-wrap .e-hue.e-color-image.e-filter {
        background-position: 0px -914px;
    }

    .e-colorpicker .e-slider-wrap .e-hue, .e-colorpicker .e-slider-wrap .e-opacity {
        border-style: solid;
        border-width: 3px;
        box-shadow: 0 0 5px #929292 inset;
    }

    .e-colorpicker .e-color-labels {
        position: relative;
        top: 10px;
    }

    .e-colorpicker .e-slider-wrap .e-handle {
        padding: 0px;
    }

    .e-colorpicker .e-recent-color, .e-presetWrapper .e-presets-table .e-tablerow {
        padding: 0px;
    }

    .e-colorpicker .e-recent-color .e-colorblock.e-block.e-select {
        box-shadow: 0px 0px 3px rgba(16,189,229,0.5);
    }

    .e-colorpicker .e-recent-color .e-colorblock {
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
        cursor: pointer;
        display: inline-block;
        height: 28px;
        list-style: none outside none;
        margin: 2px 3px 0 2px;
        outline: 0 none;
        width: 28px;
        border-radius: 5px;
    }

    .e-colorpicker .e-recent-color .e-colorblock.e-select {
        box-shadow: 0px 0px 5px 0px rgba(16,189,229,0.5);
    }

    .e-colorpicker .e-colorblock .e-color-image.e-empty {
        background-position: 0px -788px;
    }

    .e-colorpicker .e-colorblock .e-color-image.e-add {
        background-position: 4px -764px;
    }

    .e-colorpicker .e-colorblock .e-set {
        border-radius: 4px;
        box-shadow: 0px 0px 10px rgba(0,0,0,0.1) inset;
        height: 18px;
        margin: 5px 5px 0;
        width: 18px;
    }

    .e-colorpicker .e-buttons .e-codeeditor {
        position: relative;
    }

    .e-colorpicker .e-buttons .e-close_01 {
        font-size: 21px;
        height: 26px;
        left: -6px;
        position: absolute;
        top: 3px;
        width: 26px;
    }

    .e-colorpicker .e-buttons .e-close_01:before {
        content: "\e767";
        font-family: 'ej-webfont';
        font-size: 22px;
    }

    .e-colorpicker .e-buttons .e-close_01:hover {
        cursor: pointer;
    }

    .e-colorpicker .e-colorblock div.e-empty, .e-colorpicker .e-colorblock div.e-add {
        height: 20px;
        margin: 4px;
        width: 20px;
    }

    .e-colorpicker .e-footer .e-in-wrap.e-box, .e-colorpicker .e-footer .e-in-wrap.e-box .e-splitbutton, .e-colorpicker .e-footer .e-in-wrap.e-box .e-split-btn {
        border-right: 0 none;
    }

    .e-colorpicker .e-footer .e-in-wrap.e-box .e-drp-btn.e-rht-btn {
        border-left: 0 none;
        border-right: 1px solid;
        width: 14px;
    }

    .e-colorpicker .e-footer {
        margin-top: 13px;
    }

    .e-colorpicker .e-footer .e-element {
        display: inline-block;
        float: left;
        width: 85px;
    }

    .e-colorpicker .e-footer .e-switcher {
        border-radius: 6px;
        border-style: solid;
        border-width: 0px;
        box-shadow: 0px 0px 5px rgba(0,0,0,0.1);
        cursor: pointer;
        display: inline;
        float: left;
        height: 27px;
        margin-right: 10px;
        width: 26px;
    }

    .e-colorpicker .e-footer .e-switcher .e-color-image.e-pickerModel {
        background-position: 1px -816px;
        margin: 2px 1px;
    }

    .e-colorpicker .e-footer .e-switcher .e-color-image.e-paletteModel {
        background-position: 1px -846px;
        margin: 3px 2px 2px;
    }

    .e-colorpicker .e-footer .e-switcher .e-pickerModel, .e-colorpicker .e-footer .e-switcher .e-paletteModel {
        height: 21px;
        width: 21px;
    }

    .e-colorpicker .e-footer .e-applyButton {
        left: 91px;
        margin: 0 0 0 8px;
        position: absolute;
    }

    .e-colorpicker .e-footer .e-split.e-widget {
        display: inline-block;
        height: 25px;
        width: 38px;
    }

    .e-colorpicker .e-footer .e-cancelButton {
        float: right;
    }

    .e-colorpicker .e-footer .e-cancelButton, .e-colorpicker .e-footer .e-applyButton {
        border-radius: 5px;
        border-style: solid;
        border-width: 1px;
        font-size: 12px;
        height: 27px;
        width: 4.2em;
    }

    .e-colorpicker .e-split.e-widget .e-splitbutton .e-color-image.e-webcolors {
        background-position: 0px -741px;
    }

    .e-colorpicker .e-split.e-widget .e-splitbutton .e-color-image.e-vintage {
        background-position: 0px -677px;
    }

    .e-colorpicker .e-split.e-widget .e-splitbutton .e-color-image.e-seawolf {
        background-position: 0px -613px;
    }

    .e-colorpicker .e-split.e-widget .e-splitbutton .e-color-image.e-sandy {
        background-position: 0px -549px;
    }

    .e-colorpicker .e-split.e-widget .e-splitbutton .e-color-image.e-pinkshades {
        background-position: 0px -485px;
    }

    .e-colorpicker .e-split.e-widget .e-splitbutton .e-color-image.e-moonlight {
        background-position: 0px -421px;
    }

    .e-colorpicker .e-split.e-widget .e-splitbutton .e-color-image.e-monochrome {
        background-position: 0px -357px;
    }

    .e-colorpicker .e-split.e-widget .e-splitbutton .e-color-image.e-misty {
        background-position: 0px -293px;
    }

    .e-colorpicker .e-split.e-widget .e-splitbutton .e-color-image.e-flatcolors {
        background-position: 0px -229px;
    }

    .e-colorpicker .e-split.e-widget .e-splitbutton .e-color-image.e-basic {
        background-position: 0px -37px;
    }

    .e-colorpicker .e-split.e-widget .e-splitbutton .e-color-image.e-candycrush {
        background-position: 0px -101px;
    }

    .e-colorpicker .e-split.e-widget .e-splitbutton .e-color-image.e-citrus {
        background-position: 0 -165px;
    }

    .e-presetWrapper .e-presets-table .e-tablerow .e-color-image#e-presets00 {
        background-position: 0px -704px;
    }

    .e-presetWrapper .e-presets-table .e-tablerow .e-color-image#e-presets01 {
        background-position: 0px -640px;
    }

    .e-presetWrapper .e-presets-table .e-tablerow .e-color-image#e-presets02 {
        background-position: 0px -576px;
    }

    .e-presetWrapper .e-presets-table .e-tablerow .e-color-image#e-presets10 {
        background-position: 0px -512px;
    }

    .e-presetWrapper .e-presets-table .e-tablerow .e-color-image#e-presets11 {
        background-position: 0px -448px;
    }

    .e-presetWrapper .e-presets-table .e-tablerow .e-color-image#e-presets12 {
        background-position: 0px -384px;
    }

    .e-presetWrapper .e-presets-table .e-tablerow .e-color-image#e-presets20 {
        background-position: 0px -320px;
    }

    .e-presetWrapper .e-presets-table .e-tablerow .e-color-image#e-presets21 {
        background-position: 0px -256px;
    }

    .e-presetWrapper .e-presets-table .e-tablerow .e-color-image#e-presets22 {
        background-position: 0px -192px;
    }

    .e-presetWrapper .e-presets-table .e-tablerow .e-color-image#e-presets30 {
        background-position: 0px 0px;
    }

    .e-presetWrapper .e-presets-table .e-tablerow .e-color-image#e-presets31 {
        background-position: 0px -64px;
    }

    .e-presetWrapper .e-presets-table .e-tablerow .e-color-image#e-presets32 {
        background-position: 0px -128px;
    }

    .e-colorpicker .e-element .e-split.e-widget .e-splitbutton .e-icon {
        height: 17px;
        width: 17px;
    }

    .e-popupWrapper table {
        border-collapse: inherit;
        border-spacing: 10px;
    }

    .e-popupWrapper .e-gradient {
        display: inline-block;
    }

    .e-popupWrapper .e-container {
        display: block;
    }

    .e-colorpicker .e-palette-color, .e-popupWrapper .e-container {
        min-height: 156px;
    }

    .e-colorpicker .e-palette-color.e-custom {
        min-height: 0px;
        height: auto;
    }

    .e-colorpicker .e-palette-color.e-hide, .e-popupWrapper .e-container.e-hide, .e-colorpicker .e-footer .e-split.e-widget.e-hide, .e-colorpicker .e-footer .e-switcher.e-hide, .e-colorpicker .e-buttons .e-preview.e-hide {
        display: none;
    }

    .e-colorpicker .e-row .e-item {
        border-style: solid;
        border-width: 1px;
        cursor: pointer;
        display: inline-block;
        height: 22px;
        margin-left: 4px;
        margin-top: 3px;
        overflow: hidden;
        width: 14px;
        max-width: 14.5px;
    }

    .e-colorpicker .e-row .e-item.e-filter {
        border: 1px solid white;
        outline: 1px solid black;
    }

    .e-colorpicker .e-row .e-item:first-child {
        margin-left: 0;
    }

    .e-colorpicker .e-item.e-state-selected {
        z-index: 100;
        box-shadow: 0 1px 4px #000,inset 0 0 3px #fff;
        position: relative;
    }

    .e-presetWrapper .e-presets-table, .e-presetWrapper .e-presets-table .e-tablerow {
        background: none;
    }

    .e-presetWrapper .e-presetHeader {
        margin-left: 6px;
    }

    .e-presetWrapper .e-presets-table .e-tablerow {
        margin-top: 10px;
    }

    .e-presetWrapper .e-presets-table .e-preset-row {
        display: inline-block;
        height: 27px;
        margin-left: 5px;
        margin-right: 5px;
        width: 27px;
    }

    .e-presetWrapper.e-widget.e-context {
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
        width: 119px;
        border: 3px solid;
    }

    .e-colorpicker .e-element .e-btn .e-icon, .e-colorpicker .e-element .e-split-btn-div .e-icon {
        display: table-cell;
        padding: 1px 0;
        visibility: visible;
    }

    .e-colorpicker .e-element .e-split-btn {
        border: 1px solid;
    }

    .e-colorpicker .e-element .e-icon:before {
        display: block;
        height: 16px;
        margin-top: 6px;
        width: 10px;
    }

    .e-colorpicker .e-element .e-split-btn.e-rht-btn {
        height: 100%;
        width: 13px;
    }

    .e-colorpicker .e-element .e-split-btn.e-left-btn {
        width: 24px;
        float: left;
    }

    .e-colorpicker .e-handle .e-handle-wrapper {
        height: inherit;
        width: inherit;
    }
}

.mixin(@widget) when (@widget = captcha), (@widget = none) {

    .e-captcha .refresh {
        border-radius: 3px;
        cursor: pointer;
        height: 28px;
        margin-left: 13px;
        margin-top: 12px;
        width: 28px;
    }

    .e-reload:before {
        content: "\e73b";
    }

    .e-volume-up:before {
        content: "\e73c";
        margin: -3px;
        padding-top: 3px;
    }

    .e-captcha .audio {
        border-radius: 3px;
        cursor: pointer;
        direction: rtl;
        display: block;
        height: 28px;
        margin-left: 13px;
        margin-top: 0px;
        width: 28px;
    }

    .e-captcha .imagecontainer {
        border-radius: 3px;
        float: left;
        height: 100%;
    }

    .e-captcha .spanText {
        color: red;
        float: left;
        margin-top: 4px;
    }

    .e-captcha .validTextBox {
        border-radius: 3px;
        height: 23px;
        margin-top: 12px;
        padding-left: 5px;
        width: 185px;
    }

    .e-captcha .error {
        border: 1px solid red;
    }

    .e-captcha .e-validTextBox {
        border-radius: 3px;
        direction: rtl;
        height: 23px;
        margin-left: 13px;
        margin-top: 11px;
        padding-right: 5px;
        width: 190px;
    }

    .e-captcha .e-refresh {
        border-radius: 3px;
        cursor: pointer;
        height: 28px;
        margin-left: 13px;
        margin-top: 12px;
        width: 28px;
    }

    .e-captcha .e-audio {
        border-radius: 3px;
        cursor: pointer;
        display: block;
        height: 28px;
        margin-left: 13px;
        margin-top: 1px;
        width: 28px;
    }

    .e-captcha .e-imageContainer {
        border-radius: 3px;
        float: right;
    }

    .e-captcha .error {
        border: 1px solid red;
    }
}

.mixin(@widget) when (@widget = kanban), (@widget = none) {

    .e-kanban .e-table,.e-kbnadapt-editdlg .e-table{
        border: 0 none;
        border-collapse: separate;
        margin-top: 0;
        table-layout: fixed;
        width: 100%;
    }
     ej-kanban {
        display: block;
    }

    .e-kanban .e-widget [class^="e-"],.e-kbnadapt-editdlg .e-widget [class^="e-"] {
        box-sizing: border-box;
    }

    .e-kanban [class^="e-"] {
        box-sizing: content-box;
    }

    .e-kanban .e-rowcell,.e-kbnadapt-editdlg .e-rowcell {
        vertical-align: top;
        display: table-cell;
    }

    .e-kanban .e-kanbanheader tr {
        height: 45px;
    }

    .e-kanban .e-kanbanheader .e-headercell, .e-kanban .e-rowcell,.e-kbnadapt-editdlg .e-rowcell {
        -moz-user-select: -moz-none;
        -khtml-user-select: none;
        -webkit-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

    .e-kanban.e-kanbanscroll {
        border-style: solid;
        border-width: 1px;
    }

    .e-kanban .e-swimlanerow div {
        display: inline-block;
    }

    .e-kanban .e-swimlanerow .e-slkey {
        font-size: 18px;
        font-weight: 500;
    }

    .e-kanban .e-print.e-ul {
        float: right;
        margin-left: 7px;
    }

    .e-kanban .e-printlist {
        padding: 9px;
    }

    .e-kanban .e-printicon {
        padding: 0px !important;
    }

    .e-kanban.e-rtl .e-kanbantoolbar .e-print.e-ul {
        float: left !important;
    }

    .e-kanban .e-swimlanerow .e-slcount {
        font-size: 12px;
        padding: 8px;
    }

    .e-kanban .e-freezeswimlanerow {
        position: relative;
        overflow: hidden;
        opacity: 0.9;
        z-index: 10001;
    }

    .e-kanban .e-freezeswimlanerow .e-rowcell.e-shrink {
        opacity: 0.9;
        cursor: default;
    }

    .e-kanban .e-freezeswimlanerow > div {
        margin-left: 40px;
        position: relative;
        top: 6px;
    }

    .e-kanban .e-freezeswimlanerow .e-freeze-table {
        position: relative;
        height: 12px;
        border-spacing: 8px 0;
    }

    .e-kanban .e-scrollcss {
        padding-right: 17px;
    }

    .e-kanban .e-hscrollcss {
        border-right-style: @border-type;
        border-right-width: @border-size;
    }

    .e-kanban, .e-kanban .e-headercell, .e-kanban .e-headercell-hover, .e-kanban .e-rowcell,.e-kbnadapt-editdlg .e-rowcell{
        border-collapse: collapse;
    }
     .e-kanban .e-rowcell .e-targetclonemulti .e-columnkey .e-text {
        position: relative;
        text-align: center;
        opacity:0.5;
    }

    .e-kanban .e-rowcell .e-targetclonemulti {
        position: relative;
    }


    .e-kanban {
        font-family: @font-family;
        font-size: @font-size;
        border-top: none;
    }

    .e-kanban .e-form-container {
        border: 1px solid;
    }

    .e-kanban .e-form-titlebar {
        font-size: 16px;
        padding: .7em;
    }

    .e-kanban .e-externalform {
        padding: 1.5em 1em 0em 1em;
        padding-bottom: 70px;
    }

    .e-kanban .e-form-titlebar .e-externalform-icon {
        display: inline-block;
        float: right;
        cursor: pointer;
    }

    .e-kanban .e-externalformedit .e-label {
        width: 80px;
        text-align: left !important;
    }

    .e-kanban .e-externalformedit div > label {
        font-weight: normal;
    }

    .e-kanban .e-externalformedit .e-editform-btn {
        float: right;
        padding: 20px 0px 20px 0;
    }

    .e-kanban .e-externalformedit form div {
        display: inline-block;
        padding-top: 5px;
    }

    .e-kanban .e-externalformedit .e-externalrow {
        padding-right: 40px;
    }

    .e-kanban.e-rtl .e-externalformedit .e-externalrow {
        padding-left: 86px;
        padding-right: 0px;
    }

    .e-kanban.e-rtl .e-externalformedit .e-label {
        text-align: right !important;
    }

    .e-kanban.e-rtl .e-form-titlebar .e-externalform-icon {
        float: left;
    }

    .e-kanban .e-dialog,.e-kbnadapt-editdlg .e-dialog,.e-kbnadapt-editdlg{
        border-collapse: separate;
    }

    .e-kanban .e-kanbancontent, .e-kanban .e-headercell, .e-kanban .e-headercelldiv, .e-kanban .e-rowcell, .e-kanban .e-headercontent, .e-kanban .e-kanbanheader, .e-kanban .e-kanbancard {
        overflow: hidden;
    }

    .e-kanbanheader {
        clear: right;
    }

    .e-kanban > .e-kanbancontent > div > .e-table, .e-kanban > .e-kanbanheader > div > .e-table {
        border-spacing: 8px 0;
    }

    .e-kanban tr td:first-child, .e-kanban tr th:first-child {
        border-left: 0 none;
    }

    .e-kanban .e-headercell {
        height: 30px;
        text-align: left;
        text-overflow: ellipsis;
        white-space: nowrap;
        position: relative;
    }

    .e-kanban .e-headercelldiv{
        border: 0 none;
        display: block;
        text-align: left;
    }
    
    .e-kanban .e-totalcard, .e-kanban .e-limits {
        height: 20px;
        line-height: 20px;
    }
    .e-kanban .e-headercell .e-totalcount, .e-kanban .e-rowcell .e-shrinkcount {
        font-size: 15px;
    }

    .e-kanban .e-headercell .e-totalcard, .e-kanban .e-rowcell .e-shrinklabel {
        font-size: 19px;
        font-weight: normal;
        padding: 0 0.3em;
    }

    .e-kanban .e-rowcell .e-shrinklabel {
        display: inline-block;
        margin-top: -2px;
    }

    .e-kanban .e-headercell .e-limits {
        font-size: 14px;
        font-weight: normal;
        margin-top: 1px;
    }

    .e-kanban .e-headercell .e-minlimit, .e-kanban .e-headercell .e-maxlimit {
        font-size: 12px;
        font-weight: normal;
        padding-top: 2px;
    }

    .e-kanban .e-icon::before {
        display: inline-block;
    }

    .e-kanban .e-headercell .e-limits, .e-kanban.e-rtl .e-headercelldiv {
        float: right;
    }

    .e-kanban.e-rtl .e-headercell .e-limits {
        float: left;
    }

    .e-kanban .e-headercelldiv {
        font-size: 17px;
        font-weight: 600;
        float: left;
        width: 100%;
        margin-top: -4px;
    }

    .e-kanban .e-stackedHeaderCell {
        font-size: 17px;
        font-weight: 600;
        text-align: center;
    }

    .e-kanban .e-headercelldiv .e-headerdiv {
        float: left;
    }

    .e-kanban .e-icon::before {
        display: inline-block;
    }

    .e-kanban tr td:first-child, .e-kanban tr th:first-child {
        border-left: 0 none;
    }

    .e-kanban .e-lastrowcell {
        border-bottom-width: @border-size;
    }

    .e-kanban .e-hide {
        display: none !important;
    }

    .e-kanban {
        height: auto;
        font-family: Segoe UI;
        outline: 0 none;
    }

    .e-kanban .e-kanbancard .e-primarykey {
        font-size: 14px;
	  font-weight: 600;
	  width:70%;
    }

    .e-kanban .e-kanbancard .e-expandcollapse {
        float: right;
        cursor: pointer;
        margin-right: -8px;
        margin-top: -5px;
        padding: 4px 3px 8px 6px;
    }

    .e-kanban .e-kanbancard .e-cardheader div {
        display: inline-block;
    }

    .e-kanban .e-rowcell .e-targetclone, .e-kanban .e-rowcell .e-targetdragclone {
        margin: 12px;
        position: relative;
    }

   .e-kanban .e-kanbancard .e-cardheader {
        padding: 6px 6px 6px 10px;;
    }

    .e-kanban .e-kanbancard .e-image {
        width: 100%;
        height: 100%;
    }

    .e-kanban .e-kanbancard .e-tags {
        display: table-cell;
        padding: 5px 0 10px 0;
    }

    .e-kanban .e-kanbancard .e-imagecell {
        vertical-align: top;
        width: 54px;
    }

    .e-kanban .e-cardheader .e-cardtext {
        font-size: 11px;
        padding-left: 4px;
        padding-top: 12px;
    }

    .e-kanban .e-kanbancard .e-cardheader .e-text {
        font-size: 11px;
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .e-kanban .e-kanbantouchbar {
        position: absolute;
        font-weight: normal;
        z-index: 99999;
    }

    .e-kanban .e-kanbantouchbar .e-content {
        border-width: 1px;
        border-style: solid;
    }

    .e-kanban .e-kanbantouchbar .e-content {
        border-radius: 4px;
        font-size: 14px;
        padding: 4px 4px;
    }

    .e-kanban .e-kanbantouchbar span {
        display: inline-block;
        height: 16px;
        cursor: pointer;
        padding: 4px;
        border: 1px solid transparent;
        width: 16px;
    }

    .e-kanban .e-kanbantouchbar .e-tail:before, .e-kanban .e-kanbantouchbar .e-tail:after {
        border: 10px solid rgba(0, 0, 0, 0);
        content: "";
        height: 0;
        left: 8px;
        position: absolute;
        width: 0;
    }

    .e-kanban .e-kanbantouchbar .e-downtail:after {
        top: 34px;
    }

    .e-kanban .e-cardtouch:before {
        content: "\e701";
    }

    .e-kanban .e-kanbantoolbar li a {
        padding: 7px 8px;
        text-decoration: none;
    }

    .e-kanban .e-kanbantoolbar .e-toolbartext {
        line-height: 26px;
        min-height: 26px;
        min-width: 26px;
    }

    .e-kanban {
        border-top: medium none;
        height: auto;
    }

    .e-kanban .e-columnrow .e-kanbancard {
        border-width: @border-size;
    }

    .e-kanban .e-kanbancard {
        cursor: all-scroll;
        margin: 12px;
        border-width: @border-size;
        border-style: @border-type;
        border-radius: 4px;
    }

    .e-kanban .e-draggedcard .e-kanbancard {
        margin: 0;
        border-radius: 4px;
    }

    .e-kanban .e-kanbancard .e-tag {
        font-size: 12px;
        margin-right: 5px;
        overflow: hidden;
        padding: 2px 5px;
        border-radius: 2px;
        display: inline-block;
        margin-bottom: -4px;
		padding : 1px 7px 3px 7px;
    }

    .e-kanban .e-kanbancard.e-cardselection {
        -moz-border-bottom-colors: none;
        -moz-border-left-colors: none;
        -moz-border-right-colors: none;
        -moz-border-top-colors: none;
        border-style: @border-type;
    }

    .e-kanban .e-draggedcard {
        float: left;
    }

    .e-kanban .e-draggedcard .e-dragmultiple {
        padding: 6px 6px 8px 3px;
        text-align: center;
        font-size: 14px;
        display: table-cell;
        vertical-align: middle;
        width: 90px;
    }

    .e-kanban-context li div {
        float: left;
        width: 16px;
        height: 16px;
        margin-left: 3px;
        margin-top: 3px;
    }

    .e-kanban-context {
        min-width: 180px;
        font-size: 11px;
    }

    .e-kanban-context .e-kanbancontext.e-icon {
        padding-left: 5px;
    }

    .e-kanban-context .e-visiblecolumn .e-list > a {
        overflow: visible;
    }

    .e-kanban-context.e-menu .e-list > a {
        padding: 1px 18px 1px 32px;
    }

    .e-kanban-context .e-icon.e-contextprint:before, .e-kanban .e-printicon:before {
        content: "\e80f";
    }

    .e-kanban-context .e-icon.e-contextadd:before {
        content: "\e802";
    }

    .e-kanban-context .e-icon.e-contextdelete:before {
        content: "\e800";
    }

    .e-kanban-context .e-icon.e-contextedit:before {
        content: "\e801";
    }

    .e-kanban-context .e-icon.e-contexttop:before {
        content: "\e7ff";
    }

    .e-kanban-context .e-icon.e-contextbottom:before {
        content: "\e7fe";
    }

    .e-kanban-context .e-icon.e-contextleft:before {
        content: "\e7fa";
    }

    .e-kanban-context .e-icon.e-contextright:before {
        content: "\e7fb";
    }

    .e-kanban-context .e-icon.e-contextup:before {
        content: "\e7fd";
    }

    .e-kanban-context .e-icon.e-contextdown:before {
        content: "\e7fc";
    }

    .e-kanban-context .e-icon.e-contextswimlane:before {
        content: "\e7f9";
    }

    .e-kanban-context .e-icon.e-contexthide:before {
        content: "\e7f8";
    }

    .e-kanban-context .e-icon.e-contextvisible:before {
        content: "\e7f7";
    }

    .e-kanban .e-kanbancontent {
        outline: medium none;
        font-weight: @content-font-weight;
    }

    .e-kanban .e-cardcontent .e-cardtable {
        width: 100%;
        table-layout: fixed;
        border-spacing: 0px;
    }

    .e-kanban .e-kanbancard .e-card_image {
        height: 45px;
        width: 45px;
        float: right;
		border:1px solid;
		margin-right: 8px;
    }

    .e-kanban .e-kanbantoolbar.e-toolbar,.e-kbntoolbar-body.e-toolbar {
        border-style: solid;
        border-width: 0 0 1px;
        padding: 15px 0;
        font-size: 12px;
		box-shadow: none;
    }

    .e-kanban .e-kanbantoolbar li {
        margin: 0 0.4em;
    }

    .e-kanban .e-kanbantoolbar .e-quickfilter .e-text {
        font-weight: normal;
        margin-bottom: auto;
    }

    .e-kanban .e-kanbantoolbar .e-quickfilter {
        border: 0 none !important;
    }

    .e-kanban .e-slexpand:before {
        content: "\e804";
    }

    .e-kanban .e-slcollapse:before {
        content: "\e80b";
    }

    .e-kanban .e-icon.e-slexpand, .e-kanban .e-icon.e-slcollapse {
        font-size: 16px;
    }

    .e-kanban .e-limits > div {
        padding-right: 8px;
    }

    .e-kanban .e-clexpand:before {
        content: "\e68b";
        position: relative;
        left: 2px;
    }

    .e-kanban .e-clcollapse:before {
        content: "\e69b";
    }

    .e-kanban .e-slexpand, .e-kanban .e-slcollapse {
        height: 20px;
        padding-right: 2px;
        padding-top: 2px;
        text-align: center;
        width: 22px;
    }

    .e-kanban.e-rtl .e-slexpand, .e-kanban.e-rtl .e-slcollapse {
        padding-left: 2px;
    }

    .e-kanban .e-dialog .e-rowcell {
        border: none;
    }

    .e-kanbanwaitingpopup.e-waitpopup-pane {
        background-color: transparent !important;
    }

    .e-kanban .e-kanban-editdiv {
        padding-bottom: 17px;
        padding-top: 10px;
        text-align: right;
    }

    .e-kanban .e-emptycard {
        white-space: nowrap;
    }

    .e-kanban .e-image.e-no-user {
        background: rgba(0, 0, 0, 0) url("@{font-path}/kanban/nouser.svg") no-repeat scroll 0 0;
    }

    .e-kanban .e-columnrow .e-rowcell {
        height: 200px;
        min-height: 200px;
        line-height: 1.5;
        padding: 0 1px;
        position: relative;
    }

    .e-kanban .e-kanbancard .e-cardheader .e-icon {
        font-size: 11px;
    }
    .e-kanban .e-cardexpand:before {
        content: "\e821";
        font-size: 5px;
     }

    .e-kanban .e-cardcollapse:before {
        content: "\e820";
        font-size: 5px;
    }

    .e-kanban.e-rtl {
        direction: rtl;
    }

    .e-kanban.e-rtl .e-headercelldiv .e-headerdiv {
        float: right;
    }

    .e-kanban.e-rtl .e-icon.e-clexpand {
        float: left;
        padding: 4px 0;
        position: relative;
    }

    .e-kanban.e-rtl .e-rowcell.e-dragged:first-child {
        border-left-width: 1px !important;
    }

    .e-kanban.e-rtl td:last-child {
        padding-left: 1px !important;
    }

    .e-kanban .e-columnrow .e-rowcell.e-dropping {
        border-style: dashed;
        border-width: 1px;
        padding: 0 !important;
    }

    .e-kanban .e-widget .e-select .e-icon::before, .e-kanban .e-dialog .e-icon::before, .e-kanban form .e-icon::before,
    .e-kanbandialog .e-icon::before,.e-kanbandialog form .e-icon::before
	{
        display: block;
    }

    .e-kanban .e-dialog .e-addedrow table, .e-kanban .e-dialog .e-editedrow table, .e-kanban .e-externalform table,
     .e-kanbandialog .e-addedrow table,.e-kanbandialog .e-editedrow table
	{
        border-collapse: separate;
        border-spacing: 11px;
    }

    .e-kanban .e-dialog .e-addedrow label, .e-kanban .e-dialog .e-editedrow label,
    .e-kanbandialog .e-addedrow label, .e-kanbandialog .e-editedrow label,
	{
        display: inline;
        font-weight: normal;
        font-size: 14px;
        margin-bottom: 0;
        white-space: nowrap;
    }

    .e-kanban .e-dialog .e-save, .e-kanban .e-dialog .e-cancel {
        font-size: 14px;
        font-weight: normal;
    }

    .e-kanban .e-dialog .e-kanbantextarea {
        width: auto;
        text-indent: 0px;
    }

    .e-kanban .e-shrinkcol {
        width: 50px !important;
    }

    .e-kanban .e-swimlanerow .e-rowcell .e-slexpandcollapse {
        padding: 10px 10px 10px 3px;
        cursor: pointer;
    }

    .e-kanban .e-swimlanerow {
        height: 45px;
    }

    .e-kanban .e-icon.e-clexpand {
        float: right;
    }

    .e-kanban .e-headercell .e-clcollapse {
        text-align: center;
        width: 100%;
        padding: 14px 0;
        cursor: pointer;
    }

    .e-kanban .e-headercell .e-clexpand {
        padding: 10px 0px 10px 0;
        cursor: pointer;
        text-align: center;
    }

    .e-kanban .e-kanbancard .e-text {
        font-size: 12px;
    }

    .e-kanban .e-shrinkheader {
        font-size: 17px;
        font-weight: 600;
        display: inline-block;
        width: 100%;
        white-space: nowrap;
    }

    .e-kanban .e-shrinkheader.IE .e-shrinklabel {
        padding-top: 10px;
    }

    .e-kanban .e-shrinkheader.IE {
        writing-mode: tb-rl;
        padding-top: 15px;
    }

    .e-kanban .e-shrinkheader.IE .e-shrinkcount {
        display: inline-block;
        padding-right: 5px;
		position:relative;
		right:-2px;
    }

    .e-kanban .e-shrinkheader:not(.IE) {
        transform: rotate(90deg) translate(25px);
        -webkit-transform: rotate(90deg) translate(25px);
    }

    .e-kanban .e-shrink {
        cursor: pointer;
    }

    .e-kanban .e-shrinkcount {
        display: inline-block;
    }

    .e-kanban div.e-error .e-toparrow {
        left: 10%;
        display: block;
    }

    .e-kanban .e-error div.e-field-validation-error {
        border-radius: 7px;
        font-size: 14px;
        white-space: normal;
        padding: 7px;
    }

    .e-kanban div.e-error,
    .e-kanban .e-kanbanpopup {
        position: absolute;
        font-weight: normal;
        z-index: 99999;
    }

    .e-kanban .e-kanbantoolbar .e-ejinputtext {
        text-indent: 0px;
        height: 33px;
    }

    .e-kanban .e-searchdiv {
        position: relative;
    }

    .e-kanban .e-kanbantoolbar .e-search {
        float: right !important;
        display: flex;
        padding: 0px;
        height: 35px;
    }

    .e-kanban .e-kanbantooltip {
        font-size: 10px;
        opacity: 25;
        padding: 5px;
        margin-top: 15px;
        margin-left: 5px;
        width: auto;
    }

    .e-kanban .e-toolbaricons.e-searchfind, .e-kanban .e-toolbaricons.e-cancel {
        padding-right: 23px;
        padding-top: 9px;
        height: 33px;
    }

    .e-kanban .e-kanbantoolbar .e-searchbar.e-ul {
        float: right;
    }

    .e-kanban.e-rtl .e-kanbantoolbar .e-searchbar.e-ul {
        float: left;
    }

    .e-kanban .e-search {
        width: 190px;
    }

    .e-kanban .e-kanbantooltip {
        position: absolute;
        z-index: 105;
        display: block;
    }

    .e-kanban.e-rtl .e-toolbaricons.e-searchfind, .e-kanban.e-rtl .e-toolbaricons.e-cancel {
        padding-left: 21px;
        padding-right: 10px;
        line-height: 17px;
    }

    .e-kanban.e-rtl .e-rowcell .e-limits {
        text-align: left;
    }

    .e-kanban .e-rowcell .e-limits {
        text-align: right;
        margin: 12px 12px 0px 12px;
        line-height: 12px;
        height: 12px;
    }

    .e-kanban .e-rowcell .e-limits > div:last-child {
        padding-right: 0px;
    }

    .e-kanban .e-rowcell .e-limits > div {
        display: inline-block;
    }

    .e-kanban div.e-error .e-errortail {
        height: 0;
        position: relative;
        width: 0;
        border: 10px solid transparent;
        border-top: 5px;
    }

    .e-kanban .e-kanbancard.e-collapsedcard .e-cardheader {
        border-bottom: 0 none;
		padding-right: 0px;
    }

    .e-kanban.e-rtl .e-shrinkheader:not(.IE) {
        transform: rotate(90deg) translate(60px);
        -webkit-transform: rotate(90deg) translate(60px);
    }

    .e-kanban.e-rtl .e-swimlanerow .e-rowcell .e-slexpandcollapse {
        padding: 10px 3px 10px 10px;
    }

    .e-kanban.e-rtl div.e-error .e-toparrow {
        right: 10%;
    }

    .e-kanban.e-rtl .e-kanbancard .e-expandcollapse {
        float: left;
        margin-left: -7px;
    }

    .e-kanban.e-rtl .e-kanbancard .e-card_image {
        float: left;
    }

    .e-kanban.e-rtl td:last-child, .e-kanban.e-rtl th:last-child {
        border-left: 0 none;
    }

    .e-kanban.e-rtl .e-kanbanheader .e-headercelldiv, .e-kanban.e-rtl .e-kanbanheader .e-headercell, .e-kanban.e-rtl .e-totalcard, .e-kanban.e-rtl .e-minlimit, .e-kanban.e-rtl .e-maxlimit {
        text-align: right;
    }

    .e-kanban.e-rtl .e-dialog .e-dialog-content td.e-rowcell {
        text-align: right !important;
    }

    .e-kanban.e-rtl .e-dialog .e-dialog-content td.e-label {
        border-left: 0 none;
    }

    .e-kanban.e-rtl .e-kanbantoolbar.e-toolbar ul {
        float: right;
    }

    .e-kanban.e-rtl .e-kanbantoolbar.e-toolbar ul li {
        margin: 0.7em 0.7em 0.7em 0;
    }

    .e-kanban.e-rtl .e-scrollcss {
        padding-left: 18px;
        padding-right: 0;
    }

    .e-kanban.e-rtl.e-kanbanscroll .e-headercontent {
        border-right: 0px none;
        border-left: @border-size @border-type;
    }
    .e-kanban.e-rtl .e-columnrow td.e-dropping:first-child {
        border-left-style: dashed;
        border-left-width: 1px;
        padding-left: 0 !important;
    }

    .e-kanban .e-headercell div {
        display: inline-block;
    }

    .e-kanban .e-headercontent.e-vscroll-area {
        border: none;
    }

    .e-kanban .e-toolbar.e-js ul > li.e-tooltxt {
        margin-bottom: 1px;
    }

    .e-kanban .e-customtoolbarseparator {
        margin-right: 6px;
        padding-right: 14px;
    }

    .e-kanban .e-customaddbutton {
        border-style: dashed;
        height: 36px;
        margin: 12px;
        padding-right: 1px;
        border-width: 1px;
        cursor: pointer;
    }

    .e-kanban .e-customtoolbar {
        padding-left: 18px;
    }

    .e-kanban .e-columnadd {
        margin-left: auto;
        margin-right: auto;
        cursor: pointer;
        padding-top: 8px;
        display: block;
    }

    .e-kanban .e-columnadd:before {
        content: "\e802";
    }

    .e-kanban .e-icon.e-externaledit.e-cancel:before {
        content: "\e800";
    }

    .e-kanban .e-kanbandialog table td.e-label {
        text-align: right;
    }

    .e-kanban .e-kanbandialog .e-save, .e-kanban .e-kanbandialog .e-cancel, .e-kanban .e-externalform .e-save, .e-kanban .e-externalform .e-cancel {
        width: 100px;
    }

    .e-kanban .e-kanbandialog .e-cancel, .e-kanban .e-externalform .e-cancel {
        margin-left: 15px;
        margin-right: 13px;
    }

    .e-kanban .e-freezeswimlanerow.e-swimlanerow .e-slkey {
        margin-left: 3px;
    }

    .e-kanban-context .e-checkbox {
        top: 0px !important;
        padding-left: 0px !important;
    }
.e-kanban .e-headercell.e-toggleonly .e-clexpand {
   cursor: pointer;
   right: 0;
   text-align: center;
   position: absolute;
   top:4px;
}
.e-kanban .e-headercell .e-totalcard,.e-kanban .e-headercell .e-limits {
  float: left;
}
.e-kanban.e-rtl .e-headercell .e-totalcard,.e-kanban.e-rtl .e-headercell .e-limits {
  float: right;
}
.e-kanban .e-headercell .e-totalcard ,.e-kanban .e-headercell .e-totalcount,.e-kanban .e-headercell .e-limits{
  font-size: 13px;
}
.e-kanban .e-headercell .e-totalcard {
  padding: 0px 3px 0px 0px;
}
.e-kanban .e-limits > div {
  padding-left: 3px;
  padding-right: 3px;
}
.e-kanban .e-headercell .e-limits{
   margin-top:0px;
}
.e-kanban .e-kanbancard .e-bottom-triangle{
   border-bottom: 20px solid;
   border-left: 20px solid transparent; 
   float: right;
 }
.e-kanban.e-rtl .e-kanbancard .e-bottom-triangle{
   border-right: 20px solid transparent; 
   border-left:none;
   float: left;
 }
.e-kanban .e-kanbancard .e-contentcell{
   vertical-align:top;
 }
 .e-kanban .e-kanbancard .e-image,.e-kanban .e-kanbancard .e-card_image{
      border-radius: 50%;
	}
  .e-kanban.e-rtl td.e-trainglecell{
   padding-left:0px !important
 }
.e-kanban .e-kanbancard .e-cardcontent{
    padding: 6px 0 0 10px;
    margin-right: -1px;
}
.e-kanban.e-rtl .e-kanbancard .e-cardcontent{
   padding: 6px 6px 0px 0px;
   margin-right: 0px;
}
.e-kanban.e-rtl .e-kanbancard .e-card_image {    
 margin-left: 6px;
 }
.e-kanban.e-rtl .e-kanbancard .e-cardheader .e-bottom-triangle{
   border-left:none;
 }
.e-kanban .e-kanbancard.e-collapsedcard .e-cardheader .e-cardcollapse{
   margin-right: 6px;
}
.e-kanban.e-rtl .e-kanbancard.e-collapsedcard .e-cardheader{
    padding-left: 0px;
    padding-right: 6px;
}
.e-kanban .e-kanban-draggedcard{
 display:none;
}
.e-kanban .e-kanbancard .e-trainglecell{
   vertical-align:bottom;
   padding: 0px;
}
.e-kanban .e-headercell.e-toggle-withoutcount .e-headercelldiv{
 height: 100%; 
 }
.e-kanban .e-headercell.e-toggle-withoutcount .e-clexpand{
 padding: 0px; 
}
.e-kanban .e-headercell.e-toggle-withcount .e-clexpand{
  padding: 3px 0 6px 0;
}
.e-kanban .e-kanbancard .e-expandcollapse div{
  position: relative;
  top: -6px; 
  left: -5px;
 }
.e-kanban.e-rtl .e-kanbancard .e-expandcollapse div{
   left: -5px;
   }
 .e-kanban .e-columnheader.e-header-withcount .e-shrinkcol .e-clcollapse{
    position: relative;
    top: 8px;
}
.e-kanban.e-rtl .e-headercell .e-clexpand:before{
    left: -4px;
}
.e-kanban.e-rtl .e-headercell .e-totalcard {
  padding: 0 0px 0px 3px;
}
.e-kanban.e-rtl .e-headercell.e-toggleonly .e-clexpand{
    top: 11px;
    right: auto;
    left: 0;
}
.e-kanban .e-ejinputtext,.e-kbnadapt-editdlg .e-ejinputtext{
  outline:none;
  vertical-align:baseline;
  border: 1px solid;
}
.e-kanban.e-onlycontent .e-kanbancard .e-contentcell{
  width:99%;
}
.e-kanban.e-rtl .e-kanbancard.e-collapsedcard .e-cardheader .e-cardcollapse{
  left: 3px;
}
.e-kanban .e-columnheader.e-header-withcount .e-headercell:not(.e-toggle-withcount):not(.e-toggle-withoutcount) .e-headercelldiv{
  margin-top: -22px;
}
}

.mixin(@widget) when (@widget = ribbon), (@widget = none) {
    /*------------------------------Ribbon Start-------------------------------*/
    .e-ribbon.e-js.e-widget {
        position: relative;
    }
     .e-ribbon .e-rbnondemand{
	    box-sizing:border-box !important;
	   }
    .e-ribbon.e-js > .e-header {
        position: relative;
        border: 1px solid;
        height: 53px;
        box-sizing: content-box;
        width: 100%;
        white-space: nowrap;
        display: inline-flex;
        display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
        display: -ms-flexbox; /* TWEENER - IE 10 */
        display: -webkit-flex; /* NEW - Chrome */
        display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
    }

    .e-ribbon .e-content {
        width: 100%;
        white-space: nowrap;
    }

    .e-ribbon .e-active-content {
        z-index: 10000;
        position: relative;
    }

    .e-ribbon .e-empty-content {
        padding: 0;
        margin: 0;
        height: 30px !important;
    }

    .e-ribbon .e-content-show {
        display: block;
    }

    .e-ribbon .e-groupdiv .e-gallerybtn, .e-ribbon .e-groupdiv .e-gallerybtn:hover, .e-ribbon .e-groupdiv .e-galleryselect,
    .e-ribbon .e-resizediv .e-gallerybtn, .e-ribbon .e-resizediv .e-gallerybtn:hover, .e-ribbon .e-resizediv .e-galleryselect {
        border: 3px solid;
        overflow: hidden;
    }

    .e-ribbon .e-groupdiv {
        display: inline-block;
        height: 95%;
        position: relative;
        padding-top: 5px;
        vertical-align: top;
        padding-right: 5px;
    }

    .e-ribbon .e-groupdiv .e-gallerycontent,
    .e-ribbon .e-resizediv .e-gallerycontent {
        border: 1px solid;
        border-right: 0;
        overflow: hidden;
        float: left;
    }

    .e-ribbon.e-rtl .e-groupdiv .e-gallerycontent {
        border-left: 0;
        border-right: 1px solid;
        float: right;
    }

    .e-ribbon.e-rtl.e-js .e-header .e-apptab .e-menu > li:first-child > a {
        padding-right: 8px;
        border-left-width: 0;
    }

    .e-ribbon.e-rtl .e-header .e-apptab .e-menu .e-arrows {
        margin-left: 1px;
    }

    .e-ribbon .e-groupdiv .e-gallexpandcontent,
    .e-ribbon .e-resizediv .e-gallexpandcontent {
        border: 1px solid;
        z-index: 1002;
        position: relative;
    }

    .e-ribbon .e-groupdiv .e-extracontent,
    .e-ribbon .e-resizediv .e-extracontent {
        border-top: 1px solid;
    }

    .e-ribbon .e-groupdiv .e-galleryextrabtn,
    .e-ribbon .e-resizediv .e-galleryextrabtn {
        overflow: hidden;
        display: table;
        width: 100%;
    }

    .e-ribbon .e-groupdiv .e-menu,
    .e-ribbon .e-resizediv .e-menu {
        border: none;
    }

    .e-ribbon.e-js .e-header .e-active.e-tab .e-removeapptab,
    .e-ribbon.e-js .e-header .e-active.e-contextualtabset .e-removeapptab {
        border-left-width: 0;
    }

    .e-ribbon .e-groupdiv .e-gallerymovediv,
    .e-ribbon .e-resizediv .e-gallerymovediv {
        float: right;
        width: 16px;
    }

    .e-ribbon .e-groupdiv .e-moveupdiv,
    .e-ribbon .e-groupdiv .e-movedowndiv,
    .e-ribbon .e-resizediv .e-moveupdiv,
    .e-ribbon .e-resizediv .e-movedowndiv {
        border-style: solid;
        border-width: 1px 1px 0 1px;
        height: 21px;
    }

    .e-ribbon .e-groupdiv .e-expgallerydiv,
    .e-ribbon .e-resizediv .e-expgallerydiv {
        border: 1px solid;
        height: 21px;
    }

    .e-ribbon .e-groupdiv .e-resizebtn {
        position: relative;
        left: 2px;
        min-width: 48px;
    }

    .e-ribbon .e-groupdiv .e-resizebtn .e-btntxt {
        padding-top: 18px;
        display: block;
    }

    .e-ribbon.e-rtl .e-galleryup:before {
        margin-left: auto;
        margin-right: 3px;
    }

    .e-ribbon.e-rtl .e-resizebtn .e-icon {
        float: none;
    }

    .e-ribbon.e-rtl .e-ribbongallerycontrol .e-icon {
        float: none;
    }

    .e-ribbon.e-rtl .e-gallerydown:before {
        margin-left: auto;
        margin-right: 3px;
    }

    .e-ribbon.e-rtl .e-galleryexpand:before {
        margin-left: auto;
        margin-right: 3px;
    }

    .e-ribbon.e-rtl.e-rbnwithqat .e-rbnquickaccessbar.e-rbnabove {
        left: auto;
        right: 1px;
    }

    .e-ribbon.e-rtl .e-expandcollapse {
        left: 0;
        right:  auto;
    }

    .e-ribbon.e-rtl .e-rarrowup-2x:before {
        left: -2px;
    }

    .e-ribbon.e-rtl .e-ribbonpinicon:before {
        left: -2px;
    }

    .e-ribbon.e-rtl .e-button .e-icon {
        float: none;
    }

    .e-ribbon.e-rtl .e-groupdiv > div:after {
        right: auto;
        left: 0;
    }

    .e-ribbon.e-rtl .e-header > li {
        margin-left: 2px;
        margin-right: 0;
    }

    .e-ribbon.e-rtl .e-backstageli {
        text-align: right;
    }

    .e-ribbon.e-rtl .e-backstagetopicon {
        right: 15px;
    }

    .e-ribbon.e-rtl .e-backstagescrollcontent .e-vscrollbar .e-icon {
        float: none;
    }

    .e-ribbon.e-rtl .e-ribbonbackstagepage .e-backstagetitlecontent {
        padding-right: 40px;
        padding-left: 0px;
    }

    .e-ribbon.e-rtl.e-rbnwithqat .e-rbnqatmenu .e-removemenuli p {
        padding-right: 9px;
    }

    .e-ribbon.e-rtl.e-rbnwithqat .e-rbnqatmenu .e-removemenuli:before {
        padding-right: 7px;
    }

    .e-ribbon.e-rtl.e-rbnwithqat .e-qatmorecommands,
    .e-ribbon.e-rtl.e-rbnwithqat .e-rbnshowbelow,
    .e-ribbon.e-rtl.e-rbnwithqat .e-rbnshowabove,
    .e-ribbon.e-rtl.e-rbnwithqat .e-addmenuli {
        padding-right: 33px;
    }

    .e-ribbon .e-resizediv {
        border-width: 0 1px 1px 1px;
        border-style: solid;
        width: 100%;
        z-index: 1002;
        position: absolute;
        padding: 6px 8px 0 3px;
    }

    .e-ribbon .e-btn {
        border: none;
    }

    .e-ribbon .e-parentdiv {
        padding: 0;
    }

    .e-ribbon .e-header .e-contextualtab {
        font-size: 10pt;
        height: 33px;
    }

    .e-ribbon .e-header .e-contextualtabset {
        border: none;
        display: table-cell;
        height: 33px;
    }

    .e-ribbon.e-js .e-header .e-contextualtabset.e-active {
        border: none;
    }

    .e-ribbon .e-ddl .e-select {
        background: none repeat scroll 0 0;
        border: medium none;
    }

    .e-ribbon .e-innerdiv {
        display: table-cell;
        padding-left: 5px;
        vertical-align: top;
    }

    .e-ribbon .e-innerdivrow {
        display: table;
        padding-left: 5px;
        padding-bottom: 5px;
    }

    .e-ribbon .e-innerdivchild {
        float: left;
    }

    .e-ribbon .e-contextualtab .e-link {
        text-align: center;
        width: inherit;
    }

    .e-ribbon .e-contextualtab > .e-active a {
        border-bottom: 3px solid;
    }

    .e-ribbon .e-contextualtabset > .e-active a {
        border-bottom: 3px solid;
    }

    .e-ribbon .e-groupdiv > div:after {
        content: ' ';
        right: 0;
        height: auto;
        position: absolute;
        top: 5px;
        bottom: 5px;
        width: 1px;
    }

    .e-ribbon .e-captionarea {
        font-family: segoe ui;
        font-size: 11px;
        line-height: 11px;
        text-align: center;
        position: relative;
        left: 2px;
        bottom: 0;
        width: 100%;
        float: left;
        height: 14px;
        display: table-cell;
    }

    .e-ribbon .e-groupxpand {
        float: left;
    }

    .e-ribbon .e-expandcollapse {
        bottom: 0;
        list-style: none;
        margin: 0;
        padding: 0;
        position: absolute;
        right: 0;
        cursor: default;
    }

    .e-ribbon .e-header .e-contextliset {
        border: none;
    }

    .e-ribbon .e-header .e-contextli ul .e-contexttitle,
    .e-ribbon .e-header .e-contextliset ul .e-contexttitle {
        border: none;
        text-align: center;
        width: 100%;
        font-size: 12px;
    }

    .e-ribbon .e-menu .e-list > ul .e-list a {
        font-size: 10pt;
        font-style: normal;
    }

    .e-ribbon .e-menu .e-list > ul .e-list {
        width: 100%;
        line-height: 21px;
    }

    .e-ribbon .e-centeralign {
        vertical-align: middle;
    }

    .e-ribbon .e-controlpadding {
        padding-left: 1px;
        padding-right: 1px;
    }

    .e-ribbon .e-rarrowup-2x:before {
        font-size: 10px;
        left: 3px;
        position: relative;
        top: 3px;
    }

    .e-ribbon .e-rarrowdown-2x:before {
        font-size: 10px;
        left: 2px;
        position: relative;
        top: 4px;
    }

    .e-ribbon.e-responsive .e-resbackstage:before {
        font-family: 'ej-webfont';
        content: "\e816";
        font-size: 20px;
        position: relative;
        top: -4px;
    }


    .e-ribbon .e-icon.e-ribdownarrow:before {
        font-family: 'ej-webfont';
        content: "\e81d";
        font-size: 20px;
        left: 1px;
        position: relative;
        top: 0px;
    }

    .e-ribbon .e-icon.e-ribuparrow:before {
        font-family: 'ej-webfont';
        content: "\e81e";
        font-size: 20px;
        position: relative;
        top: 0px;
    }

    .e-ribbon .e-resgroupheader .e-groupresponsive.e-ribuparrow {
        padding: 0;
        position: relative;
        right: 12px;
        top: 18px;
    }

    .e-ribbon.e-responsive .e-resgroupheader .e-ribupdivarrow, .e-ribbon.e-responsive .e-resizegroupdiv .e-ribrightdivarrow {
        float: right;
        height: 48px;
        width: 40px;
    }

    .e-ribbon.e-responsive .e-backstagecontent.e-backstageactive-content {
        display: block !important;
    }

    .e-ribbon.e-responsive .e-ribGroupContent {
        padding-left: 12px;
        padding-right: 12px;
    }

    .e-ribbon.e-responsive .e-resgroupheader .e-groupresponsive.e-ribdownarrow {
        position: relative;
        right: 14px;
        top: 14px;
        padding: 0;
    }

    .e-ribbon .e-icon.e-ribleftarrow:before {
        font-family: 'ej-webfont';
        font-size: 20px;
        content: "\e819";
    }

    .e-ribbon .e-icon.e-ribrightarrow:before {
        font-family: 'ej-webfont';
        font-size: 20px;
        content: "\e818";
    }


    .e-ribbon .e-groupexpander {
        height: 14px;
        width: 14px;
        cursor: pointer;
        display: table-cell;
        left: -1px;
        line-height: 2;
        position: relative;
        text-align: right;
        top: -14px;
        float: right;
    }

    .e-ribbon .e-contentbottom {
        width: 100%;
        height: 11px;
        display: inline-block;
    }

    .e-ribbon .e-small {
        width: 25px;
        height: 25px;
    }

    .e-ribbon .e-big {
        width: 50px;
        height: 50px;
    }

    .e-ribbon .e-separatordivrow {
        width: 1px;
        margin-left: 3px;
        margin-right: 3px;
        float: left;
    }

    .e-ribbon .e-contextul li a {
        text-decoration: none;
        border-bottom-width: 0;
        padding: 8px 12px 5px;
        outline: 0 none;
        color: inherit;
    }

    .e-ribbon .e-expander:before {
        content: "\e73d";
        font-size: 9px;
        left: -1px;
        position: relative;
        top: -2px;
    }

    .e-ribbon .e-galleryup:before {
        content: "\e771";
        font-size: 7px;
        margin-left: 3px;
        margin-top: 7px;
    }

    .e-ribbon .e-gallerydown:before {
        content: "\e770";
        font-size: 7px;
        margin-left: 3px;
        margin-top: 5px;
        position: absolute;
    }

    .e-ribbon .e-galleryexpand:before {
        content: "\e7cd";
        font-size: 6px;
        margin-left: 3px;
        margin-top: 7px;
    }

    .e-ribbon .e-ribbonresize:before {
        content: "\e770";
        font-size: 7px;
    }

    .e-ribbon .e-menu ul li {
        min-width: 100px;
    }

    .e-ribbon .e-menu li ul > .e-list > a, .e-ribbon .e-menu li ul .e-list > span {
        padding: 3px 18px 3px 28px;
        height: inherit;
        white-space: nowrap;
        font-family: Segoe UI;
    }

    .e-ribbon.e-js .e-gallerymenu a {
        font-family: Segoe UI;
    }

    .e-ribbon .e-menu.e-horizontal > .e-list > ul::after {
        border-style: none;
    }

    .e-ribbon.e-js .e-header .e-expandcollapse span {
        margin: 0;
    }

    .e-ribbon .e-header > .e-bottom-line.e-active,
    .e-ribbon .e-header > .e-bottom-line.e-active:hover {
        padding-bottom: 0;
    }
	.e-ribbon.e-js .e-header .e-tab.e-bottom-line.e-active, .e-ribbon.e-js .e-header .e-tab.e-bottom-line.e-active:hover
	{
		border-bottom: 0 none !important;
	}
    .e-ribbon .e-bottom-line {
        border: 0;
        margin-right: 0;
    }

    .e-ribbon .e-header li a {
        padding: 4px 14px;
        border: 1px solid transparent;
    }

    .e-ribbon .e-header > .e-apptab .e-menu {
        border: 0;
    }

    .e-ribbon .e-header .e-apptab .e-menu > li > a {
        font-size: 16px;
        border-top: 0! important;
        font-family: Segoe UI;
		border: 1px solid transparent;
    }

    .e-ribbon .e-header > .e-apptab {
        opacity: 1;
        filter: alpha(opacity=100);
    }

    .e-ribbon .e-header .e-backstagetab {
        padding-top: 0px;
        align-self: flex-end;
    }

    .e-ribbon .e-header > li {
        display: inline-table;
        padding-top: 0px;
        margin-top: 20px !important;
        margin-right: 2px;
        border-right: 0;
    }

    .e-ribbon .e-header .e-contextli, .e-ribbon .e-header .e-contextliset {
        padding-top: 0px;
        margin-top: 17px !important;
    }

    .e-ribbon.e-js .e-header .e-active.e-tab a, .e-ribbon.e-js .e-header .e-active.e-contextualtabset a {
        border: 1px solid;
        border-bottom-color: transparent;
        border-bottom-width: 4px;
    }

    .e-ribbon .e-header .e-menu .e-list {
        padding-top: 0;
    }

    .e-ribbon .e-header .e-contextualtab, .e-ribbon .e-header .e-contextualtabset {
        padding-top: 0;
        font-size: 16px;
        border-right: 0px;
    }

    .e-ribbon .e-header .e-contextli ul, .e-ribbon .e-header .e-contextliset ul {
        margin-left: 3px;
        border-top: 3px solid;
    }

    .e-ribbon .e-header .e-contextli ul,
    .e-ribbon .e-header .e-contextliset ul {
        margin-left: 10px;
        padding: 0;
    }

    .e-ribbon .e-header .e-contextli ul, .e-ribbon .e-header .e-contextliset ul {
        margin-left: 3px;
    }

    .e-ribbon .e-header .e-contextli {
        margin-bottom: -1px;
    }

    .e-ribbon .e-header > li {
        height: 33px;
    }

    .e-ribbon .e-tooltipdiv {
        position: absolute;
        z-index: 1000001;
        width: 170px;
        border-width: 0 1px 1px 1px;
        border-style: solid;
    }

    .e-ribbon .e-js.e-colorSplit.e-splitbutton.e-split-btn {
        border: 1px solid;
        border-right: none;
    }

    .e-ribbon .e-split-btn.e-drp-btn.e-rht-btn {
        border: 1px solid;
    }

    .e-ribbon .e-tooltipdivwithimg {
        width: auto;
    }

    .e-ribbon .e-tooltipdiv .e-tooltiptitle {
        font-family: segoe ui;
        margin-left: 10px;
        margin-right: 10px;
        margin-top: 3px;
        font-size: 14px;
    }

    .e-ribbon .e-tooltipdiv .e-tooltipdesc {
        margin: 10px;
    }

    .e-ribbon .e-tooltipdiv .e-tooltipcontent {
        font-family: segoe ui;
        width: 150px;
        line-height: 1.42857;
        margin: 0;
        padding: 0;
    }

    .e-ribbon .e-tooltipdiv .e-tooltipcntwithimg {
        display: table-cell;
        vertical-align: top;
        padding: 0 0 10px 10px;
        font-family: segoe ui;
        width: 170px;
    }

    .e-ribbon .e-tooltipdiv .e-tooltipimg {
        display: table-cell;
    }

    .e-ribbon .e-resizecontent {
        overflow: hidden;
        white-space: normal;
    }

    .e-ribbon .e-header .e-apptab .e-menu .e-arrows {
        margin-top: 0px;
        padding-top: 0px;
    }

    .e-ribbon .e-header .e-apptab .e-menu > li:first-child > a > .e-arrows {
        margin-top: 0px;
        padding-top: 3px;
    }

    .e-ribbon .e-content .e-split-btn, .e-ribbon .e-header .e-apptab .e-menu {
        white-space: normal;
    }

    .e-ribbon .e-content .e-split-btn,
    .e-ribbon .e-header .e-apptab .e-menu {
        white-space: normal;
    }

    .e-ribbon .e-ribbonbackstagepage {
        border: 1px solid;
        position: absolute;
        z-index: 10002;
        top: 0;
    }

    .e-ribbon .e-backstageheader {
        display: table-cell;
        list-style: none;
        padding: 0;
        vertical-align: top;
    }

    .e-ribbon .e-backstageli {
        padding: 8px 15px 8px 20px;
        text-align: left;
    }

    .e-ribbon .e-backstageseparator {
        height: 1px;
        margin: 5px 8px 5px 20px;
    }

    .e-ribbon .e-backstageli a {
        background: transparent;
        text-decoration: none;
        font-size: 12px;
        outline: none;
        position: relative;
        top: -1px;
        white-space: nowrap;
    }

    .e-ribbon .e-backstagecontent {
        display: table-cell;
        padding: 10px 5px 5px 40px;
        white-space: normal;
    }

    .e-ribbon .e-backstagetopicon {
        position: relative;
        left: 16px;
        width: 36px;
        height: 100px;
        vertical-align: middle;
        display: table-cell;
    }

    .e-ribbon .e-backstagetopicon span:before {
        content: "\e778";
        font-family: "ej-webfont";
        font-size: 35px;
    }

    .e-ribbon.e-rtl .e-backstagetopicon span:before {
        content: "\e80c";
        font-family: "ej-webfont";
        font-size: 35px;
    }

    .e-ribbon .e-backstagetopicon:hover, .e-ribbon .e-apptab .e-apptabanchor:hover, .e-ribbon .e-backstageli a:hover, .e-ribbon .e-backstagebutton:hover {
        cursor: default;
    }

    .e-ribbon .e-header > .e-apptab .e-apptabanchor {
        padding-bottom: 6px;
    }

    .e-ribbon .e-backstagebutton {
        font-size: 12px;
    }

    .e-ribbon .e-rbntooltipshadow {
        box-shadow: 0 0 3px rgba(0, 0, 0, 0.4);
    }

    .e-ribbon .e-ribbonbackstagepage .e-backstagetitlecontent {
        display: table-cell;
        vertical-align: middle;
        font-size: 30px;
        padding-left: 40px;
    }

    .e-ribbon .e-ribbonbackstagepage .e-backstagetopcontent {
        display: table-cell;
    }

    .e-ribbon .e-rarrowup-2x, .e-ribbon .e-ribbonpinicon {
        background-color: transparent;
        background-image: none;
        float: left;
        height: 16px;
        padding: 3px;
        width: 16px;
    }

    .e-ribbon .e-ribbonpinicon:before {
        font-family: 'ej-webfont';
        content: "\e785";
        font-size: 10px;
        left: 2px;
        position: relative;
        top: 3px;
    }

    .e-ribbon.e-rbnwithqat .e-rbnquickaccessbar {
        height: 36px;
    }

    .e-ribbon.e-rbnwithqat .e-splitbtnqatdiv, .e-ribbon.e-rbnwithqat .e-qatooldiv, .e-ribbon.e-rbnwithqat .e-qaresizebtndiv {
        display: table-cell;
        padding: 3px 3px 2px 3px;
    }

    .e-ribbon.e-rbnwithqat .e-qatexpand:before {
        content: "\e7cd";
        font-size: 6px;
        height: auto;
        width: auto;
    }

    .e-ribbon.e-rbnwithqat .e-rbnqatmenu {
        border: 1px solid;
        position: relative;
        padding: 3px;
        z-index: 100001;
        display: table;
        width: auto;
    }

    .e-ribbon.e-rbnwithqat .e-qaresizediv {
        border: 1px solid;
        position: absolute;
        z-index: 100001;
    }

    .e-ribbon.e-rbnwithqat .e-rbnqatmenu .e-removemenuli p {
        display: inline-block;
        padding-left: 15px;
    }

    .e-ribbon.e-rbnwithqat .e-rbnqatmenu .e-qatmenuli p {
        margin-bottom: 0px;
        margin-top: 0px;
    }

    .e-ribbon.e-rbnwithqat .e-rbnqatmenu .e-removemenuli:before {
        content: "\e7cf";
        display: inline-block;
        font-family: "ej-webfont";
        font-size: 9px;
        padding-left: 7px;
        position: relative;
        bottom: 1px;
    }

    .e-ribbon.e-rbnwithqat .e-rbnqatmenu div {
        padding: 3px;
    }

    .e-ribbon.e-rbnwithqat .e-qatmorecommands, .e-ribbon.e-rbnwithqat .e-rbnshowbelow, .e-ribbon.e-rbnwithqat .e-rbnshowabove, .e-ribbon.e-rbnwithqat .e-addmenuli {
        padding-left: 33px;
    }

    .e-ribbon.e-rbnwithqat .e-qatmenuli {
        list-style: none;
        margin: 3px;
        cursor: default;
        text-transform: capitalize;
    }

    .e-ribbon.e-rbnwithqat .e-qatmenuli.e-rbnshowbelow {
        text-transform: none;
    }

    .e-ribbon.e-rbnwithqat .e-qatmenuli.e-rbnshowabove {
        text-transform: none;
    }

    .e-ribbon.e-rbnwithqat .e-qatseparator {
        height: 1px;
        list-style: none;
        text-align: center;
        cursor: default;
        margin-left: 36px;
    }

    .e-ribbon.e-rbnwithqat .e-qaresizebtnicon:before {
        content: "\e7ce";
        font-size: 5px;
        padding-top: 35%;
    }

    .e-ribbon.e-rbnwithqatabove.e-js > .e-header {
        height: 68px;
    }

    .e-ribbon.e-rbnwithqatabove .e-header > li {
        padding-top: 0px;
        margin-top: 35px !important;
    }

    .e-ribbon.e-rbnwithqat .e-rbnquickaccessbar.e-rbnabove {
        position: absolute;
        z-index: 10001;
        left: 1px;
        top: 1px;
    }

    .e-ribbon.e-grpdivhide, .e-ribbon .e-resdivshow {
        overflow: hidden;
    }

    .e-ribbon.e-rtl.e-grpdivhide {
        border-right: 0 !important;
    }

    .e-ribbon-show {
        display: block !important;
    }

    .e-ribbon .e-responsiveqat,
    .e-ribbon .e-groupresponsive,
    .e-ribbon .e-ribresmenu,
    .e-ribbon .e-responsivetabheader,
    .e-ribbon .e-resbackstage {
        display: none !important;
    }

    .e-ribbon .e-responsivebackstagecontent {
        display: none;
    }
    /*------------------------------Ribbon End-------------------------------*/
}

.mixin(@widget) when (@widget = fileexplorer), (@widget = none) {

    .e-fileexplorer {
        line-height: 1.428571429;
    }

    .e-fileexplorer, .e-fileexplorer .e-treeview .e-fe-node-hover, .e-fileexplorer input, input.e-fe-dialog-text, .e-fe-toolbar.e-responsive-toolbar input {
        border: 1px solid;
    }

    .e-fileexplorer .e-toolbar {
        border: 0 none;
    }

    .e-fileexplorer .e-treeview .e-fe-node-hover {
        border-image: initial;
        cursor: pointer;
    }

    .e-fileexplorer .e-scroller .e-vscroll .e-icon, .e-fileexplorer .e-scroller .e-hscroll .e-icon {
        color: transparent;
    }

    .e-fileexplorer .e-scroller .e-vscroll, .e-fileexplorer .e-scroller .e-hscroll, .e-fileexplorer .e-scroller .e-vhandlespace, .e-fileexplorer .e-switchView .e-button {
        background: transparent;
    }

    .e-fileexplorer .e-statusbar .e-itemStaus, .e-fileexplorer input, input.e-fe-dialog-text, .e-fileexplorer .e-treeview .e-text, .e-fe-toolbar.e-responsive-toolbar input {
        font-size: 12px;
    }

    .e-fileexplorer .e-grid .e-headercelldiv, .e-fileexplorer .e-grid .e-gridcontent tr, .e-fileexplorer .e-tileview .e-tilenode .e-name {
        font-size: 12px;
        font-weight: normal;
    }

    .e-fileexplorer .e-splitter, .e-fileexplorer .e-grid .e-headercontent {
        border: 0 none;
    }

    .e-fileexplorer .e-splitter .e-tileview, .e-fileexplorer .e-splitter .e-pane {
        overflow: visible;
    }

    .e-fileexplorer .e-splitter .e-splitbar.e-h-bar {
        width: 9px;
        border-width: 0px 0px 0px 1px;
    }

    .e-fileexplorer .e-splitter .e-splitbar .e-icon {
        visibility: hidden;
    }

    .e-fileexplorer .e-splitbar.e-split-divider {
        position: absolute;
    }

    .e-imageViewer > img {
        width: 100%;
        height: 100%;
    }

    .e-fileexplorer .e-grid .e-rowcell {
        text-overflow: ellipsis;
    }

    .e-imageViewer-wrap .e-vscrollbar {
        display: none;
    }

    .e-fileexplorer .e-addressBar {
        width: 260px;
        text-indent: 27px;
    }

    .e-fileexplorer .e-addressBar, .e-fe-toolbar .e-addressBar, .e-fileexplorer .e-searchBar, .e-fe-toolbar .e-searchBar {
        padding: 0;
        margin: 0;
    }

    .e-fe-toolbar.e-responsive-toolbar .e-addressBar {
        width: 150px;
    }

    .e-fileexplorer input, input.e-fe-dialog-text, .e-fe-toolbar.e-responsive-toolbar input {
        height: 22px;
        line-height: 20px;
        text-indent: 9px;
        font-family: inherit;
    }

    .e-fileexplorer .e-searchBar::-webkit-input-placeholder{
		text-indent: 9px;
	}

    .e-dialog.e-rtl .e-fe-dialog .e-fe-dialog-label, .e-dialog.e-rtl .e-fe-table tr td, .e-dialog.e-rtl .e-fe-table table tr .e-readonly,
    .e-fileexplorer.e-rtl .e-tilenode .e-file-name, .e-fileexplorer.e-rtl .e-tilenode .e-file-type, .e-fileexplorer.e-rtl .e-tilenode .e-file-size,
    .e-fileexplorer.e-rtl .e-grid .e-rowcell, .e-fileexplorer.e-rtl .e-treeview .e-text {
        direction: ltr;
    }

    .e-fe-dialog .e-fe-table table tr .e-readonly {
        text-indent: 0px;
    }

    .e-fileexplorer.e-rtl .e-tileInfo-view .e-tilenode .e-file-name, .e-fileexplorer.e-rtl .e-tileInfo-view .e-tilenode .e-file-type, .e-fileexplorer.e-rtl .e-tileInfo-view .e-tilenode .e-file-size {
        text-align: right;
    }

    .e-fileexplorer .e-toolbar > ul > li .e-splitbutton.e-btn {
        vertical-align: top;
    }

    .e-fileexplorer .e-switchView .e-btn.e-btn-normal {
        height: auto;
    }

    .e-fileexplorer.e-rtl .e-grid .e-chkbox-wrap, .e-fileexplorer .e-tileInfo-view.e-rtl .e-name.e-name-in-wrap,
    .e-fileexplorer.e-rtl .e-grid .e-rowcell.e-grid-image, .e-fileexplorer.e-rtl .e-grid .e-rowcell.e-col-check {
        direction: rtl;
    }

    .e-fileexplorer .e-toolbar.e-toolbarspan {
        width: auto;
    }

    .e-fileexplorer .e-ul.e-horizontal, .e-fe-toolbar.e-responsive-toolbar .e-ul.e-horizontal {
        margin-top: 4px;
        margin-bottom: 4px;
        padding-left: 2px;
        padding-right: 2px;
    }

    .e-fileexplorer .e-treeview > ul:first-child {
        margin-top: 4px;
    }

    .e-fileexplorer .e-treeview-wrap > .e-ul {
        overflow: visible;
    }

    .e-fileexplorer .e-tree-wrapper .e-widget.e-scrollbar, .e-fileexplorer .e-tree-wrapper .e-widget.e-scrollbar [class^="e-"] {
        box-sizing: border-box;
    }

    .e-fileexplorer .e-statusbar .e-itemStaus {
        margin: 4px 8px 0 8px;
    }

    .e-rtl.e-fileexplorer .e-statusbar .e-itemStaus {
        direction: initial;
    }

    .e-fileexplorer .e-toolbar .e-addressbar-foldericon, .e-fe-toolbar.e-responsive-toolbar .e-addressbar-foldericon {
        margin-left: 4px;
        margin-top: 4px;
    }

    .e-fileexplorer .e-uploadbox .e-selectpart, .e-fileexplorer .e-uploadbox {
        border: 0 none;
    }

    .e-fileexplorer .e-uploadbox .e-selectpart {
        height: auto;
        width: auto;
    }

    .e-fileexplorer .e-uploadbox.e-widget {
        border-radius: 0px;
    }

    .e-fileexplorer .e-uploadbox.e-dialog .e-titlebar {
        padding: .25em .25em .25em 1em;
    }

    .e-fileexplorer .e-uploadbox.e-dialog .e-header {
        font-size: 16px;
    }

    .e-fileexplorer .e-uploadbox.e-dialog .e-titlebar .e-title {
        margin-left: 0;
        top: 0;
    }

    .e-fileexplorer .e-uploadbox.e-dialog .e-titlebar > .e-dialog-icon .e-close {
        margin: -9px 0px 0px -1px;
    }

    .e-fileexplorer .e-uploadbox.e-dialog .e-dialog-icon {
        top: 0;
        right: 0;
    }

    .e-fileexplorer .e-uploadbox.e-dialog .e-file-upload {
        float: right;
        width: 100%;
    }

    .e-fileexplorer .e-uploadbox.e-dialog .e-file-upload > .e-btn {
        left: 0;
        height: 30px;
        float: right;
        margin: 0 9px 0 9px;
    }

    .e-fileexplorer .e-uploadbox.e-rtl.e-dialog .e-file-upload {
        float: left;
    }

    .e-fileexplorer .e-uploadbox.e-rtl.e-dialog .e-file-upload > .e-btn {
        float: left;
        margin-left: 11px;
        margin-right: 7px;
    }

    .e-fileexplorer .e-uploadbox.e-dialog .e-head-content {
        display: none;
    }

    .e-fileexplorer .e-uploadbox .e-file-list .e-file-progress {
        width: 180px;
    }

    .e-fileexplorer .e-uploadbox .e-file-list .e-file-size {
        margin-left: 3px;
        min-width: 135px;
    }

    .e-fileexplorer .e-uploadbox .e-file-list .e-file-percentage {
        width: 130px;
        margin-left: 3px;
    }

    .e-fileexplorer .e-uploadbox .e-file-list .e-file-percentage .e-file-progress-bar {
        width: auto;
    }

    .e-fileexplorer .e-uploadbox .e-file-list .e-action-perform {
        margin-left: 17px;
    }

    .e-fileexplorer .e-uploadbox.e-rtl .e-file-list .e-file-size, .e-fileexplorer .e-uploadbox.e-rtl .e-file-list .e-file-percentage {
        margin-left: 0;
    }

    .e-fileexplorer .e-uploadbox.e-rtl .e-file-list .e-action-perform {
        margin-left: 0px;
        margin-right: 23px;
    }

    .e-fileexplorer .e-uploadbox .e-ul > li {
        height: 54px;
    }

    .e-fileexplorer .e-uploadbox .e-file-list {
        height: 53px;
        top: 0;
    }

    .e-fe-dialog.e-dialog.e-dialog-wrap {
        border: none;
    }

    .e-fileexplorer .e-tileview {
        margin-bottom: 0px;
        overflow: initial;
        margin-left: 10px;
        margin-top: 4px;
        margin-right: 10px;
    }

    .e-fileexplorer .e-grid {
        height: inherit;
    }

    .e-fileexplorer .e-fileurl > input {
        width: 100%;
        max-width: 900px;
    }

    .e-fileexplorer .e-fileurl {
        width: 343px;
    }

    .e-fileexplorer .e-filename {
        width: 206px;
    }

    .e-fileexplorer .e-filename > input {
        width: 100%;
    }

    .e-fileexplorer .e-filewidth > input, .e-fileexplorer .e-fileheight > input {
        width: 60px;
    }

    .e-fileexplorer .e-grid {
        border: 0 none;
    }

    .e-fileexplorer .e-gridheader .e-headercell .e-headercelldiv {
        font-weight: bold;
    }

    .e-fileexplorer .e-statusbar {
        overflow: hidden;
        height: 24px;
        border-top: 1px solid;
    }

    .e-fileexplorer .e-grid .e-gridheader {
        border-bottom: 1px solid;
        border-left: 0 none;
        border-top: 0 none;
        border-right: 0 none;
    }

    .e-fileexplorer .e-grid .e-headercell {
        border-style: none;
    }

    .e-fileexplorer .e-tilenode {
        margin: 7px 7px 3px 7px;
        list-style: none;
        display: inline-block;
        vertical-align: top;
        padding: 0 0 4px 0;
        width: 104px;
        border: 1px solid transparent;
    }

    .e-fileexplorer .e-addNewFolder.e-button {
        margin-left: 4px;
        padding-right: 10px;
        height: 25px;
        background-color: transparent;
        border: none;
        float: left;
    }

    .e-fileexplorer .e-switchGridView.e-button {
        background: transparent;
        border: none;
    }

    .e-fileexplorer .e-swithListView.e-button {
        background: transparent;
        border: none;
    }

    .e-fileexplorer .e-thumbImage {
        padding: 4px;
        display: block;
        max-width: 96px;
        max-height: 88px;
        text-align: center;
        width: auto;
        height: auto;
        margin-left: auto;
        margin-right: auto;
    }

    .e-fileexplorer .e-name {
        text-align: center;
        word-wrap: break-word;
    }

    .e-fileexplorer .e-addressbar-foldericon {
        position: absolute;
    }

    .e-fileexplorer .e-h-arrow {
        z-index: 10001;
    }

    .e-fileexplorer .e-responsive-toolbar {
        z-index: 1;
    }

    .e-rtl.e-fileexplorer .e-grid .e-headercelldiv {
        text-align: right;
    }

    .e-fileexplorer .e-statusbar .e-switchView {
        margin: 0 8px 0 0;
    }

    .e-rtl.e-fileexplorer .e-statusbar .e-switchView {
        margin: 0 0 0 8px;
    }

    .e-rtl.e-fileexplorer .e-toolbar > .e-horizontal.e-ul, .e-rtl.e-fileexplorer .e-statusbar .e-itemStaus,
    .e-fileexplorer .e-statusbar .e-switchView, .e-rtl.e-fileexplorer .e-toolbar > .e-horizontal.e-ul > li,
    .e-fileexplorer .e-toolbar .e-ul-searchBar, .e-fileexplorer .e-tileInfo-view.e-rtl .e-align,
    .e-fileexplorer.e-rtl .e-treeview .e-fe-folder {
        float: right;
    }

    .e-fileexplorer .e-statusbar .e-itemStaus, .e-rtl.e-fileexplorer .e-statusbar .e-switchView,
    .e-rtl.e-fileexplorer .e-toolbar .e-horizontal.e-ul.e-ul-searchBar {
        float: left;
    }

    .e-fileexplorer .e-tileview, .e-fileexplorer .e-toolbar .e-feItem-Addressbar, .e-fileexplorer .e-toolbar .e-feItem-Searchbar,
    .e-fe-toolbar.e-responsive-toolbar .e-feItem-Addressbar, .e-fe-toolbar.e-responsive-toolbar .e-feItem-Searchbar {
        padding-left: 0px;
        padding-right: 0px;
    }

    .e-fileexplorer-toolbar-icon, .e-fileexplorer .e-tree-foldericon, .e-fileexplorer .e-addressbar-foldericon {
        height: 22px;
        width: 22px;
        font-family: 'ej-webfont';
        font-size: 18px;
        padding-top: 2px;
        text-align: center;
    }

    .e-fileexplorer .e-tree-foldericon {
        height: 18px;
        width: 14px;
        padding-right: 4px;
    }

    .e-rtl.e-fileexplorer .e-tree-foldericon {
        padding-right: 0;
        padding-left: 4px;
        float: right;
    }

    .e-fileexplorer .e-addressbar-foldericon, .e-fileexplorer .e-tree-foldericon {
        font-size: 14px;
    }

    .e-fileexplorer .e-addressbar-foldericon:before, .e-fileexplorer .e-tree-foldericon:before, .e-fileexplorer .e-plus ~ .e-tree-foldericon:before {
        content: "\e768";
    }

    .e-fileexplorer .e-minus ~ .e-tree-foldericon:before, .e-fileexplorer-toolbar-icon.Open:before, .e-fileexplorer-toolbar-icon.OpenFolderLocation:before {
        content: "\e769";
    }

    .e-fileexplorer-toolbar-icon.Delete:before {
        content: "\e708";
    }

    .e-fileexplorer-toolbar-icon.NewFolder:before {
        content: "\e76a";
    }

    .e-fileexplorer-toolbar-icon.Back:before {
        content: "\e773";
    }

    .e-fileexplorer-toolbar-icon.Forward:before {
        content: "\e774";
    }

    .e-fileexplorer-toolbar-icon.Upward:before {
        content: "\e74f";
    }

    .e-fileexplorer-toolbar-icon.Back:hover:before {
        content: "\e775";
    }

    .e-fileexplorer-toolbar-icon.Forward:hover:before {
        content: "\e776";
    }

    .e-fileexplorer-toolbar-icon.Cut:before {
        content: "\e680";
    }

    .e-fileexplorer-toolbar-icon.Copy:before {
        content: "\e646";
    }

    .e-fileexplorer-toolbar-icon.Paste:before {
        content: "\e645";
    }

    .e-fileexplorer-toolbar-icon.Details:before, .e-fileexplorer-toolbar-icon.Getinfo:before {
        content: "\e777";
    }

    .e-fileexplorer-toolbar-icon.Upload:before {
        content: "\e678";
    }

    .e-fileexplorer-toolbar-icon.Refresh:before {
        content: "\e677";
    }

    .e-fileexplorer-toolbar-icon.Rename:before {
        content: "\e69c";
    }

    .e-fileexplorer-toolbar-icon.Download {
        font-size: 26px;
        top: -3px;
        position: relative;
    }

    .e-disable .e-fileexplorer-toolbar-icon.Download {
        filter: alpha(opacity=35);
    }

    .e-fileexplorer-toolbar-icon.Download:before {
        content: "\e61f";
    }

    .e-fileexplorer-toolbar-icon.SortBy:before ,
    .e-icon.e-fe-sortby:before {
        content: "\e823";
        width: 100%;
        text-indent: 1px;
        height: 100%;
        margin-top: 2px;
        margin-left: 1px;
    }
    .e-fileexplorer .e-tile-wrapper .e-thumbImage.e-fe-icon {
        width: 67px;
        height: 67px;
    }

    .e-fileexplorer .e-tile-wrapper.e-js, .e-fileexplorer.e-js, .e-fileexplorer .e-gridcontent,
    .e-fileexplorer .e-statusbar, .e-fileexplorer .e-statusbar .e-switchView .e-button, .e-fileexplorer .e-toolbar.e-focus,
    .e-fileexplorer .e-toolbar .e-tool-input:focus, .e-fe-toolbar.e-responsive-toolbar .e-tool-input:focus {
        outline: none;
        box-shadow: none;
    }

    .e-fe-dialog input.e-ejinputtext:focus {
        outline: none;
    }

    .e-fe-dialog-btn, .e-fe-dialog-centerbtn, .e-fe-dialog-text {
        margin-top: 10px;
    }

    .e-fe-dialog-text {
        max-width: 310px;
        width: 310px;
    }

    .e-fe-dialog-btn {
        padding-bottom: 4px;
        float: right;
        width: 50%;
    }

    .e-fe-dialog-centerbtn {
        padding: 1px;
        width: 70%;
        float: right;
    }

    .e-rtl .e-fe-dialog-centerbtn {
        width: 70%;
        float: left;
    }

    .e-fe-btn-ok, .e-fe-btn-skip,
    .e-fe-btn-cancel {
        width: 45%;
        height: 27px;
    }

    .e-fe-dialog-centerbtn .e-fe-btn-ok, .e-fe-dialog-btn .e-fe-btn-ok, .e-fe-dialog-centerbtn .e-fe-btn-skip, .e-fe-dialog-btn .e-fe-btn-skip {
        margin-left: 0px;
        margin-right: 14px;
    }

    .e-rtl .e-fe-dialog-centerbtn .e-fe-btn-ok, .e-rtl .e-fe-dialog-btn .e-fe-btn-ok, .e-rtl .e-fe-dialog-centerbtn .e-fe-btn-skip, .e-rtl .e-fe-dialog-btn .e-fe-btn-skip {
        margin-left: 14px;
        margin-right: 0px;
    }

    .e-fe-dialog.e-icon.e-close {
        float: right;
        margin: 4px 4px 0 0;
    }

    .e-rtl .e-fe-dialog.e-icon.e-close {
        margin: 4px 0 0 4px;
    }

    .e-fe-dialog.e-icon.e-close:before {
        padding-top: 2px;
    }

    .e-rtl .e-fe-dialog.e-icon.e-close, .e-rtl .e-fe-dialog-btn {
        float: left;
    }

    .e-fe-dialog-centerbtn, .e-fileexplorer .e-grid .emptyrecord,
    .e-fe-center {
        text-align: center;
    }

    .e-fileexplorer .e-tileInfo-view .e-align {
        float: left;
    }

    .e-fileexplorer .e-tileInfo-view .e-tilenode {
        padding: 0px;
        width: 252px;
        height: 60px;
        overflow: hidden;
    }

    .e-fileexplorer .e-tileInfo-view .e-name {
        display: table-cell;
        vertical-align: middle;
        height: 60px;
        width: 112px;
        padding: 0px 5px;
        word-wrap: break-word;
    }

    .e-fileexplorer .e-tileInfo-view .e-name-wrap {
        display: table;
        height: 60px;
        width: 184px;
        overflow: hidden;
    }

    .e-fileexplorer .e-tileInfo-view .e-name.e-name-in-wrap {
        vertical-align: middle;
        text-align: inherit;
        display: table-cell;
        word-wrap: break-word;
    }

    .e-fileexplorer .e-tileInfo-view .e-name.e-name-in-wrap p {
        margin: 0;
    }

    .e-fileexplorer .e-tileInfo-view .e-thumb-image.e-image .e-thumbImage {
        max-height: 52px;
        max-width: 58px;
    }

    .e-fileexplorer .e-tile-wrapper.e-tileInfo-view .e-thumb-image.e-image img.e-thumbImage {
        height: auto;
        width: auto;
    }

    .e-fileexplorer .e-tileInfo-view .e-thumbImage {
        padding: 4px;
        display: block;
        max-width: 59px;
        margin: 0;
    }

    .e-fileexplorer .e-tileInfo-view .e-tilenode .e-image {
        display: table-cell;
        vertical-align: middle;
        width: auto;
        padding-top: 0px;
        height: 60px;
    }

    .e-fileexplorer .e-tileInfo-view .e-name-wrap .e-name.e-name-in-wrap div {
        width: 168px;
    }

    .e-fileexplorer .e-tileview .e-name-wrap .e-name.e-name-in-wrap div {
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }

    .e-fileexplorer .e-tileInfo-view .e-file-name {
        font-weight: bold;
    }

    .e-fileexplorer .e-tile-wrapper.e-tileInfo-view .e-thumbImage {
        height: 52px;
        width: 60px;
    }

    .e-fileexplorer .e-tileInfo-view span.e-file-type, .e-fileexplorer .e-tileInfo-view span.e-file-size {
        font-size: 13px;
    }

    .e-fileexplorer .e-fe-view-icon:before {
        content: "\e76b";
        font-size: 16px;
        width: 22px;
        height: 100%;
    }

    .e-fe-activeicon:before {
        content: "\e657";
        width: 100%;
        text-indent: 1px;
        height: 100%;
        margin-top: 2px;
        margin-left: 1px;
    }

    .e-fe-ascending:before {
            content: "\e825";
            width: 100%;
            text-indent: 1px;
            height: 100%;
            margin-top: 2px;
            margin-left: 1px;
    }

    .e-fe-descending:before {
         content: "\e824";
         width: 100%;
         text-indent: 1px;
         height: 100%;
         margin-top: 2px;
         margin-left: 1px;
    }

    .e-fileexplorer .e-toolbar > ul > li, .e-fe-toolbar.e-toolbar > ul > li {
        padding: 0px;
    }

    .e-fileexplorer .e-treeview > ul {
        margin: 0px;
    }

    .e-fileexplorer .e-toolbar .e-searchBar {
        width: 138px;
    }

    .e-dialog .e-fe-table tr td {
        padding: 4px 0px 4px 0px;
        word-break: break-all;
    }

    .e-dialog .e-fe-table tr td:first-child {
        min-width: 60px;
        padding-right: 14px;
        width: 25%;
    }

    .e-rtl.e-dialog .e-fe-table tr td:first-child {
        padding-left: 14px;
        padding-right: 0px;
    }

    .e-fileexplorer .e-toolbar > ul > li div.e-item-overlay {
        opacity: 0;
        filter: alpha(opacity=0);
    }

    .e-fe-dialog.e-dialog > .e-titlebar {
        padding: .3em .25em .25em 1em;
    }

    .e-fileexplorer .e-uploadbox .e-scrollbar.e-hscrollbar {
        top: 0;
    }

    .e-fe-dialog.e-dialog.e-rtl > .e-titlebar, .e-fileexplorer .e-uploadbox.e-dialog.e-rtl .e-titlebar {
        padding: .3em 1em .25em .25em;
    }

    .e-fileexplorer .e-uploadbox.e-widget .e-selectpart.e-select {
        border: none;
    }

    .e-fileexplorer .e-uploadbox .e-file-upload {
        padding: 0;
    }

    .e-fileexplorer .e-uploadbox .e-file-upload .e-action-container {
        margin: 0 0px 8px auto;
        padding-top: 8px;
    }

    .e-fileexplorer .e-uploadbox .e-action-container {
        width: 228px;
    }

    .e-fileexplorer .e-uploadbox.e-rtl .e-action-container {
        width: 220px;
    }

    .e-fileexplorer .e-uploadbox.e-rtl .e-file-upload .e-action-container {
        margin: 0px auto 8px 0;
    }

    .e-fileexplorer .e-uploadbox .e-uploadbtn, .e-fileexplorer .e-uploadbox .e-uploadclosebtn {
        margin-left: 8px;
    }

    .e-dialog.e-imageViewer-wrap .e-titlebar .e-title {
        overflow: hidden;
        text-overflow: ellipsis;
        width: 90%;
        float: left;
    }

    .e-dialog.e-rtl.e-imageViewer-wrap .e-titlebar .e-title {
        float: right;
    }

    .e-menu > .e-list.e-fe-separator {
        border-bottom: 1px solid;
    }

    .fe-context-menu.e-menu li.e-list > a > span {
        top: 0px;
    }

    .fe-context-menu.e-menu li.e-list > a {
        padding-left: 30px;
    }

    .fe-context-menu.e-menu.e-rtl li.e-list > a {
        padding-right: 32px;
    }

    .fe-context-menu.e-menu.e-context {
        width: auto;
    }

    .e-fileexplorer .e-tilenode {
        cursor: pointer;
    }

    .e-fe {
        padding: 5px;
    }

    .e-fe .e-fe-icon, .e-fe .e-thumbImage.e-fe-icon {
        background-repeat: no-repeat;
        background-image: url('@{font-path}/tools/file_icons.png');
        width: 70px;
        height: 74px;
        display: block;
        margin-left: -2px;
    }

    .e-fe .e-fe-folder {
        background-position: -21px -1480px;
    }

    .e-fe .e-fe-images {
        background-position: -21px -325px;
    }

    .e-fe .e-thumbImage {
        width: 65px;
        height: 65px;
    }

    .e-fe .e-count {
        position: absolute;
        top: 30px;
        left: 26px;
        color: white;
        background: blue;
        min-width: 14px;
        text-align: center;
        border: 1px solid white;
        font-size: 11px;
    }

    .e-fileexplorer .e-treeview-wrap .e-item div > span {
        margin-right: 0px;
        display: inline-table;
        vertical-align: middle;
    }

    .e-fileexplorer .e-grid tr td:first-child, .e-fileexplorer.e-rtl .e-grid tr td.e-last-rowcell {
        border-left: 1px solid transparent;
        border-right: 0;
    }

    .e-fileexplorer .e-grid tr td.e-last-rowcell, .e-fileexplorer.e-rtl .e-grid tr td:first-child {
        border-right: 1px solid transparent;
        border-left: 0;
    }

    .e-fileexplorer .e-grid .e-rowcell {
        border-top: 1px solid transparent;
        border-bottom: 1px solid transparent;
        border-width: 1px 0;
        padding: 0.4em;
    }

    .e-fileexplorer .e-grid .e-gridcontent tr:first-child td {
        border-top: 1px solid transparent;
    }

    .e-fe-dialog.e-dialog > .e-titlebar .e-dialog-icon {
        right: 0;
    }

    .e-fileexplorer .e-blur {
        opacity: 0.6;
        filter: alpha(opacity= 60);
    }

    .e-fileexplorer .e-tileview .e-tilenode .e-name, .e-fileexplorer .e-treeview .e-text,
    .e-dialog.e-imageViewer-wrap .e-title, .e-fe-dialog.e-content, .e-fileexplorer .e-statusbar .e-itemStaus {
        white-space: pre-wrap;
    }

    .e-fe-dialog.e-dialog .e-widget-content {
        padding: 0.5em 1.1em;
        word-wrap: break-word;
    }

    .e-fe-dialog.e-dialog, .e-fileexplorer .e-uploadbox .e-file-cancel, .e-fileexplorer .e-uploadbox.e-dialog .e-titlebar > .e-dialog-icon .e-close {
        font-size: 12px;
    }

    .e-fe-dialog .e-fe-dialog-btn .e-fe-btn-yes, .e-fe-dialog .e-fe-dialog-btn .e-fe-btn-no {
        margin-right: 10px;
        width: 20%;
    }

    .e-fe-dialog .e-error-msg {
        margin-top: 5px;
        color: red;
        font-size: 12px;
        margin-left: 2px;
    }

    .e-rtl .e-fe-dialog-label {
        text-align: right;
    }

    .e-fe-dialog-btn.e-replace {
        width: 100%;
    }

    .e-fileexplorer .e-toolbar {
        border-bottom: 3px solid;
        padding: 0 4px;
    }

    .e-fileexplorer .e-toolbar .e-icon.e-toolbar-res-arrow:before {
        margin-top: 6px;
    }

    .e-fileexplorer .e-scrollbar .e-hscroll .e-button.e-icon, .e-fileexplorer .e-scrollbar .e-vscroll .e-button.e-icon {
        display: none;
    }

    .e-fileexplorer .e-tree-wrapper .e-scrollbar.e-hscrollbar {
        top: 10px;
    }

    .e-fileexplorer .e-icon.e-fe-resize {
        font-size: 16px;
        float: right;
        padding: 5px 2px 0 0;
        cursor: se-resize;
    }

    .e-fileexplorer .e-icon.e-fe-resize + .e-switchView {
        margin: 0;
    }

    .e-fileexplorer .e-tilenode .e-image {
        display: table-cell;
        vertical-align: bottom;
        width: 100px;
    }

    .e-dialog .e-fe-table table {
        width: 100%;
        border-collapse: collapse;
        border-spacing: 0;
    }

    .e-dialog .e-fe-table table tr .e-readonly {
        width: 100%;
        font-size: 14px;
        overflow: hidden;
        text-overflow: ellipsis;
        font-family: Segoe UI;
    }

    .e-dialog .e-fe-table table .e-border {
        border-bottom: 1px solid;
    }

    .e-fileexplorer .e-treeview .e-text,
    .e-dialog.e-imageViewer-wrap .e-title, .e-fileexplorer .e-statusbar .e-itemStaus {
        white-space: pre;
    }

    .e-fileexplorer .e-tileview .e-tilenode .e-name, .e-fe-dialog.e-content {
        white-space: pre-wrap;
    }

    .e-fileexplorer .e-grid .e-gridcontent .e-rowcell.e-grid-image {
        padding: 2px;
    }

    .e-fileexplorer .e-fe-icon {
        background-repeat: no-repeat;
        background-image: url('@{font-path}/tools/file_icons.png');
    }

    .e-fileexplorer .e-grid .e-gridcontent .e-rowcell.e-grid-image .e-fe-icon {
        width: 20px;
        height: 20px;
        display: block;
    }

    .e-fileexplorer .e-treeview .e-fe-folder, .e-fileexplorer .e-toolbar .e-fe-folder {
        background-position: -245px -21px;
    }

    .e-fileexplorer .e-treeview .e-text {
        position: relative;
        padding-left: 20px;
    }

    .e-fileexplorer .e-treeview-wrap > .e-ul {
        overflow: visible;
    }

    .e-fileexplorer.e-rtl .e-treeview .e-text {
        padding-left: 4px;
        padding-right: 20px;
    }

    .e-fileexplorer .e-treeview .e-fe-icon, .e-fileexplorer .e-toolbar .e-fe-icon {
        width: 14px;
        height: 14px;
        position: absolute;
    }

    .e-fileexplorer .e-treeview .e-fe-folder {
        left: 2px;
        top: @fe-treeview-image-top;
    }

    .e-fileexplorer.e-rtl .e-treeview .e-fe-icon {
        right: 2px;
        left: inherit;
    }

    .e-fileexplorer .e-toolbar .e-fe-folder {
        top: 5px;
        left: 8px;
    }

    .e-fileexplorer.e-rtl .e-toolbar .e-fe-folder {
        left: 0px;
        right: 8px;
    }

    .e-fileexplorer .e-grid .e-fe-doc, .e-fileexplorer .e-grid .e-fe-docx {
        background-position: -196px -20px;
    }

    .e-fileexplorer .e-grid .e-fe-ppt, .e-fileexplorer .e-grid .e-fe-pptx {
        background-position: -196px -48px;
    }

    .e-fileexplorer .e-grid .e-fe-xls, .e-fileexplorer .e-grid .e-fe-xlsx {
        background-position: -196px -76px;
    }

    .e-fileexplorer .e-grid .e-fe-pdf {
        background-position: -196px -104px;
    }

    .e-fileexplorer .e-grid .e-fe-images {
        background-position: -196px -132px;
    }

    .e-fileexplorer .e-grid .e-fe-rar {
        background-position: -196px -160px;
    }

    .e-fileexplorer .e-grid .e-fe-zip {
        background-position: -196px -188px;
    }

    .e-fileexplorer .e-grid .e-fe-txt {
        background-position: -196px -216px;
    }

    .e-fileexplorer .e-grid .e-fe-audio {
        background-position: -196px -244px;
    }

    .e-fileexplorer .e-grid .e-fe-video {
        background-position: -196px -272px;
    }

    .e-fileexplorer .e-grid .e-fe-js {
        background-position: -196px -300px;
    }

    .e-fileexplorer .e-grid .e-fe-css {
        background-position: -196px -328px;
    }

    .e-fileexplorer .e-grid .e-fe-html {
        background-position: -196px -356px;
    }

    .e-fileexplorer .e-grid .e-fe-php {
        background-position: -196px -384px;
    }

    .e-fileexplorer .e-grid .e-fe-exe {
        background-position: -196px -412px;
    }

    .e-fileexplorer .e-grid .e-fe-msi {
        background-position: -196px -440px;
    }

    .e-fileexplorer .e-grid .e-fe-unknown {
        background-position: -196px -468px;
    }

    .e-fileexplorer .e-grid .e-fe-rtf {
        background-position: -196px -496px;
    }

    .e-fileexplorer .e-grid .e-fe-xml {
        background-position: -196px -524px;
    }

    .e-fileexplorer .e-grid .e-fe-folder {
        background-position: -196px -552px;
    }

    .e-fileexplorer .e-tile-wrapper .e-fe-doc, .e-fileexplorer .e-tile-wrapper .e-fe-docx, .e-fe .e-fe-icon.e-fe-docx, .e-fe .e-fe-icon.e-fe-doc {
        background-position: -21px -17px;
    }

    .e-fileexplorer .e-tile-wrapper .e-fe-ppt, .e-fileexplorer .e-tile-wrapper .e-fe-pptx, .e-fe .e-fe-icon.e-fe-ppt, .e-fe .e-fe-icon.e-fe-pptx {
        background-position: -21px -94px;
    }

    .e-fileexplorer .e-tile-wrapper .e-fe-xls, .e-fileexplorer .e-tile-wrapper .e-fe-xlsx, .e-fe .e-fe-icon.e-fe-xlsx, .e-fe .e-fe-icon.e-fe-xls {
        background-position: -21px -171px;
    }

    .e-fileexplorer .e-tile-wrapper .e-fe-pdf, .e-fe .e-fe-icon.e-fe-pdf {
        background-position: -21px -248px;
    }

    .e-fileexplorer .e-tile-wrapper .e-fe-images, .e-fe .e-fe-icon.e-fe-images {
        background-position: -21px -325px;
    }

    .e-fileexplorer .e-tile-wrapper .e-fe-rar, .e-fe .e-fe-icon.e-fe-rar {
        background-position: -21px -402px;
    }

    .e-fileexplorer .e-tile-wrapper .e-fe-zip, .e-fe .e-fe-icon.e-fe-zip {
        background-position: -21px -479px;
    }

    .e-fileexplorer .e-tile-wrapper .e-fe-txt, .e-fe .e-fe-icon.e-fe-txt {
        background-position: -21px -556px;
    }

    .e-fileexplorer .e-tile-wrapper .e-fe-audio, .e-fe .e-fe-icon.e-fe-audio {
        background-position: -21px -633px;
    }

    .e-fileexplorer .e-tile-wrapper .e-fe-video, .e-fe .e-fe-icon.e-fe-video {
        background-position: -21px -710px;
    }

    .e-fileexplorer .e-tile-wrapper .e-fe-js, .e-fe .e-fe-icon.e-fe-js {
        background-position: -21px -787px;
    }

    .e-fileexplorer .e-tile-wrapper .e-fe-css, .e-fe .e-fe-icon.e-fe-css {
        background-position: -21px -864px;
    }

    .e-fileexplorer .e-tile-wrapper .e-fe-html, .e-fe .e-fe-icon.e-fe-html {
        background-position: -21px -941px;
    }

    .e-fileexplorer .e-tile-wrapper .e-fe-php, .e-fe .e-fe-icon.e-fe-php {
        background-position: -21px -1018px;
    }

    .e-fileexplorer .e-tile-wrapper .e-fe-exe, .e-fe .e-fe-icon.e-fe-exe {
        background-position: -21px -1095px;
    }

    .e-fileexplorer .e-tile-wrapper .e-fe-msi, .e-fe .e-fe-icon.e-fe-msi {
        background-position: -21px -1172px;
    }

    .e-fileexplorer .e-tile-wrapper .e-fe-unknown, .e-fe .e-fe-icon.e-fe-unknown {
        background-position: -21px -1249px;
    }

    .e-fileexplorer .e-tile-wrapper .e-fe-rtf, .e-fe .e-fe-icon.e-fe-rtf {
        background-position: -21px -1326px;
    }

    .e-fileexplorer .e-tile-wrapper .e-fe-xml, .e-fe .e-fe-icon.e-fe-xml {
        background-position: -21px -1403px;
    }

    .e-fileexplorer .e-tile-wrapper .e-fe-folder, .e-fe .e-fe-icon.e-fe-folder {
        background-position: -21px -1480px;
    }

    .e-fileexplorer .e-tile-wrapper.e-tileInfo-view .e-fe-doc, .e-fileexplorer .e-tile-wrapper.e-tileInfo-view .e-fe-docx {
        background-position: -116px -17px;
    }

    .e-fileexplorer .e-tile-wrapper.e-tileInfo-view .e-fe-ppt, .e-fileexplorer .e-tile-wrapper.e-tileInfo-view .e-fe-pptx {
        background-position: -116px -79px;
    }

    .e-fileexplorer .e-tile-wrapper.e-tileInfo-view .e-fe-xls, .e-fileexplorer .e-tile-wrapper.e-tileInfo-view .e-fe-xlsx {
        background-position: -116px -141px;
    }

    .e-fileexplorer .e-tile-wrapper.e-tileInfo-view .e-fe-pdf {
        background-position: -116px -203px;
    }

    .e-fileexplorer .e-tile-wrapper.e-tileInfo-view .e-fe-images {
        background-position: -116px -265px;
    }

    .e-fileexplorer .e-tile-wrapper.e-tileInfo-view .e-fe-rar {
        background-position: -116px -327px;
    }

    .e-fileexplorer .e-tile-wrapper.e-tileInfo-view .e-fe-zip {
        background-position: -116px -389px;
    }

    .e-fileexplorer .e-tile-wrapper.e-tileInfo-view .e-fe-txt {
        background-position: -116px -451px;
    }

    .e-fileexplorer .e-tile-wrapper.e-tileInfo-view .e-fe-audio {
        background-position: -116px -513px;
    }

    .e-fileexplorer .e-tile-wrapper.e-tileInfo-view .e-fe-video {
        background-position: -116px -575px;
    }

    .e-fileexplorer .e-tile-wrapper.e-tileInfo-view .e-fe-js {
        background-position: -116px -637px;
    }

    .e-fileexplorer .e-tile-wrapper.e-tileInfo-view .e-fe-css {
        background-position: -116px -699px;
    }

    .e-fileexplorer .e-tile-wrapper.e-tileInfo-view .e-fe-html {
        background-position: -116px -761px;
    }

    .e-fileexplorer .e-tile-wrapper.e-tileInfo-view .e-fe-php {
        background-position: -116px -823px;
    }

    .e-fileexplorer .e-tile-wrapper.e-tileInfo-view .e-fe-exe {
        background-position: -116px -885px;
    }

    .e-fileexplorer .e-tile-wrapper.e-tileInfo-view .e-fe-msi {
        background-position: -116px -947px;
    }

    .e-fileexplorer .e-tile-wrapper.e-tileInfo-view .e-fe-unknown {
        background-position: -116px -1009px;
    }

    .e-fileexplorer .e-tile-wrapper.e-tileInfo-view .e-fe-rtf {
        background-position: -116px -1071px;
    }

    .e-fileexplorer .e-tile-wrapper.e-tileInfo-view .e-fe-xml {
        background-position: -116px -1133px;
    }

    .e-fileexplorer .e-tile-wrapper.e-tileInfo-view .e-fe-folder {
        background-position: -116px -1195px;
    }

    .e-fileexplorer .e-treeview .e-fe-folder.e-fe-lock {
        background-position: -245px -40px;
    }

    .e-fileexplorer .e-grid .e-fe-folder.e-fe-lock {
        background-position: -196px -580px;
    }

    .e-fileexplorer .e-tile-wrapper .e-fe-folder.e-fe-lock {
        background-position: -21px -1557px;
    }

    .e-fileexplorer .e-tile-wrapper.e-tileInfo-view .e-fe-folder.e-fe-lock {
        background-position: -116px -1258px;
    }

    .e-fileexplorer.e-rtl .e-gridcontent tr td.e-grid-image {
        text-indent: -68px;
    }

    .e-fileexplorer .e-grid .e-headercell.e-grid-image .e-descending, .e-fileexplorer .e-grid .e-headercell.e-grid-image .e-ascending {
        padding: 0 2px;
    }

    .e-fe-split-context.e-menu.e-context > .e-list > a > span {
        padding: 0 4px;
        margin: 0;
    }

    .e-fileexplorer.e-rtl .e-icon.e-fe-grid:before, .e-fe-split-context.e-rtl .e-icon.e-fe-grid:before {
        content: "\e81c";
    }


    .e-fileexplorer .e-icon.e-fe-grid:before, .e-fe-split-context .e-icon.e-fe-grid:before {
        content: "\e7b9";
    }

    .e-fileexplorer .e-icon.e-fe-largeicons:before, .e-fe-split-context .e-icon.e-fe-largeicons:before {
        content: "\e7bb";
    }

    .e-fileexplorer.e-rtl .e-icon.e-fe-tile:before, .e-fe-split-context.e-rtl .e-icon.e-fe-tile:before {
        content: "\e81b";
    }

    .e-fileexplorer .e-icon.e-fe-tile:before, .e-fe-split-context .e-icon.e-fe-tile:before {
        content: "\e7be";
    }

    .e-fileexplorer .e-icon.e-fe-largeicons {
        font-size: 13px;
    }

    .e-fileexplorer .e-tile-content {
        position: relative;
    }

    .e-fileexplorer .e-tilenode .e-chkbox-wrap {
        display: block;
        visibility: hidden;
        position: absolute;
        padding: 0px 2px 0px 2px;
    }

    .e-fileexplorer .e-gridcontent .e-chkbox-wrap {
        visibility: hidden;
    }

    .e-fileexplorer .e-tilenode.e-hover .e-chkbox-wrap, .e-fileexplorer .e-tilenode.e-active .e-chkbox-wrap, .e-fileexplorer .e-gridcontent .e-active .e-chkbox-wrap, .e-fileexplorer .e-gridcontent .e-hover .e-chkbox-wrap {
        visibility: visible;
    }

    .e-fileexplorer .e-grid .e-chkbox-wrap .e-chk-image.e-checkmark:before {
        text-indent: 0px;
    }

    .e-fileexplorer .e-gridcontent .e-chkbox-wrap .e-chkbox-small > span {
        top: 1px;
    }

    .e-fileexplorer .e-grid .e-headercell, .e-fileexplorer .e-grid .e-headercell-hover {
        height: 30px;
    }

    .e-fileexplorer .e-tilenode .e-chkbox-wrap .e-chkbox-small > span {
        height: 13px;
    }

    .e-fileexplorer .e-grid .e-table {
        padding: 0 6px;
    }

    .e-fileexplorer .e-gridheader .e-headercell .e-headercelldiv {
        padding: 0px 3px;
        margin: 0px;
    }

    .e-fileexplorer .e-gridheader .e-headercell {
        padding: 0px;
    }

    .e-fileexplorer th.e-headercell.e-default.e-col-check.e-defaultcursor {
        text-align: center;
    }

    .e-fileexplorer .e-grid .e-gridcontent .e-rowcell {
        padding-left: 3px;
        padding-right: 3px;
        line-height: 12px;
        text-overflow: ellipsis;
    }

    .e-fileexplorer .e-grid .e-col-check input {
        height: initial;
        line-height: initial;
        margin-top: 0px;
    }

    .e-fileexplorer.e-rtl .e-addressBar {
        direction: ltr;
        text-align: right;
        padding-right: 27px;
        width: 233px;
    }

    .e-fileexplorer.e-corner-all .e-item .e-text, .e-fileexplorer.e-corner-all .e-tilenode, .e-fileexplorer.e-corner-all input,
    .e-fe-dialog.e-corner input, .e-fe-dialog.e-corner button, .fe-context-menu.e-corner ul,
    .e-fileexplorer.e-corner-all .e-scrollbar .e-vhandle, .e-fileexplorer.e-corner-all .e-scrollbar .e-hhandle {
        border-radius: 4px 4px 4px 4px;
    }

    .e-fileexplorer.e-corner-all .e-grid tr td:first-child, .e-fileexplorer.e-rtl.e-corner-all .e-grid tr td.e-last-rowcell {
        border-radius: 4px 0 0 4px;
    }

    .e-fileexplorer.e-corner-all .e-grid tr td.e-last-rowcell, .e-fileexplorer.e-rtl.e-corner-all .e-grid tr td:first-child {
        border-radius: 0 4px 4px 0;
    }

    .e-fileexplorer .e-toolbar .e-splitbutton > div:first-child {
        display: table;
    }

    .e-fe-dialog .e-dialog .e-dialog-icon.e-close:before {
        line-height: 1.7;
    }

    .e-fileexplorer .e-toolbar .e-splitbutton > div:first-child .e-icon {
        width: 14px;
        height: 14px;
        padding: 0 3px;
    }

    .e-fe-mobile.e-toolbar.e-responsive-toolbar {
        width: auto;
        max-width: 100%;
    }

    .e-fileexplorer.e-fe-mobile .e-toolbar .e-addressBar, .e-fe-toolbar.e-fe-mobile .e-addressBar {
        width: 140px;
    }

    .e-fileexplorer.e-fe-mobile .e-toolbar .e-searchBar, .e-fe-toolbar.e-fe-mobile .e-searchBar {
        width: 80px;
    }

    .e-fileexplorer .e-mobile-upload.e-uploadbox .e-ul > li {
        height: 100%;
    }

    .e-fileexplorer .e-mobile-upload.e-uploadbox .e-file-list .e-file-progress {
        width: 200px;
    }

    .e-fileexplorer .e-mobile-upload.e-uploadbox .e-file-list .e-file-size {
        margin-left: 0px;
    }

    .e-fileexplorer .e-mobile-upload.e-uploadbox .e-file-list .e-file-percentage {
        width: 185px;
        margin-left: 0px;
    }

    .e-fileexplorer .e-mobile-upload.e-uploadbox .e-file-upload .e-action-container {
        margin: 0 auto 8px auto;
        width: 160px;
        padding-top: 10px;
    }

    .e-fileexplorer .e-mobile-upload.e-uploadbox .e-uploadbtn, .e-fileexplorer .e-mobile-upload.e-uploadbox .e-uploadclosebtn {
        margin-left: 0;
    }

    .e-fileexplorer .e-fe-popup span {
        display: inline-block;
        height: 16px;
        cursor: pointer;
        padding: 4px;
        border: 1px solid transparent;
        width: 16px;
    }

    .e-fileexplorer .e-fe-popup .e-tail:before, .e-fileexplorer .e-fe-popup .e-tail:after {
        border: 10px solid transparent;
        content: "";
        height: 0;
        left: 8px;
        position: absolute;
        width: 0;
    }

    .e-fileexplorer .e-fe-popup {
        position: absolute;
        font-weight: normal;
        z-index: 99999;
    }

    .e-fileexplorer .e-fe-popup .e-content {
        border-radius: 4px;
        font-size: 14px;
        padding: 4px 4px;
    }

    .e-fileexplorer .e-fe-popup .e-content {
        border-width: 1px;
        border-style: solid;
    }

    .e-fileexplorer .e-fe-popup .e-downtail:after {
        top: 34px;
    }

    .e-fileexplorer.e-fe-mobile .e-fe-split-icon {
        position: absolute;
        top: 50%;
        left: -4px;
        cursor: pointer;
    }

    .e-fileexplorer.e-fe-mobile .e-splitter .e-fe-split-icon .e-icon {
        visibility: visible;
    }

    .e-fileexplorer.e-fe-mobile .e-fe-split-icon {
        position: absolute;
        top: 41%;
        left: 0px;
        width: 14px;
        cursor: pointer;
        border: 1px solid;
        border-radius: 0 10px 10px 0;
        border-left-width: 0px;
        height: 40px;
    }

    .e-fileexplorer.e-fe-mobile .e-splitter .e-splitbar {
        overflow: visible;
    }

    .e-fileexplorer.e-fe-mobile .e-splitter .e-fe-split-icon .e-icon {
        font-size: 18px;
    }

    .e-fileexplorer.e-fe-mobile .e-splitter .e-fe-split-icon .e-icon:before {
        position: absolute;
        left: -3px;
        top: 12px;
    }

    .e-fileexplorer.e-fe-mobile .e-grid .e-table {
        padding: 0 20px;
    }

    .e-fileexplorer.e-fe-mobile .e-tileview {
        margin-left: 20px;
        margin-right: 20px;
    }

    .e-fileexplorer .e-tilenode {
        -moz-user-select: -moz-none;
        -khtml-user-select: none;
        -webkit-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

    .e-fileexplorer .e-grid .e-gridcontent .e-rowcell.e-col-check {
        line-height: 10px;
        padding-top: 3px;
    }

    .e-fileexplorer .e-chkbox-wrap .e-checkmark {
        line-height: 14px;
    }
    .e-fileexplorer input,
    .e-fe-toolbar.e-responsive-toolbar .e-tool-input,
    .e-fe-dialog input {
        border-radius: @border-radius;
    }
    .e-fileexplorer.e-fe-small .e-fe-dialog-text{
		width: 97%;
	}
	.e-fileexplorer.e-fe-small .e-fe-dialog-btn{
		width: 80%;
	}
	.e-fileexplorer.e-fe-short .e-tileInfo-view .e-tilenode{
		width: 100%;	
	}
	.e-fileexplorer.e-fe-short .e-tileInfo-view .e-name-wrap .e-name.e-name-in-wrap div, .e-fileexplorer.e-fe-short .e-tileInfo-view .e-tilenode .e-name-wrap{
		 width: 100px;
	}
}
/*------------------------------FileExplorer End-------------------------------*/
.mixin(@widget) when (@widget = spreadsheet), (@widget = none) {
    /* validation message */
    .e-validation-error {
        font-size: 14px;
        color: #cd0a0a;
    }
    /*-------------------------------------SpreadSheet core -----------------------*/
    .e-spreadsheet {
        height: auto;
        outline: none;
        line-height: 1.428571429;
        -webkit-user-select: none; /* Chrome all / Safari all */
        -moz-user-select: none; /* Firefox all */
        -ms-user-select: none; /* IE 10+ */
        -o-user-select: none;
         border: 1px solid;
    }

    .e-spreadsheet-list {
        position: relative;
    }

    .e-spreadsheet h6 {
        font-size: 12px;
        font-weight: 500;
    }

    .e-spreadsheet label,
    .e-ss-dialog label {
        font-size: 14px;
    }

    .e-ss-dialog input[type="submit"],
    .e-ss-dialog input[type="button"],
    .e-ss-dialog button {
        font-weight: normal;
    }

    .e-spreadsheet .e-spreadsheetcolumnheader {
        border-bottom: 1px solid;
    }

    .e-spreadsheet .e-headercell {
        height: 20px;
        background: none repeat scroll 0 0;
        border-width: 0 1px 1px 0;
        border-style: solid;
        font-weight: normal;
        font-size: 11pt;
        padding: 0 0.25em 0 0;
        text-align: center;
        text-overflow: ellipsis;
    }

    .e-spreadsheet .e-headercontent {
        border-right: 1px solid;
        border-left: 1px solid;
    }

	.e-spreadsheet .e-headercontent.e-rmvrghtbdr,
	.e-spreadsheet .e-spreadsheetcontentcontainer .e-content.e-rmvrghtbdr td:last-child {
	  border-right-color: transparent;
	}
	
    .e-spreadsheet .e-rowheadercontent {
        border-bottom: 1px solid;
    }

	.e-spreadsheet .e-rowheadercontent.e-rmvbtmbdr,
	.e-spreadsheet .e-rowheadercontent.e-rmvbtmbdr tr:last-child td,
	.e-spreadsheet .e-spreadsheetcontentcontainer .e-content.e-rmvbtmbdr tr:last-child td{
	  border-bottom-color: transparent;
	}

    .e-spreadsheet .e-rowheader {
        text-align: center;
        vertical-align: bottom;
        display: table-cell;
        border-width: 0 1px 1px 0;
        border-style: solid;
        font-size: 11pt;
        line-height: 14px;
        padding: 0 1px 3px 1px;
    }

    .e-spreadsheet .e-table {
        border: 0 none;
        border-collapse: separate;
        margin-top: 0;
        table-layout: fixed;
        width: 100%;
        border-spacing: 0;
    }

    .e-spreadsheet .e-rowcell {
        border-width: 0 1px 1px 0;
        border-style: solid;
        line-height: normal;
        width: auto;
        overflow: visible;
        vertical-align: bottom;
        padding: 0px 1px 0px 2px;
    }

    .e-spreadsheet .e-wrapword {
        white-space: pre;
    }

    .e-spreadsheet .e-rowcell.e-overflow {
        overflow: hidden;
        text-overflow: clip;
    }

    .e-spreadsheet .e-rowcell.e-foverflow, .e-spreadsheet .e-rowcell.e-moverflow, .e-spreadsheet .e-rowcell.e-soverflow {
        overflow: hidden;
        text-overflow: clip;
    }

    .e-spreadsheet .e-cellreadonly {
        vertical-align: top;
        text-align: center;
        margin-top: 2px;
        padding: 0px;
    }

    .e-spreadsheet .e-cellreadonly .e-chkbox-wrap .e-chkbox-small > span {
        height: 13px;
        top: 2px;
        margin: 0 2px 0 2px;
    }

    .e-spreadsheet .e-rowcell > button {
        font-size: 9px;
    }

    .e-spreadsheet .e-cellreadonly .e-datewidget .e-icon {
        font-size: 19px;
        margin-top: -10px;
        padding-left: 0.5px;
    }

    .e-spreadsheet .e-cellreadonly .e-datewidget .e-select {
        border: 0px;
    }

    .e-spreadsheet .e-cellreadonly .e-ddl .e-select {
        border: 0px;
    }

    .e-ss-cursor {
        cursor: cell;
    }

    .e-spreadsheet .e-spreadsheetheader .e-ss-selectall {
        float: left;
        width: 29px;
        height: 20px;
    }

    .e-spreadsheet .e-scrollcss {
        padding-right: 17px;
        background: none repeat scroll 0 0;
    }

    .e-spreadsheet .e-scrollrowcss {
        padding-bottom: 18px;
        background: none repeat scroll 0 0;
    }

    .e-spreadsheet .e-spreadsheetrowheader {
        overflow: hidden;
        box-sizing: content-box;
    }

    .e-spreadsheet .e-headercontent,
    .e-spreadsheet .e-rowheadercontent,
    .e-spreadsheet .e-headercell,
    .e-spreadsheet .e-spreadsheetcontentcontainer {
        overflow: hidden;
        position: relative;
    }

    .e-spreadsheet .e-content {
        position: relative;
    }

    .e-spreadsheet .e-spreadsheetactpanel .e-content {
        position: static;
    }

    .e-spreadsheet .e-spreadsheetactpanel {
        border-left: 1px solid;
    }

    .e-spreadsheet .e-spreadsheetactpanel .e-ss-pivotfield {
        border: none;
    }

    .e-spreadsheetactpanel .e-pivotschemadesigner .fieldTable {
        width: 90%;
    }

    .e-spreadsheet .e-ralign {
        text-align: right;
    }

    .e-spreadsheet .e-rightalign {
        direction: rtl;
    }

    .e-spreadsheet .e-calign {
        text-align: center;
    }

    .e-spreadsheet .e-ss-virtualtop, .e-spreadsheet .e-ss-virtualbottom {
        height: 0px;
        display: block;
    }
    /*---------------------------- Spreadhsheet Scroller Start----------------------------------------*/
    .e-spreadsheetcontentcontainer .e-scrollbar.e-hscrollbar {
        float: left;
    }

    .e-spreadsheetcontentcontainer .e-scrollbar.e-vscrollbar {
        float: right;
    }

    .e-spreadsheetcontentcontainer .e-content {
        position: relative;
        float: left;
        overflow: hidden;
    }
    /*---------------------------- Spreadhsheet Scroller End----------------------------------------*/
    /*-------------------- Borders ------------------------ */
    .e-spreadsheet td.e-bborderright,
    .e-spreadsheet td.e-rborderright,
    .e-spreadsheet td.e-vborderright,
    .e-spreadsheet td.e-gborderright,
    .e-spreadsheet td.e-pborderright,
    .e-spreadsheet td.e-oborderright,
    .e-spreadsheet td.e-bctrlborderright,
    .e-spreadsheet td.e-rctrlborderright,
    .e-spreadsheet td.e-vctrlborderright,
    .e-spreadsheet td.e-gctrlborderright,
    .e-spreadsheet td.e-pctrlborderright,
    .e-spreadsheet td.e-octrlborderright {
        border-right: 1px dashed;
    }

    .e-spreadsheet td.e-bborderbottom,
    .e-spreadsheet td.e-rborderbottom,
    .e-spreadsheet td.e-vborderbottom,
    .e-spreadsheet td.e-gborderbottom,
    .e-spreadsheet td.e-pborderbottom,
    .e-spreadsheet td.e-oborderbottom,
    .e-spreadsheet td.e-bctrlborderbottom,
    .e-spreadsheet td.e-rctrlborderbottom,
    .e-spreadsheet td.e-vctrlborderbottom,
    .e-spreadsheet td.e-gctrlborderbottom,
    .e-spreadsheet td.e-pctrlborderbottom,
    .e-spreadsheet td.e-octrlborderbottom {
        border-bottom: 1px dashed;
    }
    /*--------------------- Chart Borders -----------------------*/
    .e-spreadsheet td.e-bcbright,
    .e-spreadsheet td.e-vcbright,
    .e-spreadsheet td.e-rcbright {
        border-right: 1px solid;
    }

    .e-spreadsheet td.e-bcbbottom,
    .e-spreadsheet td.e-vcbbottom,
    .e-spreadsheet td.e-rcbbottom {
        border-bottom: 1px solid;
    }
    /*--------------------- Border -------------------------- */
    .e-spreadsheet .e-thinright {
        border-right: 1px solid;
    }

    .e-spreadsheet .e-thinbottom {
        border-bottom: 1px solid;
    }
    /*--------------------- Selection -------------------------- */
    .e-spreadsheet .e-focustop, .e-spreadsheet .e-focusright, .e-spreadsheet .e-focusbottom, .e-spreadsheet .e-focusleft {
        position: absolute;
    }

    .e-spreadsheet div.e-selecttop {
        border-top: 2px solid;
    }

    .e-spreadsheet div.e-selectright {
        border-right: 2px solid;
    }

    .e-spreadsheet div.e-selectbottom {
        border-bottom: 2px solid;
    }

    .e-spreadsheet div.e-selectleft {
        border-left: 2px solid;
    }
    /*--------------------- Auto Fill -------------------------------*/
    .e-spreadsheet div.e-autofilltop {
        border-top: 2px solid;
    }

    .e-spreadsheet div.e-autofillright {
        border-right: 2px solid;
    }

    .e-spreadsheet div.e-autofillbottom {
        border-bottom: 2px solid;
    }

    .e-spreadsheet div.e-autofillleft {
        border-left: 2px solid;
    }

    .e-spreadsheet .e-autofill {
        width: 5px;
        height: 5px;
        border: 1px solid white;
        background-clip: content-box;
        position: absolute;
        cursor: crosshair;
    }
    /*--------------------- Cut and Copy ------------------------ */
    .e-spreadsheet td.e-cutright {
        border-right: 1px dashed;
    }

    .e-spreadsheet td.e-cutbottom {
        border-bottom: 1px dashed;
    }
    /*------------------------- Pager------------------------- */
    .e-spreadsheet .e-pager .e-mediaforward {
        border-right: solid 1px;
        border-radius: 0;
    }

    .e-spreadsheet .e-splitspan {
        position: absolute;
    }

    .e-spreadsheet .e-pager .e-new {
        height: 100%;
        padding: 0 4px 2px 8px;
        vertical-align: middle;
    }

    .e-spreadsheet .e-pager {
        padding-bottom: 0px;
        padding-top: 0px;
        outline: 0px;
    }

    .e-spreadsheet .e-pager,
    .e-spreadsheet .e-pager .e-pagercontainer {
        border-style: none;
    }

    .e-spreadsheet .e-pager .e-currentitem {
        border-bottom: solid;
    }

    .e-spreadsheet .e-pager .e-numericitem {
        padding-right: 9px;
        padding-left: 9px;
        padding-bottom: 4px;
        padding-top: 3px;
    }

    .e-spreadsheet .e-pager .e-firstpage,
    .e-spreadsheet .e-pager .e-prevpage,
    .e-spreadsheet .e-pager .e-firstpagedisabled,
    .e-spreadsheet .e-pager .e-prevpagedisabled,
    .e-spreadsheet .e-pager .e-nextpage,
    .e-spreadsheet .e-pager .e-lastpage,
    .e-spreadsheet .e-pager .e-nextpagedisabled,
    .e-spreadsheet .e-pager .e-lastpagedisabled {
        padding: 7px 3px 0px 7px;
    }

    .e-spreadsheet .e-pager .e-pagercontainer {
        overflow: visible;
        height: 24px;
    }

    .e-spreadsheetfooter .e-table td {
        padding: 0;
    }

    .e-spreadsheetfooter {
        border-top: 1px solid;
    }
    /*--------------------- Resizing----------------------------- */
    .e-spreadsheet .e-reSizeColbg {
        position: absolute;
        border-left-width: 1px;
        border-left-style: dotted;
    }

    .e-spreadsheet .e-reSizeAPbg {
        position: absolute;
        border-left-width: 2px;
        border-left-style: dotted;
    }

    .e-spreadsheet .e-reSizeRowbg {
        position: absolute;
        border-top-width: 1px;
        border-top-style: dotted;
    }

    .e-spreadsheet .e-sswraptext {
        white-space: pre-wrap;
        word-wrap: break-word;
    }

	.e-spreadsheet .e-alt-unwrap {
		white-space: nowrap;
	}

	.e-spreadsheetmainpanel,
	.e-spreadsheetactpanel {
		font-family: Calibri;
		font-size: 11pt;
	}
	.e-spreadsheetactpanel {
		float: right;
	}
	.e-spreadsheetmainpanel {
		float: left;
	}
    /*--------------------- Manual Reorder----------------------------- */
    .e-spreadsheet .e-cursormove {
        cursor: move;
    }
    /*--------------------- Chart ----------------------------- */
    /*-------------------- Alert Dialog ------------------ */
    .e-alertDlg {
        width: 200px;
        float: right;
    }

    .e-alertok {
        margin-left: 100px;
        margin-top: 30px;
    }

    .e-filterspan {
        cursor: pointer;
        width: 15px;
        height: 15px;
        float: right;
        vertical-align: bottom;
        position: relative;
    }

    .e-filterdlg .e-textdiv, .e-filterdlg .e-operdiv {
        padding: 18px;
    }

    .e-filterdlg .e-fltrbtndiv {
        position: absolute;
        bottom: 10px;
        right: 10px;
    }

    .e-filterdlg .e-filter, e.filterdlg .e-clear {
        margin-right: 10px;
    }

    .e-insertdlgbtndiv {
        margin-left: 3px;
        margin-top: 0px;
    }

    .e-contentdialog {
        height: 115px;
    }

    .e-contentdialog td {
        padding-left: 10px;
    }
    /* ------------------------ Formula Tab ----------------- */
    .e-spreadsheet .e-in-wrap {
        background-color: inherit;
        color: inherit;
    }

    .e-spreadsheet .e-excelfilter .e-in-wrap {
        border: 1px solid;
    }

    .e-spreadsheet .e-formulabar {
        width: 100%;
        height: 36px;
        font-family: Calibri;
        font-size: 11pt;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        display: flex;
    }

    .e-spreadsheet .e-indexbox, .e-spreadsheet .e-insertbox {
        float: left;
        margin: 5px;
        border: 1px solid;
        height: 24px;
        font-size: 13px;
        line-height: 23px;
        color: black;
        text-align: center;
        box-sizing: content-box;
    }

    .e-ss-function:before {
        content: "\e6a3";
        font-family: "ej-xlfont";
        font-size: 16px;
        float: left;
        height: 20px;
        width: 23px;
    }

    .e-spreadsheet .e-inputbox {
        float: left;
        margin: 5px;
    }

    .e-spreadsheet .e-inputbox > input {
        height: 100%;
        width: 100%;
        background-color: transparent;
        border: medium none;
    }

    .e-spreadsheet .e-ss-input {
        position: absolute;
        overflow: hidden;
        text-indent: 0px;
        width: 100%;
        padding: 0px 0px 0px 2px;
    }

    .e-spreadsheet .e-editedcell {
        padding: 0px 1px 0px 0px;
    }

    .e-spreadsheet .e-editedcell.e-msie-edit {
        padding: 0px;
    }
    /*------------------------- Validation---------------------- */
    .e-spreadsheet div.e-error .e-errortail {
        height: 0;
        width: 0;
        position: relative;
        border-left: 8px solid transparent;
        border-right: 8px solid transparent;
        border-bottom: 8px solid;
    }

    .e-spreadsheet .e-ss-findselect {
        height: 29px;
    }

    .e-spreadsheet .e-ss-calcopt {
        height: 29px;
    }
    /*------ Dialog CSS-------*/
    .e-conok {
        margin-right: 5px;
    }

    .e-numberContent .e-numeric {
        float: right;
        margin-right: 100px;
    }

    .e-dlgleft .e-listbox > li {
        padding: 4px;
    }

    .e-spreadsheet label, .e-cfdiv label, .e-ss-dlgtab label, .e-ss-dlgtabval label, .e-ss-dialog label {
        font-weight: normal;
    }

    .e-dlgtab .e-header,
    .e-valdlgtab .e-header {
        height: 35px;
    }

    .e-dlgtab .e-header li,
    .e-valdlgtab .e-header li {
        height: 35px;
    }

    .e-valdlgtab {
        margin: 10px;
    }

    .e-subtab {
        margin: 6px 10px 13px;
    }

    .e-numbercontent .e-chkbox-wrap,
    .e-accountingcontent .e-chkbox-wrap {
        padding: 5px;
    }

    .e-ss-clearval:before {
        content: "\e60b";
        font-size: 20px;
    }

    .e-spreadsheet .e-error div.e-field-validation-error {
        border-radius: 7px;
        font-size: 14px;
        padding: 7px;
    }

    .e-spreadsheet .e-ss-editinput, .e-cell-ac > .e-in-wrap {
        display: none;
    }

    div.e-dlg-field-validation-error {
        border-radius: 7px;
        font-size: 14px;
        padding: 6px;
        position: absolute;
        font-size: 12px;
        line-height: 10px;
    }

    div.e-dlg-field-validation-error:before {
        content: "";
        position: absolute;
        top: -17px;
        left: 10px;
        border-bottom: 10px solid;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        border-top: 10px solid transparent;
    }

    .e-spreadsheet div.e-error .e-toparrow {
        left: 10%;
        display: block;
    }

    .e-spreadsheet div.e-error {
        position: absolute;
    }

    .e-ssr-validationsbtn {
        text-indent: -13px;
        line-height: 1px;
        text-align: center;
    }
    /* -------------------Font Icons ------------------- */
    @font-face {
        font-family: 'ej-xlfont';
        src: url('@{font-path}/spreadsheet/ejxlicons.eot?-dzszjm');
        src: url('@{font-path}/spreadsheet/ejxlicons.eot?#iefix-dzszjm') format('embedded-opentype'), url('@{font-path}/spreadsheet/ejxlicons.woff?-dzszjm') format('woff'),url('@{font-path}/spreadsheet/ejxlicons.woff') format('woff'), url('@{font-path}/spreadsheet/ejxlicons.ttf?-dzszjm') format('truetype'), url('@{font-path}/spreadsheet/ejxlicons.svg?-dzszjm#ejssicons') format('svg');
        font-weight: normal;
        font-style: normal;
    }
    /*-------------------------SpreadSheet Ribbon icons Customization--------------------*/
    .e-spreadsheet .e-ssr-verticalHparent .e-splitbutton.e-select:enabled {
        border: 1px solid transparent;
        border-top: 0px;
    }

    .e-spreadsheet .e-ssr-verticalHparent .e-button.e-select:enabled {
        border: 1px solid transparent;
        border-bottom: 0px;
    }

    .e-spreadsheet .e-ssr-verticalHparent .e-active, .e-spreadsheet .e-ssr-verticalHparent .e-active .e-splitbutton.e-select {
        border: 0px;
    }

    .e-spreadsheet .e-ssr-verticalHparent .e-button.e-select:enabled {
        border: 1px solid transparent;
        border-bottom: 0px;
    }

    .e-spreadsheet .e-ssr-verticalHparent .e-active, .e-spreadsheet .e-ssr-verticalHparent .e-active .e-splitbutton.e-select {
        border: 0px;
    }

    .e-spreadsheet .e-split .e-in-wrap.e-ssr-horizontalprt .e-drp-btn.e-split-btn:enabled {
        border: 1px solid transparent;
        border-left: none;
    }

    .e-spreadsheet .e-split .e-in-wrap.e-ssr-horizontalprt .e-splitbutton.e-split-btn:enabled {
        border: 1px solid transparent;
        border-right: none;
    }

    .e-spreadsheet .e-ssr-verticalHparent .e-controlpadding {
        padding: 0px;
    }

    .e-spreadsheet .e-splitarrowright.e-ssr-horizontalprt .e-split-btn.e-rht-btn {
        width: 13px;
    }

    .e-spreadsheet .e-split .e-padding.e-splitarrowright.e-ssr-horizontalprt {
        padding: 0 13px 0 0;
    }

    .e-spreadsheet .e-ss-colorpicker .e-in-wrap.e-ssr-colpickHprt .e-ssr-colorcontainer {
        border: 1px solid transparent;
        height: 24px;
    }

    .e-spreadsheet .e-ss-colorpicker .e-in-wrap.e-ssr-colpickHprt .e-tool-icon.e-ss-fontcolor {
        padding: 1px 4px 2px;
    }

    .e-spreadsheet .e-ss-colorpicker .e-in-wrap.e-ssr-colpickHprt .e-tool-icon.e-ss-backgroundcolor {
        padding: 0px 3px 2px;
    }

    .e-spreadsheet .e-ssr-newcmnt + .e-btntxt,
    .e-spreadsheet .e-ssr-editcmnt + .e-btntxt,
    .e-spreadsheet .e-ssr-deletecmnt + .e-btntxt,
    .e-spreadsheet .e-ssr-previouscmnt + .e-btntxt,
    .e-spreadsheet .e-ssr-nextcmnt + .e-btntxt {
        line-height: 64px;
    }

    .e-spreadsheet .e-ssr-newcmnt + .e-btntxt {
        text-indent: -2px;
    }

    .e-spreadsheet .e-findbtn .e-btntxt,
    .e-spreadsheet .e-fpanebtn .e-btntxt {
        line-height: 14px;
        text-indent: 4px;
        text-align: left;
        width: 42px;
    }

    .e-spreadsheet .e-coptbtn .e-btntxt {
        line-height: 14px;
        text-indent: -1px;
    }

    .e-spreadsheet .e-deletesbtn .e-btntxt,
    .e-spreadsheet .e-insertsbtn .e-btntxt {
        text-indent: 8px;
    }

    .e-spreadsheet .e-ssr-range + .e-btntxt {
        line-height: 15px;
    }

    .e-spreadsheet .e-ssr-charttype + .e-btntxt,
    .e-spreadsheet .e-ssr-srcolumn + .e-btntxt,
    .e-spreadsheet .e-formatastablebtn .e-btntxt,
    .e-spreadsheet .e-ssr-namemngr + .e-btntxt,
    .e-spreadsheet .e-ssr-protectsheet + .e-btntxt {
        line-height: 14px;
    }

    .e-spreadsheet .e-ssr-selectdata + .e-btntxt {
        line-height: 14px;
        padding-left: 1px;
    }

    .e-spreadsheet .e-ssr-print + .e-btntxt {
        padding-top: 5px;
    }

    .e-spreadsheet .e-ssr-filter + .e-btntxt {
        line-height: 25px;
    }

    .e-spreadsheet .e-ssr-pivottable + .e-btntxt,
    .e-spreadsheet .e-ssr-hyperlink + .e-btntxt,
    .e-spreadsheet .e-ssr-pictures + .e-btntxt,
    .e-spreadsheet .e-ssr-table + .e-btntxt {
        padding-top: 6px;
    }

    .e-menu-wrap .e-chartcontent {
        height: 40px;
    }

    .e-spreadsheet .e-cformatbtn .e-btntxt {
        line-height: 14px;
        text-align: left;
        text-indent: 4px;
        width: 67px;
    }

    .e-spreadsheet .e-cellstylebtn .e-btntxt {
        line-height: 14px;
        text-indent: 10px;
        text-align: left;
        width: 38px;
    }

    .e-spreadsheet .e-sortfltrbtn .e-btntxt {
        line-height: 14px;
        text-align: left;
        width: 35px;
        padding-top: 3px;
    }

    .e-spreadsheet .e-ssr-validationsbtn .e-btntxt {
        line-height: 14px;
        text-align: left;
        text-indent: 18px;
        width: 71px;
        padding-left: 8px;
    }

    .e-spreadsheet .e-clearbtn .e-btntxt {
        padding-bottom: 16px;
    }

    .e-spreadsheet .e-autosumbtn .e-btntxt {
        padding-bottom: 6px;
    }

    .e-spreadsheet .e-ssr-cut + .e-btntxt,
    .e-spreadsheet .e-ssr-copy + .e-btntxt,
    .e-spreadsheet .e-ss-formatpainter + .e-btntxt {
        padding-bottom: 4px;
    }

    .e-spreadsheet .e-mergebtn .e-btntxt {
        text-indent: -16px;
        line-height: 15px;
    }

    .e-spreadsheet .e-ssr-definename + .e-btntxt {
        text-indent: -6px;
    }

    .e-spreadsheet .e-ss-calcsheet + .e-btntxt {
        text-indent: 2px;
    }

    .e-spreadsheet .e-useinformulabtn .e-btntxt {
        text-indent: -9px;
    }

    .e-spreadsheet .e-ssr-pastesbtn .e-btntxt {
        text-indent: 6px;
        padding-bottom: 7px;
    }

    .e-spreadsheet .e-chartlayoutbtn .e-btntxt {
        line-height: 14px;
        text-align: left;
        text-indent: -1px;
        width: 53px;
    }
    /* -------------------Clipboard Font Icons ------------------- */
    .e-ssr-pastesbtn {
        text-indent: -12px;
    }

    .e-ss-cut:before {
        content: "\e601";
        font-family: "ej-xlfont";
    }

    .e-ssr-cut:before {
        content: "\e601";
        font-family: "ej-xlfont";
        text-indent: -8px;
        font-size: 15px;
        line-height: 13px;
    }

    .e-ssr-copy:before {
        content: "\e602";
        font-family: "ej-xlfont";
        font-size: 15px;
        text-indent: -6px;
        line-height: 13px;
    }

    .e-ss-copy:before {
        content: "\e602";
        font-family: "ej-xlfont";
        font-size: 15px;
        text-indent: -1px;
    }

    .e-ss-paste:before {
        content: "\e674";
        font-family: "ej-xlfont";
        font-size: 15px;
        line-height: 17px;
        text-indent: -1px;
    }

    .e-ssr-paste:before {
        content: "\e600";
        font-family: "ej-xlfont";
        font-size: 32px;
        line-height: 20px;
        text-indent: -9px;
    }

    .e-ss-formatpainter:before {
        content: "\e604";
        font-family: "ej-xlfont";
        font-size: 15px;
        text-indent: -1px;
        line-height: 14px;
    }
    /* -------------------Editing Font Icons ------------------- */
    .e-spreadsheet .e-new:before {
        content: "\e676";
        font-family: "ej-xlfont";
        font-size: 12px;
        line-height: 26px;
        text-indent: -1px;
    }

    .e-ssr-clear:before {
        content: "\e63a";
        font-family: "ej-xlfont";
        font-size: 18px;
        line-height: 16px;
        text-indent: -4px;
        height: 30px;
    }

    .e-ss-clear:before {
        content: "\e63b";
        font-family: "ej-xlfont";
        font-size: 15px;
        text-indent: 0px;
    }

    .e-ss-clearformat:before {
        content: "\e63c";
        font-family: "ej-xlfont";
        font-size: 17px;
        text-indent: 2px;
    }

    .e-ssr-autosum:before {
        content: "\e690";
        font-family: "ej-xlfont";
        font-size: 16px;
        line-height: 13px;
        text-indent: -4px;
    }

    .e-ss-autosum:before {
        content: "\e690";
        font-family: "ej-xlfont";
        font-size: 16px;
        line-height: 14px;
        text-indent: 1px;
    }

    .e-ss-newsheet:before {
        content: "\e603";
        font-family: "ej-xlfont";
        font-size: 15px;
        text-indent: -3px;
        line-height: 8px;
    }

    .e-ss-open:before {
        content: "\e605";
        font-family: "ej-xlfont";
        font-size: 15px;
        line-height: 5px;
        text-indent: -3px;
    }
    /* -------------------Border Font Icons ------------------- */
    .e-ss-bottom:before, .e-ss-top:before, .e-ss-left:before, .e-ss-right:before, .e-ss-noborder:before, .e-ss-allborder:before, .e-ss-outside:before, .e-ss-thickbox:before, .e-ss-thickbottom:before, .e-ss-topandbottom:before, .e-ss-topandthickbottom:before, .e-ss-drawborder:before, .e-ss-drawbordergrid:before {
        font-family: "ej-xlfont";
        font-size: 15px;
        line-height: 13px;
        text-indent: 2px;
    }

    .e-ss-bottom:before {
        content: "\e63d";
    }

    .e-ss-top:before {
        content: "\e63e";
    }

    .e-ss-left:before {
        content: "\e63f";
    }

    .e-ss-right:before {
        content: "\e640";
    }

    .e-ss-noborder:before {
        content: "\e641";
    }

    .e-ss-allborder:before {
        content: "\e642";
    }

    .e-ss-outside:before {
        content: "\e643";
    }

    .e-ss-thickbox:before {
        content: "\e644";
    }

    .e-ss-thickbottom:before {
        content: "\e645";
    }

    .e-ss-topandbottom:before {
        content: "\e646";
    }

    .e-ss-topandthickbottom:before {
        content: "\e647";
    }

    .e-ss-drawborder:before {
        content: "\e648";
    }

    .e-ss-drawbordergrid:before {
        content: "\e649";
    }

    .e-ss-borderstyle:before,
    .e-ss-solid:before,
    .e-ss-dashed:before,
    .e-ss-dotted:before {
        content: "\e750";
        font-size: 18px;
    }

    .e-ss-bordercolor:before {
        content: "\e64b";
        font-family: "ej-xlfont";
        font-size: 18px;
    }
    /* -------------------Font Propertys Font Icons ------------------- */
    .e-spreadsheet .e-ss-backgroundcolor:before {
        content: "\e610";
        font-family: "ej-xlfont";
        font-size: 18px;
        line-height: 19px;
        text-indent: -1px;
    }

    .e-spreadsheet .e-ss-fontcolor:before {
        content: "\e611";
        font-family: "ej-xlfont";
        font-size: 15px;
        line-height: 17px;
        text-indent: -1px;
    }

    .e-ss-increasefontsize:before {
        content: "\e60e";
        font-family: "ej-xlfont";
        font-size: 18px;
        text-indent: -2px;
        line-height: 15px;
    }

    .e-ss-decreasefontsize:before {
        content: "\e60f";
        font-family: "ej-xlfont";
        font-size: 18px;
        text-indent: -2px;
        line-height: 14px;
    }

    .e-ss-indent:before {
        content: "\e619";
        font-family: "ej-xlfont";
        font-size: 18px;
        text-indent: -2px;
        line-height: 15px;
    }

    .e-ss-outdent:before {
        content: "\e61a";
        font-family: "ej-xlfont";
        font-size: 18px;
        text-indent: -2px;
        line-height: 17px;
    }

    .e-ss-bold:before {
        content: "\e609";
        font-family: "ej-xlfont";
        font-size: 18px;
        text-indent: -2px;
        line-height: 13px;
    }

    .e-ss-italic:before {
        content: "\e60a";
        font-family: "ej-xlfont";
        font-size: 18px;
        text-indent: -3px;
        line-height: 15px;
    }

    .e-ss-underline:before {
        content: "\e60b";
        font-family: "ej-xlfont";
        font-size: 18px;
        text-indent: -2px;
        line-height: 14px;
    }

    .e-ss-linethrough:before {
        content: "\e60d";
        font-family: "ej-xlfont";
        font-size: 18px;
        text-indent: -2px;
        line-height: 16px;
    }

    .e-ss-alignleft:before {
        content: "\e612";
        font-family: "ej-xlfont";
        font-size: 18px;
        text-indent: -1px;
        line-height: 15px;
    }

    .e-ss-aligncenter:before {
        content: "\e613";
        font-family: "ej-xlfont";
        font-size: 18px;
        line-height: 13px;
        text-indent: -1px;
    }

    .e-ss-alignright:before {
        content: "\e614";
        font-family: "ej-xlfont";
        font-size: 18px;
        text-indent: -1px;
        line-height: 15px;
    }

    .e-ss-alignjustify:before {
        content: "\e618";
        font-family: "ej-xlfont";
        font-size: 18px;
        line-height: 14px;
        text-indent: -2px;
    }

    .e-ss-decreaseindent:before {
        content: "\e61a";
        font-family: "ej-xlfont";
        font-size: 18px;
        line-height: 14px;
        text-indent: -2px;
    }

    .e-ss-increaseindent:before {
        content: "\e619";
        font-family: "ej-xlfont";
        font-size: 18px;
        line-height: 12px;
        text-indent: -2px;
    }

    .e-ss-wraptext:before {
        content: "\e61b";
        font-family: "ej-xlfont";
        font-size: 18px;
        text-indent: -2px;
        line-height: 14px;
    }

    .e-ss-topalign:before {
        content: "\e615";
        font-family: "ej-xlfont";
        font-size: 18px;
        text-indent: -2px;
        line-height: 12px;
    }

    .e-ss-middlealign:before {
        content: "\e616";
        font-family: "ej-xlfont";
        font-size: 18px;
        text-indent: -2px;
        line-height: 14px;
    }

    .e-ss-bottomalign:before {
        content: "\e617";
        font-family: "ej-xlfont";
        font-size: 18px;
        line-height: 17px;
        text-indent: -2px;
    }

    .e-ss-addnew:before {
        content: "\e66c";
        font-family: "ej-xlfont";
        font-size: 15px;
    }

    .e-ss-delete:before {
        content: "\e671";
        font-family: "ej-xlfont";
        font-size: 15px;
    }
    /* -------------------Number Font Icons ------------------- */
    .e-ss-comma:before {
        content: "\e620";
        font-family: "ej-xlfont";
        font-size: 18px;
        text-indent: -2px;
        line-height: 15px;
    }

    .e-ss-accounting:before {
        content: "\e61e";
        font-family: "ej-xlfont";
        font-size: 18px;
        text-indent: -2px;
        line-height: 15px;
    }

    .e-ss-percentage:before {
        content: "\e61f";
        font-family: "ej-xlfont";
        font-size: 18px;
        text-indent: -2px;
        line-height: 13px;
    }

    .e-ss-increasedecimal:before {
        content: "\e621";
        font-family: "ej-xlfont";
        font-size: 18px;
        text-indent: -2px;
        line-height: 13px;
    }

    .e-ss-decreasedecimal:before {
        content: "\e622";
        font-family: "ej-xlfont";
        font-size: 18px;
        text-indent: -2px;
        line-height: 13px;
    }

    .e-ss-undo:before {
        content: "\e61c";
        font-family: "ej-xlfont";
        font-size: 32px;
        text-indent: -9px;
        line-height: 2px;
    }

    .e-ss-redo:before {
        content: "\e61d";
        font-family: "ej-xlfont";
        font-size: 32px;
        text-indent: -9px;
        line-height: 2px;
    }

    .e-ssr-find:before {
        content: "\e7e9";
        font-family: "ej-xlfont";
        font-size: 32px;
    }
    /* -------------------Merge Font Icons ------------------- */
    .e-spreadsheet .e-ssr-merge:before {
        content: "\e68e";
        font-family: "ej-xlfont";
        font-size: 16px;
        line-height: 14px;
        text-indent: -27px;
    }

    .e-ss-merge:before, .e-ss-mergecenter:before, .e-ss-mergeacross:before, .e-ss-unmerge:before {
        font-family: "ej-xlfont";
        font-size: 16px;
        line-height: 15px;
        text-indent: 2px;
    }

    .e-ss-merge:before {
        content: "\e68d";
    }

    .e-ss-mergecenter:before {
        content: "\e68e";
    }

    .e-ss-mergeacross:before {
        content: "\e68c";
    }

    .e-ss-unmerge:before {
        content: "\e68f";
    }
    /* -------------------Sorting Font Icons ------------------- */
    .e-ss-sortatoz:before {
        content: "\e64f";
        font-family: "ej-xlfont";
        font-size: 15px;
        line-height: 17px;
        text-indent: -0px;
    }

    .e-ss-sortztoa:before {
        content: "\e650";
        font-family: "ej-xlfont";
        font-size: 15px;
        line-height: 17px;
        text-indent: -0px;
    }

    .e-ssr-sortatoz:before {
        content: "\e64f";
        font-family: "ej-xlfont";
        font-size: 18px;
        line-height: 16px;
        text-indent: -4px;
    }

    .e-ssr-sortztoa:before {
        content: "\e650";
        font-family: "ej-xlfont";
        font-size: 18px;
        line-height: 16px;
        text-indent: -6px;
    }

    .e-ssdrop-sortatoz:before {
        content: "\e64f";
    }

    .e-ssdrop-sortztoa:before {
        content: "\e650";
    }
    /* -------------------Filtering Font Icons ------------------- */
    .e-ssdrop-sortatoz:before, .e-ssdrop-sortztoa:before, .e-ssdrop-filter:before, .e-ssdrop-clearfilter:before {
        font-family: "ej-xlfont";
        font-size: 18px;
        line-height: 16px;
        text-indent: 1px;
    }

    .e-ss-filter:before {
        content: "\e637";
        font-family: "ej-xlfont";
        font-size: 15px;
        line-height: 17px;
        text-indent: -0px;
    }

    .e-ssdrop-filter:before {
        content: "\e637";
        text-indent: 0px;
    }

    .e-ssfilter:before {
        content: "\e69d";
        font-family: "ej-xlfont";
        font-size: 18px;
        text-indent: -8px;
        line-height: 15px;
    }

    .e-ssfilter-asc:before {
        content: "\e6a1";
        font-family: "ej-xlfont";
        font-size: 18px;
        text-indent: -8px;
    }

    .e-ssfilter-dsc:before {
        content: "\e6a2";
        font-family: "ej-xlfont";
        font-size: 18px;
        text-indent: -8px;
    }

    .e-ssfiltered:before {
        content: "\e69e";
        font-family: "ej-xlfont";
        font-size: 17px;
        text-indent: -8px;
    }

    .e-ssfiltered-asc:before {
        content: "\e6a0";
        font-family: "ej-xlfont";
        font-size: 17px;
        text-indent: -8px;
    }

    .e-ssfiltered-dsc:before {
        content: "\e69f";
        font-family: "ej-xlfont";
        font-size: 17px;
        text-indent: -8px;
    }

    .e-ss-filternone:before {
        content: "\e668";
    }

    .e-ssr-filter:before {
        content: "\e651";
        font-family: "ej-xlfont";
        font-size: 18px;
        text-indent: -7px;
        line-height: 15px;
    }

    .e-ssr-filter .e-btntxt {
        line-height: 27px;
    }

    .e-ss-clearfilter:before {
        content: "\e652";
        font-family: "ej-xlfont";
        font-size: 18px;
        text-indent: -2px;
        line-height: 17px;
    }

    .e-ssdrop-clearfilter:before {
        content: "\e652";
        text-indent: 3px;
    }
    /* -------------------Print Font Icons ------------------- */
    .e-ss-printselected:before {
        content: "\e65e";
        font-family: "ej-xlfont";
        font-size: 40px;
        line-height: 19px;
        text-indent: -13px;
    }

    .e-ssr-printselected:before {
        content: "\e65e";
        font-family: "ej-xlfont";
        font-size: 32px;
        text-indent: -9px;
        line-height: 33px;
    }

    .e-ss-print:before {
        content: "\e608";
        font-family: "ej-xlfont";
        font-size: 40px;
        line-height: 19px;
        text-indent: -12px;
    }

    .e-ssr-print:before {
        content: "\e65d";
        font-family: "ej-xlfont";
        font-size: 32px;
        text-indent: -9px;
        line-height: 6px;
    }
    /* -------------------Formula Font Icons ------------------- */
    .e-ssr-namemngr:before {
        content: "\e65a";
        font-family: "ej-xlfont";
        font-size: 32px;
        text-indent: -8px;
        line-height: 19px;
    }

    .e-ssr-definename:before {
        content: "\e65b";
        font-family: "ej-xlfont";
        font-size: 18px;
        line-height: 14px;
        text-indent: -16px;
    }

    .e-ssr-useformula:before {
        content: "\e65c";
        font-family: "ej-xlfont";
        font-size: 21px;
        line-height: 14px;
        text-indent: -21px;
    }
    /* -------------------Import/Export Font Icons ------------------- */
    .e-ss-importxl:before {
        content: "\e789";
        font-family: "ej-xlfont";
    }

    .e-ss-saveas:before {
        content: "\e6a4";
        font-family: "ej-xlfont";
        font-size: 15px;
        line-height: 8px;
        text-indent: -3px;
    }

    .e-ss-exportpdf:before, .e-ss-exportxl:before, .e-ss-exportcsv:before {
        font-family: "ej-xlfont";
        font-size: 40px;
        line-height: 19px;
        text-indent: -12px;
    }

    .e-ss-exportxl:before {
        content: "\e607";
    }

    .e-ss-exportcsv:before {
        content: "\e606";
    }

    .e-ss-exportpdf:before {
        content: "\e6b9";
    }

    .e-ssr-exportxl:before {
        content: "\e65f";
        font-family: "ej-xlfont";
        font-size: 32px;
        text-indent: -7px;
        line-height: 33px;
    }

    .e-ssr-exportcsv:before {
        content: "\e660";
        font-family: "ej-xlfont";
        font-size: 32px;
        text-indent: -7px;
        line-height: 33px;
    }

    .e-ssr-pagesize:before {
        content: "\e656";
        font-family: "ej-xlfont";
        font-size: 32px;
        line-height: 8px;
        text-indent: -10px;
    }

    .e-ss-hlval:before {
        content: "\e60a";
        font-size: 20px;
        line-height: 16px;
        text-indent: 0;
    }

    .e-ss-clearval:before {
        content: "\e60b";
        font-size: 20px;
        text-indent: 0px;
        line-height: 16px;
    }

    .e-ssr-validation:before {
        content: "\e653";
        font-family: "ej-xlfont";
        font-size: 32px;
        text-indent: -8px;
        line-height: 12px;
    }

    .e-ss-validation:before {
        content: "\e655";
        font-family: "ej-xlfont";
        font-size: 32px;
        line-height: 13px;
        text-indent: -5px;
    }

    .e-ss-formatcells:before {
        content: "\e67c";
        font-family: "ej-xlfont";
        font-size: 15px;
    }

    .e-ssr-condformat:before {
        content: "\e677";
        font-family: "ej-xlfont";
        font-size: 32px;
        line-height: 34px;
        text-indent: -8px;
        height: 30px;
    }

    .e-ss-selectall:before {
        content: "\e6a5";
        font-family: "ej-xlfont";
        font-size: 12px;
        line-height: 22px;
        text-indent: 5px;
    }
    /* -------------------Comment Font Icons ------------------- */
    .e-spreadsheet .e-ssr-newcmnt:before {
        content: "\e661";
        font-family: "ej-xlfont";
        font-size: 32px;
        line-height: 43px;
        text-indent: -13px;
    }

    .e-spreadsheet .e-ssr-editcmnt:before {
        content: "\e662";
        font-family: "ej-xlfont";
        font-size: 39px;
        line-height: 43px;
        text-indent: -13px;
    }

    .e-spreadsheet .e-ssr-deletecmnt:before {
        content: "\e663";
        font-family: "ej-xlfont";
        font-size: 32px;
        text-indent: -13px;
        line-height: 42px;
    }

    .e-spreadsheet .e-ssr-previouscmnt:before {
        content: "\e665";
        font-family: "ej-xlfont";
        font-size: 32px;
        text-indent: -13px;
        line-height: 42px;
    }

    .e-spreadsheet .e-ssr-nextcmnt:before {
        content: "\e664";
        font-family: "ej-xlfont";
        font-size: 32px;
        text-indent: -13px;
        line-height: 42px;
    }

    .e-spreadsheet .e-ssr-showhidecmnt:before {
        content: "\e666";
        font-family: "ej-xlfont";
        font-size: 18px;
        text-indent: -7px;
        line-height: 15px;
    }

    .e-spreadsheet .e-ssr-showallcmnt:before {
        content: "\e667";
        font-family: "ej-xlfont";
        font-size: 18px;
        text-indent: -7px;
        line-height: 15px;
    }

    .e-spreadsheet .e-ss-newcmnt:before {
        content: "\e699";
        font-family: "ej-xlfont";
        font-size: 18px;
    }

    .e-spreadsheet .e-ss-editcmnt:before {
        content: "\e69a";
        font-family: "ej-xlfont";
        font-size: 18px;
    }

    .e-spreadsheet .e-ss-deletecmnt:before {
        content: "\e69b";
        font-family: "ej-xlfont";
        font-size: 18px;
    }
    /* -------------------FreezePane Font Icons ------------------- */
    .e-spreadsheet .e-ssr-frzpane:before {
        content: "\e678";
        font-family: "ej-xlfont";
        font-size: 32px;
        line-height: 33px;
        text-indent: -8px;
        height: 30px;
    }

    .e-ss-frzpane:before, .e-ss-frzrow:before, .e-ss-frzcln:before {
        font-family: "ej-xlfont";
        font-size: 18px;
        line-height: 16px;
        text-indent: 1px;
    }

    .e-ss-frzpane:before {
        content: "\e679";
    }

    .e-ss-frzrow:before {
        content: "\e67a";
    }

    .e-ss-frzcln:before {
        content: "\e67b";
    }

    .e-spreadsheet .e-ssr-pictures:before {
        content: "\e688";
        font-family: "ej-xlfont";
        font-size: 43px;
        line-height: 8px;
        text-indent: -13px;
    }

    .e-spreadsheet .e-ssr-changepicture:before {
        content: "\e694";
        font-family: "ej-xlfont";
        text-indent: -5px;
        line-height: 15px;
        font-size: 18px;
    }

    .e-spreadsheet .e-ssr-resetpicture:before {
        content: "\e693";
        font-family: "ej-xlfont";
        text-indent: -5px;
        line-height: 15px;
        font-size: 18px;
    }

    .e-ss-resetpicture:before {
        content: "\e693";
        font-family: "ej-xlfont";
        text-indent: -1px;
        line-height: 16px;
        font-size: 18px;
    }

    .e-spreadsheet .e-ssr-pictureborder:before {
        content: "\e696";
        font-family: "ej-xlfont";
        text-indent: -1px;
        line-height: 15px;
        font-size: 18px;
    }

    .e-ssr-hyperlink:before {
        content: "\e64e";
        font-family: "ej-xlfont";
        font-size: 32px;
        text-indent: -7px;
        line-height: 7px;
    }

    .e-ss-hyperlink:before {
        content: "\e67d";
        font-family: "ej-xlfont";
        text-indent: 1px;
        line-height: 17px;
        font-size: 15px;
    }

    .e-ss-removelink:before {
        content: "\e675";
        font-family: "ej-xlfont";
        text-indent: 1px;
        font-size: 18px;
    }
    /* Spreadsheet conditionalFormatting */
    .e-spreadsheet.e-split .e-list.e-haschild span.e-ss-condformat {
        overflow: unset;
    }

    .e-ss-hlcellrules:before, .e-ss-greaterthan:before, .e-ss-lessthan:before, .e-ss-between:before, .e-ss-equalto:before, .e-ss-textcontains:before, .e-ss-dateoccur:before, .e-ss-clearrules:before, .e-ss-createrule:before {
        font-family: "ej-xlfont";
        font-size: 13px;
        text-indent: 3px;
        line-height: 15px;
    }

    .e-ss-hlcellrules:before {
        content: "\e624";
    }

    .e-ss-greaterthan:before {
        content: "\e625";
    }

    .e-ss-lessthan:before {
        content: "\e626";
    }

    .e-ss-between:before {
        content: "\e627";
    }

    .e-ss-equalto:before {
        content: "\e628";
    }

    .e-ss-textcontains:before {
        content: "\e629";
    }

    .e-ss-dateoccur:before {
        font-size: 12px;
        content: "\e62a";
    }

    .e-ss-clearrules:before {
        content: "\e654";
        font-size: 15px;
    }

    .e-ss-createrule:before {
        content: "\e6b0";
        font-size: 15px;
    }

    .e-ss-goto:before {
        content: "\e67f";
        font-family: "ej-xlfont";
        font-size: 15px;
        line-height: 18px;
        text-indent: 0px;
    }

    .e-ss-replace:before {
        content: "\e639";
        font-family: "ej-xlfont";
        font-size: 15px;
        line-height: 16px;
        text-indent: 2px;
    }

    .e-ss-findselect:before {
        content: "\e638";
        font-family: "ej-xlfont";
        font-size: 32px;
        line-height: 33px;
        text-indent: -8px;
        height: 30px;
    }

    .e-ss-calcopt:before {
        content: "\e6ad";
        font-family: "ej-xlfont";
        font-size: 32px;
        line-height: 34px;
        text-indent: -4px;
    }

    .e-ss-calcauto:before {
        content: "\e6aa";
        font-family: "ej-xlfont";
        font-size: 10px;
        line-height: 20px;
        text-indent: 8px;
    }

    .e-ss-calcnow:before {
        content: "\e6ab";
        font-family: "ej-xlfont";
        font-size: 18px;
        line-height: 14px;
        text-indent: -4px;
    }

    .e-ss-calcsheet:before {
        content: "\e6ac";
        font-family: "ej-xlfont";
        font-size: 18px;
        line-height: 15px;
        text-indent: 1px;
    }

    .e-ss-find:before {
        content: "\e67e";
        font-family: "ej-xlfont";
        font-size: 15px;
        line-height: 12px;
        text-indent: 2px;
    }

    .e-ss-sortfilter:before {
        content: "\e635";
        font-family: "ej-xlfont";
        font-size: 32px;
        text-indent: -8px;
        line-height: 29px;
        height: 30px;
    }

    .e-ssr-formatastable:before {
        content: "\e633";
        font-family: "ej-xlfont";
        font-size: 32px;
        text-indent: -4px;
        line-height: 37px;
        height: 30px;
    }

    .e-ssr-cellstyles:before {
        content: "\e634";
        font-family: "ej-xlfont";
        font-size: 32px;
        text-indent: -6px;
        line-height: 34px;
        height: 30px;
    }

    .e-ssr-table:before {
        content: "\e64d";
        font-family: "ej-xlfont";
        font-size: 32px;
        line-height: 8px;
        text-indent: -9px;
    }

    .e-ssr-pivottable:before {
        content: "\e64c";
        font-family: "ej-xlfont";
        font-size: 32px;
        text-indent: -9px;
        line-height: 8px;
    }

    .e-ssr-range:before {
        content: "\e673";
        font-family: "ej-xlfont";
        text-indent: -3px;
        font-size: 18px;
        line-height: 17px;
    }

    .e-ssr-resizetable:before {
        content: "\e672";
        font-family: "ej-xlfont";
        text-indent: -2px;
        font-size: 18px;
    }

    .e-spreadsheet .e-ssr-insert:before {
        content: "\e668";
        font-family: "ej-xlfont";
        font-size: 32px;
        line-height: 15px;
        text-indent: -9px;
    }

    .e-ssr-inscell:before, .e-ssr-insrow:before, .e-ssr-insrow:before, .e-ssr-inscol:before, .e-ssr-inssheet:before {
        font-family: "ej-xlfont";
        font-size: 15px;
        line-height: 18px;
        text-indent: 3px;
    }

    .e-ssr-inscell:before {
        content: "\e669";
        line-height: 16px;
    }

    .e-ssr-insrow:before {
        content: "\e66a";
        line-height: 18px;
    }

    .e-ssr-inscol:before {
        content: "\e66b";
    }

    .e-ssr-inssheet:before {
        content: "\e66c";
    }

    .e-spreadsheet .e-ssr-delete:before {
        content: "\e66d";
        font-family: "ej-xlfont";
        font-size: 32px;
        line-height: 15px;
        text-indent: -9px;
    }

    .e-ssr-delcell:before, .e-ssr-delrow:before, .e-ssr-delcol:before, .e-ssr-delsheet:before {
        font-family: "ej-xlfont";
        font-size: 15px;
        line-height: 17px;
        text-indent: 3px;
    }

    .e-ssr-delcell:before {
        content: "\e66e";
    }

    .e-ssr-delrow:before {
        content: "\e66f";
    }

    .e-ssr-delcol:before {
        content: "\e670";
    }

    .e-ssr-delsheet:before {
        content: "\e671";
    }

    .e-ss-noborderdlg:before {
        content: "\e641";
        font-family: "ej-xlfont";
        font-size: 30px;
        margin-left: -7px;
        margin-top: -15px;
    }

    .e-ss-outsideborderdlg:before {
        content: "\e643";
        font-family: "ej-xlfont";
        font-size: 30px;
        margin-left: -7px;
        margin-top: -15px;
    }

    .e-ss-topborderdlg:before {
        content: "\e63e";
        font-family: "ej-xlfont";
        font-size: 20px;
        margin-left: -2px;
        margin-top: -6px;
    }

    .e-ss-leftborderdlg:before {
        content: "\e63f";
        font-family: "ej-xlfont";
        font-size: 20px;
        margin-left: -2px;
        margin-top: -6px;
    }

    .e-ss-rightborderdlg:before {
        content: "\e640";
        font-family: "ej-xlfont";
        font-size: 20px;
        margin-left: -2px;
        margin-top: -6px;
    }

    .e-ss-bottomborderdlg:before {
        content: "\e63d";
        font-family: "ej-xlfont";
        font-size: 20px;
        margin-left: -2px;
        margin-top: -6px;
    }

    .e-ss-allborderdlg:before {
        content: "\e642";
        font-family: "ej-xlfont";
        font-size: 29px;
        margin-left: -7px;
        margin-top: -15px;
    }

    .e-ssr-chartwidth:before {
        content: "\e68b";
        font-family: "ej-xlfont";
        font-size: 24px;
		margin-top: 5px;
    }

    .e-ssr-chartheight:before {
        content: "\e68a";
        font-family: "ej-xlfont";
        font-size: 24px;
		margin-top: 5px;
    }

    .e-ssr-srcolumn:before {
        content: "\e695";
        font-family: "ej-xlfont";
        font-size: 32px;
        line-height: 22px;
        text-indent: -9px;
    }

    .e-ssr-selectdata:before {
        content: "\e697";
        font-family: "ej-xlfont";
        font-size: 32px;
        line-height: 27px;
        text-indent: -8px;
    }

    .e-ssr-charttype:before {
        content: "\e698";
        font-family: "ej-xlfont";
        font-size: 32px;
        line-height: 26px;
        text-indent: -8px;
    }

    .e-ssr-celements:before {
        content: "\e689";
        font-family: "ej-xlfont";
        font-size: 32px;
        line-height: -1px;
        text-indent: -10px;
    }
    /*-----------------------------------Spreadsheet Chart-----------------------*/
    .e-spreadsheet .e-ss-colchart:before {
        content: "\e680";
        font-family: "ej-xlfont";
        font-size: 16px;
        text-indent: -14px;
        line-height: 14px;
    }

    .e-spreadsheet .e-ss-barchart:before {
        content: "\e681";
        font-family: "ej-xlfont";
        font-size: 16px;
        text-indent: -14px;
        line-height: 14px;
    }

    .e-spreadsheet .e-ss-stockchart:before {
        content: "\e682";
        font-family: "ej-xlfont";
        font-size: 16px;
        text-indent: -14px;
        line-height: 14px;
    }

    .e-spreadsheet .e-ss-linechart:before {
        content: "\e683";
        font-family: "ej-xlfont";
        font-size: 16px;
        text-indent: -14px;
        line-height: 14px;
    }

    .e-spreadsheet .e-ss-areachart:before {
        content: "\e684";
        font-family: "ej-xlfont";
        font-size: 16px;
        text-indent: -14px;
        line-height: 14px;
    }

    .e-spreadsheet .e-ss-combochart:before {
        content: "\e685";
        font-family: "ej-xlfont";
        font-size: 16px;
        text-indent: -14px;
        line-height: 14px;
    }

    .e-spreadsheet .e-ss-piechart:before {
        content: "\e686";
        font-family: "ej-xlfont";
        font-size: 16px;
        text-indent: -14px;
        line-height: 14px;
    }

    .e-spreadsheet .e-ss-scterchart:before {
        content: "\e687";
        font-family: "ej-xlfont";
        font-size: 16px;
        text-indent: -14px;
        line-height: 12px;
    }

    .e-ss-dlgcolumnchart:before {
        content: "\e680";
        font-family: "ej-xlfont";
        font-size: 16px;
        text-indent: -8px;
        line-height: 14px;
    }

    .e-ss-dlgbarchart:before {
        content: "\e681";
        font-family: "ej-xlfont";
        font-size: 16px;
        text-indent: -8px;
        line-height: 14px;
    }

    .e-ss-dlgradarchart:before {
        content: "\e682";
        font-family: "ej-xlfont";
        font-size: 16px;
        text-indent: -8px;
        line-height: 14px;
    }

    .e-ss-dlglinechart:before {
        content: "\e683";
        font-family: "ej-xlfont";
        font-size: 16px;
        text-indent: -8px;
        line-height: 14px;
    }

    .e-ss-dlgareachart:before {
        content: "\e684";
        font-family: "ej-xlfont";
        font-size: 16px;
        text-indent: -8px;
        line-height: 14px;
    }

    .e-ss-dlgcombochart:before {
        content: "\e685";
        font-family: "ej-xlfont";
        font-size: 16px;
        text-indent: -8px;
        line-height: 14px;
    }

    .e-ss-dlgpiechart:before {
        content: "\e686";
        font-family: "ej-xlfont";
        font-size: 16px;
        text-indent: -8px;
        line-height: 14px;
    }

    .e-ss-dlgscatterchart:before {
        content: "\e687";
        font-family: "ej-xlfont";
        font-size: 16px;
        text-indent: -8px;
        line-height: 14px;
    }
    /*-------------------------------------AutoFill Option------------------------*/
    .e-ss-filloption:before {
        content: "\e691";
        font-family: "ej-xlfont";
        font-size: 16px;
    }

    .e-ss-fillselect:before {
        content: "\e692";
        font-family: "ej-xlfont";
        font-size: 16px;
        text-indent: -1px;
        line-height: 13px;
    }

    .e-ss-autofill:before {
        content: "\e6a6";
        font-family: "ej-xlfont";
        font-size: 16px;
        text-indent: -2px;
        line-height: 13px;
    }
    /*-------------------------------------Find replace ------------------------*/
    .e-lblreplace {
        position: relative;
        top: -11px;
    }

    .e-txtreplace {
        position: relative;
        left: 90px;
        top: -35px;
        width: 230px;
    }

    .e-txtfind {
        position: relative;
        left: 90px;
        top: -25px;
        width: 230px;
    }

    .e-divfind {
        height: 63px;
    }

    .e-ssr-sortztoa + .e-btntxt {
        line-height: 25px;
    }

    .e-ssr-sortatoz + .e-btntxt {
        line-height: 25px;
    }

    .e-ss-clearfilter + .e-btntxt {
        line-height: 24px;
    }

    .e-ssr-pagesizesbtn {
        text-indent: -12px;
        line-height: 1px;
    }

    .e-datapadding {
        padding-bottom: 30px;
    }

    .e-spreadsheet.e-cformat-hl, .e-spreadsheet.e-cformat-tb, .e-spreadsheet.e-cformat-is, .e-spreadsheet.e-cformat-cr {
        border: none;
        width: 180px;
    }

    .e-spreadsheet.e-borderstyle {
        border: none;
    }

    .e-spreadsheet.e-cformat-tb > li > ul {
        width: 148px;
        height: 175px;
    }

    .e-spreadsheet.e-cformat-is > li > ul {
        width: 100px;
    }

    .e-spreadsheet.e-cformat-hl > li > ul {
        width: 148px;
    }

    .e-menu.e-js.e-widget.e-context.e-separator.e-spreadsheet.e-border > li {
        line-height: 24px;
    }

    .e-menu.e-js.e-widget.e-context.e-separator.e-spreadsheet.e-border > li > a {
        font-size: 13px;
    }
    /*--------------------------------- Name Manager -------------------------------------*/
    .e-nmdlg-editor {
        height: 25px;
    }
    /*--------------------------------- Format as table ----------------------------------*/
    .e-menu.e-nmuseinformula {
        width: 120px;
    }

    .e-menu .e-nmuseinformularow {
        padding: 3px 10px;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .e-menu-wrap .e-cellstyles {
        width: 461px;
        height: auto;
    }

    .e-menu-wrap .e-cellstyleheader, .e-menu-wrap .e-formatastableheader {
        color: gray;
        font-family: 'Segoe UI';
        font-size: 14px;
        font-weight: bold;
        height: 15px;
        padding: 5px;
        cursor: default;
        line-height: 11px;
        border-bottom: 1px solid transparent;
    }

    .e-menu-wrap .e-cellstyleheader:not(:first-child) {
        padding-top: 0px;
    }

    .e-menu-wrap .e-cellstylecontent, .e-menu-wrap .e-formatastablecontent, .e-menu-wrap .e-chartcontent {
        background-color: white;
    }

    .e-menu-wrap .e-cellstylecell {
        border: 2px solid transparent;
        height: 15px;
        padding: 5px;
        width: 90px;
        margin: 5px;
        display: inline-block;
        font-family: Calibri;
        cursor: default;
    }
    /*-----------------cellstyles-----------------------------------------------------*/
    .e-formatastablecell div {
        background: url('@{font-path}/spreadsheet/sprites.png') no-repeat;
        width: 63px;
        height: 48px;
    }
	
	.e-bordercell {
        width: 63px;
        height: 48px;
    }

    .e-spreadsheet .e-ss-cellstyles-1 {
        background-position: 0 -1px;
    }

    .e-spreadsheet .e-ss-cellstyles-2 {
        background-position: -65px -1px;
    }

    .e-spreadsheet .e-ss-cellstyles-3 {
        background-position: -130px -2px;
    }

    .e-spreadsheet .e-ss-cellstyles-4 {
        background-position: -194px -2px;
    }

    .e-spreadsheet .e-ss-cellstyles-5 {
        background-position: -259px -2px;
    }

    .e-spreadsheet .e-ss-cellstyles-6 {
        background-position: -323px -3px;
    }

    .e-spreadsheet .e-ss-cellstyles-7 {
        background-position: -1px -50px;
    }

    .e-spreadsheet .e-ss-cellstyles-8 {
        background-position: -64px -50px;
    }

    .e-spreadsheet .e-ss-cellstyles-9 {
        background-position: -127px -49px;
    }

    .e-spreadsheet .e-ss-cellstyles-10 {
        background-position: -192px -50px;
    }

    .e-spreadsheet .e-ss-cellstyles-11 {
        background-position: -257px -52px;
    }

    .e-spreadsheet .e-ss-cellstyles-12 {
        background-position: -322px -51px;
    }

    .e-spreadsheet .e-ss-cellstyles-13 {
        background-position: -2px -99px;
    }

    .e-spreadsheet .e-ss-cellstyles-14 {
        background-position: -67px -99px;
    }

    .e-spreadsheet .e-ss-cellstyles-15 {
        background-position: -132px -100px;
    }

    .e-spreadsheet .e-ss-cellstyles-16 {
        background-position: -195px -100px;
    }

    .e-spreadsheet .e-ss-cellstyles-17 {
        background-position: -257px -100px;
    }

    .e-spreadsheet .e-ss-cellstyles-18 {
        background-position: -321px -101px;
    }

    .e-spreadsheet .e-ss-cellstyles-19 {
        background-position: 1px -149px;
    }

    .e-spreadsheet .e-ss-cellstyles-20 {
        background-position: -63px -149px;
    }

    .e-spreadsheet .e-ss-cellstyles-21 {
        background-position: -130px -151px;
    }

    .e-spreadsheet .e-ss-cellstyles-22 {
        background-position: -194px -151px;
    }

    .e-spreadsheet .e-ss-cellstyles-23 {
        background-position: -258px -150px;
    }

    .e-spreadsheet .e-ss-cellstyles-24 {
        background-position: -321px -150px;
    }
    /*--------------------------------- Format as table ----------------------------------*/
    .e-menu-wrap .e-formatastable {
        width: 329px;
        height: 330px;
        overflow-x: hidden;
    }

    .e-menu-wrap .e-formatastablecell {
        border: 4px solid transparent;
        height: 48px;
        width: 63px;
        margin: 3px;
        display: inline-block;
        font-family: 'Segoe UI';
        font-size: 14px;
        cursor: default;
    }

    .e-ss-dialog .e-fatnamedlgcell input {
        margin: 0;
    }
    /*--------------------------------- Resize table ----------------------------------*/
    /*--------------------------------- Ribbon Table Properties ----------------------------------*/
    .e-spreadsheet .e-tablepropertiescell {
        padding: 3px;
        width: 90px;
    }

    .e-spreadsheet .e-tablepropetiesrow, .e-spreadsheet .e-tablestyleoptionsrow {
        display: table;
    }
    /*--------------------------------- Ribbon Table Style Options ----------------------------------*/
    .e-spreadsheet .e-tablestyleoptionscell {
        float: left;
        padding-left: 3px;
        width: 94px;
    }

    .e-spreadsheet .e-tablestyleoptionslabel {
        padding: 3px;
        margin-left: 3px;
        font-size: 12px;
    }

    .e-tablestyleoptionsrow:last-child {
        margin-top: -2px;
    }

    .e-tablestyleoptionsrow:first-child {
        margin-top: 2px;
    }
    /*--------Spreadsheet Comment-------------------*/
    .e-spreadsheet .e-celltoparrow {
        border-style: solid;
        border-width: 5px 0 0 5px;
        height: 0px;
        position: absolute;
        z-index: 8;
    }

    .e-spreadsheet .e-comment {
        float: right;
        height: 0;
        text-indent: 0;
        position: absolute;
    }

    .e-spreadsheet .e-ssr-disableitem {
        display: none;
    }

    .e-spreadsheet .e-comment-txtarea {
        border: 1px solid black;
        margin-left: 0.8%;
        position: absolute;
        overflow: hidden;
        resize: none;
        font-family: "Tahoma";
        font-weight: normal;
        font-size: 13px;
        line-height: normal;
        left: 13px;
        top: 6px;
        height: 70px;
        width: 130px;
        font-style: normal;
    }
    /*-------------Spreadsheet Hyperlink Dialog------------------------*/
    .e-ss-hlbtndiv {
        margin-bottom: -2px;
        margin-left: 58%;
        width: 100%;
        margin-top: 5px;
    }

    .e-ss-hllblfind {
        position: relative;
        top: -6px;
    }

    .e-ss-hltxtfind {
        position: relative;
        left: 64px;
        top: -5px;
    }

    .e-ss-hllblweb {
        position: relative;
        left: 2px;
        top: 5px;
    }

    .e-ss-hltxtweb {
        position: relative;
        left: 92px;
        top: -24px;
    }

    .e-ss-scroll {
        height: 150px;
        overflow: auto;
        position: relative;
        top: -10px;
    }

    .e-spreadsheet .e-hyperlinks {
        text-decoration: underline;
    }

    .e-spreadsheet .e-ss-object {
        position: absolute;
        background-repeat: no-repeat;
        background-size: 100% 100%;
        background-position: 0 0;
        cursor: move;
        border: 1px solid transparent;
        z-index: 11;
    }

    .e-spreadsheet .e-ss-pivot {
        position: absolute;
        background-repeat: no-repeat;
        background-size: 100% 100%;
        background-position: 0 0;
        cursor: move;
        border: 1px solid transparent;
        z-index: 11;
    }

    .e-spreadsheet .e-spreadsheetcontentcontainer .e-ss-object.e-ss-activeimg {
        border: 1px solid;
    }

    .e-spreadsheet .e-spreadsheetcontentcontainer .e-ss-pivot.e-ss-activepivot {
        border: 1px solid;
    }

    .e-spreadsheet .e-ss-object.e-datavisualization-chart {
        border: 1px solid;
    }

    .e-spreadsheet .e-ss-imgvisual {
        position: absolute;
        border: 2px solid;
        z-index: 12;
        display: none;
        box-sizing: content-box;
    }

    .e-spreadsheet .e-headercell.e-ss-colresize {
        cursor: col-resize;
    }

    .e-spreadsheet .e-rowheader.e-ss-rowresize {
        cursor: row-resize;
    }

    .e-spreadsheet .e-ss-apresize {
        cursor: col-resize;
    }

    .e-ss-imgcresize {
        cursor: col-resize !important;
    }

    .e-ss-imgrresize {
        cursor: row-resize !important;
    }

    .e-spreadsheet .e-ss-resetpictbtn, .e-ss-pictbrdrbtn {
        text-indent: 0px;
        line-height: 1px;
    }

    .e-insertsbtn {
        text-indent: -12px;
        line-height: 19px;
    }

    .e-deletesbtn {
        text-indent: -12px;
        line-height: 19px;
    }
    /*-----------------------Ribbon Control Alignments-----------------------------------*/
    .e-ss-cut + span {
        width: 130px !important;
    }
    /*------------------- Ribbon Control Alignments --------------------------------*/
    .e-spreadsheet .e-backstagecontent {
        padding-top: 0;
    }

    .e-spreadsheet .e-ssr-bstitle {
        font-size: 25px;
    }

    .e-spreadsheet .e-ssr-bscontent {
        margin-top: 10px;
    }

    .e-spreadsheet .e-ss-blank {
        background: url('@{font-path}/spreadsheet/blank.png') no-repeat;
        height: 121px;
        width: 149px;
    }

    .e-spreadsheet .e-ssr-bssaveasopt > span, .e-spreadsheet .e-ssr-bsprintopt > span {
        padding-left: 13px;
        font-size: 15px;
    }

    .e-spreadsheet .e-ssr-bssaveasopt:not(:first-child), .e-spreadsheet .e-ssr-bsprintopt:not(:first-child) {
        padding-top: 10px;
    }
    /*------------------- Print--------------------------------*/
    .e-spreadsheet .e-printhdrlbl, .e-spreadsheet .e-viewhdrlbl, .e-spreadsheet .e-printlinlbl, .e-spreadsheet .e-viewlinlbl {
        margin-bottom: 0;
        margin-left: 3px;
    }

    .e-spanfilter {
        border: 1px solid;
    }
    /*............DropDown list Support  in Cell*/
    .e-ssddl:before {
        content: "\e6a0";
        font-size: 7px;
        line-height: 16px;
        text-indent: 2px;
    }

    .e-spanddl {
        border: 1px solid;
    }

    .e-ddlspan {
        cursor: pointer;
        width: 16px;
        height: 15px;
        position: absolute;
    }

    .e-ss-previouscmnt + span, .e-ss-nextcmnt + span, .e-ss-deletecmnt + span {
        left: -10px;
        position: absolute;
        top: 18px;
    }

    .e-ss-tablestyle {
        margin-right: 8px;
    }

    .e-dlg-field-validation-error {
        border-radius: 7px;
        font-size: 14px;
        padding: 7px;
        line-height: 7px;
        margin-top: 5px;
    }

    .e-fatnamedlgrow, .e-chartnamedlgrow {
        margin-left: -15px;
        margin-top: -5px;
    }

    .e-spreadsheet .e-numeric .e-in-wrap {
        border: 1px solid;
    }

    .e-spreadsheet .e-ssr-chartwidth {
        margin-bottom: 10px;
    }

    .e-ss-dlgtabval .e-header > .e-bottom-line.e-active {
        height: 23px;
    }

    .e-ssdlg .e-nmclose {
        margin: 14px 0 0 449px;
    }

    .e-ss-dialog .e-dtvalbtndiv {
        width: 100%;
        margin-left: 59%;
        margin-top: 6px;
    }

    .e-ss-formatdlg .e-active-content .e-activetop {
        padding-left: 17px;
    }

    .e-ss-chrttitle {
        margin: 45px 0 0 -77px;
    }

    .e-ss-dialog .e-dlg-btnfields {
        padding: 9px 0px 2px 0px;
    }

    .e-ss-dialog .e-dlg-btnfields .e-dlg-btnctnr {
        width: 100%;
        text-align: right;
    }

    .e-ss-dialog .e-dlg-btnfields input,
    .e-ss-dialog .e-dlg-btnfields button {
        margin-left: 10px;
    }

    .e-resizediv .e-cformatbtn, .e-resizediv .e-formatastablebtn, .e-resizediv .e-cellstylebtn {
        font-size: 12px;
    }
    /*-----------Spreadsheet common dialog----------------*/
    .e-ss-dialog .e-tab .e-header.e-addborderbottom .e-active {
        border-top: 1px solid;
    }

    .e-ss-dialog input.e-btn.e-widget {
        box-sizing: content-box;
        height: 19px;
    }

    .e-ss-dialog > .e-titlebar {
        padding: 5px 0px;
        text-align: center;
    }

    .e-ss-dlgtabval > .e-content {
        height: 326px !important;
    }

    .e-ss-dlgtab > .e-header li a, .e-ss-dlgtabval > .e-header li a {
        line-height: 7px;
        font-size: 14px;
    }

    .e-ss-formatdlg {
        margin-left: -14px;
        margin-top: -7px;
    }

    .e-spreadsheet .e-atc.e-focus {
        box-shadow: none;
    }

    .e-menu .e-list .e-ss-cmenuitem > a {
        line-height: 38px;
        padding: 3px 10px 1px 34px;
    }

    .e-menu .e-list .e-ss-cmenuitem > a > span {
        top: 15%;
    }

    .e-ss-chartimg {
        background: url('@{font-path}/spreadsheet/charttab-sprites.png') no-repeat;
        height: 28px;
        width: 28px;
    }

    .e-ss-axes {
        background-position: -20px -22px;
    }

    .e-ss-phaxis {
        background-position: -12px -62px;
    }

    .e-ss-pvaxis {
        background-position: -67px -63px;
    }

    .e-ss-axistitle {
        background-position: -63px -23px;
    }

    .e-ss-phaxistitle {
        background-position: -109px -59px;
    }

    .e-ss-pvaxistitle {
        background-position: -160px -63px;
    }

    .e-ss-charttitle {
        background-position: -103px -19px;
    }

    .e-ss-ctnone {
        background-position: -210px -60px;
    }

    .e-ss-ctcenter {
        background-position: -113px -107px;
    }

    .e-ss-ctfar {
        background-position: -113px -107px;
    }

    .e-ss-ctnear {
        background-position: -113px -107px;
    }

    .e-ss-datalabels {
        background-position: -130px -22px;
    }

    .e-ss-dlnone {
        background-position: -62px -107px;
    }

    .e-ss-dlcenter {
        background-position: -17px -109px;
    }

    .e-ss-dlibase {
        background-position: -210px -108px;
    }

    .e-ss-dliend {
        background-position: -166px -109px;
    }

    .e-ss-dloend {
        background-position: -10px -158px;
    }

    .e-ss-gridline {
        background-position: -168px -21px;
    }

    .e-ss-pmajorh {
        background-position: -64px -161px;
    }

    .e-ss-pmajorv {
        background-position: -112px -159px;
    }

    .e-ss-pminorh {
        background-position: -161px -159px;
    }

    .e-ss-pminorv {
        background-position: -210px -160px;
    }

    .e-ss-legend {
        background-position: -212px -21px;
    }

    .e-ss-lnone {
        background-position: -11px -203px;
    }

    .e-ss-lleft {
        background-position: -108px -208px;
    }

    .e-ss-lright {
        background-position: -63px -205px;
    }

    .e-ss-ltop {
        background-position: -210px -207px;
    }

    .e-ss-lbottom {
        background-position: -161px -206px;
    }

    .e-ss-cmenuitem {
        height: 40px;
    }

    .e-ss-cmenuitem > span {
        width: 32px;
    }

    .e-menu.e-context li.e-list > ul li.e-list > a.e-ss-chartlayout {
        padding-left: 35px;
        padding-top: 3px;
    }

    .e-menu-wrap .e-morechart {
        padding: 1px;
    }

    .e-menu-wrap .e-chartheader {
        color: gray;
        font-family: 'Segoe UI';
        font-size: 14px;
        font-weight: bold;
        padding: 1px 3px 3px;
    }

    .e-menu-wrap .e-chartcell {
        box-sizing: border-box;
        display: inline-block;
        padding: 20px 22px;
        background: url('@{font-path}/spreadsheet/chart-sprites.png') no-repeat;
        width: 32px;
        height: 32px;
    }
    /*--columnchart--*/
    .e-menu-wrap .e-columnchart1 {
        background-position: -2px -5px;
    }

    .e-menu-wrap .e-columnchart2 {
        background-position: -53px -6px;
    }

    .e-menu-wrap .e-columnchart3 {
        background-position: -102px -5px;
    }

    .e-menu-wrap .e-columnchart4 {
        background-position: -154px -5px;
    }

    .e-menu-wrap .e-columnchart5 {
        background-position: -204px -5px;
    }

    .e-menu-wrap .e-columnchart6 {
        background-position: -253px -5px;
    }
    /*--barchart--*/
    .e-menu-wrap .e-barchart1 {
        background-position: -3px -56px;
    }

    .e-menu-wrap .e-barchart2 {
        background-position: -54px -57px;
    }

    .e-menu-wrap .e-barchart3 {
        background-position: -101px -57px;
    }

    .e-menu-wrap .e-barchart4 {
        background-position: -153px -57px;
    }

    .e-menu-wrap .e-barchart5 {
        background-position: -203px -55px;
    }

    .e-menu-wrap .e-barchart6 {
        background-position: -250px -53px;
    }
    /*--stockchart--*/
    .e-menu-wrap .e-stockchart1 {
        background-position: -301px -53px;
    }

    .e-menu-wrap .e-stockchart2 {
        background-position: -2px -105px;
    }
    /*--linechart--*/
    .e-menu-wrap .e-linechart1 {
        background-position: -54px -102px;
    }

    .e-menu-wrap .e-linechart2 {
        background-position: -103px -102px;
        margin-left: 21px;
    }
    /*--areachart--*/
    .e-menu-wrap .e-areachart1 {
        background-position: -154px -102px;
    }

    .e-menu-wrap .e-areachart2 {
        background-position: -201px -102px;
    }

    .e-menu-wrap .e-areachart3 {
        background-position: -252px -104px;
    }
    /*--piechart--*/
    .e-menu-wrap .e-piechart1 {
        background-position: -103px -151px;
    }

    .e-menu-wrap .e-piechart2 {
        background-position: -204px -154px;
        margin-left: 6px;
    }

    .e-menu-wrap .e-piechart3 {
        background-position: -153px -152px;
        margin-left: 9px;
    }
    /*--scterchart--*/
    .e-menu-wrap .e-scatterchart1 {
        background-position: -251px -154px;
    }

    .e-menu-wrap .e-scatterchart2 {
        background-position: -300px -154px;
    }

    .e-spreadsheet .e-ssr-exportxl + span, .e-spreadsheet .e-ssr-printselected + span, .e-spreadsheet .e-ssr-print + span, .e-spreadsheet .e-ssr-exportcsv + span {
        white-space: normal;
        padding-top: 18px;
        line-height: 14px;
    }

    .e-spreadsheet .e-ssr-namemngr + span {
        white-space: normal;
        padding-top: 12px;
    }

    .e-spreadsheet .e-ssr-srcolumn + span {
        white-space: normal;
        padding-top: 12px;
    }

    .e-spreadsheet .e-ssr-protectsheet + span,
    .e-spreadsheet .e-ssr-protect + span {
        white-space: normal;
    }

    .e-spreadsheet .e-ssr-charttype + span,
    .e-spreadsheet .e-ssr-selectdata + span {
        white-space: normal;
        padding-top: 12px;
    }

    .e-spreadsheet .e-ssr-celements {
        height: 30px;
    }

    .e-spreadsheet .e-ssr-celements + span {
        white-space: normal;
    }

    .e-spreadsheet .e-scrollbar .e-vscroll:hover, .e-spreadsheet .e-scrollbar .e-hscroll:hover {
        cursor: default;
    }

    .e-spreadsheet .e-content.e-viewbrdr {
        border-top: 1px solid;
    }
    /*------------------------------------chart Type Dialog-------------------------------*/
    .e-ndialog {
        margin-top: 5px;
        margin-left: 10px;
    }

    .e-chtdlgtab .e-content {
        height: 355px;
    }

    .e-chtdlgright {
        float: right;
        height: 95%;
        margin-right: -15px;
        width: 74%;
    }

    .e-chtdlgleft {
        border-right: 1px solid;
        float: left;
        height: 100%;
        margin-left: -14px;
        width: 26%;
    }

    .e-chtdlgcontent {
        float: left;
		height: 100%;
		margin: 2px;
    }

    .e-chtdlgleft .e-listbox > li {
        padding: 4px;
    }

    .e-chartdlgok {
        margin-right: 6px;
    }

    .e-chartdlgcncl {
        margin-right: 2px;
    }

    .e-chartimg {
        display: inline-block;
        padding: 25px;
        background: url('@{font-path}/spreadsheet/charttype-sprites.png') no-repeat;
        width: 35px;
        height: 35px;
        margin: 5px;
        border: 2px solid transparent;
    }

    .e-ss-dialog, .e-ss-dlgtab {
        line-height: normal;
    }

    .e-ss-dialog label {
        display: inline-block;
    }

    .e-ss-dialog input {
        font-family: inherit;
        font-size: inherit;
        line-height: inherit;
    }

    .e-ss-dialog .e-dlg-fields {
        margin: 0px;
    }

    .e-ss-dialog .e-dialog .e-dlgctndiv input.ejinputtext {
        box-sizing: border-box;
        width: 100%;
        height: 27px;
        text-indent: 5px;
    }

    .e-ss-dialog .e-dialog .e-dlgctndiv table {
        width: 100%;
        white-space: pre-wrap;
    }

    .e-ss-dialog .e-dialog .e-dlgctndiv .e-dlgtd-fields td {
        padding-top: 7px;
    }

    .e-ss-dlgtab table {
        border-spacing: 0;
        border-collapse: collapse;
    }
    /*--columnchart--*/
    .e-dlgcolumnchart1 {
        background-position: -9px -5px;
    }

    .e-dlgcolumnchart2 {
        background-position: -102px -5px;
    }

    .e-dlgcolumnchart3 {
        background-position: -192px -5px;
    }

    .e-dlgcolumnchart4 {
        background-position: -282px -6px;
    }

    .e-dlgcolumnchart5 {
        background-position: -372px -6px;
    }

    .e-dlgcolumnchart6 {
        background-position: -465px -11px;
    }
    /*--barchart--*/
    .e-dlgbarchart1 {
        background-position: -9px -105px;
    }

    .e-dlgbarchart2 {
        background-position: -100px -106px;
    }

    .e-dlgbarchart3 {
        background-position: -192px -105px;
    }

    .e-dlgbarchart4 {
        background-position: -281px -104px;
    }

    .e-dlgbarchart5 {
        background-position: -373px -105px;
    }

    .e-dlgbarchart6 {
        background-position: -464px -103px;
    }
    /*--radarchart--*/
    .e-dlgradarchart1 {
        background-position: -9px -211px;
    }

    .e-dlgradarchart2 {
        background-position: -100px -210px;
    }
    /*--linechart--*/
    .e-dlglinechart1 {
        background-position: -466px -204px;
    }

    .e-dlglinechart2 {
        background-position: -8px -307px;
    }
    /*--areachart--*/
    .e-dlgareachart1 {
        background-position: -192px -208px;
    }

    .e-dlgareachart2 {
        background-position: -282px -207px;
    }

    .e-dlgareachart3 {
        background-position: -373px -208px;
    }
    /*--piechart--*/
    .e-dlgpiechart1 {
        background-position: -282px -309px;
    }

    .e-dlgpiechart2 {
        background-position: -191px -309px;
    }

    .e-dlgpiechart3 {
        background-position: -100px -309px;
    }
    /*--scterchart--*/
    .e-dlgscatterchart1 {
        background-position: -373px -305px;
    }
    /*---------------------------Spreadsheet Resizing Icons 100% width-----------------------*/
	.e-spreadsheet .e-ribbon .e-icon.e-Alignment:before {
        font-family: 'ej-xlfont';
        content: "\e68c";
        font-size: 32px;
        text-indent: 10px;
    }
	.e-spreadsheet .e-ribbon.e-responsive .e-icon.e-Alignment:before {
		text-indent: -3px;
	}
    .e-Clipboard:before {
        font-family: 'ej-xlfont';
        content: "\e600";
        font-size: 32px;
        text-indent: 8px;
    }

    .e-Actions:before {
        font-family: 'ej-xlfont';
        content: "\e61c";
        font-size: 32px;
    }

    .e-Number:before {
        font-family: 'ej-xlfont';
        content: "\e61e";
        font-size: 32px;
        text-indent: 3px;
    }

    .e-Font:before {
        font-family: 'ej-xlfont';
        content: "\e609";
        font-size: 32px;
        text-indent: -6px;
    }

    .e-Styles:before {
        font-family: 'ej-xlfont';
        content: "\e677";
        font-size: 32px;
        text-indent: 0;
        width: 32px;
    }

    .e-Editing:before {
        font-family: 'ej-xlfont';
        content: "\e635";
        font-size: 32px;
    }

    .e-Changes:before {
        font-family: 'ej-xlfont';
        content: "\e6a8";
        font-size: 32px;
        text-indent: 5px;
    }

    .e-Calculation:before {
        font-family: 'ej-xlfont';
        content: "\e6ad";
        font-size: 32px;
        text-indent: 15px;
    }

    .e-ss-hide, .e-spreadsheet .e-hide {
        display: none;
    }

    .e-spreadsheet .e-hcol {
        border-right-width: 2px;
    }

    .e-spreadsheet .e-hrow {
        border-bottom-width: 2px;
    }

    .e-spreadsheet .e-hfcol {
        border-right: 1px solid;
    }

    .e-spreadsheet .e-hfrow {
        border-bottom: 2px solid;
    }

    .e-spreadsheet .e-filterhdr {
        white-space: pre;
    }

    .e-ss-colorpicker .e-in-wrap.e-tool, .e-ss-colorpicker .e-in-wrap.e-tool .e-select {
        border: medium none;
    }

    .e-spreadsheet .e-colselected,
    .e-spreadsheet .e-colhighlight {
        font-weight: bold;
    }

    .e-spreadsheet .e-rowselected,
    .e-spreadsheet .e-rowhighlight {
        font-weight: bold;
    }

    .ej-ssgrid .e-gridcontent .e-ss-emptyrecord, .ej-ssgrid .e-gridcontent .emptyrecord {
        text-align: center;
    }

    .e-ss-dialog .e-addedrow .e-button, .e-ss-dialog .e-editedrow .e-button {
        width: 60px !important;
        margin-left: 10px !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
        border-radius: 4px 4px 4px 4px;
    }

    .e-insertdialog .e-contentdialog td {
        padding-left: 0;
        padding-right: 5px;
    }

    .e-spreadsheet .e-ejinputtext {
        text-indent: 5px;
    }

    .e-ss-dialog .e-ejinputtext {
        text-indent: 5px;
    }

    .e-ss-ddlwrap {
        display: none;
    }

    .e-ss-dialog .e-btn.e-txt {
        padding: .2em .2em;
    }

    .e-ss-frdlg .e-btn.e-txt {
        line-height: 15px;
    }

    .e-ss-frdlg .e-dlg-btnctnr input {
        margin-right: 0px;
    }

    .e-frow {
        border-bottom: 1px solid;
        position: absolute;
    }

    .e-fcol {
        border-right: 1px solid;
        position: absolute;
    }

    .e-ss-menuclrpkr .e-popupWrapper .e-row {
        height: 21px;
    }

    .e-ss-menuclrpkr .e-popupWrapper {
        margin-top: -5px;
    }

    .e-spreadsheet .e-formatastable-back, .e-spreadsheet .e-cellstyles-back, .e-spreadsheet .e-border-back {
        float: right;
    }

    .e-spreadsheet .e-icon.e-ss-leftarrow:before {
        font-family: 'ej-webfont';
        content: "\e819";
    }

    .e-spreadsheet .e-icon.e-ssr-resizetable {
        padding-top: 1px;
        padding-bottom: 6px;
    }

    .e-spreadsheet.e-split.e-context li.e-list.e-haschild span {
        overflow: visible;
    }

    .e-spreadsheet.e-split.e-context li.e-list.e-haschild ul li.e-list span {
        overflow: visible;
    }

    .e-ss-colorpicker .e-popupWrapper {
        margin: -3px 0px;
    }

    .e-ss-colorpicker.e-ss-menuclrpkr .e-popupWrapper {
        margin: -4px 1px;
    }

    .e-ss-colorpicker .e-colorpicker .e-footer {
        margin-left: -1px;
    }
    /*-------------------------------------Spreadsheet Ribbon override------------*/
    .e-spreadsheet .e-ribbon .e-header {
        border-right: none;
        border-left: none;
        border-top: none;
    }

    .e-spreadsheet .e-ribbon .e-content {
        border-right: none;
        border-left: none;
    }

    .e-spreadsheet .e-ribbon .e-header .e-menu ul span {
        margin-top: 0;
    }

    .e-spreadsheet .e-ribbon .e-header > .e-bottom-line.e-active {
        margin-top: 1px;
    }

    .e-spreadsheet .e-ribbon .e-tooltipdiv {
        width: 200px;
    }

    .e-spreadsheet .e-ribbon .e-tooltipdiv .e-tooltipcontent {
        width: 180px;
    }

    .e-spreadsheet .e-ribbon .e-ribbonbackstagepage {
        border-top-width: 0;
		border-left-width: 0;
    }

    .e-spreadsheet .e-ribbon .e-btntxt {
        font-size: 12px;
    }

    .e-spreadsheet .e-ribbon .e-ssr-fontfamily, .e-spreadsheet .e-ribbon .e-ssr-fontsize {
        padding: 0;
    }

    .e-spreadsheet .e-backstagetopicon {
        text-indent: 16px;
        left: 0;
    }
    /*-------------------------------------Spreadsheet Autocomplete Override------*/
    .e-ss-autocomplete.e-atc-popup ul li {
        font-size: 11px;
    }
    /*-------------------------------------Spreadsheet Split Button override------*/
    .e-ssr-pagesizesbtn > .e-split-btn-div {
        text-indent: 31px;
        height: 32px;
    }

    .e-spreadsheet.e-cformatbtn > .e-split-btn-div {
        text-indent: 33px;
        top: 54px;
    }

    .e-spreadsheet.e-mergebtn > .e-split-btn-div {
        top: 14px;
    }

    .e-spreadsheet.e-autosumbtn > .e-split-btn-div {
        top: 13px;
        text-indent: -2px;
    }

    .e-spreadsheet.e-cellstylebtn > .e-split-btn-div {
        text-indent: 21px;
        top: 54px;
    }

    .e-spreadsheet.e-pastebtn > .e-split-btn-div {
        text-indent: -4px;
    }

    .e-spreadsheet.e-formatastablebtn > .e-split-btn-div {
        text-indent: 23px;
        top: 55px;
    }

    .e-spreadsheet.e-useinformulabtn > .e-split-btn-div {
        text-indent: 57px;
        top: 4px;
    }

    .e-spreadsheet .e-ss-resetpictbtn > .e-split-btn-div, .e-ss-pictbrdrbtn > .e-split-btn-div {
        top: 20px;
        text-indent: -1px;
    }

    .e-insertsbtn > .e-split-btn-div {
        text-indent: 0px;
        height: 18px;
    }

    .e-deletesbtn > .e-split-btn-div {
        text-indent: 0px;
        height: 18px;
    }

    .e-spreadsheet.e-sortfltrbtn > .e-split-btn-div {
        text-indent: 18px;
        height: 21px;
    }

    .e-spreadsheet.e-clearbtn > .e-split-btn-div {
        top: 14px;
        text-indent: -2px;
    }

    .e-spreadsheet.e-findbtn > .e-split-btn-div {
        text-indent: 19px;
        height: 22px;
    }

    .e-spreadsheet.e-coptbtn > .e-split-btn-div {
        text-indent: 29px;
        height: 22px;
    }

    .e-spreadsheet.e-pagesizebtn > .e-split-btn-div {
        text-indent: 0px;
    }

    .e-spreadsheet.e-chartbtn > .e-split-btn-div {
        text-indent: 12px;
    }

    .e-spreadsheet.e-fpanebtn > .e-split-btn-div {
        text-indent: 19px;
        height: 22px;
    }

    .e-spreadsheet.e-chartlayoutbtn > .e-split-btn-div {
        text-indent: 25px;
        height: 22px;
    }

    .e-ssr-validationsbtn > .e-split-btn-div {
        text-indent: 30px;
        top: 16px;
    }

    .e-spreadsheet .e-ssr-horizontalprt .e-split-btn-div .e-arrow-sans-down:before {
        text-indent: -8px;
        line-height: 14px;
    }

    .e-ssr-pastesbtn > .e-split-btn-div {
        text-indent: 0px;
        top: 17px;
    }

    .e-spreadsheet.e-autofillbtn > .e-split-btn-div {
        text-indent: 4px;
    }
    /*-------------------------------------Spreadsheet Colorpicker override-------*/
    .e-spreadsheet .e-ss-colorpicker.e-colorwidget .e-in-wrap,
    .e-spreadsheet .e-ss-colorpicker.e-colorwidget {
        border-radius: 0px;
    }

    .e-spreadsheet .e-ss-colorpicker.e-colorwidget .e-in-wrap.e-tool {
        height: 26px;
    }

    .e-spreadsheet .e-ss-colorpicker.e-colorwidget .e-color-container {
        width: 59%;
    }

    .e-ss-colorpicker.e-colorwidget .e-tool-icon .e-selected-color {
        bottom: 0;
        left: 0;
    }

    .e-ss-colorpicker.e-colorpicker .e-footer .e-applyButton {
        left: 51px;
    }

    .e-ss-colorpicker.e-colorpicker.e-popup {
        width: 199px;
        padding-right: 0;
        padding-top: 10px;
        padding-bottom: 5px;
    }

    .e-ss-colorpicker.e-colorpicker .e-palette-color,
    .e-popupWrapper .e-container {
        min-height: 104px;
    }

    .e-ss-colorpicker.e-colorpicker .e-row .e-item {
        height: 12px;
        width: 12px;
    }

    .e-ss-colorpicker.e-colorwidget {
        height: 26px;
        width: 37px;
    }

    .e-spreadsheet .e-colorwidget .e-color-container .e-ss-backgroundcolor + .e-selected-color,
    .e-spreadsheet .e-colorwidget .e-color-container .e-ss-fontcolor + .e-selected-color {
        margin-left: -1px;
        margin-top: 1px;
    }

    .e-colorpicker.e-popup.e-ss-menuclrpkr {
        border: 0 none;
    }

    .e-ss-colorpicker.e-ss-menuclrpkr.e-colorpicker.e-popup {
        padding-bottom: 11px;
    }
    /*-------------------------------------Spreadsheet dialog override------------*/
    .e-dialog .e-crcontent {
        width: 100%;
        height: 100%;
    }

    .e-dialog .e-crlcell {
        float: left;
        width: 46%;
    }

    .e-dialog .e-crrcell {
        width: 50%;
        float: left;
        margin: 2px;
    }

    .e-dialog .e-crcontent .e-crrcell input {
        outline: none;
        width: 100%;
        text-indent: 5px;
    }

    .e-dialog .e-cractionbtn {
        margin-left: 45%;
        height: 37px;
    }

    .e-dialog .e-cractionbtn button {
        margin: 2px;
    }

    .e-dialog .e-alertdlgcontent {
        height: auto;
        padding-bottom: 7px;
        text-align: justify;
    }

    .e-dialog .e-alertdlgcontent ul {
        margin-bottom: 0px;
    }

    .e-dialog .e-custominput {
        width: 100%;
    }

    .e-dialog .ej-ssgrid .e-rowcell {
        border: 0;
    }

    .e-dialog .e-nmdlg {
        padding: 10px;
    }

    .e-dialog .e-nmdlgcont {
        margin: 0px 2px;
    }

    .e-dialog .e-nmclose {
        margin-top: 10px;
        margin-right: -1px;
    }

    .e-dialog .e-nmscope {
        opacity: 0.4;
    }

    .e-dialog .e-nmdlgdiv {
        padding-top: 10px;
    }

    .e-dialog .e-formatastabletext {
        margin-left: -5px;
        width: 283px;
    }

    .e-dialog .e-fatnamedlgcell, .e-dialog .e-chartnamedlgcell {
        float: left;
        width: 150px;
        padding: 5px;
        margin: 5px;
    }

    .e-dialog .e-fatnamedlgbtn, .e-dialog .e-chartnamedlgbtn {
        float: left;
        width: 50px;
    }

    .e-dialog .e-fatresizetablecell {
        display: inline-block;
        width: 220px;
        padding: 5px;
        margin: 5px 5px 5px -5px;
    }

    .e-dialog .e-fatresizetablerow {
        width: 480px;
    }

    .e-dialog .e-fatresizetablebtn {
        float: left;
        width: 70px;
        position: relative;
        left: 335px;
    }

    .e-dialog-modal {
        overflow: hidden;
    }

    .e-dialog .e-ss-dlgtab .e-content .e-chkbox-wrap, .e-dialog .e-ss-dlgtabval .e-content .e-chkbox-wrap {
        padding: 5px 5px 5px 0px;
    }

    .ej-ssgrid .e-dialog .e-addedrow {
        padding-bottom: 0px;
    }

    .ej-ssgrid .e-dialog .e-addedrow table, .ej-ssgrid .e-dialog .e-editedrow table {
        border-spacing: 1px !important;
    }

    .ej-ssgrid .e-dialog .e-addedrow table input, .ej-ssgrid .e-dialog .e-addedrow table textarea,
    .ej-ssgrid .e-dialog .e-editedrow table input, .ej-ssgrid .e-dialog .e-editedrow table textarea {
        text-align: left !important;
    }

    .e-insertdialog.e-widget-content.e-dialog {
        padding: 9px;
    }

    .e-ssr-bscontent div:not(.e-ssr-bsnewtmpl) .e-btn.e-select {
        border: 1px solid transparent;
    }

    .e-borderbtn div span.e-icon:before {
        line-height: 13px;
        text-indent: 0px;
        font-size: 15px;
    }

    .e-ss-menuclrpkr .e-footerContainer {
        display: none;
    }
    /*---------- Excel Like Filter Changes------- */
    .e-spreadsheet .e-excelfilter .e-btncontainer input {
        padding: .2em .4em .3em;
    }

    .e-spreadsheet.e-dlgcontainer .e-dlgBtns .e-clear {
        padding: 3px;
    }

    .e-spreadsheet.e-dlgcontainer .e-dlgBtns .e-filter {
        padding: 3px;
    }

    .e-ssr-protect:before {
        content: "\e6a7";
        font-family: "ej-xlfont";
        font-size: 32px;
        text-indent: -9px;
        line-height: 18px;
    }

    .e-spreadsheet .e-rowcell.e-ofbrdr {
        border-right: 0px;
    }

    .e-spreadsheet .e-rmanchor {
        cursor: cell;
        pointer-events: none;
    }

    .e-spreadsheet .e-btnhgt {
        height: 100%;
    }

    .e-spreadsheet .e-ssr-protectsheet:before {
        content: "\e6a8";
        font-family: "ej-xlfont";
        font-size: 32px;
        line-height: 18px;
        text-indent: -10px;
    }

    .e-spreadsheet .e-ss-cmenuprotect:before {
        content: "\e6a9";
        font-family: "ej-xlfont";
        font-size: 16px;
    }

    .e-ssr-protlockcell:before {
        content: "\e6ae";
        font-family: "ej-xlfont";
        font-size: 20px;
        line-height: 12px;
        text-indent: -4px;
    }

    .e-ssr-protunlockcell:before {
        content: "\e6af";
        font-family: "ej-xlfont";
        font-size: 20px;
        line-height: 12px;
        text-indent: -4px;
    }

    .e-spreadsheet {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    .e-spreadsheetcolumnheader, .e-spreadsheet .e-inputbox, .e-spreadsheet .e-autofill {
        -webkit-box-sizing: content-box;
        -moz-box-sizing: content-box;
        box-sizing: content-box;
    }
    /*--------textarea------------*/
    .e-ss-textarea, .e-ss-textarea:focus, .e-ss-textarea:hover {
        outline: none;
        border-width: 1px;
    }
    /*------VS2010-MVC3-site.css dialog-table-css-override------*/
    .e-spreadsheet .e-ribbon table td, .e-ss-dialog table td {
        border: none;
        padding: 0px;
    }

    .e-spreadsheet .e-ribbon table, .e-ss-dialog table {
        border: none;
    }
    /*--------Spreadsheet Pivot table------------*/
    .e-spreadsheet .e-ssr-datarefresh:before {
        content: "\e6b5";
        font-family: "ej-xlfont";
        font-size: 32px;
        line-height: 4px;
        text-indent: -8px;
    }

    .e-spreadsheet .e-ssr-changedatasource:before {
        content: "\e6b7";
        font-family: "ej-xlfont";
        font-size: 32px;
        line-height: 4px;
        text-indent: -9px;
    }

    .e-spreadsheet .e-ssr-pivotclearall:before {
        content: "\e6b8";
        font-family: "ej-xlfont";
        font-size: 16px;
        line-height: 16px;
        text-indent: -1px;
    }

    .e-spreadsheet .e-ssr-movepivottable:before {
        content: "\e6b6";
        font-family: "ej-xlfont";
        font-size: 16px;
        line-height: 13px;
        text-indent: -4px;
    }

    .e-spreadsheet .e-ssr-fieldlist:before {
        content: "\e6b2";
        font-family: "ej-xlfont";
        font-size: 32px;
        line-height: 4px;
        text-indent: -10px;
    }

    .e-ss-pivotrefresh:before {
        content: "\e6b4";
        font-family: "ej-xlfont";
        font-size: 16px;
        text-indent: 3px;
    }

    .e-menu-wrap .e-formatastable-adaptive {
        width: 100%;
        height: 100%;
        overflow-x: hidden;
    }
	
	.e-spreadsheet .e-bordercontainer {
		 position: absolute;
		top: 0px;
		left: 0px;
		height: 99%;
		width: 100%;
		z-index: 10007;
	}
	
	.e-spreadsheet .e-bordercell {
		width: 63px;
		height: 48px;
		padding: 3px;
		display: inline-block;
		border: 2px solid transparent;
	}
	
	.e-spreadsheet .e-ss-border-content {
		padding: 15px 15px 15px 28px;
	}
	
	.e-spreadsheet .e-ss-bdr-header {
		height: 25px;
		border-bottom: 1px solid;
	}
	
	.e-ribbon .e-icon.e-ss-border:before {
		font-size: 40px;
		display: inline-block;
		vertical-align: middle;
		line-height: 1.16;
		text-indent: 12px;
	}
	.e-spreadsheet .e-border-back {
		float: right;
		padding-top: 6px;
	}

	.e-spreadsheet ul.e-adaptive {
		top: 32px !important;
		left: 0px !important;
	}
	
    .e-mobileNavigation:before {
        content: "\e75d";
        font-size: 22px;
    }

    .e-mobileNavigation {
        position: absolute;
        float: left;
        padding: 12px 10px 0px 0px;
    }

    .e-spreadsheet .e-lv .e-list .e-list-img {
        height: 28px;
        width: 0px;
    }

    .e-ss-dlgtab > .e-content {
        position: relative;
        height: 100%;
    }

    .e-format-Number:before {
        font-family: 'ej-xlfont';
        content: "\e61e";
        font-size: 22px;
        text-indent: 3px;
    }

    .e-menu-wrap .e-formatastable-adaptive, .e-menu-wrap .e-cellstyles-adaptive, .e-border-adaptive {
        width: 100%;
        height: 100%;
        top: 0 !important;
        left: 0 !important;
    }

    .e-dlgctndiv .e-ss-dlgtab > .e-content {
        padding: 7px 14px 7px 14px;
    }

    .e-ss-dialog .e-lv .e-list.e-margin .e-chevron-right_01 span {
        left: 0;
    }

    .e-chartimg {
        float: left;
    }

    .e-spreadsheet .e-groupexpander.e-disable {
        cursor:default;
        background:none;
	 }

     .e-spreadsheet .e-groupexpander.e-disable:hover {
         background:none;
	 }

     /* PivotTable Customization*/

   .e-spreadsheet .e-spreadsheetcontentcontainer .e-pivotgrid th, 
   .e-spreadsheet .e-spreadsheetcontentcontainer .e-pivotgrid td {
            padding-top:0px;
            padding-bottom:0px;
            height:19px;
            box-sizing:content-box;
	    }
    /*-------------------------------------SpreadSheet End -----------------------*/
}

.mixin(@widget) when (@widget = radialslider), (@widget = none) {
    /*---------------------------------------Radial slider start---------------------------*/
    @-webkit-keyframes radialslidershow /* Safari and Chrome */ {
        from {
            -ms-transform: rotate(0deg);
            -moz-transform: rotate(0deg);
            -webkit-transform: rotate(0deg);
            -o-transform: rotate(0deg);
            transform: rotate(0deg);
        }

        to {
            -ms-transform: rotate(360deg);
            -moz-transform: rotate(360deg);
            -webkit-transform: rotate(360deg);
            -o-transform: rotate(360deg);
            transform: rotate(360deg);
        }
    }

    @keyframes radialslidershow {
        from {
            -ms-transform: rotate(0deg);
            -moz-transform: rotate(0deg);
            -webkit-transform: rotate(0deg);
            -o-transform: rotate(0deg);
            transform: rotate(0deg);
        }

        to {
            -ms-transform: rotate(360deg);
            -moz-transform: rotate(360deg);
            -webkit-transform: rotate(360deg);
            -o-transform: rotate(360deg);
            transform: rotate(360deg);
        }
    }

    @-webkit-keyframes radialsliderhide /* Safari and Chrome */ {
        from {
            -ms-transform: rotate(360deg);
            -moz-transform: rotate(360deg);
            -webkit-transform: rotate(360deg);
            -o-transform: rotate(360deg);
            transform: rotate(360deg);
        }

        to {
            -ms-transform: rotate(0deg);
            -moz-transform: rotate(0deg);
            -webkit-transform: rotate(0deg);
            -o-transform: rotate(0deg);
            transform: rotate(0deg);
        }
    }

    @keyframes radialsliderhide {
        from {
            -ms-transform: rotate(360deg);
            -moz-transform: rotate(360deg);
            -webkit-transform: rotate(360deg);
            -o-transform: rotate(360deg);
            transform: rotate(360deg);
        }

        to {
            -ms-transform: rotate(0deg);
            -moz-transform: rotate(0deg);
            -webkit-transform: rotate(0deg);
            -o-transform: rotate(0deg);
            transform: rotate(0deg);
        }
    }

    .e-slider-show {
        -webkit-animation: radialslidershow 2s;
        -moz-animation: radialslidershow 2s;
        -ms-animation: radialslidershow 2s;
        -o-animation: radialslidershow 2s;
        animation: radialslidershow 2s;
    }

    .e-slider-hide {
        -webkit-animation: radialsliderhide 2s;
        -moz-animation: radialsliderhide 2s;
        -ms-animation: radialsliderhide 2s;
        -o-animation: radialsliderhide 2s;
        animation: radialsliderhide 2s;
    }



    .e-radialslider-svg-show {
        -webkit-animation: clock 2s;
        -moz-animation: clock 2s;
        -ms-animation: clock 2s;
        -o-animation: clock 2s;
        animation: clock 2s;
    }

    .e-radialslider .e-rs-svg {
        border-radius: 50%;
    }

    .e-radialslider-svg-hide {
        -webkit-animation: anticlock 2s;
        -moz-animation: anticlock 2s;
        -ms-animation: anticlock 2s;
        -o-animation: anticlock 2s;
        animation: anticlock 2s;
    }

    @keyframes clock {
        0% {
            opacity: 0;
        }

        25% {
            opacity: 0.25;
        }

        50% {
            opacity: 0.75;
        }

        100% {
            opacity: 1;
        }
    }

    @keyframes anticlock {
        0% {
            opacity: 1;
        }

        25% {
            opacity: 0.35;
        }

        50% {
            opacity: 0.25;
        }

        100% {
            opacity: 0;
        }
    }


    .e-radialslider .e-inner-circle {
        background-position: center center;
        background-repeat: no-repeat;
        background-size: 60% auto;
        border: 4px solid;
        border-radius: 50%;
        height: 40px;
        width: 40px;
        z-index: 1;
        position: absolute;
        background-color: white;
    }


    .e-radail-slider-wrapper {
        position: relative;
    }
    /*---------------------------------------------Radial slider end-------------------------------------*/
}

/*------------------------------------- Spell Check -------------------------------------------*/
.mixin(@widget) when (@widget = spellchecker), (@widget = none) {

    .e-spellcheck .e-btnaddtodictionary,
    .e-spellcheck .e-btnignoreall,
    .e-spellcheck .e-btnchangeall,
    .e-spellcheck .e-btnclose {
        margin-top: 6px;
    }

    .e-spellcheckparent .e-dictionarylabel,
    .e-lablesuggestions {
        font-weight: 400;
    }

    .e-spellcheck .e-spellcheckdialog {
        padding: 0.5em;
    }

    .e-spellcheck .e-sentence {
        width: 295px;
        border: 1px solid;
        box-sizing: border-box;
    }

    .e-spellcheck .e-sentencecontent {
        padding: 2px;
    }

    .e-spellcheck .e-errorword {
        background-image:  url('common-images/spellcheck/highlight.png');
        background-repeat: repeat-x;
        background-position: bottom;
    }

    .e-spellcheckparent .e-errorword {
        font-weight: bold;
        background-image: none;
    }

    .e-spellcheck .e-cell {
        height: 90px;
    }

    .e-spellcheck .e-sentencecell, .e-suggestioncell {
        width: 65%;
        float: left;
    }

    .e-spellcheck .e-buttoncell {
        height: 90px;
        width: 32%;
        float: right;
    }

    .e-spellcheck .e-labelcell, .e-spellcheck .e-dialogdiv{
        padding-bottom: 2px;
    }
}