/*
default #888 
success #18ce0f 
primary #f96332 
warning #FFB236
danger #FF3636
info #2CA8FF
https://material.io/guidelines/style/color.html#color-color-palette
*/

/*.navbar > *, .navbar > * > *, .navbar > * > * > *, .navbar > * > * > * > *,
.table > *, .table > * > *, .table > * > * > *,*/
@font-face {
    font-family: 'Nucleo Outline';
    src: url("/Content/fonts/nucleo-outline.eot");
    src: url("/Content/fonts/nucleo-outline.eot") format("embedded-opentype"), url("/Content/fonts/nucleo-outline.woff2") format("woff2"), url("/Content/fonts/nucleo-outline.woff") format("woff"), url("/Content/fonts/nucleo-outline.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Kanit';
    src: url('/Content/fonts/Kanit-Light.ttf') format('truetype');
}

.card .card-header .card-title {
    margin-top: 25px;
}

@font-face {
    font-family: 'Montserrat';
    src: url('/Content/fonts/Montserrat-Regular.ttf') format('truetype');
}


h1 {
    font-size: 28px !important;
}

h2 {
    font-size: 26px !important;
}

.nav-link .fa, 
.nav-link .now-ui-icons,
.input-group-addon .fa, 
.input-group-addon .now-ui-icons,  
h3, 
h4,
h5, 
h6,
h4 {
    font-size: 22px !important;
}

.navbar i, 
i,
ul.breadcrumb-criteria li,
h7 
{
    font-size: 20px !important;
}

.ms-choice, 
.form-control,
.text, 
.dropdown-item,
input,
optgroup,
select, 
option,
textarea,
body, 
nav, 
table, 
span, 
tr, 
td, 
a, 
label, 
text, 
p, 
li, 
nav {
    font-size: 15.5px !important;
}

.nav-link span, 
.navbar > *, 
.navbar > * > *, 
.navbar > * > * > *, 
.navbar > * > * > * > *,
.nav p,
.chip p,
.dropbtn,
button, 
th {
    font-size: 17px !important;
}

table.dataTable thead span,
table.dataTable td,
.dropdown_Item, 
.dropdown_Item_footer, 
.dropdown-list .text-info .text-center
span.description, 
small, 
.description {
    font-size: 16px !important
}

.chip p.description,
.text-small {
    font-size: 13px !important;
}

@media screen and (min-width: 1200px) and (max-width: 1700px) {
    h1 {
        font-size: calc(4px + 1vw) !important;
    }

    h2 {
        font-size: calc(3px + 1vw) !important;
    }

    .nav-link .fa,
    .nav-link .now-ui-icons,
    .input-group-addon .fa,
    .input-group-addon .now-ui-icons,
    h3,
    h4,
    h5,
    h6,
    h4 {
        font-size: calc(2px + 1vw) !important;
    }

    .navbar i,
    i,
    ul.breadcrumb-criteria li,
    h7 {
        font-size: calc(1px + 1vw) !important;
    }

    .ms-choice,
    .form-control,
    .text,
    .dropdown-item,
    input,
    optgroup,
    select,
    option,
    textarea,
    body,
    nav,
    table,
    span,
    tr,
    td,
    a,
    label,
    text,
    p,
    li,
    nav {
        font-size: calc(1vw) !important;
    }

    .nav-link span,
    .navbar > *,
    .navbar > * > *,
    .navbar > * > * > *,
    .navbar > * > * > * > *,
    .nav p,
    .chip p,
    .dropbtn,
    button,
    th {
        font-size: calc(1vw) !important;
    }

    body,
    table.dataTable thead span,
    table.dataTable td,
    .dropdown a,
    .dropdown_Item,
    .dropdown_Item_footer,
    .dropdown-list .text-info .text-center {
        font-size: calc(-3px + 1vw) !important;
    }

    span.description,
    small,
    .description,
    .chip p.description,
    .text-small {
        font-size: calc(-5px + 1vw) !important;
    }
}


@media screen and (max-width: 1200px) {

    h1 {
        font-size: 23px !important;
    }

    h2 {
        font-size: 21px !important;
    }

    .nav-link .fa,
    .nav-link .now-ui-icons,
    .input-group-addon .fa,
    .input-group-addon .now-ui-icons,
    h3,
    h4,
    h5,
    h6,
    h4 {
        font-size: 17px !important;
    }

    .navbar i,
    i,
    ul.breadcrumb-criteria li,
    h7 {
        font-size: 15px !important;
    }

    .ms-choice,
    .form-control,
    .text,
    .dropdown-item,
    input,
    optgroup,
    select,
    option,
    textarea,
    body,
    nav,
    table,
    span,
    tr,
    td,
    a,
    label,
    text,
    p,
    li,
    nav {
        font-size: 12.5px !important;
    }

    .nav-link span,
    .navbar > *,
    .navbar > * > *,
    .navbar > * > * > *,
    .navbar > * > * > * > *,
    .nav p,
    .chip p,
    .dropbtn,
    button,
    th {
        font-size: 12px !important;
    }

    table.dataTable thead span,
    table.dataTable td,
    .dropdown_Item,
    .dropdown_Item_footer,
    .dropdown-list .text-info .text-center
    span.description,
    small,
    .description {
        font-size: 11px !important
    }

    .chip p.description,
    .text-small {
        font-size: 9px !important;
    }
}

.form-group > .form_datetime {
    margin-left: -15px;
}

button .fa-cog {
    margin-left: -10px;
}

.form-check > .Form-label {
    margin-bottom: 0px;
}

.color-default .btn.dropdown-toggle {
    background-color: #979797 !important;
    color: white !important;
}

.modal-title {
    padding-bottom: 8px;
}

.card-header > h4.card-title {
    padding-top: 10px;
    padding-left: 10px;
    padding-bottom: 0px;
    margin-bottom: 5px;
}

#frmWorkSpaceBody {
    padding-top: 10px;
}

.criteria_Calendar {
    margin-left: 40px;
    margin-bottom: 15px;
}

.fa-check {
    color: green !important;
}

.fa-close {
    color: red !important;
}

.collapseFixTopSelected {
    padding-left: 10px;
    position: absolute;
    top: 13px;
}

.cursor-auto {
    cursor: auto !important;
}

h3 {
    margin-bottom: -5px;
    margin-left: 10px; 
}


.subTableodd .background-card {
    background-color: white !important;
}

.card-collapse .card .card-header a[data-toggle="collapse"] {
    margin-top: 0px;
}

.timepick {
    text-align: center;
}

table.dataTable thead > tr {
    height: 40px !important; 
    text-wrap: balance;
}

    table.dataTable thead > tr > th {
        height: 40px !important;
        vertical-align: top !important;
    }

.subTable {
    margin: 0px;
    padding: 10px;
    padding-top: 10px;
    max-height: 500px;
    overflow: auto;
}

    .subTable > div {
        padding-top: 5px !important;
        padding-bottom: 10px !important;
        margin-top: 10px;
    }

    .subTable .table-responsive, .subTable .container-fluid {
        padding-bottom: 7px;
    }

    .subTable h4 { 
        margin-top: 5px !important;
    }


#divFixTop .subTable .card-header {
    padding: 15px 20px 5px 20px;
}

#divFixTop .subTable .table-responsive {
    padding-left: 15px;
}

.text-gray, a.text-gray:focus, a.text-gray:hover {
    color: #6d6969 !important;
}

span.description, small, .description {
    /*font-family: 'Kanit','Montserrat' !important;*/ 
    line-height: 25px;
    color: #6d6b6b;
}

body {
    background-color: rgb(235, 236, 241);
}

body, nav, table, span, tr, td, a, label, text, p, li, nav {
    font-family: 'Kanit','Montserrat', !important; 
    line-height: 24px;
}

.sidebar .nav li > a, .off-canvas-sidebar .nav li > a {
    padding: 7px;
    padding-left: 5px;
    margin-left: 12px;
}

.sidebar .nav li:first-child > a, .off-canvas-sidebar .nav li:first-child > a {
    padding: 10px;
    padding-left: 5px;
    margin-left: 12px;
    height: 46px;
    min-width: 46px;
}

.text-buttom .active > i .text-primary {
    color: white !important;
}

.check-mark {
    color: #000 !important;
    font-family: FontAwesome !important;
    content: "\f00c";
}

.badge {
    line-height: 1;
    margin-bottom: 0px;
}

.ms-choice, body, nav, table, tr, td, a, label, text, p, li, nav {
    color: #000;
    line-height: 24px;
}

.text, .dropdown-item,
input,
optgroup,
select, option, textarea {
    font-family: 'Kanit','Montserrat', 'FontAwesome' !important; 
    color: #000;
}

.dropdown_Header {
    display: flex;
    line-height: 30px;
}

.dropdown_Item {
    display: flex;
    line-height: 20px;
    color: #211f1f; 
}

.dropdown-list span {
    padding-left: 10px;
}

.dropdown-list .dropdown_Item:hover {
    background-color: rgba(222, 222, 222, 0.3);
    color: #000;
}

.dropdown-list {
    padding: 10px !important;
}

.dropdown_Item_footer {
    text-align: center;
    line-height: 30px; 
    display: block;
}


.text-left {
    text-align: left !important;
}

.text-right {
    text-align: right;
}

.text-center {
    text-align: center !important;
}

.dropdown-list .text-info .text-center { 
    line-height: 30px;
}

.disabled {
    color: #e0e0e0 !important;
    cursor: not-allowed;
}

.text-small {
    line-height: 20px; 
}

.text {
    color: #000 !important;
    padding-left: 10px;
}

button, th {
    font-family: 'Kanit','Montserrat' !important; 
}

