﻿.item-lesson-course {
    cursor: pointer;
}

    .item-lesson-course.active {
        background-color: #F7F7F7;
        color: #3663F0;
        border-color: rgba(0, 0, 0, 0.125);
    }

        .item-lesson-course.active .cnt-progressbar-video-list {
            color: #333;
        }

.list-group-item.has-seen,
.list-group-item.has-seen a.cnt-name-lesson {
    color: #959595;
}

.list-group-item a.cnt-name-lesson {
    text-decoration: none;
    color: #333;
}

.icon-has-seen {
    position: absolute;
    right: 0px;
    top: 0px;
    color: #3762f0;
    display: none;
}

.list-group-item.has-seen .icon-has-seen {
    display: block;
}

.list-group-item .cnt_content_row_name {
    position: relative;
    padding-right: 190px;
}

    .list-group-item .cnt_content_row_name .cnt_arrow {
        position: absolute;
        top: 0px;
        left: -18px;
        width: 26px;
        text-align: center;
        height: 26px;
    }

    .list-group-item .cnt_content_row_name a {
        text-decoration: none;
        color: #333;
    }

.area-breadcrumb {
    position: relative !important;
    top: 0px;
    background-color: #FAFAFA;
    /*background-color: #FFFFFF;*/
}

.cnt-breadcrumb .breadcrumb .breadcrumb-item a {
    color: #004388;
    text-decoration: none;
}

.breadcrumb-item + .breadcrumb-item::before {
    color: #004388;
}

.cnt-breadcrumb a:not([href]):not([tabindex]) {
    color: #474747 !important;
}

.rateit .rateit-selected {
    background-position: left -32px;
}

.k-pdf-export #qrcode_cert_path {
    display: block !important;
}

.lst_content_disscuss {
    background-color: #f6f6f6;
    height: 100%;
}

    .lst_content_disscuss .cnt-search {
        border-color: #333 !important;
    }

        .lst_content_disscuss .cnt-search input {
            width: calc(100% - 20px);
            display: inline-block;
            background-color: transparent;
        }

    .lst_content_disscuss .item-discuss {
        margin-left: -1.25rem;
        padding-left: 1.25rem;
        margin-right: -1.25rem;
        padding-right: 1.25rem;
        line-height: 26px;
    }

        .lst_content_disscuss .item-discuss:hover,
        .lst_content_disscuss .item-discuss.active {
            background-color: #EDF0FF;
        }

        .lst_content_disscuss .item-discuss .title {
            font-weight: 600;
            overflow: hidden;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            width: 100%;
        }

        .lst_content_disscuss .item-discuss.active .title,
        .lst_content_disscuss .item-discuss:hover .title {
            color: #5474da;
        }

        .lst_content_disscuss .item-discuss.active .content-comment,
        .lst_content_disscuss .item-discuss:hover .content-comment,
        .lst_content_disscuss .item-discuss.active .content-comment > *,
        .lst_content_disscuss .item-discuss:hover .content-comment > * {
            color: #333;
        }

        .lst_content_disscuss .item-discuss .content-comment,
        .lst_content_disscuss .item-discuss .content-comment > * {
            color: #959595;
            width: 100%;
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden;
        }

            .lst_content_disscuss .item-discuss .content-comment p {
                margin-bottom: 0px !important;
            }

        .lst_content_disscuss .item-discuss .avatar-img {
            object-fit: cover;
            height: 40px;
            width: 40px;
            border-radius: 50%;
        }

        .lst_content_disscuss .item-discuss .post-name {
            font-weight: 600
        }

        .lst_content_disscuss .item-discuss .post-date {
            color: #959595
        }

        .lst_content_disscuss .item-discuss .cnt-sum-comment {
            color: #959595
        }

            .lst_content_disscuss .item-discuss .cnt-sum-comment i {
                top: 4px;
            }

.detail-disscuss {
    background-color: #f6f6f6;
    margin-left: -26px;
    padding-left: 26px;
    padding-top: 15px;
    padding-bottom: 20px;
    margin-right: -1px;
}

    .detail-disscuss .cnt-tool-edit {
        right: 0px;
        top: 0px;
        width: 60px;
        text-align: right;
        padding-right: 15px;
    }

        .detail-disscuss .cnt-tool-edit i {
            cursor: pointer;
        }

    .detail-disscuss .title {
        font-weight: 600;
        width: calc(100% - 60px);
        font-size: 20px;
    }

    .detail-disscuss .avatar-img {
        object-fit: cover;
        height: 40px;
        width: 40px;
        border-radius: 50%;
    }

    .detail-disscuss .post-name {
        font-weight: 600;
    }

    .detail-disscuss .post-date {
        color: #959595
    }

    .detail-disscuss .cnt-sum-comment {
        color: #959595
    }

        .detail-disscuss .cnt-sum-comment i {
            top: 4px;
        }

