#maincontent .col-md-2 {
    margin-left: 0px !important;
    padding-left: 0px !important;
    padding-right: 0px !important;
}

img.mg-3 {
    cursor: pointer;
}

.container-fluid {
    margin-right: 0px !important;
    margin-left: 15px !important;
    margin-top: 85px;
}

.display-none {
    display: none;
}

.danhmuc {
    border: 1px solid #D1DAE1;
    height: 100%;
}

    .danhmuc .danhmuc-title {
        color: #2B76B7;
        font-size: 18px;
        font-weight: 600;
        padding-top: 10px;
    }

.option:hover {
    color: #2B76B7 !important;
}

.danhmuc .danhmuc-title .content {
    margin-left: 12px;
    margin-bottom: 10px;
    margin-right: 12px;
}

.danhmuc .danhmuc-title .img {
    background-image: url("../../images/elearning/line-240.png");
    height: 3px;
    width: 100%;
}

.danhmuc .part {
    border-bottom: 1px solid #D1DAE1;
    padding-left: 12px;
    padding-right: 12px;
    color: #374957;
    font-weight: 700;
    font-size: 14px;
}

    .danhmuc .part .part-title {
        display: flex;
        border-bottom: 1px solid #D1DAE1;
        margin-left: -13px;
        margin-right: -13px;
        padding-left: 13px;
        padding-right: 13px;
        padding-bottom: 10px;
        cursor: pointer;
        padding-top: 10px;
        text-transform: uppercase;
    }

        .danhmuc .part .part-title:hover {
            background: #D1DAE1;
        }

    .danhmuc .part .part-child {
        display: none;
    }

.option.active {
    color: #2B76B7 !important;
}

.danhmuc .part .part-child .option {
    border-bottom: 1px solid #D1DAE1;
    padding-top: 10px;
    padding-bottom: 10px;
    color: #374957;
    font-family: 'Open Sans';
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
}

    .danhmuc .part .part-child .option i {
        color: #CFD9E0;
        margin-right: 5px;
    }

    .danhmuc .part .part-child .option:last-child {
        border-bottom: none;
    }

.danhmuc .part .part-title .expand:hover {
    cursor: pointer;
}

.danhmuc .part .part-title div:first-child {
    width: 100%;
}

.danhmuc .part:last-child {
    border-bottom: none;
}

.expand {
    z-index: 999;
}

.danhsach .danhsach-title {
    color: #374957;
    font-size: 18px;
    font-weight: 700;
    padding-right: 15px;
}

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

.danhsach .danhsach-title .line-title {
    background-image: url("../../images/elearning/line-240.png");
    height: 3px;
    width: 100%;
    margin: auto;
}

.part-title.active {
    color: #2B76B7 !important;
}

.danhsach .danhsach-tool .tool-left {
    float: left;
    width: 13%;
}

    .danhsach .danhsach-tool .tool-left .tool-left-select {
        border: 1px solid #D1DAE1;
        margin-left: 6px;
        margin-right: 6px;
        width: 36%;
    }

.danhsach .danhsach-tool .tool-right {
    float: right;
    margin-top: -12px;
}

    .danhsach .danhsach-tool .tool-right button {
        background-color: #FF6E2D;
        color: white;
        padding: 10px 20px;
        border-radius: 0px;
    }

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

    .danhsach .danhsach-table table {
        border: 1px solid #CFD9E0;
        font-family: 'Open Sans';
    }

        .danhsach .danhsach-table table .content-document a {
            color: #097FE6;
        }

.table-striped tbody tr:nth-of-type(odd) {
    background-color: #F1F4F6 !important;
}

.danhsach .danhsach-table table thead {
    background-color: #175080;
    color: white;
}

.danhsach .danhsach-table table tbody tr td {
    border-right: 1px solid #D1DAE1;
}

.danhsach .danhsach-table table tbody tr th {
    border-right: 1px solid #D1DAE1;
}

.danhsach .danhsach-table table tbody .action i {
    border: 1px solid #FF6E2D;
    background-color: #FF6E2D;
    color: white;
    border-radius: 3px;
    width: 22px;
    height: 22px;
    padding-top: 2px;
}

.danhsach .danhsach-table table tbody tr td a {
    text-decoration-line: underline;
}


/* Customize the label (the container) */
table .container {
    display: block;
    position: relative;
    padding-left: 2px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 22px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    /* Hide the browser's default checkbox */
    table .container input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }

/* Create a custom checkbox */
table .checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 18px;
    width: 18px;
    background-color: #eee;
    border: 1px solid #CFD9E0;
}

/* On mouse-over, add a grey background color */
table .container:hover input ~ .checkmark {
    background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
table .container input:checked ~ .checkmark {
    background-color: #2196F3;
}

/* Create the checkmark/indicator (hidden when not checked) */
table .checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
table .container input:checked ~ .checkmark:after {
    display: block;
}

/* Style the checkmark/indicator */
table .container .checkmark:after {
    left: 6px;
    top: 2px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

#maincontent.main-active table .checkmark {
    margin-left: 3px;
}

#maincontent.expand-bar table .checkmark {
    margin-left: 1px;
}





.paging {
    font-family: 'Open Sans';
}

    .paging .paging-text {
    }

    .paging .paging-button {
        float: right;
        margin-top: -23px;
    }

        .paging .paging-button li a {
            color: #1C4E7A;
            cursor: pointer;
        }

            .paging .paging-button li a:hover {
                background-color: #1C4E7A !important;
                color: white !important;
            }


@media only screen and (max-width: 1920px) {
    #maincontent.main-active .col-md-10 .cf-custom .m-rgh-dskh {
        min-width: 1410px;
    }

    #maincontent.main-active .col-md-10 .cf-custom .col-md-12.col-xs-12.no-padding {
        margin-left: -1.5%;
        max-width: 100%;
    }

    #maincontent.main-active .style-el {
        width: 272px !important;
        height: auto;
        margin-right: 22px;
    }

    #maincontent .style-el {
        width: 272px !important;
        height: auto;
        margin-right: 40px;
    }

    #maincontent.main-active .container-fluid {
        margin-right: 0px !important;
        margin-left: 5px !important;
        margin-top: 85px;
    }

    #maincontent .container-fluid {
        margin-right: 0px !important;
        margin-left: 20px !important;
        margin-top: 85px;
    }

    #maincontent .col-md-10 .cf-custom .m-rgh-dskh {
        min-width: 1200px;
    }

    #maincontent.main-active .danhsach-title {
        width: 101%;
    }

    #maincontent .danhsach-title {
        width: 95.5%;
    }

        #maincontent .danhsach-title .line-title.col-10 {
            max-width: 79.333333%;
        }

    #maincontent.main-active .danhsach-title .line-title {
        max-width: 83.333333%;
    }

    #maincontent .container-fluid .row.maincontent-row {
        margin-left: 40px;
    }

    #maincontent.main-active .container-fluid .row.maincontent-row {
        margin-left: -8px;
    }

    #maincontent .col-md-10 .cf-custom .col-md-12.col-xs-12.no-padding {
        margin-left: -1.8%;
        max-width: 95%;
    }

    #maincontent .danhsach-title .line-title.col-10 {
        max-width: 80%;
    }

    #maincontent.main-active .danhsach-title .line-title {
        max-width: 83%;
    }
}