.content {
    padding: 0px 15px 0px 15px;
}

.content-body {
    padding: 0px 15px 0px 15px;
}
/*#divMainContent {
margin-top: 70px;
}*/
.datetimepicker th.switch {
    height: 35px;
}

h4.txtsection {
    margin-left: 130px; 
}

.sidebar .nav .caret, .off-canvas-sidebar .nav .caret {
    top: 10px;
    position: absolute;
    right: 10px;
}

.card .card-body {
    padding: 15px 25px 15px 25px;
    /* overflow-x: hidden;*/
    /*    min-height: 400px;*/
    /*    height:auto;*/
    /*  overflow-y: auto;*/
}

    .card .card-body.body-table {
        /*padding: 10px 20px 10px 20px;*/
        overflow-x: hidden;
        overflow-y: hidden;
        min-height: 400px;
    }


@media screen and (max-width: 767px) {
    .content {
        padding: 0px;
        margin-top: -20px;
    }

    .main-panel .content {
        padding-left: 5px;
        padding-right: 5px;
    }

    #divMainContent {
        margin-top: 60px;
    }

    .card .card-body, .card .card-header, .card .card-footer, .card .card-title {
        padding: 15px;
    }

    h4 {
        padding: 5px;
    }
}

.bootstrap-select.btn-group.show-tick .dropdown-menu li a span.text {
    margin-right: 54px;
}

.img-circle {
    border-radius: 50%;
}

.bootstrap-select.btn-group.show-tick .dropdown-menu li.selected a span.check-mark {
    margin-top: unset;
    display: inline-flex;
    right: 5px;
}

.fa,
.now-ui-icons {
    margin-left: 5px;
}

button > i.now-ui-icons {
    margin-left: 0px;
}

.sidebar .fa,
.sidebar .now-ui-icons {
    margin-left: 2px;
}

p, input {
    margin-top: 3px;
    margin-bottom: 3px;
    line-height: 30px;
}

.sidebar .nav, .off-canvas-sidebar .nav {
    margin-top: 10px;
}

    .sidebar .nav p, .off-canvas-sidebar .nav p {
        line-height: 28px;
    }

    .sidebar-mini-icon, .sidebar .nav i, .sidebar-normal {
        line-height: 26px !important;
    }

h1,
h2 {
    font-family: 'Montserrat','Kanit' !important;
    margin-bottom: 20px;
}
  
h3, h4,
h5, h6 {
    font-family: 'Montserrat','Kanit' !important;
    margin-top: 10px;
    margin-bottom: 5px;
    margin-left: 0px;
}

ul > li > a > div > i.fa.fa-caret-right {
    margin-top: 5px;
    margin-left: 10px;
}

.card-header h4 {
    padding-left: 10px;
}

.navbar-absolute .description {
    color: #c7c7c7;
}

.card-header h3 {
    padding-top: 10px;
    padding-left: 0px;
    margin: 0px;
}

h5 {
    margin-bottom: 0px;
    margin-top: 8px;
}

h7 {
    font-family: 'Montserrat','Kanit' !important;
    margin-top: 5px;
    margin-bottom: 5px;
    line-height: 45px;
    padding-left: 10px;
}

.dropdown-menu {
    padding-top: 0px;
}

.divLoading {
    z-index: 100;
    background-color: rgba(255,255,255,1);
}

.dropdown-item, a.nav-link {
    cursor: pointer;
}
/*.container-fluid {
padding-left:0px; 
padding-top:0px;
}*/
#navigation > ul > li > a {
    line-height: 30px;
    height: 40px;
}

.navbar-nav {
    margin-top: 0px;
}
.navbar .navbar-nav .nav-link i.fa {
    top: 0px;
    font-size: 16px;
    height: 22px;
    width: 22px;
    margin: 2px 0px 2px 0px;
    display: inline;
}
.navbar .navbar-nav .nav-link i.now-ui-icons {
    top: 4px;
    font-size: 16px;
    height: 22px;
    width: 22px;
    margin: 2px 0px 2px 0px;
    display: inline;
}

hr, hr:hover {
    margin-top: 10px;
    margin-bottom: 10px;
    margin-right: 50px;
    margin-left: 50px;
    border-top: 1px solid #c7c7c7;
    border-left: none;
    border-right: none;
    height: 1px;
}

.navbar.navbar-absolute {
    padding-bottom: 5px;
    padding-top: 5px;
}

.tooltip {
    z-index: 1040;
}

hr.dashed {
    border-top: 1px dashed #c7c7c7;
}

.border2 {
    border: dashed 1px #c7c7c7;
}

.w3-animate-right.divCalHeight {
    padding-right: 20px;
}

.subTable .card-body h4 {
    margin-left: 10%;
    padding-bottom: 0px;
    margin-bottom: 0px;
    width: 100%
}

.modal-content .modal-header {
    padding-top: 13px;
    padding-bottom: 5px;
}
/*ul.breadcrumb-criteria {
    display:flex;
}*/
.btnRound {
    background-color: rgba(0, 102, 135, 0.9);
    -moz-border-radius: 25px;
    -webkit-border-radius: 25px;
    box-shadow: 0 6px 10px 0 rgba(0,0,0,0.3);
    cursor: pointer;
    background-color: transparent;
    /*opacity: 0.7;*/
    filter: alpha(opacity=70);
    height: 50px;
    width: 50px;
    border-radius: 25px;
    padding: 0px;
    min-width: unset;
}

.border_bottom, .border_bottom:hover {
    border-bottom-color: #eee !important;
    border-bottom-style: solid !important;
    border-bottom-width: 1px !important;
}

i.fa > *  {
    min-height: 25px;
    min-width: 25px;
}


.border_top {
    border-top-color: #eee !important;
    border-top-style: solid !important;
    border-top-width: 1px !important;
}

/*.border_bottom2:hover, .border_bottom:hover {
    pointer-events: none !important;
}*/
.border_left {
    border-left-color: #c7c7c7;
    border-left-style: solid;
    border-left-width: 1px;
}

.border_right {
    border-right-color: #c7c7c7;
    border-right-style: solid;
    border-right-width: 1px;
}

h4.card-title, h5.card-title {
    transition: all 0.5s ease;
}

.border_left2, .border_left2:hover {
    border-left-color: #c7c7c7 !important;
    border-left-style: dashed !important;
    border-left-width: 1px !important;
}

.border_right2, .border_right2:hover {
    border-right-color: #c7c7c7 !important;
    border-right-style: dashed !important;
    border-right-width: 1px !important;
}

.border_bottom2 {
    border-bottom-color: #c7c7c7 !important;
    border-bottom-style: dashed !important;
    border-bottom-width: 1px !important;
}

.border_top2 {
    border-top-color: #c7c7c7 !important;
    border-top-style: dashed !important;
    border-top-width: 1px !important;
}

@media screen and (max-width: 767px) { 
    textarea {
        min-height: 80px;
    }  
    #divMainContent {
        padding: 0px;
        overflow-y: scroll
    }
}

h4,
h5, h6 {
    text-transform: unset;
    font-weight: normal !important;
}

.card-text {
    text-overflow: ellipsis;
    overflow: hidden;
}

.block {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    padding-left: 10px;
    padding-right: 10px;
}


h6 {
    text-transform: unset;
}

/*.table > *, .table > * > *, .table > * > * > *, .table td, .table th {
color: #888 !important;
}*/
/*.text-dark,
.table > thead > tr > th {
color: #411118 !important;
}*/

.text-shadow {
    color: #888;
}

.text-dark {
    color: #000 !important;
}

.img-fluid {
    border-radius: unset;
}

.btn-primary, .btn-primary:hover, .btn-primary:active,
.nav-pills .nav-item .nav-link.active {
    color: white !important;
}

a.link, [role=button], .fa-pencil-square {
    cursor: pointer;
}

a.link {
    cursor: pointer;
    color: #0044cc !important;
    line-height: 24px;
}

button.link {
    cursor: pointer;
    color: #0044cc !important;
    line-height: 24px;
}
a.dropdown-item {
    min-width: 70px;
}


a.link:hover, .link:focus {
    cursor: pointer;
    color: #5897fb !important;
}

.input-group > span.input-group-addon {
    opacity: 0;
}

.txt-uploadFiles {
    line-height: 24px;
    /*padding-top: 10px;*/
    margin-left: -15px;
}

.txt-uploadImage {
    line-height: 24px;
    margin-top: 10px;
    margin-left: -15px;
    cursor: pointer;
}

.text-buttom {
    /*display: inline-block;*/
    position: relative;
    padding-bottom: 1px;
    cursor: pointer;
}

.error:focus, .error {
    color: red !important;
    border-color: red !important;
}

.form_date {
    padding: 0px;
}

.text-buttom:after {
    content: '';
    display: block;
    margin: auto;
    height: 1px;
    width: 0px;
    background: transparent;
    transition: width .5s ease, background-color .5s ease;
}

.Form-label:hover {
    color: #5897fb;
}

.form-control-sm {
    padding: .375rem .75rem;
}

.ms-search input, .form-control {
    height: 32px !important;
}

.txt-multiCheck {
    margin-top: 4px;
    height: 36px;
}

.ms-choice > span {
    padding-left: 10px;
    padding-top: 5px;
}

.ms-drop input[type="checkbox"], .ms-drop input[type=radio] {
    zoom: 1.5;
}

.ms-drop {
    margin-top: 5px;
}

    .ms-drop ul {
        overflow: auto;
        margin: 0;
        padding: 0px 8px;
        padding-bottom: 8px;
    }

.ms-search {
    padding-top: 0px;
    padding-left: 10px;
    padding-right: 10px;
}

