.classS, .form-horizontal .control-label.text-left {
    text-align: left
}

.l3-loading, .l3loading {
    z-index: 5000 !important
}

.clsPending, .clsReject {
    vertical-align: middle !important
}

.CKKM, .clfontsize1, .nameEmployee {
    text-transform: uppercase
}

.cls-note, .hintPass {
    font-style: italic
}

.ca-booking-day, .detailTabReport {
    border-spacing: 0;
    table-layout: fixed
}

.mgr5 {
    margin-right: 5px
}

.mgl5 {
    margin-left: 5px
}

.mgl10 {
    margin-left: 10px
}

.mgl15 {
    margin-left: 15px
}

.mgr15 {
    margin-right: 15px
}

.mgr20 {
    margin-right: 20px
}

.mgr10 {
    margin-right: 10px
}

.mglr0 {
    margin: 0 !important
}

.mgt10 {
    margin-top: 10px
}

.mgt5 {
    margin-top: 5px !important
}

.mgt3 {
    margin-top: 3px
}

.mgt7 {
    margin-top: 7px
}

.mgb5 {
    margin-bottom: 5px
}

.pdt0 {
    padding-top: 0 !important
}

.pdt5 {
    padding-top: 5px !important
}

.pdt10 {
    padding-top: 10px
}
.pd5{
    padding: 5px !important;
}

.no-wrap {
    white-space: nowrap !important
}

.pointer {
    cursor: pointer
}

.l3-border-top-color {
    border-top: 3px solid #00c0ef
}

.bg {
    background-color: #ecf0f5 !important
}

.logolarge {
    margin-bottom: 50px
}

.logolarge img {
    max-width: 500px;
    max-height: 200px
}

.logodg {
    background: url(../images/logo.png) 5px 3px no-repeat;
    background-size: 32px 32px;
    padding-left: 40px
}

.login-box-body img, .panel-heading img {
    margin-top: -10px
}

.L3-login .panel {
    border: 3px solid #337ab7
}

.L3-login .panel-heading {
    border-top-left-radius: 0;
    border-top-right-radius: 0
}

.imgborder {
    border: 1px solid #ccc
}

.nm {
    cursor: default !important
}

.leftRowView, a {
    cursor: pointer
}

.L3-login .form-control-feedback {
    line-height: 34px !important
}

.bgWhite {
    background: #FFF !important;
    color: #000
}

.bgWhite td, .bgWhite th {
    padding: 5px
}

.ui-widget {
    font-family: 'Source Sans Pro', Arial, sans-serif !important;
    font-size: 1em
}

.classD, .l3-loading {
    text-align: center
}

.liketext {
    margin-top: 5px;
    margin-bottom: 5px;
    position: relative
}

.liketext1 {
    margin-top: 3px;
    margin-bottom: 5px;
    position: relative
}

.pdlr5 {
    padding-left: 5px;
    padding-right: 5px
}

.liketext label {
    margin-bottom: 0;
    font-weight: 400;
    display: inline-block
}

label.lbl-value{
    font-weight: bold;
}



.classN, .clfontsize1, .labelDT {
    font-weight: 700
}

.padleft10 {
    padding-left: 10px
}

.width120 {
    width: 105px
}

.dropdown:hover {
    background: #2C3B41 !important
}

.input-group-addon {
    padding: 4px 12px !important
}

.leftFormDuyet, .leftListApp {
    background: #1c2d3f;
    padding-top: 6px
}

.leftFormDuyet {
    float: left;
    width: 25%;
    margin-left: 1px
}

.bodyApp {
    margin: 0 -5px !important
}

.rightContent {
    margin: 5px -10px !important
}

.pdl25percent {
    padding-left: 28%;
    position: absolute
}

.leftRowView {
    float: left;
    width: 100%;
    margin-bottom: 5px;
    background: #2b3f54;
    color: #fcfcfc;
    border-radius: 6px;
    padding: 5px
}

.leftRowView:hover {
    border: 1px solid #fff
}

.l3_thead_blue > tr > th, .l3_thead_gray th {
    border: 1px solid #bbb !important
}

.leftRowView.active {
    background: #fff;
    color: #000
}

.wpopsidebar {
    height: 28px;
    margin: 5px 0;
    background: #f1f1f1
}

.alert, .modal .form-group {
    margin-bottom: 7px
}

.wpopsidebar button {
    margin-left: -15px
}

.labelDT {
    line-height: 25px;
    font-size: 18px;
    margin-left: -30px;
    color: #007bb6
}

.l3loading {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, .7);
    /*opacity:0.5*/
}

.l3-loading, .l3loading > .fa {
    position: absolute;
    top: 50%;
    left: 50%
}

.l3loading > .fa {
    margin-left: -15px;
    margin-top: -15px;
    color: #000;
    font-size: 30px
}

.l3-loading {
    padding-top: 10px;
    width: 150px;
    height: 50px;
    background: #EFEFEF;
    font-size: 15px
}

.l3-loading > .fa {
    color: #000;
    font-size: 25px
}

.thpd5 th {
    padding: 5px 0
}

.contenttab > .fa {
    margin-top: 35%;
    margin-left: 49%;
    font-size: 30px
}

.popclose {
    color: #fff;
    font-size: 20px;
    margin-right: -15px
}

.clsPending {
    background: #ffc !important;
    padding: 5px 10px
}

.clsApprove {
    background: #1392e9 !important;
    padding: 5px 10px;
    color: #fff
}

.clsReject {
    background: #f39c12 !important;
    padding: 5px 10px
}

.lineheight20 {
    line-height: 20px
}

#mPopUp button {
    padding: 3px 12px !important
}

.alert-success-approve {
    background: #f7e1b5;
    font-style: italic;
    margin-top: 40px
}

.nameEmployee {
    color: #0089db
}

.CKKM {
    height: 25px;
    line-height: 25px;
    background: #eee
}

