/*#region CSS Overide By Ronald Maghilum */
body {
    background-color: #7fc4f0 20%;
    background-image: url(../Content/images/bg-pattern.svg),radial-gradient(farthest-side ellipse at 10% 0, #7dd1ec 20%, #137abb);
    background-image: url(../Content/images/bg-pattern.svg),-webkit-radial-gradient(10% 0, farthest-side ellipse, #7dd1ec 20%, #137abb);
    background-image: url(../Content/images/bg-pattern.svg),-moz-radial-gradient(10% 0, farthest-side ellipse, #7dd1ec 20%, #137abb);
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
}

#navigation {
    background: rgba(255, 255, 255, 0.75);
}

#wrapper {
    background: transparent;
    border-left: none;
}

.rm-table-responsive .k-grid-header th.k-header > .k-link {
    font-weight: 700;
    font-size: 10pt;
    text-align: center;
    font-family: 'Segoe UI';
}

.rm-table-responsive .k-grid-content {
    min-height: 30px;
    height: 100% !important;
    overflow-y: hidden !important;
}

    /*.rm-table-responsive .k-grid-content tr:not(.k-no-data):hover {
    background-color: #b3ddf8 !important;
}*/

    .rm-table-responsive .k-grid-content tr.k-state-selected {
        background-color: #78c4f6 !important;
    }

.rm-table-responsive .k-grid-content-locked {
    height: 100% !important;
}

.rm-table-responsive .k-grid-header {
    padding-right: 0px !important;
    margin-right: 0px !important;
}

.rm-table-responsive .k-grid-header-locked + .k-grid-header-wrap {
    border-right: none !important;
}

.rm-table-responsive .k-header.k-grid-toolbar.k-grid-top {
    text-align: right;
}

.modal-header {
    padding: 5px 30px;
    background: #f7f9fa;
}

.modal-footer {
    padding: 8px;
}

.k-textbox, .k-dropdown-wrap, .k-picker-wrap, .k-numeric-wrap {
    border-width: 1px !important;
    border-color: #e4e5e7 !important;
    height: 27px !important;
}

    .k-textbox > input, .k-autocomplete .k-input, .k-picker-wrap .k-input, .k-numeric-wrap .k-input, .k-dropdown-wrap .k-input, .k-selectbox .k-input {
        height: 1.65em !important;
        line-height: 1.65em !important;
        padding: .177em 0 !important;
        text-indent: .33em !important;
        border: 0 !important;
        margin: 0 !important;
    }

    .k-picker-wrap .k-icon {
        margin-top: 4px !important;
    }

.k-tooltip-validation .k-warning {
    margin-top: 1px !important;
    margin-left: 1px !important;
}

.alert ul {
    padding-left: 20px;
    padding-right: 10px;
    margin-bottom: 0px;
    margin-left: 0px;
}

.alert li {
    margin-left: 3px;
    margin-right: 5px;
    list-style: none;
    text-align: left;
}

    .alert li:before {
        content: "";
        font-family: FontAwesome;
        position: absolute;
        margin-left: -18px;
    }

.alert {
    margin: 4px;
    margin: 0;
    padding: 0;
    box-sizing: content-box;
}

.alert {
    margin-bottom: 20px;
    margin-top: 0;
    color: #675100;
    border-width: 0;
    border-left-width: 5px;
    padding: 8px;
    border-radius: 2px;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
}

.k-widget.k-tooltip-validation {
    width: auto !important;
}

.k-numeric-wrap {
    padding-bottom: 1px;
}

    .k-numeric-wrap .k-tooltip-validation {
        margin-left: -6px;
    }

    .k-numeric-wrap .k-input {
        margin-top: 0px !important;
        font-size: 11pt;
        line-height: 10pt;
    }

    .k-numeric-wrap .k-select span {
        background-color: transparent;
        margin-top: 1px;
    }

.k-datepicker.form-control, .k-dropdown.form-control, .k-combobox.form-control {
    border: none !important;
}

.k-calendar .k-nav-fast {
    background-color: transparent !important;
}

    .k-calendar .k-nav-fast:hover {
        background-color: #3498db;
    }

.arrow {
    position: absolute !important;
    right: 8px !important;
    top: 35% !important;
}

.k-pager-wrap .k-icon:not(.k-i-refresh) {
    margin-top: -4px;
}

.k-pager-wrap .k-link::after {
    top: 43% !important;
}

.k-combobox .k-icon {
    margin-top: 4px;
}

.k-multiselect.k-header {
    border-radius: 4px !important;
    border-color: #e4e5e7 !important;
    min-height: 34px;
}

.k-multiselect .k-multiselect-wrap {
    border-radius: 2px !important;
}

.k-multiselect-wrap .k-input {
    height: 28px;
}

.k-multiselect {
    background-color: transparent !important;
}

.k-multiselect-wrap li {
    line-height: 1.9em;
    border-radius: 4px;
    background-color: #3498db;
    border-color: #3498db;
}

    .k-multiselect-wrap li.k-state-hover {
        margin-left: 1px !important;
        padding-left: 5px !important;
        margin-right: 0px !important;
        background-color: #777;
        border-color: #666;
    }

.k-list li.k-state-hover {
    margin-left: 1px !important;
    padding-left: 5px !important;
    margin-right: 0px !important;
}

.k-state-selected,.k-state-selected:hover {
    background-color: #78c4f6 !important;
}

.k-multiselect .k-loading {
    bottom: 9px;
}

.k-autocomplete, .k-picker-wrap, .k-numeric-wrap, .k-dropdown-wrap, .k-multiselect.k-header {
    background-image: none !important;
}

    .k-autocomplete.k-state-disabled, .k-picker-wrap.k-state-disabled, .k-numeric-wrap.k-state-disabled, .k-dropdown-wrap.k-state-disabled, .k-multiselect.k-header.k-state-disabled {
        background-image: none !important;
        background-color: #eee;
    }

span.k-datepicker, span.k-timepicker, span.k-datetimepicker, span.k-colorpicker, span.k-numerictextbox, span.k-combobox, span.k-dropdown, .k-toolbar .k-split-button {
    background: none;
}
/*#endregion */

.table {
    margin-bottom: 0px;
}

.form-label-required::after {
    content: " *" !important;
    color: #f54c53 !important;
    font-size: 15px;
    line-height: 13px;
    font-weight: 700;
}

.form-label-required-before::before{
    content: "* " !important;
    color: #f54c53 !important;
    font-size: 15px;
    font-weight: 700;
}

/*#region Log-in */

.login-logo {
    width: 45% !important;
    height: auto !important;
}

/*#endregion */


/*#region wizard 1 */

.bootstrapWizard {
    display: block;
    list-style: none;
    padding: 0;
    position: relative;
    width: 100%;
}

    .bootstrapWizard a:active, .bootstrapWizard a:focus, .bootstrapWizard a:hover {
        text-decoration: none;
    }

    .bootstrapWizard li {
        display: block;
        float: left;
        width: 25%;
        text-align: center;
        padding-left: 0;
    }

        .bootstrapWizard li:before {
            border-top: 3px solid #55606E;
            content: "";
            display: block;
            font-size: 0;
            overflow: hidden;
            position: relative;
            top: 11px;
            left: -50%;
            width: 100%;
            z-index: 1;
        }

        .bootstrapWizard li.passed:before, .bootstrapWizard li.active:before {
            border-top: 3px solid #468847;
            content: "";
            display: block;
            font-size: 0;
            overflow: hidden;
            position: relative;
            top: 11px;
            left: -50%;
            width: 100%;
            z-index: 1;
        }

        .bootstrapWizard li:first-child:before {
            left: 50%;
            max-width: 50%;
        }

        .bootstrapWizard li:last-child:before {
            max-width: 100%;
            width: 100%;
        }

        .bootstrapWizard li.complete .step {
            background: #0aa66e;
            padding: 1px 6px;
            border: 3px solid #55606E;
        }

        .bootstrapWizard li .step i {
            font-size: 10px;
            font-weight: 400;
            position: relative;
            top: -1.5px;
        }

        .bootstrapWizard li .step {
            background: #B2B5B9;
            color: #B2B5B9;
            display: inline;
            font-size: 15px;
            font-weight: 700;
            padding: 0px 10px;
            border: 0px solid transparent;
            border-radius: 50%;
            line-height: 20px;
            position: absolute;
            text-align: center;
            z-index: 2;
            transition: all .1s linear 0s;
            top: 1px;
            width: 20px;
            height: 20px;
            margin-left: -1px;
        }

        .bootstrapWizard li.passed .step {
            background: #468847;
            color: #468847;
            font-weight: 700;
            padding: 0px 6px;
            font-size: 15px;
            border-radius: 50%;
            border: 0px solid #468847;
        }

        .bootstrapWizard li.active .step, .bootstrapWizard li.active.complete .step {
            background: #f6f6f6;
            color: #468847;
            font-weight: 700;
            padding: 0px 0px;
            font-size: 15px;
            border-radius: 50%;
            border: 3px solid #468847;
            height: 25px;
            width: 25px;
            top: 0px;
        }

            .bootstrapWizard li.active .step.danger, .bootstrapWizard li.active.complete .step.danger {
                border: 3px solid #b94a48;
            }

        .bootstrapWizard li.active .title, .bootstrapWizard li.complete .title {
            color: #2B3D53;
        }

        .bootstrapWizard li .title {
            color: #bfbfbf;
            display: block;
            font-size: 13px;
            line-height: 15px;
            max-width: 100%;
            position: relative;
            table-layout: fixed;
            text-align: center;
            top: 20px;
            word-wrap: break-word;
            z-index: 104;
            padding: 0px 3px;
            margin-top: 10px;
            margin-left: 19px;
        }

.wizard-actions {
    display: block;
    list-style: none;
    padding: 0;
    position: relative;
    width: 100%;
}

    .wizard-actions li {
        display: inline;
    }

/*#endregion */

/*#region wizard 2 */

.fuelux .wizard {
    position: relative;
    overflow: hidden;
    background-color: #f9f9f9;
    border: 1px solid #d4d4d4;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    *zoom: 1;
    -webkit-box-shadow: 0 1px 4px rgba(0,0,0,.065);
    -moz-box-shadow: 0 1px 4px rgba(0,0,0,.065);
    box-shadow: 0 1px 4px rgba(0,0,0,.065)
}

    .fuelux .wizard:after, .fuelux .wizard:before {
        display: table;
        line-height: 0;
        content: ""
    }

    .fuelux .wizard:after {
        clear: both
    }

    .fuelux .wizard ul {
        width: 4000px;
        padding: 0;
        margin: 0;
        list-style: none outside none
    }

        .fuelux .wizard ul.previous-disabled li.complete {
            cursor: default
        }

            .fuelux .wizard ul.previous-disabled li.complete:hover {
                color: #356e35;
                cursor: default;
                background: #f3f4f5
            }

                .fuelux .wizard ul.previous-disabled li.complete:hover .chevron:before {
                    border-left-color: #f3f4f5
                }

        .fuelux .wizard ul li {
            position: relative;
            float: left;
            height: 46px;
            padding: 0 20px 0 30px;
            margin: 0;
            font-size: 16px;
            line-height: 46px;
            color: #999;
            cursor: default;
            background: #ededed
        }

            .fuelux .wizard ul li .chevron {
                position: absolute;
                top: 0;
                right: -14px;
                z-index: 1;
                display: block;
                border: 24px solid transparent;
                border-right: 0;
                border-left: 14px solid #d4d4d4
            }

                .fuelux .wizard ul li .chevron:before {
                    position: absolute;
                    top: -24px;
                    right: 1px;
                    display: block;
                    border: 24px solid transparent;
                    border-right: 0;
                    border-left: 14px solid #ededed;
                    content: ""
                }

            .fuelux .wizard ul li.complete {
                color: #468847;
                background: #f3f4f5
            }

                .fuelux .wizard ul li.complete:hover {
                    cursor: pointer;
                    background: #e7eff8
                }

                    .fuelux .wizard ul li.complete:hover .chevron:before {
                        border-left: 14px solid #e7eff8
                    }

                .fuelux .wizard ul li.complete .chevron:before {
                    border-left: 14px solid #f3f4f5
                }

            .fuelux .wizard ul li.active {
                color: #3a87ad;
                background: #f1f6fc
            }

                .fuelux .wizard ul li.active .chevron:before {
                    border-left: 14px solid #f1f6fc
                }

            .fuelux .wizard ul li .badge {
                margin-right: 8px
            }

            .fuelux .wizard ul li:first-child {
                padding-left: 20px;
                border-radius: 4px 0 0 4px
            }

    .fuelux .wizard .actions {
        position: absolute;
        right: 0;
        z-index: 2;
        float: right;
        padding-right: 15px;
        padding-left: 15px;
        line-height: 46px;
        vertical-align: middle;
        background-color: #eee;
        border-left: 1px solid #d4d4d4
    }

        .fuelux .wizard .actions a {
            margin-right: 8px;
            font-size: 12px;
            line-height: 45px
        }

        .fuelux .wizard .actions .btn-prev i {
            margin-right: 5px
        }

        .fuelux .wizard .actions .btn-next i {
            margin-left: 5px
        }

.fuelux .step-content .step-pane {
    display: none
}

.fuelux .step-content .active {
    display: block
}

    .fuelux .step-content .active .btn-group .active {
        display: inline-block
    }

/*#endregion */

.item-employee {
        padding-top: 4px;
        padding-bottom: 4px;
        cursor: pointer;
        padding-left: 6px;
        padding-right: 4px;
        border: 1px solid #fff;
        border-radius: 4px;
    }

        .item-employee:hover {
            background: #efefef !important;
            border: 1px solid #5bb4f5;
            box-sizing: border-box;
        }

    .employee-profile-image {
        width: 76px;
        height: 76px;
        border: 1px solid silver;
    }

.input-group .form-control {
    height: 34px;
}

.form-control {
    font-size: inherit;
}

/*::-webkit-scrollbar-thumb {
    border-radius: 0 !important;
}

::-webkit-scrollbar-track {
    border-radius: 0 !important;
}*/

/*::-webkit-scrollbar:hover {
    max-width: 20px;
    transition: width 0.15s ease-out;
    height: 20px;
}

::-webkit-scrollbar-thumb:hover {
    max-width: 20px;
    transition: width 0.15s ease-out;
    height: 20px;
}

::-webkit-scrollbar-track:hover {
    max-width: 20px;
    transition: width 0.15s ease-out;
    height: 20px;
}*/

.bootbox .modal-header {
    padding: 15px;
}

.bootbox .modal-header .bootbox-close-button {
    margin-top: 0px !important;
}

.bootbox .modal-header .modal-title {
    color: #000;
    font-family: "Roboto", Arial, sans-serif;
    font-weight: 400;
    font-size: 18px;
}

.sweet-alert .la-ball-fall {
    top: 68% !important;
}

.sweet-alert {
    /*z-index: 1000000;*/
     z-index: 9999999;
}

.sweet-alert .sa-icon {
    margin-bottom: 30px;
}

.content {
    padding-bottom: 170px;
}

#wrapper {
    margin: 0 0 0 195px !important;
}