@media only screen and (max-width: 1680px) {
    #maincontent.main-active table .checkmark {
        margin-left: 1px;
    }

    #maincontent.main-active .col-md-10 .cf-custom .col-md-12.col-xs-12.no-padding {
        margin-left: -2%;
        max-width: 98%;
    }

    #maincontent.main-active .container-fluid .row.maincontent-row {
        margin-left: 40px;
    }

    #maincontent.main-active .danhsach .danhsach-table {
        margin-top: 70px;
        margin-left: 15px;
    }

    #maincontent.main-active .danhsach-title .line-title {
        max-width: 74%;
    }

    #maincontent .container-fluid .row.maincontent-row {
        margin-left: -15px;
    }

    #maincontent .danhsach-title {
        width: 106.5%;
    }

        #maincontent .danhsach-title .line-title.col-10 {
            max-width: 67%;
        }

    #maincontent.main-active .danhsach-title .line-title.col-10 {
        max-width: 74%;
    }

    #maincontent .col-md-10 .cf-custom .col-md-12.col-xs-12.no-padding {
        margin-left: -1.8%;
        max-width: 99.5%;
    }

    #maincontent.expand-bar .danhsach-title {
        width: 120%;
    }

        #maincontent.expand-bar .danhsach-title .line-title {
            max-width: 68% !important;
            margin-left: 8px !important;
        }

    #maincontent.expand-bar table .checkmark {
        margin-left: 0px;
    }
}

@media only screen and (max-width: 1600px) {
    #maincontent.main-active .danhsach-title {
        width: 107%;
    }

    #maincontent.main-active .col-md-10 .cf-custom .col-md-12.col-xs-12.no-padding {
        margin-left: -2%;
        max-width: 99%;
    }

    #maincontent .danhsach-title {
        width: 91%;
    }

        #maincontent .danhsach-title .line-title.col-10 {
            max-width: 70.333333%;
        }

    #maincontent .col-md-10 .cf-custom .col-md-12.col-xs-12.no-padding {
        margin-left: -2.5%;
        max-width: 90%;
    }

    #maincontent.main-active .danhsach-title .line-title {
        max-width: 73%;
        margin-left: 8px;
    }

    #maincontent.expand-bar .danhsach-title {
        width: 121%;
    }

        #maincontent.expand-bar .danhsach-title .line-title {
            max-width: 67% !important;
            margin-left: 11px !important;
        }

    #maincontent .container-fluid .row.maincontent-row {
        margin-left: 90px;
    }

    #maincontent.main-active .container-fluid .row.maincontent-row {
        margin-left: -15px;
    }

    #maincontent.main-active .col-md-10 .cf-custom .m-rgh-dskh {
        min-width: 1460px;
    }

    #maincontent .col-md-10 .cf-custom .m-rgh-dskh {
        min-width: 1120px;
    }
}

@media only screen and (max-width: 1550px) {
    #maincontent.main-active .container-fluid {
        margin-right: 0px !important;
        margin-left: 10px !important;
    }

    #maincontent .danhsach-title .line-title.col-10 {
        max-width: 72.333333%;
    }

    #maincontent.main-active .danhsach .danhsach-table {
        margin-top: 70px;
        margin-left: -5px;
    }

    #maincontent.main-active .col-md-10 .cf-custom-dskh .m-rgh-dskh .style-el-dskh {
        margin-right: 21px;
    }

    #maincontent.main-active .danhsach-title .line-title {
        max-width: 72%;
        margin-left: 8px;
    }

    #maincontent.main-active .col-md-10 .cf-custom .col-md-12.col-xs-12.no-padding {
        margin-left: -2%;
        max-width: 97%;
    }

    #maincontent .container-fluid .row.maincontent-row {
        margin-left: 55px;
    }

    #maincontent .col-md-10 .cf-custom .col-md-12.col-xs-12.no-padding {
        margin-left: -2.5%;
        max-width: 92.5%;
    }

    #maincontent .danhsach-title {
        width: 92%;
    }
}

@media only screen and (max-width: 1440px) {
    #maincontent.expand-bar .maincontent-row {
        width: 126%;
    }

    #maincontent.expand-bar .danhsach {
        max-width: 65% !important;
    }

    #maincontent.expand-bar .danhsach-title {
        width: 142%;
    }

        #maincontent.expand-bar .danhsach-title .line-title {
            max-width: 55% !important;
            margin-left: 8px !important;
        }

    #maincontent.expand-bar .danhsach .danhsach-tool .tool-left {
        width: 20%;
    }

    #maincontent.main-active .maincontent-row {
        width: 111%;
    }

    #maincontent.main-active .danhsach {
        max-width: 75.5% !important;
    }

    #maincontent.main-active .danhsach-title {
        width: 121%;
    }

        #maincontent.main-active .danhsach-title .line-title {
            max-width: 67.5%;
            margin-left: 8px;
        }

    #maincontent.main-active .danhsach .danhsach-tool .tool-left {
        width: 17%;
    }

    #maincontent.main-active table .checkmark {
        margin-left: 0px;
    }
    /*css mới*/
    #maincontent.main-active .col-md-10 .cf-custom .m-rgh-dskh {
        min-width: 1170px;
    }

    #maincontent.main-active .col-md-10 .cf-custom-dskh .m-rgh-dskh .style-el-dskh {
        margin-right: 55px;
    }

    #maincontent.main-active .danhsach .danhsach-table {
        margin-top: 70px;
        margin-left: 30px;
    }

    #maincontent.main-active .col-md-10 .cf-custom .col-md-12.col-xs-12.no-padding {
        margin-left: -2%;
        max-width: 95%;
    }

    #maincontent.main-active .danhsach-title {
        width: 105.5%;
    }

    #maincontent.main-active .container-fluid .row.maincontent-row {
        margin-left: 20px;
    }

    #maincontent .container-fluid .row.maincontent-row {
        margin-left: 35px;
    }

    #maincontent .danhsach-title .line-title.col-10 {
        max-width: 70%;
    }

    #maincontent.main-active .danhsach-title .line-title.col-10 {
        max-width: 67%;
    }
}

@media only screen and (max-width: 1400px) {
    #maincontent.main-active .danhsach-title {
        width: 125%;
    }

    #maincontent.main-active .col-md-10 .cf-custom .col-md-12.col-xs-12.no-padding {
        margin-left: -2%;
        max-width: 98%;
    }

    #maincontent.main-active .danhsach-title .line-title.col-10 {
        max-width: 58.5%;
    }

    #maincontent .container-fluid .row.maincontent-row {
        margin-left: 10px;
    }

    #maincontent .col-md-10 .cf-custom .col-md-12.col-xs-12.no-padding {
        margin-left: -2.5%;
        max-width: 91.5%;
    }

    #maincontent.main-active .danhsach-title .line-title {
        max-width: 64.7%;
        margin-left: 8px;
    }

    #maincontent.expand-bar .danhsach-title {
        width: 147%;
    }

        #maincontent.expand-bar .danhsach-title .line-title {
            max-width: 52.7% !important;
            margin-left: 8px !important;
        }
}

@media only screen and (max-width: 1366px) {
    #maincontent.main-active .danhsach .danhsach-tool .tool-left {
        width: 17%;
    }

    #maincontent.main-active .danhsach-title {
        width: 131%;
    }

        #maincontent.main-active .danhsach-title .line-title {
            max-width: 61%;
            margin-left: 8px;
        }

    #maincontent.expand-bar .danhsach-title {
        width: 155%;
    }

        #maincontent.expand-bar .danhsach-title .line-title {
            max-width: 49% !important;
            margin-left: 8px !important;
        }

    #maincontent.expand-bar .danhsach .danhsach-tool .tool-left {
        width: 21%;
    }
    /*css mới*/
    #maincontent .col-md-10 .cf-custom .m-rgh-dskh {
        min-width: 1105px;
    }

    #maincontent.main-active .col-md-10 .cf-custom .m-rgh-dskh {
        min-width: 1190px;
    }

    #maincontent .danhsach-title {
        width: 92.5%;
    }

    #maincontent.main-active .danhsach-title {
        width: 95.4%;
    }

    #maincontent.main-active .container-fluid .row.maincontent-row {
        margin-left: 32px;
    }

    #maincontent .container-fluid .row.maincontent-row {
        margin-left: 0px;
    }

    #maincontent .danhsach-title .line-title.col-10 {
        max-width: 71%;
    }

    #maincontent.main-active .danhsach-title .line-title.col-10 {
        max-width: 70%;
    }
}