@media (min-width: 768px) {
    .nlogo {
        position: absolute;
        left: 40%
    }
}

@media (max-width: 767px) {
    .nlogo {
        position: absolute;
        left: 55px
    }
}

.classN {
    text-align: right
}

.classTT {
    text-align: center !important;
    width: 70px !important
}

.checkbox_min {
    width: 40px !important;
    text-align: center
}

.action_grid {
    width: 30px !important
}

.str_level1 {
    width: 80px !important
}

.str_level1_large {
    width: 100px !important
}

.table-striped > tbody > tr:nth-of-type(odd), .table > tbody > tr:nth-of-type(odd) {
    background-color: #F9FAFE
}

table.dataTable thead > tr > th {
    padding-right: 0;
    vertical-align: middle
}

.l3_thead_blue {
    background-color: #468dbc;
    color: #fff
}

.l3_thead_gray {
    background-color: #d1d1d1
}

.l3_thead_blue > tr > th {
    vertical-align: middle !important;
    text-align: center !important
}

.modal-header {
    background: #367FA9;
    color: #fff
}

.ctrlNM {
    padding: 0
}

.ctrlNM input.form-control, .ctrlNM select.form-control, .modal input.form-control, .modal select.form-control, div.form-control {
    height: 26px;
    line-height: 26px;
    padding: 0 12px
}

.modal input[type=number].form-control {
    padding-right: 0
}

.sidebar-toggle {
    background: #3c8dbc !important;
    width: 50px
}

.alert {
    padding: 6px 15px
}

.modal-body {
    padding: 0 6px
}

.modal-header {
    padding: 0 2px
}

.modal-title {
    font-size: 17px
}

.modal-footer {
    padding: 0 5px
}

.close {
    background: #fff;
    opacity: 1;
    color: #fff
}

.pd10 {
    padding: 10px
}

.bdr0 {
    border-radius: 0 !important
}

.bdt {
    border-top: 1px #ccc solid
}

.clfontsize {
    font-size: 15px;
    line-height: 20px
}

.clfontsize1 {
    font-size: 16px
}

.hintPass, .lbl-normal {
    font-weight: 400;
    margin-top: 4px !important;
}

textarea {
    resize: none;
}

.modal-header:hover {
    cursor: move
}

.form-group.required .control-label:after {
    content: " *";
    color: red
}

.no-padding {
    padding: 0 !important
}

.bdpd {
    padding: 5px 0;
    border: 1px solid #ccc;
    border-left: none;
    border-right: none
}

#maintabs {
    margin-top: 10px
}

.text-while {
    color: #FFF !important
}

.contenttab {
    margin-top: -10px;
    background: #FFF;
    padding-top: 10px;
    border: 1px solid #AAA;
    border-top: none;
    overflow-x: hidden !important
}

:required {
    background: #EFF9FF;
    /*background: #DAE6F0;*/
}

:disabled {
    /*background-color: #EEE !important*/
    background-color: #ddd !important
}

.pdl0 {
    padding-left: 0 !important
}

.pdl5 {
    padding-left: 5px !important
}

.pd0 {
    padding: 0 !important
}

.slformduyet {
    background: #1E282C;
    color: #Fff
}

#frmduyet button {
    margin-top: 3px
}


.smallbtn {
    padding: 2px 12px !important;
    margin-top: 0;
    /*background-color: #fff;*/
}

#mPopUpSendMail .smallbtn{
    background-color: #204d74;
}

.smallbtn.form-control {
    line-height: 21px !important
}

.formduyet {
    width: 99%;
    margin: 1vh .5% !important
}

.formuyquyen {
    width: 900px !important;
    margin: 2vh auto !important
}

.formduyet > .modal-content {
    margin-top: 0;
    height: 98vh;
    background: #FFF
}

.overfl {
    overflow: auto;
    height: 500px
}

.main-footer {
    text-align: center
}

.GroupDesc {
    font-size: 18px;
    width: 100%;
    padding: 10px 0
}

.GroupDesc i {
    margin-right: 5px
}

.MyPageDesc {
    width: 100%;
    padding: 5px;
    margin-left: 15px;
    box-sizing: content-box
}

.MyPageDesc a {
    color: #337AB7
}

.modal-header .close {
    margin-top: 5px
}

.no-border {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    border-right: none !important
}

.tab-refresh {
    padding: 6px 5px 6px 0 !important;
    border-left: none !important
}

.pdr0 {
    padding-right: 0 !important
}

.pdr5 {
    padding-right: 5px !important
}

.pdr15 {
    padding-right: 15px !important
}

.prl {
    position: relative;
    padding-right: 25px !important
}

.btn-refresh {
    position: absolute;
    top: 0;
    padding: 6px 3px 0;
    right: 0;
    z-index: 1000;
    height: 100%
}

.paddingleft0, .pdl0mg5 {
    padding-left: 0 !important
}

.scrollable {
    height: 100%;
    overflow-y: auto
}

.pdl0mg5 {
    margin: 5px 0 !important
}

.leftpane {
    background: #222d32;
    padding: 10px 0
}

.hdDetail, .lbgray {
    background: #eee
}

.str_level4 {
    width: 250px !important
}

#tbla td, #tbla th, #tbla tr {
    border: 1px solid #d1d1d1;
    border-collapse: collapse
}

.tblHH td, .tblHH th, .tblHH tr {
    border: 1px solid #e1e1e1;
    border-collapse: collapse
}

.fa-3x {
    font-size: 3em
}

.str_level2 {
    width: 130px !important
}

.str_level3 {
    width: 170px !important
}

.dtformduyet, .duyetHH {
    border: 1px solid #ccc;
    border-radius: 4px;
    padding-bottom: 10px;
}

div.duyetHH {
    height: 35px;
    line-height: 35px;
    display: inline-flex;
}

