/* reset everything to the default box model */

.fieldlist {
    margin: 0 0 -2em;
    padding: 0;
}

    .fieldlist li {
        list-style: none;
        padding-bottom: 2em;
    }

    .fieldlist label {
        display: block;
        padding-bottom: 1em;
        font-weight: bold;
        text-transform: uppercase;
        font-size: 12px;
        color: #444;
    }

.vertical-align-center {
    vertical-align: middle;
}

.bold {
    font-weight: bold;
}

.login-form {
    box-shadow: 0 1px 2px 1px rgba(0,0,0,.08), 0 3px 6px rgba(0,0,0,.08);
    margin: 0 auto 4.5em;
    padding: 3em;
    border: 1px solid rgba(20,53,80,0.14);
    vertical-align: middle;
}

#page > h2 {
    padding: 2em 0 0;
}

.box h2 a:hover {
    text-decoration: none;
}

.box h2 span {
    display: block;
    font-size: .7em;
}

#page > ul > li.box {
    clear: none;
    display: inline-block;
    float: none;
    min-width: 290px;
    max-width: 300px;
}

hr {
    height: 1px;
    line-height: 1px;
    background: #DFDFDF;
    border: 0;
}

#page .suite .imgPlate,
#page .suite .box {
    border-width: 0;
    box-shadow: none;
}

#page .suite {
    text-align: center;
}

    #page .suite .box h2 {
        margin-top: 1em;
    }


.margin-left-10 {
    margin-left: 10px;
}

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

.margin-top-55 {
    margin-top: 55px;
}

.margin-top-60 {
    margin-top: 60px;
}

.margin-top-20 {
    margin-top: 20px;
}

.margin-top-70 {
    margin-top: 70px;
}

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

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

.margin-right-15 {
    margin-right: 15px;
}

.padding-left-20 {
    padding-left: 20px;
}


.k-grid {
    font-size: 12px;
}

    .k-grid .k-grid-header .k-header .k-link {
        height: auto;
    }

    .k-grid .k-grid-header .k-header {
        white-space: normal;
    }

/*
            Increase the width of the edit form.
            The default one is 400px.
        */

.k-edit-form-container {
    width: 600px;
}

/*
            Decrease the width of the edit form labels. The default one is 30%.
            The new width should depend on the column titles.
            Switch the text alignment to the left. By default, it is to the right.
        */

.k-popup-edit-form .k-edit-label {
    width: 20%;
    text-align: left;
}

/*
            Increase the width of the textbox containers. The default one is 60%.
            The sum of label and editor percentage widths should be around 90%, to make up for existing paddings.
        */
.k-popup-edit-form .k-edit-field {
    width: 70%;
}

    /*
            Expand the edit textboxes and any other Kendo UI widgets.
            In case of unexpected side effects, use widget-specific classes, instead of .k-widget.
        */
    .k-popup-edit-form .k-edit-field > .k-textbox,
    .k-popup-edit-form .k-edit-field > .k-widget {
        width: 98%;
    }


.k-grid-content .k-state-selected .k-link {
    color: white;
}

.k-grid-content .k-state-selected .k-edit-cell {
    color: black;
}

.icon-list li {
    padding: 0 0 5px 20px;
    display: block;
    position: relative;
}

    .icon-list li:before {
        font-family: 'Glyphicons Halflings';
        position: absolute;
        left: 0;
        top: 3px;
        font-size: 80%;
        color: #3F81D3;
    }

.chevron-right li:before {
    content: '\e080';
}

.image-with-h4 {
    text-align: center;
    color: #1E4D91;
}

.styled_list {
    margin-right: 15px;
    padding: 3px 5px 3px 5px;
    line-height: 25px;
}

    .styled_list label {
        font-weight: 500;
        white-space: nowrap;
        margin-left: 2px;
        padding-right: 20px;
    }

.styled_checkbox {
    cursor: pointer;
    border-radius: 5px;
}

fieldset legend {
    font-size: large;
}

.red-color {
    background-color: red;
}

.padding-left-0 {
    padding-left: 0;
}

.padding-left-5 {
    padding-left: 5px;
}

.padding-left-15 {
    padding-left: 15px;
}

.padding-right-15 {
    padding-right: 15px;
}

.panel-body {
    position: relative;
    padding: 0;
}

.panel-heading span.t-panel-title {
    font-weight: bold;
    text-decoration: underline;
}

.margin-top-20 {
    margin-top: 20px;
}

.padding-left-5 {
    padding-left: 5px;
}

.padding-right-5 {
    padding-right: 5px;
}