.ms-choice, .form-control {
    background-color: white;
    border: 1px solid #c7c7c7;
    border-radius: 30px;
    color: #000;
    line-height: normal; 
    -webkit-transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out, background-color 0.3s ease-in-out;
    -moz-transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out, background-color 0.3s ease-in-out;
    -o-transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out, background-color 0.3s ease-in-out;
    -ms-transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out, background-color 0.3s ease-in-out;
    transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out, background-color 0.3s ease-in-out;
    -webkit-box-shadow: none;
    box-shadow: none;
    background-clip: padding-box;
    padding: 2px 10px;
    height: 32px;
}


.text-buttom:hover:after {
    width: 100%;
}

.nav-link > a > i, .nav > li > a > i, #minimizeSidebar > i,
.dropdown > button > i {
    color: white !important;
}

.nav-link span, .navbar > *, .navbar > * > *, .navbar > * > * > *, .navbar > * > * > * > *,
.nav p { 
    color: white !important;
}

.sidebar .logo {
    padding-bottom: 5px;
    padding-top: 5px;
}

.dropdown-menu:before {
    background-color: transparent;
    color: transparent;
}

table.dataTable > tbody > tr.child ul li {
    padding-left: 5px;
    border: none;
    font-weight: 400;
}

.tooltip-inner {
    background-color: rgba(0,0,0,.6);
    color: white;
}

.card-collapse .card {
    margin-bottom: 15px;
}


.tooltip.bs-tooltip-top .arrow:before,
.tooltip.bs-tooltip-right .arrow:before,
.tooltip.bs-tooltip-left .arrow:before,
.tooltip.bs-tooltip-right .arrow:before {
    background-color: transparent !important;
    border: transparent;
}

.fa {
    font: normal normal normal 13px/1 FontAwesome !important;
    font-size: 18px !important;
    margin-left: 5px;
    margin-right: 10px;
    opacity: .8;
}

.now-ui-icons {
    font: normal normal normal 13px/1 'Nucleo Outline' !important;
    font-size: 20px !important;
    opacity: .8;
}

.input-group.date .input-group-addon {
    margin-top: 3px
}

.btn.btn-icon:not(.btn-footer) .now-ui-icons {
    margin-top: 2px;
}

.sidebar .nav li > a, .off-canvas-sidebar .nav li > a {
    border-radius: 40px;
    height: 40px;
}

.linkAccessMenu i {
    line-height: 24px !important;
}

.fa-home {
    font-size: 24px !important
}

.sidebar-wrapper {
    overflow: hidden;
}

.space-0 {
    padding: 0px !important;
    margin: 0px !important;
}

.full-page > .content {
    padding: 0px;
}

.txt-editor {
    margin-bottom: 5px;
}

::-webkit-scrollbar-track {
    background-color: #c7c7c7;
}
/*::-webkit-scrollbar-track {
-webkit-box-shadow: unset;
border-radius: unset;
background-color: rgba(222, 222, 222, .5);
border: 1px solid rgba(222, 222, 222,.5);
}

::-webkit-scrollbar {
width: 12.5px;
background-color: transparent;
height: 12.5px;
}

::-webkit-scrollbar-corner {
background-color: transparent;
}

::-webkit-scrollbar-thumb {
border-radius: unset;  
-webkit-box-shadow: unset;
background-color: rgba(50, 50, 50,.2);
border: 1px solid rgba(50, 50, 50,.2); 
min-height: 200px;
}*/
/* Let's get this party started */
::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

/* Track */
::-webkit-scrollbar-track {
    /*-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);*/
    -webkit-box-shadow: unset;
    -webkit-border-radius: 0px;
    border-radius: 0px;
}

/* Handle */
::-webkit-scrollbar-thumb {
    -webkit-border-radius: 0px;
    border-radius: 0px;
    background-color: rgba(50, 50, 50,.2);
    /*-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);*/
    -webkit-box-shadow: unset;
    min-height: 100px;
}


.ms-list ::-webkit-scrollbar-thumb {
    background-color: rgba(50, 50, 50,0.4) !important;
}


::-webkit-scrollbar-thumb:window-inactive {
    background: rgba(50, 50, 50,0.4);
    min-height: 100px;
}

ul::-webkit-scrollbar,
input::-webkit-scrollbar, textarea::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

/* Track */
ul::-webkit-scrollbar-track,
input::-webkit-scrollbar-track, textarea::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.1);
    -webkit-border-radius: 0px;
    border-radius: 0px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}

/* Handle */
ul::-webkit-scrollbar-thumb,
input::-webkit-scrollbar-thumb, textarea::-webkit-scrollbar-thumb {
    -webkit-border-radius: 0px;
    border-radius: 0px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.1);
    min-height: 10px;
}

    ul::-webkit-scrollbar-thumb:window-inactive,
    input::-webkit-scrollbar-thumb:window-inactive, textarea::-webkit-scrollbar-thumb:window-inactive {
        background: rgba(50, 50, 50,0.1);
        min-height: 10px;
    }

.dropdown-item.active {
    font-weight: 400;
}

.btn-neutral {
    background-color: transparent;
}

button:disabled {
    opacity: 0.4;
}

button:hover:disabled {
    opacity: 0.4;
}


.background-second {
    margin-bottom: 10px
}

button {
    border: none;
    background-color: transparent;
}


    button > .fa {
        margin: 0px;
        position: relative;
        left: -5px;
    }

.dropdown-item.active,
.navbar .navbar-nav .nav-item.active .nav-link:not(.btn) {
    background-color: transparent;
}

.card {
    border-radius: 15px;
    margin: 0;
    margin-bottom: 10px;
    /*overflow:hidden;*/
    display: inline-block;
    height: auto !important;
}

.card-collapse {
    display: inline;
}

.linkAccessMenu, .loadPage {
    cursor: pointer;
}