@media only screen and (max-width: 1360px) {
    #maincontent.main-active .danhsach .danhsach-tool .tool-left {
        width: 18%;
    }

    #maincontent.main-active .container-fluid .row.maincontent-row {
        margin-left: 0px;
    }

    #maincontent.main-active .danhsach-title {
        width: 107%;
    }

    #maincontent.expand-bar .danhsach .danhsach-tool .tool-left {
        width: 22%;
    }

    #maincontent.expand-bar .danhsach-title {
        width: 153%;
    }

        #maincontent.expand-bar .danhsach-title .line-title {
            max-width: 50% !important;
            margin-left: 8px !important;
        }

    #maincontent.main-active .danhsach-title {
        max-width: 107%;
    }

        #maincontent.main-active .danhsach-title .line-title {
            max-width: 61.5%;
            margin-left: 8px;
        }

    #maincontent.main-active .col-md-10 .cf-custom .col-md-12.col-xs-12.no-padding {
        margin-left: -2.5%;
        max-width: 100.5%;
    }

    #maincontent .danhsach-title .line-title.col-10 {
        max-width: 69%;
    }
}

@media only screen and (max-width: 1280px) {
    #maincontent.expand-bar .danhsach .danhsach-tool .tool-left {
        width: 24%;
    }

    #maincontent.main-active .danhsach .danhsach-table {
        margin-top: 70px;
        margin-left: -5px;
    }

    #maincontent.main-active .col-md-10 .cf-custom-dskh .m-rgh-dskh .style-el-dskh {
        margin-right: 25px;
    }

    #maincontent.main-active .container-fluid {
        margin-right: 0px !important;
        margin-left: 20px !important;
    }

    #maincontent.main-active .col-md-10 .cf-custom .col-md-12.col-xs-12.no-padding {
        margin-left: -2.5%;
        max-width: 96.5%;
    }

    #maincontent.expand-bar .maincontent-row {
        width: 142%;
    }

    #maincontent.expand-bar .danhsach {
        max-width: 56.5% !important;
    }

    #maincontent.expand-bar .danhsach-title {
        width: 173%;
    }

        #maincontent.expand-bar .danhsach-title .line-title {
            max-width: 42.2% !important;
            margin-left: 8px !important;
        }

    #maincontent.main-active .maincontent-row {
        width: 123%;
    }

    #maincontent.main-active .danhsach {
        max-width: 67.5% !important;
    }

    #maincontent.main-active .danhsach-title {
        width: 143%;
    }

        #maincontent.main-active .danhsach-title .line-title {
            max-width: 54.5%;
            margin-left: 8px;
        }

    #maincontent.main-active .danhsach .danhsach-tool .tool-left {
        width: 19%;
    }
    /*css mới*/
    #maincontent .col-md-10 .cf-custom .m-rgh-dskh {
        min-width: 905px;
    }

    #maincontent.main-active .col-md-10 .cf-custom .m-rgh-dskh {
        min-width: 1154px;
    }

    #maincontent .danhsach-title {
        width: 92.5%;
    }

    #maincontent.main-active .danhsach-title {
        width: 97.4%;
    }

    #maincontent.main-active .container-fluid .row.maincontent-row {
        margin-left: -15px;
    }

    #maincontent .container-fluid .row.maincontent-row {
        margin-left: 64px;
    }

    #maincontent .danhsach-title .line-title.col-10 {
        max-width: 71%;
    }

    #maincontent.main-active .danhsach-title .line-title.col-10 {
        max-width: 73%;
    }

    #maincontent .danhsach-title {
        width: 90.5%;
    }

        #maincontent .danhsach-title .line-title.col-10 {
            max-width: 59%;
        }

    #maincontent .col-md-2 {
        flex: 0 0 25.666667%;
        max-width: 25.666667%;
    }

    #maincontent .col-md-10 {
        flex: 0 0 74.333333%;
        max-width: 74.333333%;
    }

    #maincontent.main-active .col-md-2 {
        flex: 0 0 16.666667%;
        max-width: 16.666667%;
    }

    #maincontent.main-active .col-md-10 {
        flex: 0 0 83.333333%;
        max-width: 83.333333%;
    }

    #maincontent .col-md-10 .cf-custom-dskh .m-rgh-dskh .style-el-dskh {
        margin-right: 40px;
    }

    #maincontent .col-md-10 .cf-custom .col-md-12.col-xs-12.no-padding {
        margin-left: -3.5%;
        max-width: 90%;
    }
}

@media only screen and (max-width: 1152px) {
    #maincontent.main-active .col-md-10 .cf-custom .m-rgh-dskh {
        min-width: 55.5% !important;
    }
}

@media only screen and (max-width: 1100px) {
    #maincontent .container-fluid .row.maincontent-row {
        margin-left: 0px;
    }

    #maincontent .danhsach-title {
        width: 94.5%;
    }

    #maincontent .col-md-10 .cf-custom .col-md-12.col-xs-12.no-padding {
        margin-left: -3.5%;
        max-width: 93.5%;
    }

    #maincontent .container-fluid {
        margin-right: 0px !important;
        margin-left: 7px !important;
        margin-top: 85px;
    }

    #maincontent .col-md-10 .cf-custom-dskh .m-rgh-dskh .style-el-dskh {
        margin-right: 20px;
    }

    #maincontent.main-active .col-md-10 .cf-custom .col-md-12.col-xs-12.no-padding {
        margin-left: -3%;
        max-width: 85.8%;
    }

    #maincontent.main-active .container-fluid {
        margin-right: 0px !important;
        margin-left: 30px !important;
    }

        #maincontent.main-active .container-fluid .row.maincontent-row {
            margin-left: 10px;
        }

    #maincontent.main-active .col-md-10 .cf-custom .m-rgh-dskh {
        min-width: 800px;
    }

    #maincontent.main-active .col-md-10 .cf-custom-dskh .m-rgh-dskh .style-el-dskh {
        margin-right: 75px;
    }

    #maincontent.main-active .danhsach-title {
        max-width: 130%;
    }

    #maincontent.main-active .danhsach-title {
        width: 115.4%;
    }

    #maincontent.main-active .style-el {
        width: 272px !important;
        height: auto;
        margin-right: 22px;
    }

    #maincontent.main-active .danhsach-title .line-title.col-10 {
        max-width: 46.6%;
    }

    #maincontent .col-md-10 .cf-custom .m-rgh-dskh {
        min-width: 866px !important;
    }

    #maincontent .danhsach-title .line-title.col-10 {
        max-width: 57%;
    }
}

