@font-face {
    font-family: 'Roboto', sans-serif;
    src: url('font/Veuz-Regular.woff2') format('woff2'),
    url('font/Veuz-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto', sans-serif;
    src: url('font/Veuz-Regular.woff2') format('woff2'),
    url('font/Veuz-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto', sans-serif;
    src: url('font/Veuz-Bold.woff2') format('woff2'),
    url('font/Veuz-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto', sans-serif;
    src: url('font/Veuz-Bold.woff2') format('woff2'),
    url('font/Veuz-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}


.m-l-3 {
    margin-left: 3px
}

.m-l-5 {
    margin-left: 5px
}

.m-l-8 {
    margin-left: 8px
}

.m-l-10 {
    margin-left: 10px
}

.m-l-13 {
    margin-left: 13px
}

.m-l-15 {
    margin-left: 15px
}

.m-l-18 {
    margin-left: 18px
}

.m-l-20 {
    margin-left: 20px
}

.m-l-23 {
    margin-left: 23px
}

.m-l-25 {
    margin-left: 25px
}

.m-l-28 {
    margin-left: 28px
}

.m-l-30 {
    margin-left: 30px
}

.m-l-33 {
    margin-left: 33px
}

.m-l-35 {
    margin-left: 35px
}

.m-l-38 {
    margin-left: 38px
}

.m-l-40 {
    margin-left: 40px
}

.m-r-3 {
    margin-right: 3px
}

.m-r-5 {
    margin-right: 5px
}

.m-r-8 {
    margin-right: 8px
}

.m-r-10 {
    margin-right: 10px
}

.m-r-13 {
    margin-right: 13px
}

.m-r-15 {
    margin-right: 15px
}

.m-r-18 {
    margin-right: 18px
}

.m-r-20 {
    margin-right: 20px
}

.m-r-23 {
    margin-right: 23px
}

.m-r-25 {
    margin-right: 25px
}

.m-r-28 {
    margin-right: 28px
}

.m-r-30 {
    margin-right: 30px
}

.m-r-33 {
    margin-right: 33px
}

.m-r-35 {
    margin-right: 35px
}

.m-r-38 {
    margin-right: 38px
}

.m-r-40 {
    margin-right: 40px
}

.m-b-3 {
    margin-bottom: 3px
}

.m-b-5 {
    margin-bottom: 5px
}

.m-b-8 {
    margin-bottom: 8px
}

.m-b-10 {
    margin-bottom: 10px
}

.m-b-13 {
    margin-bottom: 13px
}

.m-b-15 {
    margin-bottom: 15px
}

.m-b-18 {
    margin-bottom: 18px
}

.m-b-20 {
    margin-bottom: 20px
}

.m-b-23 {
    margin-bottom: 23px
}

.m-b-25 {
    margin-bottom: 25px
}

.m-b-28 {
    margin-bottom: 28px
}

.m-b-30 {
    margin-bottom: 30px
}

.m-b-33 {
    margin-bottom: 33px
}

.m-b-35 {
    margin-bottom: 35px
}

.m-b-38 {
    margin-bottom: 38px
}

.m-b-40 {
    margin-bottom: 40px
}

.m-t-3 {
    margin-top: 3px
}

.m-t-5 {
    margin-top: 5px
}

.m-t-8 {
    margin-top: 8px
}

.m-t-10 {
    margin-top: 10px
}

.m-t-13 {
    margin-top: 13px
}

.m-t-15 {
    margin-top: 15px
}

.m-t-18 {
    margin-top: 18px
}

.m-t-20 {
    margin-top: 20px
}

.m-t-23 {
    margin-top: 23px
}

.m-t-25 {
    margin-top: 25px
}

.m-t-28 {
    margin-top: 28px
}

.m-t-30 {
    margin-top: 30px
}

.m-t-33 {
    margin-top: 33px
}

.m-t-35 {
    margin-top: 35px
}

.m-t-38 {
    margin-top: 38px
}

.m-t-40 {
    margin-top: 40px
}

.p-l-3 {
    padding-left: 3px
}

.p-l-5 {
    padding-left: 5px
}

.p-l-8 {
    padding-left: 8px
}

.p-l-10 {
    padding-left: 10px
}

.p-l-13 {
    padding-left: 13px
}

.p-l-15 {
    padding-left: 15px
}

.p-l-18 {
    padding-left: 18px
}

.p-l-20 {
    padding-left: 20px
}

.p-l-23 {
    padding-left: 23px
}

.p-l-25 {
    padding-left: 25px
}

.p-l-28 {
    padding-left: 28px
}

.p-l-30 {
    padding-left: 30px
}

.p-l-33 {
    padding-left: 33px
}

.p-l-35,
.p-l-38 {
    padding-left: 35px
}

.p-l-40 {
    padding-left: 40px
}

.p-r-3 {
    padding-right: 3px
}

.p-r-5 {
    padding-right: 5px
}

.p-r-8 {
    padding-right: 8px
}

.p-r-10 {
    padding-right: 10px
}

.p-r-13 {
    padding-right: 13px
}

.p-r-15 {
    padding-right: 15px
}

.p-r-18 {
    padding-right: 18px
}

.p-r-20 {
    padding-right: 20px
}

.p-r-23 {
    padding-right: 23px
}

.p-r-25 {
    padding-right: 25px
}

.p-r-28 {
    padding-right: 28px
}

.p-r-30 {
    padding-right: 30px
}

.p-r-33 {
    padding-right: 33px
}

.p-r-35 {
    padding-right: 35px
}

.p-r-38 {
    padding-right: 38px
}

.p-r-40 {
    padding-right: 40px
}

.p-b-3 {
    padding-bottom: 3px
}

.p-b-5 {
    padding-bottom: 5px
}

.p-b-8 {
    padding-bottom: 8px
}

.p-b-10 {
    padding-bottom: 10px
}

.p-b-13 {
    padding-bottom: 13px
}

.p-b-15 {
    padding-bottom: 15px
}

.p-b-18 {
    padding-bottom: 18px
}

.p-b-20 {
    padding-bottom: 20px
}

.p-b-23 {
    padding-bottom: 23px
}

.p-b-25 {
    padding-bottom: 25px
}

.p-b-28 {
    padding-bottom: 28px
}

.p-b-30 {
    padding-bottom: 30px
}

.p-b-33 {
    padding-bottom: 33px
}

.p-b-35 {
    padding-bottom: 35px
}

.p-b-38 {
    padding-bottom: 38px
}

.p-b-40 {
    padding-bottom: 40px
}

.p-t-3 {
    padding-top: 3px
}

.p-t-5 {
    padding-top: 5px
}

.p-t-8 {
    padding-top: 8px
}

.p-t-10 {
    padding-top: 10px
}

.p-t-13 {
    padding-top: 13px
}

.p-t-15 {
    padding-top: 15px
}

.p-t-18 {
    padding-top: 18px
}

.p-t-20 {
    padding-top: 20px
}

.p-t-23 {
    padding-top: 23px
}

.p-t-25 {
    padding-top: 25px
}

.p-t-28 {
    padding-top: 28px
}

.p-t-30 {
    padding-top: 30px
}

.p-t-33 {
    padding-top: 33px
}

.p-t-35 {
    padding-top: 35px
}

.p-t-38 {
    padding-top: 38px
}

.p-t-40 {
    padding-top: 40px
}

/* .bootstrap-select.open .show>.btn-light, .bootstrap-select.open .show>.btn-light:hover {
    background-color: #fff;
} */

.file-upload {
    background-color: #ffffff;
    margin: 0 auto;
    clear: both;
}

.file-upload-btn {
    width: 200px;
    margin: 0;
    color: #fff;
    background: #2b2c42;
    border: none;
    padding: 10px;
    border-radius: 4px;
    border-bottom: 2px solid #39354c;
    transition: all .2s ease;
    outline: none;

}

.file-upload-btn:hover {
    background: #39354c;
    color: #ffffff;
    transition: all .2s ease;
    cursor: pointer;
}

.file-upload-btn:active {
    border: 0;
    transition: all .2s ease;
}

.file-upload-content {
    display: none;
    text-align: center;
}

.file-upload-input {
    position: absolute;
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    outline: none;
    opacity: 0;
    cursor: pointer;
}

.image-upload-wrap {
    margin-top: 0px;
    border: 2px dashed #9b97af;
    position: relative;
}

.image-dropping,
.image-upload-wrap:hover {
    opacity: .8;
}

.image-title-wrap {
    padding: 0 15px 15px 15px;
    color: #222;
    clear: both;
}

.drag-text {
    text-align: center;
}

.drag-text h3 {
    font-weight: 100;
    padding: 32px 0;
    font-size: 12px;
}

.file-upload-image {
    max-height: 200px;
    max-width: 200px;
    float: left;
    padding: 20px;
    clear: both;
}

.remove-image {
    width: 200px;
    margin: 0;
    color: #fff;
    background: #cd4535;
    border: none;
    padding: 10px;
    border-radius: 4px;
    border-bottom: 4px solid #b02818;
    transition: all .2s ease;
    clear: both;
    float: left;
}

.remove-image:hover {
    opacity: .8;
}

.remove-image:active {
    border: 0;
    transition: all .2s ease;
}

.secondary_title {
    font-size: 16px !important;
    width: 100%;
    border-bottom: 1px solid #ccc;
    line-height: 32px !important;
    margin: 15px 0;
}

.ternary_title {
    font-size: 14px !important;
    width: 100%;
    border-bottom: 1px solid #ccc;
    line-height: 32px !important;
    margin: 5px 0 15px;
}

.metismenu {
    padding: 0;
}

.metismenu ul {
    padding: 0;
}

.metismenu ul li {
    list-style: none;
}

.sidbarnav {
    font-size: 18px;
    cursor: pointer;
    line-height: 42px;
}

.topbar {
    background-color: #222;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 99;
    left: 0px;
    height: 52px;
}

.open-right {
    font-size: 16px;
    line-height: 45px;
    margin-right: 10px
}

.sidbarnavcls {
    display: none
}

.open-right span {
    color: #8e8e8e
}

.preview_image_box {
    width: 150px;
    height: 150px;
    position: relative;
    border-radius: 100%;
    border: 6px solid #f8f8f8;
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
    background-size: contain !important;
    clear: both;
    margin-bottom: 35px;
}

.preview_image_box img {
    position: absolute;
    height: 100%;
    width: 100%;
}

.preview_image_box #imageUpload {
    display: inline-block;
    width: 34px;
    height: 34px;
    margin-bottom: 0;
    border-radius: 100%;
    background: #72819c;
    border: 1px solid transparent;
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.12);
    cursor: pointer;
    font-weight: normal;
    transition: all 0.2s ease-in-out;
}

.enlarge_modal,
.dslarge_modal,
.enlarge,
.dslarge {
    vertical-align: middle;
    text-align: center;
    color: #ffffff !important;
    padding: 4px 7px !important;
    font-size: 14px;
    margin-left: -1px;
    margin-top: 0px;
    background-color: #72819c;
}

.dslarge_modal,
.enlarge_modal {
    background: none
}

.largclss .box_header {
    border-bottom: 1px solid #b9c0cc;
}

.enlarge_modal {
    margin-right: 15px;
}

.enlarge_modal,
.dslarge_modal {
    color: #fff !important;
}

.enlarge_modal:hover,
.dslarge_modal:hover {
    color: #fff !important;
    opacity: .8;
}

.enlarge:hover,
.dslarge:hover {
    opacity: .8;
}

.largclss {
    position: fixed;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    margin: 0;
    width: 100% !important;
    max-width: 100% !important;
    z-index: 1000;
    background-color: #fff;
    max-width: 100%;
    height: 100vh !important;
    margin: 0 !important;
    overflow-y: auto;
}

.largclss .modal .modal-dialog .close {
    top: 7px;
    right: 16px;
}

.kanbanbdy {
    min-width: 3000px
}

.kanbanbdy .btn {
    border-radius: 50%;
    font-size: 14px;
    outline: none !important;
    padding: 0px 3px;
    height: 17px;
    background-color: #e4e4e4;
}

.kanbanbx {
    overflow-x: auto;
}

.kanban {
    clear: both;
}

.kanban,
.kanbanbdy {
    display: flex;
    flex-wrap: nowrap;
}

.kanbanbdy .kanbantdbody,
.kanbanbdy .kanbantdbody:first-child {
    float: left;
    border-right: 1px solid #dcdcdc;
    padding: 5px 5px 40px;
    margin-bottom: 0;
    max-height: 80vh;
    overflow-y: auto
}

.kanbanbdy .kanbantdbody:first-child {
    width: 256px
}

.kanbnsetng {
    float: left;
    margin-top: 10px;
    margin-right: 3px
}

.kanbanbdy .kanbantdbody {
    width: 276px
}

.cursor {
    color: #000 !important
}

.kanbnsetng .dropdown-menu.show {
    display: block;
    padding: 10px;
    box-shadow: 1px 2px 9px #ccc
}

.kanbanitem p {
    margin-bottom: 1px;
    font-size: 12px;
    line-height: 18px
}

.kanban .beforestgfrst {
    background-color: #516c9c;
    width: 38px;
    height: 33px;
    float: left;
    border-radius: 60px 0 0 60px
}

.kanban .beforestgdflt {
    background: url(../images/beforestgdflt.png);
    width: 24px;
    height: 33px;
    float: left;
    margin-left: -19px
}

.kanbanbdy[data-draggable=target] {
    overflow-y: auto;
    display: flexbox;
    background-color: #f6f6f6;
    margin-right: 4px
}

.kanbanbdy[data-draggable=item] {
    line-height: 1.3;
    cursor: move
}

.kanban .kanbantd {
    width: 280px;
    padding: 0;
    float: left;
    position: relative;
    display: flex;
    flex-wrap: nowrap
}

.kanbanbodycontnt {
    margin: 10px 0;
    padding: 4px
}

.kanbanitem {
    list-style: none;
    border-radius: 3px;
    width: 100%;
    padding: 10px;
    position: relative;
    margin-bottom: 4px;
    background-color: #fff;
    box-shadow: 0 3px 3px #dcdcdc;
    border: 1px solid #e4e4e4;
}

.kanbanitem:hover {
    box-shadow: 0 3px 7px #bbbaba;
}

.tablebox {
    padding: 30px 10px 0
}

.hide {
    display: none;
}

.block {
    display: block !important;
}

.staff_boked_box {
    border-top: 1px solid #ccc;
    padding: 10px;
    margin-top: 10px;
}

.staff_boked_box .checkbox {
    margin-top: 10px;
}

.input-group .form-control,
.input-group-addon,
.input-group-btn {
    display: table-cell;
}

.newbtn_tab_insde {
    position: absolute;
    right: 15px;
    top: 18px;
    padding: 4px 6px !important;
}

.input-group-addon {
    background: transparent none repeat scroll 0 0;
    border: #dedede 1px solid;
    border-left: 0;
    border-radius: 0;
    color: #212121;
    min-width: 32px;
    text-align: center;
    line-height: 28px;
}

.cursor_pontr {
    cursor: pointer;
}

#employee_suprvsr {
    background-color: rgba(0, 0, 0, .3);
    z-index: 1055;
}

h3.rolettle {
    margin-top: 5px !important;
    margin-bottom: 0 !important;
    line-height: 30px;
    font-size: 15px;
    font-weight: 700;
    color: #545454
}

.editbtn {
    background-color: #e8910d;
    color: #fff
}

.histrybtn {
    background-color: #2098d1;
    color: #fff
}

.addbtn,
.deletebtn {
    background-color: #f6f6f3
}

.maxhtrlebx {
    max-height: 300px
}

.deletebtn {
    color: #000;
    margin-bottom: 5px
}

.datpckralnmenttable[type=checkbox] + label {
    padding-left: 3px;
    padding-right: 3px;
    margin-left: 6px;
    margin-right: 17px;
    height: 16px
}

.deletebtn i {
    color: #ff343a
}

.addbtn {
    color: #000;
    margin-bottom: 5px
}

.addbtn i {
    color: #35b65d
}

.addroletablealn .bgcolr1 th {
    background-color: #e9ecef;
    padding: 5px 1px;
}

.addroletablealn > tbody > tr > td,
.addroletablealn > thead > tr > th {
    border: 1px solid #ececec
}

.expirationbox {
    margin-bottom: 10px
}

.m-t-10-imprtnt {
    margin-top: 10px !important;
}

.vz_tablebx input {
    padding: 3px 1px;
    display: block;
    border: 1px solid #ebebeb;
    font-weight: 400;
    height: 26px !important;
    font-size: 14px;
    border-radius: 2px;
}

.addroletablealn tr th {
    width: 100px;
    text-align: center;
}

table.addroletablealn {
    width: 100%;
}

table.addroletablealn tbody tr > th {
    background-color: #e9ecef !important;
    border-bottom: 1px solid #e6e1e1;
    padding-left: 10px;
    font-size: 13px;
}

table.addroletablealn .checkbox label {
    vertical-align: top;
    margin-top: 2px;
}

.addroletablealn tbody > tr > th:first-child {
    text-align: left;
}

.addroletablealn tbody {
    text-align: center;
}

.th_user_role {
    width: 260px;
}

.th_user_decrptn {
    width: 490px;
}

.th_user_strtdate {
    width: 150px;
}

.th_user_enddate {
    width: 150px;
}

.tbl_stngs {
    overflow-x: auto;
}

.scrolbaletable .input-group > .form-control:not(:last-child) {
    border-radius: 0 !important;
}

.scrolbaletable .input-group-addon {
    line-height: 20px;
}

.commen_table.tbl_stngs div.dataTables_wrapper div.dataTables_filter input {
    margin-right: 0px;
}


.itemedit {
    position: absolute;
    width: 20px;
    right: 5px;
    text-align: right
}

.enlarge_modal,
.largclss .dslarge_modal,
.enlarge,
.largclss .dslarge {
    display: inline-block;
}

.dslarge_modal,
.largclss .enlarge_modal,
.dslarge,
.largclss .enlarge {
    display: none
}

.largclss .modal-header .close {
    position: absolute;
    right: 29px !important;
}

.dslarge_modal {
    margin-right: 25px;
}

.box_header .btn {
    border-radius: 2px;
    font-size: 14px;
    outline: none !important;
    padding: 4px 10px;
}

.newbttn {
    margin-top: 10px;
}

.dlarge_modal {
    display: none !important;
}

.modal_large {
    width: 98%;
    max-width: 1050px;
}

.modal_lg {
    width: 98%;
    max-width: 1220px;
}

.modal_regular {
    width: 98%;
    max-width: 1100px;
}

.modal_md {
    width: 98%;
    max-width: 760px;
}

.bg_light_grey {
    border: 1px solid #e2e0e0;
    padding: 25px 10px 5px;
    border-radius: 3px;
}

.midyr_insrctn {
    text-align: center;
    background-color: #f6f6f6;
    border: 1px solid #f1f1f1;
    padding: 2px 5px 0;
}

.midyr_insrctn h5 {
    margin: 5px 0;
    font-weight: 600;
}

.midyr_insrctn p {
    line-height: 18px;
    font-style: 13px;
}

/*.tbl_addlist_crollbox
{
    max-height: 153px;
    overflow-y: auto;
    display: block;
    width: 1195px;
    border: 1px solid #ccc;
    border-top: 0px;
}*/
.table_profile_sheet {
    margin-bottom: 1px !important;
    width: 1195px;
    table-layout: fixed;
    display: block;
    border: 1px solid #ccc;
    border-bottom: 0px;
    margin-bottom: 0;
}

.table_profile_sheet thead th {
    background-color: #f6f6f6;
    padding: 0 1px !important;
    font-size: 13px !important;
    line-height: 18px;
}

.table_delpmnt_planmain {
    margin-bottom: 1px !important;
    width: 1195px;
    table-layout: fixed;
    display: block;
    border: 1px solid #ccc;
    border-bottom: 0px;
}

.table_delpmnt_planmain th {
    background-color: #f6f6f6;
    padding: 0 1px !important;
    font-size: 13px !important;
    line-height: 18px;
    text-align: center;
}

.table_delpmnt_plan {
    margin-bottom: 1px !important;
    width: 1025px;
    table-layout: fixed;
    display: block;
    border: 1px solid #ccc;
    border-bottom: 0px;
}

.table_delpmnt_plan th {
    background-color: #f6f6f6;
    padding: 0 1px !important;
    font-size: 13px !important;
    line-height: 18px;

}

.tbl_addlist_crollbox .scrolbaletable_delpmnt_plan {
    max-height: 157px;
    overflow-y: auto;
    display: block;
    width: 1195px;
    border: 1px solid #ccc;
    border-top: 0px;
}

.table_bdr {
    margin-bottom: 1px !important;
    width: 1025px;
    table-layout: fixed;
    display: block;
    border: 1px solid #ccc;
    border-bottom: 0px;
}

.table_bdr thead th {
    background-color: #f1f1f1;
}

.tbl_addlist_crollbox {
    width: calc(100% + 10px);
    overflow: auto;
    table-layout: fixed;
}

.tbl_addlist_crollbox .scrolbaletable {
    max-height: 153px;
    overflow-y: auto;
    overflow-x: hidden;
    display: block;
    width: 1025px;
    border: 1px solid #ccc;
    border-top: 0px;
}

.table_bdr > th {
    background-color: #f6f6f6;
    padding: 0 1px !important;
    font-size: 13px !important;
    line-height: 27px;

}

.table.scrolbaletable > tbody > tr > td, .scrolbaletable_delpmnt_plan > tbody > tr > td {
    padding: 1px 1px !important;
}

.table.scrolbaletable > tbody > tr > td .form-control, .scrolbaletable_delpmnt_plan > tbody > tr > td .form-control {
    border-radius: 0;
    border: 1px solid #e4e4e4;
    font-size: 12px;
    padding: 4px 6px !important;

}

.scrolbaletable_delpmnt_plan .input-group-addon {
    line-height: 20px;
}

.scrolbaletable_delpmnt_plan .input-group > .form-control:not(:last-child) {
    border-radius: 0 !important;
}

.append_btn, .appnd_minus_btn {
    width: 33px;
    height: 27px;
    text-align: center;
    color: #fff;
    font-size: 19px;
    line-height: 27px;
    font-weight: 700;
    border-radius: 1px;
    cursor: pointer;
}

.append_btn-dvlpmt {
    height: 36px;
    line-height: 36px;
}

.append_careerbtn_alnmnt {
    height: 36px;
    line-height: 36px;
}

.append_btn:hover, .appnd_minus_btn:hover {
    opacity: .8;
}

.append_btn {
    background-color: #71ab66;
}

.appnd_minus_btn {
    background-color: #ab3c28;
}

.modal_sub_hdng {
    font-size: 14px !important;
    width: 100%;
    background-color: #2b2c42;
    border-bottom: 1px solid #ccc;
    margin: 2px 0 6px;
    padding: 5px 7px;
    line-height: 18px;
    color: #fff;
}

.Competencies_table > tr > td {
    padding: 2px 4px !important;
}

.Competencies_table > thead > tr > th {
    background-color: #f6f6f6;
    padding: 1px 1px !important;
}

.Competencies_table tr > td .form-control {
    border-radius: 0;
    border: 1px solid #e4e4e4;
    font-size: 12px;
    padding: 4px 4px;
}

.Competencies_table {
    border: 1px solid #ccc;
}

.Competencies_table tbody > tr > th {
    background-color: #f6f6f6;
    padding: 1px 3px !important;
    vertical-align: middle;
}

.input-group-addon {
    line-height: 32px;
}

.coment_section .table > thead > tr > th {
    background-color: #f6f6f6;
}

.coment_section .table textarea {
    min-height: 120px;
}

/*================================================*/

.th_btnpand {
    width: 40px
}

.th_object {
    width: 340px
}

.th_yerresult {
    width: 500px
}

.th_acheved {
    width: 150px
}

/*================================================*/

.th_jobskill {
    width: 260px
}

.th_behavir {
    width: 590px
}

/*================================================*/

.th_devlp_Competency {
    width: 200px
}

.th_devlp_Objectives {
    width: 200px
}

.th_devlp_Activity {
    width: 200px
}

.th_devlp_Resources {
    width: 200px
}

.th_devlp_When {
    width: 200px
}

.th_devlp_Measurement {
    width: 200px
}

/*================================================*/

.th_profile_sheet-fromdate {
    width: 145px
}

.th_profile_sheet-todate {
    width: 145px
}

.th_profile_sheet-jobttl {
    width: 165px
}

.th_profile_sheet-emplyname {
    width: 220px
}

.th_profile_sheet-city {
    width: 170px
}

.th_profile_sheet-state {
    width: 160px
}

.th_profile_sheet-country {
    width: 160px
}

/*================================================*/

.th_profile_sheet-fromdate {
    width: 145px
}

.th_profile_sheet-unvrcty {
    width: 450px
}

.th_profile_sheet-majrsbjct {
    width: 400px
}

.th_profile_sheet-degree {
    width: 160px
}

/*================================================*/

.th_profile_sheet-course {
    width: 1050px
}

/*================================================*/

.th_profile_sheet-ttle {
    width: 1050px
}

/*================================================*/

.th_profile_sheet-decrptn {
    width: 1050px
}

/*================================================*/

.th_profile_sheet-language {
    width: 150px
}

.th_profile_sheet-fluencylevl {
    width: 150px
}

.th_profile_sheet-Aspirations {
    width: 400px
}

.th_profile_sheet-Timeframe {
    width: 150px
}

.th_profile_sheet-relocate {
    width: 70px
}

.th_profile_sheet-comnts {
    width: 230px
}

/*================================================*/

.code_conduct {
    width: 100%;
}

.code_conduct p {
    width: calc(100% - 60px);
    float: left;
}

.code_conduct .code_conduct_select {
    width: 60px;
    float: right;
}

.user_daterangpickrbox {
    padding: 20px 10px 5px;
    margin-top: 0px;
    border: 1px solid #e4e3e3;
    position: relative;
    border-radius: 4px;
}

h3.big_title2 {
    font-size: 14px;
    color: #212121;
    font-weight: 500;
    margin: 5px 0px;
    position: absolute;
    top: -21px;
    background-color: #fff;
    padding: 0 9px;
}

.colp_r_15 {
    padding-right: 15px;
}

.colp_l_15 {
    padding-left: 15px;
}

.topnavbar {
    float: left;
    width: calc(100% - 110px);
}

.link-bar {
    display: flex;
    float: left;
    box-sizing: border-box;
}

.link-bar a {
    color: rgba(253, 254, 255, 0.8);
}

.context-bar {
    flex: 1;
    height: 60px;
    overflow: hidden;
}

.context-bar-link,
.grouped-link {
    display: inline-block;
    margin: 0;
    padding: 20px 4px;
    text-align: center;
    font-family: 'Roboto', sans-serif;
    font-size: 13px;
}

.grouped-link i {
    transition: All 1s ease;
    -webkit-transition: All 1s ease;
    -moz-transition: All 1s ease;
    -o-transition: All 1s ease;
    font-size: 12px;
    margin-left: 8px;
}

.context-bar-link.active,
.grouped-link.active {
    /* background-color: #f7f7f7; */
    border-bottom: 3px solid #009fc9;
    height: calc(100% - 0px);
}

.grouped {
    position: static !important;
    overflow: visible;
    z-index: 999;
}

.grouped > .dropdown-content {
    position: absolute;
    display: none;
    background-color: #fff;
    box-shadow: 2px 0 8px #848484;
    max-height: 250px;
    min-width: 160px;
    overflow-y: auto;
    border: 1px solid #eaeaea;
}

.grouped .dropdown-content .context-bar-link {
    display: block;
    text-align: left;
    padding: 7px 10px;
    color: #343a40;
}

.grouped > .dropdown-content a.context-bar-link:hover {
    background-color: #f1f1f1 !important
}

.sidaber_menu {
    margin-top: 0px;
}

.enlarged .sidaber_menu {
    margin-top: 0px;
}

.nav-second-level li a,
.nav-thrid-level li a {
    padding: 8px 20px 8px 10px;
    color: rgba(253, 254, 255, 0.8);
    display: block;
    position: relative;
}

.nav-second-level li a:focus,
.nav-thrid-level li a:focus {
    background-color: #ffffff;
    color: #313a46;
}

.nav-second-level li a:hover,
.nav-thrid-level li a:hover {
    background-color: #ffffff;
    color: #313a46;
}

.nav-second-level > li > a {
    padding-left: 58px;
}

.nav-second-level li.active > a {
    color: #02c0ce;
}

.nav-third-level > li > a {
    padding-left: 68px;
}

.nav-third-level li.active > a {
    color: #313a46;
}

.navbar-custom {
    border-radius: 0;
    margin-bottom: 0;
    padding: 0 0px;
    min-height: 45px;
}

.navbar-custom .nav-link {
    padding: 0;
    line-height: 45px;
    color: #8e8e8e;
}

.navbar-custom .dropdown-toggle:after {
    content: initial;
}

.navbar-custom .menu-left {
    overflow: hidden;
}

.navbar-custom .topbar-right-menu li {
    float: left;
}

.logo {
    color: #ffffff;
    font-size: 20px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    display: block;
    transition: All 1s ease;
    -webkit-transition: All 1s ease;
    -moz-transition: All 1s ease;
    -o-transition: All 1s ease;
    overflow: hidden;
}

.bootm_toggle_button {
    position: absolute;
    bottom: 0;
    color: #bdbbbb;
    text-align: center;
    width: 100%;
    font-size: 24px;
    cursor: pointer;
    border-top: 1px solid #2c2a3c;
    padding-top: 8px;
}

.bootm_toggle_button:hover {
    color: #fff;
}

.bootm_toggle_settings_button {
    position: absolute;
    bottom: 0px;
    color: #bdbbbb;
    text-align: center;
    width: 100%;
    font-size: 12px;
    cursor: pointer;
    border-top: 1px solid #2c2a3c;
}

.bdr_btmnone_nav {
    border-bottom: 0 !important;
}

.bootm_toggle_settings_button a {
    color: #bdbbbb;
    text-align: left;
    font-size: 14px;
}

.bootm_toggle_settings_button a:hover {
    color: #fff;
}

.bootm_toggle_settings_button a i {
    display: inline-block;
    font-size: 18px;
    line-height: 17px;
    margin: 0 10px -4px 3px;
    text-align: center;
    vertical-align: middle;
    width: 12px;
}

.bootm_toggle_settings_button a p {
    text-align: center;
    line-height: 18px;
    margin-bottom: 8px;
    font-size: 13px;
    cursor: pointer;
}

.logo img {
    height: 45px;
}

.logo span span {
    color: #02c0ce;
}

.user-box {
    padding: 90px 25px 25px 25px;
}

.user-box .user-img {
    position: relative;
    height: 38px;
    width: 38px;
    margin-bottom: 8px;
}

.user-box h5 {
    margin-bottom: 2px;
}

.user-box h5 a {
    color: #313a46;
}

.timer_custome {
    width: 120px;
    height: 34px;
    line-height: 23px;
    overflow: hidden;
    float: left;
    border-radius: 30px;
    position: relative;
    color: #fff;
    cursor: pointer;
}

.timer {
    background-color: #27cda5;
    margin-top: 5px;
    margin-left: 5px;
}

.timer:hover, .timer:hover .timerbtn {
    background-color: #1bb993;
}

.timer i {
    font-size: 22px;
    margin-right: 12px;
    line-height: 22px;
    float: right;
    -webkit-transition: All .2s ease;
    -moz-transition: All .2s ease;
    -o-transition: All .2s ease;
}

.timer.timer_actv {
    background-color: #b6344a;
}

.timer.timer_actv:hover, .timer.timer_actv:hover .timerbtn_stop {
    background-color: #982639;
}

.timerbtn {
    background-color: #27cda5;
    left: 0;
    right: 0;
    top: 6px;
    text-align: center;
    bottom: 0;
    position: absolute;
    z-index: 2;
    border: none;
    box-shadow: none;
}

.disnone_timer {
    display: none;
}

.timer.timer_actv .timerbtn_stop {
    background-color: #b6344a;
}

.timerbtn_stop {
    z-index: 1;
    display: block;
}

.divTimer {
    float: left;
    line-height: 23px;
    padding: 4px 10px;
    background-color: #e3eaef;
    border: 1px solid #e8e7e7;
    border-left: 4px solid #000;
    left: 5px;
    z-index: -1;
    position: absolute;
    transition: All .4s ease;
    -webkit-transition: All .4s ease;
    -moz-transition: All 1s ease;
    -o-transition: All 1s ease;
}

.divTimer_dsplay {
    z-index: -1;
    left: 125px;
}

.card-box-dashbord {
    margin: 10px .3%;
    border-radius: 3px;
    background-color: #ffffff;
    width: 32.7%;
    float: left;
}

.card-box-dashbord .header-title {
    border-bottom: 1px solid #ececec;
    padding: 7px 7px;
}

.timer.timer_actv .divTimer {
    background-color: #fff;
    border-color: #fff;
    margin-left: 6px;
}

.side-menu {
    width: 80px;
    z-index: 10;
    background-color: #222222;
    bottom: 0;
    margin-top: 0;
    padding-bottom: 30px;
    position: fixed;
    top: 52px;
    transition: All .6s ease;
    -webkit-transition: All .6s ease;
    -moz-transition: All .6s ease;
    -o-transition: All .6s ease;
}

.side-menu .topbar-left {
    width: 100px;
}

#sidebar-menu ul {
    margin: 0;
    padding: 0;
}

.side-menu .topbar-left {
    background-color: #f5fbff;
    height: 45px;
    position: fixed;
    text-align: center;
    z-index: 1;
    width: 80px;
    top: 0;
    transition: All .6s ease;
    -webkit-transition: All .6s ease;
    -moz-transition: All .6s ease;
    -o-transition: All .6s ease;
}

/*=================left navibar begin=========================================*/

.settings-cntnt-box {
    margin-left: 50px !important;
}

.left-settings-menu {
    width: 50px;
    z-index: 999999;
    background-color: #fcfcfc;
    bottom: 0;
    margin-top: 0;
    padding-bottom: 30px;
    position: fixed;
    top: 0;
    left: 100px;
    top: 60px;
    overflow: hidden;
    box-shadow: 10px 0 4px -4px rgba(0, 0, 0, .20);
}

.left-settings-menu:hover {
    width: 220px
}

.gw-nav-list > li.arrow-down:after {
    display: none;
}

.left-settings-menu:hover .gw-nav-list > li.arrow-down:after {
    display: inline;
}

.sidmnu_text {
    opacity: 0;
    display: none !important;
}

.left-settings-menu:hover .sidmnu_text {
    opacity: 1;
    display: inline !important;
}

.lgnaccs_tbl th {
    padding: 4px;
    background-color: #e3eaef;
    border-bottom: none !important;
}

.lgnaccs_tbl td {
    padding: 14px 4px !important;
}

.lgnaccs_tbl td .radio-info,
.lgnaccs_tbl td .checkbox-info {
    margin-top: -10px;
}

.gw-container.gw-main-container .gw-sidebar.gw-sidebar-fixed,
.gw-container.gw-main-container .gw-sidebar.gw-sidebar-fixed:before {
    left: auto
}

body.enlarged .left-settings-menu {
    left: 60px;
}

.gw-sidebar .nano-pane {
    background: rgba(255, 255, 255, 0);
    font-size: 15px;
}

.gw-sidebar .gw-nav-list {
    border-right: 1px solid #CCC;
}

.gw-sidebar .gw-nav-list li a {
    padding-left: 13px;
}

.gw-nav-list {
    margin: 0;
    padding: 0;
    list-style: none
}

.gw-nav-list > li:first-child {
    border-top: 0;
}

.gw-nav-list > li {
    display: block;
    padding: 0;
    margin: 0;
    border: 0;
    border-top: 1px solid #fcfcfc;
    position: relative;
    text-decoration: none;
}

@-webkit-keyframes arrow-slide {
    0% {
    }
    100% {
        -webkit-transform: rotate(225deg);
        z-index: 3
    }
}

@-webkit-keyframes arrow-slide1 {
    0% {
    }
    100% {
        -webkit-transform: rotate(225deg);
        z-index: 3
    }
}

.gw-nav-list > li.arrow-down:after {
    content: '';
    width: 7px;
    height: 7px;
    position: absolute;
    right: 10px;
    top: 15px;
    border-top: 1px solid #bababa;
    border-left: 1px solid #bababa;
    -webkit-transform: rotate(45deg);
    -webkit-animation: arrow-slide .5s 0s ease both;
}

.gw-nav-list > li.init-arrow-down:after {
    content: '';
    width: 7px;
    height: 7px;
    position: absolute;
    right: 10px;
    top: 15px;
    border-right: 1px solid #bababa;
    border-bottom: 1px solid #bababa;
    -webkit-transform: rotate(45deg);
}

.gw-nav-list > li.arrow-up:after {
    content: '';
    width: 7px;
    height: 7px;
    position: absolute;
    right: -10px;
    top: 15px;
    border-right: 1px solid #bababa;
    border-bottom: 1px solid #bababa;
    -webkit-transform: rotate(45deg);
    -webkit-animation: arrow-slide1 .5s 0s ease both;
}

.left-settings-menu:hover .gw-nav-list > li.arrow-up:after {
    right: 10px;
}

.gw-nav-list > li.init-arrow-up:after {
    content: '';
    width: 7px;
    height: 7px;
    position: absolute;
    right: 10px;
    top: 15px;
    border-top: 1px solid #bababa;
    border-left: 1px solid #bababa;
    -webkit-transform: rotate(45deg);
}

.gw-nav-list > li.active {
    background-color: #fff;
}

.gw-nav-list > li > a {
    display: block;
    height: 38px;
    line-height: 36px;
    padding: 0 16px 0 7px;
    background-color: #f9f9f9;
    color: #585858;
    text-shadow: none !important;
    font-size: 13px;
    text-decoration: none;
}

.gw-open > a {
    outline: 0;
}

.gw-nav-list > li.gw-open {
    border-bottom-color: #e5e5e5
}

.gw-nav-list > li.gw-open > a {
    background-color: #fafafa;
    color: #404e67
}

.gw-nav-list .gw-open > a,
.gw-nav-list .gw-open > a:hover,
.gw-nav-list .gw-open > a:focus {
    background-color: #fafafa
}

.gw-nav .gw-open > a,
.gw-nav .gw-open > a:hover,
.gw-nav .gw-open > a:focus {
    background-color: #eee;
    border-color: #404e67;
}

.gw-nav-list > li.active > a,
.gw-nav-list > li.active > a:hover,
.gw-nav-list > li.active > a:focus,
.gw-nav-list > li.active > a:active {
    background-color: #72819c;
    color: #fff;
    font-size: 13px;
}

.arrow-up.active ul.gw-submenu {
    padding-left: 5px;
}

.gw-nav-list > li > a,
.gw-nav-list .gw-nav-header {
    margin: 0
}

.gw-nav-list > li.active > a > [class*="icon-"] {
    font-weight: normal
}

.gw-nav-list > li.active > a:hover:before {
    display: none
}

.gw-nav-list > li.active:before {
    display: inline-block;
    content: "";
    position: absolute;
    right: -2px;
    top: -1px;
    bottom: 0;
    z-index: 1;
    border: 2px solid #404e67;
    border-width: 0 2px 0 0
}

.gw-nav-list li.gw-open > a:after {
    display: none
}

.gw-nav-list > li a > .gw-arrow {
    display: inline-block;
    width: 14px !important;
    height: 14px;
    line-height: 14px;
    text-shadow: none;
    font-size: 18px;
    position: absolute;
    right: 11px;
    top: 11px;
    padding: 0;
    color: #666
}

.gw-nav-list > li a:hover > .gw-arrow,
.gw-nav-list > li.active > a > .gw-arrow,
.gw-nav-list > li.gw-open > a > .gw-arrow {
    color: #404e67
}

.gw-nav-list > li > a > [class*="icon-"]:first-child {
    display: inline-block;
    vertical-align: middle;
    min-width: 30px;
    text-align: center;
    font-size: 18px;
    font-weight: normal;
    margin-right: 2px
}

.gw-nav-list > li.active .gw-submenu {
    display: block
    -webkit-box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.13);
    -moz-box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.13);
    box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.13);
}