.sidebar-normal {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.table .table {
    background-color: transparent;
}
.th-sticky {
    position: sticky;
    position: -webkit-sticky;
    background: white;
    top: 0;
    z-index: 10;
    background-color: white;
}
.background-card-shadow table > thead {
    background: transparent !important;
    background-color: transparent !important;
}
.background-card-shadow table.dataTable thead > tr, .background-card-shadow  .card-body {
    background: transparent !important;
    background-color: transparent !important;
}

table.subTable > thead {
    position: unset;
    position: unset;
    background: white;
    top: 0;
    z-index: 10;
    background-color: transparent;
}


.card .background-card, .card .border_none .background-card {
    background-color: #faf9f8;
    box-shadow: 0 1px 15px 1px rgba(39, 39, 39, 0.1);
}

.background-card {
    /*background-color: rgba(239,235,233,1) !important;*/
    background-color: #faf9f8;
    border-radius: 7px;
    box-shadow: unset;
}

.background-card-shadow {
    /*background-color: rgba(239,235,233,1) !important;*/
    background-color: #faf9f8 !important;
    border-radius: 7px;
    box-shadow: 0 1px 15px 1px rgba(39, 39, 39, 0.1);
}

h2 {
    margin-bottom: 10px;
}

body {
    overflow: hidden;
}

.nav-link:focus {
    outline-color: transparent;
}

.color-Black {
    color: #000 !important;
}

.color-White {
    color: white !important;
}

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

h4 {
    height: auto;
}

.width-400 {
    width: 400px !important;
}

.input-group > .custom-select:not(:last-child), .input-group > .form-control:not(:last-child) {
    border-top-right-radius: 30px;
    border-bottom-right-radius: 30px;
    height: 40px;
}

.input-group-icon {
    position: relative;
    right: 30px;
    line-height: 1;
    height: 35px;
    margin-top: 10px;
    color: white;
}

.navbar .form-group.no-border .form-control, .navbar .input-group.no-border .form-control {
    padding-right: 40px;
}

.btn:not(.btn-icon) .now-ui-icons {
    top: 5px;
    left: 5px;
}

.progress-container .progress {
    height: 5px;
}


.day_Leave {
    color: #F4D03F;
    text-align: left;
}

.hour_OT, .hour_Overtime {
    text-align: left;
}

.hour_Late, .hour_Early, .hour_Absent, .hour_Abnormaly {
    color: #EB984E;
    text-align: left;
}

.day_Abnormaly {
    color: #EC7063;
}

.day_Absent {
    color: #EC7063;
}

.day_Weekend {
    color: #A4A4A4;
    /*background-color: #e2f2f1;*/
}

.day_Tradition {
    color: #f5e7e0;
}

.block {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    padding-top: 5px;
    padding-left: 10px;
    padding-right: 10px;
}

@media screen and (max-width: 767px) {
    .block {
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
    }
}

.block {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    padding-left: 10px;
    padding-right: 10px;
}


.hide {
    display: none;
}


.dropdown-menu .dropdown-item, .bootstrap-select .dropdown-menu.inner li a {
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 0px;
    padding-bottom: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
    overflow: hidden;
    height: 24px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.Form-label-radio, .Form-label-checkbox {
    position: absolute;
    opacity: 0;
    overflow: hidden
}

    .Form-label-radio:checked + .Form-label-text::before, .Form-label-checkbox:checked + .Form-label-text::before
    .Form-label-radio + .Form-label-text, .Form-label-checkbox + .Form-label-text {
        cursor: pointer;
        margin-right: 5px;
        color: #2c2c2c;
        /*margin-right:29px;*/
    }

.basic_page > .card-body {
    padding-top: 0px;
}

.Form-label-radio + .Form-label-text::before,
.Form-label-checkbox + .Form-label-text::before {
    display: inline-block;
    width: 20px;
    height: 20px;
    line-height: 20px;
    border: 1px solid #8d8d8d;
    box-shadow: 1px 1px 1px #ddd;
    margin-right: 5px;
    font-family: FontAwesome;
    content: "\00a0";
    color: #fff;
    background-clip: padding-box;
    background-color: white;
    /*background-color:#c7c7c7;*/
    text-align: center
}

.Form-label-radio + .Form-label-text:hover::before,
.Form-label-checkbox + .Form-label-text:hover::before {
    border: 1px solid #8d8d8d;
    box-shadow: 1px 1px 1px #ddd;
}

.Form-label-radio:checked + .Form-label-text::before,
.Form-label-checkbox:checked + .Form-label-text::before {
    font-family: FontAwesome;
    content: "\f00c";
    display: inline-block;
    width: 20px;
    height: 20px;
    line-height: 20px;
    border: 1px solid #8d8d8d;
    box-shadow: 1px 1px 1px #ddd;
    margin-right: 5px;
    color: #606060;
    background-clip: padding-box;
    background-color: white;
    text-align: center
}

.Form-label-radio:focus + .Form-label-text::before,
.Form-label-checkbox:focus + .Form-label-text::before,
.Form-label-radio:active + .Form-label-text::before,
.Form-label-checkbox:active + .Form-label-text::before {
    border: 1px solid #dddddd;
    box-shadow: 1px 1px 1px #ddd;
}

.Form-label-radio + .Form-label-text::before {
    border-radius: 100%
}

.Form-label-radio:disabled + .Form-label-text::before,
.Form-label-checkbox:disabled + .Form-label-text::before {
    border: 1px solid #a9a9a9;
    box-shadow: 1px 1px 1px #ddd;
    background-color: #f3f3f3;
    color: #999999;
    cursor: not-allowed;
    opacity: .7;
}

.dropdown-menu {
    transition: unset;
}

.datetimepicker {
    width: 320px !important;
    padding: 10px;
    margin-top: 10px;
}

    .datetimepicker > div > table {
        width: 300px !important;
    }

.card .Form-label-radio + .Form-label-text, .card .Form-label-checkbox + .Form-label-text {
    padding-left: 0px;
    margin-left: 5px;
    margin-right: 15px;
    display: inline-block;
    min-width: 100px;
    text-align: left;
}

.select2-drop {
    margin-top: -10px;
    margin-left: -5px;
    box-shadow: unset;
    webkit-box-shadow: unset;
}

.select2-container {
    box-shadow: unset;
    webkit-box-shadow: unset;
    width: 100%;
}

.select2-drop-multi {
    margin-left: 0px;
}

.select2-container-multi .select2-choices,
.select2-container-multi .select2-choices .select2-search-choice,
.select2-search input, .select2-container .select2-choice {
    background-color: white;
    background-image: unset;
    box-shadow: unset;
    webkit-box-shadow: unset;
}

.select2-container-multi .select2-choices {
    border-radius: 5px;
    padding-left: 5px;
}

    .select2-container-multi .select2-choices .select2-search-choice {
        line-height: 20px;
    }

.select2-drop-active {
    border-top: initial;
    border: 1px solid #5897fb;
}


#mySidenav {
    -webkit-transition: width 1s; /* For Safari 3.1 to 6.0 */
    transition: width 1s;
}

.select2-container-multi .select2-choices .select2-search-field input {
    height: 28px;
}

.ms-search input, .form-control {
    color: #2c2c2c !important;
    height: 32px;
    margin-top: 4px;
    margin-bottom: 4px;
    background-color: white;
}

.ms-search input {
    background-color: transparent;
    color: #000;
    line-height: normal;
    -webkit-transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out, background-color 0.3s ease-in-out;
    -moz-transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out, background-color 0.3s ease-in-out;
    -o-transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out, background-color 0.3s ease-in-out;
    -ms-transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out, background-color 0.3s ease-in-out;
    transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out, background-color 0.3s ease-in-out;
    -webkit-box-shadow: none;
    box-shadow: none;
    border: none;
    border-bottom: 1px solid #c7c7c7;
    border-radius: unset;
}

.select2-container-multi .select2-choices .select2-search-choice {
    margin: 2px 0 2px 5px;
}

.card .col-sm-6 {
    margin-top: 7px;
}

.card label {
    margin-bottom: 0px;
}

.select2-container .select2-choice, .input-group > .custom-select:not(:last-child), .input-group > .form-control:not(:last-child),
.form-control {
    border-radius: 20px;
    height: 32px;
}

form-group .form-control, .input-group .form-control {
    padding: 5px;
    /*padding-left: 10px;*/
}


.form-horizontal .col-form-label, .form-horizontal .label-on-right, .control-label {
    padding: 10px 5px 0 14px;
    text-align: right;
    max-width: unset;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    padding-top: 8px;
}

@media screen and (max-width: 767px) {

    .form-horizontal .col-form-label, .form-horizontal .label-on-right, .control-label {
        text-align: left;
        max-width: unset;
    }
}

.txt-multiSelect {
    min-height: 40px;
    padding-top: 3px;
    padding-bottom: 3px;
}

.txt-date .form-control[disabled] {
    height: 40px;
    margin-left: 0px;
    text-align: center;
}

.txt-date > div {
    margin-left: 0px;
    height: 40px;
}

.txt-date {
    height: 40px;
}

.txt-select {
    height: 40px;
}

    .txt-select > div {
        margin-left: 5px;
        height: 36px;
        padding-top: 4px;
    }

.txt-multiple > div {
    margin-left: 0px;
    height: 40px;
}

.txt-checkbox > div, .txt-radio > div {
    margin-top: 8px;
}

.txt-radio {
    min-height: 40px;
}
/*.txt-radio > div {
margin-left: -10px;
height: 40px;
margin-top: 3px;
}

.txt-checkbox > div {
margin-left: -10px;
min-height: 40px;
margin-top: 3px;
}*/
.form-check {
    height: 30px;
    padding: 0;
    margin: 0;
    margin-right: 10px;
}
/*.txt-checkbox { 
height: 40px;
margin-top: 3px;
}*/
.txt-input > div {
    height: 40px;
}

.txt-input {
    height: 40px;
    line-height: 40px;
}

.ms-drop ul > li label.optgroup {
    font-weight: 500;
    border-top: 1px solid #ddd;
}

.w3-animate-fading {
    animation: fading 1s
}

.ms-drop ul > li.multiple {
    display: block;
    float: left;
    width: 99% !important;
}

@keyframes fading {
    0% {
        opacity: 0
    }

    30% {
        opacity: 0
    }

    50% {
        opacity: .5
    }

    100% {
        opacity: 1
    }
}

.w3-animate-opacity {
    animation: opac 0.8s
}

@keyframes opac {
    from {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.w3-animate-top {
    position: relative;
    animation: animatetop 0.4s
}

@keyframes animatetop {
    from {
        top: -300px;
        opacity: 0
    }

    to {
        top: 0;
        opacity: 1
    }
}

.input-border-bottom, .input-border-bottom:focus, .input-border-bottom:active {
    border-top: none !important;
    border-right: none !important;
    border-left: none !important;
    border-radius: unset;
    padding-left: 3px;
    padding-right: 3px;
    border-radius: unset !important;
    padding: 0px;
    margin: 0px;
    box-shadow: unset;
}

.Form-label {
    height: 25px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.CheckboxGroup, .RadioGroup {
    display: inline-flex;
    line-height: 24px;
    margin-top: 0px;
}

.nav-link a {
    cursor: pointer;
}

.navbar-nav div {
    line-height: 24px;
}

.width-90 {
    width: 90px !important;
}

.width-100 {
    width: 100px !important;
}

.width-150 {
    width: 150px !important;
}

.width-200 {
    width: 200px !important;
}

.width-250 {
    width: 250px !important;
}
.width-300 {
    width: 300px !important;
}

.width-400 {
    width: 400px !important;
}

[data-notify="container"][class*="alert-pastel-"] {
    background-color: rgb(255, 255, 238);
    border-width: 0px;
    border-left: 14px solid rgb(255, 240, 106);
    border-radius: 0px;
    box-shadow: 0px 0px 5px rgba(51, 51, 51, 0.3);
    letter-spacing: 1px;
}

[data-notify="container"].alert-pastel-info {
    border-left-color: rgb(255, 179, 40);
}

[data-notify="container"].alert-pastel-danger {
    border-left-color: rgb(255, 103, 76);
}

[data-notify="container"][class*="alert-pastel-"] > [data-notify="title"] {
    color: rgb(80, 80, 57);
    display: block;
    font-weight: 700;
    margin-bottom: 5px;
}

[data-notify="container"][class*="alert-pastel-"] > [data-notify="message"] {
    font-weight: 400;
}

.modal {
    padding-right: 0 !important;
}

@media (min-width: 768px) {
    .modal .modal-dialog.modal-top {
        top: 0;
    }

    .modal .modal-dialog.modal-left {
        left: 0;
    }

    .modal .modal-dialog.modal-right {
        right: 0;
    }

    .modal .modal-dialog.modal-bottom {
        bottom: 0;
    }

    .modal .modal-dialog.modal-top-left {
        top: 10px;
        left: 10px;
    }

    .modal .modal-dialog.modal-top-right {
        top: 10px;
        right: 10px;
    }

    .modal .modal-dialog.modal-bottom-left {
        bottom: 10px;
        left: 10px;
    }

    .modal .modal-dialog.modal-bottom-right {
        bottom: 10px;
        right: 10px;
    }
}

.modal.fade.top:not(.show) .modal-dialog {
    -webkit-transform: translate3d(0, -25%, 0);
    transform: translate3d(0, -25%, 0);
}

.modal.fade.left:not(.show) .modal-dialog {
    -webkit-transform: translate3d(-25%, 0, 0);
    transform: translate3d(-25%, 0, 0);
}

.modal.fade.right:not(.show) .modal-dialog {
    -webkit-transform: translate3d(25%, 0, 0);
    transform: translate3d(25%, 0, 0);
}

.modal.fade.bottom:not(.show) .modal-dialog {
    -webkit-transform: translate3d(0, 25%, 0);
    transform: translate3d(0, 25%, 0);
}

@media (min-width: 992px) {
    .modal.modal-scrolling {
        position: relative;
    }

        .modal.modal-scrolling .modal-dialog {
            position: fixed;
            z-index: 1050;
        }

    .modal.modal-content-clickable {
        top: auto;
        bottom: auto;
    }

        .modal.modal-content-clickable .modal-dialog {
            position: fixed;
        }

    .modal .modal-fluid {
        width: 100%;
        max-width: 100%;
    }

        .modal .modal-fluid .modal-content {
            width: 100%;
        }

    .modal .modal-frame {
        position: absolute;
        margin: 0;
        width: 100%;
        max-width: 100%;
    }

    .modal .modal-full-height {
        position: absolute;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        margin: 0;
        height: 100%;
        top: 0;
        right: 0;
    }

        .modal .modal-full-height.modal-top, .modal .modal-full-height.modal-bottom {
            display: block;
            width: 100%;
            max-width: 100%;
            height: auto;
        }

        .modal .modal-full-height.modal-top {
            bottom: auto;
        }

        .modal .modal-full-height.modal-bottom {
            top: auto;
        }

        .modal .modal-full-height .modal-content {
            width: 100%;
        }

        .modal .modal-full-height.modal-lg {
            width: 90%;
            max-width: 90%;
        }
}

@media (min-width: 992px) and (min-width: 992px) {
    .modal .modal-full-height.modal-lg {
        width: 800px;
        max-width: unset;
    }
}

@media (min-width: 992px) and (min-width: 1200px) {
    .modal .modal-full-height.modal-lg {
        width: 1000px;
        max-width: unset;
    }
}

@media (min-width: 992px) {
    .modal .modal-side {
        position: absolute;
        bottom: 10px;
        right: 10px;
        margin: 0;
        width: 400px;
    }
}

.alert {
    color: #888;
    z-index: 1060;
    left: 2px;
    max-width: 400px;
    overflow: hidden;
}

.alert-minimalist {
    background-color: rgb(241, 242, 240);
    border-color: rgba(149, 149, 149, 0.3);
    border-radius: 3px;
    color: rgb(149, 149, 149);
    padding: 10px !important;
    box-shadow: 0 1px 14px 1px rgba(39, 39, 39, 0.1);
    background-clip: border-box;
}

.alert img {
    margin-right: 10px;
    width: 80px;
    height: 80px;
    border-radius: 40px;
    box-shadow: 0 1px 14px 1px rgba(39, 39, 39, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.5);
}

.alert button.close, button.close {
    position: absolute;
    top: 20px !important;
    right: 15px !important;
    color: #888 !important;
    /*font-size: 30px !important;*/
}

/*.alert-minimalist > [data-notify="icon"] {
height: 50px;
margin-right: 12.5px;
}*/
.alert-minimalist > [data-notify="title"] {
    color: rgb(51, 51, 51);
    font-weight: bold;
    margin-bottom: 5px;
}

/*.alert-minimalist > [data-notify="message"] {
font-size: 80%;
}*/

.alert.alert-info, .alert-info, .alert-info .fa {
    color: #31708f !important;
    background-color: #d9edf7 !important;
    border-color: #bce8f1 !important;
}

.alert.alert-success, .alert-success .fa,
.alert-success {
    color: #3c763d !important;
    background-color: #dff0d8 !important;
    border-color: #d6e9c6 !important;
}

.alert.alert-warning, .alert-warning .fa,
.alert-warning {
    color: #8a6d3b !important;
    background-color: #fcf8e3 !important;
    border-color: #faebcc !important;
}

.alert.alert-danger, .alert-danger .fa,
.alert-danger {
    color: #a94442 !important;
    background-color: #f2dede !important;
    border-color: #ebccd1 !important;
}

.progress-bar {
    background-color: #106d1d;
}

.progress {
    background-color: rgba(255,255,255,.5);
}

.ps-container > .ps-scrollbar-y-rail {
    width: 0px;
}

    .ps-container > .ps-scrollbar-y-rail:hover > .ps-scrollbar-y, .ps-container > .ps-scrollbar-y-rail:active > .ps-scrollbar-y {
        width: 6px;
    }

.sidebar .navbar-minimize {
    right: 10px;
}

.sidebar .nav li > a, .off-canvas-sidebar .nav li > a {
    text-transform: initial;
}

.input-group, .form-group {
    margin-bottom: 0px;
}
/*.select2-container {
margin-top:4px;
}*/
.select2-container .select2-choice {
    width: 100%
}

    .select2-container .select2-choice .select2-arrow {
        border: none;
        display: none;
    }

.select2-search input, .select2-container .select2-choice {
    border: 1px solid #c7c7c7;
    border-radius: 5px;
}

input.select2-input {
    border: none;
    border-bottom: 1px solid #c7c7c7;
    border-radius: unset;
}

.input-group-addon .fa {
    color: #9e9e9e;
}

.select2-container .select2-choice .select2-arrow b {
    display: none;
}

.select2-results .select2-no-results, .select2-search input,
.select2-container .select2-choice .select2-arrow b {
    background-color: white;
}

.select2-search input {
    padding-top: 0;
    padding-bottom: 1px;
    padding-right: 10px;
    margin-top: 2px;
}

.select2-container .select2-choice .select2-arrow b {
    /*background-image: url('/Scripts/select2/select2.png') !important;*/
    background-image: unset !important;
    margin-top: 0px;
}

.select2-container .select2-choice .select2-arrow {
    background-color: transparent;
}

.select2-drop {
    margin-top: 3px;
    border-radius: 10px;
}

div.datetimepicker.datetimepicker-dropdown-bottom-right.dropdown-menu > div.datetimepicker-years > table > thead > tr > th, div.datetimepicker.datetimepicker-dropdown-bottom-right.dropdown-menu > div.datetimepicker-months > table > thead > tr > th {
    height: 40px;
}

[class*=" datetimepicker-dropdown"]:before {
    border-bottom: 7px solid transparent;
}

div.datetimepicker.datetimepicker-dropdown-bottom-right.dropdown-menu > div.datetimepicker-years > table {
    width: 300px;
}

div.datetimepicker.datetimepicker-dropdown-bottom-right.dropdown-menu > div.datetimepicker-months > table {
    width: 300px;
}

.datetimepicker td, .datetimepicker th {
    width: 55px !important;
}

.datetimepicker td, .datetimepicker th,
.select2-container .select2-choice, .datetimepicker td, .datetimepicker th {
    color: #2c2c2c;
}

    .select2-container .select2-choice > .select2-chosen {
        padding-left: 5px;
        margin-top: -2px;
    }

.modal-content, .modal-header {
    border-radius: 0px;
}

.select2-container-multi .select2-choices .select2-search-choice {
    border: none;
}

.select2-container-multi .select2-choices {
    border: 1px solid #c7c7c7;
    border-radius: 5px;
}

table.dataTable > tbody > tr > td > i {
    position: relative;
    top: 3px;
}

.col-md-6 .ml-auto {
    padding-right: 0px !important;
}

table.dataTable > tbody > tr > td > a > i {
    position: relative;
    top: 0px;
    width: 5px;
    margin: 1px 3px;
}

.btn {
    margin: 5px;
    margin-right: 5px;
    box-shadow: 0px 5px 25px 0px rgba(0, 0, 0, 0.2);
    min-width: 150px;
}

textarea.form-control:active {
    border: 1px solid #c7c7c7;
}

.arrows-1_minimal-left {
}

* {
    -moz-transition: height .5s ease;
    -webkit-transition: height .5s ease;
    -o-transition: height .5s ease;
    transition: height .5s ease;
}

.basic_page textarea.form-control {
    min-width: 400px;
}

textarea.form-control {
    height: 80px;
    min-height: 80px;
    max-height: unset;
    resize: vertical;
    border: 1px solid #c7c7c7;
    border-radius: 10px;
    line-height: 25px;
    padding: 5px;
    padding-left: 10px;
    min-width: 400px;
}

.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
    background-color: #f3f3f3;
    color: #211f1f;
}

.input-hourmin, .input-numeric, .input-interger {
    text-align: right;
}

.input-hourmin {
    width: 130px !important
}

.tooltip-inner {
    background-color: black;
    color: white;
}
/*.card-collapse .card .card-header {
padding:0;
}*/
.container-fluid {
    padding-left: 10px;
    padding-right: 10px;
}

.card {
    padding: 0;
    padding-bottom: 20px;
    /*padding-left: 20px;
padding-right: 20px;
padding-bottom: 20px;*/
}

#collapseFixTop > div {
    padding: 0 !important;
    margin: 0 0 10px 0 !important;
}

#collapseFixTop > .card-body > .card {
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: unset;
}

span.dtr-title > span {
    min-width: 200px;
    display: block;
}

th {
    border: none !important;
    font-weight: 400 !important;
}

ul > li > a > span.sidebar-normal {
    line-height: 28px;
}

div.dataTables_wrapper div.dataTables_info {
    color: #211f1f;
    padding-bottom: 8px;
    padding-left: 15px;
}

.card .card-header h4, .card .card-header h5 {
    padding-left: 30px;
    padding-top: 10px;
}

.card-header.headingOne {
    padding: 0px 20px;
}

.sidebar .sidebar-wrapper > .nav [data-toggle="collapse"] ~ div > ul > li > a .sidebar-normal:hover {
    color: white !important;
}

a > h4.card-title {
    padding: 5px 0px 0px 5px !important
}

.card-collapse > .card {
    padding: 5px 20px 5px 20px !important;
}

.card-collapse .card .card-header {
    padding: 0px;
}

.container-fluid, .card .card-footer {
    padding-bottom: 35px;
}

div.dataTables_wrapper div.dataTables_paginate {
    position: initial;
    right: 30px;
    bottom: 40px;
}

table .dataTable.dtr-inline.collapsed > tbody > tr > td:first-child:before, table.dataTable.dtr-inline.collapsed > tbody > tr > th:first-child:before {
    background-color: transparent;
    box-shadow: unset;
    font-family: FontAwesome;
    content: "\f06e";
    font-size: 23px !important;
    top: unset;
    margin-top: unset;
    width: 35px;
    opacity: .8;
}

.table > tbody > tr > td {
    padding: 6px;
    padding-bottom: 0px;
    vertical-align: top;
    line-height: 24px;
}

table.dataTable.dtr-inline.collapsed > tbody > tr.parent > td:first-child:before, table.dataTable.dtr-inline.collapsed > tbody > tr.parent > th:first-child:before {
    content: '\f070';
    font-family: FontAwesome;
    font-size: 23px;
    opacity: .8;
}

.dtr-inline > tbody > tr > td:first-child {
    padding-left: 5px;
}

.dtr-inline.collapsed > tbody > tr > td:first-child {
    padding-left: 50px !important;
}

    .dtr-inline.collapsed > tbody > tr > td:first-child.child {
        padding-left: 5px !important;
    }

.modal-body {
    padding: 0px;
    padding-right: 20px;
    padding-bottom: 20px;
}

@media only screen and (max-width: 600px) {
    div.dataTables_wrapper div.dataTables_filter input {
        width: 200px;
    }

    .card {
        padding: 0px;
        width: 100%;
    }

    .card-body, .card-header {
        padding: 10px;
    }

    .card-header {
        min-height: 45px;
    }

    .col-md-0, .col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
        padding-right: 5px;
        padding-left: 5px;
    }

    div.toolbar, .dataTables_filter {
        float: right;
    }

    .card-collapse .card .card-body, .card-collapse > .card {
        padding: 5px !important;
    }

    div.dataTables_wrapper div.dataTables_filter input {
        margin-left: 0px;
    }
    div.dataTables_wrapper div.dataTables_filter {
        margin-top: 0px;
        height: 30px;
    }
    div.dataTables_wrapper div.dataTables_filter input,
    div.dataTables_wrapper div.dataTables_filter label {
        margin-top: 12px;
    }
    #frmWorkSpaceBody .table_Template { 
        padding: 5px 20px;
    }

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

    .dataTables_info {
        display: none;
    }

    div.dataTables_wrapper div.dataTables_paginate {
        bottom: 14px;
    }

    table.dataTable > tbody > tr > td:first-child {
        padding-left: 0px !important;
    }

    a > h4.card-title {
        padding: 10px !important;
    }

    .modal-dialog {
        margin: 0px;
    }

    .modal-body {
        padding: 10px
    }

    .txt-input .form-group {
        margin-left: 0px;
    }

    .navbar-transparent, .navbar.navbar-absolute {
        padding-top: 10px;
        padding-bottom: 10px;
    }
}