.lbgray {
    width: 120px;
    padding: 2px 5px;
    text-align: right
}

.captionOrange, .headerDiagram, .statuscolor, .tbl th {
    text-align: center
}

.gridView {
    height: 450px;
    overflow: auto
}

.gridView.height150 {
    width: 100%;
    height: 150px !important
}

.gridView table, .gridView td, .gridView th, .gridView tr {
    border: 1px solid #d1d1d1;
    border-collapse: collapse
}

.gridView tbody tr:nth-child(2n+1) {
    background: #f1f1f1
}
/*Tạm thời rem lại do đụng nhiều đến css các plugin khác*/
/*td {*/
    /*padding: 5px !important;*/
    /*vertical-align: top*/
/*}*/

.footerMessage {
    margin: 5px 0;
    padding-left: 30px;
    padding-right: 30px
}

.legend {
    font-size: 14px;
    font-weight: 700;
    color: #3C8DBC;
    margin-bottom: 10px !important
}

.no-border {
    border: none;
    background-color: transparent
}

.nav-tabs-custom > .nav-tabs > li {
    border-left: 1px solid transparent;
    border-right: 1px solid transparent
}

.nav-tabs-custom > .nav-tabs > li.active {
    border-left-color: #3c8dbc;
    border-right-color: #3c8dbc
}

.nav-tabs-custom > .tab-content {
    border-top: 1px solid #3c8dbc
}

tr.selected {
    background-color: #AAB7D1 !important
}

#mPopUpConfirm {
    line-height: 26px !important
}

div.gridbox {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box
}

.homeadmin {
    float: right;
    margin-top: 3px;
    color: #Fff
}

a.disabled, a.no-action {
    pointer-events: none;
    cursor: default
}

.text-white {
    color: #fefefe !important
}

.panel-heading #btnCollapse {
    margin-top: -3px
}

.hdSpin::-webkit-inner-spin-button, .hdSpin::-webkit-outer-spin-button {
    -webkit-appearance: none !important;
    margin: 0
}

.width85pc {
    width: 85%;
    float: left
}

.width15pc {
    width: 15%;
    float: left
}

.message {
    margin-top: 20px
}

.tbl td, .tbl th, .tbl tr {
    border: 1px solid #d1d1d1;
    border-collapse: collapse;
    padding: 0 5px !important;
    vertical-align: middle !important
}

.statuscolor {
    height: 25px;
    width: 150px;
    float: left;
    border: 1px solid #000;
    margin: 3px 3px 0 0;
    display: table;
    vertical-align: middle
}

.bg-dimgray, .headerDiagram {
    vertical-align: middle !important
}

.no-office {
    background-color: #FFF;
    border: none;
    padding: 0 !important
}

.office {
    display: block !important;
    padding: 2px;
    margin: 1px;
    border: 1px solid #DEE7EE;
    min-width: 100px;
    height: 60px;
    float: left
}

.fill-div {
    position: relative;
    width: 100%
}

div.mrgl {
    margin-left: 4px !important
}

.headerDiagram {
    font-weight: 700;
    background-color: #DDD;
    z-index: 10;
    border: 1px solid #000;
    margin: -1px;
    position: relative
}

.captionOrange, .ps_absolute {
    position: absolute
}

.storey {
    z-index: 12 !important
}

.leftDiagram {
    height: 63px
}

.cls_success {
    padding-top: 20%
}

.empployee {
    border: 1px solid #ccc;
    min-height: 70px;
    padding: 5px
}

.empployeeW15 {
    border: 1px solid #ccc;
    padding: 5px 5px 0px 15px;
    border-radius: 4px
}

.listDuyet {
    height: 240px;
    border: 1px solid #ccc
}

.listDuyetW15 {
    padding: 0 0px 0 0
}

.height100 {
    height: 120px;
    border-bottom: 1px #fefefe solid
}

.captionOrange {
    background: #EB5100;
    background-color: rgba(235, 81, 0, .6);
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    border-radius: 5px;
    right: 30px;
    bottom: 30px;
    width: 350px;
    height: 34px;
    padding: 3px;
    opacity: .75
}

.IsCancel1 {
    background: #ff0;
    text-decoration: underline
}