@media only screen and (max-width: 1024px) {
    #maincontent.main-active .maincontent-row {
        width: 158%;
    }

    #maincontent.main-active .danhsach {
        max-width: 49% !important;
    }

    #maincontent.main-active .danhsach-title {
        width: 200%;
    }

        #maincontent.main-active .danhsach-title .line-title {
            max-width: 34.5%;
            margin-left: 8px;
        }

    #maincontent.main-active .danhsach .danhsach-tool .tool-left {
        width: 26%;
    }

    #maincontent.expand-bar .maincontent-row {
        width: 184%;
    }

    #maincontent.expand-bar .danhsach {
        max-width: 41% !important;
    }

    #maincontent.expand-bar .danhsach-title {
        width: 254%;
    }

        #maincontent.expand-bar .danhsach-title .line-title {
            max-width: 23.5% !important;
            margin-left: 8px !important;
        }

    #maincontent.expand-bar .danhsach .danhsach-tool .tool-left {
        width: 34%;
    }

    #maincontent.expand-bar .col-md-2 {
        margin-left: -13px !important;
    }
    /*css mới*/
    #maincontent .col-md-10 .cf-custom .m-rgh-dskh {
        min-width: 870px !important;
    }

    #maincontent.main-active .col-md-10 .cf-custom .m-rgh-dskh {
        min-width: 895px !important;
    }

    #maincontent .danhsach-title {
        width: 92.5%;
    }

    #maincontent.main-active .danhsach-title {
        width: 107.4%;
    }

    #maincontent.main-active .container-fluid .row.maincontent-row {
        margin-left: -35px;
    }

    #maincontent.main-active .col-md-10 .cf-custom .col-md-12.col-xs-12.no-padding {
        margin-left: -3%;
        max-width: 97.8%;
    }

    #maincontent .container-fluid .row.maincontent-row {
        margin-left: -35px;
    }

    #maincontent .col-md-10 .cf-custom-dskh .m-rgh-dskh .style-el-dskh {
        margin-right: 45px;
    }

    #maincontent .danhsach-title .line-title.col-10 {
        max-width: 71%;
    }

    #maincontent.main-active .danhsach-title .line-title.col-10 {
        max-width: 57%;
    }

    #maincontent .danhsach-title {
        width: 87%;
    }

    #maincontent .col-md-10 .cf-custom .col-md-12.col-xs-12.no-padding {
        margin-left: -3.5%;
        max-width: 86%;
    }

    #maincontent .danhsach-title .line-title.col-10 {
        max-width: 59%;
    }

    #maincontent .col-md-2 {
        flex: 0 0 16.666667%;
        max-width: 16.666667%;
    }

    #maincontent .col-md-10 {
        flex: 0 0 83.333333%;
        max-width: 83.333333%;
    }

    #maincontent.main-active .col-md-2 {
        flex: 0 0 16.666667%;
        max-width: 16.666667%;
    }

    #maincontent.main-active .col-md-10 {
        flex: 0 0 83.333333%;
        max-width: 83.333333%;
    }
}

@media only screen and (max-width: 768px) {
    .danhsach .danhsach-table table tbody tr td {
        padding: 6px;
    }

    #maincontent.main-active .danhsach {
        max-width: 50% !important;
    }

    #maincontent.main-active .danhsach-title {
        width: 275%;
    }

        #maincontent.main-active .danhsach-title .line-title {
            max-width: 20.7%;
            margin-left: 8px;
        }

    #maincontent.main-active .paging .paging-button {
        float: none;
        margin-top: 8px;
    }

    #maincontent.main-active .danhsach .danhsach-tool .tool-left {
        width: 40%;
    }

    #maincontent.expand-bar .maincontent-row {
        display: block;
    }

    #maincontent.expand-bar {
        padding-left: 193px !important;
    }

        #maincontent.expand-bar .danhmuc {
            max-width: 55.5%;
        }

        #maincontent.expand-bar .danhsach {
            max-width: 57% !important;
            padding-left: 0px;
        }

        #maincontent.expand-bar .danhsach-title {
            width: 251%;
        }

            #maincontent.expand-bar .danhsach-title .line-title {
                max-width: 24.2% !important;
                margin-left: 8px !important;
            }

        #maincontent.expand-bar .danhsach-title {
            padding-top: 20px;
        }

        #maincontent.expand-bar .paging .paging-button {
            float: none;
            margin-top: 8px;
        }


        #maincontent.expand-bar .col-md-2 {
            margin-left: 0px !important;
        }
}

@media only screen and (max-width:900px) {
    #maincontent.main-active .col-md-10 .cf-custom .m-rgh-dskh {
        min-width: 690px !important;
    }

    #maincontent.main-active .col-md-2 {
        flex: 0 0 27.666667%;
        max-width: 27.666667%;
    }
}

@media only screen and (max-width:500px) {
    #maincontent.main-active .col-md-2 {
        flex: 0 0 100%;
        max-width: 100%;
    }
}




.danhsach-table {
    margin-top: 0px !important;
}

.font-style-xt {
    margin-left: 26px !important;
    margin-right: 69px !important;
}

.btn-bg-kd {
    float: right;
    width: 78px;
    border-radius: 20px;
    height: auto;
    text-align: center;
    font-size: 12px;
    font-family: 'Open Sans';
    background: #ffaf04;
    color: #FFF;
    border: none;
    padding: 3px;
}

.btn-bg-td {
    float: right;
    width: 58px;
    border-radius: 20px;
    height: auto;
    text-align: center;
    font-size: 12px;
    font-family: 'Open Sans';
    background: #2b76b7;
    color: #FFF;
    border: none;
    padding: 3px;
}

.span-icon-dskh {
    position: absolute;
    text-align: center;
    margin-left: -14%;
    margin-top: 5%;
}

#maincontent.main-active .style-el .card .img-resize {
    width: 270px !important;
    height: 160px !important;
    overflow: hidden;
}

.img-fluid {
    width: 100%;
    /* max-width: 270px !important;
    height: 160px !important;*/
    height: auto !important;
}
/*.w-20 {
    width: 270px !important;
    height: 257px !important;
}*/
.m-title {
    width: 250px !important;
    /*height: 72px !important;*/
    height: calc(2em + 6px) !important;
}

.sp-cl-dskh {
    color: #a9a7a7;
    font-size: 14px;
    font-family: 'Open Sans';
    margin: 5px;
}

.name-learn {
    width: 250px !important;
    height: 40px !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    white-space: inherit;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* margin-right: 4%; */
.fl-icon {
    margin-top: -56%;
    position: absolute;
    right: 0px;
    left: 230px;
}

@import url(http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700);

.jquery-accordion-menu,
.jquery-accordion-menu * {
    font-family: 'Open Sans', sans-serif;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    outline: 0
}

    .jquery-accordion-menu .jquery-accordion-menu-footer,
    .jquery-accordion-menu .jquery-accordion-menu-header {
        width: 100%;
        height: 50px;
        padding-left: 22px;
        float: left;
        line-height: 50px;
        font-weight: 600;
        color: #f0f0f0;
        background: #414956
    }

    .jquery-accordion-menu > ul > li a {
        font-family: 'Open Sans';
        font-size: 14px;
        color: #374957;
        margin-bottom: 0px;
        font-weight: 900;
        line-height: 28px;
    }

    .jquery-accordion-menu ul {
        margin: 0;
        padding: 0;
        list-style: none
    }

        .jquery-accordion-menu ul ul.submenu .submenu-indicator {
            line-height: 16px
        }

    .jquery-accordion-menu .submenu-indicator-minus > .submenu-indicator {
        -ms-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg)
    }

    .jquery-accordion-menu ul ul.submenu,
    .jquery-accordion-menu ul ul.submenu li ul.submenu {
        width: 100%;
        display: none;
        position: static
    }

        .jquery-accordion-menu ul ul.submenu > li > a {
            padding-left: 30px
        }

        .jquery-accordion-menu ul ul.submenu > li > ul.submenu > li > a {
            padding-left: 45px
        }

        .jquery-accordion-menu ul ul.submenu > li > ul.submenu > li > ul.submenu > li > a {
            padding-left: 60px
        }

        .jquery-accordion-menu ul ul.submenu li .jquery-accordion-menu-label {
            top: 12px
        }