.table.border-top-none > thead > tr > th:hover, .table.border-top-none > thead > tr > td:hover, .table.border-top-none > tbody > tr > td:hover,
.table.border-top-none > thead > tr > th, .table.border-top-none > thead > tr > td, .table.border-top-none > tbody > tr > td {
    border-top: none;
}

.table.border-none > thead > tr > th, .table.border-none > thead > tr > td:hover, .table.border-none > tbody > tr > td:hover,
.table.border-none > thead > tr > th, .table.border-none > thead > tr > td, .table.border-none > tbody > tr > td {
    border: none;
}

.txt-input .form-group {
    margin-left: -14px;
}

.frmGrid > .table > tbody > tr > td {
    padding-top: 0px;
    line-height: 22px;
}

.input-numeric, .input-interger, .int {
    width: 180px;
}

.frmGrid > .txt-input {
    height: 30px;
}

.frmGrid input.form-control {
    margin-top: -5px;
}

.frmGrid .txt-input, .frmGrid .txt-input > div {
    height: 30px
}

    .frmGrid .txt-input, .frmGrid .txt-input > div {
        height: 30px;
        /*width: 100%;*/
    }

/*.frmGrid .col-md-0 {
width: 100%;
}*/

.frmGrid .input-numeric, .frmGrid .input-interger {
    width: 100%;
}