.pq-grid .pq-editor-focus {
    outline: 0;
    border: 1px solid #bbb;
    border-radius: 6px;
    background-image: linear-gradient(#e6e6e6, #fefefe);
    margin-top: 4px;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e6e6e6', endColorstr='#fefefe');
    background: -webkit-gradient(linear, left top, left bottom, from(#e6e6e6), to(#fefefe));
    background: -moz-linear-gradient(top, #e6e6e6, #fefefe);
    height: 92%;
    white-space: nowrap
}

.so_sum input[type=text] {
    text-align: right
}

.hr {
    border-bottom: 1px #ccc solid;
    height: 1px;
    width: 100%
}

.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #ccc !important
}

.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000 !important
}

.mCSB_inside > .mCSB_container {
    margin-right: 15px
}

select {
    height: 24px
}

.modal-content .form-horizontal .control-label {
    padding-top: 6px
}

.select2-container .select2-selection--single .select2-selection__rendered {
    margin-top: -6px
}

.flr56pc {
    float: right;
    width: 56%
}

.flw0pc, .flw100pc, .flw10pc, .flw11pc, .flw12pc, .flw13pc, .flw14pc, .flw15pc, .flw16pc, .flw17pc, .flw18pc, .flw19pc, .flw1pc, .flw20pc, .flw21pc, .flw22pc, .flw23pc, .flw24pc, .flw25pc, .flw26pc, .flw27pc, .flw28pc, .flw29pc, .flw2pc, .flw30pc, .flw31pc, .flw32pc, .flw33pc, .flw34pc, .flw35pc, .flw36pc, .flw37pc, .flw38pc, .flw39pc, .flw3pc, .flw40pc, .flw41pc, .flw42pc, .flw43pc, .flw44pc, .flw45pc, .flw46pc, .flw47pc, .flw48pc, .flw49pc, .flw4pc, .flw51pc, .flw52pc, .flw53pc, .flw54pc, .flw55pc, .flw56pc, .flw57pc, .flw58pc, .flw59pc, .flw5pc, .flw60pc, .flw61pc, .flw62pc, .flw63pc, .flw64pc, .flw65pc, .flw66pc, .flw67pc, .flw68pc, .flw69pc, .flw6pc, .flw70pc, .flw71pc, .flw72pc, .flw73pc, .flw74pc, .flw75pc, .flw76pc, .flw77pc, .flw78pc, .flw79pc, .flw7pc, .flw80pc, .flw81pc, .flw82pc, .flw83pc, .flw84pc, .flw85pc, .flw86pc, .flw87pc, .flw88pc, .flw89pc, .flw8pc, .flw90pc, .flw91pc, .flw92pc, .flw93pc, .flw94pc, .flw95pc, .flw96pc, .flw97pc, .flw98pc, .flw99pc, .flw9pc {
    float: left
}

.flw0pc {
    width: 0
}

.flw1pc {
    width: 1%
}

.flw2pc {
    width: 2%
}

.flw3pc {
    width: 3%
}

.flw4pc {
    width: 4%
}

.flw5pc {
    width: 5%
}

.flw6pc {
    width: 6%
}

.flw7pc {
    width: 7%
}

.flw8pc {
    width: 8%
}

.flw9pc {
    width: 9%
}

.flw10pc {
    width: 10%
}

.flw11pc {
    width: 11%
}

.flw12pc {
    width: 12%
}

.flw13pc {
    width: 13%
}

.flw14pc {
    width: 14%
}

.flw15pc {
    width: 15%
}

.flw16pc {
    width: 16%
}

.flw17pc {
    width: 17%
}

.flw18pc {
    width: 18%
}

.flw19pc {
    width: 19%
}

.flw20pc {
    width: 20%
}

.flw21pc {
    width: 21%
}

.flw22pc {
    width: 22%
}

.flw23pc {
    width: 23%
}

.flw24pc {
    width: 24%
}

.flw25pc {
    width: 25%
}

.flw26pc {
    width: 26%
}

.flw27pc {
    width: 27%
}

.flw28pc {
    width: 28%
}

.flw29pc {
    width: 29%
}

.flw30pc {
    width: 30%
}

.flw31pc {
    width: 31%
}

.flw32pc {
    width: 32%
}

.flw33pc {
    width: 33%
}

.flw34pc {
    width: 34%
}

.flw35pc {
    width: 35%
}

.flw36pc {
    width: 36%
}

.flw37pc {
    width: 37%
}

.flw38pc {
    width: 38%
}

.flw39pc {
    width: 39%
}

.flw40pc {
    width: 40%
}

.flw41pc {
    width: 41%
}

.flw42pc {
    width: 42%
}

.flw43pc {
    width: 43%
}

.flw44pc {
    width: 44%
}

.flw45pc {
    width: 45%
}

.flw46pc {
    width: 46%
}

.flw47pc {
    width: 47%
}

.flw48pc {
    width: 48%
}

.flw49pc {
    width: 49%
}

.flw50pc {
    float: left;
    width: 50%
}

.flw51pc {
    width: 51%
}

.flw52pc {
    width: 52%
}

.flw53pc {
    width: 53%
}

.flw54pc {
    width: 54%
}

.flw55pc {
    width: 55%
}

.flw56pc {
    width: 56%
}

.flw57pc {
    width: 57%
}

.flw58pc {
    width: 58%
}

.flw59pc {
    width: 59%
}

.flw60pc {
    width: 60%
}

.flw61pc {
    width: 61%
}

.flw62pc {
    width: 62%
}

.flw63pc {
    width: 63%
}

.flw64pc {
    width: 64%
}

.flw65pc {
    width: 65%
}

.flw66pc {
    width: 66%
}

.flw67pc {
    width: 67%
}

.flw68pc {
    width: 68%
}

.flw69pc {
    width: 69%
}

.flw70pc {
    width: 70%
}

.flw71pc {
    width: 71%
}

.flw72pc {
    width: 72%
}

.flw73pc {
    width: 73%
}

.flw74pc {
    width: 74%
}

.flw75pc {
    width: 75%
}

.flw76pc {
    width: 76%
}

.flw77pc {
    width: 77%
}

.flw78pc {
    width: 78%
}

.flw79pc {
    width: 79%
}

.flw80pc {
    width: 80%
}

.flw81pc {
    width: 81%
}

.flw82pc {
    width: 82%
}

.flw83pc {
    width: 83%
}

.flw84pc {
    width: 84%
}

.flw85pc {
    width: 85%
}

.flw86pc {
    width: 86%
}

.flw87pc {
    width: 87%
}

.flw88pc {
    width: 88%
}

.flw89pc {
    width: 89%
}

.flw90pc {
    width: 90%
}

.flw91pc {
    width: 91%
}

.flw92pc {
    width: 92%
}

.flw93pc {
    width: 93%
}

.flw94pc {
    width: 94%
}

.flw95pc {
    width: 95%
}

.flw96pc {
    width: 96%
}

.flw97pc {
    width: 97%
}

.flw98pc {
    width: 98%
}

.flw99pc {
    width: 99%
}

.flw100pc {
    width: 100%
}

.ps_relative, .rounded-list a {
    position: relative
}

.upload-container {
    border: 1px solid #c9cccf;
    border-radius: 5px;
    padding: 5px
}

.upload-bg {
    border: 5px dotted #c9cccf;
    background: url(../images/placeholder-add.png) 350px 180px no-repeat;
    background-size: 150px 150px;
    cursor: pointer
}

.thumnail_video {
    background: url(../images/placeholder-add.png) 350px 180px no-repeat;
    background-size: 150px 150px
}

.multiselect-container > li.disabled > a > label {
    color: #000
}

.multiselect-container > li:last-child {
    border-top: 1px #aaa solid;
    margin: 5px 0;
    padding: 5px 0
}

.multiselect-container > li:last-child button {
    margin-bottom: 5px
}

.height136 {
    height: 136px
}

.multiselect-container {
    border: 1px solid #337AB7
}

/*đây là css hiển thi tooltip khi bắt buộc nhập trên lưới. Không hiểu tại sao lại tắt đi. Giờ Khanh mở trở lại*/
.ui-tooltip {
    /*display: none !important*/
}

.cls-note {
    line-height: 25px
}

.input-group-btn > .btn {
    padding: 6px 12px !important
}

.nav-tabs > li > a {
    padding: 5px 15px !important
}

.bg-dimgray {
    background-color: #9F9F9F !important;
    color: #fff !important
}

.clsPending div, .clsReject div {
    padding: 0 !important
}

.gridHeight2Row {
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center
}

.contenttab input.form-control, .contenttab select.form-control, #myModal select.form-control {
    height: 26px !important;
    padding: 1px 12px
}

#divW12F3404 table > thead {
    background-color: #E4ECF7;
    line-height: 31px;
    color: #666
}