.content-comment {
    font-size: 16px;
}

    .content-comment p {
        margin-bottom: 0px;
    }

.cnt-tool-add-disscuss {
    position: absolute;
    right: 5px;
    top: -48px;
    color: #949494;
    z-index: 1;
}


    .cnt-tool-add-disscuss .icon-add-disscuss {
        background-color: #3863EE;
        color: #fff;
        cursor: pointer;
        font-size: 12px;
        padding: 9px;
        width: 30px;
        height: 30px;
        display: inline-block;
        border-radius: 50%;
        text-align: center;
        line-height: 11px;
        margin-left: 10px;
    }

.content-detail-course .tab-pane[aria-labelledby="pills-introduction-tab"] img {
    max-width: 100%;
}

.cnt_relation .carousel-control-prev,
.cnt_relation .carousel-control-next {
    display: none;
}

.image_course_detail {
    height: 320px;
    object-fit: cover;
}

.vnumthoigian {
    position: absolute;
    width: 80px;
    top: 5px;
    right: 15px;
}

.vthoigian {
    color: #3762f0;
    font-weight: 600;
    position: absolute;
    right: 68px;
    top: 5px;
}

    .vchild_sobai i.iconmoon.iconmoon-KhoaHocAdmin,
    .vsobai_ i.iconmoon.iconmoon-KhoaHocAdmin,
    .vsobai i.iconmoon.iconmoon-KhoaHocAdmin,
    .vthoigian i.iconmoon.iconmoon-ThoiGian {
        font-size: 22px;
    }

.vthanhdoc {
    color: #3762f0;
    font-weight: 600;
    position: absolute;
    right: 108px;
    top: -2px;
    font-size: 22px;
}

.vnumsobai {
    position: absolute;
    width: 55px;
    top: 5px;
    right: 130px
}

.vsobai {
    color: #3762f0;
    font-weight: 600;
    position: absolute;
    right: 180px;
    top: 5px;
}

.vsobai_ {
    color: rgb(55, 98, 240);
    font-weight: 600;
    position: absolute;
    right: 70px;
    font-size: 22px;
    top: 2px;
}

.vnumsobai_ {
    position: absolute;
    width: 80px;
    top: 5px;
    right: 20px;
    text-align: right;
}

.vchild_sobai {
    color: #3762f0;
    font-weight: 600;
    position: absolute;
    right: 180px;
    top: 2px;
}

.vchild_numsobai {
    position: absolute;
    width: 55px;
    top: 5px;
    right: 114px;
    top: 0px
}

.vchild_numtg {
    position: absolute;
    right: 35px;
    top: 0px;
    color: #959595
}

.viewcltask {
    position: relative;
    width: 100%;
    padding-left: 20px;
    padding-right: 20px;
}

.detail_bl {
    color: #456CF5;
    cursor: pointer;
    font-size: 25px;
}

.cnt_schedule_course .position-relative.pr-3.pl-3.py-3:last-child {
    border-bottom: 0px !important;
}
/*notify*/

#lst_content_notify .item-notify .p-2.pt-lg-3.pb-lg-3 {
    padding: 1rem !important;
}

.box_detail_notify,
.lst_content_notify {
    padding-right: 0px;
    padding-top: 0px;
    overflow: auto;
    padding-left: 0px;
    padding-bottom: 0px;
}

#lst_content_notify {
    border-right: 1px solid #ebebeb
}

.lst_content_notify .item-notify {
    cursor: pointer;
}

    .lst_content_notify .item-notify:hover,
    .lst_content_notify .item-notify.active {
        background-color: #edf1ff;
    }

    .lst_content_notify .item-notify .title {
        font-weight: 600;
        overflow: hidden;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        width: 100%;
    }

    .lst_content_notify .item-notify.active .title,
    .lst_content_notify .item-notify:hover .title {
        color: #5474da;
    }

    .lst_content_notify .item-notify .avatar-img {
        object-fit: cover;
        height: 40px;
        width: 40px;
        border-radius: 50%;
    }

    .lst_content_notify .item-notify .post-name {
        font-weight: 600
    }

    .lst_content_notify .item-notify .post-date {
        color: #959595
    }

    .lst_content_notify .item-notify .content-notify,
    .lst_content_notify .item-notify .content-notify > * {
        color: #959595;
        width: 100%;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        height: 30px;
    }

.detail-notify .title {
    font-weight: 600;
    width: calc(100% - 60px);
    font-size: 20px;
}

.detail-notify .avatar-img {
    object-fit: cover;
    height: 40px;
    width: 40px;
    border-radius: 50%;
}

.detail-notify .post-name {
    font-weight: 600;
}

.detail-notify .post-date {
    color: #959595
}

.item-lesson-course .cnt-name-lesson:hover,
.item-lesson-course .cnt-name-lesson:hover a,
.list-group-item.has-seen a.cnt-name-lesson:hover {
    color: #3463EF;
}