.t-overwrite-input-bootstrap {
    height: auto !important;
    padding: 1px 2px !important;
    -ms-border-radius: 0 !important;
    border-radius: 0 !important;
}

.t-overwrite-form-group {
    margin-bottom: 8px !important;
}

.t-overwrite-label {
    color: #000;
    font-size: 11.5px !important;
}

.t-overwrite-panel-heading {
    padding: 5px 15px !important;
}

.t-margin-bottom-0 {
    margin-bottom: 0px;
}

.t-margin-bottom-5 {
    margin-bottom: 5px;
}

.t-margin-right-0 {
    margin-right: 0px !important;
}

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

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

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

.t-padding-left-0 {
    padding-left: 0 !important;
}

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

.t-padding-0 {
    padding: 0 !important;
}

.t-margin-0 {
    margin: 0 !important;
}

.t-bold {
    font-weight: bold;
}

.t-hide {
    display: none;
}

.t-show {
    display: block;
}

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

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

.t-align-right {
    text-align: right !important;
}

.t-required {
    color: red;
}

tr.tr-gray {
    background-color: Gray !important;
}

tr.tr-burlywood {
    background-color: BurlyWood !important;
}

tr.tr-sienna {
    background-color: Sienna !important;
}

tr.tr-blue {
    background-color: Blue !important;
}


td.td-lightblue {
    background-color: LightBlue !important;
}
/*Editing tr*/
tr.hight-light-editing-row-head {
    background-color: #0066b3 !important;
    color: #fff;
}

    tr.hight-light-editing-row-head button {
        color: #000;
    }

    tr.hight-light-editing-row-head a {
        color: #ffffff;
    }

    tr.hight-light-editing-row-head text {
        color: #ffffff !important;
    }

tr.hight-light-editing-row-body td.td-has-green-border {
    border: 1px solid #0066b3 !important;
    border-top: none;
}

tr.hight-light-editing-row-head td:first-child {
    border-left: 1px solid #0066b3;
}

tr.hight-light-editing-row-head td:last-child {
    border-right: 1px solid #0066b3;
}

.has-green-border {
    border: 1px solid #0066b3 !important;
    border-top: none;
}

/*Paging*/
.pagination {
    margin: 5px 0;
}

    .pagination ul {
        display: inline-block;
        *display: inline;
        *zoom: 1;
        margin-left: 0;
        margin-bottom: 0;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        border-radius: 4px;
        -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
        -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
        -webkit-margin-before: 0;
        -webkit-margin-after: 0;
        -webkit-margin-start: 0px;
        -webkit-margin-end: 0px;
        -webkit-padding-start: 0;
    }

        .pagination ul > li {
            display: inline;
        }

            .pagination ul > li > a, .pagination ul > li > span {
                float: left;
                padding: 4px 12px;
                line-height: 20px;
                text-decoration: none;
                background-color: #ffffff;
                border: 1px solid #dddddd;
                border-left-width: 0;
            }

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

        .pagination ul > .active > a, .pagination ul > .active > span {
            color: #999999;
            cursor: default;
        }

        .pagination ul > .disabled > span, .pagination ul > .disabled > a, .pagination ul > .disabled > a:hover, .pagination ul > .disabled > a:focus {
            color: #999999;
            background-color: transparent;
            cursor: default;
        }

        .pagination ul > li:first-child > a, .pagination ul > li:first-child > span {
            border-left-width: 1px;
            -webkit-border-top-left-radius: 4px;
            -moz-border-radius-topleft: 4px;
            border-top-left-radius: 4px;
            -webkit-border-bottom-left-radius: 4px;
            -moz-border-radius-bottomleft: 4px;
            border-bottom-left-radius: 4px;
        }

        .pagination ul > li:last-child > a, .pagination ul > li:last-child > span {
            -webkit-border-top-right-radius: 4px;
            -moz-border-radius-topright: 4px;
            border-top-right-radius: 4px;
            -webkit-border-bottom-right-radius: 4px;
            -moz-border-radius-bottomright: 4px;
            border-bottom-right-radius: 4px;
        }

.pagination-centered {
    text-align: center;
}

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

.pagination-large ul > li > a, .pagination-large ul > li > span {
    padding: 11px 19px;
    font-size: 17.5px;
}

.pagination-large ul > li:first-child > a, .pagination-large ul > li:first-child > span {
    -webkit-border-top-left-radius: 6px;
    -moz-border-radius-topleft: 6px;
    border-top-left-radius: 6px;
    -webkit-border-bottom-left-radius: 6px;
    -moz-border-radius-bottomleft: 6px;
    border-bottom-left-radius: 6px;
}