.frmGrid .form-control {
    border-bottom: 1px solid #c7c7c7 !important;
}

.border_bottom_only {
    border-bottom: 1px solid #c7c7c7 !important;
}


.frmGrid .select2-container .select2-choice {
    margin-top: -9px;
}

.col-md-0 {
    width: 100px;
    max-width: 100px;
    min-width: 100px;
}

.col-md-15 {
    width: 15px !important;
    max-width: 15px !important;
    min-width: 15px !important;
}

.col-md-30 {
    width: 30px !important;
    max-width: 30px !important;
    min-width: 30px !important;
}

.col-md-50 {
    width: 50px !important;
    max-width: 50px !important;
    min-width: 50px !important;
}

.col-md-60 {
    width: 60px !important;
    max-width: 60px !important;
    min-width: 60px !important;
}

.col-md-70 {
    width: 70px;
    max-width: 70px;
    min-width: 70px;
}

.col-md-80 {
    width: 80px;
    max-width: 80px;
    min-width: 80px;
}

.col-md-90 {
    width: 100px;
    max-width: 100px;
    min-width: 100px;
}

.col-md-100 {
    width: 100px;
    max-width: 100px;
    min-width: 100px;
}

.col-md-140 {
    width: 140px;
    max-width: 140px;
    min-width: 140px;
}

.col-md-150 {
    width: 150px;
    max-width: 150px;
    min-width: 150px;
}

.col-md-130 {
    width: 130px;
    max-width: 130px;
    min-width: 130px;
}

.col-md-250 {
    width: 250px;
    max-width: 250px;
    min-width: 250px;
}

.col-md-220 {
    width: 220px;
    max-width: 220px;
    min-width: 220px;
}

.col-md-230 {
    width: 230px;
    max-width: 230px;
    min-width: 230px;
}

.col-md-200 {
    width: 200px;
    max-width: 200px;
    min-width: 200px;
}

.col-md-300 {
    width: 300px;
    max-width: 300px;
    min-width: 300px;
}

.col-md-350 {
    width: 350px;
    max-width: 350px;
    min-width: 350px;
}

.col-md-400 {
    width: 400px;
    max-width: 400px;
    min-width: 400px;
}

.tabFooter {
    position: absolute;
    bottom: 25px;
    left: 0px;
    right: 0px;
    height: 60px;
    padding-left: 20px;
    padding-top: 10px;
    background: white;
}

table.dataTable > thead > tr > th,
table.dataTable > tbody > tr > th,
table.dataTable > tfoot > tr > th,
table.dataTable > thead > tr > td,
table.dataTable > tbody > tr > td,
table.dataTable > tfoot > tr > td {
    padding: 5px !important;
    outline: 0;
    max-width: unset;
    width: unset;
    border-right: 0;
    border-bottom: 0;
}

.col-md-0, .col-md-30, .col-md-60,
.col-md-70,
.col-md-80,
.col-md-90,
.col-md-100,
.col-md-120,
.col-md-200, .col-md-220, .col-md-250 .col-md-300,
.col-md-400,
.col-md-600,
.col-md-150,
.col-md-250,
.col-md-350,
.col-md-450,
.col-md-550 {
    padding-right: 2px;
    padding-left: 2px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    text-align: center;
}

.modal-title h5 {
    margin-top: 0px !important;
}

.modal-footer {
    position: absolute;
    bottom: 0px;
    left: 0;
    right: 0;
}

.select2-drop-multi {
    margin-top: 4px;
}

.select2-search-choice-close {
    background-image: url('/Scripts/select2/select2.png') !important;
}

.select2-container-multi .select2-search-choice-close {
    left: 3px;
    top: 6px;
}

.select2-container-multi .select2-choices .select2-search-choice {
    margin-left: 7px;
}

.headerdivider {
    border-left: 1px solid #38546d;
    background: #16222c;
    width: 1px;
    height: 80px;
    position: absolute;
    right: 250px;
    top: 10px;
}

.headerdivider {
    border-left: 1px solid #38546d;
    background: #16222c;
    width: 1px;
    height: 80px;
    position: absolute;
    right: 250px;
    top: 10px;
}

.dropdown-menu .divider {
    height: 1px;
    overflow: hidden;
    background-color: #e5e5e5;
}

.dropdown-menu .dropdown-item {
    height: 34px;
    line-height: 34px;
}

.table-responsive {
    overflow: auto;
    min-height: 400px;
    padding-bottom: 30px;
    /*max-height: 850px;*/
}

.card-collapse .card .card-header:after {
    background-color: transparent;
}

.table-bordered thead td, .table-bordered thead th {
    border: none;
}

.collapsibleChild ul {
    margin-left: 20px;
}

.card .card-header {
    padding: 15px 25px 10px 0px;
}