.gw-nav-list > li .gw-submenu {
    font-size: 13px;
    display: none;
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative;
    background-color: #fff;
    border-top: 1px solid #e5e5e5;
}

.gw-nav-list > li .gw-submenu > li {
    margin-left: 0;
    position: relative
}

.gw-nav-list > li .gw-submenu > li > a {
    display: block;
    position: relative;
    color: #616161;
    padding: 7px 0 9px 12px;
    margin: 0;
    border-top: 1px dotted #e4e4e4;
    font-size: 14px;
    text-decoration: none;
}

.gw-nav-list > li .gw-submenu > li > a:focus {
    text-decoration: none
}

.gw-nav-list > li .gw-submenu > li > a:hover {
    text-decoration: none;
    color: #404e67;
    background-color: rgba(25, 25, 50, 0.1);
}

.gw-nav-list > li .gw-submenu > li.active:after {
    display: inline-block;
    content: "";
    position: absolute;
    right: -1px;
    top: -1px;
    bottom: 0;
    z-index: 1;
    border: 2px solid #404e67;
}

.gw-nav-list > li .gw-submenu > li.active > a {
    color: #404e67
}

.gw-nav-list > li .gw-submenu > li a > [class*="icon-"]:first-child {
    display: none;
    font-size: 12px;
    font-weight: normal;
    width: 18px;
    height: auto;
    line-height: 12px;
    text-align: center;
    position: absolute;
    left: 10px;
    top: 11px;
    z-index: 1;
    background-color: #FFF
}

.gw-nav-list > li .gw-submenu > li.active > a > [class*="icon-"]:first-child,
.gw-nav-list > li .gw-submenu > li:hover > a > [class*="icon-"]:first-child {
    display: inline-block
}

.gw-nav-list > li .gw-submenu > li.active > a > [class*="icon-"]:first-child {
    color: #404e67
}

.gw-nav-list > li > .gw-submenu > li:first-child > a {
    border-top: 0px;
}

.gw-nav-list li .gw-submenu {
    overflow: hidden
}

.gw-nav-list li.active.gw-open > .gw-submenu > li.active.gw-open > a.dropdown-toggle:after {
    display: none
}

.gw-nav-list li.active > .gw-submenu > li.active > a:after {
    display: none
}

.gw-nav-list li.active.gw-open > .gw-submenu > li.active > a:after {
    display: block
}

.gw-nav-tabs li[class*=" icon-"],
.nav-tabs li[class^="icon-"] {
    width: 1.25em;
    display: inline-block;
    text-align: center
}

/*=================left navibar end=========================================*/
.side-menu .topbar-left .logo span {
    text-align: center;
}

.side-menu .topbar-left .logo span img {
    max-height: 57px;
    margin-top: 3px;
}

.enlarged .side-menu .topbar-left .logo span img {

}

.enlarged .side-menu .topbar-left .logo i {
    display: block;
    text-align: center;
}

.side-menu .topbar-left .logo i {
    /*display: none;*/
    text-align: center;
}

.enlarged .side-menu {
    position: absolute;
}

.topnavsearch a {
    color: #c1c1c1;
    font-weight: 300
}

.topnavsearch a:hover {
    color: #fff;
}

#topnavsearch a#searchtoggl {
    line-height: 60px;
    margin-right: 0;
    padding: 0 14px;
}

/** hidden search field **/

#searchbar {
    display: none;
    position: absolute;
    float: left;
    width: calc(100% - 270px);
    margin: 1px 15px 0 15px;
    height: 62px;
    border-top: 1px solid #d8d8d8;
    padding-left: 25px;
    padding-right: 10px;
    z-index: 9999;
    background: #fff;
    -webkit-box-shadow: -1px 2px 2px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: -1px 2px 2px rgba(0, 0, 0, 0.2);
    box-shadow: -1px 2px 2px rgba(0, 0, 0, 0.2);
}

body.enlarged #searchbar {
    width: calc(100% - 100px);
}

#s {
    display: block;
    width: 88%;
    border: 0;
    outline: none;
    padding: 0;
    height: 60px;
    line-height: 60px;
    font-size: 15px;
    font-weight: 600;
    color: #676767;
}

#searchsubmit {
    display: block;
    float: right;
    margin-top: 15px;
    background: none;
    color: #717171;
    border: 0;
    outline: none;
    cursor: pointer;
}

.content-page {
    margin-left: 80px;
    /*    overflow: hidden;
        min-height: 80vh;*/
    padding: 0px 0px 0px 0px;
    transition: All .6s ease;
    -webkit-transition: All .6s ease;
    -moz-transition: All .6s ease;
    -o-transition: All .6s ease;
}

.content-page .content {
    margin-top: 0px;
    /* transition: All .6s ease;
    -webkit-transition: All .6s ease;
    -moz-transition: All .6s ease;
    -o-transition: All .6s ease; */
}

.button-menu-mobile {
    border: none;
    color: #8e8e8e;
    display: inline-block;
    height: 60px;
    width: 45px;
    background-color: transparent;
    cursor: pointer;
    font-size: 24px;
}

.box_header {
    width: 100%;
    background-color: #f1f1f1
}

.sidenav {
    height: 100%;
    width: 0px;
    position: fixed;
    z-index: 9999;
    top: 45px;
    right: 0;
    overflow-x: hidden;
    transition: .5s;
    padding-top: 15px;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-box-shadow: 0 0 200px -30px rgba(57, 55, 73, .4);
    box-shadow: 0 0 200px -30px rgba(57, 55, 73, .4);
    background: rgba(237, 237, 237, 1);
    background: -moz-linear-gradient(top, rgba(237, 237, 237, 1) 0, rgba(246, 246, 246, 1) 53%, rgba(255, 255, 255, 1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0, rgba(237, 237, 237, 1)), color-stop(53%, rgba(246, 246, 246, 1)), color-stop(100%, rgba(255, 255, 255, 1)));
    background: -webkit-linear-gradient(top, rgba(237, 237, 237, 1) 0, rgba(246, 246, 246, 1) 53%, rgba(255, 255, 255, 1) 100%);
    background: -o-linear-gradient(top, rgba(237, 237, 237, 1) 0, rgba(246, 246, 246, 1) 53%, rgba(255, 255, 255, 1) 100%);
    background: -ms-linear-gradient(top, rgba(237, 237, 237, 1) 0, rgba(246, 246, 246, 1) 53%, rgba(255, 255, 255, 1) 100%);
    background: linear-gradient(to bottom, rgba(237, 237, 237, 1) 0, rgba(246, 246, 246, 1) 53%, rgba(255, 255, 255, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#ffffff', GradientType=0)
}

.sidenavshow {
    width: 230px
}

.sidenav a {
    padding: 6px 8px 6px 25px;
    text-decoration: none;
    font-size: .9rem;
    color: #000;
    display: block;
    transition: .3s
}

.sidenav a:hover {
    color: #777
}

.sidbarnav {
    font-size: 18px;
    cursor: pointer;
    line-height: 42px
}

.button-menu-mobile.disable-btn {
    display: none;
}

#sidebar-menu > ul > li > a {
    color: rgba(253, 254, 255, 0.8);
    display: block;
    padding: 8px 2px;
    margin: 0px 0;
    font-size: 12.5px;
    position: relative;
    font-weight: 300;
    border-bottom: 1px solid #2c2a3c;
    text-align: center;
    line-height: 19px;
}
/* 
#sidebar-menu > ul > li > a:hover {
    color: rgba(253, 254, 255, 1);
} */

#sidebar-menu > ul > li > a.active:hover {
    color: #fff;
}

#sidebar-menu > ul > li > a p {
    text-align: center;
    line-height: 19px;
    margin-bottom: 0px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
}

#sidebar-menu > ul > li > a > span {
    vertical-align: middle;
}


#sidebar-menu .menu-arrow {
    -webkit-transition: -webkit-transform .15s;
    transition: -webkit-transform .15s;
    transition: transform .15s;
    transition: transform .15s, -webkit-transform .15s;
    position: absolute;
    right: 20px;
    display: inline-block;
    font-family: 'Material Design Icons';
    text-rendering: auto;
    line-height: 28px;
    font-size: 18px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
}

#sidebar-menu .menu-arrow:before {
    content: "\F142";
}

#sidebar-menu .badge,
#sidebar-menu .label {
    margin-top: 4px;
}

#sidebar-menu li.active .menu-arrow {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}

#sidebar-menu ul li a i {
    display: inline-block;
    font-size: 20px;
    line-height: 17px;
    margin: 0 10px 4px 3px;
    text-align: center;
    vertical-align: middle;
    width: 12px;
}

#sidebar-menu ul li a .drop-arrow {
    float: right;
}

#sidebar-menu ul li a .drop-arrow i {
    margin-right: 0;
}

#sidebar-menu > ul > li.sidebar_nav_actv > a.active {
    color: #fff;
}

.sidebar_nav_sub_actv > a.active {
    color: #02c0ce;
}

#sidebar-menu > ul > li > a.active {
    color: #bdbbbb;
}

.menu-title {
    padding: 12px 20px;
    letter-spacing: .05em;
    pointer-events: none;
    cursor: default;
    font-size: 11px;
    text-transform: uppercase;
    color: #98a6ad;
    font-family: 'Roboto', sans-serif;
}

.enlarged .slimScrollDiv,
.enlarged .slimscroll-menu {
    overflow: inherit !important;
}

.enlarged .user-box {
    display: none;
}

.enlarged .slimScrollBar {
    visibility: hidden;
}

.enlarged #wrapper #sidebar-menu .menu-title,
.enlarged #wrapper #sidebar-menu .menu-arrow,
.enlarged #wrapper #sidebar-menu .label,
.enlarged #wrapper #sidebar-menu .badge {
    display: none !important;
}

.enlarged #wrapper #sidebar-menu .collapse.in {
    display: none !important;
}

.enlarged #wrapper #sidebar-menu .nav.collapse {
    height: inherit !important;
}

.enlarged #wrapper #sidebar-menu ul ul {
    margin-top: -2px;
    padding-bottom: 5px;
    padding-top: 5px;
    z-index: 9999;
}


.enlarged #wrapper #sidebar-menu ul ul.gw-submenu {
    background-color: #fcfcfc;
}

.enlarged #wrapper .left.side-menu {
    width: 80px;
    z-index: 5;
}

/*.enlarged #wrapper .left.side-menu #sidebar-menu > ul > li > a {
    padding: 9px 12px;
    min-height: 40px;
}*/
/*.enlarged #wrapper .left.side-menu #sidebar-menu > ul > li > a:hover,
.enlarged #wrapper .left.side-menu #sidebar-menu > ul > li > a:active,
.enlarged #wrapper .left.side-menu #sidebar-menu > ul > li > a:focus {
    color: #313a46;
    background-color: #e3eaef;
}*/
/*.enlarged #wrapper .left.side-menu #sidebar-menu > ul > li > a i {
    font-size: 18px;
    margin-right: 20px;
}*/
.enlarged #wrapper .left.side-menu .label {
    position: absolute;
    top: 5px;
    left: 35px;
    text-indent: 0;
    display: block;
    padding: .2em .6em .3em;
}

.enlarged #wrapper .left.side-menu #sidebar-menu ul > li {
    position: relative;
}

/*.enlarged #wrapper .left.side-menu #sidebar-menu ul > li:hover > a {
    position: relative;
    width: 260px;
    color: #313a46;
    background-color: #e3eaef;
}*/
/*.enlarged #wrapper .left.side-menu #sidebar-menu ul > li:hover > ul {
    display: block;
    left: 70px;
    position: absolute;
    width: 190px;
    height: auto !important;
    -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.02), 0 1px 0 0 rgba(0, 0, 0, 0.02);
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.02), 0 1px 0 0 rgba(0, 0, 0, 0.02);
}*/
/*.enlarged #wrapper .left.side-menu #sidebar-menu ul > li:hover > ul a {
    -webkit-box-shadow: none;
    box-shadow: none;
    padding: 8px 20px;
    position: relative;
    width: 190px;
    z-index: 6;
}
.enlarged #wrapper .left.side-menu #sidebar-menu ul > li:hover > ul a:hover {
    color: #313a46;
}
.enlarged #wrapper .left.side-menu #sidebar-menu ul > li:hover a span {
    display: inline;
}
.enlarged #wrapper .left.side-menu #sidebar-menu ul ul li:hover > ul {
    display: block;
    left: 190px;
    margin-top: -36px;
    position: absolute;
    width: 190px;
}*/
.enlarged #wrapper .left.side-menu #sidebar-menu ul ul li > a span.pull-right {
    -ms-transform: rotate(270deg);
    -webkit-transform: rotate(270deg);
    position: absolute;
    right: 20px;
    top: 12px;
    transform: rotate(270deg);
}

.enlarged #wrapper .left.side-menu #sidebar-menu ul ul li.active a {
    color: #313a46;
}

.enlarged #wrapper .left.side-menu #sidebar-menu ul > li > a span {
    display: none;
    padding-left: 10px;
}

.enlarged #wrapper .left.side-menu .user-details {
    display: none;
}

.enlarged #wrapper .content-page {
    margin-left: 80px;
}

.enlarged #wrapper .footer {
    left: 70px;
}

.enlarged #wrapper .topbar-left {
    width: 100px;
    position: relative;
    padding-left: 0;
}

.enlarged #wrapper .topbar-left .logo i img {
    /*height: 58px;*/
    text-align: center;
}

.enlarged #wrapper #sidebar-menu > ul > li:hover > a.open:after {
    display: none;
}

.enlarged #wrapper #sidebar-menu > ul > li:hover > a.active:after {
    display: none;
}

#wrapper.right-bar-enabled .right-bar {
    right: 0;
}

#sidebar-menu > ul > li:hover{
    background: #000000;
    border-left: 3px solid #6e56a3;
}

#sidebar-menu > ul > li:active{
    background: #000000;
    border-left: 3px solid #6e56a3;
}
.sidebar_nav_actv {
    background: #000000;
    /* border-left: 3px solid #6e56a3; */
}

.sidebar_sub_division {
    width: 0;
    position: fixed;
    top: 52px;
    height: calc(100vh - 45px);
    overflow-y: auto;
    background: #000000;
    left: 80px;
    opacity: 0;
    visibility: hidden;
    /* display: none; */
    /* padding-top: 10px; */
    border-left: 1px solid #423d58;
    -webkit-transition: width .5s;
    transition: width .5s;
    z-index: 999999;
}

.wdth {
    width: 180px;
    opacity: 1;
    visibility: visible;
    /* display: block; */
    margin-left: 0px;
    -webkit-transition: width .5s;
    transition: width .5s;
}

.permisioncontainer {
    position: relative;
    -ms-box-orient: horizontal;
    display: -webkit-flex;
    padding-bottom: 1900px !important;
    overflow: visible;
}

.sticky {
    position: absolute;
    padding-left: 10px;
}

.stickytop {
    position: fixed;
    top: 0;
}

.nav_linkactv {
    background-color: #f1f1f1;
}

ul.sticky li {
    list-style: none;
    float: none;
}

ul.sticky li a {
    position: relative;
    color: #000;
    padding: 5px 10px;
    -webkit-transition: .5s;
    transition: .5s;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
}

ul.sticky li a {
    position: relative;
    color: #000;
    padding: 5px 10px;
    -webkit-transition: .5s;
    transition: .5s;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
}

.rightstcky {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-flow: column;
    -ms-flex-flow: column;
    flex-flow: column;
    width: 1900px;
    border-left: 1px solid #f1f1f1;
    margin-left: 190px;
}

.rightstcky h4 {
    font-weight: 600;
    font-size: 15px;
}

.prmsinbdrbttm {
    border-bottom: 1px solid #f5f5f5;
    margin-top: 4px;
    line-height: 21px;
}

.prmsinbdrbttm label.fszlabel {
    font-size: 14px;
    line-height: 31px;
}

.p-15 {
    padding: 15px !important;
}

.page-section {
    height: auto;
}

.sidebar_sub_division .nav_second_sub li a {
    padding-left: 20px !important;
}

.submnu li a {
    padding-left: 30px !important;
}

/*.submnu_sub li {
   list-style: circle;
    margin-left: 40px;
}*/
.submnu_sub li a {
    padding-left: 40px !important;
}

.shobg {
    background-color: #262435
}

.modal_maxheigt::-webkit-scrollbar {
    width: 10px;
    height: 3px
}

.modal_maxheigt::-webkit-scrollbar-button {
    background-color: #ccc
}

.modal_maxheigt::-webkit-scrollbar-thumb {
    height: 25px;
    background-color: #ccc;
    border-radius: 0
}

.sidebar_sub_division::-webkit-scrollbar, body::-webkit-scrollbar {
    width: 10px;
    height: 3px
}

.scrolbaletable::-webkit-scrollbar, body::-webkit-scrollbar {
    width: 5px;
    height: 3px
}

.scrolbaletable::-webkit-scrollbar-button, body::-webkit-scrollbar-button {
    background-color: #ccc
}

.scrolbaletable::-webkit-scrollbar-button, body::-webkit-scrollbar-button {
    background-color: #ccc
}

.scrolbaletable::-webkit-scrollbar-thumb, body::-webkit-scrollbar-thumb {
    height: 25px;
    background-color: #ccc;
    border-radius: 0
}


.sidebar_sub_division::-webkit-scrollbar-button, body::-webkit-scrollbar-button {
    background-color: black;
}

.sidebar_sub_division::-webkit-scrollbar-track {
    background-color: #FFF
}

.sidebar_sub_division::-webkit-scrollbar-track-piece, body::-webkit-scrollbar-track-piece {
    background-color: #FFF
}

.sidebar_sub_division::-webkit-scrollbar-thumb, body::-webkit-scrollbar-thumb {
    height: 25px;
    background-color: black;
    border-radius: 0;
}

.sidebar_sub_division::-webkit-scrollbar-corner, body::-webkit-scrollbar-corner {
    background-color: #686479
}

.sidebar_sub_division::-webkit-resizer, body::-webkit-resizer {
    background-color: #686479
}

.sidebar_sub_division p {
    margin-bottom: 0px;
    color: #fff;
    /*border-bottom: 1px solid #443f5a;*/
}

/* .nav_second_sub li {
    margin-bottom: 0px;
    border-bottom: 1px solid #3f3b52;
    line-height: 24px;
} */

.sidebar_sub_division a {
    display: block;
    padding: 4px 10px;
    color: #fff;
}

.table_createNewBtn {
    position: absolute;
    right: 18px;
    top: -40px;
    border: 1px solid #dcdcdc;
    color: #dcdcdc;
    padding: 4px 9px;
    cursor: pointer;
    border-radius: 2px;
}

.table_createNewBtn:hover {
    background: #3e4146;
}

.splnav {
    color: rgba(253, 254, 255, 0.8);
    text-align: center;
    cursor: pointer;
    padding: 20px 0 !important;
    border-bottom: 1px solid #2c2a3c;
    margin-bottom: 0;
}

.splnav:hover {
    color: #fff;
}

.splnav i {
    display: block;
    font-size: 20px;
}

.splnav a {
    color: rgba(253, 254, 255, 0.8);
    text-align: center;
    font-size: 12.5px;
}

li.crnt a {
    position: relative;
}

li.crnt a:after {
    content: "\f0dd";
    position: absolute;
    font-size: 12px;
    font-family: FontAwesome;
    right: 20px;
    top: 5px;
    color: #d4d4d4;
}

/* li.crnt a[aria-expanded="true"] {
    background-color: #222222;
}

li.crnt a[aria-expanded="false"] {
    background-color: #000000;
} */

li.crnt a[aria-expanded="true"]:after {
    content: "\f0de";
}

/*a[aria-expanded="false"]{
    background-color: #262435;
}*/
.active.current {
    color: #fff;
    background-color: #262435;
}

/* .sidebar_sub_division {
    width: 100px;
    margin-left: -200px;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: 0.5s;
} */

.parent-slide {
    padding: 15px;
}


.slick-dots {
    left: 0;
}

.clpsedcntnt {
    margin-left: 260px;
}



.empoyee_name span {
    color: #b5b5b5;
    margin-right: 3px;
    font-size: 12px;
}

.empoyee_name img {
    border-radius: 50%;
    height: 35px;
    width: 35px;
    padding: 4px;
    float: left;
}

.empoyee_name p {
    color: #b5b5b5;
    margin-right: 3px;
    font-size: 11px;
    margin-bottom: 0;
    line-height: 14px;
}

.td_status {
    width: 50px;
    position: relative;
}

.td_status img {
    border-radius: 50%;
    height: 35px;
    width: 35px;
    padding: 4px;
    float: left;
}

.td_status .status_actv {
    height: 14px;
    width: 15px;
    border-radius: 50%;
    background-color: #0acf97;
    position: absolute;
    top: 17px;
    left: 25px;
}

.td_status .status_actv, .td_status .status_deactv {
    height: 14px;
    width: 15px;
    border-radius: 50%;
    position: absolute;
    top: 17px;
    left: 25px;
}

.td_status .status_actv {
    background-color: #0acf97;
}

.td_status .status_deactv {
    background-color: #ef9367;
}

.td_status .status_actv:after, .td_status .status_deactv:after {
    content: "\f00c";
    font-family: FontAwesome;
    color: #f1f1f1;
    font-size: 8px;
    margin-left: 3px;
    position: absolute;
    left: 1px;
    top: 1px;
}

.td_status .status_actv:after {
    content: "\f00c";
}

.td_status .status_deactv:after {
    content: "\f28e";
}

.app-search {
    position: relative;
    padding-top: 5px;
    padding-right: 10px;
}

.app-search button {
    position: absolute;
    top: 10px;
    left: 160px;
    display: block;
    height: 22px;
    line-height: 22px;
    width: 34px;
    text-align: center;
    color: rgba(49, 58, 70, 0.5);
    background-color: transparent;
    border: none;
}

.app-search button:hover {
    color: #313a46;
}

.app-search .form-control,
.app-search .form-control:focus {
    border: 1px solid #e3eaef;
    font-size: 13px;
    height: 34px;
    color: #313a46;
    padding-left: 20px;
    padding-right: 40px;
    background: #e3eaef;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 30px;
    width: 200px;
}

/* Body min-height set */

body.enlarged {
    min-height: 1200px;
}

body.enlarged.bg-transparent {
    min-height: 500px;
}

/* Footer */

.footer {
    bottom: 0;
    text-align: left !important;
    padding: 10px;
    position: absolute;
    right: 0;
    color: rgb(255 255 255 / 80%);
    left: 80px;
    z-index: 100;
    position: fixed;
    background-color: #222222;
}

.enlarged .footer {
    left: 50px;
}

.footaernav {
    float: right;
    margin-bottom: 0;
}

.footaernav li {
    list-style: none;
    float: left;
    padding: 0px 10px;
    font-size: 16px;
    color: #455a64;
}

/* Notification */

.notification-wrapper {
    max-height: 190px;
}

.notification-list {
    margin-left: 0;
}

.notification-list .noti-title {
    background-color: #ffffff;
    padding: 7px 20px;
}

.notification-list .noti-icon {
    font-size: 20px;
    padding: 0 9px;
    vertical-align: middle;
}

.notification-list .noti-icon-badge {
    display: inline-block;
    position: absolute;
    top: 2px;
    right: 8px;
}

.notification-list .notify-item {
    padding: 10px 20px;
}

.notification-list .notify-item .notify-icon {
    float: left;
    height: 36px;
    width: 36px;
    line-height: 36px;
    text-align: center;
    margin-right: 10px;
    border-radius: 50%;
    color: #ffffff;
}

.notification-list .notify-item .notify-details {
    margin-bottom: 0;
    overflow: hidden;
    margin-left: 45px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.notification-list .notify-item .notify-details b {
    font-weight: 500;
}

.notification-list .notify-item .notify-details small {
    display: block;
}

.notification-list .notify-item .notify-details span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 13px;
}

.notification-list .notify-item .user-msg {
    margin-left: 45px;
    white-space: normal;
    line-height: 20px;
}

.notification-list .profile-dropdown .notify-item {
    padding: 7px 20px;
}

.profile-dropdown {
    width: 170px;
}

.profile-dropdown i {
    vertical-align: middle;
    margin-right: 5px;
}

.profile-dropdown span {
    vertical-align: middle;
}

.nav-user {
    padding: 0 12px !important;
}

.nav-user img {
    height: 32px;
    width: 32px;
}

/* Small Menu */

.side-menu-sm {
    width: 170px;
    text-align: center;
}

.side-menu-sm #sidebar-menu > ul > li > a > i {
    display: block;
    font-size: 18px;
    line-height: 24px;
    width: 100%;
    margin: 0;
}

.side-menu-sm #sidebar-menu ul ul a {
    padding: 10px 20px 10px 20px;
}

.side-menu-sm .user-box .user-img {
    margin: 0 auto 15px auto;
}

.side-menu-sm .topbar-left {
    padding-left: 0;
    width: 170px;
}

.side-menu-sm .menu-arrow,
.side-menu-sm .badge {
    display: none !important;
}

.side-menu-sm + .content-page {
    margin-left: 170px;
}

.side-menu-sm + .content-page .footer {
    left: 170px;
}

.enlarged #wrapper .side-menu-sm {
    text-align: left;
}

.enlarged #wrapper .side-menu-sm ul li a i {
    display: inline-block;
    font-size: 18px;
    line-height: 17px;
    margin-left: 3px;
    margin-right: 15px;
    vertical-align: middle;
    width: 20px;
}

@media (max-width: 1024px) {
    .button-menu-mobile.disable-btn {
        display: inline-block;
    }

    .content-page {
        padding: 0;
    }

    .content-page .content {
        padding-top: 0px;
    }

    .navbar-custom {
        /* position: fixed; */
        left: 0;
        right: 0;
        -webkit-box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
        box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
        z-index: 999;
    }

    .page-title-box .page-title {
        font-size: 16px;
        margin-bottom: 6px;
        margin-top: 24px;
        display: block;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }

    .page-title-box .breadcrumb {
        display: none;
    }
}

@media (max-width: 768px) {
    body {
        overflow-x: hidden;
    }

    body.enlarged .left-settings-menu {
        left: 0px;
    }

    .topbar-left {
        width: 80px !important;
        background-color: #f5fbff !important;
    }

    .topbar-left span {
        display: none;
    }

    .app-search .form-control {
        width: 162px;
    }

    .app-search button {
        left: 124px;
    }

    .notification-list .noti-icon {
        padding: 0 5px;
    }

    .nav-user {
        padding: 0 5px !important;
    }

    .topbar-left i {
        display: block !important;
        line-height: 60px;
    }

    .topbar-left i img {
        height: 45px;
        margin-top: -17px;
    }

    .side-menu .topbar-left {
        background-color: #181f27;
    }

    body.enlarged #searchbar {
        width: calc(100% - 30px);
        margin-left: 15px;
    }

    #searchbar {
        width: calc(100% + 35px);
        margin-left: -50px;
    }

    .enlarged .topbar {
        margin-left: 0px;
        width: calc(100% - 80px);
        border-left: 1px solid #eaeaea;
    }

    .side-menu {
        -webkit-box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
        box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
    }

    .navbar-nav.navbar-right {
        float: right;
    }

    .footer {
        left: 0 !important;
    }
}

@media (max-width: 767px) {
    .dropdown-lg {
        width: 200px !important;
    }

    .timer {
        background-color: #27cda5;
        margin-top: 8px;
        margin-left: 7px;
    }

    .timer_custome {
        width: 100px;
    }
}

@media (min-width: 480px) {
    .navbar-custom .notification-list .dropdown-menu.dropdown-menu-right {
        -webkit-transform: none !important;
        transform: none !important;
        top: 100% !important;
        right: 0 !important;
        left: auto !important;
    }
}

@media (max-width: 480px) {
    .side-menu {
        z-index: 10 !important;
    }

    .search-bar {
        display: none !important;
    }
}

@media (max-width: 420px) {
    .hide-phone {
        display: none !important;
    }
}

@media (max-width: 419px) {
    .hidden-xxs {
        display: none;
    }

    .hide-phone {
        display: none;
    }

    .topbar {
        margin-left: 0;
    }

    /* .topbar {
         margin-left: 69px;
         position: fixed;
         z-index: 9999;
         width: calc(100% - 65px);
     }*/
    /*  .enlarged .topbar {
          margin-left: 0px;
          position: fixed;
          z-index: 9999;
          width: calc(100% - 0px);
      }
  */
    .logo .icon-c-logo {
        display: inline-block !important;
        line-height: 58px !important;
    }

    .logo span {
        display: none !important;
    }

    .content-page {
        margin-left: 70px;
    }

    .forced .side-menu.left {
        -webkit-box-shadow: 0 12px 12px rgba(0, 0, 0, 0.1);
        box-shadow: 0 12px 12px rgba(0, 0, 0, 0.1);
    }

    .enlarged .side-menu.left {
        -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1) !important;
        box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1) !important;
    }

    .page-title {
        font-size: 15px;
        max-width: 250px;
        white-space: nowrap;
    }

    .navbar-default {
        padding: 0;
    }

    .navbar-default .navbar-left {
        padding-left: 0 !important;
    }

    .navbar-default .navbar-left li {
        padding: 0 5px;
    }

    /*.topbar-left {*/
    /*display: none;*/
    /*}*/
    .editable-responsive {
        overflow-x: auto;
    }

    .page-title-box .breadcrumb {
        display: none;
    }

    .navbar-nav .open .dropdown-menu {
        margin-right: -20px;
    }

    .user-list .user-list-item .icon,
    .user-list .user-list-item .avatar {
        display: none;
    }

    .user-list .user-list-item .user-desc {
        margin-left: 0;
    }
}

.mainiconbox {
    height: 44px;
    width: 42px;
    background-color: #72819c;
    line-height: 49px;
    text-align: center;
    float: left;
    margin-right: 10px;
    color: #fff;
    font-size: 29px;
    border-radius: 3px;
}

/* =============
   Common
============= */

body {
    margin: 0;
    /*padding-bottom: 60px;*/
    overflow-x: hidden;
    font-size: 14px;
    background-color: #ffffff;
    font-family: 'Roboto', sans-serif;
}

html {
    position: relative;
    min-height: 100%;
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Roboto', sans-serif;
    margin: 10px 0;
}

h1 {
    line-height: 43px;
    font-size: 36px;
}

h2 {
    line-height: 35px;
    font-size: 30px;
}

h3 {
    line-height: 30px;
    font-size: 24px;
}

h4 {
    line-height: 22px;
    font-size: 18px;
}

h5 {
    font-size: 15px;
}

h6 {
    font-size: 12px;
}

p {
    line-height: 1.6;
}

* {
    outline: none !important;
}

a:hover {
    outline: 0;
    text-decoration: none;
}

a:active {
    outline: 0;
    text-decoration: none;
}

a:focus {
    outline: 0;
    text-decoration: none;
}

.container {
    width: auto;
}

.container-alt {
    margin-left: auto;
    margin-right: auto;
    padding-left: 15px;
    padding-right: 15px;
}

#wrapper {
    height: 100%;
    min-height: calc(100vh - 81px);
    /*overflow: hidden;*/
    width: 100%;
    top: 52px;
    width: 100%;
    float: left;
    position: relative;
}

/* Page titles */

.page-title {
    font-size: 18px;
    margin-bottom: 6px;
}

.header-title {
    font-size: 16px;
    font-weight: 600;
    margin-top: 0;
    margin-bottom: 0;
    font-family: 'Roboto', sans-serif;
}

.breadcrumbs > ul {
    float: left;
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
    margin-top: 4px
}

.breadcrumbs > ul > li {
    position: relative;
    line-height: 14px;
    float: left;
}

.breadcrumbs {
    float: left
}

.breadcrumbs > ul > li > a {
    color: #797d80;
    float: left;
    font-size: 12px;
    position: relative;
    margin-right: 2px;
    padding-right: 2px;
    font-weight: 100;
}

.breadcrumbs > ul > li > a::after {
    content: "/";
    padding-left: 3px;
}

.breadcrumbs > ul > li > a:hover {
    color: #000
}

.page-title-box {
    font-size: 13px;
    padding-left: 10px;
    padding: 6px 10px;
    font-size: .815rem;
    margin: 0;
    background-color: white;
}

.page-title-box .breadcrumb {
    margin-bottom: 0;
    padding: 0;
    background-color: transparent;
}

/* =============
   Helper classes
============= */

.m-b-30 {
    margin-bottom: 30px;
}

.m-t-50 {
    margin-top: 50px;
}

@media (max-width: 767px) {
    .mt-md-30 {
        margin-top: 30px;
    }
}

.p-l-r-10 {
    padding-left: 10px;
    padding-right: 10px;
}

.w-xs {
    min-width: 80px;
}

.w-sm {
    min-width: 95px;
}

.w-md {
    min-width: 110px;
}

.w-lg {
    min-width: 140px;
}

.center-page {
    float: none !important;
    margin: 0 auto !important;
}

.text-overflow {
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
    width: 100%;
    overflow: hidden;
}

.pull-in {
    margin-left: -20px;
    margin-right: -20px;
}

.font-600 {
    font-weight: 600;
}

.font-normal {
    font-weight: normal;
}

.font-light {
    font-weight: 300;
}

.font-13 {
    font-size: 13px !important;
}

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

.font-15 {
    font-size: 15px !important;
}

.font-16 {
    font-size: 16px !important;
}

.font-18 {
    font-size: 18px !important;
}

.bx-shadow {
    -webkit-box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
    box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
}

.bx-shadow-lg {
    -webkit-box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.15), 0 1px 0 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.15), 0 1px 0 0 rgba(0, 0, 0, 0.1);
}