.pagination-large ul > li:last-child > a, .pagination-large ul > li:last-child > span {
    -webkit-border-top-right-radius: 6px;
    -moz-border-radius-topright: 6px;
    border-top-right-radius: 6px;
    -webkit-border-bottom-right-radius: 6px;
    -moz-border-radius-bottomright: 6px;
    border-bottom-right-radius: 6px;
}

.pagination-mini ul > li:first-child > a, .pagination-small ul > li:first-child > a, .pagination-mini ul > li:first-child > span, .pagination-small ul > li:first-child > span {
    -webkit-border-top-left-radius: 3px;
    -moz-border-radius-topleft: 3px;
    border-top-left-radius: 3px;
    -webkit-border-bottom-left-radius: 3px;
    -moz-border-radius-bottomleft: 3px;
    border-bottom-left-radius: 3px;
}

.pagination-mini ul > li:last-child > a, .pagination-small ul > li:last-child > a, .pagination-mini ul > li:last-child > span, .pagination-small ul > li:last-child > span {
    -webkit-border-top-right-radius: 3px;
    -moz-border-radius-topright: 3px;
    border-top-right-radius: 3px;
    -webkit-border-bottom-right-radius: 3px;
    -moz-border-radius-bottomright: 3px;
    border-bottom-right-radius: 3px;
}

.pagination-small ul > li > a, .pagination-small ul > li > span {
    padding: 2px 10px;
    font-size: 11.9px;
}

.pagination-mini ul > li > a, .pagination-mini ul > li > span {
    padding: 0 6px;
    font-size: 10.5px;
}

.pointer-cursor {
    cursor: pointer;
}

.infor-thong-tin span {
    border-bottom: 1px dashed #144261;
    text-decoration: none;
    /*text-decoration: underline;
    text-decoration: underline dotted #144261;*/
}

label {
    font-weight: normal;
    font-size: 13px;
    font-family: Arial,Helvetica,sans-serif;
}

.Dianco label {
    font-size: 12px;
}

.Dianco .btn-circle {
    width: 50px;
    height: 50px;
    text-align: center;
    padding: 6px 0;
    font-size: 12px;
    line-height: 1.428571429;
    border-radius: 15px;
}

.Dianco .circle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: white;
    color: black;
    width: 40px;
    height: 35px;
    font-weight: bold;
    min-width: 1em;
    border-radius: 50%;
    vertical-align: middle;
    padding: 3px;
    border: 2px solid #DCDCDC;
}

    .Dianco .circle:before {
        content: '';
        float: left;
        width: auto;
        padding-bottom: 100%;
    }

.Dianco .panel-body {
    padding: 5px;
}


.Dianco .form-group-space {
    margin-bottom: 5px;
}


.Dianco table thead tr {
    background-color: #EEEEEE;
}

.Dianco .table {
    border-collapse: collapse;
    padding: 1px;
}

    .Dianco .table > thead > tr > th {
        font-weight: bold;
        text-align: center;
    }

.table > thead > tr > th.toolbar {
    background-color: #f5f5f5;
    border-top: 1px solid #e5e5e5;
    margin-bottom: 0px;
    margin-top: 5px;
    text-align: left;
}

.Dianco .dropdown-toggle {
    font-weight: bolder;
    font-size: 13px;
    font-family: Arial,Helvetica,sans-serif;
}

.Dianco .row {
    font-size: 13px;
    font-weight: normal;
    font-family: Arial,Helvetica,sans-serif;
    margin-left: 0;
    margin-right: 0;
}