/*#menu {
    width: 205px !important;
}

#menu:hover {
    width: 196px !important;
}

.arrow {
    transition: right 0.15s ease-out;
}

#menu:hover .arrow {
    right: 3px !important;
}

#side-menu li a,.profile-picture {
    transition: padding-right 0.5s ease-out;
}

#menu:hover #side-menu li a {
    padding-right: 3px;
}

#menu:hover .profile-picture {
    padding-right: 13px;
}*/

body.page-small #wrapper {
    margin-left: 0 !important;
}

body.hide-sidebar #wrapper {
    margin-left: 0 !important;
}

body.page-small.show-sidebar #wrapper {
    margin-left: 195px !important;
}

#logo {
    width: 195px !important;
}

::-webkit-scrollbar {
    width: 9px;
    height: 9px;
}

::-webkit-scrollbar-track {
    border: 0.5px solid rgba(0,0,0,.065);
    background: #ededed;
}

::-webkit-scrollbar-thumb {
    border-radius: 0px;
    background: rgba(180, 182, 185, 0.67);
}

.btn-circle.btn-lg {
    padding: 13px 16px;
}

.btn.btn-float {
    margin-bottom: -69px;
    float: right;
}

.btn.btn-rotate-hover {
    -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-mask-image: -webkit-radial-gradient(circle, #ffffff 100%, #000000 100%);
}

/*#region Loading */
.with-loading  {
    height: 50px;
    position: relative;
}

.with-loading .control {
    position: absolute;
    right: 10px;
}

.with-loading .la-ball-fall {
    display: none !important;
    opacity: 1;
    visibility: visible;
    transition-delay: 0s;
    position: absolute;
    top: 7px;
    right: 3px;
}

    .with-loading .la-ball-fall > div:nth-child(1) {
        -webkit-animation-delay: -200ms;
        -moz-animation-delay: -200ms;
        -o-animation-delay: -200ms;
        animation-delay: -200ms;
    }

    .with-loading .la-ball-fall > div:nth-child(2) {
        -webkit-animation-delay: -100ms;
        -moz-animation-delay: -100ms;
        -o-animation-delay: -100ms;
        animation-delay: -100ms;
    }

    .with-loading .la-ball-fall > div:nth-child(3) {
        -webkit-animation-delay: 0ms;
        -moz-animation-delay: 0ms;
        -o-animation-delay: 0ms;
        animation-delay: 0ms;
    }

    .with-loading .la-ball-fall > div {
        width: 10px;
        height: 10px;
        margin: 4px;
        border-radius: 100%;
        opacity: 0;
        -webkit-animation: ball-fall 1s ease-in-out infinite;
        -moz-animation: ball-fall 1s ease-in-out infinite;
        -o-animation: ball-fall 1s ease-in-out infinite;
        animation: ball-fall 1s ease-in-out infinite;
    }

    .with-loading .la-ball-fall > div {
        position: relative;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        background-color: #8d8f92;
    }

.with-loading .control.checking .la-ball-fall {
    display: block !important;
}

/*#endregion */

/*#region theme v2 */
.hpanel {
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.15), 0 0 1px 1px rgba(0, 0, 0, 0.1);
}