#divW12F3404 table > tbody, #divW12F3404 table > tfoot {
    line-height: 31px
}

#divW12F3404 table {
    border: 1px solid red
}

.glyphicon-bin {
    font-size: 85% !important;
    color: #f00000
}

.gridColRequire {
    background: beige !important
}

.gridColReadonly {
    background: #e0e0e0 !important
}

.gridColOption {
    background: #fff !important
}

.btn_custom {
    border: 1px solid #7EB4EA;
    /*width: 80px;*/
    background-color: #ccc;
    color: #000;
    font-size: 14px;
    padding: 2px 10px !important;
}

@media (min-width: 768px) {
    body {
        overflow: hidden !important
    }
}

@media (max-width: 767px) {
    .clfontsize {
        font-size: 14px
    }

    .left-side, .main-sidebar {
        padding-top: 0 !important
    }
}

@media (width: 320px) {
    .clfontsize {
        font-size: 13px
    }
}

.cls_thumbnail {
    background: url(../images/thumbnail.png) no-repeat;
    background-size: 185px 100px;
    border: 1px solid #c9cccf;
    width: 185px;
    height: 100px;
    border-radius: 3px
}

.box-footer {
    border-top: 2px solid #337ab7
}

.logodgReport {
    background: url(../images/logo.png) 10px 0 no-repeat;
    background-size: 32px 32px
}

.logodgCompany {
    background: url(../images/companylogo-large.png) 10px 0 no-repeat;
    background-size: 85px 32px
}

.col-full {
    width: 100% !important
}

.text-parent > td {
    color: #207CAF !important
}

#divConfirm .modal-dialog {
    min-width: 200px;
    width: auto;
    max-width: 600px
}

.pq-grid-row > td {
    vertical-align: middle
}

.popover {
    z-index: 1015 !important;
    min-width: 150px !important;
    width: 200px;!important;
    max-width: 600px !important;
}

.info-form {
    -webkit-appearance: none;
    padding: 0;
    cursor: pointer;
    background: 0 0;
    border: 0;
    float: right;
    font-weight: 700;
    line-height: 1;
    text-shadow: 0 1px 0 #fff;
    filter: alpha(opacity=20);
    opacity: 1;
    color: #fff;
    margin-top: 11px;
    margin-right: 5px
}

.info-form.app {
    font-size: 17px;
    margin-top: 7px
}

.noneOverflow {
    overflow: hidden !important
}

.content_image {
    height: 150px;
    min-height: 150px !important
}

.video-thumb {
    height: 80px;
    margin-top: 5px;
    padding: 10px 10px 0;
    background-color: #000;
    border-radius: 8px;
    border: 1px solid
}

#srollerThumbnail .active {
    border: 1px solid #0073b7;
    cursor: default
}

.listalbum {
    display: flex;
    flex-wrap: wrap
}

.listalbum a {
    display: inline-block;
    margin-bottom: 8px;
    text-decoration: none;
    color: #000;
    margin-left: 7px;
    margin-right: 7px
}

@media screen and (min-width: 50em) {
    .listalbum a {
        width: calc(20% - 14px)
    }
}

.listalbum a:hover img {
    transform: scale(1.15)
}

.listalbum a figure {
    height: 100%;
    margin: 0;
    overflow: hidden;
    text-align: center
}

.listalbum a figure div {
    width: 100%;
    background-color: #E7E7E7
}

.listalbum a figcaption {
    margin-top: 5px;
    text-align: center;
    color: #0073b7 !important
}

.listalbum a img {
    max-width: 100%;
    height: 110px;
    background: #ccc;
    transition: transform .2s ease-in-out;
    border: 1px solid #E9E9E9
}

div#divListBookmark {
    margin-top: .5em;
    padding-top: .5em
}

ol.rounded-list {
    list-style: none;
    font-size: 15px;
    padding-left: 0 !important;
    margin-bottom: 4em;
    margin-top: -10px !important;
    text-shadow: 0 1px 0 rgba(255, 255, 255, .5);
    -moz-column-count: 2;
    -moz-column-gap: 20px;
    -webkit-column-count: 2;
    -webkit-column-gap: 20px;
    column-count: 2;
    column-gap: 20px
}

ol.rounded-list li {
    break-inside: avoid-column;
    -webkit-column-break-inside: avoid
}

.rounded-list a {
    display: block;
    padding: .5em .4em .4em 2em;
    margin-left: 1.2em;
    margin-right: 1.2em;
    margin-bottom: .7em;
    background: #ddd;
    color: #444;
    text-decoration: none;
    border-radius: .3em
}