.t-button {
    background-image: -webkit-linear-gradient(top,#f5f5f5,#f1f1f1);
    border: 1px solid #000000;
    border: 1px solid rgba(0,0,0,0.1);
    color: #444;
    -ms-border-radius: 2px;
    border-radius: 2px;
    font-size: 11px;
    font-weight: 500;
    text-align: center;
    white-space: nowrap;
    margin-right: 5px;
    -moz-min-width: 54px;
    -ms-min-width: 54px;
    -o-min-width: 54px;
    -webkit-min-width: 54px;
    min-width: 54px;
    outline: 0;
    padding: 3px 8px;
    cursor: pointer;
}

    .t-button:hover {
        background-color: transparent;
        background-image: -webkit-linear-gradient(top,#f5f5f5,#f1f1f1);
        background-image: linear-gradient(top,#f5f5f5,#f1f1f1);
        background-image: -webkit-gradient(linear,left top,left bottom,from(#f5f5f5),to(#f1f1f1));
        border: 1px solid #c6c6c6;
        color: #333;
    }

.is-breakable {
    word-break: break-word;
}

.lylich {
    background-color: navajowhite;
}

/*Square color boxes*/
.da-hoan-thanh-box {
    background-color: #58abab;
    display: inline-block;
    border-radius: 5px 0 5px 0;
    height: 15px;
    width: 15px;
}

.da-hoan-thanh {
    background-color: #58abab !important;
}

.da-huy-box {
    background-color: sienna;
    display: inline-block;
    border-radius: 5px 0 5px 0;
    height: 15px;
    width: 15px;
}
.da-huy {
    background-color: sienna !important;
}
.qua-han-box {
    background-color: yellow;
    display: inline-block;
    border-radius: 5px 0 5px 0;
    height: 15px;
    width: 15px;
}
.qua-han {
    background-color: yellow !important;
}


.da-chay-box {
    background-color: lightblue;
    display: inline-block;
    border-radius: 5px 0 5px 0;
    height: 15px;
    width: 15px;
}

.da-chay {
    background-color: lightblue !important;
}

.file-icon {
        display: inline-block;
        float: left;
        width: 48px;
        height: 48px;
        margin-left: 10px;
        margin-top: 13.5px;
    }
    .img-file {
        background-image: url(/content/web/upload/jpg.png);
    }
    .doc-file {
        background-image: url(/content/web/upload/doc.png);
    }
    .pdf-file {
        background-image: url(/content/web/upload/pdf.png);
    }
    .xls-file {
        background-image: url(/content/web/upload/xls.png);
    }
    .zip-file {
        background-image: url(/content/web/upload/zip.png);
    }
    .default-file {
        background-image: url(/content/web/upload/default.png);
    }
    .file-heading {
        font-family: Arial;
        font-size: 1.1em;
        display: inline-block;
        float: left;
        width: 60%;
        margin: 0 0 0 20px;
        height: 25px;
        -ms-text-overflow: ellipsis;
        -o-text-overflow: ellipsis;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }
    .file-name-heading {
        font-weight: bold;
        margin-top: 20px;
    }
    .file-size-heading {
        font-weight: normal;
        font-style: italic;
    }
    li.k-file .file-wrapper .k-upload-action {
        position: absolute;
        top: 0;
        right: 0;
    }
    li.k-file div.file-wrapper {
        position: relative;
        height: 75px;
    }

.row-fluid div {
    -webkit-transition: width 0.3s ease, margin 0.3s ease, padding 0.3s ease;
    -moz-transition: width 0.3s ease, margin 0.3s ease, padding 0.3s ease;
    -o-transition: width 0.3s ease, margin 0.3s ease, padding 0.3s ease;
    transition: width 0.3s ease, margin 0.3s ease, padding 0.3s ease;
}

.row-fluid .col-0 {
    width: 0%;
    float:left;
    overflow:hidden;
}

.row-fluid .col-0 + [class*="col"]{
    margin-left: 0;
}

/*
.table-fixed {
    width: 100%;
}
.table-fixed thead {
    width: 97%;
}
.table-fixed tbody {
    height: 800px;
    overflow-x: auto;
    overflow-y: auto;
    width: 99%;
}
.table-fixed thead, .table-fixed tbody, .table-fixed tr, .table-fixed td, .table-fixed th {
    display: block;
}
.table-fixed tbody td, .table-fixed thead > tr> th {
    display: inline-block;
    border-bottom-width: 0;
}

.tblTitle{
    position:absolute;
    top:0px;
    margin-bottom:30px;
    background:lightblue;
}
td, th{
    padding:5px;
    height:40px;
    width:40px;
    font-size:14px;
}

#vertical_scrolling_div{
    display:inline-block;
    zoom: 1;
    *display:inline;
    padding-top:40px;
    height:300px;
    overflow-y: scroll;
    overflow-x: hidden;
}

#freeze_container{
    display:inline-block;
    zoom: 1;
    *display:inline;
    vertical-align:top;
    width:100px;
}
#horizontal_scrolling_div{
    display:inline-block;
    zoom: 1;
    *display:inline;
    width:200px;
    overflow-x:scroll;
    vertical-align:top;
}

.freeze_table{   
    background-color: #0099dd;
    z-index:2;
}

#left_table{
    width:100px;
}

#inner_table{
    width:400px;
    overflow:hidden;
}

    */

.table-fixed {
    position: relative;
    width: 100%;
    overflow: hidden;
    border-collapse: collapse;
}


/*thead*/
.table-fixed thead {
    position: relative;
    display: block; /*seperates the header from the body allowing it to be positioned*/
    width: 100%;
    overflow: visible;
}



/*tbody*/
.table-fixed tbody {
    position: relative;
    display: block; /*seperates the tbody from the header*/
    width: 100%;
    height: 800px;
    overflow: scroll;
}