.hpanel .panel-body {
    border: 1px solid rgba(255, 255, 255, 0);
    background: rgba(255, 255, 255, 0.65);
}

.normalheader .hpanel .panel-body {
    background: rgba(255, 255, 255, 0.75);
}

/*.nav-tabs {
    background: rgba(255, 255, 255, 0.20);
}*/

.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
    border: 1px solid rgba(255, 255, 255, 0);
    background: rgba(255, 255, 255, 0.65);
}

.nav-tabs {
    border-bottom: 1px solid rgba(255, 255, 255, 0);
}
.hpanel > .panel-footer, .hpanel > .panel-section {
    background: rgba(255, 255, 255, 0.70);
}
.hpanel.panel-collapse > .panel-heading, .hpanel .hbuilt {
    border: none;
    background: rgba(255, 255, 255, 0.70);
}
.hbreadcrumb {
    background: transparent;
}
.hbreadcrumb > .active {
    color: #7a7a7a;
}
#header {
    background: rgba(255, 255, 255, 0.75);
    border-bottom: none;
}
.clip-header {
    background: rgba(255, 255, 255, 0.60);
}
.header-link, #logo.light-version {
    background: transparent;
    border-bottom: none;
    border-right: none;
    border-left: none;
}
#side-menu {
    background: transparent;
}
.footer {
    background: rgba(255, 255, 255, 0.75);
    border: none;
}
.forum-box .panel-heading {
    background: rgba(255, 255, 255, 0.70);
}
.hpanel.fullscreen {
    background: rgba(255, 255, 255, 0.82);
}
#side-menu li.active {
    background: rgba(255, 255, 255, 0.82);
}
.filter-item .panel-body:hover {
    background: rgba(255, 255, 255, 0.75);
}
.dropdown-menu {
    background: rgba(255, 255, 255, 0.82);
}
.bg-light {
    background: rgba(255, 255, 255, 0.75);
}
#side-menu li:first-child {
    border-top: none;
}
#side-menu li {
    border-bottom: none;
}
#menu {
    background: rgba(255, 255, 255, 0.75)!important;
}
.nicescroll-cursors {
    border: none !important;
}
.table-striped > tbody > tr:nth-of-type(odd) {
    background: rgba(249, 249, 249, 0.33);
}
.table-bordered > thead > tr > th, .table-bordered > tbody > tr > th, .table-bordered > tfoot > tr > th, .table-bordered > thead > tr > td, .table-bordered > tbody > tr > td, .table-bordered > tfoot > tr > td {
    border: 1px solid #b8b8b8;
}
.table-bordered {
    border: 1px solid #b8b8b8;
}

.normalheader.small-header .hpanel {
    box-shadow: none;
}
/*#endregion */
body.hide-sidebar #menu {
    margin-left: -195px;
}
body.page-small #menu {
    margin-left: -195px;
}

.label {
    padding: .2em .6em .2em;
}

.panel-footer {
    background: rgba(249, 249, 249, 0.8);
}