.bx-shadow-none {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.thumb-sm {
    height: 36px;
    width: 36px;
}

.thumb-md {
    height: 48px;
    width: 48px;
}

.thumb-lg {
    height: 88px;
    width: 88px;
}

.thumb-xl {
    height: 120px;
    width: 120px;
}

.dropdown-menu .slimScrollDiv {
    height: auto !important;
    max-height: 400px;
    overflow: hidden;
}

.dropdown-menu .slimScrollDiv .slimscroll {
    height: auto !important;
    max-height: 400px;
    overflow-y: auto !important;
}

.slimScrollDiv {
    height: calc(100vh - 0px) !important;
}

/*.sidaber_menu {
    height: calc(100vh  - 60px) !important;
    overflow-y: auto !important;
}*/
.slimScrollDiv .metismenu {
    height: calc(100vh - 145px) !important;
    overflow-y: auto !important;
}

/* Table type box */

.table-box {
    display: table;
    height: 100%;
    width: 100%;
}

.table-box .table-detail {
    display: table-cell;
    vertical-align: middle;
}

/* Button demo */

.button-list {
    margin-left: -8px;
    margin-bottom: -12px;
}

.button-list .btn {
    margin-bottom: 12px;
    margin-left: 8px;
}

/* Demo only */

.icon-list-demo div {
    cursor: pointer;
    line-height: 45px;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: block;
    overflow: hidden;
}

.icon-list-demo div p {
    margin-bottom: 0;
    line-height: inherit;
}

.icon-list-demo i {
    text-align: center;
    vertical-align: middle;
    font-size: 22px;
    width: 50px;
    height: 50px;
    line-height: 50px;
    margin-right: 12px;
    color: rgba(49, 58, 70, 0.7);
    border-radius: 3px;
    display: inline-block;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
}

.icon-list-demo[class^="pe-7s-"],
.icon-list-demo[class*=" pe-7s-"] {
    font-weight: 600;
}

.icon-list-demo .col-md-4 {
    border-radius: 3px;
    -moz-border-radius: 3px;
    background-clip: padding-box;
    margin-bottom: 10px;
}

.icon-list-demo .col-md-4:hover,
.icon-list-demo .col-md-4:hover i {
    color: #02c0ce;
}

.social-links li a {
    border-radius: 50%;
    color: rgba(121, 121, 121, 0.8);
    display: inline-block;
    height: 30px;
    line-height: 27px;
    border: 2px solid rgba(121, 121, 121, 0.5);
    text-align: center;
    width: 30px;
}

.social-links li a:hover {
    color: #797979;
    border: 2px solid #797979;
}

/* =============
   Bootstrap-custom
============= */

.breadcrumb {
    background-color: transparent;
    margin-bottom: 15px;
    padding-top: 10px;
    padding-left: 0;
}

.breadcrumb a {
    color: #98a6ad;
}

.breadcrumb > li + li:before {
    padding: 0 5px;
    color: #98a6ad;
    content: "\f105" !important;
    font-family: FontAwesome;
}

code {
    color: #02c0ce;
}

/* Blockquote */

.blockquote {
    font-size: 1.1rem;
}

.media {
    margin-top: 25px;
}

/* Dropdown */

.dropdown-menu {
    padding: 4px 0;
    font-size: 14px;
    -webkit-box-shadow: 0 3px 12px rgba(0, 0, 0, 0.05);
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.05);
    border-color: #e3eaef;
}

.dropdown-menu-animated {
    display: block;
    visibility: hidden;
    opacity: 0;
    transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -webkit-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    margin-top: 20px !important;
}

.show > .dropdown-menu {
    visibility: visible;
    opacity: 1;
    margin-top: 0 !important;
}

.dropdown-item.active,
.dropdown-item:active {
    color: #313a46;
    text-decoration: none;
    background-color: #f7f7f7;
}

.dropdown-item {
    padding: 6px 1.5rem;
}

.dropdown-lg {
    width: 320px;
}

.arrow-none:after {
    border: none;
    margin: 0;
    display: none;
}

/* Background colors */

.bg-custom {
    background-color: #02c0ce !important;
}

.bg-primary {
    background-color: #2d7bf4 !important;
}

.bg-success {
    background-color: #0acf97 !important;
}

.bg-info {
    background-color: #4eb7eb !important;
}

.bg-warning {
    background-color: #f9bc0b !important;
}

/* .bg-danger {
    background-color: #3eb8f5 !important;
} */

.bg-muted {
    background-color: #797979 !important;
}

.bg-purple {
    background-color: #777edd !important;
}

.bg-pink {
    background-color: #ff679b !important;
}

.bg-white {
    background-color: #ffffff !important;
}

.bg-dark {
    background-color: #313a46 !important;
}

.bg-light {
    background-color: #e3eaef !important;
}

/* Text colors */

.text-custom {
    color: #02c0ce !important;
}

.text-white {
    color: #ffffff !important;
}

.text-danger {
    color: #f1556c !important;
}

/* .text-muted {
    color: #98a6ad !important;
} */

.forgot {
    position: absolute;
    top: -24px;
    right: 9px;
    font-size: 12px
}

.text-primary {
    color: #6e56b7  !important;
}

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

.text-success {
    color: #0acf97 !important;
}

.text-info {
    color: #4eb7eb !important;
}

.text-pink {
    color: #ff679b !important;
}

.text-purple {
    color: #777edd !important;
}

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

/* Border colors */

.border-primary {
    border-color: #2d7bf4 !important;
}

.border-success {
    border-color: #0acf97 !important;
}

.border-info {
    border-color: #4eb7eb !important;
}

.border-warning {
    border-color: #f9bc0b !important;
}

.border-danger {
    border-color: #f1556c !important;
}

.border-dark {
    border-color: #313a46 !important;
}

.border-pink {
    border-color: #ff679b !important;
}

.border-purple {
    border-color: #777edd !important;
}

.border-custom {
    border-color: #02c0ce !important;
}

/* Badge */

.badge {
    font-family: 'Roboto', sans-serif;
    -webkit-box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
    box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
    padding: .35em .5em;
    font-weight: 500;
}

.badge-custom {
    background: #02c0ce;
    color: #ffffff;
}

.badge-primary {
    background-color: #2d7bf4;
}

.badge-secondary {
    background-color: #9a9a9a;
}

.badge-success {
    background-color: #0acf97;
}

.badge-info {
    background-color: #4eb7eb;
}

.badge-warning {
    background-color: #f9bc0b;
    color: #ffffff;
}

.badge-danger {
    background-color: #f1556c;
}

.badge-purple {
    background-color: #777edd;
    color: #ffffff;
}

.badge-pink {
    background-color: #ff679b;
    color: #ffffff;
}

.badge-dark {
    background-color: #313a46;
}

/* Pagination/ Pager */

.pagination > li:first-child > a,
.pagination > li:first-child > span {
    border-bottom-left-radius: 3px;
    border-top-left-radius: 3px;
}

.pagination > li:last-child > a,
.pagination > li:last-child > span {
    border-bottom-right-radius: 3px;
    border-top-right-radius: 3px;
}

.pagination > li > a,
.pagination > li > span {
    color: #313a46;
}

.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
    background-color: #e3eaef;
}

.pagination-split li {
    margin-left: 5px;
    display: inline-block;
    float: left;
}

.pagination-split li:first-child {
    margin-left: 0;
}

.pagination-split li a {
    border-radius: 3px;
}

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus,
.page-item.active .page-link {
    background: #72819c;
    border-color: #596b8c;
}

.pager li > a,
.pager li > span {
    border-radius: 3px;
    color: #313a46;
}

.list-group-item.active,
.list-group-item.active:focus,
.list-group-item.active:hover {
    background: #72819c;
    border-color: #596b8c;
}