table.table > thead > tr > th,
table.table > tbody > tr > th,
table.table > tfoot > tr > th,
table.table > thead > tr > td,
table.table > tbody > tr > td,
table.table > tfoot > tr > td {
    line-height: 28px;
    padding: 6px;
    padding-bottom: 0px;
    text-wrap: inherit;
}

table.dataTable > thead > tr > th,
table.dataTable > tbody > tr > th,
table.dataTable > tfoot > tr > th,
table.dataTable > thead > tr > td,
table.dataTable > tbody > tr > td,
table.dataTable > tfoot > tr > td {
    padding: 2px !important;
    line-height: 28px;
}

.tab-space {
    padding: 20px 0 80px 0px;
}

dataTables_filter, .dataTables_paginate {
    float: right;
}

div.toolbar {
    display: inline-flex;
    float: right;
}

table.dataTable thead .sorting:after,
table.dataTable thead .sorting_asc:after,
table.dataTable thead .sorting_desc:after,
table.dataTable thead .sorting_asc_disabled:after,
table.dataTable thead .sorting_desc_disabled:after {
    font-family: 'FontAwesome';
    font-size: 12px !important;
}

table.dataTable thead .disabled-sorting.sorting:after,
table.dataTable thead .disabled-sorting.sorting_asc:after,
table.dataTable thead .disabled-sorting.sorting_desc:after,
table.dataTable thead .disabled-sorting.sorting_asc_disabled:after,
table.dataTable thead .disabled-sorting.sorting_desc_disabled:after {
    display: none;
}

table.dataTable thead span { 
    padding-right: unset;
}

ul > li > a > span.sidebar-normal,
#collapseExample > ul > li > a > span.sidebar-normal {
    color: rgba(255,255,255,0.7) !important;
}

    ul > li > a > span.sidebar-normal:hover,
    #collapseExample > ul > li > a > span.sidebar-normal:hover {
        color: rgba(255,255,255,1) !important;
    }

table.dataTable thead .sorting_desc:after,
table.dataTable thead .sorting_asc:after {
    float: unset;
    margin-left: 0px;
    display: inline-block;
}

table.dataTable thead .sorting:after {
    opacity: 0.4;
    content: "\f0dc";
    float: unset;
    margin-left: 0px;
    display: inline-block;
}

table.dataTable thead .sorting_asc:after {
    content: "\f0de";
    top: 2px;
    margin-left: 0px;
    display: inline-block;
}

table.dataTable thead .sorting_desc:after {
    content: "\f0dd";
    top: -3px;
    margin-left: 0px;
    display: inline-block;
}

/*table.dataTable span {
color: #888;
font-size: 18px !important;
}*/
 
table.dataTable th {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

table.dataTable i {
    font-size: 23px !important;
    /*opacity:.8;*/
    cursor: pointer;
}

table.dataTable tr.group {
    cursor: pointer;
}

.table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(222, 222, 222, 0.3);
}

table.dataTable tr > td, table.dataTable tr > th {
    max-width: unset;
    width: unset;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.nav-pills .nav-item .nav-link, .btn, .navbar .navbar-nav > a.btn {
    padding: 5px 25px;
    line-height: 30px;
}

.nav-pills .nav-item .nav-link {
    padding-right: 30px;
    min-width: 150px;
    margin-bottom:5px;
}

.nav-pills .nav-item i {
    margin-right: 20px;
    margin-left: 0;
}
/*.table {
width:99%;
}*/
[role=tablist] {
    height: 40px;
}

.cke_reset_all * {
    font-size: 14px !important;
}

.modal-content .modal-body {
    padding: 10px;
}

.datetimePicker {
    padding-left: 0px;
    text-align: center;
}

/* Dropdown Button */
.dropbtn {
    /*background-color: #4CAF50;*/
    /*color: white;*/
    padding: 0px;
    border: none;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
    position: relative;
    display: inline-block;
    cursor: pointer;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
    display: none;
    position: absolute;
    background-color: rgba(0,0,0,.9);
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
    border-radius: 10px;
    padding-bottom: 15px;
    padding-top: 15px;
    color: white !important;
}

    /* Links inside the dropdown */
    .dropdown-content > a {
        text-align: left;
        padding: 5px;
        padding-left: 15px;
        text-decoration: none;
        display: block;
        color: white !important;
    }

    /* Change color of dropdown links on hover */
    .dropdown-content a:hover {
        color: #5897fb !important;
        /*background-color: #ddd*/
    }

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
    display: block;
}

/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown a > h4:hover, .dropdown:hover .dropbtn {
    color: #5897fb !important;
    /*background-color: #3e8e41;*/
}

.dropdown a.active {
    color: #0044cc !important;
}

.status_Planning {
    color: white !important;
    background-color: #7eca8f !important;
    border-color: #7eca8f !important;
}

.status_Open {
    color: white !important;
    background-color: rgba(40,167,69,1) !important;
    border-color: rgba(40,167,69,1) !important;
}

.status_OnGoing {
    color: white !important;
    background-color: #5cbdcd !important;
    border-color: #5cbdcd !important;
}

.status_OnProcess {
    color: white !important;
    background-color: rgba(23,162,184,1) !important;
    border-color: rgba(23,162,184,1) !important;
}

.status_Warring {
    color: white !important;
    background-color: #ffe083 !important;
    border-color: #ffe083 !important;
}

.status_Emergency {
    color: white !important;
    background-color: rgba(255,193,7,1) !important;
    border-color: rgba(255,193,7,1) !important;
}

.status_Extreme {
    color: white !important;
    background-color: rgba(220, 53, 69,1) !important;
    border-color: rgba(220, 53, 69,1) !important;
}

.status_Cancel {
    color: white !important;
    background-color: rgba(255,193,7,1) !important;
    border-color: rgba(255,193,7,1) !important;
}

.basic_page {
    padding-bottom: 200px;
}

.w3-animate-left {
    position: relative;
    animation: animateleft 0.4s;
}


td > p {
    padding-left: 5px;
}

@keyframes animateleft {
    from {
        left: -300px;
        opacity: 1
    }

    to {
        left: 0;
        opacity: 0
    }
}

.timeline-badge > i.fa {
    margin-left: 10px;
}

.basic_page, .w3-animate-right {
    position: relative;
    animation: animateright 0.4s
}

@keyframes animateright {
    from {
        right: -300px;
        opacity: 0
    }

    to {
        right: 0;
        opacity: 1
    }
}

.w3-animate-bottom {
    position: relative;
    animation: animatebottom 0.4s
}

.sliding-middle-out > * > * {
    cursor: pointer;
}

.sliding-middle-out {
    /*display: inline-block;*/
    position: relative;
    padding-bottom: 1px;
    cursor: pointer;
}

    .sliding-middle-out:after {
        content: '';
        display: block;
        margin: auto;
        height: 1px;
        width: 0px;
        background: transparent;
        transition: width .5s ease, background-color .5s ease;
        cursor: pointer;
    }

    .sliding-middle-out:hover:after {
        width: 100%;
        cursor: pointer;
    }

.sliding-u-l-r-l {
    display: inline-block;
    position: relative;
    padding-bottom: 1px;
    cursor: pointer;
}

    .sliding-u-l-r-l:before {
        content: '';
        display: block;
        position: absolute;
        left: 0;
        bottom: 0;
        height: 1px;
        width: 0;
        transition: width 0s ease, background .5s ease;
        cursor: pointer;
    }

    .sliding-u-l-r-l:after {
        content: '';
        display: block;
        position: absolute;
        right: 0;
        bottom: 0;
        height: 1px;
        width: 0;
        background: blue;
        transition: width .5s ease;
        cursor: pointer;
    }

    .sliding-u-l-r-l:hover:before {
        width: 100%;
        background: blue;
        transition: width .5s ease;
        cursor: pointer;
    }

    .sliding-u-l-r-l:hover:after {
        width: 100%;
        background: transparent;
        transition: all 0s ease;
        cursor: pointer;
    }

.card-timeline .timeline > li.timeline-inverted > .timeline-panel {
    background-color: #faf9f8;
    box-shadow: 0 1px 15px 1px rgba(39, 39, 39, 0.1);
}


.card-timeline .timeline > li > .timeline-panel {
    background-color: #faf9f8;
}

    .card-timeline .timeline > li > .timeline-panel:before {
        border-left: 15px solid #faf9f8;
        border-right: 0 solid #faf9f8;
    }

    .card-timeline .timeline > li > .timeline-panel:after {
        border-top: 14px solid transparent;
        border-left: 14px solid #faf9f8;
        border-right: 0 solid #faf9f8;
    }

.card-timeline .timeline:before {
    background-color: black;
}

.ms-container .ms-list {
    border: 1px solid #c7c7c7;
    /*height:100%;*/
}

.btn {
    line-height: 22px;
}

.sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 100;
    top: 60px;
    left: 0;
    background-color: white;
    overflow-x: hidden;
    -webkit-transition: width .3s !important;
    transition: width .3s !important;
    text-align: center;
}

    .sidenav a.link {
        padding: 8px 8px 8px 32px;
        text-decoration: none;
        color: #818181 !important;
        display: block;
        transition: 0.3s;
        cursor: pointer;
    }

.inline-flex {
    display: inline-flex !important;
}

iframe {
    border: 1px solid #ccc;
}

.sidenav a.link:hover {
    color: white !important;
}

.sidenav .closebtn {
    position: absolute;
    top: 80px;
    right: 20px; 
    margin-left: 50px;
    font-size: 35px !important;
    font-weight: bold;
    z-index:999;
}

@media screen and (max-height: 450px) {
    .sidenav {
        padding-top: 15px;
    }

        .sidenav a {
            font-size: 18px;
        }
}