@media (max-width: 767.98px) {
    .vnumthoigian {
        font-size: 11px;
        right: 0px;
    }

    .vthoigian {
        font-size: 11px !important;
        right: 36px;
        top: 6px;
    }

        .vchild_sobai i.iconmoon.iconmoon-KhoaHocAdmin,
        .vsobai_ i.iconmoon.iconmoon-KhoaHocAdmin,
        .vsobai i.iconmoon.iconmoon-KhoaHocAdmin,
        .vthoigian i.iconmoon.iconmoon-ThoiGian {
            font-size: 16px;
        }

    .vsobai_ {
        font-size: 16px;
        right: 50px;
        top: 2px
    }

    .vnumsobai_ {
        font-size: 14px;
        right: 5px;
    }

    .vsobai {
        font-size: 11px;
        right: 105px;
        top: 6px
    }

    .vnumsobai {
        font-size: 11px;
        right: 70px;
    }

    .vthanhdoc {
        font-size: 11px;
        right: 58px;
        top: 4px;
    }

    .vchild_sobai {
        right: 100px;
        top: 2px
    }

    .vchild_numsobai {
        right: 40px;
        font-size: 11px;
        top: 5px;
    }

    .vchild_numtg {
        font-size: 11px;
        right: 24px;
        top: 4px;
        color: #959595
    }

    .cnt-tool-add-disscuss {
        top: -58px;
    }

    #viewQRCode_cetificate.modal.show .modal-dialog {
        width: auto !important;
        margin: 0 !important;
        height: auto !important;
    }

        #viewQRCode_cetificate.modal.show .modal-dialog .modal-content {
            margin: auto;
            width: auto;
        }

    .list-group-item .cnt_content_row_name {
        position: relative;
        padding-right: 110px;
    }
}

@media (max-width: 566.98px) {
    .vchild_numtg {
        font-size: 11px;
        right: 24px;
        top: 4px;
    }

    .vnumthoigian {
        font-size: 11px;
        right: 0px;
    }

    .vthoigian {
        font-size: 11px !important;
        right: 36px;
        top: 6px;
    }

        .vchild_sobai i.iconmoon.iconmoon-KhoaHocAdmin,
        .vsobai_ i.iconmoon.iconmoon-KhoaHocAdmin,
        .vsobai i.iconmoon.iconmoon-KhoaHocAdmin,
        .vthoigian i.iconmoon.iconmoon-ThoiGian {
            font-size: 11px;
        }

    .vsobai_ {
        font-size: 14px;
        right: 44px;
        top: 2px
    }

    .vnumsobai_ {
        font-size: 11px;
        right: 5px;
    }

    .vsobai {
        font-size: 11px;
        right: 105px;
        top: 6px
    }

    .vnumsobai {
        font-size: 11px;
        right: 70px;
    }

    .vthanhdoc {
        font-size: 11px;
        right: 58px;
        top: 4px;
    }

    .vchild_sobai {
        right: 100px;
        top: 2px
    }

    .vchild_numsobai {
        right: 40px;
        font-size: 11px;
        top: 5px;
    }

    .lst_content_disscuss .cnt-search,
    .lst_content_disscuss .item-discuss .title,
    .lst_content_disscuss .item-discuss .content-comment,
    .lst_content_disscuss .item-discuss .post-name,
    .lst_content_disscuss .item-discuss .post-date,
    .lst_content_disscuss .item-discuss .cnt-sum-comment {
        display: none;
    }

    .lst_content_disscuss {
        padding: 0px;
    }

        .lst_content_disscuss .item-discuss {
            margin: 0px;
            text-align: center;
            padding: 0px;
        }

    .content-detail-course .cnt-detail-tab {
        padding: 0px;
    }

    .detail-disscuss {
        padding-left: 10px;
    }

        .detail-disscuss + div,
        .detail-disscuss + div + div {
            margin-left: -20px;
        }

    .list-group-item .cnt_content_row_name {
        position: relative;
        padding-right: 110px;
    }
}

@media (min-width: 1240px) and (max-width:1340px) {
    .image_course_detail {
        height: 240px;
        object-fit: cover;
    }
}

@media (min-width: 1340px) and (max-width:1600px) {
    .image_course_detail {
        height: 280px;
        object-fit: cover;
    }
}

@media (min-width: 1600px) {
    .image_course_detail {
        height: 320px;
        object-fit: cover;
    }
}

@media (min-width: 992px) and (max-width: 1240px) {
    .image_course_detail {
        height: 200px;
        object-fit: cover;
    }
}

@media (max-width: 575px) {
    .image_course_detail {
        height: 240px;
        object-fit: cover;
    }

    .card .card-body {
        padding-left: 0.5rem;
        padding-top: 0.5rem;
        padding-bottom: 0.5rem;
    }

    .item-lesson-course {
        padding-left: 0.5rem;
    }
}