.rounded-list a:hover {
    background: #9BB2BF
}

.menu-bookmark:before, .rounded-list a:before {
    content: "\f005";
    font-family: FontAwesome;
    background: #87ceeb;
    height: 2em;
    width: 2em;
    text-align: center;
    font-weight: 700
}

.rounded-list a:hover:before {
    transform: rotate(360deg);
    -webkit-transform: none
}

.rounded-list a:before {
    position: absolute;
    left: -1.3em;
    top: 56%;
    margin-top: -1.3em;
    line-height: 2em;
    border: .3em solid #fff;
    border-radius: 2em;
    transition: all .3s ease-in
}

.menu-bookmark:before {
    border: 3px solid #fff;
    border-radius: 2em;
    transition: all .3s ease-out;
    color: #000;
    padding: 1px 2px
}

.menu-bookmark:hover {
    transform: rotate(360deg)
}

.cancel-book, .edit-book, .save-book {
    float: right;
    margin-top: 1em;
    cursor: pointer;
    margin-right: -1em
}

#divBinBookmark span.over {
    opacity: 1 !important;
    display: inline-block;
    border-radius: 100px;
    box-shadow: 0 0 40px #888;
    padding: 5px 10px;
    font-size: 30px
}

.header-icon-info {
    background-color: #609BBD;
    border-color: #446E98;
    border-radius: 0 0 0 5px !important;
    padding: 0 8px
}

.header-icon-close, .header-icon-close1 {
    border-color: #446E98 !important;
    padding: 0 16px !important;
    opacity: .9
}