.list-group-item.active .list-group-item-text,
.list-group-item.active:focus .list-group-item-text,
.list-group-item.active:hover .list-group-item-text {
    color: fade(#ffffff, 70%);
}

/* =============
   Waves Effect
============= */

/*!
 * Waves v0.6.0
 * http://fian.my.id/Waves
 *
 * Copyright 2014 Alfiana E. Sibuea and other contributors
 * Released under the MIT license
 * https://github.com/fians/Waves/blob/master/LICENSE
 */

.waves-effect {
    position: relative;
    cursor: pointer;
    display: inline-block;
    overflow: hidden;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    vertical-align: middle;
    z-index: 1;
    will-change: opacity, transform;
    -webkit-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

.waves-effect .waves-ripple {
    position: absolute;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    margin-top: -10px;
    margin-left: -10px;
    opacity: 0;
    background: rgba(0, 0, 0, 0.2);
    -webkit-transition: all 0.7s ease-out;
    transition: all 0.7s ease-out;
    -webkit-transition-property: -webkit-transform, opacity;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    -webkit-transform: scale(0);
    transform: scale(0);
    pointer-events: none;
}

.waves-notransition {
    -webkit-transition: none !important;
    transition: none !important;
}

.waves-circle {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    text-align: center;
    width: 2.5em;
    height: 2.5em;
    line-height: 2.5em;
    border-radius: 50%;
    -webkit-mask-image: none;
}

.waves-input-wrapper {
    border-radius: 0.2em;
    vertical-align: bottom;
}

.waves-input-wrapper .waves-button-input {
    position: relative;
    top: 0;
    left: 0;
    z-index: 1;
}

.waves-block {
    display: block;
}

.waves-effect.waves-light .waves-ripple {
    background-color: rgba(255, 255, 255, 0.4);
}

.waves-effect.waves-custom .waves-ripple {
    background-color: rgba(2, 192, 206, 0.4);
}

.waves-effect.waves-primary .waves-ripple {
    background-color: rgba(45, 123, 244, 0.4);
}

.waves-effect.waves-success .waves-ripple {
    background-color: rgba(10, 207, 151, 0.4);
}

.waves-effect.waves-info .waves-ripple {
    background-color: rgba(78, 183, 235, 0.4);
}

.waves-effect.waves-warning .waves-ripple {
    background-color: rgba(249, 188, 11, 0.4);
}

.waves-effect.waves-danger .waves-ripple {
    background-color: rgba(241, 85, 108, 0.4);
}

.waves-effect.waves-pink .waves-ripple {
    background-color: rgba(255, 103, 155, 0.4);
}

.waves-effect.waves-purple .waves-ripple {
    background-color: rgba(119, 126, 221, 0.4);
}

/* =============
   Card
============= */

.kanban_drop {
    padding: 10px 0
}

.kanban_drop li {
    padding: 4px 15px
}

.kanban_drop li:hover {
    background-color: #f1f1f1
}

.kanban_drop li a {
    cursor: pointer;
    color: #000
}

.tablebtngropview {
    position: absolute;
    right: 16px;
    top: 63px;
    z-index: 99;
}

.kanbnsetng {
    float: left;
    margin-top: 10px;
    margin-right: 3px;
}

.box_header .tablebtngropview .btn {
    border-radius: 2px;
    font-size: 14px;
    outline: none !important;
    padding: 2px 5px;
    background-color: #d9e0e6
}

/* Card Box */

.box_header {
    width: 100%;
    background-color: #fff;
    padding: 8px 10px 8px 10px;
    border-radius: 3px 3px 0 0;
    margin-bottom: 3px;
}

.card-box {
    padding: 10px 10px;
    border-radius: 3px;
    margin-bottom: 0px;
    background-color: #ffffff;
    min-height: calc(100vh - 125px);
}

.Card_height {
    min-height: calc(100vh - 112px);
}

/* Card */

.card {
    border: none;
}

.row2 {
    /* margin-left: -15px;
	margin-right: -15px; */
}

.table_rspnsv {
    width: calc(100% + 30px);
    overflow-x: auto;
    margin-left: -15px;
    margin-right: -15px;
}

.table_rspnsv2 {
    width: calc(100% + 30px);
    margin-left: -15px;
    margin-right: -15px;
}

.table_rspnsv table {
    min-width: 600px;
}

.card-title,
.card-header {
    margin-top: 0 !important;
}

.card-header,
.card-footer {
    background-color: #e3eaef;
    border-bottom-color: #d3dee6;
}

.card-footer {
    border-top-color: #d3dee6;
}

/* =============
   Buttons
============= */

.btn {
    /* border-radius: 2px; */
    font-size: 14px;
    outline: none !important;
    padding: 4px 10px;
}

.table_rspnsv .label-default {
    outline: none !important;
    padding: 1px 3px !important;
    font-size: 13px !important;
}

/* .btn-group-sm > .btn,
.btn-sm {
    padding: .2rem .8rem;
} */

.btn-group-lg > .btn,
.btn-lg {
    padding: .7rem 1.6rem;
}

.btn-group.open .dropdown-toggle {
    -webkit-box-shadow: 0 0 0 100px rgba(0, 0, 0, 0.1) inset;
    box-shadow: 0 0 0 100px rgba(0, 0, 0, 0.1) inset;
}

.dropdown-toggle-split {
    padding-right: .5625rem;
    padding-left: .5625rem;
}

.dropleft .dropdown-toggle-split {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.btn-custom,
.btn-primary,
.btn-success,
.btn-info,
.btn-warning,
.btn-danger,
.btn-inverse,
.btn-purple,
.btn-pink {
    color: #ffffff !important;
}

.btn-custom {
    background-color: #39354c;
    border-color: #262435;
}


.btn-custom:hover,
.btn-custom:focus,
.btn-custom:active,
.btn-custom.active,
.btn-custom.focus,
.btn-custom:active,
.btn-custom:focus,
.btn-custom:hover,
.open > .dropdown-toggle.btn-custom {
    background-color: #262435;
    border-color: #262435;
}


.btn-custom.focus,
.btn-custom:focus,
.btn-outline-custom.focus,
.btn-outline-custom:focus,
.btn-custom:not([disabled]):not(.disabled).active,
.btn-custom:not([disabled]):not(.disabled):active,
.show > .btn-custom.dropdown-toggle {
    -webkit-box-shadow: 0 0 0 2px rgba(2, 192, 206, 0.5);
    box-shadow: 0 0 0 2px rgba(2, 192, 206, 0.5);
}

.btn-primary {
    background-color: #000000;
    border-color: #000000;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.btn-primary.focus,
.btn-primary:active,
.btn-primary:focus,
.btn-primary:hover,
.btn-primary:not([disabled]):not(.disabled).active,
.btn-primary:not([disabled]):not(.disabled):active {
    background-color: #262435;
    border-color: #262435;
}

.open > .dropdown-toggle.btn-primary,
.show > .btn-primary.dropdown-toggle {
    background-color: #fff !important;
}

.btn-primary.focus,
.btn-primary:focus,
.btn-outline-primary.focus,
.btn-outline-primary:focus,
.btn-primary:not([disabled]):not(.disabled).active,
.btn-primary:not([disabled]):not(.disabled):active,
.btn-primary:not([disabled]):not(.disabled).active:focus,
.btn-primary:not([disabled]):not(.disabled):active:focus {
    background: black;
}

.show > .btn-primary.dropdown-toggle,
.show > .btn-primary.dropdown-toggle:focus {
    background-color: #fff
}

.btn-secondary {
    background-color: #9a9a9a;
    border-color: #9a9a9a;
}

.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active,
.btn-secondary.active,
.btn-secondary.focus,
.btn-secondary:active,
.btn-secondary:focus,
.btn-secondary:hover {
    background-color: #8d8d8d;
    border-color: #8d8d8d;
}

.open > .dropdown-toggle.btn-secondary {
    background-color: #fff;
}

.btn-secondary.focus,
.btn-secondary:focus,
.btn-outline-secondary.focus,
.btn-outline-secondary:focus {
    -webkit-box-shadow: 0 0 0 2px rgba(121, 121, 121, 0.5);
    box-shadow: 0 0 0 2px rgba(121, 121, 121, 0.5);
}

.btn-light,
.btn-light:hover,
.btn-light:focus {
    border-color: #e3eaef;
    background-color: #fff;
    padding: 4px 6px;
}

.btn-light:hover,
.btn-light:focus,
.btn-light:active,
.btn-light.active,
.btn-light.focus,
.btn-light:active,
.btn-light:focus,
.btn-light:hover,
.open > .dropdown-toggle.btn-light {
    border-color: #bfbfbf;
}

.btn-light.focus,
.btn-light:focus,
.btn-outline-light.focus,
.btn-outline-light:focus {
    -webkit-box-shadow: 0 0 0 2px #d9d9d9;
    box-shadow: 0 0 0 2px #d9d9d9;
}

.btn-success {
    background-color: #0acf97;
    border: 1px solid #0acf97;
}

.btn-success:hover,
.btn-success:focus,
.btn-success:active,
.btn-success.active,
.btn-success.focus,
.btn-success:active,
.btn-success:focus,
.btn-success:hover,
.open > .dropdown-toggle.btn-success,
.btn-success:not([disabled]):not(.disabled).active,
.btn-success:not([disabled]):not(.disabled):active,
.show > .btn-success.dropdown-toggle {
    background-color: #09b785;
    border-color: #09b785;
}

.btn-success.focus,
.btn-success:focus,
.btn-outline-success.focus,
.btn-outline-success:focus,
.btn-success:not([disabled]):not(.disabled).active,
.btn-success:not([disabled]):not(.disabled):active,
.show > .btn-success.dropdown-toggle,
.btn-success:not([disabled]):not(.disabled).active:focus,
.btn-success:not([disabled]):not(.disabled):active:focus,
.show > .btn-success.dropdown-toggle:focus {
    -webkit-box-shadow: 0 0 0 2px rgba(10, 207, 151, 0.5);
    box-shadow: 0 0 0 2px rgba(10, 207, 151, 0.5);
}

.newbtn_crete {
    cursor: pointer;
    padding: 7px 12px;
    border-radius: 3px;
    color: #ffffff !important;
    background-color: #72819c;
}

.newbtn_crete:hover {
    opacity: .8;
}

.btn-info {
    background: #72819c;
    border-color: #596b8c;
}

/* .modal-footer .btn {
    border-radius: 2px;
    font-size: 14px;
    outline: none !important;
    padding: 3px 10px;
} */

.modal-footer > :not(:last-child) {
    margin-right: -2px !important;
}

.btn-info:hover,
.btn-info:focus,
.btn-info:active,
.btn-info.active,
.btn-info.focus,
.btn-info:active,
.btn-info:focus,
.btn-info:hover,
.open > .dropdown-toggle.btn-info,
.btn-info:not([disabled]):not(.disabled).active,
.btn-info:not([disabled]):not(.disabled):active,
.show > .btn-info.dropdown-toggle {
    opacity: .8;
}

.btn-default:hover,
.btn-default:focus,
.btn-default:active,
.btn-default.active,
.btn-default.focus,
.btn-default:active,
.btn-default:focus,
.btn-default:hover,
.open > .dropdown-toggle.btn-default,
.btn-default:not([disabled]):not(.disabled).active,
.btn-default:not([disabled]):not(.disabled):active,
.show > .btn-default.dropdown-toggle {
    background: #ccc;
    border-color: #ccc;
}

.btn-info.focus,
.btn-info:focus,
.btn-outline-info.focus,
.btn-outline-info:focus,
.btn-info:not([disabled]):not(.disabled).active,
.btn-info:not([disabled]):not(.disabled):active,
.show > .btn-info.dropdown-toggle,
.btn-info:not([disabled]):not(.disabled).active:focus,
.btn-info:not([disabled]):not(.disabled):active:focus,
.show > .btn-info.dropdown-toggle:focus {
    /*-webkit-box-shadow: 0 0 0 2px rgba(78, 183, 235, 0.5);*/
    /*box-shadow: 0 0 0 2px rgba(78, 183, 235, 0.5);*/
}

.btn-warning {
    background-color: #f9bc0b;
    border: 1px solid #f9bc0b;
}

.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active,
.btn-warning.active,
.btn-warning.focus,
.btn-warning:active,
.btn-warning:focus,
.btn-warning:hover,
.open > .dropdown-toggle.btn-warning,
.btn-warning:not([disabled]):not(.disabled).active,
.btn-warning:not([disabled]):not(.disabled):active,
.show > .btn-warning.dropdown-toggle {
    background-color: #e5ac06;
    border-color: #e5ac06;
}

.btn-warning.focus,
.btn-warning:focus,
.btn-outline-warning.focus,
.btn-outline-warning:focus,
.btn-warning:not([disabled]):not(.disabled).active,
.btn-warning:not([disabled]):not(.disabled):active,
.show > .btn-warning.dropdown-toggle,
.btn-warning:not([disabled]):not(.disabled).active:focus,
.btn-warning:not([disabled]):not(.disabled):active:focus,
.show > .btn-warning.dropdown-toggle:focus {
    -webkit-box-shadow: 0 0 0 2px rgba(249, 188, 11, 0.5);
    box-shadow: 0 0 0 2px rgba(249, 188, 11, 0.5);
}

.btn-danger {
    background-color: #f1556c;
    border: 1px solid #f1556c;
}

.btn-danger:active,
.btn-danger:focus,
.btn-danger:hover,
.btn-danger.active,
.btn-danger.focus,
.btn-danger:active,
.btn-danger:focus,
.btn-danger:hover,
.open > .dropdown-toggle.btn-danger,
.btn-danger:not([disabled]):not(.disabled).active,
.btn-danger:not([disabled]):not(.disabled):active,
.show > .btn-danger.dropdown-toggle {
    background-color: #ef3d58;
    border-color: #ef3d58;
}

.btn-danger.focus,
.btn-danger:focus,
.btn-outline-danger.focus,
.btn-outline-danger:focus,
.btn-danger:not([disabled]):not(.disabled).active,
.btn-danger:not([disabled]):not(.disabled):active,
.show > .btn-danger.dropdown-toggle,
.btn-danger:not([disabled]):not(.disabled).active:focus,
.btn-danger:not([disabled]):not(.disabled):active:focus,
.show > .btn-danger.dropdown-toggle:focus {
    -webkit-box-shadow: 0 0 0 2px rgba(241, 85, 108, 0.5);
    box-shadow: 0 0 0 2px rgba(241, 85, 108, 0.5);
}

.btn-dark {
    background-color: #313a46;
    border: 1px solid #313a46;
}

.btn-dark:hover,
.btn-dark:focus,
.btn-dark:active,
.btn-dark.active,
.btn-dark.focus,
.btn-dark:active,
.btn-dark:focus,
.btn-dark:hover,
.open > .dropdown-toggle.btn-dark {
    background-color: #272e37;
    border-color: #272e37;
}

.btn-dark.focus,
.btn-dark:focus,
.btn-outline-dark.focus,
.btn-outline-dark:focus,
.btn-dark:not([disabled]):not(.disabled).active,
.btn-dark:not([disabled]):not(.disabled):active,
.show > .btn-dark.dropdown-toggle {
    -webkit-box-shadow: 0 0 0 2px rgba(49, 58, 70, 0.5);
    box-shadow: 0 0 0 2px rgba(49, 58, 70, 0.5);
}

.btn-purple {
    background: #72819c;
    border-color: #596b8c;
}

.btn-purple:hover,
.btn-purple:focus,
.btn-purple:active {
    background: #596b8c;
    border-color: #596b8c;
}

.btn-purple.focus,
.btn-purple:focus,
.btn-outline-purple.focus,
.btn-outline-purple:focus {
    -webkit-box-shadow: 0 0 0 2px rgba(119, 126, 221, 0.5);
    box-shadow: 0 0 0 2px rgba(119, 126, 221, 0.5);
}

.btn-pink {
    background-color: #ff679b;
    border: 1px solid #ff679b;
}

.btn-pink:hover,
.btn-pink:focus,
.btn-pink:active {
    background-color: #ff4e8a;
    border-color: #ff4e8a;
}

.btn-pink.focus,
.btn-pink:focus,
.btn-outline-pink.focus,
.btn-outline-pink:focus {
    -webkit-box-shadow: 0 0 0 2px rgba(255, 103, 155, 0.5);
    box-shadow: 0 0 0 2px rgba(255, 103, 155, 0.5);
}

/* button Outline */

.btn-outline-custom {
    color: #02c0ce;
    border-color: #02c0ce;
    background-image: none;
    background-color: transparent;
}

.btn-outline-custom:hover {
    background-color: #02c0ce;
    border-color: #02c0ce;
    color: #ffffff;
}

.btn-outline-primary {
    color: #2d7bf4;
    border-color: #2d7bf4;
}

.btn-outline-primary:hover {
    background-color: #2d7bf4;
    border-color: #2d7bf4;
}

.btn-outline-success {
    color: #0acf97;
    border-color: #0acf97;
}

.btn-outline-success:hover {
    background-color: #0acf97;
    border-color: #0acf97;
}

.btn-outline-info {
    color: #4eb7eb;
    border-color: #4eb7eb;
}

.btn-outline-info:hover {
    background-color: #4eb7eb;
    border-color: #4eb7eb;
}

.btn-outline-warning {
    color: #f9bc0b;
    border-color: #f9bc0b;
}

.btn-outline-warning:hover {
    background-color: #f9bc0b;
    border-color: #f9bc0b;
}

.btn-outline-danger {
    color: #f1556c;
    border-color: #f1556c;
}

.btn-outline-danger:hover {
    background-color: #f1556c;
    border-color: #f1556c;
}

.btn-outline-dark {
    color: #313a46;
    border-color: #313a46;
}

.btn-outline-dark:hover {
    background-color: #313a46;
    border-color: #313a46;
}

.btn-outline-pink {
    color: #ff679b;
    background-image: none;
    background-color: transparent;
    border-color: #ff679b;
}

.btn-outline-pink:hover {
    background-color: #ff679b;
    border-color: #ff679b;
    color: #ffffff;
}

.btn-outline-purple {
    color: #777edd;
    background-image: none;
    background-color: transparent;
    border-color: #777edd;
}

.btn-outline-purple:hover {
    background-color: #777edd;
    border-color: #777edd;
    color: #ffffff;
}

.btn-rounded {
    border-radius: 2em;
}

/* Social Buttons */

.btn-facebook {
    color: #ffffff !important;
    background-color: #3b5998;
}

.btn-twitter {
    color: #ffffff !important;
    background-color: #00aced;
}

.btn-linkedin {
    color: #ffffff !important;
    background-color: #007bb6;
}

.btn-dribbble {
    color: #ffffff !important;
    background-color: #ea4c89;
}

.btn-googleplus {
    color: #ffffff !important;
    background-color: #dd4b39;
}

.btn-instagram {
    color: #ffffff !important;
    background-color: #517fa4;
}

.btn-pinterest {
    color: #ffffff !important;
    background-color: #cb2027;
}

.btn-dropbox {
    color: #ffffff !important;
    background-color: #007ee5;
}

.btn-flickr {
    color: #ffffff !important;
    background-color: #ff0084;
}

.btn-tumblr {
    color: #ffffff !important;
    background-color: #32506d;
}

.btn-skype {
    color: #ffffff !important;
    background-color: #00aff0;
}

.btn-youtube {
    color: #ffffff !important;
    background-color: #bb0000;
}

.btn-github {
    color: #ffffff !important;
    background-color: #171515;
}

/* =================
   Ribbons
==================== */

.ribbon-box {
    position: relative;
    /* Ribbon two */
}

.ribbon-box .ribbon {
    position: relative;
    float: left;
    clear: both;
    padding: 5px 12px 5px 12px;
    margin-left: -30px;
    margin-bottom: 15px;
    font-family: 'Roboto', sans-serif;
    -webkit-box-shadow: 2px 5px 10px rgba(49, 58, 70, 0.15);
    -o-box-shadow: 2px 5px 10px rgba(49, 58, 70, 0.15);
    box-shadow: 2px 5px 10px rgba(49, 58, 70, 0.15);
    color: #ffffff;
    font-size: 13px;
}

.ribbon-box .ribbon:before {
    content: " ";
    border-style: solid;
    border-width: 10px;
    display: block;
    position: absolute;
    bottom: -10px;
    left: 0;
    margin-bottom: -10px;
    z-index: -1;
}

.ribbon-box .ribbon + p {
    clear: both;
}

.ribbon-box .ribbon-custom {
    background: #02c0ce;
}

.ribbon-box .ribbon-custom:before {
    border-color: #02919b transparent transparent;
}

.ribbon-box .ribbon-primary {
    background: #2d7bf4;
}

.ribbon-box .ribbon-primary:before {
    border-color: #0c60e2 transparent transparent;
}

.ribbon-box .ribbon-success {
    background: #0acf97;
}

.ribbon-box .ribbon-success:before {
    border-color: #089e74 transparent transparent;
}

.ribbon-box .ribbon-info {
    background: #4eb7eb;
}

.ribbon-box .ribbon-info:before {
    border-color: #20a4e6 transparent transparent;
}

.ribbon-box .ribbon-warning {
    background: #f9bc0b;
}

.ribbon-box .ribbon-warning:before {
    border-color: #cc9905 transparent transparent;
}

.ribbon-box .ribbon-danger {
    background: #f1556c;
}

.ribbon-box .ribbon-danger:before {
    border-color: #ed2643 transparent transparent;
}

.ribbon-box .ribbon-pink {
    background: #ff679b;
}

.ribbon-box .ribbon-pink:before {
    border-color: #ff3479 transparent transparent;
}

.ribbon-box .ribbon-purple {
    background: #777edd;
}

.ribbon-box .ribbon-purple:before {
    border-color: #4e57d3 transparent transparent;
}

.ribbon-box .ribbon-dark {
    background: #313a46;
}

.ribbon-box .ribbon-dark:before {
    border-color: #1c2128 transparent transparent;
}

.ribbon-box .ribbon-two {
    position: absolute;
    left: -5px;
    top: -5px;
    z-index: 1;
    overflow: hidden;
    width: 75px;
    height: 75px;
    text-align: right;
}

.ribbon-box .ribbon-two span {
    font-size: 13px;
    color: #ffffff;
    font-family: 'Roboto', sans-serif;
    text-align: center;
    line-height: 20px;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    width: 100px;
    display: block;
    -webkit-box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
    box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
    position: absolute;
    top: 19px;
    left: -21px;
}

.ribbon-box .ribbon-two span:before {
    content: "";
    position: absolute;
    left: 0;
    top: 100%;
    z-index: -1;
    border-right: 3px solid transparent;
    border-bottom: 3px solid transparent;
}

.ribbon-box .ribbon-two span:after {
    content: "";
    position: absolute;
    right: 0;
    top: 100%;
    z-index: -1;
    border-left: 3px solid transparent;
    border-bottom: 3px solid transparent;
}

.ribbon-box .ribbon-two-custom span {
    background: #02c0ce;
}

.ribbon-box .ribbon-two-custom span:before {
    border-left: 3px solid #017982;
    border-top: 3px solid #017982;
}

.ribbon-box .ribbon-two-custom span:after {
    border-right: 3px solid #017982;
    border-top: 3px solid #017982;
}

.ribbon-box .ribbon-two-primary span {
    background: #2d7bf4;
}

.ribbon-box .ribbon-two-primary span:before {
    border-left: 3px solid #0b56ca;
    border-top: 3px solid #0b56ca;
}

.ribbon-box .ribbon-two-primary span:after {
    border-right: 3px solid #0b56ca;
    border-top: 3px solid #0b56ca;
}

.ribbon-box .ribbon-two-success span {
    background: #0acf97;
}

.ribbon-box .ribbon-two-success span:before {
    border-left: 3px solid #068662;
    border-top: 3px solid #068662;
}

.ribbon-box .ribbon-two-success span:after {
    border-right: 3px solid #068662;
    border-top: 3px solid #068662;
}

.ribbon-box .ribbon-two-info span {
    background: #4eb7eb;
}

.ribbon-box .ribbon-two-info span:before {
    border-left: 3px solid #1896d4;
    border-top: 3px solid #1896d4;
}

.ribbon-box .ribbon-two-info span:after {
    border-right: 3px solid #1896d4;
    border-top: 3px solid #1896d4;
}

.ribbon-box .ribbon-two-warning span {
    background: #f9bc0b;
}

.ribbon-box .ribbon-two-warning span:before {
    border-left: 3px solid #b38604;
    border-top: 3px solid #b38604;
}

.ribbon-box .ribbon-two-warning span:after {
    border-right: 3px solid #b38604;
    border-top: 3px solid #b38604;
}

.ribbon-box .ribbon-two-danger span {
    background: #f1556c;
}

.ribbon-box .ribbon-two-danger span:before {
    border-left: 3px solid #e71332;
    border-top: 3px solid #e71332;
}

.ribbon-box .ribbon-two-danger span:after {
    border-right: 3px solid #e71332;
    border-top: 3px solid #e71332;
}

.ribbon-box .ribbon-two-pink span {
    background: #ff679b;
}

.ribbon-box .ribbon-two-pink span:before {
    border-left: 3px solid #ff1b69;
    border-top: 3px solid #ff1b69;
}

.ribbon-box .ribbon-two-pink span:after {
    border-right: 3px solid #ff1b69;
    border-top: 3px solid #ff1b69;
}

.ribbon-box .ribbon-two-purple span {
    background: #777edd;
}

.ribbon-box .ribbon-two-purple span:before {
    border-left: 3px solid #3a44ce;
    border-top: 3px solid #3a44ce;
}

.ribbon-box .ribbon-two-purple span:after {
    border-right: 3px solid #3a44ce;
    border-top: 3px solid #3a44ce;
}

.ribbon-box .ribbon-two-dark span {
    background: #313a46;
}

.ribbon-box .ribbon-two-dark span:before {
    border-left: 3px solid #121519;
    border-top: 3px solid #121519;
}

.ribbon-box .ribbon-two-dark span:after {
    border-right: 3px solid #121519;
    border-top: 3px solid #121519;
}

/* =================
   Popover / Tooltips
==================== */

/* Popover */

.popover {
    font-family: inherit;
    border-color: #e3eaef;
    -webkit-box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
    box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
}

.popover .popover-header {
    margin-top: 0;
    font-size: 14px;
    background-color: #e3eaef;
    padding: 2px 15px;
    border: none;
}

/* Tooltips */

.tooltip {
    font-family: 'Roboto', sans-serif;
}

.tooltip .tooltip-inner {
    padding: 4px 10px;
    border-radius: 2px;
    background-color: #313a46;
}

.tooltip.left .tooltip-arrow {
    border-left-color: #313a46;
}

.tooltip.top .tooltip-arrow {
    border-top-color: #313a46;
}

.tooltip.bottom .tooltip-arrow {
    border-bottom-color: #313a46;
}

.tooltip.right .tooltip-arrow {
    border-right-color: #313a46;
}

/* Tooltpster */

.tooltipster-sidetip .tooltipster-box {
    background-color: #02c0ce;
    border: 2px solid #02c0ce;
}

.tooltipster-sidetip.tooltipster-top .tooltipster-arrow-border,
.tooltipster-sidetip.tooltipster-top .tooltipster-arrow-background {
    border-top-color: #02c0ce;
}

.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-border,
.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-background {
    border-bottom-color: #02c0ce;
}

.tooltipster-sidetip.tooltipster-left .tooltipster-arrow-border,
.tooltipster-sidetip.tooltipster-left .tooltipster-arrow-background {
    border-left-color: #02c0ce;
}

.tooltipster-sidetip.tooltipster-right .tooltipster-arrow-border,
.tooltipster-sidetip.tooltipster-right .tooltipster-arrow-background {
    border-right-color: #02c0ce;
}

/* =============
   Checkbox and Radios
============= */

.checkbox label {
    display: inline-block;
    padding-left: 6px;
    position: relative;
    font-weight: normal;
}

.checkbox label::before {
    -o-transition: 0.3s ease-in-out;
    -webkit-transition: 0.3s ease-in-out;
    background-color: #ffffff;
    border-radius: 3px;
    border: 2px solid #98a6ad;
    content: "";
    display: inline-block;
    height: 18px;
    left: 0;
    margin-left: -18px;
    position: absolute;
    transition: 0.3s ease-in-out;
    width: 18px;
    outline: none !important;
}

.checkbox label::after {
    color: #797979;
    display: inline-block;
    font-size: 11px;
    height: 18px;
    left: 0;
    margin-left: -18px;
    padding-left: 3px;
    padding-top: 2px;
    position: absolute;
    top: 0;
    width: 18px;
}

.checkbox input[type="checkbox"] {
    cursor: pointer;
    opacity: 0;
    z-index: 1;
    outline: none !important;
}

.checkbox input[type="checkbox"]:disabled + label,
.checkbox input[type="checkbox"]:disabled ~ label {
    opacity: 0.65;
}

.checkbox input[type="checkbox"]:focus + label::before,
.checkbox input[type="checkbox"]:focus ~ label::before {
    outline-offset: -2px;
    outline: none;
}

.checkbox input[type="checkbox"]:checked + label::after, .checkbox input[type="checkbox"]:checked ~ label::after {
    left: 20px;
}

.checkbox input[type="checkbox"]:checked + label::after,
.checkbox input[type="checkbox"]:checked ~ label::after {
    content: "";
    position: absolute;
    top: 1px;
    left: 7px;
    display: table;
    width: 5px;
    height: 13px;
    border: 1px solid #313a46;
    border-top-width: 0;
    border-left-width: 0;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.table_rgs .checkbox input[type="checkbox"]:checked + label::after,
.table_rgs .checkbox input[type="checkbox"]:checked ~ label::after {
    content: "";
    position: absolute;
    top: 1px;
    left: 22px;
    display: table;
    width: 1px;
    height: 14px;
    border: 1px solid #fafcff;
    border-top-width: 0;
    border-left-width: 0;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.checkbox input[type="checkbox"]:disabled + label::before,
.checkbox input[type="checkbox"]:disabled ~ label::before {
    background-color: #e3eaef;
    cursor: not-allowed;
}

.checkbox.checkbox-circle label::before {
    border-radius: 50%;
}

.checkbox.checkbox-inline {
    margin-top: 0;
}

.checkbox.checkbox-single input {
    height: 18px;
    width: 18px;
    position: absolute;
}

.checkbox.checkbox-single label {
    height: 18px;
    width: 18px;
}

.checkbox.checkbox-single label:before {
    margin-left: 0;
}

.checkbox.checkbox-single label:after {
    margin-left: 0;
}

.checkbox-custom input[type="checkbox"]:checked + label::before {
    background-color: #f16033;
    border-color: #e26139;
}

.checkbox-custom input[type="checkbox"]:checked + label::after {
    border-color: #ffffff;
}

.checkbox-primary input[type="checkbox"]:checked + label::before {
    background-color: #2d7bf4;
    border-color: #2d7bf4;
}

.checkbox-primary input[type="checkbox"]:checked + label::after {
    border-color: #ffffff;
}

.checkbox-danger input[type="checkbox"]:checked + label::before {
    background-color: #f1556c;
    border-color: #f1556c;
}

.checkbox-danger input[type="checkbox"]:checked + label::after {
    border-color: #ffffff;
}

.checkbox-info input[type="checkbox"]:checked + label::before {
    background: #72819c;
    border-color: #6782b3;
}

.checkbox-info input[type="checkbox"]:checked + label::after {
    border-color: #ffffff;
}

.checkbox-warning input[type="checkbox"]:checked + label::before {
    background-color: #f9bc0b;
    border-color: #f9bc0b;
}

.checkbox-warning input[type="checkbox"]:checked + label::after {
    border-color: #ffffff;
}

.checkbox-success input[type="checkbox"]:checked + label::before {
    background-color: #0acf97;
    border-color: #0acf97;
}

.checkbox-success input[type="checkbox"]:checked + label::after {
    border-color: #ffffff;
}

.checkbox-purple input[type="checkbox"]:checked + label::before {
    background-color: #777edd;
    border-color: #777edd;
}

.checkbox-purple input[type="checkbox"]:checked + label::after {
    border-color: #ffffff;
}

.checkbox-pink input[type="checkbox"]:checked + label::before {
    background-color: #ff679b;
    border-color: #ff679b;
}

.checkbox-pink input[type="checkbox"]:checked + label::after {
    border-color: #ffffff;
}

.checkbox-dark input[type="checkbox"]:checked + label::before {
    background-color: #313a46;
    border-color: #313a46;
}

.checkbox-dark input[type="checkbox"]:checked + label::after {
    border-color: #ffffff;
}

/* Radios */

.radio label {
    display: inline-block;
    padding-left: 8px;
    position: relative;
    font-weight: normal;
}

.radio label::before {
    -o-transition: border 0.5s ease-in-out;
    -webkit-transition: border 0.5s ease-in-out;
    background-color: #ffffff;
    border-radius: 50%;
    border: 2px solid #98a6ad;
    content: "";
    display: inline-block;
    height: 18px;
    left: 0;
    margin-left: -18px;
    position: absolute;
    transition: border 0.5s ease-in-out;
    width: 18px;
    outline: none !important;
}

.radio label::after {
    -moz-transition: -moz-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
    -ms-transform: scale(0, 0);
    -o-transform: scale(0, 0);
    -o-transition: -o-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
    -webkit-transform: scale(0, 0);
    -webkit-transition: -webkit-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
    background-color: #797979;
    border-radius: 50%;
    content: " ";
    display: inline-block;
    height: 10px;
    left: 6px;
    margin-left: -20px;
    position: absolute;
    top: 4px;
    transform: scale(0, 0);
    transition: -webkit-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
    transition: transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
    transition: transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33), -webkit-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
    width: 10px;
}

.radio input[type="radio"] {
    cursor: pointer;
    opacity: 0;
    z-index: 1;
    outline: none !important;
}

.radio input[type="radio"]:disabled + label {
    opacity: 0.65;
}

.radio input[type="radio"]:focus + label::before {
    outline-offset: -2px;
    outline: 5px auto -webkit-focus-ring-color;
    outline: thin dotted;
}

.radio input[type="radio"]:checked + label::after {
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
}

.radio input[type="radio"]:disabled + label::before {
    cursor: not-allowed;
}

.radio.radio-inline {
    margin-top: 0;
}

.radio.radio-single input {
    position: relative;
    bottom: 9px;
}

.radio.radio-single label {
    height: 17px;
}

.radio-custom input[type="radio"] + label::after {
    background-color: #02c0ce;
}

.radio-custom input[type="radio"]:checked + label::before {
    border-color: #02c0ce;
}

.radio-custom input[type="radio"]:checked + label::after {
    background-color: #02c0ce;
}

.radio-primary input[type="radio"] + label::after {
    background-color: #2d7bf4;
}

.radio-primary input[type="radio"]:checked + label::before {
    border-color: #2d7bf4;
}

.radio-primary input[type="radio"]:checked + label::after {
    background-color: #2d7bf4;
}

.radio-danger input[type="radio"] + label::after {
    background-color: #f1556c;
}

.radio-danger input[type="radio"]:checked + label::before {
    border-color: #f1556c;
}

.radio-danger input[type="radio"]:checked + label::after {
    background-color: #f1556c;
}

.radio-info input[type="radio"] + label::after {
    background-color: #4eb7eb;
}

.radio-info input[type="radio"]:checked + label::before {
    border-color: #72819c;
}

.radio-info input[type="radio"]:checked + label::after {
    background-color: #72819c;
}

.radio-warning input[type="radio"] + label::after {
    background-color: #f9bc0b;
}

.radio-warning input[type="radio"]:checked + label::before {
    border-color: #f9bc0b;
}

.radio-warning input[type="radio"]:checked + label::after {
    background-color: #f9bc0b;
}

.radio-success input[type="radio"] + label::after {
    background-color: #0acf97;
}

.radio-success input[type="radio"]:checked + label::before {
    border-color: #0acf97;
}

.radio-success input[type="radio"]:checked + label::after {
    background-color: #0acf97;
}

.radio-purple input[type="radio"] + label::after {
    background-color: #777edd;
}

.radio-purple input[type="radio"]:checked + label::before {
    border-color: #777edd;
}

.radio-purple input[type="radio"]:checked + label::after {
    background-color: #777edd;
}

.radio-pink input[type="radio"] + label::after {
    background-color: #ff679b;
}

.radio-pink input[type="radio"]:checked + label::before {
    border-color: #ff679b;
}

.radio-pink input[type="radio"]:checked + label::after {
    background-color: #ff679b;
}

/* =============
   Alerts
============= */

.alert-custom {
    color: #02c0ce;
    background-color: #eafdff;
    border-color: #39f0fd;
}

.alert-primary {
    color: #2d7bf4;
    background-color: #e5effe;
    border-color: #8eb8f9;
}

.alert-secondary {
    color: #9a9a9a;
    background-color: #f3f3f3;
    border-color: #cdcdcd;
}

.alert-success {
    color: #0acf97;
    background-color: #f3fefb;
    border-color: #49f6c5;
}

.alert-danger {
    color: #f1556c;
    background-color: #fef0f2;
    border-color: #f9b3bd;
}

.alert-warning {
    color: #f9bc0b;
    background-color: #fffaeb;
    border-color: #fbd76f;
}

.alert-info {
    color: #4eb7eb;
    background-color: #eef8fd;
    border-color: #aadcf5;
}

.alert-light {
    background-color: #f3f6f8;
    border-color: #e3eaef;
}

.alert-dark {
    color: #313a46;
    background-color: #dce1e7;
    border-color: #919fb2;
}

.jq-toast-single {
    padding: 15px;
    font-family: 'Roboto', sans-serif;
    background-color: #02c0ce;
    font-size: 13px;
    line-height: 22px;
}

.jq-toast-single h2 {
    font-family: 'Roboto', sans-serif;
}

.jq-toast-single a {
    font-size: 14px;
}

.jq-toast-single a:hover {
    color: #ffffff;
}

.jq-has-icon {
    padding: 10px 10px 10px 50px;
}

.jq-icon-info {
    background-color: #4eb7eb;
    color: #ffffff;
    border-color: #4eb7eb;
}

.jq-icon-success {
    background-color: #0acf97;
    color: #ffffff;
    border-color: #0acf97;
}

.jq-icon-warning {
    background-color: #f9bc0b;
    color: #ffffff;
    border-color: #f9bc0b;
}

.jq-icon-error {
    background-color: #f1556c;
    color: #ffffff;
    border-color: #f1556c;
}

.close-jq-toast-single {
    position: absolute;
    top: -12px;
    right: -12px;
    font-size: 20px;
    cursor: pointer;
    height: 32px;
    width: 32px;
    background-color: #313a46;
    border-radius: 50%;
    text-align: center;
    line-height: 32px;
}

.jq-toast-loader {
    height: 3px;
    top: 0;
    border-radius: 0;
}

/* =============
   Modals
============= */

.modal .modal-dialog .close {
    top: 22px;
    position: absolute;
    right: 21px;
    height: 26px;
    width: 23px;
    opacity: 1;
    text-shadow: none;
    color: #222;
    padding: 0;
}

.modal .modal-dialog .modal-title {
    margin: 0;
}

.modal .modal-dialog .modal-content {
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.modal .modal-dialog .modal-content .modal-header {
    border-bottom-width: 1px;
    margin: 0;
}

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

.modal-backdrop {
    background-color: #313a46;
}

.modal-backdrop.show {
    opacity: .6;
}

.modal-full {
    width: 98%;
}

.modal-content .nav.nav-tabs + .tab-content {
    margin-bottom: 0;
}

.modal-content .panel-group {
    margin-bottom: 0;
}

.modal-content .panel {
    border-top: none;
}

/* Custom-modal */

.custombox-open body {
    padding-right: 0 !important;
}

.modal-demo {
    background-color: #ffffff;
    width: 600px !important;
    border-radius: 4px;
    display: none;
}

.modal-demo .close {
    position: absolute;
    top: 15px;
    right: 25px;
    color: #e3eaef;
}

@media (max-width: 768px) {
    .modal-demo {
        width: 100% !important;
    }
}

.custom-modal-title {
    padding: 15px 25px 15px 25px;
    line-height: 22px;
    font-size: 18px;
    background-color: #313a46;
    color: #ffffff;
    text-align: left;
    margin: 0;
}

.custom-modal-text {
    padding: 20px;
}

.custombox-modal-wrapper {
    text-align: left;
}

.custombox-modal-flash .close,
.custombox-modal-rotatedown .close {
    top: 20px;
    z-index: 9999;
}

/* =================
   Spinners
==================== */

.sk-rotating-plane,
.sk-double-bounce .sk-child,
.sk-wave .sk-rect,
.sk-wandering-cubes .sk-cube,
.sk-spinner-pulse,
.sk-chasing-dots .sk-child,
.sk-three-bounce .sk-child,
.sk-circle .sk-child:before,
.sk-cube-grid .sk-cube,
.sk-fading-circle .sk-circle:before,
.sk-folding-cube .sk-cube:before {
    background-color: #02c0ce;
}

.sk-fading-circle .sk-circle {
    margin-top: 0;
}

/* =============
   Widgets
============= */

.widget-flat {
    position: relative;
    overflow: hidden;
    font-family: 'Roboto', sans-serif;
}

.widget-flat i {
    position: absolute;
    bottom: -20px;
    font-size: 78px;
    opacity: 0.25;
    right: 0;
    -webkit-transition: bottom 0.5s ease 0s;
    transition: bottom 0.5s ease 0s;
}

.widget-flat:hover i {
    bottom: 0;
}

.widget-chart-one {
    min-height: 120px;
}

.widget-chart-one .widget-chart-one-content {
    margin-left: 100px;
}

.widget-chart-two {
    min-height: 120px;
}

.widget-chart-two .widget-chart-one-content {
    margin-right: 100px;
}

.tilebox-one i {
    font-size: 30px;
}

/* Inbox-widget */

.inbox-widget .inbox-item {
    border-bottom: 1px solid #f3f6f8;
    overflow: hidden;
    padding: 10px 0;
    position: relative;
}

.inbox-widget .inbox-item .inbox-item-img {
    display: block;
    float: left;
    margin-right: 15px;
    width: 40px;
}

.inbox-widget .inbox-item img {
    width: 40px;
}

.inbox-widget .inbox-item .inbox-item-author {
    color: #313a46;
    display: block;
    margin: 0;
}

.inbox-widget .inbox-item .inbox-item-text {
    color: #98a6ad;
    display: block;
    font-size: 14px;
    margin: 0;
}

.inbox-widget .inbox-item .inbox-item-date {
    color: #98a6ad;
    font-size: 11px;
    position: absolute;
    right: 7px;
    top: 2px;
}

/* Comment List */

.comment-list .comment-box-item {
    position: relative;
}

.comment-list .comment-box-item .commnet-item-date {
    color: #98a6ad;
    font-size: 11px;
    position: absolute;
    right: 7px;
    top: 2px;
}

.comment-list .comment-box-item .commnet-item-msg {
    color: #313a46;
    display: block;
    margin: 10px 0;
    font-weight: normal;
    font-size: 15px;
    line-height: 24px;
}

.comment-list .comment-box-item .commnet-item-user {
    color: #98a6ad;
    display: block;
    font-size: 14px;
    margin: 0;
}

.comment-list a + a {
    margin-top: 15px;
    display: block;
}

/* Transaction */

.transaction-list li {
    padding: 7px 0;
    border-bottom: 1px solid #f3f6f8;
    clear: both;
    position: relative;
}

.transaction-list i {
    width: 20px;
    position: absolute;
    top: 10px;
    font-size: 12px;
}

.transaction-list .tran-text {
    padding-left: 25px;
    white-space: nowrap;
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 150px;
}

.transaction-list .tran-price {
    margin-left: 30px;
}

/* =============
   Tabs
============= */

.tab-content {
    padding: 0px;
}

.navtab-bg {
    background-color: #f3f6f8;
}

.nav-tabs > li > a,
.nav-pills > li > a {
    color: black;
}

.modal-md {
    width: 100%;
    max-width: 450px;
}

.nav-pills .nav-item.show .nav-link,
.nav-pills .nav-link.active {
    background: #02c0ce;
}

.card-counter {
    box-shadow: 2px 2px 10px #DADADA;
    margin: 5px;
    padding: 20px 10px;
    background-color: #fff;
    height: 100px;
    border-radius: 5px;
    transition: .3s linear all;
}

div.mm-dropdown {
    border: 1px solid #ddd;
    width: 40px;
    border-radius: 3px 0 0 3px;
    float: left;
}

div.mm-dropdown:after {
    content: "\f0d7";
    font-family: FontAwesome;
    position: absolute;
    left: 35px;
    top: 9px;
    font-size: 11px;
}

.form-control_sub {
    width: calc(100% - 40px);
    border-radius: 0px 3px 3px 0px !important;
    border-left: 0 !important;
}

div.mm-dropdown ul {
    list-style: none;
    padding: 0;
    margin: 0;
    border: 0;
    position: absolute;
    width: 240px;
    background-color: #fff;
    z-index: 999999;
    top: 32px;
    width: calc(100% - 10px);
    max-height: 150px;
    overflow-y: auto;
    box-shadow: 1px 2px 10px rgba(0, 0, 0, .1);
}

div.mm-dropdown div.textfirst {
    float: left;
    height: 29px;
    width: 40px;
}

div.mm-dropdown ul li,
div.mm-dropdown div.textfirst {
    padding: 0;
    color: #333;
}

.textfirst img {
    width: 20px;
    height: 20px;
    display: block;
    margin: 4px 4px;
}

.textfirst {
    font-size: 0px !important;
}

div.mm-dropdown ul li:last-child {
    border-bottom: 0;
}

div.mm-dropdown ul li {
    display: none;
    padding: 4px 0px 5px 8px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 13px;
}

div.mm-dropdown ul li.main {
    display: block;
}

div.mm-dropdown ul li img {
    width: 20px;
    height: 20px;
}

.card-counter:hover {
    box-shadow: 4px 10px 20px #000;
    transition: .3s linear all;
}

.card-counter.primary {
    background-color: #007bff;
    color: #FFF;
}

.card-counter.danger {
    background-color: #ef5350;
    color: #FFF;
}

.card-counter.success {
    background-color: #66bb6a;
    color: #FFF;
}

.card-counter.info {
    background-color: #26c6da;
    color: #FFF;
}

.card-counter i {
    font-size: 5em;
    opacity: 0.2;
}

.card-counter .count-numbers {
    position: absolute;
    right: 35px;
    top: 20px;
    font-size: 32px;
    display: block;
}

.card-counter .count-name {
    position: absolute;
    right: 35px;
    top: 65px;
    font-style: italic;
    text-transform: capitalize;
    opacity: 0.5;
    display: block;
    font-size: 18px;
}

/* Vertial tab */

.tabs-vertical-env .tab-content {
    background: #ffffff;
    display: table-cell;
    padding: 0 0 0 20px;
    vertical-align: top;
}

.tabs-vertical-env .nav.tabs-vertical {
    display: table-cell;
    min-width: 120px;
    vertical-align: top;
    width: 150px;
}

.tabs-vertical-env .nav.tabs-vertical li > a {
    color: #98a6ad;
    white-space: nowrap;
    font-family: 'Roboto', sans-serif;
}

.tabs-vertical-env .nav.tabs-vertical li > a.active {
    background: #02c0ce;
    border: 0;
    color: #ffffff;
}

.tabs-vertical-env-right .tab-content {
    padding: 0 20px 0 0;
}

.tabs-bordered-full {
    border-bottom: 1px solid #404e67 !important;
}

.tabs-bordered-full li a,
.tabs-bordered-full li a:hover,
.tabs-bordered-full li a:focus {
    border: 0 !important;
    padding: 5px 13px !important;
    font-family: 'Roboto', sans-serif;
    font-weight: 600;
    font-size: 14px;
    color: #585858;
}

.tabs-bordered-full li a.active {
    border-bottom: 2px solid #404e67 !important;
    background-color: #e9ecef !important;
    border-radius: 0 !important;
}

.tabs-bordered {
    border-bottom: 2px solid rgba(152, 166, 173, 0.2) !important;
}

.tabs-bordered .nav-item {
    margin-bottom: -2px;
}

.tabs-bordered li a,
.tabs-bordered li a:hover,
.tabs-bordered li a:focus {
    border: 0 !important;
    padding: 5px 8px !important;
    /* font-family: Muli, sans-serif; */
    font-weight: 500;
    font-size: 14px;
    color: #000000;
}

.tabs-bordered li a.active {
    border-bottom: 2px solid #404e67 !important;
}

.tab_inside_btn {
    float: right;
    margin-top: -110px;
    right: 10px;
}

.modal-body.modal_maxheigt .bootstrap-datetimepicker-widget {
    /*  position: relative;
      top: 0px !important;
      right: 50px !important;
      width: 200px;*/
    z-index: 991151 !important;
}

.profile_box {
    margin-bottom: 1px;
    padding: 0 5px;
}

.profileview {
    height: 50px;
    float: left;
}

.bootstrap-datetimepicker-widget {
    top: 0;
    left: 0;
    width: 250px;
    padding: 4px;
    margin-top: 1px;
    z-index: 3000;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

.add {
    position: fixed;
    top: 1em;
    right: 1em;
    z-index: 1000;
    color: #031634;
    font-size: 3em;
}

.group_btn li a {
    padding-left: 15px;
    line-height: 26px;
    color: #636363;
    display: block;
}

.dropdown-menu .divider {
    background-color: #eee;
    height: 1px;
    width: 100%;
    display: block;
}

.group_btn {
    position: absolute;
    transform: none !important;
    right: 0px !important;
    left: auto !important;
    will-change: initial;
    top: 33px !important;
}

.nav-pills > li > a {
    background: #f7f7f9;
    border: none;
    padding: 15px 20px;
    color: #878787;
    margin: 0;
    border-radius: 0;
    text-transform: capitalize;
}

.add span {
    font-size: 0.333em;
}

.modal-xl {
    width: 100%;
    max-width: 1200px;
}

.add-note {
    background-color: #ffedb1;
    position: fixed;
    top: 6em;
    right: 4em;
    z-index: 1000;
    text-align: right;
    padding: 1em;
    border-radius: 5px;
    display: none;
}

.add-note textarea {
    width: 100%;
    resize: none;
    overflow-x: hidden;
}

.add-note input {
    width: 100%;
}

.add-note.hidden {
    display: block;
}

.wrap {
    position: absolute;
    max-height: calc(100vh - 60px);
    top: 0;
    right: 0;
    float: right;
    height: 0;
    width: 100%;
}

pre {
    margin-bottom: 0 !important;
}

.note {
    position: relative;
    z-index: 10;
    float: right;
    width: 20rem;
    height: auto;
    border: 1px solid #26d1dd;
    border-radius: 5px;
    opacity: 1;
    left: 0;
    top: 0;
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    user-select: none;
    box-shadow: 0px 0px 5px 0px rgba(3, 54, 73, 0.75);
}

.note .mainbar {
    width: 100%;
    height: 2em;
    line-height: 2em;
    background: #3eb8f5;
}

.note .mainbar span {
    color: #033649;
    text-align: center;
    display: inline-block;
    margin-left: 0.5em;
    font-size: 1em;
}

.note .minimize,
.note .closesticky {
    font-size: 1.2em;
    color: #033649;
    width: 1em;
    height: 1em;
    float: right;
    margin-right: 0.3em;
}

.note .text {
    color: #031634;
    background: #fff;
    padding: 1em;
    transition: font-size 0.3s ease-in;
    white-space: pre-wrap;
    /* css-3 */
    white-space: -moz-pre-wrap;
    /* Mozilla, since 1999 */
    white-space: -pre-wrap;
    /* Opera 4-6 */
    white-space: -o-pre-wrap;
    /* Opera 7 */
    word-wrap: break-word;
}

.minimized {
    font-size: 0;
    transition: font-size 0.3s ease-out;
}

.closed {
    opacity: 0;
    transition: opacity 0.8s ease-out;
}

/* Navpills */

.nav-pills > li > a {
    color: #313a46;
}

.nav-pills > li.active > a,
.nav-pills > li.active > a:focus,
.nav-pills > li.active > a:hover {
    background: #02c0ce;
}

/* =============
   Progressbars
============= */

.progress {
    -webkit-box-shadow: none;
    background-color: #f3f3f3;
    box-shadow: none;
    margin-bottom: 18px;
    overflow: hidden;
    height: 0.7rem;
}

.progress-bar {
    -webkit-box-shadow: none;
    box-shadow: none;
    font-size: 8px;
    font-weight: 600;
    line-height: 12px;
    background-color: #02c0ce;
}

.progress-bar-primary {
    background-color: #2d7bf4;
}

.progress-bar-success {
    background-color: #0acf97;
}

.progress-bar-info {
    background-color: #4eb7eb;
}

.progress-bar-warning {
    background-color: #f9bc0b;
}

.progress-bar-danger {
    background-color: #f1556c;
}

.progress-bar-dark {
    background-color: #313a46;
}

.progress-bar-purple {
    background-color: #777edd;
}

.progress-bar-pink {
    background-color: #ff679b;
}

/* Progressbar Vertical */

.progress-vertical {
    min-height: 250px;
    height: 250px;
    width: 10px;
    position: relative;
    display: inline-block;
    margin-bottom: 0;
    margin-right: 20px;
}

.progress-vertical .progress-bar {
    width: 100%;
}

.progress-vertical-bottom {
    min-height: 250px;
    height: 250px;
    position: relative;
    width: 10px;
    display: inline-block;
    margin-bottom: 0;
    margin-right: 20px;
}

.progress-vertical-bottom .progress-bar {
    width: 100%;
    position: absolute;
    bottom: 0;
}

.progress-vertical.progress-sm,
.progress-vertical-bottom.progress-sm {
    width: 5px;
}

.progress-vertical.progress-sm .progress-bar,
.progress-vertical-bottom.progress-sm .progress-bar {
    font-size: 8px;
    line-height: 5px;
}

.progress-vertical.progress-md,
.progress-vertical-bottom.progress-md {
    width: 15px;
}

.progress-vertical.progress-md .progress-bar,
.progress-vertical-bottom.progress-md .progress-bar {
    font-size: 10.8px;
    line-height: 14.4px;
}

.progress-vertical.progress-lg,
.progress-vertical-bottom.progress-lg {
    width: 20px;
}

.progress-vertical.progress-lg .progress-bar,
.progress-vertical-bottom.progress-lg .progress-bar {
    font-size: 12px;
    line-height: 20px;
}

/* =========== */

/* Sweet Alert */

/* =========== */

.swal2-modal {
    font-family: 'Roboto', sans-serif;
    -webkit-box-shadow: 0 10px 33px rgba(0, 0, 0, 0.1);
    box-shadow: 0 10px 33px rgba(0, 0, 0, 0.1);
}

.swal2-modal .swal2-title {
    font-size: 28px;
}

.swal2-modal .swal2-content {
    font-size: 16px;
}

.swal2-modal .swal2-spacer {
    margin: 10px 0;
}

.swal2-modal .swal2-file,
.swal2-modal .swal2-input,
.swal2-modal .swal2-textarea {
    border: 2px solid #98a6ad;
    font-size: 16px;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.swal2-modal .swal2-confirm.btn-confirm {
    background-color: #02c0ce !important;
}

.swal2-modal .swal2-cancel.btn-cancel {
    background-color: #f1556c !important;
}

.swal2-modal .swal2-styled:focus {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.swal2-icon.swal2-question {
    color: #02c0ce;
    border-color: #02c0ce;
}

.swal2-icon.swal2-success {
    border-color: #0acf97;
}

.swal2-icon.swal2-success .line,
.swal2-icon.swal2-success[class^=swal2-success-line][class$=long],
.swal2-icon.swal2-success[class^=swal2-success-line] {
    background-color: #0acf97;
}

.swal2-icon.swal2-success .placeholder,
.swal2-icon.swal2-success .swal2-success-ring {
    border-color: #0acf97;
}

.swal2-icon.swal2-warning {
    color: #f9bc0b;
    border-color: #f9bc0b;
}

.swal2-icon.swal2-error {
    border-color: #f1556c;
}

.swal2-icon.swal2-error .line {
    background-color: #f1556c;
}

.swal2-modal .swal2-file:focus,
.swal2-modal .swal2-input:focus,
.swal2-modal .swal2-textarea:focus {
    outline: 0;
    border: 2px solid #02c0ce;
}

.swal2-container.swal2-shown {
    background-color: rgba(49, 58, 70, 0.9);
}

/* =============
   Charts
============= */

/* Flot chart */

#flotTip {
    padding: 8px 12px;
    background-color: #ffffff;
    z-index: 100;
    color: #313a46;
    opacity: 1;
    -webkit-box-shadow: 0 5px 25px 5px rgba(0, 0, 0, 0.14);
    box-shadow: 0 5px 25px 5px rgba(0, 0, 0, 0.14);
    border-radius: 3px;
}

.legend tr {
    height: 30px;
    font-family: 'Roboto', sans-serif;
}

.legendLabel {
    padding-left: 5px !important;
    line-height: 10px;
    padding-right: 20px;
    font-size: 13px;
    font-weight: 500;
    color: rgba(49, 58, 70, 0.6);
    text-transform: uppercase;
}

.legendColorBox div div {
    border-radius: 50%;
}

/* Morris chart */

.morris-hover.morris-default-style {
    border-radius: 3px;
    padding: 10px 12px;
    background: #ffffff;
    border: none;
    -webkit-box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
    box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
    color: #313a46;
}

/* Chartist chart */

.ct-golden-section:before {
    float: none;
}

.ct-chart {
    max-height: 350px;
}

.ct-chart .ct-label {
    fill: #98a6ad;
    color: #98a6ad;
    font-size: 13px;
    line-height: 1;
}

.ct-grid {
    stroke: rgba(49, 58, 70, 0.1);
}

.ct-chart.simple-pie-chart-chartist .ct-label {
    color: #ffffff;
    fill: #ffffff;
    font-size: 16px;
}

.ct-chart .ct-series.ct-series-a .ct-bar,
.ct-chart .ct-series.ct-series-a .ct-line,
.ct-chart .ct-series.ct-series-a .ct-point,
.ct-chart .ct-series.ct-series-a .ct-slice-donut {
    stroke: #02c0ce;
}

.ct-chart .ct-series.ct-series-b .ct-bar,
.ct-chart .ct-series.ct-series-b .ct-line,
.ct-chart .ct-series.ct-series-b .ct-point,
.ct-chart .ct-series.ct-series-b .ct-slice-donut {
    stroke: #e3eaef;
}

.ct-chart .ct-series.ct-series-c .ct-bar,
.ct-chart .ct-series.ct-series-c .ct-line,
.ct-chart .ct-series.ct-series-c .ct-point,
.ct-chart .ct-series.ct-series-c .ct-slice-donut {
    stroke: #2d7bf4;
}

.ct-chart .ct-series.ct-series-d .ct-bar,
.ct-chart .ct-series.ct-series-d .ct-line,
.ct-chart .ct-series.ct-series-d .ct-point,
.ct-chart .ct-series.ct-series-d .ct-slice-donut {
    stroke: #f1556c;
}

.ct-chart .ct-series.ct-series-e .ct-bar,
.ct-chart .ct-series.ct-series-e .ct-line,
.ct-chart .ct-series.ct-series-e .ct-point,
.ct-chart .ct-series.ct-series-e .ct-slice-donut {
    stroke: #4eb7eb;
}

.ct-chart .ct-series.ct-series-f .ct-bar,
.ct-chart .ct-series.ct-series-f .ct-line,
.ct-chart .ct-series.ct-series-f .ct-point,
.ct-chart .ct-series.ct-series-f .ct-slice-donut {
    stroke: #ff679b;
}

.ct-chart .ct-series.ct-series-g .ct-bar,
.ct-chart .ct-series.ct-series-g .ct-line,
.ct-chart .ct-series.ct-series-g .ct-point,
.ct-chart .ct-series.ct-series-g .ct-slice-donut {
    stroke: #f9bc0b;
}

.ct-series-a .ct-area,
.ct-series-a .ct-slice-pie {
    fill: #02c0ce;
}

.ct-series-b .ct-area,
.ct-series-b .ct-slice-pie {
    fill: #e3eaef;
}

.ct-series-c .ct-area,
.ct-series-c .ct-slice-pie {
    fill: #2d7bf4;
}

.ct-series-d .ct-area,
.ct-series-d .ct-slice-pie {
    fill: #f1556c;
}

.chartist-tooltip {
    position: absolute;
    display: inline-block;
    opacity: 0;
    min-width: 10px;
    padding: 2px 10px;
    border-radius: 3px;
    background: #313a46;
    color: #ffffff;
    text-align: center;
    pointer-events: none;
    z-index: 1;
    -webkit-transition: opacity .2s linear;
    transition: opacity .2s linear;
}

.chartist-tooltip.tooltip-show {
    opacity: 1;
}

/* Sparkline chart */

.jqstooltip {
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    width: auto !important;
    height: auto !important;
    background-color: #ffffff !important;
    -webkit-box-shadow: 0 5px 25px 5px rgba(0, 0, 0, 0.14);
    box-shadow: 0 5px 25px 5px rgba(0, 0, 0, 0.14);
    padding: 5px 10px !important;
    border-radius: 3px;
    -moz-border-radius: 3px;
    border-color: #ffffff !important;
}

.jqsfield {
    color: #313a46 !important;
    font-size: 12px !important;
    line-height: 18px !important;
}

/* =============
   Email
============= */

.inbox-leftbar {
    width: 240px;
    float: left;
    padding: 0 2px 20px 0px;
}

.inbox-rightbar {
    margin-left: 250px;
}

.message-list {
    display: block;
    padding-left: 0;
    max-height: calc(100vh - 300px);
    overflow-y: auto;
}

.leave_view_table {
    width: 100%;
    max-width: 500px;
}

.leave_view_table tr td:first-child {
    width: 200px;
    /*text-align: right;*/
    padding-right: 15px;
    padding-bottom: 7px;
    padding-left: 20px;
}

.ltbtmbdr {
    border-bottom: 1px solid #f4f4f4;
}

.bg-white {
    background-color: #fff !important;
    padding: 2px 10px 2px;
}

.media-body {
    overflow: hidden;
}

.media-body p {
    font-size: 14px;
    margin-bottom: 1px;
}

.leave_detail_view .media {
    margin-top: 5px;
}

.message-list li {
    position: relative;
    display: block;
    height: 40px;
    line-height: 40px;
    cursor: default;
    -webkit-transition-duration: .3s;
    transition-duration: .3s;
    border-bottom: 1px solid #f1f1f1;
}

.position_inherit {
    position: inherit !important;
}

.message-list li a {
    color: #797979;
}

.message-list li:hover {
    background: rgba(152, 166, 173, 0.15);
    -webkit-transition-duration: .05s;
    transition-duration: .05s;
}

.message-list li .col-mail {
    float: left;
    position: relative;
}

.message-list li .col-mail-1 {
    width: 320px;
}

.message-list li .col-mail-1 .star-toggle,
.message-list li .col-mail-1 .checkbox-wrapper-mail,
.message-list li .col-mail-1 .dot {
    display: block;
    float: left;
}

.message-list li .col-mail-1 .dot {
    border: 4px solid transparent;
    border-radius: 100px;
    margin: 22px 26px 0;
    height: 0;
    width: 0;
    line-height: 0;
    font-size: 0;
}

.message-list li .col-mail-1 .checkbox-wrapper-mail {
    margin: 10px 10px 0 8px;
}

.message-list li .col-mail-1 .star-toggle {
    margin-top: 18px;
    font-size: 16px;
    margin-left: 5px;
}

b, strong {
    font-family: 'Roboto', sans-serif;
}

.message-list li .col-mail-1 .title {
    position: absolute;
    left: 70px;
    right: 0;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 180px;
}

.leave-inbox .message-list li .col-mail-1 .title {
    left: 45px;
}

.message-list li .col-mail-2 {
    position: absolute;
    top: 0;
    left: 390px;
    right: 0;
    bottom: 0;
}

.message-list li .type_leave {
    position: absolute;
    left: 260px;
    right: 0;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 120px;
}

.message-list li .col-mail-2 .subject,
.message-list li .col-mail-2 .date {
    position: absolute;
    top: 0;
}

.message-list li .col-mail-2 .subject {
    left: 0;
    right: 200px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    color: #0067CE;
    font-size: 13px;
    font-weight: 200;
}

.message-list li .col-mail-2 .date {
    right: 0;
    width: 100px;
    padding-right: 10px;
    text-align: right;
    font-size: 12px;
}

.due_date {
    position: absolute;
    top: 0px;
    right: 105px;
    width: 100px;
    padding-left: 5px;
    text-align: right;
    font-size: 12px;
}

.message-list li.active,
.message-list li.selected {
    background: rgba(152, 166, 173, 0.15);
    -webkit-transition-duration: .05s;
    transition-duration: .05s;
}

.message-list li.active,
.message-list li.active:hover {
    -webkit-box-shadow: inset 3px 0 0 #02c0ce;
    box-shadow: inset 3px 0 0 #02c0ce;
}

.message-list li.unread a.subject {
    font-weight: 700 !important;
    color: #0067CE;
    font-family: 'Roboto', sans-serif;
}

.message-list li.blue-dot .col-mail-1 .dot {
    border-color: #2d7bf4;
}

.message-list li.orange-dot .col-mail-1 .dot {
    border-color: #f9bc0b;
}

.message-list li.green-dot .col-mail-1 .dot {
    border-color: #0acf97;
}

.message-list .checkbox-wrapper-mail {
    cursor: pointer;
    height: 20px;
    width: 20px;
    position: relative;
    display: inline-block;
    -webkit-box-shadow: inset 0 0 0 1px #98a6ad;
    box-shadow: inset 0 0 0 1px #98a6ad;
    border-radius: 1px;
}

.message-list .checkbox-wrapper-mail input {
    opacity: 0;
    cursor: pointer;
}

.message-list .checkbox-wrapper-mail input:checked ~ label {
    opacity: 1;
}

.message-list .checkbox-wrapper-mail label {
    position: absolute;
    top: 3px;
    left: 3px;
    right: 3px;
    bottom: 3px;
    cursor: pointer;
    background: #98a6ad;
    opacity: 0;
    margin-bottom: 0 !important;
    -webkit-transition-duration: .05s;
    transition-duration: .05s;
}

.message-list .checkbox-wrapper-mail label:active {
    background: #87949b;
}

.mail-list a {

    vertical-align: middle;
    color: #797979;
    padding: 5px 15px;
    display: block;
}

.reply-box {
    border: 2px solid #e3eaef;
}

.compose_btn {
    box-shadow: 0 1px 2px 0 rgba(60, 64, 67, 0.302), 0 1px 3px 1px rgba(60, 64, 67, 0.149);
    -webkit-font-smoothing: antialiased;
    font-size: .875rem;
    letter-spacing: .25px;
    -webkit-align-items: center;
    align-items: center;
    background-color: #fff;
    background-image: none;
    -webkit-border-radius: 24px;
    border-radius: 24px;
    color: #3c4043;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font-weight: 500;
    height: 48px;
    min-width: 56px;
    padding: 10px 25px;
    text-transform: none;
    text-align: center;
    margin-top: 10px;
}

.compose_btn:hover {
    box-shadow: 0 1px 5px 3px rgba(60, 64, 67, 0.12), 0 1px 3px 1px rgba(60, 64, 67, 0.12);
    color: #3c4043;
}

.compose_btn i {
    font-size: 24px;
    margin-right: 10px;
    color: #ef4960;
}


@media (max-width: 648px) {
    .inbox-leftbar {
        width: 100%;
    }

    .inbox-rightbar {
        margin-left: 0;
    }
}

@media (max-width: 520px) {
    .message-list li .col-mail-1 {
        width: 150px;
    }

    .message-list li .col-mail-1 .title {
        left: 80px;
    }

    .message-list li .col-mail-2 {
        left: 160px;
    }

    .message-list li .col-mail-2 .date {
        text-align: right;
        padding-right: 10px;
        padding-left: 20px;
    }
}

/* =============
   Form
============= */

label {
    font-size: .815rem;
    color: #313a46;
    font-weight: 500;
    margin-bottom: 0.5rem;
}

.rolebtonbox .btn {
    margin-left: 2px
}

select[multiple] option + option,
select[size] option + option {
    margin-top: 1px;
}

select[multiple] option,
select[size] option {
    padding: 6px 12px;
    border-radius: 2px;
}

select[multiple] {
    height: auto;
}

textarea.form-control {
    /* min-height: 90px; */
}

.form-control {
    border: 1px solid #d0d0d0;
    border-radius: 3px;
    max-width: 100%;
    padding: 6px 6px;
    font-size: 14px;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-transition: all 300ms linear;
    transition: all 300ms linear;
}

.form-control:focus {
    border: 1px solid #a2b9ca;
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: 0;
}

.form-control-lg {
    padding: 12px 16px;
    font-size: 16px;
    border-radius: 4px;
}

.form-control-sm {
    padding: 5px 10px;
    font-size: 12px;
    border-radius: 3px;
}

input[type="color"] {
    min-height: 38px;
}

.input-group-prepend .btn,
.input-group-append .btn {
    min-height: 38px;
}

.form-control-sm,
.input-group-sm > .form-control,
.input-group-sm > .input-group-append > .btn,
.input-group-sm > .input-group-append > .input-group-text,
.input-group-sm > .input-group-prepend > .btn,
.input-group-sm > .input-group-prepend > .input-group-text {
    font-size: 12px;
}

.custom-select:focus {
    -webkit-box-shadow: none;
    box-shadow: none;
}

.custom-control-input {
    display: none;
}

.custom-control-input:checked ~ .custom-control-indicator {
    background-color: #02c0ce;
}

/* .form-check-input:only-child {
    position: absolute;
} */

/* =============
   Form Advanced
============= */

/* Select 2 */

/*******************************************************************/

.float_left_radio {
    float: left;
    margin-right: 12px;
}

.avatar-upload {
    position: relative;
    width: 170px;
    margin: 0px 0 30px;
}

.avatar-upload .avatar-edit {
    position: absolute;
    right: 12px;
    z-index: 1;
    top: 10px;
}

.avatar-upload .avatar-edit input {
    display: none;
}

.avatar-upload .avatar-edit input + label {
    display: inline-block;
    width: 34px;
    height: 34px;
    margin-bottom: 0;
    border-radius: 100%;
    background: #72819c;
    border: 1px solid transparent;
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.12);
    cursor: pointer;
    font-weight: normal;
    transition: all 0.2s ease-in-out;
}

.avatar-upload .avatar-edit input + label:hover {
    background: #f1f1f1;
    border-color: #d6d6d6;
}

.avatar-upload .avatar-edit input + label:after {
    content: "\f040";
    font-family: 'FontAwesome';
    color: #fff;
    position: absolute;
    top: 10px;
    left: 0;
    right: 0;
    text-align: center;
    margin: auto;
}

.avatar-edit:hover input + label:after {
    color: #757575;
}

.avatar-upload .avatar-preview {
    width: 150px;
    height: 150px;
    position: relative;
    border-radius: 100%;
    border: 6px solid #f8f8f8;
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
}

.avatar-upload .avatar-preview > div {
    width: 100%;
    height: 100%;
    border-radius: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.emnumber_abslt {
    right: 20px;
    top: 4px;
    position: absolute;
}

.emnumber_abslt .form-control {
    background-color: #e9ecef;
    width: 180px;
}

.select2-container {
    box-sizing: border-box;
    display: block;
    width: 100% !important;
    margin: 0;
    position: relative;
    vertical-align: middle;
    z-index: 9 !important;
}

.modal-open .select2-container--open {
    z-index: 999999 !important;
}

.modal ~ .select2-container {
    z-index: 99999 !important;
}

.select2-container .select2-selection--single {
    box-sizing: border-box;
    cursor: pointer;
    display: block;
    height: 34px;
    user-select: none;
    -webkit-user-select: none;
}

.resume_button {
    color: #fff !important;
    background: #2b2c42;
    border: none;
    padding: 10px;
    border-radius: 4px;
    border-bottom: 2px solid #39354c;
    transition: all .2s ease;
    outline: none;
    cursor: pointer;
    clear: both;
}

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

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

.modal-open .modal-open2 .topbar {
    width: calc(100% - 80px);
    margin-right: -2px !important;
}

.table_rspnsv a.label-default {
    text-decoration: none;
    cursor: pointer;
    color: #006dcc !important;
    -webkit-text-stroke: .02px #d8dee0;
    text-shadow: #7bf2f9 0 0 0.02px;
    font-weight: 400;
}

.acrdn_panel {
    display: block;
    width: 100%;
}

.sub_hdng_edit {
    font-size: 14px !important;
    width: 100%;
    background-color: #2b2c42;
    border-bottom: 1px solid #ccc;
    margin: 2px 0 6px;
    padding: 9px 7px;
    line-height: 18px;
    color: #fff;
    cursor: pointer;
}

.sub_hdng_edit i {
    margin-right: 10px;
}

.select2-container .select2-selection--single .select2-selection__rendered {
    display: block;
    padding-left: 0px;
    padding-right: 15px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.select2-multi ~ .select2 .clearbtnn {
    display: none
}

.select2-multi ~ .select2 .select2-selection:after {
    content: "\f0dd";
    font-family: fontawesome;
    font-size: 13px;
    position: absolute;
    right: 6px;
    z-index: 99999;
    top: 1px;
    opacity: 1;
    color: #717171;
    height: 100%;
    line-height: 24px;
    height: 1px;
    text-align: center;
    cursor: pointer;
    background-color: #fff;
}

.clearbtnn {
    position: absolute;
    right: 6px;
    z-index: 20;
    top: 4px;
    opacity: 1;
    color: #717171;
    height: 100%;
    width: 13px;
    line-height: 20px;
    height: 20px;
    text-align: center;
    cursor: pointer;
    background-color: #fff;
    font-size: 19px;
}

/*.modal ~ .select2-container .clearbtnn
{
    z-index: 99999;
}*/
.select2-selection__rendered:hover .clearbtnn {
    background-color: #f1f1f1;
}

.select2-link {
    padding: 7px 5px;
    cursor: pointer;
    margin-top: 0px;
    background-color: #fff;
    position: relative;
}

.select2-search--dropdown {
    display: block;
    margin-top: -34px !important;
    padding-left: 0;
}

.select2-dropdown--above .select2-search--dropdown {
    position: absolute;
    bottom: -29px;
    width: 100%;
}

.select2-container .select2-dropdown .select2-search input {
    outline: none;
    border: 1px solid #96b4e4;
    border-bottom: none;
    padding: 3px 6px;
    padding-right: 15px;
    border-radius: 3px 3px 0 0;
}

.select2-container .select2-dropdown .select2-search:after {
    content: "\f002";
    font-family: fontawesome;
    font-size: 13px;
    position: absolute;
    right: 10px;
    top: -28px;
}

.select_remove.clearbtnn:after {
    content: "\f00d"
}

.clearbtnn:after {
    content: "\f0dd";
    font-family: fontawesome;
    font-size: 13px;
}

.select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered {
    padding-right: 8px;
    padding-left: 20px;
}

.select2-container .select2-selection--multiple {
    box-sizing: border-box;
    cursor: pointer;
    display: block;
    min-height: 30px;
    user-select: none;
    -webkit-user-select: none;
}

.select2-container .select2-selection--multiple .select2-selection__rendered {
    display: inline-block;
    overflow: hidden;
    padding-left: 8px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.select2-container .select2-search--inline {
    float: left;
}

.select2-container .select2-search--inline .select2-search__field {
    box-sizing: border-box;
    border: none;
    font-size: 100%;
    margin-top: 5px;
}

.select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button {
    -webkit-appearance: none;
}

.select2-dropdown {
    background-color: white;
    border: 1px solid #aaa !important;
    border-radius: 4px;
    box-sizing: border-box;
    display: block;
    position: absolute;
    left: -100000px;
    width: 100%;
    z-index: 8;
    display: block;
}

.modal ~ .select2-dropdown {
    z-index: 9999;
}

.select_addnewbtnbx .select2-results__options {
    height: 50px !important;
    max-height: 50px !important;
    overflow-y: auto !important;
}

.select_addnewbtn {
    /*position: absolute;*/
    top: 0;
    z-index: 9999999;
    display: block;
}

.select2-results {
    display: block;
}

.select2-results__options {
    list-style: none;
    margin: 0;
    padding: 0;
}

.select2-results__option {
    padding: 7px 6px;
    user-select: none;
    -webkit-user-select: none;
}

.select2-results__option[aria-selected] {
    cursor: pointer;
}

.select2-container--open .select2-dropdown {
    left: 0;
}

.select2-container--open .select2-dropdown--above {
    border-bottom: none;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.select2-container--open .select2-dropdown--below {
    border-top: none;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.select2-search--dropdown {
    display: block;
}

.select2-search--dropdown .select2-search__field {
    width: 100%;
    box-sizing: border-box;
}

.select2-search--dropdown .select2-search__field::-webkit-search-cancel-button {
    -webkit-appearance: none;
}

.select2-search--dropdown.select2-search--hide {
    display: none;
}

.select2-close-mask {
    border: 0;
    margin: 0;
    padding: 0;
    display: block;
    position: fixed;
    left: 0;
    top: 0;
    min-height: 100%;
    min-width: 100%;
    height: auto;
    width: auto;
    opacity: 0;
    z-index: 99;
    background-color: #fff;
    filter: alpha(opacity=0);
}

.select2-hidden-accessible {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.select2-container--default .select2-selection--single {
    background-color: #fff;
    border: 1px solid #d0d0d0;
    border-radius: 4px;
    max-width: 100%;
    padding: 8px 6px;
    font-size: 14px;
}

.input-group > .input-group-append > .input-group-text {
    border-radius: 0px 4px 4px 0px;
}

.input-group > .form-control:not(:last-child) {
    border-radius: 4px 0px 0px 4px !important;
}

.sitemap {
    margin-top: 20px;
}

.sitemap li {
    margin-left: 15px
}

.third .mtfxed {
    margin-left: -25px
}

.sitemap li a {
    color: #000;
    font-size: 15px;
    line-height: 29px
}

.third .mtfxed li a {
    color: #666
}

.third .mtfxed li a:hover {
    color: #000
}

.bold_gnrl {
    font-size: 17px;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
}

.custom-select {
    border-radius: 4px !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #444;
    line-height: 17px;
}

.select2-container--default .select2-selection--single .select2-selection__clear {
    cursor: pointer;
    float: right;
    font-weight: bold;
}

.select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: #999;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 26px;
    position: absolute;
    top: 1px;
    right: 1px;
    width: 20px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: #888 transparent transparent transparent;
    border-style: solid;
    border-width: 5px 4px 0 4px;
    height: 0;
    left: 50%;
    margin-left: -4px;
    margin-top: -2px;
    position: absolute;
    top: 50%;
    width: 0;
}

.select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__clear {
    float: left;
}

.select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__arrow {
    left: 1px;
    right: auto;
}

.select2-container--default.select2-container--disabled .select2-selection--single {
    cursor: default;
}

.select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear {
    display: none;
}

.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
    border-color: transparent transparent #888 transparent;
    border-width: 0 4px 5px 4px;
}

.select2-container--default .select2-selection--multiple {
    background-color: white;
    border: 1px solid #d9e3e9;
    border-radius: 2px !important;
    cursor: text;
}

.select2-container--default .select2-selection--multiple .select2-selection__rendered {
    box-sizing: border-box;
    list-style: none;
    margin: 0;
    padding: 0 5px;
    width: 100%;
}

.select2-container--default .select2-selection--multiple .select2-selection__placeholder {
    color: #999;
    margin-top: 5px;
    float: left;
}

.select2-container--default .select2-selection--multiple .select2-selection__clear {
    cursor: pointer;
    float: right;
    font-weight: bold;
    margin-top: 5px;
    margin-right: 10px;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #e4e4e4;
    border: 1px solid #aaa;
    border-radius: 4px;
    cursor: default;
    float: left;
    margin-right: 5px;
    margin-top: 7px;
    padding: 0 5px;
    font-size: 12px;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    color: #da5454;
    cursor: pointer;
    display: inline-block;
    font-weight: bold;
    margin-right: 2px;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
    color: #333;
}

.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice,
.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__placeholder {
    float: right;
}

.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice {
    margin-left: 5px;
    margin-right: auto;
}

.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove {
    margin-left: 2px;
    margin-right: auto;
}

.select2-container--default.select2-container--focus .select2-selection--multiple {
    /*border: solid black 1px;*/
    outline: 0;
}

.select2-container--default.select2-container--disabled .select2-selection--multiple {
    background-color: #eee;
    cursor: default;
}

.select2-container--default.select2-container--disabled .select2-selection__choice__remove {
    display: none;
}

.select2-container--default.select2-container--open.select2-container--above .select2-selection--single,
.select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.select2-container--default.select2-container--open.select2-container--below .select2-selection--single,
.select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    border: 1px solid #aaa;
}

.select2-container--default .select2-search--inline .select2-search__field {
    background: transparent;
    border: none;
    outline: 0;
}

.select2-container--default .select2-results > .select2-results__options {
    max-height: 200px;
    overflow-y: auto;
}

.select2-container--default .select2-results > .select2-results__options {
    max-height: 200px;
    overflow-y: auto;
}

.select_addnewbtnbx .select2-container--default .select2-results > .select2-results__options {
    max-height: 20px !important;
    overflow-y: auto;
}

.select2-container--default .select2-results__option[role=group] {
    padding: 0;
}

.select2-container--default .select2-results__option[aria-disabled=true] {
    color: #999;
}

.select2-container--default .select2-results__option[aria-selected=true] {
    background-color: #ddd;
}

.select2-container--default .select2-results__option .select2-results__option {
    padding-left: 1em;
}

.select2-container--default .select2-results__option .select2-results__option .select2-results__group {
    padding-left: 0;
}

.select2-container--default .select2-results__option .select2-results__option .select2-results__option {
    margin-left: -1em;
    padding-left: 2em;
}

.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
    margin-left: -2em;
    padding-left: 3em;
}

.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
    margin-left: -3em;
    padding-left: 4em;
}

.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
    margin-left: -4em;
    padding-left: 5em;
}

.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
    margin-left: -5em;
    padding-left: 6em;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #5897fb;
    color: white;
}

.select2-container--default .select2-results__group {
    cursor: default;
    display: block;
    padding: 6px;
}

.select2-container--classic .select2-selection--single {
    background-color: #f6f6f6;
    border: 1px solid #aaa;
    border-radius: 4px;
    outline: 0;
    background-image: -webkit-linear-gradient(top, #ffffff 50%, #eeeeee 100%);
    background-image: -o-linear-gradient(top, #ffffff 50%, #eeeeee 100%);
    background-image: linear-gradient(to bottom, #ffffff 50%, #eeeeee 100%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#eeeeee', GradientType=0);
}

.select2-container--classic .select2-selection--single:focus {
    border: 1px solid #5897fb;
}

.select2-container--classic .select2-selection--single .select2-selection__rendered {
    color: #444;
    line-height: 28px;
}

.select2-container--classic .select2-selection--single .select2-selection__clear {
    cursor: pointer;
    float: right;
    font-weight: bold;
    margin-right: 10px;
}

.select2-container--classic .select2-selection--single .select2-selection__placeholder {
    color: #999;
}

.select2-container--classic .select2-selection--single .select2-selection__arrow {
    background-color: #ddd;
    border: none;
    border-left: 1px solid #aaa;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    height: 26px;
    position: absolute;
    top: 1px;
    right: 1px;
    width: 20px;
    background-image: -webkit-linear-gradient(top, #eeeeee 50%, #cccccc 100%);
    background-image: -o-linear-gradient(top, #eeeeee 50%, #cccccc 100%);
    background-image: linear-gradient(to bottom, #eeeeee 50%, #cccccc 100%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#cccccc', GradientType=0);
}

.select2-container--classic .select2-selection--single .select2-selection__arrow b {
    border-color: #888 transparent transparent transparent;
    border-style: solid;
    border-width: 5px 4px 0 4px;
    height: 0;
    left: 50%;
    margin-left: -4px;
    margin-top: -2px;
    position: absolute;
    top: 50%;
    width: 0;
}

.select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__clear {
    float: left;
}

.select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__arrow {
    border: none;
    border-right: 1px solid #aaa;
    border-radius: 0;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    left: 1px;
    right: auto;
}

.select2-container--classic.select2-container--open .select2-selection--single {
    border: 1px solid #5897fb;
}

.select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow {
    background: transparent;
    border: none;
}

.select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b {
    border-color: transparent transparent #888 transparent;
    border-width: 0 4px 5px 4px;
}

.select2-container--classic.select2-container--open.select2-container--above .select2-selection--single {
    border-top: none;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    background-image: -webkit-linear-gradient(top, #ffffff 0%, #eeeeee 50%);
    background-image: -o-linear-gradient(top, #ffffff 0%, #eeeeee 50%);
    background-image: linear-gradient(to bottom, #ffffff 0%, #eeeeee 50%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#eeeeee', GradientType=0);
}

.select2-container--classic.select2-container--open.select2-container--below .select2-selection--single {
    border-bottom: none;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    background-image: -webkit-linear-gradient(top, #eeeeee 50%, #ffffff 100%);
    background-image: -o-linear-gradient(top, #eeeeee 50%, #ffffff 100%);
    background-image: linear-gradient(to bottom, #eeeeee 50%, #ffffff 100%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#ffffff', GradientType=0);
}

.select2-container--classic .select2-selection--multiple {
    background-color: white;
    border: 1px solid #aaa;
    border-radius: 4px;
    cursor: text;
    outline: 0;
}

.select2-container--classic .select2-selection--multiple:focus {
    border: 1px solid #5897fb;
}

.select2-container--classic .select2-selection--multiple .select2-selection__rendered {
    list-style: none;
    margin: 0;
    padding: 0 5px;
}

.select2-container--classic .select2-selection--multiple .select2-selection__clear {
    display: none;
}

.select2-container--classic .select2-selection--multiple .select2-selection__choice {
    background-color: #e4e4e4;
    border: 1px solid #aaa;
    border-radius: 4px;
    cursor: default;
    float: left;
    margin-right: 5px;
    margin-top: 5px;
    padding: 0 5px;
}

.select2-container--classic .select2-selection--multiple .select2-selection__choice__remove {
    color: #888;
    cursor: pointer;
    display: inline-block;
    font-weight: bold;
    margin-right: 2px;
}

.select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover {
    color: #555;
}

.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice {
    float: right;
}

.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice {
    margin-left: 5px;
    margin-right: auto;
}

.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove {
    margin-left: 2px;
    margin-right: auto;
}

.select2-container--classic.select2-container--open .select2-selection--multiple {
    border: 1px solid #5897fb;
}

.select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple {
    border-top: none;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple {
    border-bottom: none;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.select2-container--classic .select2-search--dropdown .select2-search__field {
    border: 1px solid #aaa;
    outline: 0;
}

.select2-container--classic .select2-search--inline .select2-search__field {
    outline: 0;
}

.select2-container--classic .select2-dropdown {
    background-color: white;
    border: 1px solid transparent;
}

.select2-container--classic .select2-dropdown--above {
    border-bottom: none;
}

.select2-container--classic .select2-dropdown--below {
    border-top: none;
}

.select2-container--classic .select2-results > .select2-results__options {
    max-height: 200px;
    overflow-y: auto;
}

.select2-container--classic .select2-results__option[role=group] {
    padding: 0;
}

.select2-container--classic .select2-results__option[aria-disabled=true] {
    color: grey;
}

.select2-container--classic .select2-results__option--highlighted[aria-selected] {
    background-color: #3875d7;
    color: white;
}

.select2-container--classic .select2-results__group {
    cursor: default;
    display: block;
    padding: 6px;
}

.select2-container--classic.select2-container--open .select2-dropdown {
    border-color: #5897fb;
}

/* AUTOCOMPLETE */

.autocomplete-suggestions {
    border: 1px solid #e3eaef;
    background: #ffffff;
    cursor: default;
    overflow: auto;
    -webkit-box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
    box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
}

.autocomplete-suggestion {
    padding: 5px 8px;
    white-space: nowrap;
    overflow: hidden;
}

.autocomplete-no-suggestion {
    padding: 5px 10px;
    color: #f1556c;
}

.autocomplete-selected {
    background-color: #02c0ce;
    color: #ffffff;
    cursor: pointer;
}

.autocomplete-selected strong {
    color: #ffffff !important;
}

.autocomplete-suggestions strong {
    font-weight: bold;
    color: #313a46;
}

.autocomplete-group {
    padding: 2px 5px;
}

.autocomplete-group strong {
    font-weight: bold;
    font-size: 16px;
    color: #313a46;
    display: block;
}

/* Bootstrap tagsinput */

.bootstrap-tagsinput {
    -webkit-box-shadow: none;
    box-shadow: none;
    padding: 3px 7px 5px;
    width: 100%;
    line-height: 1;
    border: 1px solid #d3dee6;
}

.bootstrap-tagsinput .label-info {
    background-color: #02c0ce;
    display: inline-block;
    padding: 4px 8px;
    font-size: 13px;
    margin: 3px 1px;
    border-radius: 3px;
}

/* Bootstrap select */

.bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
    width: 100% !important;
}

.bootstrap-select .dropdown-toggle:focus {
    outline: none !important;
}

.bootstrap-select .glyphicon {
    padding-right: 6px;
}

.bootstrap-select.show > .dropdown-menu > .dropdown-menu {
    display: block;
}

.bootstrap-select > .dropdown-menu > .dropdown-menu li.hidden {
    display: none;
}

.bootstrap-select > .dropdown-menu > .dropdown-menu li a {
    display: block;
    width: 100%;
    padding: 3px 1.5rem;
    clear: both;
    font-weight: 400;
    color: #313a46;
    text-align: inherit;
    white-space: nowrap;
    background: 0 0;
    border: 0;
}

.bootstrap-select > .dropdown-menu > .dropdown-menu li a:hover {
    background-color: #02c0ce;
    color: #ffffff;
}

.bootstrap-select .check-mark::after {
    content: "\F12C";
    font-family: "Material Design Icons";
}

.bootstrap-select button {
    overflow: hidden;
    text-overflow: ellipsis;
}

.bootstrap-select.btn-group.show-tick .dropdown-menu li.selected a span.check-mark {
    margin-top: 0;
}

.bootstrap-select.btn-group .no-results {
    background-color: #ffffff;
    color: #f1556c;
}

/* X Editable */

.editable-checklist label {
    display: block;
}

.editable-click,
a.editable-click,
a.editable-click:hover {
    color: #02c0ce;
}

/* Bootstrap Fileupload */

.bootstrap-filestyle .group-span-filestyle .btn {
    height: 30px;
    line-height: 17px;
}

/* =============
   Form Validation
============= */

.parsley-errors-list {
    margin: 0;
    padding: 0;
}

.parsley-errors-list > li {
    list-style: none;
    color: #f1556c;
    margin-top: 5px;
    padding-left: 20px;
    position: relative;
}

.parsley-errors-list > li:before {
    content: "\F159";
    font-family: "Material Design Icons";
    position: absolute;
    left: 2px;
    top: -1px;
}

/* =============
   Form Pickers
============= */

/* Time Picker */

.bootstrap-timepicker-widget table td input {
    height: 32px;
    width: 32px;
    color: #ffffff;
    background-color: #72819c;
    border-radius: 50%;
}

.bootstrap-timepicker-widget table td a:hover {
    background-color: transparent;
    border: 1px solid transparent;
    color: #72819c;
}

/* Color Picker */

.colorpicker-selectors i {
    margin-top: 5px;
    margin-left: 5px;
}

/* Datepicker */

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

.datepicker > div {
    display: inherit;
}

.datepicker td,
.datepicker th {
    width: 30px;
    height: 30px;
}

.datepicker table tr td.active:hover,
.datepicker table tr td.active:hover:hover,
.datepicker table tr td.active.disabled:hover,
.datepicker table tr td.active.disabled:hover:hover,
.datepicker table tr td.active:active,
.datepicker table tr td.active:hover:active,
.datepicker table tr td.active.disabled:active,
.datepicker table tr td.active.disabled:hover:active,
.datepicker table tr td.active.active,
.datepicker table tr td.active:hover.active,
.datepicker table tr td.active.disabled.active,
.datepicker table tr td.active.disabled:hover.active,
.datepicker table tr td.active.disabled,
.datepicker table tr td.active:hover.disabled,
.datepicker table tr td.active.disabled.disabled,
.datepicker table tr td.active.disabled:hover.disabled,
.datepicker table tr td.active[disabled],
.datepicker table tr td.active:hover[disabled],
.datepicker table tr td.active.disabled[disabled],
.datepicker table tr td.active.disabled:hover[disabled],
.datepicker table tr td.selected,
.datepicker table tr td.selected:hover,
.datepicker table tr td.selected.disabled,
.datepicker table tr td.selected.disabled:hover {
    background-color: #72819c !important;
    color: #ffffff !important;
    background-image: none !important;
    text-shadow: none !important;
}

.datepicker table tr td.today,
.datepicker table tr td.today:hover,
.datepicker table tr td.today.disabled,
.datepicker table tr td.today.disabled:hover {
    background-color: #72819c !important;
    color: #ffffff !important;
    background-image: none !important;
}

.datepicker-inline {
    border: 2px solid #d3dee6;
    width: 240px;
}

.datepicker .datepicker-switch:hover,
.datepicker .next:hover,
.datepicker .prev:hover,
.datepicker tfoot tr th:hover,
.datepicker table tr td.day.focused,
.datepicker table tr td.day:hover {
    background: #e3eaef;
}

/* Daterange Picker */

.daterangepicker td.active,
.daterangepicker td.active:hover {
    background: #72819c;
}

.daterangepicker .input-mini.active {
    border: 1px solid rgba(49, 58, 70, 0.3);
}

.daterangepicker .ranges li {
    border-radius: 2px;
    color: #313a46;
    font-size: 12px;
    background-color: #e3eaef;
    border-color: #e3eaef;
}

.daterangepicker select.hourselect,
.daterangepicker select.minuteselect,
.daterangepicker select.secondselect,
.daterangepicker select.ampmselect {
    border: 1px solid rgba(49, 58, 70, 0.3);
    padding: 2px;
    width: 60px;
}

.daterangepicker .ranges li.active,
.daterangepicker .ranges li:hover {
    background: #02c0ce;
    border: 1px solid #02c0ce;
    color: #ffffff;
}

.daterangepicker select.monthselect,
.daterangepicker select.yearselect {
    border: none;
}

/* Clock picker */

.clockpicker-canvas line {
    stroke: #b7f9fe;
}

.clockpicker-canvas-bearing,
.clockpicker-canvas-fg,
.clockpicker-canvas-bg {
    fill: #b7f9fe;
}

/* =============
   Form Wizard
============= */

.wizard > .content {
    background: #ffffff;
    min-height: 240px;
    padding: 20px;
    margin-top: 0;
}

.wizard > .content > .body {
    padding: 0;
    position: relative;
}

.wizard > .content > .body ul > li {
    display: block;
    line-height: 30px;
}

.wizard > .content > .body label.error {
    color: #f1556c;
    margin-left: 0;
}

.wizard > .content > .body label {
    display: inline-block;
    margin-top: 10px;
}

.wizard > .content > .body input {
    border-color: #d9e3e9;
}

.wizard > .steps {
    background-color: #f3f6f8;
}

.wizard > .steps .number {
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.3);
    display: inline-block;
    line-height: 30px;
    margin-right: 10px;
    width: 30px;
    text-align: center;
}

.wizard > .steps .disabled a,
.wizard > .steps .disabled a:hover,
.wizard > .steps .disabled a:active {
    background: transparent;
    color: #313a46;
    cursor: default;
    border: none;
}

.wizard > .steps .current a {
    background: #02c0ce;
}

.wizard > .steps .current a:hover,
.wizard > .steps .current a:active {
    background: #02c0ce;
}

.wizard > .steps .current a:hover .number,
.wizard > .steps .current a:active .number {
    color: #ffffff;
}

.wizard > .steps .current a .number {
    color: #ffffff;
}

.wizard > .steps .done a {
    background: #e3eaef;
    color: #313a46;
}

.wizard > .steps .done a:hover,
.wizard > .steps .done a:active {
    background: #e3eaef;
    color: #313a46;
}

.wizard > .steps a,
.wizard > .steps a:hover,
.wizard > .steps a:active {
    border-radius: 2px;
    margin: 0;
}

.wizard > .actions {
    padding: 0 20px;
    margin: 0 !important;
}

.wizard > .actions a,
.wizard > .actions a:hover,
.wizard > .actions a:active {
    background: #02c0ce;
    border-radius: 2px;
    color: #ffffff;
}

.wizard > .actions .disabled a,
.wizard > .actions .disabled a:hover,
.wizard > .actions .disabled a:active {
    background: #f2f2f2;
    color: #313a46;
    cursor: default;
    border: none;
}

/* =============
   Summernote
============= */

.note-editor.note-frame {
    border: 3px solid #edf1f5;
}

.note-popover .popover-content,
.card-header.note-toolbar {
    background-color: #edf1f5;
    padding: 2px 5px 10px 10px;
    border: none;
}

.note-editor.note-frame .note-statusbar {
    background-color: #edf1f5;
}

.note-editor.note-frame .note-editing-area .note-editable {
    padding: 10px 20px;
}

.note-btn-group .btn-light {
    background-color: #383e44 !important;
    color: #ffffff !important;
    border-radius: 4px !important;
    border: none !important;
    margin: 2px;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

/* =============
   Wysiwig
============= */

.mce-panel {
    border: 1px solid #edf1f5 !important;
    background-color: #edf1f5 !important;
}

.mce-menu {
    background-color: #ffffff !important;
    -webkit-box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
    box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
}

.mce-menubar .mce-menubtn:hover,
.mce-menubar .mce-menubtn.mce-active,
.mce-menubar .mce-menubtn:focus {
    border-color: #edf1f5 !important;
}

.mce-menu-item:hover,
.mce-menu-item.mce-selected,
.mce-menu-item:focus,
.mce-menu-item-normal.mce-active,
.mce-primary {
    background-color: #02c0ce !important;
}

.mce-window-head .mce-title {
    font-family: 'Roboto', sans-serif;
}

.mce-window {
    padding: 20px !important;
}

.mce-window-head {
    padding-bottom: 20px !important;
    border-bottom: 0 !important;
}

.mce-grid-border a:hover,
.mce-grid-border a.mce-active {
    border-color: #02c0ce !important;
    background: #02c0ce !important;
}

.mce-btn {
    background-color: #02c0ce !important;
    border: none !important;
    border-radius: 3px;
    color: #ffffff !important;
}

.mce-menubtn button,
.mce-btn button {
    color: #ffffff !important;
}

.mce-menubtn button span,
.mce-menubtn button i,
.mce-btn button span,
.mce-btn button i {
    color: #ffffff !important;
}

.mce-menubar .mce-caret,
.mce-btn .mce-caret {
    border-top-color: #ffffff !important;
}

.mce-flow-layout {
    padding: 5px !important;
}

/* =============
   Form Uploads
============= */

/* Dropzone */

.dropzone {
    min-height: 230px;
    border: 2px dashed rgba(0, 0, 0, 0.3);
    background: white;
    border-radius: 6px;
}

.dropzone .dz-message {
    font-size: 30px;
}

/* =============
   Tables
============= */

.switch {
    position: relative;
    display: inline-block;
    width: 50px;
    height: 22px;
}

.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.switch .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #e2e2e2;
    -webkit-transition: .4s;
    transition: .4s;
    margin: 3px auto 0;
}

.switch .slider:before {
    position: absolute;
    content: "";
    height: 18px;
    width: 18px;
    left: 4px;
    bottom: 1px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

.switch input:checked + .slider {
    background-color: #72819c;
}

.switch input:focus + .slider {
    box-shadow: 0 0 1px #72819c;
}

.switch input:checked + .slider:before {
    -webkit-transform: translateX(24px);
    -ms-transform: translateX(24px);
    transform: translateX(24px);
}

.switch .slider.round {
    border-radius: 50px;
}

.switch .slider.round:before {
    border-radius: 50%;
}


.table_rgs .checkbox label::before {
    margin-left: 0px;
}


.table > tbody > tr > td,
.table > tbody > tr > th,
.table > tfoot > tr > td,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > thead > tr > th {
    padding: .13rem .6rem;
    font-size: 13px;
}
.table th {
    font-weight: bold !important;
    /* background-color: #ffffff; */
    border-bottom-width: 0px !important;
}
.table-sm td,
.table-sm th {
    padding: .4rem !important;
}

.table-condensed > tbody > tr > td,
.table-condensed > tbody > tr > th,
.table-condensed > tfoot > tr > td,
.table-condensed > tfoot > tr > th,
.table-condensed > thead > tr > td,
.table-condensed > thead > tr > th {
    padding: 7px;
}

th {
    font-weight: 500;
}

.table-centered td {
    vertical-align: middle !important;
}

.table-striped tbody tr:nth-of-type(odd),
.table-hover tbody tr:hover,
.table-active,
.table-active > td,
.table-active > th {
    background-color: #f3f6f8;
}

.table-success,
.table-success > td,
.table-success > th {
    background-color: rgba(10, 207, 151, 0.15);
    border-color: rgba(10, 207, 151, 0.2);
}

.table-info,
.table-info > td,
.table-info > th {
    background-color: rgba(78, 183, 235, 0.15);
    border-color: rgba(78, 183, 235, 0.2);
}

.table-warning,
.table-warning > td,
.table-warning > th {
    background-color: rgba(249, 188, 11, 0.1);
    border-color: rgba(249, 188, 11, 0.2);
}

.table-danger,
.table-danger > td,
.table-danger > th {
    background-color: rgba(241, 85, 108, 0.1);
    border-color: rgba(241, 85, 108, 0.2);
}

/* Data table */

div.dt-button-info {
    background-color: #02c0ce;
    border: none;
    color: #ffffff;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 3px;
    text-align: center;
    z-index: 21;
}

div.dt-button-info h2 {
    border-bottom: none;
    background-color: rgba(255, 255, 255, 0.2);
    color: #ffffff;
}
.Select_Multiple_ItemBox
{
    border: 1px solid #d0d0d0;
    border-radius: 3px 0 0 3px;
    max-width: 100%;
    padding: 4px 6px;
    font-size: 14px;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-transition: all 300ms linear;
    transition: all 300ms linear;
    min-height: 36px;
    width: calc(100% - 33px);
}
.select2_custome__rendered
{
    padding: 0;
    margin: 0;
}
.choice__remover
{
    color: red;
    font-size: 21px;
    margin-left: 3px;
    line-height: 20px;
    cursor: pointer;
}
.br_Multiple
{
    border-radius: 0 2px 2px 0;
}
.Multiple_Item_DropBox
{
    background-color: #fff;
    padding: 0px 0;
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.05);
    border-color: #e3eaef;
    position: absolute;
    width: calc(100% - 10px);
    margin-left: 0px;
    overflow-y: auto;
    top: 38px;
    z-index: 999;
}
.Multiple_Item_DropBox2
{

    top: 58px;
}
.appnd_apnedButton
{

    color: #fff;
    padding: 5px 10px;
    color: #fff !important;
    cursor: pointer;
    margin-bottom: 20x;
    font-size: 13px;
}
.appnd_apnedButton
{
    background: #3fa46a;
}
.workItemBox
{
    background-color: #f1f1f1;
    margin-top: 10px;
    padding: 10px;
    max-height: 141px;
    overflow-y: auto;
}
.appnd_apnedButton:hover, .appnd_deleteButton:hover
{
opacity: .9;
}
.groupAppendWorkitm
{
    width: 100%;
}
.groupAppendWorkitm input
{
    width: calc(100% - 30px);
    float: left;
}
.appnd_deleteButton
{
    background: #ab3c28;
    width: 30px;
    float: right;
    padding: 7px 12px;
    text-align: center;
    border-radius: 0 3px 3px 0;
    color: #fff !important;
    cursor: pointer;
}

.Item_Drop_LeftBox
{
    float: left;
    width: 100px;
    background-color: #f1f1f1;
    padding-top: 10px;
}
.Item_Drop_LeftBox .sideways li a
{
   color: #000 !important;
    line-height: 24px;
    padding: 2px 0px 2px 10px;
    display: block;
}
.Item_Drop_LeftBox .sideways li a.active
{
  background-color: #72819c;
    color: #fff !important;
}

input#search-bar {
    border: 1px solid #d0d0d0;
    border-radius: 3px;
    width: 100%;
    padding: 6px 36px 6px 6px;
    font-size: 14px;

}
.Search_Drop_Main
{
    width: 100%;
    float: left;
    display: block;
    border-bottom: 1px solid #e4e4e4;
    margin-bottom: 10px;
}
.Search_Drop
{
    width: 30px;
    float: left;
}
.serchBox
{
    float: left;
    width: calc(100% - 30px);
    margin-bottom: 0;
    height: 47px;
}
input#search-bar:focus::-webkit-input-placeholder {
    transition: opacity 0.45s ease;
    opacity: 0;
}
input#search-bar:focus::-moz-placeholder {
    transition: opacity 0.45s ease;
    opacity: 0;
}
input#search-bar:focus:-ms-placeholder {
    transition: opacity 0.45s ease;
    opacity: 0;
}
.search-icon {
    position: relative;
    float: right;
    width: 25px;
    height: 25px;
    top: -31px;
    right: 2px;
    background-color: #fff;
    border-radius: 3px;
}
.ProjectUserButton
{
    cursor: pointer;
}
.Item_Drop_RightBox
{
    float: left;
    width: calc(100% - 110px);
    padding: 0 0px;
    height: 300px;
    overflow-y: auto;
}
.Item_Drop_RightBox .tab-content {
    padding: 12px 3px 10px 10px;
}
.hideparnt
{
    display: none !important;
}
.Multiple_Item_DropBox .tabs-left {
    border-bottom: none;
}

.Multiple_Item_DropBox .tabs-left>li {
    float: none;
    margin:0px;
    width: 100%;
    display: block;
}
.Item_Checkbox
{
    margin: 0;
    padding: 0;
}
.Item_Checkbox li
{
    list-style: none;
    margin-bottom: 5px;
}
.Item_Checkbox li .checkbox label
{
   font-size: 13px;
}
.select2_custome__rendered li{
    list-style: none;
    font-size: 12px;
    background-color: #f1f1f1;
    border-right: 4px;
    display: inline-block;
    padding: 0px 7px;
    line-height: 20px;
    margin-right: 2px;
    margin-bottom: 2px;
}



table.dataTable th.focus,
table.dataTable td.focus {
    outline: 2px solid #02c0ce !important;
    outline-offset: -1px;
    background-color: rgba(2, 192, 206, 0.15);
}

table.dataTable tbody > tr.selected,
table.dataTable tbody > tr > .selected {
    background-color: #02c0ce;
}

/* Responsive data table */

table.dataTable.dtr-inline.collapsed > tbody > tr > td:first-child:before,
table.dataTable.dtr-inline.collapsed > tbody > tr > th:first-child:before {
    -webkit-box-shadow: 0 0 3px rgba(67, 89, 102, 0.2);
    box-shadow: 0 0 3px rgba(67, 89, 102, 0.2);
    background-color: #0acf97;
}

table.dataTable.dtr-inline.collapsed > tbody > tr.parent > td:first-child:before,
table.dataTable.dtr-inline.collapsed > tbody > tr.parent > th:first-child:before {
    background-color: #f1556c;
}

table.dataTable > tbody > tr.child span.dtr-title {
    font-family: 'Roboto', sans-serif;
}

/* Responsive Table */

.table-rep-plugin .dropdown-menu li.checkbox-row {
    padding: 7px 15px;
}

.table-rep-plugin .table-responsive {
    border: none;
}

.table-rep-plugin tbody th {
    font-size: 14px;
    font-weight: normal;
}

.table-rep-plugin .checkbox-row {
    padding-left: 40px;
}

.table-rep-plugin .checkbox-row label {
    display: inline-block;
    padding-left: 5px;
    position: relative;
    margin-bottom: 0;
}

.table-rep-plugin .checkbox-row label::before {
    -o-transition: 0.3s ease-in-out;
    -webkit-transition: 0.3s ease-in-out;
    background-color: #ffffff;
    border-radius: 3px;
    border: 1px solid #98a6ad;
    content: "";
    display: inline-block;
    height: 17px;
    left: 0;
    margin-left: -20px;
    position: absolute;
    transition: 0.3s ease-in-out;
    width: 17px;
    outline: none;
}

.table-rep-plugin .checkbox-row label::after {
    color: #f3f3f3;
    display: inline-block;
    font-size: 11px;
    height: 16px;
    left: 0;
    margin-left: -20px;
    padding-left: 3px;
    padding-top: 1px;
    position: absolute;
    top: -1px;
    width: 16px;
}

.table-rep-plugin .checkbox-row input[type="checkbox"] {
    cursor: pointer;
    opacity: 0;
    z-index: 1;
    outline: none;
}

.table-rep-plugin .checkbox-row input[type="checkbox"]:disabled + label {
    opacity: 0.65;
}

.table-rep-plugin .checkbox-row input[type="checkbox"]:focus + label::before {
    outline-offset: -2px;
    outline: none;
}

.table-rep-plugin .checkbox-row input[type="checkbox"]:checked + label::after {
    content: "\f00c";
    font-family: 'FontAwesome';
}

.table-rep-plugin .checkbox-row input[type="checkbox"]:disabled + label::before {
    background-color: #e3eaef;
    cursor: not-allowed;
}

.table-rep-plugin .checkbox-row input[type="checkbox"]:checked + label::before {
    background-color: #ffffff;
    border-color: #02c0ce;
}

.table-rep-plugin .checkbox-row input[type="checkbox"]:checked + label::after {
    color: #02c0ce;
}

.table-rep-plugin table.focus-on tbody tr.focused th,
.table-rep-plugin table.focus-on tbody tr.focused td,
.table-rep-plugin .sticky-table-header {
    background: #02c0ce;
    color: #ffffff;
    border-color: #02c0ce;
}

.table-rep-plugin .btn-default {
    background-color: #ffffff;
    border: 1px solid rgba(49, 58, 70, 0.3);
}

.table-rep-plugin .btn-group.pull-right {
    float: right;
}

.table-rep-plugin .btn-group.pull-right .dropdown-menu {
    left: auto;
    right: 0;
}

.table-rep-plugin .btn-default.btn-primary {
    background-color: #02c0ce;
    border-color: #02c0ce;
    -webkit-box-shadow: 0 0 0 2px rgba(2, 192, 206, 0.5);
    box-shadow: 0 0 0 2px rgba(2, 192, 206, 0.5);
}

.table-rep-plugin .btn-toolbar {
    display: block;
}

/* Tablesaw Tables */

.tablesaw thead {
    background: #f3f6f8;
    background-image: none;
    border: none;
}

.tablesaw thead th {
    text-shadow: none;
}

.tablesaw thead tr:first-child th {
    border: none;
    font-weight: 500;
    font-family: 'Roboto', sans-serif;
}

.tablesaw td {
    border-top: 1px solid #f3f6f8 !important;
}

.tablesaw td,
.tablesaw tbody th {
    font-size: inherit;
    line-height: inherit;
    padding: 10px !important;
}

.tablesaw-stack tbody tr,
.tablesaw tbody tr {
    border-bottom: none;
}

.tablesaw-sortable .tablesaw-sortable-head.tablesaw-sortable-ascending button:after,
.tablesaw-sortable .tablesaw-sortable-head.tablesaw-sortable-descending button:after {
    font-family: FontAwesome;
    font-size: 10px;
}

.tablesaw-sortable .tablesaw-sortable-head.tablesaw-sortable-ascending button:after {
    content: "\f176";
}

.tablesaw-sortable .tablesaw-sortable-head.tablesaw-sortable-descending button:after {
    content: "\f175";
}

.tablesaw-bar .btn-select.btn-small:after,
.tablesaw-bar .btn-select.btn-micro:after {
    font-size: 8px;
    padding-right: 10px;
}

.tablesaw-swipe .tablesaw-cell-persist {
    -webkit-box-shadow: none;
    box-shadow: none;
    border-color: #e3eaef;
}

.tablesaw-enhanced .tablesaw-bar .btn {
    text-shadow: none;
    background-image: none;
    text-transform: none;
    border: 1px solid #d3dee6;
}

.tablesaw-enhanced .tablesaw-bar .btn.btn-select:hover {
    background: #ffffff;
}

.tablesaw thead tr:first-child th,
.tablesaw-sortable th.tablesaw-sortable-head button {
    padding-top: 1.2em;
    padding-bottom: 1em;
}

.tablesaw-enhanced .tablesaw-bar .btn:hover,
.tablesaw-enhanced .tablesaw-bar .btn:focus,
.tablesaw-enhanced .tablesaw-bar .btn:active {
    color: #02c0ce !important;
    background-color: #e3eaef;
    outline: none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    background-image: none;
}

.tablesaw-columntoggle-popup .btn-group {
    display: block;
}

/* Footable */

.footable-odd {
    background-color: #ffffff;
}

.footable-detail-show {
    background-color: #e3eaef;
}

.footable-row-detail {
    background-color: #F0F4F7;
}

.footable-pagination li {
    margin-left: 5px;
    display: inline-block;
    float: left;
}

.footable-pagination li a {
    position: relative;
    display: block;
    padding: .5rem .75rem;
    margin-left: -1px;
    line-height: 1.25;
    color: #313a46;
    background-color: #ffffff;
    border: 1px solid #e3eaef;
}

.footable-pagination li.active a {
    color: #ffffff;
}

.footable > thead > tr > th > span.footable-sort-indicator {
    float: right;
}

.footable a {
    color: #02c0ce;
}

/* =============
   Maps
============= */

.gmaps,
.gmaps-panaroma {
    height: 300px;
    background: #e3eaef;
    border-radius: 3px;
}

.gmaps-overlay {
    display: block;
    text-align: center;
    color: #ffffff;
    font-size: 16px;
    line-height: 40px;
    background: #02c0ce;
    border-radius: 4px;
    padding: 10px 20px;
}

.gmaps-overlay_arrow {
    left: 50%;
    margin-left: -16px;
    width: 0;
    height: 0;
    position: absolute;
}

.gmaps-overlay_arrow.above {
    bottom: -15px;
    border-left: 16px solid transparent;
    border-right: 16px solid transparent;
    border-top: 16px solid #02c0ce;
}

.gmaps-overlay_arrow.below {
    top: -15px;
    border-left: 16px solid transparent;
    border-right: 16px solid transparent;
    border-bottom: 16px solid #02c0ce;
}

.gmaps-full {
    z-index: 99;
    margin: 0 -20px -10px -20px;
}

.gmaps-full .gmaps-full1 {
    height: 80vh;
    width: 100%;
}

/* Vector Map */

.jvectormap-zoomin,
.jvectormap-zoomout {
    width: 10px;
    height: 10px;
    line-height: 10px;
}

.jvectormap-zoomout {
    top: 40px;
}

.jvectormap-tip {
    border: none;
    background: #313a46;
    color: white;
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    padding: 5px 8px;
}

/* Mapael Map */

.mapael .map {
    position: relative;
}

.mapael .mapTooltip {
    position: absolute;
    background-color: #02c0ce;
    opacity: 0.95;
    border-radius: 3px;
    padding: 2px 10px;
    z-index: 1000;
    max-width: 200px;
    display: none;
    color: #ffffff;
    font-family: 'Roboto', sans-serif;
}

.mapael .zoomIn,
.mapael .zoomOut,
.mapael .zoomReset {
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    border-radius: 2px;
    font-weight: 500;
    cursor: pointer;
    background-color: #02c0ce;
    text-decoration: none;
    color: #ffffff;
    font-size: 14px;
    position: absolute;
    top: 0;
    left: 10px;
    width: 24px;
    height: 24px;
    line-height: 24px;
}

.map .zoomIn {
    top: 25px;
}

.map .zoomOut {
    top: 50px;
}

/* =============
   Calendar
============= */

.calendar {
    float: left;
    margin-bottom: 0;
}

.fc-view {
    margin-top: 30px;
}

.none-border .modal-footer {
    border-top: none;
}

.fc-toolbar {
    margin-bottom: 5px;
    margin-top: 15px;
}

.fc-toolbar h2 {
    font-size: 20px;
    font-family: 'Roboto', sans-serif;
    line-height: 30px;
    text-transform: uppercase;
}

.fc-day-grid-event .fc-time {
    font-family: 'Roboto', sans-serif;
}

.fc-day {
    background: #ffffff;
}

.fc-toolbar .fc-state-active,
.fc-toolbar .ui-state-active,
.fc-toolbar button:focus,
.fc-toolbar button:hover,
.fc-toolbar .ui-state-hover {
    z-index: 0;
}

.fc th.fc-widget-header {
    background: #e3eaef;
    font-size: 13px;
    line-height: 20px;
    padding: 10px 0;
    text-transform: uppercase;
}

.fc-unthemed th,
.fc-unthemed td,
.fc-unthemed thead,
.fc-unthemed tbody,
.fc-unthemed .fc-divider,
.fc-unthemed .fc-row,
.fc-unthemed .fc-popover {
    border-color: #e3eaef;
}

.fc-button {
    background: #e3eaef;
    border: none;
    color: #797979;
    text-transform: capitalize;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 3px;
    margin: 0 3px;
    padding: 6px 12px;
    height: auto;
}

.fc-text-arrow {
    font-family: inherit;
    font-size: 16px;
}

.fc-state-hover {
    background: #f3f3f3;
}

.fc-state-highlight {
    background: #f0f0f0;
}

.fc-state-down,
.fc-state-active,
.fc-state-disabled {
    background-color: #02c0ce;
    color: #ffffff;
    text-shadow: none;
}

.fc-cell-overlay {
    background: #f0f0f0;
}

.fc-unthemed .fc-today {
    background: #ffffff;
}

.fc-event {
    border-radius: 2px;
    border: none;
    cursor: move;
    font-size: 13px;
    margin: 5px 7px;
    padding: 5px 5px;
    /*text-align: center;*/
}

.external-event {
    cursor: move;
    margin: 10px 0;
    padding: 8px 10px;
    color: #ffffff;
}

.fc-basic-view td.fc-week-number span {
    padding-right: 8px;
    font-family: 'Roboto', sans-serif;
}

.fc-basic-view td.fc-day-number {
    padding-right: 8px;
    font-family: 'Roboto', sans-serif;
}

.fc-basic-view .fc-content {
    color: #ffffff;
}

.fc-time-grid-event .fc-content {
    color: #ffffff;
}

/* ===========
Tickets
============== */

.tickets-list a {
    color: #98a6ad;
    white-space: nowrap;
}

.tickets-list img {
    height: 32px;
    width: 32px;
}

.tickets-list td {
    vertical-align: middle;
}

/* =============
   Task board
============= */

.taskList {
    min-height: 40px;
    margin-bottom: 0;
}

.taskList li {
    background-color: #ffffff;
    border: 1px solid rgba(121, 121, 121, 0.2);
    padding: 10px;
    margin-bottom: 15px;
    border-radius: 3px;
}

.taskList li:last-of-type {
    margin-bottom: 0;
}

.taskList a {
    font-size: 13px;
}

.taskList .checkbox {
    margin-left: 20px;
    margin-top: 5px;
}

.task-placeholder {
    border: 1px dashed rgba(227, 234, 239, 0.9) !important;
    background-color: rgba(227, 234, 239, 0.2) !important;
    padding: 20px;
}

/* Task Detail */

.task-detail .task-dates li {
    width: 50%;
    float: left;
}

.task-detail .task-tags .bootstrap-tagsinput {
    padding: 0px;
    border: none;
}

.task-detail .assign-team a {
    display: inline-block;
    margin: 5px 5px 5px 0px;
}

.task-detail .files-list .file-box {
    display: inline-block;
    vertical-align: middle;
    width: 80px;
    padding: 2px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    background-clip: padding-box;
}

.task-detail .files-list .file-box img {
    line-height: 70px;
}

.task-detail .files-list .file-box p {
    width: 100%;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.add-new-plus {
    height: 32px;
    text-align: center;
    width: 32px;
    display: block;
    line-height: 32px;
    color: #98a6ad;
    font-weight: 700;
    background-color: #e3eaef;
    border-radius: 50%;
}

/* =============
   Projects
============= */

.project-sort-item .form-group {
    margin-right: 30px;
}

.project-sort-item .form-group:last-of-type {
    margin-right: 0;
}

.project-box {
    position: relative;
}

.project-box .badge {
    position: absolute;
    right: 20px;
}

.project-box h4 {
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
    width: 100%;
    overflow: hidden;
}

.project-box ul li {
    padding-right: 30px;
}

.project-box .project-members a {
    margin: 0 0 10px -12px;
    display: inline-block;
    border: 3px solid #ffffff;
    border-radius: 50%;
    -webkit-box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
    box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
}

.project-box .project-members a:first-of-type {
    margin-left: 0;
}

/* ===========
Companies
============== */

.company-card .company-logo {
    float: left;
    height: 60px;
    width: 60px;
    border-radius: 3px;
}

.company-card .company-detail {
    margin: 0 0 50px 75px;
}

/* ===========
File Manager
============== */

.file-man-box {
    padding: 20px;
    border: 1px solid #e3eaef;
    border-radius: 5px;
    position: relative;
    margin-bottom: 20px;
}

.file-man-box .file-close {
    color: #f1556c;
    position: absolute;
    line-height: 24px;
    font-size: 24px;
    right: 10px;
    top: 10px;
    visibility: hidden;
}

.file-man-box .file-img-box {
    line-height: 120px;
    text-align: center;
}

.file-man-box .file-img-box img {
    height: 64px;
}

.file-man-box .file-download {
    font-size: 32px;
    color: #98a6ad;
    position: absolute;
    right: 10px;
}

.file-man-box .file-download:hover {
    color: #313a46;
}

.file-man-box .file-man-title {
    padding-right: 25px;
}

.file-man-box:hover {
    -webkit-box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
    box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
}

.file-man-box:hover .file-close {
    visibility: visible;
}

/* =============
   Timeline
============= */

.timeline {
    border-collapse: collapse;
    border-spacing: 0;
    display: table;
    margin-bottom: 50px;
    position: relative;
    table-layout: fixed;
    width: 100%;
}

.timeline .time-show {
    margin-bottom: 30px;
    margin-right: -75px;
    margin-top: 30px;
    position: relative;
}

.timeline:before {
    background-color: #e3eaef;
    bottom: 0;
    content: "";
    left: 50%;
    position: absolute;
    top: 30px;
    width: 2px;
    z-index: 0;
}

.timeline .timeline-icon {
    -webkit-border-radius: 50%;
    background: #e3eaef;
    border-radius: 50%;
    display: block;
    height: 20px;
    left: -54px;
    margin-top: -10px;
    position: absolute;
    text-align: center;
    top: 50%;
    width: 20px;
}

.timeline .timeline-icon i {
    color: #ffffff;
    font-size: 13px;
    margin-top: 1px;
    position: absolute;
    left: 4px;
}

.timeline .time-icon:before {
    font-size: 16px;
    margin-top: 5px;
}

h3.timeline-title {
    color: #797979;
    font-size: 20px;
    font-weight: 400;
    margin: 0 0 5px;
    text-transform: uppercase;
}

.timeline-item {
    display: table-row;
}

.timeline-item:before {
    content: "";
    display: block;
    width: 50%;
}

.timeline-item .timeline-desk .arrow {
    border-bottom: 12px solid transparent;
    border-right: 12px solid #e9eff3 !important;
    border-top: 12px solid transparent;
    display: block;
    height: 0;
    left: -12px;
    margin-top: -12px;
    position: absolute;
    top: 50%;
    width: 0;
}

.timeline-item .timeline-desk .timeline-box {
    padding: 20px;
}

.timeline-item .timeline-date {
    margin-bottom: 10px;
}

.timeline-item.alt:after {
    content: "";
    display: block;
    width: 50%;
}

.timeline-item.alt .timeline-desk .arrow-alt {
    border-bottom: 12px solid transparent;
    border-left: 12px solid #edf1f5 !important;
    border-top: 12px solid transparent;
    display: block;
    height: 0;
    left: auto;
    margin-top: -12px;
    position: absolute;
    right: -12px;
    top: 50%;
    width: 0;
}

.timeline-item.alt .timeline-desk .album {
    float: right;
    margin-top: 20px;
}

.timeline-item.alt .timeline-desk .album a {
    float: right;
    margin-left: 5px;
}

.timeline-item.alt .timeline-icon {
    left: auto;
    right: -56px;
}

.timeline-item.alt:before {
    display: none;
}

.timeline-item.alt .panel {
    margin-left: 0;
    margin-right: 45px;
}

.timeline-item.alt h4,
.timeline-item.alt p,
.timeline-item.alt .timeline-date {
    text-align: right;
}

.timeline-desk {
    display: table-cell;
    vertical-align: top;
    width: 50%;
}

.timeline-desk h4 {
    font-size: 16px;
    font-weight: normal;
    margin: 0;
}

.timeline-desk .panel {
    background: #edf1f5;
    display: block;
    margin-bottom: 5px;
    margin-left: 45px;
    position: relative;
    text-align: left;
    border: 0;
}

.timeline-desk h5 span {
    color: #797979;
    display: block;
    font-size: 12px;
    margin-bottom: 4px;
}

.timeline-desk p {
    font-size: 14px;
    margin-bottom: 0;
}

.timeline-desk .album {
    margin-top: 12px;
}

.timeline-desk .album a {
    float: left;
    margin-right: 5px;
}

.timeline-desk .album img {
    height: 36px;
    width: auto;
    border-radius: 3px;
}

.timeline-desk .notification {
    background: none repeat scroll 0 0 #ffffff;
    margin-top: 20px;
    padding: 8px;
}

/* =============
   Profile
============= */

.profile-user-box {
    position: relative;
    border-radius: 5px;
}

/* =============
   Print css
============= */

@media print {
    .page-title-box,
    .topbar-left,
    .hidden-print,
    .breadcrumb,
    .page-title,
    .footer,
    .topbar {
        display: none;
        margin: 0;
        padding: 0;
    }

    .left,
    .right-bar {
        display: none;
    }

    .content {
        margin-top: 0;
        padding-top: 0;
    }

    .content-page {
        margin-left: 0;
        margin-top: 0;
    }

    .card-box,
    body {
        border: none;
        padding: 0;
        margin-bottom: 0;
    }
}

/* =============
   FAQ
============= */

.question-q-box {
    height: 30px;
    width: 30px;
    color: #ffffff;
    background-color: #02c0ce;
    text-align: center;
    border-radius: 50%;
    float: left;
    line-height: 30px;
}

.question {
    margin-top: 0;
    margin-left: 50px;
    font-weight: 400;
    font-size: 16px;
}

.answer {
    margin-left: 50px;
    color: #98a6ad;
    margin-bottom: 40px;
}

/* =============
   Pricing
============= */

.pricing-plan {
    padding-bottom: 50px;
}

.price_card {
    background: #ffffff;
    border-radius: 5px;
    margin-top: 30px;
    margin-bottom: 30px;
    padding-bottom: 20px;
    position: relative;
}

.price_card .name {
    display: block;
    font-size: 16px;
    padding: 0 0 30px;
    text-align: center;
    width: 100%;
}

.price_card button {
    margin-top: 20px;
}

.pricing-header {
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    color: #ffffff;
}

.price {
    display: block;
    font-size: 48px;
    font-weight: 300;
    padding: 30px 0 10px;
    text-align: center;
    width: 100%;
}

.price-features {
    color: #98a6ad;
    list-style: none;
    margin: 0;
    padding-left: 0;
    padding-top: 20px;
    text-align: center;
}

.price-features li {
    padding: 15px;
}

.pricing-item {
    margin: 0 0 30px;
    position: relative;
    text-align: center;
}

.pricing-wrap {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    overflow: hidden;
    padding: 30px 20px;
    position: relative;
    text-align: center;
}

.pricing-icon {
    font-size: 32px;
    padding-bottom: 5px;
    padding-top: 10px;
    position: relative;
    z-index: 1;
}

.pricing-title {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 40px;
    position: relative;
    text-transform: uppercase;
    z-index: 1;
}

.pr-list {
    color: #98a6ad;
    font-size: 12px;
    font-weight: 400;
    margin: 0 -20px 30px;
    padding: 0;
    text-transform: uppercase;
}

.pr-list li {
    list-style: none;
    padding: 12px 20px;
}

.pricing-num {
    font-size: 40px;
    font-weight: 700;
    line-height: 1;
}

.pricing-num sup {
    font-size: 18px;
    font-weight: 400;
    left: -3px;
    margin-left: -7px;
    position: relative;
    top: -20px;
}

.pr-per {
    color: #98a6ad;
    font-size: 12px;
}

.pr-button {
    margin-top: 30px;
}

/* ==============
  Account Pages
===================*/
.pad5each {
    padding-right: 5px;
    padding-left: 5px;
}

.modal_maxheigt {
    max-height: calc(100vh - 160px);
    overflow-y: auto;
}

.visblediv {
    overflow: visible !important;
}

.account-form {
    float: left;
    width: 100%
}

.account-form > form div.feild > input[type=text],
.account-form > form div.feild > input[type=password] {
    border: 1px solid #e6eaea;
    border-radius: 4px;
    float: left;
    font-size: 13px;
    letter-spacing: .5px;
    margin-bottom: 10px;
    padding: 13px 15px;
    width: 100%
}

.groupinput {
    position: relative;
    margin-bottom: 20px
}

.barload,
.erormsg,
.load-bar,
label.inputText {
    position: absolute
}

.is-invalid {
    border: 2px solid #d93025 !important
}

input.input:focus,
select.slect:focus {
    outline: 0;
}

label.openselect2 {
    z-index: 9 !important
}

.modal label.openselect2 {
    z-index: 99999 !important
}

/*.select2_label {
    top: 0px !important;
    !*background: none !important;*!
}*/


/*select:focus ~ label.inputText {

font-weight: 600;
}*/


/*
label.inputText.input-has-value {
    width: auto !important;
    top: -12px !important;
    font-size: 12px !important;
}
*/

label.inputText {
    color: #545454;
    font-weight: 400;
    pointer-events: none;
    top: -18px;
    /*left: 7px;*/
    font-size: 12px;
    float: left;
    transition: .2s ease all;
    -moz-transition: .2s ease all;
    -webkit-transition: .2s ease all;
    padding: 0px 1px;
    z-index: 9;
}

label.inputText_addon {
    left: 0px !important;
}

.required_item input.input:focus ~ label.inputText,
.required_item label.inputText::first-letter,
.required_item textarea.input_textaerea:focus ~ label.inputText {
    color: #d93025;
}

.required_item input.input:focus,
.required_item textarea.input_textaerea:focus {
    border-color: #d93025;
}

.account-box label.inputText {
    left: 10px;
    top: 8px;
    background-color: #fff;
    padding: 5px 10px
}

/*input.input:focus ~ label.inputText {
    top: -14px;
    left: 14px;
    color: #404e67;
    float: left;
    font-size: 13px;
}*/

/*
.input-has-value {
    left: 14px !important;
    top: -11px !important;
    font-size: 12px !important;
}
*/

/*.labl_insd {
    margin-left: -5px;
    margin-right: -5px;
}

.open {
    top: -16px !important;
    background: none;
}*/



.bmd-form-group {
    margin-bottom: 24px !important;
}

/*label.inputText {*/
/*width: calc(100% - 44px);*/
/*float: none;*/
/*background-color: #fff;*/
/*}*/
.account-box input.input:focus ~ label.inputText {
    top: -12px;
}

.erormsg {
    color: #d93025;
    bottom: -19px;
    font-size: 13px
}

.account-formaccount-form > form .feild > input[type=submit] {
    background: #5b78de;
    border: none;
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    -ms-border-radius: 25px;
    -o-border-radius: 25px;
    border-radius: 25px;
    color: #fff;
    float: left;
    font-size: 12px;
    margin-bottom: 5px;
    padding: 14px 30px
}

.accountbg {
    position: absolute;
    background-size: cover;
    height: 100%;
    width: 100%;
    top: 0;
}

.account-page-full {
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    position: absolute;
    height: 100%;
    width: 540px;
    height: 500px;
}

.account-page-full .card {
    border: none;
}

.account-copyright {
    position: absolute;
    bottom: 0;
    width: 100%;
}

.checkmark {
    width: 100px;
    margin: 0 auto;
    padding: 20px 0;
}

.path {
    stroke-dasharray: 1000;
    stroke-dashoffset: 0;
    animation: dash 2s ease-in-out;
    -webkit-animation: dash 2s ease-in-out;
}

.spin {
    animation: spin 2s;
    -webkit-animation: spin 2s;
    transform-origin: 50% 50%;
    -webkit-transform-origin: 50% 50%;
}

@-webkit-keyframes dash {
    0% {
        stroke-dashoffset: 1000;
    }
    100% {
        stroke-dashoffset: 0;
    }
}

@keyframes dash {
    0% {
        stroke-dashoffset: 1000;
    }
    100% {
        stroke-dashoffset: 0;
    }
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
    }
}

@-webkit-keyframes text {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes text {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

.text-error {
    color: #02c0ce;
    text-shadow: rgba(2, 192, 206, 0.3) 5px 1px, rgba(2, 192, 206, 0.2) 10px 3px;
    font-size: 84px;
    line-height: 90px;
}

@media (max-width: 768px) {
    .account-pages.enlarged {
        min-height: 100%;
    }

    .account-pages .account-page-full {
        width: 100%;
    }

    .side-menu {
        margin-top: 0px
    }

}

.svg-computer {
    stroke-dasharray: 1134;
    stroke-dashoffset: -1134;
    -webkit-animation: draw-me 5s infinite;
    animation: draw-me 5s infinite;
    -webkit-animation-direction: normal;
    animation-direction: normal;
    height: 200px;
}

@-webkit-keyframes draw-me {
    from {
        stroke-dashoffset: -1134;
    }
    to {
        stroke-dashoffset: 0;
    }
}

@keyframes draw-me {
    from {
        stroke-dashoffset: -1134;
    }
    to {
        stroke-dashoffset: 0;
    }
}

/* =============
   Search result
============= */

.search-result-box .tab-content {
    padding: 30px 30px 10px 30px;
    -webkit-box-shadow: none;
    box-shadow: none;
    -moz-box-shadow: none;
}

.search-result-box .search-item {
    padding-bottom: 20px;
    border-bottom: 1px solid #e3eaef;
    margin-bottom: 20px;
}

/* =============
   Gallery
============= */

.port {
    margin-bottom: 30px;
}

.portfolioFilter a {
    -webkit-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
    color: #313a46;
    border-radius: 3px;
    padding: 5px 10px;
    display: inline-block;
    margin-bottom: 5px;
    font-family: 'Roboto', sans-serif;
}

.portfolioFilter a:hover {
    background-color: #02c0ce;
    color: #ffffff;
}

.portfolioFilter a.current {
    background-color: #02c0ce;
    color: #ffffff;
    -webkit-box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
    box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
}

.portfolio-masonry-box {
    overflow: hidden;
    position: relative;
    padding: 0;
    margin-top: 30px;
}

.portfolio-masonry-box .portfolio-masonry-img {
    position: relative;
    overflow: hidden;
    border-radius: 5px;
}

.portfolio-masonry-box .portfolio-masonry-img:after {
    content: " ";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(49, 58, 70, 0);
    -webkit-transition: all 0.27s cubic-bezier(0.3, 0.1, 0.58, 1);
    transition: all 0.27s cubic-bezier(0.3, 0.1, 0.58, 1);
}

.portfolio-masonry-box .portfolio-masonry-img > img {
    -webkit-transition: all 0.3s cubic-bezier(0.3, 0.1, 0.58, 1);
    transition: all 0.3s cubic-bezier(0.3, 0.1, 0.58, 1);
    border-radius: 0;
}

.portfolio-masonry-box .portfolio-masonry-detail {
    opacity: 0;
    width: 100%;
    padding: 20px 20px 0 20px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: absolute;
    left: 0;
    text-align: center;
    overflow: hidden;
    -webkit-transition: all 0.27s cubic-bezier(0.3, 0.1, 0.58, 1);
    transition: all 0.27s cubic-bezier(0.3, 0.1, 0.58, 1);
}

.portfolio-masonry-box .portfolio-masonry-detail h4 {
    margin-bottom: 3px;
    color: #ffffff !important;
}

.portfolio-masonry-box .portfolio-masonry-detail p {
    color: #ffffff !important;
    text-transform: uppercase;
    font-size: 12px;
}

.portfolio-masonry-box:hover .portfolio-masonry-detail {
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
    z-index: 3;
    opacity: 1;
}

.portfolio-masonry-box:hover .portfolio-masonry-img:after {
    background: rgba(49, 58, 70, 0.8);
}

.portfolio-masonry-box:hover .portfolio-masonry-img > img {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
}

/* =============
   Count Down - Coming Soon
============= */

.svg-rocket {
    height: 80px;
}

.rocket-clouds__bubble,
.rocket-clouds__cloud,
.rocket-rocket,
.rocket-inner__rocket-and-lines {
    fill: #02c0ce;
}

#count-down {
    margin-top: 30px;
}

#count-down .clock-presenter {
    height: 100px;
    line-height: 30px;
    text-align: center;
}

#count-down .clock-presenter .digit {
    margin-top: 20px;
    font-size: 26px;
    line-height: 42px;
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    height: 42px;
    display: inline-block;
    overflow: hidden;
    text-align: center;
    position: relative;
    cursor: default;
    color: #313a46;
}

#count-down .clock-presenter .note {
    position: relative;
    bottom: 0;
    padding-top: 5px;
    cursor: default;
    font-size: 13px;
    color: #313a46;
    text-transform: uppercase;
}

@media (max-width: 767px) {
    #count-down .clock-presenter {
        width: 50%;
        float: left;
    }

    #count-down .hours_dash {
        border-right: none;
    }

    .table_rspnsv {
        width: 100%;
        padding-right: 0px;
        margin-left: 0px;
        margin-right: 0;
    }

    .tab_inside_btn {
        margin-top: -106px;
    }
}

/* =============
   Responsive
============= */

@media (max-width: 768px) {

    .topbar {

        left: 80px;
    }

    .dataTables_wrapper .col-xs-6 {
        width: 100%;
        text-align: left;
    }

    div#datatable-buttons_info {
        float: none;
    }

    .ms-container {
        width: 100%;
    }

    .m-t-sm-50 {
        margin-top: 50px !important;
    }
}

.bmd-date-group {
    padding-bottom: 10px;
}

.addroletable {
    width: 980px;
    table-layout: fixed;
    display: block;
}

.tbl_addroletable_crollbox {
    width: 100%;
    overflow: auto;
    table-layout: fixed;
}

.tbl_addroletable_crollbox .scrolbaletable {
    max-height: 185px;
    overflow-y: auto;
    overflow-x: hidden;
    display: block;
    width: 980px;
    border: 1px solid #efefef;
}

.scrolbaletable .form-control,
.scrolbaletable .select2-container--default .select2-selection--single,
.scrolbaletable .select2-container .select2-dropdown .select2-search input,
.scrolbaletable select2-container .select2-dropdown .select2-search input {
    padding: 1px 6px !important;
}

.scrolbaletable .select2-container .select2-selection--single {
    height: 24px;
}

.scrolbaletable .clearbtnn {
    top: 1px;
}

.scrolbaletable .input-group-text {
    line-height: 0.5;
}

.bgcolr1 {
    background-color: #e9ecef;
}

@media (max-width: 767px) {

    .card-box-dashbord {
        margin: 10px .3%;
        border-radius: 3px;
        background-color: #ffffff;
        width: 48.9%;
        float: left;
    }

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

    .dataTables_length {
        float: none;
        margin-bottom: 10px;
    }

    .colp_r_15 {
        padding-right: 5px;
    }

    .colp_l_15 {
        padding-left: 5px;
        margin-top: 0px;
    }

    .bmd-date-group {
        padding-bottom: 0px;
    }

    .user_daterangpickrbox .p-t-15 {
        padding-top: 0px !important;
    }

    .m-t-10-imprtnt {
        margin-top: 25px !important;
    }

    .emnumber_abslt {
        right: 8px;
        top: -150px;
        position: absolute;
    }

    .preview_image_box {
        width: 125px;
        height: 125px;
        position: relative;
        border-radius: 100%;
        border: 6px solid #f8f8f8;
        box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
        background-size: contain !important;
        clear: both;
        margin-bottom: 10px;
    }

    .intl-tel-input {
        position: relative;
        display: block !important;
    }

    .input-daterange .input-group {
        margin-top: 23px;
    }
}

@media (max-width: 420px) {
    .hide-phone {
        display: none !important;
    }

    .emnumber_abslt {
        right: auto;
        left: 1px;
        top: -33px;
        position: relative;
    }
}

@media (max-width: 419px) {
    .hidden-xxs {
        display: none;
    }
}

@media (max-width: 550px) {
    .card-box-dashbord {
        margin: 10px 0%;
        border-radius: 3px;
        background-color: #ffffff;
        width: 100%;
        float: left;
    }

}

@media (max-width: 620px) {
    .modal-dialog {
        margin: 0 !important;
    }
}

.Apprsl_Filtr_Box {
    width: 72px;
    float: right
}

.Apprsl_Filtr_Box ul {
    margin: 0;
    padding: 0;
}

.box_headerApprsal h4 {
    line-height: 40px
}

.Apprsl_Filtr_Box ul li {
    list-style: none;
    float: right;
    padding: 0px;
    position: relative;
    z-index: 11;
    border: 1px solid #fff;
    border-top: 0 !important;
    border-bottom: 0 !important;
}

.Apprsl_Filtr_Box ul li div i, .ExportDrop a i {
    padding: 17px 10px;
}

.Apprsl_Filtr_Box .dropdown-toggle::after {
    display: none !important
}

.dropdown.ExportDrop,
.dropdown.FilterDrop {
    cursor: pointer;
    color: #828282
}

.FilterDropActive {
    color: #000 !important;
    border: 1px solid #dadada !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
    background-color: #fff
}

.FilterDropBox {
    border: 1px solid #dadada;
    position: absolute;
    width: 330px;
    right: 5px;
    top: 47px;
    background-color: #fff;
    padding: 0 15px 20px;
    height: calc(100% - 108px);
    /*height: 100%;*/
    overflow: auto;
    z-index: 10;
}
.clndr_Box
{
    padding-bottom: 40px;
}
.sticky
{
    position: -webkit-sticky;
    position: sticky;
    top: 48px;
    z-index: 15;
    float: right;
    height: calc(100vh - 48px);
    overflow-y: auto;
}
.box_headerApprsalIcon {
    height: 32px;
    width: 32px;
    background-color: #72819c;
    line-height: 31px;
    text-align: center;
    float: left;
    margin-right: 3px;
    margin-top: 9px;
    margin-bottom: 7px;
    color: #fff;
    font-size: 23px;
    border-radius: 16px;
}
.statusNot, .statusYes
{
    width: 14px;
    height: 14px;
    border-radius: 50%;
    text-align: center;
    vertical-align: middle;
    margin-top: 5px;
    line-height: 14px;
    font-size: 12px;
    margin-left: 13%;
}
.statusNot
{
    background-color: #ccc;
}
.statusYes
{
    background-color: #27cda5;
}
.statusYes:after{
    content:"\f00c";
    color: #fff;
    font-family: FontAwesome;
    font-size: 10px;
}
.jobiconbox
{
    font-size: 18px;
    color: #666;
    position: relative;
    cursor: pointer;
    margin-left: 13%;
}
.JobCount
{
    background-color: #03a9f4;
    border-radius: 50%;
    height: 15px;
    width: 15px;
    position: absolute;
    text-align: center;
    line-height: 15px;
    font-size: 9px;
    color: #fff;
    left: 9px;
    top: -5px;
}
.jobaddbox
{
    background-color: #f1f1f1;
    padding: 4px 5px;
    min-width: 150px;
}
.ProjectCheckBoxtd
{
    width: 33px;
}
.ProjectCheckBox .checkbox label::before {

    margin-left: -9px;
    margin-top: -10px;

}
.ProjectCheckBox .checkbox input[type="checkbox"]:checked + label::after, .ProjectCheckBox .checkbox input[type="checkbox"]:checked ~ label::after {
    margin-top: -10px;
    margin-left: -11px;
}
.tableScroll
{
    width: 100%;
    overflow-x: auto;
    min-height: calc(100vh - 133px);
    padding-bottom: 81px;
}
.tableScroll table
{
    min-width: 979px;
}

table.dataTable.tableprject  thead .sorting:after, table.dataTable.tableprject  thead .sorting_asc:after, table.dataTable.tableprject  thead .sorting_desc:after, table.dataTable.tableprject  thead .sorting_asc_disabled:after, table.dataTable.tableprject  thead .sorting_desc_disabled:after,
table.dataTable.tableprject thead .sorting:before, table.dataTable.tableprject thead .sorting_asc:before, table.dataTable.tableprject thead .sorting_desc:before, table.dataTable.tableprject thead .sorting_asc_disabled:before, table.dataTable.tableprject thead .sorting_desc_disabled:before
{
    display: none !important
}
.jobaddbox:hover
{
    background-color: #fff;
    padding: 4px 5px;
}
.jobaddboxClose
{
    color: red;
    float: right;
    width: 17px;
    margin-right: -5px;
    text-align: center;
    cursor: pointer;
}
.jobaddboxClose:hover, .AddJobButton:hover
{
    opacity: .8;
}
.AddJobButton
{
    cursor: pointer;
    color: #03a9f4 !important;
}
.clname .select2-selection--single {
    border: 1px solid #fff !important;
}

.clname .select2-container--default .select2-selection--single:focus, .clname .select2-container--default .select2-selection--single:hover {
    border: 1px solid #d0d0d0 !important;
}

.box_headerApprsal .clname {
    margin-top: 8px;
}

.logTimebtn {
    cursor: pointer;
    padding: 7px 12px;
    color: #ffffff !important;
    background-color: #27cda5;
    border-color: #27cda5;
    margin-top: 8px;
    margin-right: 3px;
    text-transform: uppercase;
    font-size: 13px;
}

.btn-Searchh {
    padding: 4px 8px !important;
    background-color: #72819c !important;
    color: #fff
}

.linkColor {
    text-decoration: none;
    cursor: pointer;
    color: #006dcc !important;
    -webkit-text-stroke: .02px #d8dee0;
    text-shadow: #7bf2f9 0 0 .02px;
    font-weight: 400;
    padding: 4px 8px !important
}

.btn-Searchh:hover,
.linkColor:hover {
    opacity: .8
}

.bmd_Filter {
    margin-bottom: 10px
}

.FilterDropTitle {
    font-weight: 600;
    font-size: 17px
}

.FilterCloseButton {
    line-height: 51px;
    cursor: pointer;
    font-size: 19px;
    color: red;
}

.FilterCloseButton:hover {
    opacity: .8
}

.box_headerApprsal {
    width: 100%;
    background-color: #fff;
    padding: 0px 10px 0px 10px;
    border-radius: 3px 3px 0 0;
    margin-bottom: 1px
}

.dropdown.ExportDrop .dropdown-menu {
    position: absolute;
    will-change: transform;
    top: 0;
    left: 0;
    transform: translate3d(-112px, 46px, 0) !important;
    font-size: 13px
}

.SubDate {
    font-size: 11px;
    color: #a2a2a2;
    margin: auto;
    width: 185px;
}

.slidepanels {
    position: relative;
}

.slidepanels > div {
    display: inline-block;
    text-align: center;
    position: absolute;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    top: 5px;
}

.nowDate {
    color: #0a0909;
    width: 160px;
    text-align: center;
    transition: left 0.5s ease, opacity 0.5s ease;
    z-index: 11;
    background-color: rgba(0, 0, 0, 0);
    left: 20px;
    font-size: 12px;
}

.panelbutton {
    width: 20px;
    color: #ccc;
    z-index: 10;
    cursor: pointer;
}

.panelbutton:hover {
    color: #666;
}

.prevprev {
    left: -60px;
    opacity: 0
}

.prev {
    left: 0px;
    opacity: 0.4
}

#prev-button {
    left: 0px;
}

#next-button {
    left: 175px;
}

.next {
    left: 140px;
    opacity: 0.4
}

.nextnext {
    left: 180px;
    opacity: 0
}

.ProjectDisplayManBox {
    border: 1px solid #dcdcdc;
    padding: 4px 0 3px;
    border-radius: 4px;
    margin: 10px 0;
}

.ProjectDisplayManBox .select2-container--default .select2-selection--single, .ProjectDisplayManBox input, .billselect {
    border-color: #fff !important;
}


.ProjectDisplayManBox input:focus, .ProjectDisplayManBox input:hover, .ProjectDisplayManBox .select2-container--default .select2-selection--single:hover, .billselect:hover, .billselect:focus {
    border: 1px solid #d0d0d0 !important;
}

.selectProject + .select2 .select2-selection__placeholder,
.selectJob + .select2 .select2-selection__placeholder {
    color: #000;
}

.clname .select2-container {
    max-width: 260px;
}

.prjecNameType::placeholder {
    color: #b7b7b7;
}

.select2-dropdown {
    box-shadow: 0 5px 10px rgba(0, 0, 0, .1) !important;
    border: none !important;
}

.addmore + .select2 .select2-results__option:first-child {
    height: 0;
    padding: 0px 0px !important;
}

.addmore + .select2-container .select2-dropdown .select2-search input {
    padding: 5px 7px !important;
}

.select2-container--default .select2-results > .select2-results__options::-webkit-scrollbar {
    width: 3px;
    background-color: #39354c !important;
}

.select2-link a {
    color: #03a9f4 !important;
    padding: 5px;
    font-size: 13px;
}

.select2-link a:hover {
    opacity: .8;
}

.select2-link img {
    margin-right: 6px;
}

.modalpaddproject .modal-header {
    background-color: #fff;
    padding: 11px 10px;
    border-bottom: 1px solid #eaeaea;
    box-shadow: none;
}

.modalpaddproject .modal-title {
    color: #000;
}

.modalpaddproject.modal .modal-dialog .close {
    float: right;
    font-size: 34px;
    font-weight: 200;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    opacity: .5;
}

.modalpaddproject.modal .modal-dialog .close:hover {
    opacity: 1;
}

.modalpaddproject input[type="color"] {
    min-height: 29px;
    width: 31px;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 3px;
}

/******************** slick css start*****************************/

.sidebar_sub_division a:hover {
    background-color: #222222;
}

.slider {
    width: 180px;
    margin: 6px auto 0;
    text-align: center;
    padding: 0px;
    color: #000;
}

.slider p {
    font-size: 13px;
    line-height: 20px;
    margin: 10px 0;
    font-weight: 400;
}

.slick-dots {
    display: none !important;
}

.slick-prev,
.slick-next {
    font-size: 0;
    line-height: 0;

    position: absolute;
    top: 50%;
    display: block;
    width: 20px;
    height: 20px;
    margin-top: -10px;
    padding: 0;
    cursor: pointer;
    color: transparent;
    border: none;
    outline: none;
    background: transparent;
}

.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus {
    color: transparent;
    outline: none;
    background: transparent;
}

.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before {
    opacity: 1;
    color: #666;
}

.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before {
    opacity: .25;
}

.slick-prev:before,
.slick-next:before {
    font-family: 'fontawesome';
    font-size: 16px;
    line-height: 1;
    opacity: .75;
    color: #ccc;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.slick-prev {
    left: -25px;
}

[dir='rtl'] .slick-prev {
    right: -25px;
    left: auto;
}

.slick-prev:before {
    content: "\f053";
}

[dir='rtl'] .slick-prev:before {
    content: "\f054";
}

.slick-next {
    right: -25px;
}

[dir='rtl'] .slick-next {
    right: auto;
    left: -25px;
}

.slick-next:before {
    content: "\f054";
}

[dir='rtl'] .slick-next:before {
    content: "\f053";
}

.slick-slider {
    position: relative;

    display: block;

    -moz-box-sizing: border-box;
    box-sizing: border-box;

    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;

    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list {
    position: relative;

    display: block;
    overflow: hidden;

    margin: 0;
    padding: 0;
}

.slick-list:focus {
    outline: none;
}

.slick-list.dragging {
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.slick-track {
    position: relative;
    top: 0;
    left: 0;

    display: block;
}

.slick-track:before,
.slick-track:after {
    display: table;

    content: '';
}

.slick-track:after {
    clear: both;
}

.slick-loading .slick-track {
    visibility: hidden;
}

.slick-slide {
    display: none;
    float: left;

    height: 100%;
    min-height: 1px;
}

[dir='rtl'] .slick-slide {
    float: right;
}

.slick-slide img {
    display: block;
}

.slick-slide.slick-loading img {
    display: none;
}

.slick-slide.dragging img {
    pointer-events: none;
}

.slick-initialized .slick-slide {
    display: block;
}

.slick-loading .slick-slide {
    visibility: hidden;
}

.slick-vertical .slick-slide {
    display: block;

    height: auto;

    border: 1px solid transparent;
}

/******************** slick css end*****************************/

.logtime.button {
    background-color: #03a9f4;
    border: none;
    color: #FFFFFF !important;
    text-align: center;
    font-size: 12px;
    width: 70px;
    transition: all 0.5s;
    cursor: pointer;
    padding: 6px 8px;
    margin-top: 0px;
    margin-left: 4px;
    float: left;
}

.logtime.stopbtn.button {
    background-color: #c70310;
}

.logtime.button span {
    cursor: pointer;
    display: inline-block;
    position: relative;
    transition: 0.5s;
}

.logtime.stopbtn.button span:after {
    content: "\f28d" !important;
}

.logtime.button span:after {
    content: "\f04b";
    position: absolute;
    opacity: 0;
    top: 0;
    right: -30px;
    transition: 0.5s;
    font-family: fontawesome;
}

.noteBtn {
    height: 24px;
    position: relative;
}

.noteCount {
    background-color: #03a9f4;
    border-radius: 50%;
    height: 15px;
    width: 15px;
    position: absolute;
    text-align: center;
    line-height: 15px;
    font-size: 9px;
    color: #fff;
    right: 3px;
    top: -11px;
}

.logtime.button:hover span {
    padding-right: 15px;
}

.logtime.button:hover span:after {
    opacity: 1;
    right: 0;
}

.modal-open2 {

}

.wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    min-height: 100vh;
}

.timeTracker .timer {
    background: transparent;
    border-radius: 5px 5px 0 0;
    color: #39354c;
    font-size: 17px;
    text-align: center;
    padding: 0px;
    float: left;
}

.timeTracker span.fa-clock-o {
    font-size: 24px;
    float: left;
    margin-right: 5px;
    color: #27cda5;;
}

.timeTracker span.fa-clock-o.clockanimation {

    position: relative;
    -webkit-animation: mymove 1s infinite ease-in-out; /* Safari 4.0 - 8.0 */
    animation: mymove 1s infinite ease-in-out;
}

/* Safari 4.0 - 8.0 */
@-webkit-keyframes mymove {
    0% {
        transform: scale(0.6) rotate(0deg);
    }
    50% {
        transform: scale(1);
    }
    100% {
        transform: scale(0.6) rotate(360deg);
    }
}

@keyframes mymove {
    0% {
        transform: scale(0.6) rotate(0deg);
    }
    50% {
        transform: scale(1);
    }
    100% {
        transform: scale(0.6) rotate(360deg);
    }
}

.timeTracker {
    width: 205px;
    float: right;
}

.timeTracker .btn {
    background: transparent;
    border-radius: 0 0 5px 5px;
    width: 80px;
    padding: 0px;
    text-align: center;
}

.timeTracker button {
    background: #03a9f4;
    cursor: pointer;
    border: 0;
    width: 68px;
    color: #fff;
    line-height: 31px;
    margin-left: 10px;
    float: right;
    font-size: 13px;
    letter-spacing: .3px;
}

.timeTrackerbrder {
    border-right: 1px dotted #ccc;
}

.timeTrackerbrderLeft {
    border-left: 1px dotted #ccc;
}

.timeTracker button:focus {
    outline: 0;
    border: 0;
}

.projectDisplayBox {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-clip: border-box;
    border: 1px solid #c6d2d9;
    border-bottom: 4px solid #c6d2d9;
    background-color: #fff;
}

.collapse.show .projectDisplaySub_Box {
    background-color: #ebf0f3;
}

.ProjectDisplayLeftBox {
    width: calc(100% - 345px);
    float: left;
    margin-left: 10px;
}

.ProjectDisplayRightBox {
    width: 325px;
    float: left;
    margin-left: 10px;
}

.projectDisplayHead {
    background-color: #dfe5e8;
    padding: 5px 10px;
    border-radius: 2px 2px 0 0;
}

.cl-h2 {
    font-size: 17px;
    font-weight: bold;
    margin-right: 5px;
    margin-left: 5px;
}

.cl-ml-2 {
    cursor: pointer;
}

.TotalTimeCount_SinglePrjct {
    width: 150px;
    float: right;
}

.pr_DateText {
    color: #777;
    line-height: 26px;
    font-size: 12px;
}

.bulkCheckAlign {
    margin-top: -10px;
    float: left;
}

.bulk_SUB_CheckAlign {
    margin-top: -12px;
    float: left;
}

.projectDisplaySub_Box {
    display: flex;
    align-items: center;
    width: 100%;
    position: relative;
    padding: 15px 5px;
    border-bottom: 1px solid #c6d2d9;
    transition: .4s;

}

.projectDisplaySub_Box:hover {
    box-shadow: inset 2px -1px 3px #ccc;
}

.projectDisplaySub_Box_Left {
    width: calc(100% - 305px);
    float: left;
    margin-left: 5px;
}

.projectDisplaySub_Box_Right {
    width: 305px;
    margin-left: 5px;
    float: left;
}

.project_JobName {
    font-weight: 400;
    max-width: calc(50% - 52px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    float: left;
}

.checkboxDummySpace {
    width: 25px;
    height: 1px;
    float: left;
}

.modal-right.show .modal-dialog {
    -webkit-transform: translate(0, 0) !important;
    transform: translate(0, 0) !important
}

.modal-right .modal-dialog {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    max-width: 450px;
    width: 100%;
    margin: 0;
    -webkit-transform: translate(100%, 0) !important;
    transform: translate(100%, 0) !important;
    -webkit-transition: .5s;
    transition: .5s;

}

.RightFulll_height {
    height: calc(100vh - 100px);
}

.modal-right .modal-footer {
    padding: 8px 10px;
}

.modal-right .modal-content {
    display: -webkit-box;
    display: flex;
    flex-direction: column;
    border-radius: 0
}

.project_ProjectName {
    font-weight: 400;
    font-size: 12px;
    color: #a9a6a6;
    max-width: 49%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    float: left;
    line-height: 24px;
    margin-left: 1%;
}

.HouesGroup {
    background-color: #f7f7f7;
    padding: 1px 15px 5px 15px;
    margin-top: 10px;
    width: 100%;
    border: 1px solid #e4e4e4;
    position: relative;
}
.tooltip2 {
    min-width: 200px;
    max-width: 400px;
    color: #000;
    top: 50%;
    left: 100%;
    margin-left: 20px;
    transform: translate(0, -50%);
    padding: 0;
    background-color: #fff;
    font-size: 13px;
    border-radius: 8px;
    position: absolute;
    z-index: 99999999;
    box-sizing: border-box;
    box-shadow: 0 1px 8px rgba(0,0,0,0.5);
    transition: opacity 0.8s;
    opacity: 0;
    visibility: hidden;
    font-family: 'Roboto', sans-serif;
    text-align: left;
}
.right2::before {
    content:'';
    position:absolute;
    width:12px;
    height:12px;
    left:-12px;
    z-index: 99999;
    top:50%;
    transform:translate(50%,-50%) rotate(-45deg);
    background-color:#fff;
    border-left: 1px solid #b3b3b3;
    border-top: 1px solid #b3b3b3;
}
.right2
{
    float: right;
}
.tooltip2 ul
{
    padding: 15px;
    margin: 0;
}
.tooltip2 ul li
{
   list-style: none;
    display: block;
    width: 100%;
    clear: both;
    line-height: 20px;
    margin-bottom: 7px;
    float: left;
}
.tooltip2 ul li span
{
   float: left;
    width: 48px;
}
.tooltip2 ul li span.letterdispaly
{
   float: left;
    width: calc(100% - 48px);
    font-size: 13px;
    position: relative;
}
.tooltip2 ul li span.letterdispaly:before
{
   content: " - ";
    position: absolute;
    left: -10px;
}

.timeinfo:hover .tooltip2 {
    display:block;
    opacity: 1;
    visibility: visible;
}


.project_Workngfor, project_Billable {
    font-weight: 400;
    font-size: 13px;
}

.blue_color {
    color: #03a9f4 !important;
}

.cl-badge-same-entries {
    font-size: 13px;
    color: #02587f;
    background: #e1f5fe;
    float: left;
    margin: 0px 5px 0 0;
    width: 22px;
    height: 22px;
    line-height: 22px;
    padding: 0;
    text-align: center;
    cursor: pointer;
}
table tr.collapse
{
    background-color: #efefef;
}
.projectEditDrop .dropdown-toggle::after {
    display: none;
}

.projectEditDrop img {
    height: 19px;
}

.projectEditDrop {
    cursor: pointer;
    float: left;
    width: 23px;
    position: relative;
    text-align: center;
}

.noteBtnBox {
    cursor: pointer;
    float: left;
    width: 35px;
    position: relative;
    text-align: center;
}

.noteBtnBox:after {
    display: none;
}

.noteBtnBox .dropdown-menuBox {
    width: 300px;
    position: absolute;
    top: 40px;
    right: -20px !important;
    padding: 20px 0px 10px 0;
    background-color: #fff;
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.05);
    border-color: #e3eaef;
    z-index: 99;
}

.NoteCloseButton {
    line-height: 26px;
    cursor: pointer;
    font-size: 19px;
    color: red;
    margin-top: -10px;
    margin-right: 4px;
    margin-bottom: -2px;
}

.noteBtnBox .dropdown-menuBox:before {
    width: 18px;
    height: 19px;
    position: absolute;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    content: '';
    background-color: inherit;
    left: 266px;
    top: -10px;
    margin-left: -.5rem;
    border: 1px solid #d4d4d4;
    border-right: 0;
    border-bottom: 0;
    z-index: -1;
}

.max-het40 {
    max-height: 80px !important;
    border: 1px solid #fff;;
    border-bottom: 1px solid #d0d0d0;;
}

.noteItems {
    max-height: 180px;
    overflow-y: auto;
    margin: 0;
    text-align: left;
    padding: 0;
}

.noteItems li {
    list-style: none;
    border-bottom: 1px solid #f1f1f1;
    padding: 2px 15px;
}
.noteItems a {
    cursor: pointer;
    font-size: 12px;
}
.noteItems p {
    font-size: 13px;
    margin-bottom: 0;
}
.Sub_TimeCounter {
    width: 85px;
    float: left;
}
.projectEditDrop {
    position: relative;
}
.RightFulll_height .bmd-form-group {
    margin-bottom: 8px !important;
}
/******************report ***************/

.kt-invoice__subtitle
{
    width: 130px;
    float: left;
    font-weight: bold;
    font-size: 13px;
}
/******************report end***************/

/************ file-upload ******************/

.timeAttach.file-upload {
    display: block;
    text-align: center;
    font-family: 'Roboto', sans-serif;
    font-size: 12px;
}
.timeAttach.file-upload .file-select {
    display: block;
    border: 1px solid #d0d0d0;
    color: #34495e;
    cursor: pointer;
    height: 40px;
    line-height: 40px;
    text-align: left;
    background: #fff;
    overflow: hidden;
    position: relative;
    border-radius: 2px;
}
.timeAttach.file-upload .file-select .file-select-button {
    background: #3fa46a;
    color: #fff;
    padding: 0 10px;
    display: inline-block;
    height: 40px;
    line-height: 40px;
}
.timeAttach.file-upload .file-select .file-select-name {
    line-height: 40px;
    float: right;
    padding: 0 10px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: calc(100% - 89px);
}
.timeAttach.file-upload .file-select:hover {
    border-color: #3fa46a;
    transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
}
.timeAttach.file-upload .file-select:hover .file-select-button {
    background: #3fa46a;
    color: #fff;
    transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
}
.timeAttach.file-upload.active .file-select {
    border-color: #3fa46a;
    transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
}
.timeAttach.file-upload.active .file-select .file-select-button {
    background: #3fa46a;
    color: #fff;
    transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
}
.timeAttach.file-upload .file-select input[type=file] {
    z-index: 100;
    cursor: pointer;
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    opacity: 0;
    filter: alpha(opacity=0);
}
.timeAttach.file-upload .file-select.file-select-disabled {
    opacity: 0.65;
}
.timeAttach.file-upload .file-select.file-select-disabled:hover {
    cursor: default;
    display: block;
    border: 2px solid #dce4ec;
    color: #34495e;
    cursor: pointer;
    height: 40px;
    line-height: 40px;
    margin-top: 5px;
    text-align: left;
    background: #fff;
    overflow: hidden;
    position: relative;
}
.timeAttach.file-upload .file-select.file-select-disabled:hover .file-select-button {
    background: #dce4ec;
    color: #666;
    padding: 0 10px;
    display: inline-block;
    height: 40px;
    line-height: 40px;
}
.timeAttach.file-upload .file-select.file-select-disabled:hover .file-select-name {
    line-height: 40px;
    display: inline-block;
    padding: 0 10px;
}
/******************************/


.projectEditDrop .dropdown-menu {
    transform: translate3d(5px, 37px, 0px) !important;
    left: auto !important;
    right: 0;
    padding: 0;
    border-radius: 0;
}

.projectEditDrop .dropdown-menu:before {
    width: 18px;
    height: 19px;
    position: absolute;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    content: '';
    background-color: inherit;
    left: 131px;
    top: -10px;
    border: 1px solid #e3eaef;
    border-right: 0;
    border-bottom: 0;
    z-index: -1;
}

body.modal-open {
    overflow: hidden;
}

.projectEditDrop .dropdown-menu li a {
    color: #000 !important;
    font-size: 13px;
    display: block;
    padding: 6px 10px;
}

.projectEditDrop .dropdown-menu li a:hover {
    background-color: #f1f1f1;
}

.prjectSubPlay_Btn {
    /* border: 1px solid #ccc;
     padding: 5px 5px;
     border-radius: 50%;*/
    cursor: pointer;
}

.PlaybtnBox {
    width: 40px;
    float: left;
    position: relative;
    text-align: center;
}

.prjectSubPause_Btn {
    border-radius: 50%;
    cursor: pointer;
    height: 25px;
    width: 26px;
    margin: auto;
    margin-top: -1px;
}

.Bulk_Edit, .Bulk_Delete {
    font-size: 12px;
    cursor: pointer;
    margin-right: 5px;
}

.Bulk_Edit:hover, .Bulk_Delete:hover {
    opacity: .7;
}
.PrInsideBtn
{
    float: right;
    margin: 3px 6px;
    cursor: pointer;
    padding: 12px 4px;
}
.PrInsideBtn:hover, .PrInsideActive
{
    color: #03a9f4 !important;
    text-decoration: underline !important;
}

.TimetrackerFooter {
    width: calc(100% - 310px);
    left: 295px;
    position: fixed;
    bottom: 0;
    z-index: 9;
    background-color: #fff;
    transition: All .6s ease;
    -webkit-transition: All .6s ease;
    border-top: 1px solid #eaeaea;
    padding: 5px 0;
}

.TimetrackerFooter_Open {
    width: calc(100% - 120px);
    left: 105px;
    transition: All .6s ease;
    -webkit-transition: All .6s ease;
}

.TimetrackerFooterRightgSub {
    width: 385px;
    float: right;
}

.prjectSubPlay_wrapper {
    width: 23px;
    height: 23px;
    margin: 0 6px;
}

.prjectSubPlay_wrapper .circle {
    width: 26px;
    height: 26px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 50%;
    background-color: #fff;
    margin: auto;
    transform: scale(1, 1);
    border: 1px solid #ccc;
}

.prjectSubPlay_wrapper .circle.pulse {
    animation-timing-function: ease;
    animation: pulse 2s infinite;
    background-color: #27cda5;
}

.prjectSubPlay_wrapper svg {
    fill: #ccc;
    stroke: #ccc;
    stroke-linejoin: round;
    stroke-width: 5;
    transition: all 0.3s;
}

.prjectSubPlay_wrapper svg:hover {
    cursor: pointer;
    fill: #03a9f4;
    stroke: #03a9f4;
    transform: scale(1.2, 1.2);
}

.FooterRightgSub_total, .FooterRightgSub_Submitted, .FooterRightgSub_Not_Submitted {

    padding: 3px 10px;
    float: left;
}

.FooterRightgSub_total {
    border-left: 4px solid #08af6e;
}

.FooterRightgSub_total p, .FooterRightgSub_Submitted p, .FooterRightgSub_Not_Submitted p {
    margin: 0;
    font-weight: 600;
}

.FooterRightgSub_total p {
    color: #08af6e;

}

.FooterRightgSub_total h5, .FooterRightgSub_Submitted h5, .FooterRightgSub_Not_Submitted h5 {
    color: #000;
    margin: 0;
    font-size: 13px;
}

.FooterRightgSub_Submitted {
    border-left: 4px solid #9738d5;
}

.FooterRightgSub_Submitted p {
    color: #9738d5;
}

.FooterRightgSub_Not_Submitted {
    border: 1px solid #08af6e;
    border-radius: 6px;
}

.FooterRightgSub_Not_Submitted p {
    color: #1b65ef;
}

.FooterRightgSub_Not_Submitted i {
    font-size: 30px;
    color: #08af6e;
    float: right;
    padding-top: 7px;
}

.Not_SubmittedSub {
    width: 110px;
    float: left;
}






.navbar-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    -webkit-box-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0 auto;
    height: 52px;
    /* padding: 0 1.5rem 0 calc(1.5rem / 2); */
}

.binance {
    background-color: black;
    padding: 11px 40px 11px 23px;
}
.navbar-nav1 {
    padding: 0;
    margin: 0;
}
.navbar-nav1 .nav-item {
    color: white;
    padding: 0 10px;
}
.navbar-nav1 .nav-item a {
    color: white;
    font-size: .8125rem;
}
.nav-link {
    cursor: pointer;
}

.search-bar {
    padding: 10px 9px;
    margin-right: 11px;
    height: 31px;
    background: #3B3B3B;
    display: flex;
    justify-content: space-between;
    border-radius: 5px;
    overflow: hidden;
    transition: 0.5s;
    width: 31px;
  }
  
  .search-bar__search-icon {
    padding-left: 0px;
    padding-right: 13px;
  }
  
  .search-bar__search-icon .fas {
    border-radius: 50%;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: .8rem;
    /* transition: 0.5s; */
  }
  
  .search-bar__search-icon:hover {
    cursor: pointer;
  }
  
  .search-bar__search-input {
    height: 18px;
    width: 370px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  .search-bar__search-input input {
    width: 100%;
    height: 100%;
    outline: none;
    font-size: 1em;
    padding: 0;
    margin-top: -8px;
    border: none;
    color: #fff;
    font-family: 'Roboto', sans-serif;
    background: #3B3B3B;
  }
  
  .search-bar__search-input input::-moz-placeholder {
    font-size: 13px;
    color: white;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
  }
  
  .search-bar__search-input input:-ms-input-placeholder {
    font-size: 13px;
    color: white;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
  }
  
  .search-bar__search-input input::placeholder {
    font-size: 13px;
    color: white;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
  }

  .search-bar__close-icon{
    margin-top: -4px;
  }
  .search-bar__close-icon i{
      color: white;
  }

  .nav-pay{
    background-color: #f6fafd;
  }
  
  .nav-pay .nav-link.active{
    color: #fff;
    background-color: #000;
    border-color: var(--vz-gray-300) var(--vz-gray-300) var(--vz-nav-tabs-link-active-bg);
    font-weight: 500;
  }
  
  .nav-pay .nav-link{
    border-radius: .25rem;
    padding: .2rem .6rem;
    font-size: .815rem;
    color: rgb(0, 0, 0); 
    margin: 10px 0px 10px 10px;
    font-weight: 400;
    background-color: white;
    box-shadow: 0px 1px 2px #0000000d;
  }
  
  
  @media screen and (max-width: 576px) {
    .search-bar__search-input {
      width: 230px;
    }
  }
  
  
  @media screen and (max-width: 576px) {
    .search-bar {
      width: 300px;
    }
  }
  
  .search-bar--active {
    width: 250px;
  }
  
  
  
  @media screen and (max-width: 576px) {
    .search-bar--active {
      width: 300px;
    }
  }
  
  .search-bar__search-icon i {
    font-size: 17px;
    color: white;
  }

  .icns {
    padding-left: 10px;
    background-color: black;
    height: 52px;
}

  .fs-icn {
    font-size: 11px !important;
    background: #222;
    padding: 8px 10px;
    border-radius: 3px;
    color: white;
    margin: 0 10px;
    position: relative;
}

.header-profile-user {
    height: 36px;
    width: 36px;
    border-radius: 15% !important;
    border: 2px solid green;
    margin-left: 10px;
}
.navbar-header .user-name-text {
    color: #fff;    
    font-size: 13px;
    font-weight: 500;
    margin: 0 10px;
}
.pro-icn {
    color: white;
    background-color: #222;
    padding: 4px 5px;
    font-size: 12px;
    border-radius: 20px;
    margin-right: 7px;
}
.king{
    position: relative;
    cursor: pointer;
}
.king .drpdown-menu {
    background-color: #1c1c1c !important;
    width: 177px;
    position: absolute;
    right: 0;
    top: 44px;
    padding-bottom: 20px;
    display: none;
}

.dropdown-header {
    display: block;
    padding: 0.5rem 1rem;
    margin-bottom: 0;
    font-size: .8rem;
    color: #6c757d;
    white-space: nowrap;
}

.dropdown-item {
    display: block;
    width: 100%;
    padding: 0.35rem 1.2rem 0.35rem 1.2rem;
    clear: both;
    font-weight: 400;
    font-size: 13px;
    color: #dee2e6;
    text-align: inherit;
    text-decoration: none;
    white-space: nowrap;
    background-color: transparent;
    border: 0;
}

.dropdown-item span{
    margin-left: 5px;
}



.king:hover .drpdown-menu.active{
    display: block;  
}

.bg-red {
    background-color: red;
    color: white;
    font-size: 10px;
    position: absolute !important;
    top: -8px;
    right: -11px;
    border-radius: 20px;
    padding: 4px;
}

.cnstrn {
    padding-top: 33vh;
    padding-left: 9rem;
    height: 80vh;
}

.cnstrn h1 {
    font-weight: 600;
    font-size: 2.5rem;
    line-height: 1.4;
}
.cnstrn p {
    font-size: 17px;
}
.con-img img {
    width: 700px;
}

.gry{
    background-color: #2c2a3c;
    font-weight: 500;
}

.sub-gry{
    background-color: #222222;
}



.checkall {
    float: none;
    display: block;
    overflow: hidden;
  }
  
  .checkall li {
    float: left;
    background-color: hotpink;
    margin-right: 40px;
  }
  
  .btn-ghost-sec {
    color: #fff;
    background-color: #000000;
  }
  
  .form-cont {
    display: block;
    padding: 5px 10px;
    font-size: .8125rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: .25rem;
    -webkit-transition: border-color .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
    transition: border-color .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
    margin-right: 10px;
    margin-left: 5px;
  }
  
  .card-h {
    padding: .5rem .5rem;
    margin-bottom: 0;
    background-color: var(--vz-card-cap-bg);
    border-bottom: 0 solid rgba(0, 0, 0, .125);
  }
  
  .btn-prim {
    color: #fff;
    background-color: rgb(0, 0, 0);
    border-color: rgb(0, 0, 0);
    border: 1px solid transparent;
    padding: 5px 10px;
    font-size: .8125rem;
    border-radius: 0.25rem
  }
  
  .btn-prim:hover {
    color: #fff;
    background-color: #000000;
    border-color: #000000;
  }
  
  .bb-0 {
    border-bottom: 0 !important;
  }
  
  /* .main-con {
      margin-left: 373px;
    } */
  
  .main-con {
    margin-left: 224px;
  }
  
  .main-con1 {
    margin-left: 234px;
  }
  
  .main-con2 {
    margin-right: 70px;
  }
  
  /* .menu-link[data-bs-toggle="collapse"][aria-expanded="true"] . */
  
  .navbar-menu .hov-head {
    display: none;
  }
  
  .navbar-menu:hover .hov-head {
    display: block;
    margin-left: 11px;
  }
  
  .navbar-menu:hover {
    width: 224px;
  }
  
  .form-check-all tr:hover {
    background-color: rgb(243, 246, 249);
  }
  
  .email-topbar-link .btn-ghost-sec:hover {
    color: #33416e;
  }
  
  .btn-ghost-sec:active,
  .btn-ghost-sec:focus,
  .btn-ghost-sec:hover {
    color: #000;
    background-color: rgb(243, 246, 249);
  }
  
  .fitr .dropdown-menu.show {
    position: absolute !important;
    inset: 0 !important;
    margin: 0px !important;
    transform: translate(0px, 39px) !important;
    background: #1c1c1c !important;
    height: fit-content;
    border-radius: 0px;
    padding: 10px 0 !important;
  }
  
  .grpby .dropdown-menu.show {
    position: absolute !important;
    inset: 0px 21px 0px 4px !important;
    margin: 0px !important;
    transform: translate(0px, 39px) !important;
    background: #1c1c1c !important;
    height: fit-content;
    border-radius: 0px;
    padding: 10px 0 !important;
  }
  
  .kan-tab {
    padding: 3.95px 10px !important;
    border: 1px solid #82828226 !important;
    border-radius: .25rem;
  }
  
  .kan-tab:hover{
      background-color: black;
      color: white;
  }

  .nav-ta {
    border-top: 0px solid var(--vz-gray-300); 
    border-bottom: 0px solid var(--vz-gray-300);
  }
  
  
  :root {
    --bg: #ebf0f7;
    --header: #fbf4f6;
    --text: #2e2e2f;
    --white: #ffffff;
    --light-grey: #c4cad3;
    --tag-1: #ceecfd;
    --tag-1-text: #2e87ba;
    --tag-2: #d6ede2;
    --tag-2-text: #13854e;
    --tag-3: #ceecfd;
    --tag-3-text: #2d86ba;
    --tag-4: #f2dcf5;
    --tag-4-text: #a734ba;
    --purple: #7784ee;
  }
  
  
  .app {
    background-color: white;
    width: 100%;
    /* min-height: 100vh; */
  }
  
  
  .project {
    padding: .5rem 0;
    /* max-width: 75%; */
    width: 100%;
    display: inline-block;
    border-top: 1px solid #e9ebec;
    margin-top: 10px;
  }
  
  .project-info {
    padding: 2rem 0;
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: center;
  }
  
  .project-participants {
    display: flex;
    align-items: center;
  }
  
  .project-participants span,
  .project-participants__add {
    width: 30px;
    height: 30px;
    display: inline-block;
    background: var(--purple);
    border-radius: 100rem;
    margin: 0 0.2rem;
  }
  
  .project-participants__add {
    background: transparent;
    border: 1px dashed #969696;
    font-size: 0;
    cursor: pointer;
    position: relative;
  }
  
  .project-participants__add:after {
    content: "+";
    font-size: 15px;
    color: #969696;
  }
  
  .project-tasks {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    width: 100%;
    grid-column-gap: 1.5rem;
  }
  
  .project-column-heading {
    margin-bottom: .5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  
  .project-column-heading__title {
    font-size: 13px;
    font-weight: 600;
    line-height: 0;
    color: #000;
  }
  
  .project-column-heading__options {
    background: transparent;
    color: var(--light-grey);
    font-size: 18px;
    border: 0;
    cursor: pointer;
  }
  
  .task {
    cursor: move;
    background-color: var(--white);
    padding: 9px 7px 8px;
    width: 100%;
    margin-bottom: .2rem;
    border: 1px solid #e9ebec;
  }
  
  .task p {
    font-size: 13px;
    margin: 0;
  }
  
  .task h6 {
    margin-bottom: .2rem;
  }
  
  .task__tag {
    border-radius: 100px;
    padding: 2px 13px;
    font-size: 12px;
  }
  
  .task__tag--copyright {
    color: var(--tag-4-text);
    background-color: var(--tag-4);
  }
  
  .task__tag--design {
    color: var(--tag-3-text);
    background-color: var(--tag-3);
  }
  
  .task__tag--illustration {
    color: var(--tag-2-text);
    background-color: var(--tag-2);
  }
  
  .task__tags {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  
  .task__options {
    background: transparent;
    border: 0;
    color: var(--light-grey);
    font-size: 17px;
  }
  
  .task__stats {
    position: relative;
    width: 100%;
    color: var(--light-grey);
    font-size: 12px;
  }
  
  .task__stats span:not(:last-of-type) {
    margin-right: 1rem;
  }
  
  .task__stats svg {
    margin-right: 5px;
  }
  
  .task__owner {
    width: 25px;
    height: 25px;
    border-radius: 100rem;
    background: var(--purple);
    position: absolute;
    display: inline-block;
    right: 0;
    bottom: 0;
  }
  
  
  
  .task-details {
    width: 24%;
    border-left: 1px solid #d9e0e9;
    display: inline-block;
    height: 100%;
    vertical-align: top;
    padding: 3rem 2rem;
  }
  
  .tag-progress {
    margin: 1.5rem 0;
  }
  
  .tag-progress h2 {
    font-size: 16px;
    margin-bottom: 1rem;
  }
  
  .tag-progress p {
    display: flex;
    width: 100%;
    justify-content: space-between;
  }
  
  .tag-progress p span {
    color: #b4b4b4;
  }
  
  .tag-progress .progress {
    width: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    border-radius: 10px;
    height: 10px;
  }
  
  .tag-progress .progress::-webkit-progress-bar,
  .tag-progress .progress::-webkit-progress-value {
    border-radius: 10px;
  }
  
  .tag-progress .progress--copyright::-webkit-progress-bar {
    background-color: #ecd8e6;
  }
  
  .tag-progress .progress--copyright::-webkit-progress-value {
    background: #d459e8;
  }
  
  .tag-progress .progress--illustration::-webkit-progress-bar {
    background-color: #dee7e3;
  }
  
  .tag-progress .progress--illustration::-webkit-progress-value {
    background-color: #46bd84;
  }
  
  .tag-progress .progress--design::-webkit-progress-bar {
    background-color: #d8e7f4;
  }
  
  .tag-progress .progress--design::-webkit-progress-value {
    background-color: #08a0f7;
  }
  
  .task-activity h2 {
    font-size: 16px;
    margin-bottom: 1rem;
  }
  
  .task-activity li {
    list-style: none;
    margin: 1rem 0;
    padding: 0rem 1rem 1rem 3rem;
    position: relative;
  }
  
  .task-activity time {
    display: block;
    color: var(--light-grey);
  }
  
  .task-icon {
    width: 30px;
    height: 30px;
    border-radius: 100rem;
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  .task-icon svg {
    font-size: 12px;
    color: var(--white);
  }
  
  .task-icon--attachment {
    background-color: #fba63c;
  }
  
  .task-icon--comment {
    background-color: #5dc983;
  }
  
  .task-icon--edit {
    background-color: #7784ee;
  }
  
  .inact{
    border-radius: 0.25rem !important;
    padding: 0.2rem 0.6rem !important;
    color: rgb(0, 0, 0) !important;
    margin: 10px 0px 10px 10px !important;
    font-weight: 400 !important;
    background-color: white !important;
    box-shadow: 0px 1px 2px #0000000d !important;
  }
  
  .nav-link{
    cursor: pointer;
  }
  
  .btn-pri {
    color: #000;
    border-color: rgb(0, 0, 0);
    font-size: .815rem;
  }
  
  .pay { 
    padding: 2px 7px !important;
  }
  
  .margn{
    margin-top: 10px;
    margin-bottom: 5px;
  }
  
  .payslip{
    border: 1px solid #e9ebec;
    margin: 20px 10px;
    box-shadow: 0px 1px 2px #0000000d !important;
  }
  
  .pay-head{
    margin: 0rem;
  }
  
  .payslp{
    padding: 5px 5px 5px 30px;
    font-size: .815rem;
  }
  .br-left{
    border-left: 1px solid #e9ebec;
  }
  .br-right{
    border-right: 1px solid #e9ebec;
  }
  .br-top{
    border-top: 1px solid #e9ebec;
  }
  .br-bottom{
    border-bottom: 1px solid #e9ebec;
  }
  .pay-main{
    padding: 5px;
  }
  
  .payslip .form-control{
    padding: 0.3rem 0.5rem;
    margin-bottom: 7px;
  }
  
  .payslip input[type="checkbox"] {
    width: 13px;
    opacity: 1;
    height: 13px;
    outline-color: #ced4da !important;
    outline-style: auto;
}
  
  .paytab h6{
    padding-left: 10px;
    color: #545454;
  }
  
  .tab-ovr{
    overflow:hidden;
  }
  
  .payslp i {
    font-size: 17px;
    position: absolute;
    top: 7px;
    left: 5px;
}
  
  @media only screen and (max-width: 1300px) {
    .project {
      max-width: 100%;
    }
  
    .task-details {
      width: 100%;
      display: flex;
    }
  
    .tag-progress,
    .task-activity {
      flex-basis: 50%;
      background: var(--white);
      padding: 1rem;
      border-radius: 8px;
      margin: 1rem;
    }
  }
  
  @media only screen and (max-width: 1000px) {
  
    .project-column:nth-child(2),
    .project-column:nth-child(3) {
      display: none;
    }
  
    .project-tasks {
      grid-template-columns: 1fr 1fr;
    }
  }
  
  @media only screen and (max-width: 600px) {
    .project-column:nth-child(4) {
      display: none;
    }
  
    .project-tasks {
      grid-template-columns: 1fr;
    }
  
    .task-details {
      flex-wrap: wrap;
      padding: 3rem 1rem;
    }
  
    .tag-progress,
    .task-activity {
      flex-basis: 100%;
    }
  
  }
  
  .txt-p {
    font-size: 11px !important;
    font-style: italic;
  }
  
  .act {
    background-color: #222222 !important;
    color: #919191 !important;
  }
  
  
  
  
  @media only screen and (max-width: 1600px) {
    .navbar-nav1 .nav-item {
      color: white;
      padding: 0;
    }
  }
  
  @media only screen and (max-width: 1366px) {
    .navbar-nav1 .nav-item a {
      color: white;
      padding: 7px;
    }
  
    .search-bar--active {
      width: 145px;
    }
  }
  
  
  .side-menu {
    width: 80px;
    z-index: 10;
    background-color: #222222;
    bottom: 0;
    margin-top: 0;
    padding-bottom: 30px;
    position: fixed;
    top: 52px;
    transition: All .6s ease;
    -webkit-transition: All .6s ease;
    -moz-transition: All .6s ease;
    -o-transition: All .6s ease;
  }
  #sidebar-menu ul {
    margin: 0;
    padding: 0;
  }
  
  #sidebar-menu > ul > li > a {
    color: rgba(253, 254, 255, 0.8);
    display: block;
    padding: 8px 2px;
    margin: 0px 0;
    font-size: 12.5px;
    position: relative;
    font-weight: 300;
    border-bottom: 1px solid #2c2a3c;
    text-align: center;
    line-height: 19px;
  }
  .splnav {
    color: rgba(253, 254, 255, 0.8);
    text-align: center;
    cursor: pointer;
    padding: 20px 0 !important;
    border-bottom: 1px solid #2c2a3c;
    margin-bottom: 0;
  }
  #sidebar-menu ul li a i {
    display: inline-block;
    font-size: 20px;
    line-height: 17px;
    margin: 0 10px 4px 3px;
    text-align: center;
    vertical-align: middle;
    width: 12px;
  }
  /* .sidebar_sub_division {
    width: 100px;
    margin-left: -200px;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: 0.5s;
  } */
  /* .sidebar_sub_division {
    width: 180px;
    position: fixed;
    top: 42px;
    height: calc(100vh - 45px);
    overflow-y: auto;
    background: black;
    left: 80px;
    display: none;
    padding-top: 10px;
    border-left: 1px solid #423d58;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
    z-index: 999999;
  } */
  .nav_second_sub li {
    margin-bottom: 0px;
    border-bottom: 1px solid #3f3b52;
    line-height: 24px;
    width: 100%;
  }

  .sidebar_sub_division a {
    display: block;
    padding: 4px 10px;
    color: #fff;
  }
  #sidebar-menu > ul > li:hover {
    background: black;
    border-left: 3px solid #6e56a3;
  }

  .bootm_toggle_settings_button {
    position: absolute;
    bottom: 0px;
    color: #bdbbbb;
    text-align: center;
    width: 100%;
    font-size: 12px;
    cursor: pointer;
    border-top: 1px solid #2c2a3c;
  }
  .bootm_toggle_settings_button a {
    color: #bdbbbb;
    text-align: left;
    font-size: 14px;
  }
  .bdr_btmnone_nav {
      border-bottom: 0 !important;
  }

  .breadcrumb-item>a {
    color: black;
}

.pagintn{
    margin-top: 2px;
}

.table .table-light {
    background-color: #f3f6f9;
}

.form-check-input {
    width: 0.9em;
    height: 0.9em;
    margin-left: 5px;
    margin-top: 0.2em;
    vertical-align: top;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    border: 1px solid #ced4da;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-print-color-adjust: exact;
    color-adjust: exact;
}

table tr{
    padding: 0 10px;
}

table tr:last-child{
    border-bottom: 1px solid #dee2e6;
}

.link-primary, .link-primary:hover {
    color: #405189;
    text-decoration: none;
}
.fw-medium {
    font-weight: 500;
}

.badge-soft-success {
    color: #0ab39c;
    background-color: rgba(10, 179, 156, .1);
    font-weight: 600;
}
.badge-soft-danger {
    color: #f06548;
    background-color: rgba(240, 101, 72, .1);
    font-weight: 600;
}
.badge-soft-secondary {
    color: #3577f1;
    background-color: rgba(53, 119, 241, .1);
    font-weight: 600;
}
.badge-soft-warning {
    color: #f7b84b;
    background-color: rgba(247, 184, 75, .1);
    font-weight: 600;
}

.add-btn i{
    font-size: 10px;
    margin-right: 2px;
}

.allicns i{
    font-size: 13px;
}

select {
    text-transform: none;
    width: 100%;
    padding: 0.5rem 2.7rem 0.5rem 0.1rem;
    font-size: .8125rem;
    color: #212529;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
}

.payslip h6 {
    font-size: .815rem;
}

.checkbox{
    margin: 0;
}


@media only screen and (max-width: 1400px){
    .fs-icn {
        font-size: 11px !important;
        background: #222;
        padding: 8px 10px;
        border-radius: 3px;
        color: white;
        margin: 0 7px;
        position: relative;
    }
    .search-bar--active {
        width: 160px;
    }
    .nav-link {
        display: block;
        padding: 0.5rem 0.5rem;
    }
}

/* PRELOADER CSS */

.page-loader {
    width: 100%;
    height: 100vh;
    position: absolute;
    background: #222222;
    z-index: 1000;
  }
  /* SPINNER ANIMATION */
  .spinner {
    position: relative;
    top: 45%;
    width: 80px;
    height: 80px;
    margin: 0 auto;
    background-color: #fff;
    border-radius: 100%;
    -webkit-animation: sk-scaleout 1s infinite ease-in-out;
    animation: sk-scaleout 1s infinite ease-in-out;
  }
  @-webkit-keyframes sk-scaleout {
    0% {
      -webkit-transform: scale(0);
    }
    100% {
      -webkit-transform: scale(1);
      opacity: 0;
    }
  }
  @keyframes sk-scaleout {
    0% {
      -webkit-transform: scale(0);
      transform: scale(0);
    }
    100% {
      -webkit-transform: scale(1);
      transform: scale(1);
      opacity: 0;
    }
  }

  .bg-gry{
    background: #f4f5f8;
  }

  .page-title-box1 {
    background-color: #f4f5f8;
    border-top: 1px solid #dee2e6;
    padding: 0px 10px;
}

.mod-head{
    background-color: white !important;

}

.mod-head .modal-title{
    color: #495057;
    font-size: 17px;
    font-weight: 500;
}

.btn-close {
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    width: 1em;
    height: 1em;
    padding: 0.25em 0.25em;
    color: #000;
    background: transparent url(../img/cross.svg) center/1em auto no-repeat;
    border: 0;
    border-radius: 0.25rem;
    opacity: .5;
}

.project-tasks1 {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    width: 100%;
    grid-column-gap: .5rem;
}





  .drag-list {
    display: flex;
    align-items: flex-start;
  }
  @media (max-width: 690px) {
    .drag-list {
      display: block;
    }
  }
  
  .drag-column {
    flex: 1;
    position: relative;
    overflow: hidden;
  }
  @media (max-width: 690px) {
    .drag-column {
      margin-bottom: 30px;
    }
  }
  .drag-column h2 {
    font-size: 14px;
    margin: 5px 10px;
    line-height: 1.2;
    text-transform: uppercase;
    font-weight: 600;
    color: #000;
}

  

  
  .drag-inner-list {
    min-height: 50px;
  }
  
  .drag-item {
    margin: 10px;
    /* height: 100px;
    background: rgba(0, 0, 0, 0.4); */
    transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1);
  }
  .drag-item.is-moving {
    /* transform: scale(1.5); */
    background: rgba(0, 0, 0, 0.8);
  }
  
  .drag-header-more {
    cursor: pointer;
  }
  
  .drag-options {
    position: absolute;
    top: 44px;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 10px;
    transform: translateX(100%);
    opacity: 0;
    transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1);
  }
  .drag-options.active {
    transform: translateX(0);
    opacity: 1;
  }
  .drag-options-label {
    display: block;
    margin: 0 0 5px 0;
  }
  .drag-options-label input {
    opacity: 0.6;
  }
  .drag-options-label span {
    display: inline-block;
    font-size: 0.9rem;
    font-weight: 400;
    margin-left: 5px;
  }
  
  /* Dragula CSS  */
  .gu-mirror {
    position: fixed !important;
    margin: 0 !important;
    z-index: 9999 !important;
    opacity: 0.8;
    list-style-type: none;
  }
  
  .gu-hide {
    display: none !important;
  }
  
  .gu-unselectable {
    -webkit-user-select: none !important;
    -moz-user-select: none !important;
    -ms-user-select: none !important;
    user-select: none !important;
  }
  
  .gu-transit {
    opacity: 0.2;
  }
  
ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

.project1 {
    padding: 0.5rem;
    width: 100%;
    display: inline-block;
    border-top: 1px solid #e9ebec;
    margin-top: 10px;
}

.customer-bx{
    border: 1px solid #e9ebec;
    padding: 5px;
    height: 100%;
    display: flex;
}

.cust-img{
    position: relative;
    margin-right: 10px;
    width: 100px;
    min-height: 100px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

}

.logo-img{
    position: relative;
    margin-right: 10px;
    width: 100px;
    min-height: 100px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

.customer-content{
    width: 195px;
    margin: 10px 0px;
}

.cust-badge{
    display: inline-block;
    padding: 0em 0.4em;
    font-size: 75%;
    font-weight: 700;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 0.2rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.badge-clr1{
    color: #fff;
    background-color: #be0000;
}

.badge-clr2{
    color: #fff;
    background-color: #2da4c4;
}

.badge-clr3{
    color: #fff;
    background-color: #814968;
}

.customer-content h6{
    margin: 0px;
}

.customer-content i{
    font-size: 11px;
}

.customer-content .loctn{
    font-size: 11px;
}

.customer-content span{
    font-size: 11px;
}

.rounded-left {
    border-top-left-radius: 3px !important;
    border-bottom-left-radius: 3px !important;
}

.btn-group > .btn:not(:last-child):not(.dropdown-toggle) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.rounded-right {
    border-top-right-radius: 3px !important;
    border-bottom-right-radius: 3px !important;
}

.btn-group > .btn:not(:first-child){
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.contact-pag .btn-secondary {
    background-color: #000000;
    border-color: #000000;
    color: #ffffff;
    padding: 5px 6px !important;
}

.contact-pag .btn-secondary:hover {
    background-color: #000000;
    border-color: #000000;
    color: #ffffff;
}

.contact-pag .dropdown-toggle::after {
    display: none;
}

.contact-pag .dropdown-item {
    display: block;
    width: 100%;
    padding: 0.35rem 1.2rem 0.35rem 1.2rem;
    clear: both;
    font-weight: 400;
    font-size: 13px;
    color: #000000;
    text-align: inherit;
    text-decoration: none;
    white-space: nowrap;
    background-color: transparent;
    border: 0;
}

.contact-pag .dropdown-menu.show{
    position: absolute;
    transform: translate3d(-106px, 26px, 0px) !important;
    top: 0px;
    right: 0px;
    will-change: transform;
}

.contact-pag .dropdown-menu{
    min-width: 11rem !important;
}

.nav-contact .nav-item{
    border-right: 1px solid #dee2e6;
}

.nav-contact .nav-link {
    margin: 10px;
    background-color: transparent !important;
    color: #000 !important;
    border: 0;
    box-shadow: none;
    padding: 3px 0;
    width: 140px;
}

.nav-contact i {
    font-size: 20px;
    padding: 7px 10px 3px 0;
    color: #1e4561;
}

.nav-contact .nav-item .line{
    line-height: 1 !important;
}

.txt-clr{
    color: #1e4561;
    font-size: 13px;
    font-weight: 800;
    line-height: 16px;
}

.customer-head{
    padding: 5px;

}

.cust-logo{
    width: 80px;
    height: 80px;
    float: left;
    background-size: contain;
    border: 1px solid #dee2e6;
}

.cust-name label {
    font-size: .84rem;
    color: #2e2e2f;
    font-weight: 600;
    margin-bottom: 0.5rem;
    margin-left: 5px;
}

.cust-name input[type=radio] {
    box-sizing: border-box;
    padding: 0;
    position: relative;
    top: 2px;
}

#individual, #company, #r-day, #vendor, #customer, #azure-mail{
    accent-color: #1e4561;  
}

.cust-name{
    padding-top: 13px;
    padding-left: 10px;
}

.sms{
    font-size: 22px;
    margin-left: 10px;
}

.cust-details p{
    padding-left: 10px;
    font-size: .815rem;
}

.cust-details .tag{
    margin-left: 10px;
}

.prct1{
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    width: 100%;
    grid-column-gap: 0.5rem;
    padding: 0 10px 10px 10px;
}

.prct1 h6{
    padding-left: 0 !important;
}

.sales_purchase p{
    padding-left: 10px;
    font-size: .815rem;
    color: #212529;
}
.sales_purchase input[type=checkbox]{
    margin-left: 10px;
    margin-right: 5px;
}

.r-day{
    font-size: .815rem;
    color: #212529;
}

.sales_purchase h5 {
    font-size: 15px;
    padding: 0 15px;
    color: black;
    font-weight: 600;
}

.bank .table {
    width: 35%;
    border-left: 1px solid #dee2e6;
    margin-bottom: 1rem;
    background-color: transparent;
    margin-left: 10px;
}

.bank .table td,  .bank .table th{   
    border-right: 1px solid #dee2e6; 
}

.msg input[type="checkbox"] {
    width: 13px;
    position: relative;
    top: 2px;
    opacity: 1;
    height: 13px;
    outline-color: #ced4da !important;
    outline-style: auto;
}

.msg h6{
    padding: 0;
}

.msg, .msging{
    padding: 0 10px;
}

.msg h6 span{
    font-weight: 400;
    color: #6c757d;
}

.msging img{
    width: 35px;
    height: 35px;
    border-radius: 50px;
    margin-right: 10px;
}

.message-input {
    background-color: #f6fafd;
    position: relative;
    padding: 5px 15px;
    font-size: 13px;
    border: 0;
    color: black;
    width: 92%;
}

.rounded-full {
    border-radius: 9999px;
}


.test-emoji{
    position: absolute;
    text-align:center;
    font-size: 2rem;
    left: 0%;
    width: 100%;
    top: 20%;
  }
  
  .intercom-composer-popover-input{
      font-size-adjust: none;
      font-size: 100%;
      font-style: normal;
      letter-spacing: normal;
      font-stretch: normal;
      font-variant: normal;
      font-weight: 400;
      font: normal normal 100% "intercom-font", "Helvetica Neue", Helvetica, Arial, sans-serif;
      text-align: left;
      text-align-last: auto;
      text-decoration: none;
      -webkit-text-emphasis: none;
      text-emphasis: none;
      text-height: auto;
      text-indent: 0;
      text-justify: auto;
      text-outline: none;
      text-shadow: none;
      text-transform: none;
      text-wrap: normal;
      alignment-adjust: auto;
      alignment-baseline: baseline;
      -webkit-animation: none 0 ease 0 1 normal;
      animation: none 0 ease 0 1 normal;
      -webkit-animation-play-state: running;
      animation-play-state: running;
      -webkit-appearance: normal;
      -moz-appearance: normal;
      appearance: normal;
      azimuth: center;
      -webkit-backface-visibility: visible;
      backface-visibility: visible;
      background: none 0 0 auto repeat scroll padding-box transparent;
      background-color: transparent;
      background-image: none;
      baseline-shift: baseline;
      binding: none;
      bleed: 6pt;
      bookmark-label: content();
      bookmark-level: none;
      bookmark-state: open;
      bookmark-target: none;
      border: 0 none transparent;
      border-radius: 0;
      bottom: auto;
      box-align: stretch;
      -webkit-box-decoration-break: slice;
      box-decoration-break: slice;
      box-direction: normal;
      box-flex: 0.0;
      box-flex-group: 1;
      box-lines: single;
      box-ordinal-group: 1;
      box-orient: inline-axis;
      box-pack: start;
      box-shadow: none;
      box-sizing: content-box;
      -webkit-column-break-after: auto;
      break-after: auto;
      -webkit-column-break-before: auto;
      break-before: auto;
      -webkit-column-break-inside: auto;
      break-inside: auto;
      caption-side: top;
      clear: none;
      clip: auto;
      color: inherit;
      color-profile: auto;
      -webkit-column-count: auto;
      -moz-column-count: auto;
      column-count: auto;
      -webkit-column-fill: balance;
      -moz-column-fill: balance;
      column-fill: balance;
      -webkit-column-gap: normal;
      -moz-column-gap: normal;
      column-gap: normal;
      -webkit-column-rule: medium medium #1f1f1f;
      -moz-column-rule: medium medium #1f1f1f;
      column-rule: medium medium #1f1f1f;
      -webkit-column-span: 1;
      -moz-column-span: 1;
      column-span: 1;
      -webkit-column-width: auto;
      -moz-column-width: auto;
      column-width: auto;
      -webkit-columns: auto auto;
      -moz-columns: auto auto;
      columns: auto auto;
      content: normal;
      counter-increment: none;
      counter-reset: none;
      crop: auto;
      cursor: auto;
      direction: ltr;
      display: inline;
      dominant-baseline: auto;
      drop-initial-after-adjust: text-after-edge;
      drop-initial-after-align: baseline;
      drop-initial-before-adjust: text-before-edge;
      drop-initial-before-align: caps-height;
      drop-initial-size: auto;
      drop-initial-value: initial;
      elevation: level;
      empty-cells: show;
      fit: fill;
      fit-position: 0 0;
      float: none;
      float-offset: 0 0;
      grid-columns: none;
      grid-rows: none;
      hanging-punctuation: none;
      height: auto;
      hyphenate-after: auto;
      hyphenate-before: auto;
      hyphenate-character: auto;
      hyphenate-lines: no-limit;
      hyphenate-resource: none;
      -webkit-hyphens: manual;
      -ms-hyphens: manual;
      hyphens: manual;
      icon: auto;
      image-orientation: auto;
      image-rendering: auto;
      image-resolution: normal;
      inline-box-align: last;
      left: auto;
      line-height: inherit;
      line-stacking: inline-line-height exclude-ruby consider-shifts;
      list-style: disc outside none;
      margin: 0;
      marks: none;
      marquee-direction: forward;
      marquee-loop: 1;
      marquee-play-count: 1;
      marquee-speed: normal;
      marquee-style: scroll;
      max-height: none;
      max-width: none;
      min-height: 0;
      min-width: 0;
      move-to: normal;
      nav-down: auto;
      nav-index: auto;
      nav-left: auto;
      nav-right: auto;
      nav-up: auto;
      opacity: 1;
      orphans: 2;
      outline: medium none invert;
      outline-offset: 0;
      overflow: visible;
      overflow-style: auto;
      padding: 0;
      page: auto;
      page-break-after: auto;
      page-break-before: auto;
      page-break-inside: auto;
      page-policy: start;
      -webkit-perspective: none;
      perspective: none;
      -webkit-perspective-origin: 50% 50%;
      perspective-origin: 50% 50%;
      pointer-events: auto;
      position: static;
      presentation-level: 0;
      punctuation-trim: none;
      quotes: none;
      rendering-intent: auto;
      resize: none;
      right: auto;
      rotation: 0;
      rotation-point: 50% 50%;
      ruby-align: auto;
      ruby-overhang: none;
      ruby-position: before;
      ruby-span: none;
      size: auto;
      string-set: none;
      table-layout: auto;
      top: auto;
      -webkit-transform: none;
      -ms-transform: none;
      transform: none;
      -webkit-transform-origin: 50% 50% 0;
      -ms-transform-origin: 50% 50% 0;
      transform-origin: 50% 50% 0;
      -webkit-transform-style: flat;
      transform-style: flat;
      transition: all 0 ease 0;
      unicode-bidi: normal;
      vertical-align: baseline;
      white-space: normal;
      white-space-collapse: collapse;
      widows: 2;
      width: auto;
      word-break: normal;
      word-spacing: normal;
      word-wrap: normal;
      z-index: auto;
      text-align: start;
      -ms-filter: "progid:DXImageTransform.Microsoft.gradient(enabled=false)";
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
    
  }
  .intercom-composer-popover {
      z-index: 2147483003;
      position: absolute;
      right: 57px;
      bottom: 109px;
      /* bottom: 50px;
      right: calc(50% - 165px); */
      box-shadow: 0 1px 15px 1px rgba(0,0,0,.08);
      background-color: #fff;
      border-radius: 6px;
      transition-duration: 200ms;
      transition-delay: 0ms;
      transform-style: flat;
      transform-origin: 50% 50% 0;
      opacity: 0;
      transition: all 0.2s linear;
      visibility: hidden;
  }
  .intercom-composer-popover.active{
    visibility: visible;
    opacity:1;
    bottom: 109px;
    right: 57px;
  }
  .intercom-emoji-picker {
      width: 330px;
      height: 260px;
  }
  .intercom-composer-popover-header {
      position: absolute;
      top: 0;
      left: 20px;
      right: 20px;
      height: 40px;
      border-bottom: 1px solid #edeff1;
  }
  .intercom-composer-popover-input {
      background-image: url(https://js.intercomcdn.com/images/search.7ae40c25.png);
      background-size: 16px 16px;
      background-repeat: no-repeat;
      background-position: 0 12px;
      font-weight: 400;
      font-size: 14px;
      color: #6e7a89;
      padding-left: 25px;
      height: 40px;
      width: 100%;
      box-sizing: border-box;
      background-image: url(https://js.intercomcdn.com/images/search@2x.9f02b9f3.png);
      border:none;
      outline: none;
  }
  .intercom-composer-popover-body {
      position: absolute;
      top: 40px;
      left: 0;
      right: 0;
      bottom: 5px;
      padding: 0 20px;
      overflow-y: scroll;
  }
  .intercom-emoji-picker-group {
      margin: 10px -5px;
  }
  .intercom-emoji-picker-group {
      margin: 10px -5px;
  }
  .intercom-emoji-picker-group-title {
      color: #b8c3ca;
      font-weight: 400;
      font-size: 13px;
      margin: 5px;
  }
  .intercom-emoji-picker-emoji {
      padding: 5px;
      width: 30px;
      line-height: 30px;
      display: inline-table;
      text-align: center;
      cursor: pointer;
      vertical-align: middle;
      font-size: 28px;
      transition: -webkit-transform 60ms ease-out;
      transition: transform 60ms ease-out;
      transition: transform 60ms ease-out,-webkit-transform 60ms ease-out;
      transition-delay: 60ms;
      font-family: Apple Color Emoji,Segoe UI Emoji,NotoColorEmoji,Segoe UI Symbol,Android Emoji,EmojiSymbols;
  }
  .intercom-emoji-picker-emoji:hover {
      transition-delay: 0ms;
      -webkit-transform: scale(1.4);
      -ms-transform: scale(1.4);
      transform: scale(1.4);
  }
  .intercom-composer-popover-caret {
      position: absolute;
      bottom: -8px;
      right: 0;
      width: 0;
      height: 0;
      border-left: 8px solid transparent;
      border-right: 8px solid transparent;
      border-top: 8px solid #fff;
      left:20px;
  }
  
  .chat-input-tool{
    background-color: #1e4561;
    padding: 7px 10px;
    width: 36px;
    border: none;
    border-radius: 5px;
    color: white;
    margin: 0 0 0 5px;
  }

  .file-msg img{
    width: 100%;
    height: 96%;
  }

.action-box-submit {
    width: 60px;
    height: 36px;
    background-color: transparent;
    color: #1e4561;
    border: 0;
    cursor: pointer;
    border-top-right-radius: 9999px;
    border-bottom-right-radius: 9999px;
    position: absolute;
    right: 105px;
}


.files-wr input {
    display: none;
  }
  
  .files-wr {
    padding: 10px;
  }
  .files-wr label {
    margin-bottom: 10px;
    position: relative;
    display: inline-block;
    color: #21253d;
    font-size: .815rem;
    font-weight: 500;
    padding-left: 30px;
    cursor: pointer;
    transition: all 0.2s;
  }
  .files-wr label:before {
    content: "+";
    width: 20px;
    height: 20px;
    border-radius: 5px;
    background-color: #222222;
    position: absolute;
    top: 0;
    left: 0;
    font-size: 15px;
    line-height: 1.3rem;
    color: #fff;
    text-align: center;
    transition: all 0.2s;
  }
  .files-wr label:hover, .files-wr label:active {
    color: #1e4561; 

  }
  .files-wr label:hover:after, .files-wr label:active:after {
    background-color: #77c639;
  }
  .files-wr .one-file ~ .one-file label {
    display: none;
  }
  .files-wr .one-file.error {
    border: none;
  }
  .files-wr .one-file.error .file-name {
    color: #222222;
  }
  .files-wr .file-item {
    position: relative;
    /* margin-top: 4px; */
    display: flex;
    align-items: center;
  }
  .files-wr .file-item.hide-btn {
    display: none;
  }
  .files-wr .file-name {
    width: 250px;
    font-size: 13px;
    font-style: italic;
    line-height: 26px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 5px;
  }
  .files-wr .btn-del-file {
    margin-left: 5px;
    width: 20px;
    height: 20px;
    border-radius: 3px;
    color: #fff;
    text-align: center;
    padding: 2px;
    font-size: 11px;
    transition: all 0.2s;
    background-color: #be0000;
  }
  .files-wr .btn-del-file:hover, .files-wr .btn-del-file:focus {
    background-color: #ca4a17;
  }

  .modal-title{
    color: #222 !important;
    font-weight: 500 !important;
  }

  .modal-header{
    background-color: #ffffff !important;
  }

  .modal-footer{
    border-top: 1px solid #e0e0e0;
    padding: 10px 15px;
    display: flex;
    justify-content: start !important;
  }

  .modal-body .form-control{
    max-width: 90%;
    padding: 3px 5px !important;
    font-size: 12px !important;
  }

  .txtarea .form-control{
    max-width: 100%;
  }

  .modal-footer .btn-sec{
    font-size: .8125rem !important;
  }


  .actvty h5 {
    font-size: 15px;
    padding: 0 10px;
    color: black;
    font-weight: 600;
}

.schdul-box{
    background-color: #f6fafd;
    padding: 10px;
}

.schdul-box h6{
    padding-left: 0;
}

.schdul-box h6 span{
    font-weight: 400;
    color: #6c757d;
}

.schdul-box h5{
    color: #545454;
}

.schdul-box h5 span{
    color: #6c757d;
    font-size: .7rem;
}

#follow .fa-check{
    margin-right: 5px;
    font-size: 11px;
}








/****** login,register ******/




.account-body {
    width: 100%;
    height: 100vh
}

.account-body.accountbg {
    background-image: url("../img/auth-bg.png");
    background-position: center center;
    background-size: cover;
    background-repeat: repeat;
    background-color: rgba(0, 0, 0, 0.04)
}

.account-body .auth-header-box {
    background-color: #000000;
}

.account-body .auth-header-box h4 {
    color: #fff
}

.account-body .account-social {
    text-align: center
}

.account-body .account-social h6 {
    color: #303e67
}

.account-body .account-social h6:after {
    display: inline-block;
    margin: 0 6px 4px 6px;
    content: " ";
    text-shadow: none;
    border: 1px dashed #e3ebf6;
    width: 120px
}

.account-body .account-social h6:before {
    display: inline-block;
    margin: 0 6px 4px 6px;
    content: " ";
    text-shadow: none;
    border: 1px dashed #e3ebf6;
    width: 120px
}

.account-body .account-social a i {
    width: 36px;
    height: 36px;
    line-height: 36px;
    text-align: center;
    display: inline-block;
    border-radius: 50%;
    font-size: 14px;
    z-index: 5
}



.auth-bg {
    background-image: url("../images/auth-bg.png");
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    background-color: rgba(0, 0, 0, 0.04)
}

.account-body .nav-border.nav.nav-pills {
    background-color: transparent;
    border-bottom: 1px dashed #e3ebf6;
    line-height: 36px;
}

.account-body .nav-border .nav-item {
    margin-bottom: -2px;
    width: 50%;
    text-align: center;
}

.account-body .nav-pills .nav-link{
    border-radius: 0;
    padding: 0.2rem 1rem;
    font-size: .8125rem;
    font-weight: 500;
    background: #ffffff;
}

.account-body .nav-border .nav-item.show .nav-link, .account-body .nav-border .nav-link.active{
    background: #f7f7f9;
    border-bottom: 2px solid #6e56a3;
    color: #6e56a3;
}

.auth-form .form-label {
    margin-bottom: 0.5rem;
    color: #656d9a;
}

.auth-form .form-control {
    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
    font-size: .8125rem;
    font-weight: 400;
    line-height: 1.5;
    color: #303e67;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #e3ebf6;
    appearance: none;
    border-radius: 0.25rem;
    transition: border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out;
}


.auth-form input::placeholder {
    color: #656d9a;
    opacity: 1; /* Firefox */
  }
  
  .auth-form input:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color: #656d9a;
  }
  
  .auth-form input::-ms-input-placeholder { /* Microsoft Edge */
   color: #656d9a;
   /* color: #7083bb; */
  }

  .text-mutedd {
    color: #656d9a !important;
}

.text-end {
    text-align: right !important;
}

#remembr, #terms {
    accent-color: #6e56a3;
}

.remembr label{
    font-weight: 400;
}

.dont{
    font-size: .815rem;
}

.vh-100 {
    height: 100vh !important;
}

.dataTables_length label{
    display: flex;
    align-items: center;
}

.dataTables_wrapper .dataTables_length select{
    margin: 0 5px;
}

.dataTables_wrapper .next{
    opacity: 1;
}

.dataTables_wrapper .dataTables_length {
    float: left;
    margin: 7px 0 0 !important;
}

.dataTables_wrapper .dataTables_filter {
    float: right;
    text-align: right;
    margin: 7px 0 0 !important;
}

table.dataTable thead th, table.dataTable thead td {
    padding: 7px 10px !important;
    background-color: #f3f6f9;
    border: 1px solid #eaf0f9;
}

table.dataTable tbody td {
    padding: 8px 10px;
    font-size: 13px;
}

table.dataTable {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button{
    padding: 0.2em 0.7em !important;
    font-size: 13px;
}

.dataTables_info{
    font-size: 13px;
}

.btn-soft-warning {
    background-color: rgba(255, 184, 34, 0.18);
    color: #ffb822;
    font-size: 12px;
    font-weight: 400;
}

.badge.badge-soft-danger {
    background-color: rgba(245, 50, 92, 0.15) !important;
    color: #f5325c !important;
    font-size: 12px;
    font-weight: 400;
}

.badge.badge-soft-primary {
    background-color: rgba(23, 97, 253, 0.15) !important;
    color: #1761fd !important;
    font-size: 12px;
    font-weight: 400;
}
.badge.badge-soft-success {
    background-color: rgba(3, 216, 127, 0.15) !important;
    color: #03d87f !important;
    font-size: 12px;
    font-weight: 400;
}

.buttns{
    border-bottom: 1px solid #dee2e6;
    padding: 7px 5px;
    background: #f3f6f9;
}