.blue.jquery-accordion-menu .jquery-accordion-menu-footer,
.blue.jquery-accordion-menu .jquery-accordion-menu-header,
.blue.jquery-accordion-menu ul li a {
    background: #4A89DC
}

.blue.jquery-accordion-menu > ul > li.active > a,
.blue.jquery-accordion-menu > ul > li:hover > a {
    background: #3e82da
}

.blue.jquery-accordion-menu > ul > li > a {
    border-bottom-color: #3e82da
}

.blue.jquery-accordion-menu ul ul.submenu li:hover > a {
    border-left-color: #3e82da
}

.li-sub-menu {
    width: 100%;
    display: block;
    float: left;
    position: relative;
    border-top: #cfd9e0 1px solid;
    padding-bottom: 8px;
    padding-top: 8px;
}

.a-li-sub-menu {
    font-size: 14px !important;
    font-weight: 500 !important;
    font-family: 'Open Sans';
    padding-left: 5px;
}

.jquery-accordion-menu ul .li-menu {
    width: 100%;
    display: block;
    float: left;
    position: relative;
    border: #cfd9e0 1px solid;
    padding-top: 8px;
    padding-bottom: 8px;
    cursor: pointer;
    border-top: none;
}

.sub-menu {
    margin-top: 17px !important;
}

.mg-3 {
    margin-top: -4px;
}

.lb-danhm {
    padding-left: 5px;
    margin-bottom: 0px;
}

.pd-left-10 {
    padding-left: 10px;
}

.pd-left-5 {
    padding-left: 10px !important;
}

.img-right {
    float: right;
    margin-right: 10px;
    margin-top: 7px;
}

.hd-menu-left-child {
    font-size: 18px;
    font-weight: 700;
    font-family: 'Open Sans';
    padding-left: 10px;
    padding-top: 12px;
    padding-bottom: 13px;
    color: #2b76b7;
    border: 1px solid #cfd9e0;
    border-bottom: none;
}

.style-a {
    margin-left: 10px;
    margin-right: 30px;
}

.form-style {
    width: 268px;
    height: auto;
    margin-left: 2px;
}

.span-icon-dskh {
    position: absolute;
    text-align: center;
    margin-left: -14%;
    margin-top: 5%;
}

.btn-bg-td {
    float: right;
    width: 58px;
    border-radius: 20px;
    height: auto;
    text-align: center;
    font-size: 12px;
    font-family: 'Open Sans';
    background: #2b76b7;
    color: #FFF;
    border: none;
    padding: 3px;
}

.btn-bg-kd {
    float: right;
    width: 78px;
    border-radius: 20px;
    height: auto;
    text-align: center;
    font-size: 12px;
    font-family: 'Open Sans';
    background: #ffaf04;
    color: #FFF;
    border: none;
    padding: 3px;
}

.sp-cl-dskh {
    color: #a9a7a7;
    font-size: 14px;
    font-family: 'Open Sans';
    margin: 5px;
}

.display-none {
    display: none;
}

.display-block {
    display: block;
}

.li-menu:hover {
    color: rgb(43 162 220);
}

.li-sub-menu:hover {
    background: rgb(242 249 255);
}

#cate-menu > li.active > ul.sub-menu {
    display: block !important;
    margin-top: 5px !important;
}

#cate-menu > li.active {
    padding-bottom: 0px !important;
}

    #cate-menu > li.active > img.display-block {
        display: none !important;
    }

    #cate-menu > li.active > img.display-none {
        display: block !important;
    }

/* .icon-like-e.active #like {
        display: none;
    }

    .icon-like-e.active #nolike {
        display: inline;
    }

    .icon-like-e #like {
        display: inline;
    }

    .icon-like-e #nolike {
        display: none;
    }*/

@media only screen and (max-width: 768px) and (max-height: 1024px) {
    nav#sidebar.sidebar-unactive {
        margin-left: 0px !important;
        min-width: 200px;
    }

    #sidebar.sidebar-unactive ul li > a {
        display: flex;
        margin-left: -10px !important;
        min-width: 130px;
    }

    #sidebar.sidebar-unactive ul li a label {
        padding-left: 5px;
        cursor: pointer;
    }

    #menutop.menu-active {
        padding-left: 72px !important;
    }

    #menutop {
        padding-left: 200px !important;
    }
}

/* Extra Small Devices, Phones */
@media only screen and (max-width : 540px) and (orientation: portrait) {
    .style-el {
        width: 448px !important;
    }

    .img-fluid {
        width: 100%;
        max-width: 448px !important;
        height: 260px !important;
    }

    .fl-icon {
        left: 400px;
    }

    .m-title {
        width: 426px !important;
        height: 72px !important;
    }

    nav#sidebar.sidebar-unactive {
        margin-left: 0px !important;
        min-width: 250px !important;
    }

    nav#sidebar.active {
        margin-left: 0px !important;
        min-width: 70px !important;
    }

    #maincontent.main-active .maincontent-row {
        width: 100%;
        margin-left: -7px;
    }

    #maincontent.main-active .danhsach {
        max-width: 100% !important;
        margin-top: 10px;
    }

    #maincontent.main-active .danhsach-title {
        width: 104%;
        padding-right: 0px;
        margin-right: 0px;
    }

    .danhsach-title .col-2 {
        flex: 0 0 53%;
        max-width: 53%;
    }

    #maincontent.main-active .danhsach {
        max-width: 100% !important;
        margin-top: 10px;
        padding-left: 25px;
        padding-right: 25px;
        margin-right: 0px;
    }

    #maincontent.main-active .danhsach-title .line-title {
        max-width: 42%;
        margin-left: 8px;
        padding-right: 0px;
    }

    #maincontent.main-active .col-md-10 .cf-custom .m-rgh-dskh {
        padding-left: 80px !important;
    }

    .col-md-12.col-xs-12.no-padding {
        margin-left: -25px;
        width: 107%;
    }

    #maincontent.main-active .col-md-2 {
        margin-left: 4.5% !important;
        margin-right: 7%;
    }

    .danhsach-table {
        margin-left: -6px;
    }

    #maincontent.main-active .container-fluid {
        margin-right: 0px !important;
        margin-left: 0px !important;
    }

        #maincontent.main-active .container-fluid .row.maincontent-row {
            margin-left: 0px;
        }

    #maincontent.main-active .col-md-10 .cf-custom .m-rgh-dskh {
        min-width: 400px !important;
    }

    .col.card.card-body.w-20 {
        margin-left: 10px;
    }

    /* div#jquery-accordion-menu {
        display: none;
    }*/
}

@media only screen and (max-width : 414px) and (orientation: portrait) {
    #maincontent.main-active .maincontent-row {
        width: 100%;
        margin-left: -14px;
    }

    #maincontent.main-active .style-el {
        width: 375px !important;
    }

    .m-title {
        width: 358px !important;
        height: 72px !important;
    }

    .fl-icon {
        left: 335px;
    }

    .style-el {
        width: 380px !important;
    }

    .img-fluid {
        width: 100%;
        max-width: 380px !important;
        height: 220px !important;
    }

    #maincontent .maincontent-row {
        width: 100%;
        margin-left: -14px;
    }

    #maincontent.main-active .col-md-2 {
        margin-left: 0% !important;
        margin-right: 0%;
    }

    #maincontent.col-md-2 {
        margin-left: 0% !important;
        margin-right: 0%;
    }

    #maincontent.main-active .danhsach {
        padding-left: 0px;
    }

    #maincontent .danhsach {
        padding-left: 0px;
    }

    .danhsach-title .col-2 {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .col-md-12.col-xs-12.no-padding {
        margin-left: -25px;
        width: 119%;
    }

    #maincontent.main-active .danhsach-title .line-title {
        display: none;
    }

    #maincontent .danhsach-title .line-title {
        display: none;
    }

    #maincontent.main-active .col-md-10 .cf-custom .m-rgh-dskh {
        padding-left: 40px !important;
    }

    #maincontent .col-md-10 .cf-custom .m-rgh-dskh {
        padding-left: 40px !important;
    }

    .danhsach-table {
        margin-left: -5px;
    }
}