.btnRound {
    margin-left: 20px;
    float: right;
}

.btn-report .fa {
    color: white !important;
}

.btnRound:hover {
    background-color: rgba(255, 255, 255, 0.8) !important;
}

legend a {
    color: #ccc;
}

legend.legendStyle {
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 0px;
    padding-bottom: 0px;
    font-weight: 400;
}

fieldset.fsStyle {
    font-weight: normal;
    border: 1px solid #ccc;
    padding: 4px;
    border-radius: 5px;
    padding-top: 0px;
    padding-bottom: 10px;
    margin-top: 10px;
    width: 100%;
}

legend.legendStyle {
    color: #ccc;
    background-color: transparent;
    font-weight: 400;
}

legend {
    width: auto;
    border-bottom: 0px;
    margin-bottom: 0px;
}

.ms-container {
    padding-left: 15px;
    padding-right: 15px;
    margin-top: -10px;
}

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
    color: #ccc;
}

::-moz-placeholder { /* Firefox 19+ */
    color: #ccc;
}

:-ms-input-placeholder { /* IE 10+ */
    color: #ccc;
}

:-moz-placeholder { /* Firefox 18- */
    color: #ccc;
}

table.dataTable {
    padding-left: 10px;
    padding-right: 10px;
}

.table_Template table.dataTable thead .sorting {
    padding-left: 0px;
}

.table_Template table.dataTable thead .sorting_asc::after,
.table_Template table.dataTable thead .sorting_desc::after,
.table_Template table.dataTable thead .sorting_asc,
.table_Template table.dataTable thead .sorting_desc {
    padding-left: 0px;
}

    .table_Template table.dataTable thead .sorting:after,
    .table_Template table.dataTable thead .sorting_asc:after,
    .table_Template table.dataTable thead .sorting_desc:after,
    .table_Template table.dataTable thead .sorting_asc_disabled:after,
    .table_Template table.dataTable thead .sorting_desc_disabled:after {
        right: 0px;
    }

    .table_Template table.dataTable thead .sorting_desc:after, table.dataTable thead .sorting_asc:after,
    .table_Template table.dataTable thead .sorting:after {
        margin-left: 10px;
        margin-right: 10px;
    }

/*@media screen and (max-width: 991px) {
    .card-header.calendar, .card-body.calendar {
        padding: 5px !important;
    }
}*/
.modal-content .modal-footer {
    padding-bottom: 0px;
}

.Special {
    background-color: #fff3e1;
    color: #ffa61e;
}

.Tradition {
    /*background-color: #f5e7e0;*/
    background-color: #eaf3f9;
    color: #6eb1d7;
}

.Tradition-C {
    color: #6eb1d7;
}

.Weekend {
    background-color: #e2f2f1;
    color: #36a8a1;
}

p.listValue:hover {
    background-color: #eee;
}

.Leave, .Leave span {
    color: #ff9d00 !important;
}

.Absent, .Early, .Late, .Absent span, .Early span, .Late span {
    color: #EC7063 !important;
}

.Absent {
    /*color: #EC7063 !important;*/
    color: #ff1800 !important;
}

.btn-link {
    cursor: pointer;
}

.form-check .form-check-label {
    padding-left: 20px;
}

.modal-footer {
    background-color: #f3f3f3;
}

.chip {
    display: inline-block;
    padding: 0 25px;
    height: 36px;
    font-size: 16px;
    line-height: 36px;
    border-radius: 25px;
    background-color: #eee;
    margin-left: 5px;
    overflow: hidden;
    width: 100%;
    min-width: 200px;
}

    .chip input {
        width: 100%;
        min-width: 200px;
    }

    .chip img {
        float: left;
        margin: 0 10px 0 -25px;
        height: 50px;
        width: 50px;
        border-radius: 50%;
    }

ul.breadcrumb-criteria {
    padding: 5px 10px;
    list-style: none;
    background-color: transparent;
}

    /* Display list items side by side */
    ul.breadcrumb-criteria li {
        display: inline; 
        /*line-height: 45px;*/
    }

        /* Add a slash symbol (/) before/behind each list item */
        ul.breadcrumb-criteria li.navigation + li:before {
            padding: 8px;
            color: #eeeeee;
            content: "/\00a0";
        }

.card-user .avatar {
    border: none;
}
/* Add a color to all links inside the list */
ul.breadcrumb-criteria li a {
    color: #0275d8;
    text-decoration: none;
}

    /* Add a color on mouse-over */
    ul.breadcrumb-criteria li a:hover {
        color: #01447e;
        text-decoration: underline;
    }

.border-none, .form-control:focus .border-none {
    border: none !important;
}

.breadcrumb-criteria .dropdown-list {
    width: 400px;
}

ul.employee-list li {
    display: list-item;
    margin-top: 5px;
    padding-right: 10px;
}

ul.employee-list .chip:hover {
    background-color: #dddddd;
}

.chip p {
    padding-top: 7px;
    line-height: 15px; 
}

    .chip p.description {
        padding-top: 0px;
        margin-top: -4px;
        line-height: 23px; 
    }

ul.breadcrumb-criteria li.navigation + li:before {
    font-family: FontAwesome !important;
    content: "\f105";
    font-size: 30px;
    position: relative;
    top: -9px;
    margin-left: 10px;
}

.hide {
    display: none !important;
}


.bootstrap-select > .dropdown-toggle {
    margin-top: 5px;
}

.modal-header, .modal-footer {
    min-height: 55px;
    overflow: hidden;
}

@media screen and (max-width: 991px) {
    .modal-title {
        padding-bottom: 12px;
        margin-top: -6px;
        padding-top: 8px;
    }

    .modal-header, .modal-footer {
        min-height: 40px;
        overflow: auto;
    }
}

.modal-body .dropdown-menu.dropdown-list {
    width: 500px;
}

.text-warning {
    color: #ffc107 !important;
}

.basic_page .col-md-5 {
    flex: 0 0 35%;
}

.basic_page .col-md-6 {
    flex: 0 0 75%;
}

card.card-user .card-body {
    overflow: unset;
}

.card_img_upload {
    overflow: hidden;
}

.frmGrid .form-control[disabled] {
    border-bottom-color: transparent !important;
}

.text-header {
    height: 30px;
}

.txtsection {
    margin-bottom: 10px !important;
    margin-top: 15px !important;
}

.EmployeePhoto {
    background-image: url(../../../../images/avatar/employee_avatar_120.png);
    background-position: center;
    height: 70px;
    width: 70px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.card::after {
    border-radius: 0.1875rem !important;
}

.card .card-img-top {
    border-radius: 0.1875rem !important;
    border-bottom-left-radius: unset !important;
    border-bottom-right-radius: unset !important;
}

#divFixTop > .card-header {
    margin-left: -10px;
    margin-top: 10px;
}

.nav-pills:not(.nav-pills-icons):not(.nav-pills-just-icons) .nav-item .nav-link {
    border-radius: 0.2rem !important;
}

table.table > thead > tr > th {
    vertical-align: middle;
}

ul.breadcrumb-criteria .btn {
    vertical-align: top;
}
.datetimepicker thead tr:first-child th, .datetimepicker tfoot th {
    cursor: pointer;
    height: 40px;
}
div .datetimepicker-days > table > thead > tr:nth-child(1) > th.next, div.datetimepicker-days > table > thead > tr:nth-child(1) > th.prev {
top: 22px;
    height: 40px;
}

.datetimepicker th.switch {
    height: 30px;
}

.basic_page > .card-body {
    min-height: 400px;
}

.none_events {
    pointer-events: none;
    background-color: #f3f3f3;
}

.navbar .navbar-toggler {
    width: 45px;
    height: 30px;
}

.card .card-footer {
    padding-left: 10px !important;
}

.color-pastel1 {
    background-color: #cce2cb;
}

.color-pastel2 {
    background-color: #9ab7d3;
}

.color-pastel3 {
    background-color: #ffdbcc;
}

.color-pastel4 {
    background-color: #dfccf1;
}

.color-pastel5 {
    background-color: #b5ead6;
}

.color-pastel6 {
    background-color: #eaeaea;
}

.color-pastel7 {
    background-color: #f6eac2;
}

.color-pastel8 {
    background-color: #e2f0cb;
}

.color-pastel9 {
    background-color: #edeae5;
}

.color-pastel0 {
    background-color: #f7e1d3;
}

a {
    text-decoration: unset;
}

table.dataTable td, .table td {
    white-space: unset;
    text-align: left;
    vertical-align: top;
}

td[aria-expanded=true] .fa-caret-right {
    display: none;
}

td[aria-expanded=false] .fa-caret-down  {
    display: none;
}
/*
li.nav-item a {
    display: list-item;
}*/
.table-borderless thead th, .dataTables_empty {
    vertical-align: bottom;
    border: none !important;
}
li > a {
    display: flow-root list-item;
}

[role=grid] tr td:first-child {
    min-width: 30px !important;
    max-width: 90px !important;
}

[role=grid] tr td:first-child a {
    vertical-align: middle !important;
    text-align: center !important;
}

table.dataTable > tbody > tr > td:first-child > a > i, table.dataTable > tbody > tr > td:first-child > a {
    display: inline-block !important;
    min-width: 25px !important;
    min-height: 25px !important;
}

a.Table_clickEdit, a > i.fa > * {
    min-height: 25px !important;
    min-width: 25px !important;
    display: inline-block !important;
}
div.dataTables_wrapper div.dataTables_filter {
    padding-right: 20px;
}
.tab-pane-body > .col-md-12 {
    padding:0px;margin:0px;
}