.header-icon-close {
    background-color: #3c7aa7 !important;
    border-radius: 0 0 5px !important;
    background: #eff2f4;
    background: -moz-linear-gradient(top, rgba(239, 242, 244, 1) 0, rgba(204, 109, 108, 1) 0, rgba(206, 84, 80, 1) 19%, rgba(135, 9, 5, 1) 50%, rgba(206, 84, 80, 1) 87%, rgba(204, 109, 108, 1) 100%, rgba(229, 231, 232, 1) 100%);
    background: -webkit-linear-gradient(top, rgba(239, 242, 244, 1) 0, rgba(204, 109, 108, 1) 0, rgba(206, 84, 80, 1) 19%, rgba(135, 9, 5, 1) 50%, rgba(206, 84, 80, 1) 87%, rgba(204, 109, 108, 1) 100%, rgba(229, 231, 232, 1) 100%);
    background: linear-gradient(to bottom, rgba(239, 242, 244, 1) 0, rgba(204, 109, 108, 1) 0, rgba(206, 84, 80, 1) 19%, #bf332f 50%, rgba(206, 84, 80, 1) 87%, rgba(204, 109, 108, 1) 100%, rgba(229, 231, 232, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eff2f4', endColorstr='#e5e7e8', GradientType=0)
}

.header-icon-info:hover {
    background: #b7deed;
    background: -moz-linear-gradient(top, #b7deed 0, #71ceef 34%, #21b4e2 51%, #b7deed 100%);
    background: -webkit-linear-gradient(top, #b7deed 0, #71ceef 34%, #21b4e2 51%, #b7deed 100%);
    background: linear-gradient(to bottom, #b7deed 0, #71ceef 34%, #21b4e2 51%, #b7deed 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#b7deed', endColorstr='#b7deed', GradientType=0)
}

.header-icon-close:hover {
    background: #f3c5bd;
    background: -moz-linear-gradient(top, #f3c5bd 0, #996868 0, #990303 46%, #8e0202 52%, #840402 59%, #f60 87%);
    background: -webkit-linear-gradient(top, #f3c5bd 0, #996868 0, #990303 46%, #8e0202 52%, #840402 59%, #f60 87%);
    background: linear-gradient(to bottom, #f3c5bd 0, #996868 0, #990303 46%, #8e0202 52%, #840402 59%, #f60 87%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f3c5bd', endColorstr='#ff6600', GradientType=0)
}

.header-icon-close1 {
    background-color: #3c7aa7 !important;
    border-radius: 0 0 5px 5px !important;
    background: #eff2f4;
    background: -moz-linear-gradient(top, rgba(239, 242, 244, 1) 0, rgba(204, 109, 108, 1) 0, rgba(206, 84, 80, 1) 19%, rgba(135, 9, 5, 1) 50%, rgba(206, 84, 80, 1) 87%, rgba(204, 109, 108, 1) 100%, rgba(229, 231, 232, 1) 100%);
    background: -webkit-linear-gradient(top, rgba(239, 242, 244, 1) 0, rgba(204, 109, 108, 1) 0, rgba(206, 84, 80, 1) 19%, rgba(135, 9, 5, 1) 50%, rgba(206, 84, 80, 1) 87%, rgba(204, 109, 108, 1) 100%, rgba(229, 231, 232, 1) 100%);
    background: linear-gradient(to bottom, rgba(239, 242, 244, 1) 0, rgba(204, 109, 108, 1) 0, rgba(206, 84, 80, 1) 19%, rgba(135, 9, 5, 1) 50%, rgba(206, 84, 80, 1) 87%, rgba(204, 109, 108, 1) 100%, rgba(229, 231, 232, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eff2f4', endColorstr='#e5e7e8', GradientType=0)
}

.header-icon-close1:hover {
    background: #f3c5bd;
    background: -moz-linear-gradient(top, #f3c5bd 0, #996868 0, #990303 46%, #8e0202 52%, #840402 59%, #f60 87%);
    background: -webkit-linear-gradient(top, #f3c5bd 0, #996868 0, #990303 46%, #8e0202 52%, #840402 59%, #f60 87%);
    background: linear-gradient(to bottom, #f3c5bd 0, #996868 0, #990303 46%, #8e0202 52%, #840402 59%, #f60 87%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f3c5bd', endColorstr='#ff6600', GradientType=0)
}

.thumbnail_active {
    cursor: default
}

.ca-booking-day td.book-data, .eoffice {
    cursor: pointer
}

.eoffice {
    -moz-transition: -moz-transform .3s ease-in;
    -webkit-transition: -webkit-transform .3s ease-in;
    -o-transition: -o-transform .3s ease-in
}

.eoffice img {
    width: 82px;
    height: 82px
}

.eoffice:hover {
    text-shadow: 2px 2px 5px #3C8DBC;
    -moz-transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -o-transform: scale(1.1)
}

.btn-app.smallbtn {
    height: 48px !important;
    padding: 5px !important
}

.btn-arrow {
    cursor: pointer;
    height: 16px;
    width: 28px;
    border: none;
    float: right;
    margin-top: 13px
}

.btn-arrow.left {
    background-color: transparent !important;
    background-image: url(../images/left.png) !important;
    background-repeat: no-repeat;
    background-size: 70%
}

.btn-arrow.right {
    background: url(../images/right.png) no-repeat;
    background-size: 70%
}

.pq-grid-summary table .pq-grid-cell {
    background-color: #E4ECF7 !important;
    color: #666;
    text-shadow: 0 1px 0 #fff
}

.bootstrap-timepicker-widget.dropdown-menu.open input.form-control {
    padding: 0 !important
}

.pq-grid-number-cell .pq-td-div {
    text-align: center
}

.sidebar-menu .treeview-menu > li * {
    vertical-align: top
}

.sidebar-menu .treeview-menu > li > i {
    padding: 7px 5px 5px 15px
}

.sidebar-menu .treeview-menu > li > a {
    display: inline-block;
    font-size: 14px;
    max-width: 84%;
    padding: 5px 5px 5px 2px
}

.btn.dropdown-toggle.btn-default {
    background-color: #fff;
    padding: 1px 12px;
    line-height: 24px
}

.required .btn.dropdown-toggle.btn-default, .select2-container--default .select2-selection--single.required {
    background-color: #EFF9FF;
    width: 100% !important;
    left: 0% !important;
}
.bootstrap-select > select  {
    width: 100% !important;
    left: 0% !important;
}

.detailTabReport {
    border: 1px solid #ddd;
    min-width: 100%
}

.detailTabReport td {
    border: 1px solid #ddd;
    padding: 3px !important
}

.detailTabReport th {
    text-align: center;
    line-height: 2em;
    border: 1px solid #ddd;
    border-top: none;
    border-bottom: none
}

div.dropdown-menu {
    z-index: 106
}

#scrollW27F3400 .cell-detail:hover {
    background-color: #EFEFEF;
    cursor: pointer
}

.ft_container table {
    border-width: 0;
    margin: 0;
    border-collapse: collapse;
    outline-style: none;
    background-color: #FFF
}

.ft_container table tr th {
    font-weight: 700;
    text-align: center
}

.ft_container table thead {
    -moz-user-select: none;
    -webkit-user-select: none
}

.ft_container table tr td, .ft_container table tr th {
    border-collapse: collapse;
    padding: 3px;
    border: 1px solid #ddd;
    overflow: hidden;
    border-width: 0 1px 1px 0
}

.ft_container table tr:first-child td, .ft_container table tr:first-child th {
    border-top-width: 1px;
    border-color: #ddd
}

.ft_container table tr td:first-child, .ft_container table tr th:first-child {
    border-left-width: 1px;
    border-color: #ddd
}

.ft_container {
    overflow: hidden;
    padding: 0
}

.ft_rel_container {
    position: relative;
    overflow: hidden;
    border-width: 0;
    width: 100%;
    height: 100%
}

.ft_r, .ft_rc {
    background-image: none
}

.ft_rc {
    position: absolute;
    z-index: 105
}

.ft_c, .ft_r {
    position: relative
}

.ft_cwrapper, .ft_rwrapper {
    overflow: hidden;
    position: absolute;
    z-index: 101;
    border-width: 0;
    padding: 0;
    margin: 0
}

.ft_scroller {
    overflow: auto;
    height: 100%;
    padding: 0;
    margin: 0
}

.qtipW27F3400 {
    max-width: 1000px
}

table#W27F3400_Detail td, table#W27F3400_Detail th {
    border-right: solid 1px
}

#divBoard table th {
    padding: 5px !important
}
/*Sửa lại cho pqGrid*/
th .pq-td-div{text-align: center !important;font-weight: bold}
div.pq-loading-mask{width: auto !important;}
.pq-grid-summary .pq-grid-cell{
    font-weight: bold !important;
    color: #000  !important;
    /*color: blue  !important;*/
    text-align: right !important;
}

/*.pq-grid-summary .pq-grid-cell{*/
    /*color: #000 !important;*/
    /*text-align: right !important;*/
/*}*/

.pq-grid-number-cell{text-align: center !important;}
.pq-grid label input[type="checkbox"]{margin-right: auto}


/*Sửa lại cho button multiselect tích hợp vào toolbar pqGrid*/
.hei100{height: 100% !important;}
.bg-selected-chk{background-color: #E6F4FF}

.pq-cell-red-tr {
    background-image: url("../../plugins/paramquery-3.3.4/images/square-red-tr.gif")!important;
    background-repeat: no-repeat!important;
    background-position: right top!important;
}

.pecent-100{
    width: 100%;
}

.edit-status{
    background-color : #F7EFA9 !important;
}

.readonly-status{
    background-color : #EEEEEE !important;
    /*background-color : #CCCCCC !important;*/
}

.ui-tooltip-content{
    z-index: 3000;
}

.notify-grid{
    color:red;
    display: inline-flex;
}
.l3-calendar .fc-toolbar h2{
    font-size: 20px;
}
.l3-calendar .fc-toolbar{
    padding: 0 !important;
    margin-bottom: 3px;
}

.btn:hover, input[type="text"]:hover, select:hover, textarea:hover{
    border: 1px solid #3c8dbc;
}
.box-out{
    border-top: 1px solid #d2d6de !important;
    box-shadow:none !important;
}
.modal-content{
    border-radius: 3px !important;
}

#divConfirm .modal-header{
    border-radius: 3px 3px 0px 0px !important;
}
#divConfirm .modal-footer{
    border-radius: 0px 0px 3px 3px !important;
}

/*font cho grid filter*/
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button{
    font-family: 'Source Sans Pro', 'Arial' !important;
    font-weight: 400 !important;
}


.typeahead{
    border: 1px solid #ccc !important;
}

.typeahead>li{
    border-bottom: 1px solid #ccc !important;
}
.typeahead>li>a{
    color:#362b36 !important;
}

.dropdown-menu > .active > a, .dropdown-menu > .active > a:hover, .dropdown-menu > .active > a:focus{
   /* background-color:#aed0ea !important;*/
    background-color:#aed0ea !important;
}

.typeahead>li:first-child {
    /*border-bottom: 1px solid #ccc !important;*/
}

.typeahead>li:last-child {
    border-bottom: none !important;
}

#modalW76F4050 .fc-today {
    background: #EFF9FF !important;
}

.pq-grid .pq-cell-editor{
    margin-top: 0px !important;
}

.bg-red-custom{
    background-color: #FFDEDB
}

.bg-green-custom{
    background-color: #BFFFE1
}
.tab-close{display: inline-flex !important;}
.tab-close a.atab-close{border: none !important;padding-right: 10px !important;}
.tab-close button{margin-right: 3px;}

.chat .item.right{
    text-align: right;
}

.chat .item.right .attachment{
    text-align: left;
    margin-left: 55px;
    margin-right: 55px;
}
.chat .item.right > .message {
    margin-right: 55px;
}

.div-att{height: auto !important;min-height: 26px}

.file-att{margin-top: -5px;margin-left: 2px}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #EFF9FF;
    color: #000;
}
.select2-container--default .select2-selection--multiple {
    height: auto;
}

.digi-text-blue{
    color: blue;
    font-weight: bold;
}
.height-w47{
    height: 27px !important;
}
.bg-yellow{
    background-color: #edf1a5 !important;
    color: #333 !important;
}
.bg-gray-light{
    background-color: #eee;
}

.select2-container--default .select2-selection--single .select2-selection__rendered{
    line-height: 26px !important;
}
.digi-pre-value{
    background-color: #fff;
    border: 1px solid #fff;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: 'Source Sans Pro', 'Arial' !important;
    font-weight: bold;
    font-size: 15px;
    overflow-x: hidden;
    overflow-y: hidden;
    padding: 0px;
    width: 100%;
    height: auto;
    padding-bottom: 5px;
}

.digi-pre{
    background-color: #fff;
    border: 1px solid #fff;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: 'Source Sans Pro', 'Arial' !important;
    font-weight: 400;
    font-size: 15px;
    overflow-x: hidden;
    overflow-y: hidden;
    padding: 0px;
    width: 100%;
    height: auto;
    padding-bottom: 5px;
}

.select2 {
    width: 100% !important;
}
.main-footer{
    position: relative !important;
    display: none !important;
}
#password{
    text-security:disc;
    -webkit-text-security:disc;
    -mox-text-security:disc;
}
.mCSB_container{
    left: -5px !important;
    padding-left: 10px !important;
}

.visibility{
    visibility:visible !important;
}
.text-italic{
    font-style: italic;
}
.text-decoration{
    text-decoration: underline;
}

.input-append, .input-prepend
{
    font-size: 0;
    white-space: nowrap;
}
.ui-disabled-btn{
    color: #aaa !important;
    border: 1px solid #cccccc !important;
    background: #ddd !important;
    cursor: pointer;
}
div[data-toggle='toggle']{
    min-height: 23px !important;
    margin-top: 1px;
}
div[data-toggle='toggle'] label{
    padding: 0px !important;
}
.toggle.ios, .toggle-on.ios, .toggle-off.ios { border-radius: 20px; }
.toggle.ios .toggle-handle { border-radius: 20px; }
.select2-hidden-accessible{
    width: 100% !important;
}

@media screen and (width: 50px) {
    .sidebar-menu {
        margin-top: 50px !important;
    }
}
a:hover{
    cursor: pointer;
    text-decoration: underline !important;
}

.disabled{
    background-color: #eee !important;
}
.content-wrapper, .right-side {
    min-height: 100%;
    background-color: #fbf9f9;
    z-index: 800;
}

legend {
    font-size: 12px;
    font-weight: bold;
    margin-bottom: 0px;
    width: auto;
    /* border: 1px solid #ddd; */
    border-bottom: none !important;
    border-radius: 4px;
    padding: 3px 10px;
    background-color: #ffffff;
    color: #3b5998 !important;
}
legend {
    display: block;
    width: 100%;
    padding: 0;
    margin-bottom: 20px;
    font-size: 18px;
    line-height: inherit;
    color: #333;
    border: 0;
    border-bottom: 1px solid #e5e5e5;
}
legend {
    padding: 0;
    border: 0;
}

.divW25F1050 .panel{
    border: 0px solid transparent;
}

.gradient-header{
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,f3f3f3+39,ededed+53,ffffff+100 */
    background: rgb(255,255,255); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(243,243,243,1) 39%, rgba(237,237,237,1) 53%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(243,243,243,1) 39%,rgba(237,237,237,1) 53%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(243,243,243,1) 39%,rgba(237,237,237,1) 53%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}
.form-control{
    height: 28px;
}
.box-header.with-border{
    border-top: 1px solid #f4f4f4;
}

.input-group-btn > .btn {
    padding: 3px 12px !important;
}

pre{
    background-color: #EFF9FF !important;
}
sub{
    color: red;
    font-size: 135%;
}