@media only screen and (max-width : 411px) and (orientation: portrait) {
    .danhsach-table {
        margin-left: 0px;
    }

    #maincontent.main-active .col-md-2 {
        margin-left: 1% !important;
        margin-right: 0%;
    }

    #maincontent .col-md-2 {
        margin-left: 1% !important;
        margin-right: 0%;
    }

    #maincontent.main-active .maincontent-row {
        width: 100%;
        margin-left: -15px;
    }

    .style-el {
        width: 370px !important;
    }

    .fl-icon {
        left: 320px;
    }

    .img-fluid {
        width: 100%;
        max-width: 370px !important;
        height: 220px !important;
    }

    .m-title {
        width: 350px !important;
        height: 72px !important;
    }
}

@media only screen and (max-width : 375px) and (orientation: portrait) {
    .danhsach-table {
        margin-left: 0px;
    }

    #maincontent.main-active .style-el {
        width: 340px !important;
    }

    .style-el {
        width: 335px !important;
    }

    #maincontent.main-active .maincontent-row {
        width: 100%;
        margin-left: -15px;
    }

    #maincontent .maincontent-row {
        width: 96%;
        margin-left: -15px;
    }

    #maincontent.main-active .col-md-2 {
        margin-left: 1.5% !important;
        margin-right: 0%;
    }

    #maincontent .col-md-2 {
        margin-left: 1.5% !important;
        margin-right: 0%;
    }

    .fl-icon {
        left: 285px;
    }

    .img-fluid {
        width: 100%;
        max-width: 335px !important;
        height: 200px !important;
    }

    .m-title {
        width: 311px !important;
        height: 72px !important;
    }

    .col-md-12.col-xs-12.no-padding {
        margin-left: -25px;
        width: 121%;
    }
}

@media only screen and (max-width : 360px) and (orientation: portrait) {
    .danhsach-table {
        margin-left: -7px;
    }

    #maincontent.main-active .style-el {
        width: 320px !important;
    }

    #maincontent.main-active .col-md-2 {
        margin-left: 0% !important;
        margin-right: 0%;
    }

    #maincontent .col-md-2 {
        margin-left: 0% !important;
        margin-right: 0%;
    }
}

@media only screen and (max-width : 320px) and (orientation: portrait) {
    .danhsach-table {
        margin-left: 0px;
    }

    .style-el {
        width: 280px !important;
    }

    .fl-icon {
        left: 230px;
    }

    .img-fluid {
        width: 100%;
        max-width: 280px !important;
        height: 170px !important;
    }

    .m-title {
        width: 259px !important;
        height: 72px !important;
    }

    .col-md-12.col-xs-12.no-padding {
        margin-left: -25px;
        width: 124%;
    }
}
/*giao dien mobile landscape*/
@media only screen and (max-width : 823px) and (max-height: 540px) {
    #maincontent.main-active .col-md-10 .cf-custom-dskh {
        margin-left: 6%;
        width: 100% !important;
    }

    #maincontent .col-md-10 .cf-custom-dskh {
        margin-left: 6%;
        width: 100% !important;
    }

    .danhsach-table {
        margin-left: 21px;
    }

    .style-el {
        width: 338px !important;
    }

    .img-fluid {
        width: 100%;
        max-width: 338px !important;
        height: 205px !important;
    }

    .fl-icon {
        left: 275px;
    }

    .m-title {
        width: 316px !important;
    }

    div#jquery-accordion-menu {
        display: none;
    }

    #maincontent.main-active .maincontent-row {
        width: 100%;
    }

    #maincontent .maincontent-row {
        width: 100%;
    }

    .danhmuc .danhmuc-title .img {
        background-image: url(../../images/elearning/line-240.png);
        height: 5px;
        width: 100%;
    }

    #maincontent.main-active .col-md-2.danhmuc {
        flex: 0 0 89% !important;
        max-width: 100% !important;
        margin-left: 5.6% !important;
    }

    #maincontent .col-md-2.danhmuc {
        flex: 0 0 89% !important;
        max-width: 100% !important;
        margin-left: 7% !important;
    }

    #maincontent.main-active .danhsach-title {
        width: 100%;
        padding-right: 0px;
    }

    #maincontent .danhsach-title {
        width: 100%;
        padding-right: 0px;
    }
    /*       #maincontent.main-active .danhsach-title .col-2 {
            width: 100%;
            padding-right: 0px;
            margin-left: 22px;
        }*/
    #maincontent.main-active .danhsach {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }

    #maincontent .danhsach {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }

    #maincontent.main-active .danhsach-title .col-2 {
        width: 100%;
        flex: 0 0 33%;
        max-width: 33%;
        margin-left: 27px;
    }

    #maincontent .danhsach-title .col-2 {
        width: 100%;
        flex: 0 0 33%;
        max-width: 33%;
        margin-left: 35px;
    }

    #maincontent.main-active .danhsach-title .line-title {
        max-width: 60.5%;
        margin-left: 8px;
        padding-right: 12px;
    }

    #maincontent .danhsach-title .line-title {
        max-width: 60.5%;
        margin-left: 8px;
        padding-right: 12px;
    }

    #maincontent.main-active .col-md-10 .cf-custom .m-rgh-dskh {
        padding-left: 85px !important;
    }

    #maincontent .col-md-10 .cf-custom .m-rgh-dskh {
        padding-left: 85px !important;
    }

    .col-md-12.col-xs-12.no-padding {
        width: 100%;
        margin-left: -10px;
        padding-right: 0px;
        padding-left: 0px;
    }

    #maincontent.main-active .danhsach {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        margin-top: 20px;
    }

    #maincontent .danhsach {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        margin-top: 20px;
    }
}

@media only screen and (max-width: 812px) and (max-height: 540px) {
    #maincontent.main-active .col-md-10 .cf-custom-dskh .m-rgh-dskh .style-el-dskh {
        margin-right: 22px;
    }

    #maincontent .col-md-10 .cf-custom-dskh .m-rgh-dskh .style-el-dskh {
        margin-right: 22px;
    }
}

@media only screen and (max-width : 736px) and (max-height: 540px) {
    .style-el {
        width: 304px !important;
    }

    .fl-icon {
        left: 245px;
    }

    #maincontent.main-active .danhsach-title .line-title {
        max-width: 56.2%;
        margin-left: 7px;
        padding-right: 0px;
    }

    #maincontent .danhsach-title .line-title {
        max-width: 56.2%;
        margin-left: 7px;
        padding-right: 0px;
    }

    .img-fluid {
        width: 100%;
        max-width: 305px !important;
        height: 185px !important;
    }

    .m-title {
        width: 284px !important;
    }

    div#jquery-accordion-menu {
        display: none;
    }

    #maincontent.main-active .maincontent-row {
        width: 100%;
    }

    #maincontent .maincontent-row {
        width: 100%;
    }

    .danhmuc .danhmuc-title .img {
        background-image: url(../../images/elearning/line-240.png);
        height: 5px;
        width: 100%;
    }

    #maincontent.main-active .col-md-2.danhmuc {
        flex: 0 0 89% !important;
        max-width: 100% !important;
        margin-left: 5.5% !important;
    }

    #maincontent .col-md-2.danhmuc {
        flex: 0 0 89% !important;
        max-width: 100% !important;
        margin-left: 7% !important;
    }

    #maincontent.main-active .danhsach-title {
        width: 100%;
        padding-right: 0px;
    }

    #maincontent .danhsach-title {
        width: 100%;
        padding-right: 0px;
    }
    /*       #maincontent.main-active .danhsach-title .col-2 {
            width: 100%;
            padding-right: 0px;
            margin-left: 22px;
        }*/
    #maincontent.main-active .danhsach {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }

    #maincontent .danhsach {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }

    #maincontent.main-active .danhsach-title .col-2 {
        width: 100%;
        flex: 0 0 38%;
        max-width: 38%;
        margin-left: 22px;
    }

    #maincontent .danhsach-title .col-2 {
        width: 100%;
        flex: 0 0 38%;
        max-width: 38%;
        margin-left: 35px;
    }

    #maincontent.main-active .col-md-10 .cf-custom .m-rgh-dskh {
        padding-left: 55px !important;
    }

    #maincontent .col-md-10 .cf-custom .m-rgh-dskh {
        padding-left: 55px !important;
    }

    .col-md-12.col-xs-12.no-padding {
        width: 100.5%;
        margin-left: -10px;
    }

    #maincontent.main-active .danhsach {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        margin-top: 20px;
    }

    #maincontent .danhsach {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        margin-top: 20px;
    }

    nav#sidebar.sidebar-unactive {
        margin-left: 0px !important;
        min-width: 250px;
    }

    #menutop {
        padding-left: 90px !important;
    }

    .danhsach-table {
        margin-left: 17px;
    }
}

@media only screen and (max-width : 731px) and (max-height: 540px) {
    div#jquery-accordion-menu {
        display: none;
    }

    .col-md-12.col-xs-12.no-padding {
        width: 101%;
        margin-left: -10px;
    }

    #maincontent.main-active .col-md-2.danhmuc {
        flex: 0 0 90% !important;
        max-width: 100% !important;
        margin-left: 5.5% !important;
    }

    #maincontent .col-md-2.danhmuc {
        flex: 0 0 90% !important;
        max-width: 100% !important;
        margin-left: 5.5% !important;
    }

    #maincontent.main-active .danhsach-title .line-title {
        max-width: 57.2%;
        margin-left: 7px;
        padding-right: 0px;
    }

    #maincontent .danhsach-title .line-title {
        max-width: 57.2%;
        margin-left: 7px;
        padding-right: 0px;
    }
}

@media only screen and (max-width : 720px) and (max-height: 540px) {
    div#jquery-accordion-menu {
        display: none;
    }

    #maincontent.main-active .maincontent-row {
        width: 100%;
    }

    #maincontent .maincontent-row {
        width: 100%;
    }

    .danhmuc .danhmuc-title .img {
        background-image: url(../../images/elearning/line-240.png);
        height: 5px;
        width: 100%;
    }

    #maincontent.main-active .col-md-2.danhmuc {
        flex: 0 0 89% !important;
        max-width: 100% !important;
        margin-left: 6% !important;
    }

    #maincontent .col-md-2.danhmuc {
        flex: 0 0 89% !important;
        max-width: 100% !important;
        margin-left: 7% !important;
    }

    #maincontent.main-active .danhsach-title {
        width: 100%;
        padding-right: 0px;
    }

    #maincontent .danhsach-title {
        width: 100%;
        padding-right: 0px;
    }
    /*       #maincontent.main-active .danhsach-title .col-2 {
            width: 100%;
            padding-right: 0px;
            margin-left: 22px;
        }*/
    #maincontent.main-active .danhsach {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }

    #maincontent .danhsach {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }

    #maincontent.main-active .danhsach-title .col-2 {
        width: 100%;
        flex: 0 0 38%;
        max-width: 38%;
        margin-left: 24px;
    }

    #maincontent .danhsach-title .col-2 {
        width: 100%;
        flex: 0 0 38%;
        max-width: 38%;
        margin-left: 35px;
    }

    #maincontent.main-active .danhsach-title .line-title {
        max-width: 57%;
        margin-left: 0px;
        padding-right: 0px;
    }

    #maincontent .danhsach-title .line-title {
        max-width: 55.5%;
        margin-left: 7px;
        padding-right: 0px;
    }

    #maincontent.main-active .col-md-10 .cf-custom .m-rgh-dskh {
        padding-left: 45px !important;
    }

    #maincontent .col-md-10 .cf-custom .m-rgh-dskh {
        padding-left: 55px !important;
    }

    .col-md-12.col-xs-12.no-padding {
        width: 101%;
        margin-left: -25px;
    }

    #maincontent.main-active .danhsach {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        margin-top: 20px;
    }

    #maincontent .danhsach {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        margin-top: 20px;
    }

    nav#sidebar.sidebar-unactive {
        margin-left: 0px !important;
        min-width: 325px;
    }

    #menutop {
        padding-left: 50px !important;
    }

    .danhsach-table {
        margin-left: 19px;
    }

    .style-el {
        width: 293px !important;
    }

    #maincontent.main-active .col-md-10 .cf-custom-dskh .m-rgh-dskh .style-el-dskh {
        margin-right: 30px;
    }

    #maincontent .col-md-10 .cf-custom-dskh .m-rgh-dskh .style-el-dskh {
        margin-right: 30px;
    }

    .fl-icon {
        left: 240px;
    }

    .img-fluid {
        width: 100%;
        max-width: 305px !important;
        height: 180px !important;
    }

    .m-title {
        width: 270px !important;
    }

    .col-md-12.col-xs-12.no-padding {
        width: 101%;
        margin-left: -11px;
    }
}

@media only screen and (max-width : 667px) and (max-height: 540px) {
    .style-el {
        width: 272px !important;
    }

    .img-fluid {
        width: 100%;
        max-width: 272px !important;
        height: 160px !important;
    }

    #maincontent.main-active .col-md-2.danhmuc {
        flex: 0 0 90% !important;
        max-width: 100% !important;
        margin-left: 6% !important;
    }

    #maincontent .col-md-2.danhmuc {
        flex: 0 0 90% !important;
        max-width: 100% !important;
        margin-left: 6% !important;
    }

    .m-title {
        width: 250px !important;
    }

    #maincontent.main-active .danhsach-title .col-2 {
        width: 100%;
        flex: 0 0 40%;
        max-width: 40%;
        margin-left: 21px;
    }

    .fl-icon {
        left: 245px;
    }

    #maincontent .danhsach-title .col-2 {
        width: 100%;
        flex: 0 0 40%;
        max-width: 40%;
        margin-left: 30px;
    }

    #maincontent.main-active .danhsach-title .line-title {
        max-width: 55%;
        margin-left: 0px;
        padding-right: 0px;
    }

    #maincontent .danhsach-title .line-title {
        max-width: 55%;
        margin-left: 0px;
        padding-right: 0px;
    }

    #maincontent.main-active .col-md-10 .cf-custom .m-rgh-dskh {
        padding-left: 18px !important;
    }

    #maincontent.main-active .danhsach-title {
        width: 102%;
        padding-right: 0px;
    }

    #maincontent .col-md-10 .cf-custom .m-rgh-dskh {
        padding-left: 18px !important;
    }

    #maincontent .danhsach-title {
        width: 102%;
        padding-right: 0px;
    }

    .col-md-12.col-xs-12.no-padding {
        width: 102%;
        margin-left: -10px;
    }

    .danhsach-table {
        margin-left: 14px;
    }
}

@media only screen and (max-width : 640px) and (max-height: 540px) {
    #maincontent.main-active .col-md-2.danhmuc {
        flex: 0 0 94.4% !important;
        max-width: 100% !important;
        margin-left: 3% !important;
    }

    #maincontent.main-active .danhsach-title {
        width: 108%;
        padding-right: 0px;
        margin-left: -33px;
    }

    #maincontent .col-md-2.danhmuc {
        flex: 0 0 94.4% !important;
        max-width: 100% !important;
        margin-left: 3% !important;
    }

    #maincontent .danhsach-title {
        width: 108%;
        padding-right: 0px;
        margin-left: -33px;
    }

    .fl-icon {
        left: 220px;
    }

    .col-md-12.col-xs-12.no-padding {
        width: 109%;
        margin-left: -25px;
    }

    .col-md-12.col-xs-12.no-padding {
        width: 103.6%;
        margin-left: -10px;
    }

    .danhsach-table {
        margin-left: -2px;
    }

    #maincontent.main-active .danhsach-title .col-2 {
        width: 100%;
        flex: 0 0 42%;
        max-width: 42%;
        margin-left: 20px;
    }

    #maincontent .danhsach-title .col-2 {
        width: 100%;
        flex: 0 0 42%;
        max-width: 42%;
        margin-left: 30px;
    }

    #maincontent.main-active .danhsach-title .line-title {
        max-width: 52%;
        margin-left: 0px;
        padding-right: 0px;
    }

    #maincontent.main-active .col-md-10 .cf-custom .m-rgh-dskh {
        padding-left: 5px !important;
    }

    #maincontent .danhsach-title .line-title {
        max-width: 52%;
        margin-left: 0px;
        padding-right: 0px;
    }

    #maincontent .col-md-10 .cf-custom .m-rgh-dskh {
        padding-left: 5px !important;
    }
}

@media only screen and (max-width : 568px) and (max-height: 540px) {
    #maincontent.main-active .col-md-2.danhmuc {
        flex: 0 0 102.4% !important;
        max-width: 102% !important;
        margin-left: -1% !important;
    }

    #maincontent .col-md-2.danhmuc {
        flex: 0 0 102.4% !important;
        max-width: 102% !important;
        margin-left: -1% !important;
    }

    #maincontent.main-active .danhsach-title {
        width: 115%;
        padding-right: 0px;
        margin-left: -48px;
    }

    #maincontent .danhsach-title {
        width: 115%;
        padding-right: 0px;
        margin-left: -48px;
    }

    #maincontent.main-active .danhsach-title .col-2 {
        width: 100%;
        flex: 0 0 48%;
        max-width: 48%;
        margin-left: 13px;
    }

    #maincontent.main-active .col-md-10 .cf-custom-dskh .m-rgh-dskh .style-el-dskh {
        margin-right: 9px;
    }

    .danhsach-table {
        margin-left: -30px;
    }

    #maincontent.main-active .danhsach-title .line-title {
        max-width: 48%;
        margin-left: 0px;
        padding-right: 0px;
    }

    #maincontent.main-active .col-md-10 .cf-custom .m-rgh-dskh {
        padding-left: 105px !important;
    }

    .col-md-12.col-xs-12.no-padding {
        width: 113.5%;
        margin-left: -25px;
    }

    .col-md-10.danhsach {
        margin-left: 1px;
    }

    .col-md-12.col-xs-12.no-padding {
        width: 107.5%;
        margin-left: -9px;
    }
}


/*trong boostrap*/
.pagination {
    display: inline-block;
    padding-left: 0;
    margin: 20px 0;
    border-radius: 4px;
}

    .pagination > li {
        display: inline;
    }

        .pagination > li > a,
        .pagination > li > span {
            position: relative;
            float: left;
            padding: 6px 12px;
            margin-left: -1px;
            line-height: 1.42857143;
            color: #337ab7;
            text-decoration: none;
            background-color: #fff;
            border: 1px solid #ddd;
        }

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

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

        .pagination > li > a:hover,
        .pagination > li > span:hover,
        .pagination > li > a:focus,
        .pagination > li > span:focus {
            z-index: 2;
            color: #23527c;
            background-color: #eee;
            border-color: #ddd;
        }

    .pagination > .active > a,
    .pagination > .active > span,
    .pagination > .active > a:hover,
    .pagination > .active > span:hover,
    .pagination > .active > a:focus,
    .pagination > .active > span:focus {
        z-index: 3;
        color: #fff;
        cursor: default;
        background-color: #9d4d9e;
        border-color: #9d4d9e;
    }

    .pagination > .disabled > span,
    .pagination > .disabled > span:hover,
    .pagination > .disabled > span:focus,
    .pagination > .disabled > a,
    .pagination > .disabled > a:hover,
    .pagination > .disabled > a:focus {
        color: #777;
        cursor: not-allowed;
        background-color: #fff;
        border-color: #ddd;
    }

.pagination-lg > li > a,
.pagination-lg > li > span {
    padding: 10px 16px;
    font-size: 18px;
    line-height: 1.3333333;
}

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

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

.pagination-sm > li > a,
.pagination-sm > li > span {
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
}

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

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

.pager {
    padding-left: 0;
    margin: 20px 0;
    text-align: center;
    list-style: none;
}

    .pager li {
        display: inline;
    }

        .pager li > a,
        .pager li > span {
            display: inline-block;
            padding: 5px 14px;
            background-color: #fff;
            border: 1px solid #ddd;
            border-radius: 15px;
        }

            .pager li > a:hover,
            .pager li > a:focus {
                text-decoration: none;
                background-color: #eee;
            }

    .pager .next > a,
    .pager .next > span {
        float: right;
    }

    .pager .previous > a,
    .pager .previous > span {
        float: left;
    }

    .pager .disabled > a,
    .pager .disabled > a:hover,
    .pager .disabled > a:focus,
    .pager .disabled > span {
        color: #777;
        cursor: not-allowed;
        background-color: #fff;
    }


.pagination > li > a {
    background: #fafafa;
    color: #666;
    cursor: pointer;
}

/*custom jstree*/
.jstree-default a {
    white-space: normal !important;
    height: auto;
}

.jstree-anchor {
    height: auto !important;
}

.jstree-default li > ins {
    vertical-align: top;
}

.jstree-leaf {
    height: auto;
}

    .jstree-leaf a {
        height: auto !important;
    }


/*custom tree UI*/
#tree-cates-course .jstree-themeicon {
    display: none;
}

#tree-cates-course > ul {
    padding-right: .5rem !important;
    overflow: hidden;
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}

/*custom giao diện danh sách*/

.name-learn {
    font-size: 16px;
}

.m-title > a {
    display: inline-block;
}

    .m-title > a > label {
        margin-bottom: 0px;
    }

.course-desc {
    margin: 0px 10px 10px 10px;
    height: 57px !important;
    line-height: 19px;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 0.92rem;
}

.course-prices {
    text-align: right;
    margin: 0px 10px 10px 10px;
    white-space: nowrap;
}

    .course-prices .base-price {
        font-size: 14px;
        color: #868686;
        text-decoration: line-through;
    }

    .course-prices .sell-price {
        font-size: 18px;
        color: #2b76b7;
    }

.course-buttons {
    text-align: right;
    margin: 0px 10px 10px 10px;
    justify-content: space-between;
}

    .course-buttons .btn {
        padding-top: 0.25rem;
    }

    .course-buttons .course-buttons-rate {
        padding-top: 5px;
    }