/* gop tu file static/css/style.css */

/* custom css*/
@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');

.breadscrum a {
    color: #ffffff !important;
}

.cate_name_course_of_cate {
    display: none;
}

.navbar-content-header .unica-menu-cate-header i {
    display: none;
}

@media (min-width: 980px) {
    /* For desktop: */
    .column-1 {
        width: 60%;
    }

    .column-2 {
        width: 40%;
    }

    .column-3 {
        width: 33%;
    }

    .button-width {
        width: 180px;
    }

    .banner h1 {
        font-size: 42px;
        font-weight: 600;
    }

    .banner p {
        font-size: 20px;
        font-weight: 400;
    }

    .banner {
        margin-top: 100px;
        margin-right: 100px;
        margin-left: 20px;
    }

    .columnHomepage {
        float: left;
        width: 33%;
    }

    .column2 {
        float: left;
        width: 50%;
    }

    .hpg_margin {
        margin: 100px 0px 0px 0px;
    }

    .hpg_margin2 {
        margin: 50px 0px 0px 100px;
    }

    .column4 {
        float: left;
        width: 25%;
    }

    .learn-button {
        width: 24%
    }

        .learn-button a {
            width: 24%
        }
}

@media (max-width: 979px) {

    /* For mobile: */
    .column-1 {
        width: 100%;
    }

    .column-2 {
        width: 100%;
    }

    .button-width {
        width: 100%;
    }

    .mobile-hide {
        display: none;
    }

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

    .banner h1 {
        font-size: 32px;
        font-weight: 600;
    }

    .banner p {
        font-size: 18px;
        font-weight: 400;
    }

    .banner {
        margin-right: 30px;
        margin-left: 30px;
    }

    .columnHomepage {
        width: 100%;
    }

    .column2 {
        width: 100%;
    }

    .hpg_margin {
        margin: 20px 30px 20px 30px;
    }

    .hpg_margin2 {
        margin: 20px 30px 20px 30px;
    }

    .column4 {
        width: 100%;
    }

    .learn-button {
        width: 100%
    }

        .learn-button a {
            width: 100%
        }
}

.button {
    background-color: #002333;
    border: none;
    color: white;
    padding: .5em 1em;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    cursor: pointer;
    border-radius: 4px;
}

    .button:hover {
        font-weight: bold;
        color: white;
    }

.button2 {
    background-color: white;
    border: 1px solid #245ba3;
    color: #245ba3;
    padding: .5em 1em;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
    margin: 4px 2px;
    cursor: pointer;
    border-radius: 6px;
    width: 95%;
}

    .button2:hover {
        font-weight: bold;
    }


.pmmisa {
    background: #2F80ED; /* fallback for old browsers */
    display: inline-block;
    color: #FFF;
    padding: .5em 1em;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 3px 6px rgb(0 0 0 / 8%);
    text-align: center;
}

//original below
.course-section .rota-top-left {
    top: 25px;
    left: 10px;
}

.title-style {
    text-align: center;
    margin-bottom: 40px;
}

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

#main {
    min-height: calc(100vh - 127px);
}

.pdr-0-style {
    padding-right: 0 !important;
}

.teacher-name-course-section-style {
    margin-bottom: 0;
}

.pull-left-style {
    float: left;
}

.pull-right-style {
    float: right;
}

.rating_course_style i {
    color: #f26c4f;
}

.count_review_course_style {
    margin-left: 5px;
}

.price-col-style {
    margin-bottom: 10px;
    color: #333 !important;
}

.item-review-style {
    padding: 10px 0;
    min-height: 72px;
}

.mb-join-code {
    text-align: center;
}


/* gv */
.u-teacher-top-style {
    background-image: url(../img/page-title-background.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 341px;
    position: relative;
}

.utt-bot-style {
    display: inline-block;
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    color: #fff;
}

.u-teacher-avatar-style {
    float: left;
    margin-bottom: 20px;
}

    .u-teacher-avatar-style img {
        border-radius: 85px;
    }

.u-teacher-info-style {
    display: inline-block;
    margin-top: 20px;
}

    .u-teacher-info-style h1 {
        font-size: 30px;
        font-weight: bold;
    }

    .u-teacher-info-style span {
        font-size: 20px;
        display: block;
        width: 375px;
    }

.uti-link-style {
    margin-top: 20px;
}

.u-teacher-info-style a {
    margin-top: 20px;
    color: #fff;
    padding: 10px 20px;
    border-radius: 3px;
    border: 1px solid #fff;
    width: 175px;
    margin-right: 10px;
}

.u-teacher-right-style {
    float: right;
    margin-top: 50px;
}

    .u-teacher-right-style ul li {
        display: inline;
        float: left;
        text-align: center;
        margin: 0 20px;
    }

    .u-teacher-right-style p {
        font-size: 48px;
        font-weight: bold;
    }

    .u-teacher-right-style span {
        font-weight: bold;
    }

.u-teacher-intro-style {
    margin: 10px 0;
}

    .u-teacher-intro-style h3 {
        font-size: 18px;
        font-weight: bold;
        margin-bottom: 10px;
    }

    .u-teacher-intro-style p {
        margin: 10px 0;
        text-align: justify;
    }

.u-teacher-video-style {
    margin: 20px 0;
}

.u-box-course-style {
    background: #f6f6f6;
}

.u-box-course-teacher-style {
    margin: 15px 0 20px 0;
}

    .u-box-course-teacher-style h2 {
        font-size: 18px;
        font-weight: bold;
    }

    .u-box-course-teacher-style ul {
        padding: 0;
    }

    .u-box-course-teacher-style p {
        margin: 0;
    }

.ubc-course-style {
    position: relative;
    border: 1px solid #e0e0e0;
    background: #fff;
    padding: 10px 10px 5px 10px;
    border-radius: 3px;
    display: inline-block;
    width: 100%;
    margin-bottom: 10px;
}

.img-ubc-course-style {
    width: 30%;
    float: left;
}

    .img-ubc-course-style img {
        width: 100%;
    }

.des-ubc-course-style {
    width: 47%;
    float: left;
    margin-left: 20px;
}

    .des-ubc-course-style p {
        font-size: 16px;
        font-weight: bold;
        margin-bottom: 10px;
    }

.mini-des-style {
    display: inline-block;
    margin-bottom: 10px;
}

    .mini-des-style li {
        float: left;
        margin-right: 20px;
        list-style: none;
    }

.lp-bc-price-style .price-b {
    font-size: 34px;
    text-decoration: none;
}

.lp-bc-price-style a {
    background: #ff0000;
    padding: 10px 20px;
    text-transform: uppercase;
    font-size: 16px;
    text-align: center;
    color: #fff;
    display: inline-block;
    width: 100%;
    border-radius: 3px;
}

.lp-bc-price-style .price-b sup {
    font-size: 20px;
}

.lp-bc-price-style .price-s {
    font-size: 24px;
    color: #696969;
    text-decoration: line-through;
}

    .lp-bc-price-style .price-s sup {
        font-size: 12px;
    }

.lp-bc-price-style .price-o {
    font-size: 14px;
    background: #f26522;
    border-radius: 3px;
    padding: 5px;
    color: #fff;
    display: inline-block;
    margin: 10px 0;
}

@media (max-width: 767px) {
    .u-teacher-left-style {
        margin-top: 20px;
        text-align: center;
    }

    .u-teacher-avatar-style {
        margin-right: 0;
        float: none;
    }

    .u-teacher-info-style {
        margin: 0;
    }

        .u-teacher-info-style span {
            width: 295px;
            font-size: 15px;
        }

        .u-teacher-info-style a {
            display: block;
            float: left;
        }

    .u-teacher-right-style {
        margin-top: 0;
        float: none;
    }

        .u-teacher-right-style ul li {
            margin: 0 5px;
            width: 25%;
        }

        .u-teacher-right-style p {
            font-size: 26px;
        }

    .img-ubc-course-style, .des-ubc-course-style, .ubc-btn p, .ubc-btn a {
        width: 100%;
    }

    .des-ubc-course-style {
        margin: 0;
    }

    .u-teacher-info-style a {
        width: 155px;
    }

    .lp-bc-price-style {
        width: 100%;
    }

        .lp-bc-price-style .price-b {
            display: inline-block;
            width: 100%;
        }

    .utt-bot-style {
        position: relative;
        padding-bottom: 20px;
    }

    .u-teacher-top-style {
        height: auto;
    }
}

/* payment */
.create-fullwidth-style {
    padding: 0px 25px;
}

    .create-fullwidth-style .container {
        background: white;
    }

.height-100-style {
    min-height: 100% !important;
}

.table-style thead th {
    border-bottom: 0 !important;
}

.name-course-style {
    font-size: 18px;
    font-weight: 400;
    color: #5c82d3 !important;
}

#form-apply-discount td, #form-apply-discount th {
    border-top: none;
}

.response-error-style {
    margin: 10px 0;
    color: red;
}

.btn-apply-discount-style {
    margin-top: 17px;
    border: 1px solid #5c82d3;
    width: 66px;
    text-align: center;
    padding: 2px 5px;
    background: #5c82d3;
    font-weight: 400;
    font-size: 13px;
    color: white !important;
    border-radius: 5px;
}

/* search */
.header-search-boxtop-style {
    width: 100%;
}

.search-form-style {
    font-size: 13px;
    font-style: italic;
    height: 40px;
    width: 99% !important;
}

.header-search-style {
    position: absolute;
    right: 15px;
    background: transparent;
    color: #f26c4f;
    font-size: 15px;
    padding: 6px 20px;
}

/* gop tu file static/css/style.css */


/* gop tu file static/css/slick.css */
/* Slider */
.slick-slider {
    position: relative;
    display: block;
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list {
    position: relative;
    display: block;
    overflow: hidden;
    margin: 0;
    padding: 0;
}

    .slick-list:focus {
        outline: none;
    }

    .slick-list.dragging {
        cursor: pointer;
        cursor: hand;
    }

.slick-slider .slick-track,
.slick-slider .slick-list {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.slick-track {
    position: relative;
    top: 0;
    left: 0;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

    .slick-track:before,
    .slick-track:after {
        display: table;
        content: '';
    }

    .slick-track:after {
        clear: both;
    }

.slick-loading .slick-track {
    visibility: hidden;
}

.slick-slide {
    display: none;
    float: left;
    height: 100%;
    min-height: 1px;
}

[dir='rtl'] .slick-slide {
    float: right;
}

.slick-slide img {
    display: block;
}

.slick-slide.slick-loading img {
    display: none;
}

.slick-slide.dragging img {
    pointer-events: none;
}

.slick-initialized .slick-slide {
    display: block;
}

.slick-loading .slick-slide {
    visibility: hidden;
}

.slick-vertical .slick-slide {
    display: block;
    height: auto;
    border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
    display: none;
}

.related-img-blog {
    height: 200px;
    margin-left: 10px;
    padding-right: 20px;
}

/* gop tu file static/css/slick.css */



/* gop cac file css lien quan den view edit themes */

/* trang home */
/* section header */
.head-content .layer {
    background-color: rgba(33, 33, 33, 1);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0.5;
}

.secton_header_home {
    background-position: center !important;
    background-size: cover !important;
    position: relative !important;
}

/* section course_of_cate */
.section_course_of_cate_home {
    padding: 30px 0;
}

.cate_name_course_of_cate {
    margin-bottom: 15px;
}

/* section course */

@-webkit-keyframes live-pulse {
    0% {
        background-color: #e78dac
    }

    50% {
        background-color: white
    }

    100% {
        background-color: #d9534f
    }
}

@-moz-keyframes live-pulse {
    0% {
        background-color: #d9534f
    }

    50% {
        background-color: white
    }

    100% {
        background-color: #d9534f
    }
}

@keyframes live-pulse {
    0% {
        background-color: #d9534f
    }

    50% {
        background-color: white
    }

    100% {
        background-color: #d9534f
    }
}

.section_course_home {
    padding: 30px 0;
}

.title_section_course_home {
    text-align: center;
    font-weight: bold;
}

/* section combo */
.section_combo_home {
    padding: 30px 0;
}

.title_section_combo_home {
    text-align: center;
    font-weight: bold;
}

/* section what_learn_today */
.section_what_learn_today_home {
    padding: 30px 0;
}

.title_section_what_learn_today_home {
    text-align: center;
    font-weight: bold;
}

/* section teacher */
.section_teacher_home {
    padding: 30px 0;
}

.title_section_teacher_home {
    text-align: center;
    font-weight: bold;
}

/* section link */
.title_section_link_home {
    text-align: center;
    font-weight: bold;
}

/* section blog */
.title_blog a {
    color: #4c6379;
}

.title_blog {
    font-size: 16px;
    font-weight: bold;
    height: 4.2rem;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 3;
    display: -webkit-box !important;
    -webkit-box-orient: vertical;
}

.desc_blog {
    height: 4.8rem;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 3;
    display: -webkit-box !important;
    -webkit-box-orient: vertical;
}

/* file views/sections/main.css trong section */

@-webkit-keyframes live-pulse {
    0% {
        background-color: #e78dac
    }

    50% {
        background-color: white
    }

    100% {
        background-color: #d9534f
    }
}

@-moz-keyframes live-pulse {
    0% {
        background-color: #d9534f
    }

    50% {
        background-color: white
    }

    100% {
        background-color: #d9534f
    }
}

@keyframes live-pulse {
    0% {
        background-color: #d9534f
    }

    50% {
        background-color: white
    }

    100% {
        background-color: #d9534f
    }
}


/*------------------FOOTER------------------------*/



/*
	    ==============================================================
	       Responsive CSS 
	    ==============================================================
	*/

@media (min-width:1601px) {
    .container_slideshow img {
        aspect-ratio: 3/1;
        height: unset;
    }

    .head-content {
        background-size: contain;
        /*aspect-ratio: 3/1;*/
        height: 500px;
        background-position: unset !important;
    }
}

@media (min-width:1366px) and (max-width:1600px) {
    .container_slideshow img {
        aspect-ratio: 3/1;
        height: unset;
    }

    .head-content {
        background-size: contain;
        aspect-ratio: 3/1;
    }

    .lp-main-head {
        padding: 120px;
    }
}

@media (min-width:1200px) and (max-width:1365px) {
    .container_slideshow img {
        aspect-ratio: 3/1;
        height: unset;
    }

    .head-content {
        background-size: contain;
        aspect-ratio: 3/1;
    }
}

@media (min-width:992px) and (max-width:1199px) {
    .lp-ava-name-owner {
        width: 38%;
    }

    .lp-bc-img {
        width: 30%;
    }

    .lp-bc-des {
        width: 45%;
    }

        .lp-bc-des ul li {
            line-height: 1.5;
        }

    .container_slideshow img {
        aspect-ratio: 3/1;
        height: unset;
    }

    .head-content {
        background-size: contain !important;
        aspect-ratio: 3/1;
    }

    .lp-main-head {
        padding: 90px !important;
    }
}

@media (min-width:768px) and (max-width:991px) {
    .lp-main-head {
        padding: 45px !important
    }

    .container_slideshow img {
        aspect-ratio: 3/1;
        height: unset;
    }

    .head-content {
        background-size: contain !important;
        aspect-ratio: 3/1;
    }

    .lp-ava-name-owner {
        width: 32%;
    }

    .lp-box-search-top {
        width: 63%;
    }

    .lp-link-menu {
        float: none;
        text-align: center;
    }

    .inner-col-reason span {
        width: 78%;
    }

    .lp-bc-img {
        width: 25%;
    }

    .lp-bc-des {
        width: 49%;
    }

        .lp-bc-des ul li {
            line-height: 1.5
        }

    .lp-bc-price a {
        padding: 7px;
    }

    .lp-block-testi .container {
        padding: 5px
    }

    .lp-block-testi .col-sm-4 {
        padding: 5px;
    }
}

@media (max-width:767px) {
    /* .block-section-html div
	    {
	        width: unset !important;
	        height: unset !important;
	        display: block !important;
	    } */
    .lp-main-head {
        padding: 20px;
    }

    .course-item .course-item-detail h3.title {
        min-height: unset;
    }

    .lp-ava-name-owner {
        display: none;
    }

    .lp-box-search-top {
        width: 100%;
    }

    .lp-link-menu {
        font-size: 14px;
        float: none;
        margin: 0;
        padding: 10px 0;
    }

    .lp-main-head img {
        margin: 0 0 10px 0;
        width: 40%;
    }

    .box-reason {
        display: block;
    }

        .box-reason .col-12 {
            float: left;
        }

    .lp-bc-img, .lp-bc-des, .lp-bc-price {
        width: 100%;
    }

    .lp-bc-des {
        margin: 10px 0;
    }

        .lp-bc-des ul li {
            line-height: 1.5
        }

    .price-b, .price-s {
        width: 30%;
        text-align: center;
    }

    .price-b {
        font-size: 30px;
        float: left;
    }

        .price-b sup {
            font-size: 15px;
        }

    .price-s {
        font-size: 20px;
        float: left;
        margin-top: 8px;
    }

        .price-s sup {
            font-size: 10px;
        }

    .price-o {
        margin: 0;
    }

    .lp-bc-price a {
        margin-top: 10px;
    }

    .mini-testi {
        margin-bottom: 10px;
    }

    .lp-block-greeting h3, .lp-block-video h3, .lp-block-reason h3, .lp-block-course h3, .lp-block-testi h3 {
        font-size: 20px;
    }

    .head-content {
        background-size: 100% 100% !important;
    }
}

@media (min-width:376px) and (max-width:414px) {
}

@media (min-width:321px) and (max-width:375px) {
    .head-menu .col-12 {
        padding: 5px;
    }

    .price-b, .price-s {
        width: 33%;
    }
}

@media (max-width: 320px) {
    .head-menu .col-12 {
        padding: 5px;
    }

    .lp-link-menu ul li {
        margin-right: 30px;
        font-size: 13px;
    }

    .price-b {
        width: 40%;
    }
}

.item-what {
    display: block;
    width: 100%;
    position: relative;
    height: 115px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.item-what-learn-today {
    margin-top: 15px;
}

.item-what a:hover span {
    color: #d9534f;
}

.item-what .title-what {
    position: absolute;
    width: 100%;
    display: block;
    text-align: center;
    top: 40%;
    font-size: 18px;
    color: #FFF;
    font-weight: 700;
    margin-top: 0px;
}
/* .container-fluid
	{
	    padding-left: 0;
	    padding-right: 0;
	} */
.item-giangvien {
    border-radius: 10px;
    text-align: center;
    margin: 8px;
    background: #fff;
    min-height: 305px;
}

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

    .giangvien-img img {
        border: 1px solid #f1f1f1;
        border-radius: 88px;
        box-shadow: 1px 1px 1px #ccc;
        display: inline-block !important;
        height: 153px;
        width: 153px;
    }

.item-cat-content {
    padding: 10px 10px;
    min-height: 10px;
}

.intro-giangvien {
    line-height: 22px;
    font-size: 14px;
}

.giangvien-name1 a {
    margin: 10px 0;
    font-size: 16px;
    color: #000;
    display: block;
}

.slick-slide {
    margin: 0 15px;
    position: relative;
}

    .slick-slide .course-item {
        margin-top: 5px;
    }

.slick-prev,
.slick-next {
    font-size: 0;
    position: absolute;
    bottom: 20px;
    color: #eee;
    border: 0;
    background: none;
    z-index: 1;
}

.slick-prev {
    left: 0px;
}

    .slick-prev:before {
        content: "\f104";
        font: 40px/1 'FontAwesome';
        color: #929191;
    }

.slick-next {
    right: 0px;
    text-align: right;
}

    .slick-next:before {
        content: "\f105";
        font: 40px/1 'FontAwesome';
        color: #929191;
    }

    .slick-prev:hover:before,
    .slick-next:hover:before {
        color: #d9534f;
    }

@media screen and (max-width: 1023px) {
    .course-item .course-item-image {
        max-width: unset;
        max-height: unset;
    }
}

.btn-view-all {
    margin-bottom: 15px;
    margin-top: 10px;
}

.slick-slide .course-section .rota-top-left {
    top: -1px !important;
    left: -5px !important;
}

    .slick-slide .course-section .rota-top-left::before {
        top: 0px;
        right: 10px;
    }

@media screen and (max-width: 568px) {
    .course-item .course-item-image {
        max-width: unset;
        max-height: unset;
        height: 290px;
    }

    .next-live-day {
        top: 238px !important;
    }
}

@media screen and (max-width: 450px) {
    .next-live-day {
        top: 157px !important;
    }

    .course-item .course-item-image {
        max-width: unset;
        max-height: unset;
        height: 210px !important;
    }
}

@media screen and (max-width: 320px) {
    .course-item .course-item-image {
        max-width: unset;
        max-height: unset;
        height: 175px !important;
    }

    .next-live-day {
        top: 123px !important;
    }
}
/* file main.css trong section */

/* trang home */


/* trang course of cate */
/* file course.css */
body {
    /* color: #4c6379; */
}

.course-header {
    background: #ececec;
    box-shadow: inset 0px 2px 6px #e1e1e1;
    padding: 10px 0;
}

    .course-header.fix-menu {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 10;
    }

    .course-header .course-header-menu {
        font-size: 18px;
        color: #4c6379;
        font-weight: bold;
        cursor: pointer;
        margin-top: 15px;
    }

        .course-header .course-header-menu i.fa {
            margin-right: 5px;
        }

    .course-header .search-course {
        height: 50px;
        line-height: 50px;
    }

        .course-header .search-course input {
            border: 1px solid #e1e1e1;
            border-right: none;
            height: 50px;
            line-height: 50px;
            font-size: 13px;
            color: #686868;
            font-style: italic;
        }

        .course-header .search-course .input-group-append {
            background: #eb4336;
            color: #fff;
            padding: 0 20px;
            border: none;
        }

    .course-header .dropdown-menu {
        padding: 20px 0;
        margin: 0;
        top: 44px;
        font-size: 16px;
        color: #4c6379;
    }

        .course-header .dropdown-menu > li > a {
            padding: 7px 28px;
        }

        .course-header .dropdown-menu i.fa {
            margin-right: 15px;
        }

/* Css for course list */
.feature-course {
    padding: 30px 0;
    background: #f8f8fb;
}

.recent-course {
    padding: 50px 0 80px 0;
}

    .feature-course h2,
    .recent-course h2 {
        color: #4c6379;
        font-size: 24px;
        font-weight: bold;
        margin: 0;
    }

.course-item {
    background: #fff;
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 2px 2px 10px #cecece;
    margin-top: 30px;
    min-height: 295px;
}

    .course-item .course-item-image {
        display: block;
        position: relative;
        max-width: 255px;
        height: 153px;
        width: 100%;
        background-position: center;
        background-size: 100% 100%;
        background-repeat: no-repeat;
    }

        .course-item .course-item-image .image-overlay {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            transition: .3s ease;
            background: rgb(0,0,0,0);
        }

    .course-item:hover .course-item-image .image-overlay {
        background: rgba(0,0,0,0.5);
    }

    .course-item .course-item-image .course-item-label {
        display: inline-block;
        margin-top: 10px;
        padding: 7px;
        text-align: center;
        background: #eb4335;
        color: #fff;
        font-weight: bold;
        font-size: 11px;
        text-transform: uppercase;
    }

        .course-item .course-item-image .course-item-label.item-free {
            background: #22b84c;
        }

    .course-item .course-item-detail {
        padding: 10px 10px 0px 10px;
    }

        .course-item .course-item-detail h3.title {
            font-size: 16px;
            color: #4c6379;
            margin: 0;
            text-align: left;
            font-weight: bold;
            margin-bottom: 10px;
            min-height: 58px;
        }

            .course-item .course-item-detail h3.title a,
            .course-item .course-item-detail h3.title a:hover {
                color: #4c6379;
            }

            .course-item .course-item-detail h3.title span.live {
                display: inline-block;
                background: #09d509;
                color: #fff;
                border-radius: 3px;
                padding: 3px 5px;
                font-size: 16px;
            }

        .course-item .course-item-detail .start-voting i.fa-star {
            color: #eb4335;
        }

        .course-item .course-item-detail .start-voting {
            margin-bottom: 10px;
        }

        .course-item .course-item-detail .course-register {
            background: rgba(0,0,0,0);
            border: 1px solid #d9534f;
            color: #d9534f;
            font-weight: bold;
        }

            .course-item .course-item-detail .course-register:hover {
                color: #fff;
                background: #d9534f;
            }

/* Css for course detail */
#detail_course li {
    list-style-type: none;
}

.course-title {
    color: #fff;
    padding: 145px 0;
    text-align: center;
    background-attachment: fixed;
}

    .course-title h1 {
        font-size: 24px;
        font-weight: bold;
        text-align: left;
        margin: 0;
        margin-bottom: 25px;
    }

    .course-title .meta {
        font-weight: bold;
        font-size: 16px;
        margin-bottom: 15px;
    }

.group-button-countdown {
    margin: 20px 0 45px;
}

    .group-button-countdown .button-countdown-item {
        position: relative;
    }

        .group-button-countdown .button-countdown-item .btn-countdown {
            background: #0bacea;
            color: #fff;
            font-size: 18px;
            font-weight: bold;
            width: 70px;
            text-align: center;
            padding: 8px 0;
        }

        .group-button-countdown .button-countdown-item .label-button-countdown {
            position: absolute;
            bottom: -25px;
            color: #fff;
            left: 0;
            right: 0;
            text-align: center;
            font-size: 13px;
        }

    .group-button-countdown .button-countdown-next {
        padding: 0 10px;
        line-height: 40px;
        color: #fff;
        font-size: 18px;
        font-weight: bold;
    }

.star-rating {
    display: inline-block;
    font-size: 13px;
}

.text-rating {
    display: inline-block;
    margin-left: 20px;
    font-size: 13px;
    color: #595959;
}

.course-content {
    background: #f4f5f7;
}

    .course-content .course-pannel {
        background: #fff;
        padding: 30px;
        margin-top: 30px;
    }

    .course-content .sub-menu {
        padding: 16px 0;
        background: #f8f8fb;
        -webkit-box-shadow: 0px 1px 1px 0px #eee;
        -moz-box-shadow: 0px 1px 1px 0px #eee;
        box-shadow: 0px 1px 1px 0px #eee;
        text-transform: uppercase;
    }

        .course-content .sub-menu.fix-menu {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            z-index: 10;
        }

        .course-content .sub-menu ul {
            padding-left: 0;
            text-align: center;
            margin-bottom: 0;
        }

            .course-content .sub-menu ul li {
                display: inline-block;
                padding: 0 21px;
            }

                .course-content .sub-menu ul li span {
                    cursor: pointer;
                    color: #686868;
                }

                    .course-content .sub-menu ul li span:hover,
                    .course-content .sub-menu ul li span.active {
                        color: #20b3ec;
                    }

    .course-content .course-pannel .course-pannel-block {
        margin-bottom: 30px;
    }

    .course-content .course-pannel h3 {
        font-size: 24px;
        font-weight: bold;
        color: #4c6379;
        margin: 0;
        margin-bottom: 15px;
    }

    .course-content .course-pannel ul li {
        padding-left: 20px;
        margin-bottom: 10px;
    }

        .course-content .course-pannel ul li:before {
            content: "\f0da";
            font-family: FontAwesome;
            display: inline-block;
            margin-left: -20px;
            width: 20px;
            font-size: 16px;
        }

    .course-content .course-pannel ul.course-pannel-block-benefit {
        border: 2px solid #c0d2dc;
        border-radius: 3px;
        background: #f3f7f8;
        color: #4c6379;
        padding: 30px 20px 20px 20px;
    }

        .course-content .course-pannel ul.course-pannel-block-benefit li {
            width: 50%;
            float: left;
            margin-bottom: 10px;
        }

            .course-content .course-pannel ul.course-pannel-block-benefit li:before {
                content: "\f058";
                font-family: FontAwesome;
                display: inline-block;
                margin-left: -20px;
                width: 20px;
                color: #38b54b;
            }

            .course-content .course-pannel ul.course-pannel-block-benefit li:nth-child(2n+1) {
                clear: both;
            }

    .course-content .course-pannel ul.course-pannel-block-content li {
        padding: 20px 20px 20px 40px;
        border-bottom: 1px solid #e1e1e1;
        margin: 0;
        background-color: #e1e1e1;
    }

        .course-content .course-pannel ul.course-pannel-block-content li:last-child {
            border: none;
        }

        .course-content .course-pannel ul.course-pannel-block-content li:before {
            float: left;
            content: "\f01d";
        }

    .course-content .course-pannel .panel-group .panel-default {
        border-radius: 0;
    }

        .course-content .course-pannel .panel-group .panel-default .panel-body {
            padding: 0;
        }

    .course-content .course-pannel .panel-group .panel-heading {
        padding: 15px;
        font-size: 18px;
    }

        .course-content .course-pannel .panel-group .panel-heading span {
            color: #0282c5;
            font-weight: bold;
        }

    .course-content .course-pannel .teacher-name {
        font-size: 18px;
        font-weight: bold;
        color: #0282c5;
        margin-bottom: 15px;
    }

    .course-content .course-pannel .list-review .list-review-item {
        margin-bottom: 20px;
    }

        .course-content .course-pannel .list-review .list-review-item:last-child {
            margin-bottom: 0;
        }

        .course-content .course-pannel .list-review .list-review-item img {
            border-radius: 100%;
            max-width: 50px;
        }

    .course-content .course-pannel .list-review-item .author {
        font-weight: bold;
        margin-bottom: 10px;
    }

    .course-content .course-pannel .course-list-tag span {
        font-size: 16px;
        font-weight: bold;
        margin-right: 10px;
    }

    .course-content .course-pannel .course-list-tag .course-list-tag-item {
        border: 1px solid #e0ebf1;
        background: #f9f7fa;
        display: inline-block;
        border-radius: 20px;
        padding: 10px;
        margin: 0 3px;
        font-weight: normal;
    }

    .course-content .course-info h3 {
        font-size: 16px;
    }

    .course-content .course-info .rate {
        margin-bottom: 20px;
    }

    .course-content .course-info .course-price {
        font-size: 25px;
        font-weight: bold;
        margin-bottom: 25px;
    }

    .course-content .course-info .btn-danger {
        background: #eb4336;
        font-size: 18px;
        font-weight: bold;
        margin-bottom: 15px;
    }

    .course-content .course-info .btn-default {
        background: #fff;
        font-size: 18px;
        margin-bottom: 30px;
    }

    .course-content .course-info p {
        margin-bottom: 20px;
    }

    .course-content .course-info .share-social {
        font-size: 18px;
        text-align: center;
        text-transform: uppercase;
    }

        .course-content .course-info .share-social .btn-default {
            color: #4c6379;
        }

            .course-content .course-info .share-social .btn-default:hover {
                color: #fff;
                background: #e95d51;
            }

.related-course {
    padding: 50px 0 80px 0;
    background: #f4f5f7;
}

    .related-course h2 {
        color: #4c6379;
        font-size: 24px;
        font-weight: bold;
        margin: 0;
    }

#owl-course-related {
    margin: 0 -10px;
    position: relative;
}

    #owl-course-related .course-item {
        margin-left: 10px;
        margin-right: 10px;
        margin-bottom: 10px;
    }

    #owl-course-related .owl-controls .owl-buttons .owl-next,
    #owl-course-related .owl-controls .owl-buttons .owl-prev {
        position: absolute;
        width: 44px;
        height: 44px;
        line-height: 44px;
        text-align: center;
        border-radius: 3px;
        color: #595959;
        font-size: 24px;
        background: #fff;
        opacity: 0.8;
        top: 125px;
        padding: 0;
        margin: 0;
    }

    #owl-course-related .owl-controls .owl-buttons .owl-prev {
        left: -10px;
    }

    #owl-course-related .owl-controls .owl-buttons .owl-next {
        right: -10px;
    }

.readmore {
    color: #0381c4;
    font-size: 13px;
}

@media screen and (max-width: 767px) {
    .course-content .sub-menu {
        padding: 15px;
    }

    .course-content .course-pannel {
        padding: 15px;
    }

        .course-content .course-pannel ul.course-pannel-block-benefit li {
            float: none;
            width: 100%;
        }

    .group-button-countdown .button-countdown-item .btn-countdown {
        width: 38px;
    }

    .course-content .course-pannel .list-review .list-review-item img {
        float: left;
        margin-right: 20px;
    }

    .course-content .course-pannel .list-review-item .author {
        line-height: 50px;
    }

    .content-course-cate {
        padding: 0px !important;
    }
}

/* Css for pricing */
.pricing {
    padding: 40px 0 70px 0;
}

    .pricing h1 {
        font-size: 48px;
        margin: 0;
        margin-bottom: 10px;
        text-align: center;
    }

    .pricing .pricing-description {
        font-size: 20px;
        text-align: center;
        margin-bottom: 50px;
    }

    .pricing .pricing-table {
        width: 100%;
        font-weight: bold;
    }

        .pricing .pricing-table th {
            border: none;
            border-radius: 5px 5px 0 0;
            color: #fff;
            text-align: center;
            padding: 15px 0;
            position: relative;
        }

            .pricing .pricing-table th:nth-child(2):after {
                content: '';
                position: absolute;
                top: 100%;
                left: 0;
                right: 0;
                margin: 0 auto;
                width: 0;
                height: 0;
                border-top: solid 13px #fe7c86;
                border-left: solid 13px transparent;
                border-right: solid 13px transparent;
            }

            .pricing .pricing-table th .plan-name {
                font-size: 36px;
            }

            .pricing .pricing-table th .pricing-name {
                font-size: 24px;
                font-weight: 300;
            }

                .pricing .pricing-table th .pricing-name i {
                    margin-top: 4px;
                    font-size: 16px;
                    position: absolute;
                }

                .pricing .pricing-table th .pricing-name span {
                    display: inline-block;
                    font-size: 16px;
                    margin-left: 10px;
                }

            .pricing .pricing-table th .plan-description {
                font-size: 14px;
                font-weight: 300;
            }

                .pricing .pricing-table th .plan-description.pr {
                    font-size: 22px;
                    font-weight: bold;
                    margin-top: -15px;
                }

            .pricing .pricing-table th:first-child {
                text-align: left;
                padding: 0 25px;
                font-size: 24px;
            }

        .pricing .pricing-table tbody tr:nth-child(2n+1),
        .pricing .pricing-table tr td:nth-child(2) {
            background: #f3fafe;
        }

        .pricing .pricing-table tbody tr:last-child {
            background: unset;
        }

        .pricing .pricing-table td {
            text-align: center;
            border: 1px solid #ebebeb;
            padding: 25px;
        }

            .pricing .pricing-table td:first-child {
                text-align: left;
            }

        .pricing .pricing-table .register-course {
            padding: 10px 25px;
            background: #f15141;
            color: #fff;
            font-size: 16px;
            display: inline-block;
            border-radius: 30px;
        }

            .pricing .pricing-table .register-course:hover {
                color: #fff;
            }




/*------------------HEADER------------------------*/


.head-menu a {
    color: #fff;
}

.lp-ava-name-owner {
    margin: 5px 30px 0 0;
    display: inline-block;
    width: 40%;
}

.lp-av-o {
    float: left;
    width: 20%;
}

.lp-name-o {
    float: left;
    margin: 13px 10px;
}

    .lp-name-o a {
        font-size: 16px;
        font-weight: bold;
    }

.lp-av-o img {
    width: 100%;
}

.lp-box-search-top {
    margin-top: 10px;
    display: inline-block;
    width: 54%;
}

    .lp-box-search-top input {
        background: transparent !important;
        color: #fff;
    }

    .lp-box-search-top .form-group {
        margin-bottom: 0;
    }

.lp-form {
    border-bottom: 1px solid #fff !important;
    width: 100%;
    background: 0;
    border: none;
    box-shadow: none;
    border-radius: 0;
    padding: 10px 5px 0 5px;
    color: #fff;
    font-size: 13px;
}

    .lp-form::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
        color: #fff;
        opacity: 1; /* Firefox */
        ;
    }

    .lp-form:-ms-input-placeholder { /* Internet Explorer 10-11 */
        color: #fff;
    }

    .lp-form::-ms-input-placeholder { /* Microsoft Edge */
        color: #fff;
    }

.lp-btn-search {
    position: absolute;
    right: 2px;
    top: 10px;
    background: transparent;
    color: #fff;
    font-size: 14px;
    padding: 6px 20px;
}

.lp-link-menu {
    float: right;
    margin: 10px;
    font-size: 16px;
}

    .lp-link-menu a:hover {
        text-decoration: underline;
    }

    .lp-link-menu ul li {
        display: inline-block;
        margin-right: 50px;
        margin-top: 8px;
        font-weight: bold
    }

    .lp-link-menu > ul > li:nth-child(2) {
        margin: 0 5px;
    }

    .lp-link-menu ul li:last-child {
        margin: 0 5px;
    }

.lp-main-head {
    padding: 100px;
    text-align: center;
}

    .lp-main-head img {
        border: 2px solid #fff;
        border-radius: 100%;
        margin: 30px 0 15px 0;
        width: 15%;
    }

    .lp-main-head p {
        display: inline-block;
        width: 100%;
        font-size: 30px;
        font-weight: bold;
        color: #fff;
        margin-bottom: 5px;
    }

    .lp-main-head span {
        font-weight: bold;
        display: inline-block;
        width: 100%;
        margin: 0 0 30px 0;
        color: #fff
    }

.lp-main-head-style a {
    border-radius: 5px;
    background: #ed1c24;
    padding: 10px 25px;
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 16px;
}

/*------------------MAIN------------------------*/

.lp-block-greeting, .lp-block-reason, .lp-block-course, .lp-block-testi {
    padding: 20px 0;
}

    .lp-block-greeting h3, .lp-block-video h3, .lp-block-reason h3, .lp-block-course h3, .lp-block-testi h3 {
        font-weight: bold;
        font-size: 30px;
        text-align: center;
        display: inline-block;
        width: 100%;
    }

    .lp-block-greeting p {
        line-height: 1.5;
        margin: 10px 0;
    }

.lp-block-video {
    padding: 20px 0;
    background: #00a0dc;
}

    .lp-block-video h3, .lp-block-testi h3 {
        color: #fff;
        margin-bottom: 10px;
    }

.lp-inner-video {
    width: 70%;
    margin: 0 auto;
}

.lp-block-reason {
    background: #f3f3f3;
}

.inner-col-reason img {
    display: block;
    margin: 10px 0;
    width: 120px;
    height: 120px;
}

.inner-col-reason p {
    font-size: 18px;
    margin: 20px 0;
}

.inner-col-reason span {
    font-size: 16px;
    width: 69%;
    display: inline-block;
}

.box-reason {
    margin: 20px 0;
    display: flex;
    text-align: center;
    width: 100%;
}

.lp-bc-img {
    width: 37%;
    float: left;
}

.lp-bc-des {
    width: 37%;
    float: left;
    margin: 0 20px;
}

.lp-bc-price {
    width: 20%;
    float: left;
}

.lp-box-course {
    margin-top: 30px;
    display: inline-block;
    width: 100%;
    border-bottom: 1px solid #ccc;
}

.lp-bc-des p {
    font-size: 18px;
    font-weight: bold;
    max-height: 42px;
    min-height: 42px;
}

.lp-bc-des span {
    margin: 10px 20px 10px 0px;
    display: inline-block;
}

.lp-bc-des i {
    color: #000;
    width: 15px;
    text-align: center;
}

.lp-bc-des ul {
    padding: 0;
}

    .lp-bc-des ul li i {
        color: #0090ff;
        width: 15px;
        text-align: center;
    }

    .lp-bc-des ul li {
        line-height: 1.5;
        list-style: none;
    }

.lp-bc-price {
    text-align: right;
    font-weight: bold;
}

.price-b {
    font-size: 40px;
}

    .price-b sup {
        font-size: 22px;
    }

.price-s {
    font-size: 24px;
    color: #696969;
    text-decoration: line-through;
}

    .price-s sup {
        font-size: 12px;
    }

.price-o {
    font-size: 16px;
    background: #f26522;
    border-radius: 3px;
    padding: 5px;
    color: #fff;
    display: inline-block;
    margin: 10px 0;
}

.lp-bc-price a {
    background: #ff0000;
    padding: 10px 20px;
    text-transform: uppercase;
    font-size: 16px;
    text-align: center;
    color: #fff;
    display: inline-block;
    width: 100%;
    border-radius: 3px;
}

    .lp-bc-price a:hover {
        background: #a50000;
    }

.lp-block-testi {
    background: #00a0dc;
}

.mini-testi {
    background: #fff;
    border-radius: 3px;
    padding: 30px 20px 60px 20px;
    text-align: center;
    box-shadow: 0px 1px 7px 0px rgba(0, 0, 0, 0.35);
}

    .mini-testi img {
        text-align: center;
        display: inline-block !important;
        border-radius: 100%;
    }

    .mini-testi p {
        font-size: 18px;
        margin: 20px 0 40px;
    }

    .mini-testi span {
        font-size: 16px;
    }

.lp-block-teacher-edit {
    background: #eee;
    border-top: 1px solid #ccc;
    padding: 30px 0;
    text-align: center;
}

    .lp-block-teacher-edit p {
        font-weight: bold;
        margin-bottom: 10px;
    }

/*--------Block Youtube--------*/
.mbs-block-youtube {
    padding: 20px 0;
}

.box-yt {
    width: 70%;
    margin: 0 auto
}

.mbs-block-youtube h3 {
    text-align: center;
    font-size: 24px;
    font-weight: bold;
    display: block;
    margin-bottom: 20px;
}

/*---------Block about --------*/
.mbs-block-about {
    padding: 20px 0;
    background: #f3f3f3;
}

    .mbs-block-about h3 {
        text-align: center;
        font-size: 24px;
        font-weight: bold;
        display: block;
        margin-bottom: 20px;
    }

    .mbs-block-about span {
        font-weight: bold;
    }

/*--------- Block benefit -------*/
.mbs-block-benefit {
    padding: 20px 0;
    background: #fff;
}

    .mbs-block-benefit h3 {
        text-align: center;
        font-size: 24px;
        font-weight: bold;
        display: block;
        margin-bottom: 20px;
    }
/* .mbs-block-benefit span { font-weight: bold; } */

/*--------- Block description -------*/
.mbs-block-description {
    padding: 20px 0;
    background: #f3f3f3;
}

    .mbs-block-description h3 {
        text-align: center;
        font-size: 24px;
        font-weight: bold;
        display: block;
        margin-bottom: 20px;
    }
/* .mbs-block-description span { font-weight: bold; } */

/*--------- Block content -------*/
.mbs-block-content {
    padding: 20px 0;
    background: #fff;
}

    .mbs-block-content h3 {
        text-align: center;
        font-size: 24px;
        font-weight: bold;
        display: block;
        margin-bottom: 20px;
    }

    .mbs-block-content span {
        float: right;
    }

.box-course-collapse button {
    width: 100%;
}

.box-course-collapse .card-header {
    padding: 5px;
}

.box-course-collapse p {
    float: left;
    color: #000;
    font-weight: bold;
    margin-bottom: 0;
    font-size: 14px;
    white-space: normal;
    text-align: left;
}

.box-course-collapse span {
    float: right;
    color: #000;
    font-size: 14px;
}

.box-course-collapse .card {
    margin-bottom: 10px;
}

.box-course-collapse .card-body ul {
    padding-left: 0;
}

    .box-course-collapse .card-body ul li {
        display: inline-block;
        width: 100%;
        list-style: none;
        border-bottom: 1px solid #ccc;
        padding: 10px 0;
    }

        .box-course-collapse .card-body ul li:last-child {
            border: none;
        }

.list-video-course a {
    float: left;
    color: #428bca;
}

.list-video-course p {
    float: right;
    font-weight: normal;
}
/* .list-video-course i {    margin-right: 20px;} */
.review-demo {
    background: #0f6fd2;
    color: #fff !important;
    padding: 5px 10px;
    border-radius: 30px;
    transition: 0.5s;
    font-size: 14px;
    float: right !important;
}

    .review-demo:hover {
        background: #0ac3e0;
    }


/*--------- Block teacher -------*/
.mbs-block-teacher {
    padding: 20px 0;
    background: #f3f3f3;
}

    .mbs-block-teacher h3 {
        text-align: center;
        font-size: 24px;
        font-weight: bold;
        display: block;
        margin-bottom: 20px;
    }

    .mbs-block-teacher span {
        font-weight: bold;
    }

.m-img-teacher img {
    border-radius: 100%;
}

.box-teacher-mbs ul li {
    list-style: none;
    display: inline-block;
    width: 100%;
    margin-bottom: 30px;
    border-bottom: 1px solid #ccc;
}

    .box-teacher-mbs ul li:last-child {
        border: none;
    }

.m-des-teacher p {
    margin-bottom: 5px;
}

.m-img-teacher {
    float: left;
    text-align: center;
}

.m-des-course {
    float: left;
}

    .m-des-course ul li {
        margin-bottom: 5px;
        border: none;
        font-size: 14px;
    }

.description-teacher {
    text-align: center;
}

.m-name-gv {
    display: inline-block;
    margin: 5px 0;
    font-size: 20px;
}

.box-teacher-mbs ul {
    padding: 0;
}

/*--------- Block time live -------*/
.mbs-block-time-live {
    text-align: center;
    padding: 20px 0;
    background: #f3f3f3;
}

    .mbs-block-time-live h3 {
        font-size: 24px;
        font-weight: bold;
        display: block;
        margin-bottom: 20px;
    }

    .mbs-block-time-live span {
        font-weight: bold;
        font-size: 15px;
    }

/*--------- Block membership -------*/

.mbs-block-membership {
    padding: 20px 0;
    background: #fff;
}

    .mbs-block-membership h3 {
        text-align: center;
        font-size: 24px;
        font-weight: bold;
        display: block;
        margin-bottom: 20px;
    }

    .mbs-block-membership span {
        font-weight: bold;
        display: block;
    }

.box-pay-mbs .form-check {
    margin-bottom: 10px;
}

.detail-price .form-check .form-check-input {
    margin-left: 0;
}

.detail-price .form-check .form-check-label {
    margin-left: 25px;
}

.detail-price {
    border-bottom: 1px solid #ccc;
    padding: 10px;
    border-right: none;
}

.cost-price {
    border-bottom: 1px solid #ccc;
    border-left: 1px solid #ccc;
    padding: 10px;
}

    .cost-price p {
        font-size: 20px;
        text-align: center;
        font-weight: bold;
        color: #f00;
    }

    .cost-price sup {
        font-size: 12px;
    }

.cost-mbs {
    text-align: center;
    font-weight: bold;
    font-size: 14px;
}

.box-combo-default, .box-cb-price {
    margin: 0;
}

.price-box-pay {
    border-left: 1px solid #ccc;
    padding: 0 10px;
    margin: 0;
}

.des-box-pay p {
    font-weight: normal;
}

.price-box-pay p {
    display: block;
    text-align: center;
    font-weight: bold;
    font-size: 14px;
    margin-bottom: 5px;
}

.price-box-pay .price-a {
    font-size: 20px;
    font-weight: bold;
    color: #f00;
}

.price-box-pay .price-c {
    background: #f26522;
    padding: 4px;
    color: #fff;
    font-weight: bold;
    border-radius: 3px;
    display: inline-block;
}

.price-box-pay .price-d {
    text-decoration: line-through;
}

/*
		    ==============================================================
		       Responsive CSS 
		    ==============================================================
		*/

@media (min-width:1921px) and (max-width:2560px) {
}

@media (min-width:1366px) and (max-width:1600px) {
}

@media (min-width:1200px) and (max-width:1365px) {
}

@media (min-width:992px) and (max-width:1199px) {
    .lp-ava-name-owner {
        width: 38%;
    }

    .lp-bc-img {
        width: 30%;
    }

    .lp-bc-des {
        width: 45%;
    }

        .lp-bc-des ul li {
            line-height: 1.5;
        }
}

@media (min-width:768px) and (max-width:991px) {
    .lp-ava-name-owner {
        width: 32%;
    }

    .lp-box-search-top {
        width: 63%;
    }

    .lp-link-menu {
        float: none;
        text-align: center;
    }

    .inner-col-reason span {
        width: 78%;
    }

    .lp-bc-img {
        width: 25%;
    }

    .lp-bc-des {
        width: 49%;
    }

        .lp-bc-des ul li {
            line-height: 1.5
        }

    .lp-bc-price a {
        padding: 7px;
    }

    .lp-block-testi .container {
        padding: 5px
    }

    .lp-block-testi .col-sm-4 {
        padding: 5px;
    }
}

@media (max-width:767px) {
    .box-course-collapse .card-body ul li {
        display: inline-block;
        width: 100%;
        list-style: none;
        border-bottom: 1px solid #ccc;
        padding: 10px .75rem;
    }

    .course-item .course-item-detail h3.title {
        min-height: unset;
    }

    .lp-ava-name-owner {
        display: none;
    }

    .lp-box-search-top {
        width: 100%;
    }

    .lp-link-menu {
        font-size: 14px;
        float: none;
        margin: 0;
        padding: 10px 0;
    }

    .lp-main-head img {
        margin: 0 0 10px 0;
        width: 40%;
    }

    .box-reason {
        display: block;
    }

    .lp-bc-img, .lp-bc-des, .lp-bc-price {
        width: 100%;
    }

    .lp-bc-des {
        margin: 10px 0;
    }

        .lp-bc-des ul li {
            line-height: 1.5
        }

    .price-b, .price-s {
        width: 30%;
        text-align: center;
    }

    .price-b {
        font-size: 30px;
        float: left;
    }

        .price-b sup {
            font-size: 15px;
        }

    .price-s {
        font-size: 20px;
        float: left;
        margin-top: 8px;
    }

        .price-s sup {
            font-size: 10px;
        }

    .price-o {
        margin: 0;
    }

    .lp-bc-price a {
        margin-top: 10px;
    }

    .mini-testi {
        margin-bottom: 10px;
    }

    .lp-block-greeting h3, .lp-block-video h3, .lp-block-reason h3, .lp-block-course h3, .lp-block-testi h3 {
        font-size: 20px;
    }

    .box-course-collapse .card-body {
        padding: 5px;
    }
    /* .box-course-collapse p { margin-left: -10px; } */
    .lp-main-head {
        padding: 35px 0 55px 0;
    }

        .lp-main-head p {
            font-size: 20px;
        }
}

@media (min-width:376px) and (max-width:414px) {
}

@media (min-width:321px) and (max-width:375px) {
    .head-menu .col-12 {
        padding: 5px;
    }

    .price-b, .price-s {
        width: 33%;
    }
}

@media (max-width: 320px) {
    .head-menu .col-12 {
        padding: 5px;
    }

    .lp-link-menu ul li {
        margin-right: 30px;
        font-size: 13px;
    }

    .price-b {
        width: 40%;
    }
}

.circle-box-course {
    color: #fff;
    background: #428bca;
    font-weight: bold;
    width: 22px;
    height: 22px;
    text-align: center;
    border-radius: 25px;
    font-size: 13px;
    padding-top: 1px;
    margin-top: 25px;
}

@media (min-width: 768px) {
    .box-circle {
        max-width: 3.333333% !important;
    }
}

.info_course_of_cate {
    float: left;
}

.list-comment-course .col-sm-2 {
    flex: unset;
}

.next-live-day {
    position: absolute;
    top: 101px;
    width: 100%;
    margin-top: 10px;
    text-align: center;
    background-color: #ea6840;
    color: white;
}

    .next-live-day p {
        margin: 0;
    }

@media screen and (max-width: 824px) {
    .next-live-day {
        top: 101px;
    }

    .course-item .course-item-image {
        max-width: unset;
        max-height: unset;
    }

    .rating-student-right {
        float: left;
    }

        .rating-student-right .u-rate-f1-progress {
            width: 100%;
        }

    .u-rate-f1-star {
        margin-bottom: 10px;
    }

    .u-rate-f1-num, .u-rate-f1-progress {
        margin-top: 10px;
    }
}

@media screen and (max-width: 450px) {
    .course-item .course-item-image {
        max-width: unset;
        max-height: unset;
        height: 210px !important;
    }

    .rating-student-right .u-rate-f1-star {
        text-align: left;
    }

    .u-rate-f1-num, .u-rate-f1-star {
        width: 50%;
    }

    .block-hv {
        width: 70%;
    }

    .u-rate-f1-star {
        margin-bottom: unset;
    }

    .u-rate-f1-num, .u-rate-f1-progress {
        margin-top: unset;
    }

    .next-live-day {
        top: 158px !important;
    }
}

@media screen and (max-width: 320px) {
    .course-item .course-item-image {
        max-width: unset;
        max-height: unset;
        height: 175px !important;
    }
}

@media screen and (max-width: 568px) {
    .next-live-day {
        top: 238px;
    }

    .course-item .course-item-image {
        max-width: unset;
        max-height: unset;
        height: 290px;
    }
}

.nav-pills .nav-link.active {
    color: #fff;
    background-color: #007bff;
}

.label-livestream {
    margin: 5px;
    position: absolute;
    padding: 3px;
    right: 0;
    font-size: 14px;
    text-transform: uppercase;
    height: 15px;
    line-height: 15px;
    display: inline-block;
    vertical-align: middle;
    color: #d9534f;
}

    .label-livestream:before {
        -webkit-border-radius: 50%;
        border-radius: 50%;
        display: block;
        position: relative;
        width: 15px;
        height: 15px;
        content: '';
        margin-right: 5px;
        vertical-align: initial;
        -webkit-animation: live-pulse 1s infinite;
        -moz-animation: live-pulse 1s infinite;
        -o-animation: live-pulse 1s infinite;
        animation: live-pulse 1s infinite;
        float: left;
    }

.label-livestream-coures-relate {
    margin: 5px;
    position: absolute;
    padding: 3px;
    right: 17px;
    top: 0;
    font-size: 14px;
    text-transform: uppercase;
    height: 15px;
    line-height: 15px;
    display: inline-block;
    vertical-align: middle;
    color: #d9534f;
}

    .label-livestream-coures-relate:before {
        -webkit-border-radius: 50%;
        border-radius: 50%;
        display: block;
        position: relative;
        width: 15px;
        height: 15px;
        content: '';
        margin-right: 5px;
        vertical-align: initial;
        -webkit-animation: live-pulse 1s infinite;
        -moz-animation: live-pulse 1s infinite;
        -o-animation: live-pulse 1s infinite;
        animation: live-pulse 1s infinite;
        float: left;
    }

@-webkit-keyframes live-pulse {
    0% {
        background-color: #e78dac
    }

    50% {
        background-color: white
    }

    100% {
        background-color: #d9534f
    }
}

@-moz-keyframes live-pulse {
    0% {
        background-color: #d9534f
    }

    50% {
        background-color: white
    }

    100% {
        background-color: #d9534f
    }
}

@keyframes live-pulse {
    0% {
        background-color: #d9534f
    }

    50% {
        background-color: white
    }

    100% {
        background-color: #d9534f
    }
}


.category {
    text-align: center;
}

    .category a.active {
        background-color: #007bff;
        color: #fff !important;
        border-radius: .25rem;
    }

    .category .nav-link {
        padding: 7px;
        margin-right: unset;
    }

@media (min-width: 768px) and (max-width: 1023px) {
    .u-rate-f1-star {
        margin-top: 10px;
    }

    .related-img-blog {
        height: 150px;
    }
}

@media (min-width: 577px) and (max-width: 767px) {
    .u-rate-f1-num, .u-rate-f1-progress {
        margin-top: 0px;
    }
}

@media (min-width: 320px) and (max-width: 576px) {
    .img-responsive {
        width: 100%;
    }

    .u-rate-f1-num, .u-rate-f1-progress {
        margin-top: 0px;
    }
}

.lbl-finish-time-live {
    font-size: 20px !important;
    text-align: center !important;
    font-weight: bold !important;
    color: #f00;
}

.main_course_of_cate {
    background: #f8f8fb;
}
/* file course.css */
/* trang course of cate */

/* style inline tag_of_course */
.style_title_tag_of_course {
    font-size: 20px !important;
    font-family: inherit !important;
    font-weight: 500 !important;
    line-height: 1.1 !important;
    color: inherit !important;
}
/* style inline tag_of_course */

/* trang detail combo default*/
.percent_off_label {
    position: unset;
    display: none;
}

.image_cover_combo_default {
    background-size: cover !important;
    background-position: center !important;
    height: unset !important;
    aspect-ratio: 3/1;
}

.item_course_combo_default {
    width: 3% !important;
}

.unset_float_combo_default {
    float: none !important;
}

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

.style_price_old_combo_default {
    text-decoration: line-through;
    padding-left: 10px !important;
}

.style_button_detail_combo {
    margin-top: 25px;
    color: #fff !important;
}

.style_img_teacher_combo_default {
    width: 200px !important;
    height: 200px !important;
}

.expired_combo_pay_retail_default {
    margin: 10px 0 !important;
}
/* trang detail combo */


/* trang chi tiet giang vien */
/* trang chi tiet giang vien */

/* trang gio hang */
/* trang gio hang */

/* trang tim kiem */
/* trang tim kiem */

/* trang blog */
.input-page-pagination {
    width: 60px;
    text-align: center;
}

.card_cate_blog_default {
    border-radius: 0 !important;
    height: unset !important;
    margin-bottom: 20px;
}

.style_list_blog_hot_new {
    padding: 10px !important;
}

.style_card_list_blog_hot_new {
    padding: 0 !important;
}

.style_img_blog_default {
    float: left;
    margin-right: 3px !important;
}

.style_name_blog_default {
    width: 75%;
    float: left;
}

.list-group-item-blog-default {
    border: none !important;
}

.card_cate_blog_default ul, .card_cate_blog_default ol {
    list-style: none !important;
}

.blog-title {
    margin-bottom: 0;
    font-size: 2rem;
    font-weight: normal;
}

.blog-description {
    font-size: 1.1rem;
    color: #999;
}

@media (min-width: 40em) {
    .blog-title {
        font-size: 18px;
        font-weight: bold
    }
}

.blog-pagination {
    text-align: center;
    margin-bottom: 20px
}
/* #content_news img {
	    width: 100% !important;
	} */
.blog_with_cate_default {
    margin: 10px 0 !important;
    list-style: none;
}

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

.blog-main {
    background: #fff;
    padding: 10px;
    border-radius: 5px;
}
/* trang blog */

/* trang thanh toan */
/* file /statics/css/main.css */
/*-Other-*/
.bg-gray {
    background: #f4f4f4;
}

.co-or {
    color: #f26c4f;
}

.pd-No {
    padding: 0;
}

.bd-No {
    border-bottom: 0 !important;
    padding: 0 !important;
}

/*-Menu-*/

/*
			  ==============================================================
				   Unica Cart Course Css
			  ==============================================================
		*/
.u-box-cart-title {
    margin: 10px 0;
}

    .u-box-cart-title p {
        font-size: 16px;
    }

.u-box-cart {
    text-align: center;
    border: 1px solid #eee;
    padding: 20px;
    margin: 10px 0;
}

.u-cart-txt {
    font-size: 20px;
}

.u-icon-cart i {
    font-size: 120px;
    color: #ccc;
}

.btn-cart {
    background: #ec5252;
    padding: 10px 15px;
    font-weight: bold;
    color: #fff;
    display: inline-block;
    margin: 10px 0;
    border-radius: 3px;
    border: none;
}

.u-cart-course {
    display: flex;
    border-bottom: 1px solid #dedfe0;
    padding-bottom: 10px;
    padding-top: 10px;
}

    .u-cart-course:last-child {
        border: 0;
        padding-bottom: 0;
    }

.u-box-cart2 {
    border: 1px solid #eee;
    padding: 10px;
    margin: 10px 0;
    display: inline-block;
    width: 100%;
    position: relative;
}

.u-cart-combo-course {
    border: 1px solid #eee;
    padding: 10px;
    margin: 10px 0;
    display: inline-block;
    width: 100%;
    position: relative;
}

    .u-cart-combo-course .u-cart-course {
        border: none;
    }

    .u-cart-combo-course .remove-course {
        position: absolute;
        top: 9px;
        right: 12px;
        color: red;
        cursor: pointer;
    }

.u-box-cart2 .label {
    position: absolute;
    top: 20px;
    border-radius: 0 8px 8px 0;
}

.u-box-cart-big {
    position: relative;
    border-bottom: 1px solid #eee;
    padding-bottom: 10px;
}

    .u-box-cart-big:last-child {
        border: 0;
        padding-bottom: 0;
    }

.img-cart-course {
    margin-right: 10px;
    width: 10%;
}

.title-cart-course {
    text-align: left;
    width: 70%;
}

    .title-cart-course p {
        font-weight: bold;
    }

.u-box-cart2 .remove-course {
    cursor: pointer;
    width: 2%;
    font-size: 16px;
    color: #f00;
    position: relative;
    top: 3px;
    left: 17px;
}

.price-cart {
    width: 15%;
}

    .price-cart p {
        font-size: 20px;
        font-weight: bold;
    }

    .price-cart sup {
        font-size: 14px;
    }

    .price-cart span {
        text-decoration: line-through;
    }

        .price-cart span sup {
            font-size: 10px;
        }

.u-cart-price {
    margin-top: 15px;
}

    .u-cart-price p {
        font-size: 18px;
    }

.price-btn-box a {
    color: #fff;
    background: #ec5252;
    padding: 10px 20px;
    text-align: center;
    border-radius: 3px;
    font-weight: bold;
    display: inline-block;
    width: 100%;
    text-transform: uppercase;
}

.cart-notice p {
    font-size: 14px;
    color: #7a8388;
    text-align: center;
    margin-top: 15px;
}

.price-cart-box {
    display: inline-block;
    width: 100%;
    margin: 0 0 10px 0;
}

.price-cart-1 {
    color: #ec5252;
    font-size: 26px;
    font-weight: bold;
}

    .price-cart-1 sup {
        font-size: 14px;
    }

.price-cart-2 {
    margin: 5px 0;
}

    .price-cart-2 p {
        font-size: 14px;
        display: inline-block;
    }

    .price-cart-2 sup {
        font-size: 12px;
    }

    .price-cart-2 span {
        text-decoration: line-through;
    }

.price-cart-3 {
    font-size: 14px;
}

    .price-cart-3 p {
        display: inline-block;
        font-size: 14px;
    }

.more-cart {
    margin: 10px 0;
    text-align: center;
}

    .more-cart p {
        font-size: 13px;
    }

    .more-cart a {
        color: #fff;
        background: #03A9F4;
        padding: 10px 20px;
        width: 30%;
        border-radius: 3px;
        font-weight: bold;
        display: inline-block;
        margin-top: 5px;
    }

.u-box-cart-title2 {
    font-size: 18px;
    font-weight: bold;
    margin-top: 20px;
}

.u-cart-price2 {
    margin-top: 20px;
}

    .u-cart-price2 p {
        font-size: 16px;
        font-weight: bold;
    }

.u-box-cart2 .form-inline .form-control {
    width: 100%;
    height: 40px;
}

span.required {
    color: #F44336;
}

.u-box-cart2 label {
    float: left;
    font-weight: bold;
    margin-bottom: 5px;
}

.button-continue {
    background-color: #f26c4f;
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    float: left;
    margin-top: 10px;
}

.u-c-title {
    border-bottom: 1px solid #e6e6e6;
    padding: 5px 0;
    display: inline-block;
    width: 100%;
}

    .u-c-title p {
        font-size: 14px;
        float: left;
    }

    .u-c-title a {
        float: right;
    }

.total-cart {
    border-top: 1px solid #e6e6e6;
    margin-top: 10px;
    padding-top: 5px;
    width: 100%;
    display: inline-block;
}

.cart-course {
    display: inline-block;
    width: 100%;
    padding: 15px 0;
}

.ult-r sup {
    font-size: 10px;
}

.bd-cart-no {
    border: 0;
}

.name-cart-course {
    width: 70%;
    float: left;
}

.ult-l {
    float: left;
    margin-top: 5px;
}

.ult-r {
    float: right;
    margin-top: 5px;
}


.price-cart-course {
    float: right;
}

    .price-cart-course sup {
        font-size: 12px;
    }

    .price-cart-course span {
        font-size: 14px;
        text-decoration: line-through;
    }

        .price-cart-course span sup {
            font-size: 10px;
        }

.total-cart p {
    float: left;
}

.total-cart sup {
    font-size: 12px;
}

.total-cart span {
    color: #f00;
}

.steps {
    list-style: none;
    display: table;
    width: 100%;
    padding: 0;
    margin: 0;
    position: relative;
}

    .steps li {
        display: table-cell;
        text-align: center;
        width: 1%;
    }

        .steps li.active:before, .steps li.complete:before, .steps li.active .step, .steps li.complete .step {
            border-color: #12cbec;
        }

        .steps li:first-child:before {
            max-width: 51%;
            left: 50%;
        }

        .steps li:before {
            display: block;
            content: "";
            width: 100%;
            height: 1px;
            font-size: 0;
            overflow: hidden;
            border-top: 4px solid #CED1D6;
            position: relative;
            top: 21px;
            z-index: 1;
        }

        .steps li .step {
            border: 5px solid #ced1d6;
            color: #546474;
            font-size: 15px;
            border-radius: 100%;
            background-color: #FFF;
            position: relative;
            z-index: 2;
            display: inline-block;
            width: 40px;
            height: 40px;
            line-height: 30px;
            text-align: center;
        }

.u-box-step {
    display: inline-block;
    width: 100%;
    margin: 20px 0;
}

.steps li.complete .title, .steps li.active .title {
    color: #fff;
}

.steps li .title {
    display: block;
    margin-top: 4px;
    max-width: 100%;
    color: #fff;
    font-size: 14px;
    z-index: 104;
    text-align: center;
    table-layout: fixed;
    word-wrap: break-word;
}

.steps li:last-child:before {
    max-width: 50%;
    width: 50%;
}

.btn-complete {
    padding: 7px 10px;
    font-weight: bold;
    font-size: 16px;
    color: #fff;
    background: #5cb85c;
    text-align: center;
    margin-top: 10px;
    width: 100%;
    display: inline-block;
    border-radius: 3px;
    margin-bottom: 10px;
}

.u-box-cart-title2 span {
    font-size: 14px;
    font-weight: normal;
}

.u-box-cart3 {
    padding: 5px;
    display: inline-block;
    width: 100%;
}

    .u-box-cart3 .panel-heading {
        background: #3b99d4;
        color: #fff;
        padding: 5px;
        margin: 5px 0;
    }

    .u-box-cart3 i {
        font-size: 24px;
        margin-right: 5px;
        width: 30px;
        text-align: center;
    }

    .u-box-cart3 a {
        color: #fff;
        font-size: 14px;
        padding: 5px;
    }

    .u-box-cart3 .fh {
        font-size: 30px;
        vertical-align: sub;
    }

b {
    font-weight: bold;
}

.cart-complete, .cart-error {
    text-align: center;
    margin: 20px 0;
    font-size: 16px;
    line-height: 30px;
    padding: 20px;
}

    .cart-error i {
        font-size: 120px;
        color: orange;
    }

    .cart-complete i {
        font-size: 120px;
        color: #00b609;
    }

    .cart-complete p, .cart-error p {
        font-size: 20px;
        font-weight: bold;
        margin: 20px 0;
    }

.u-cart-more-course {
    padding: 10px 0;
    border: 1px solid #eee;
    display: inline-block;
}

    .u-cart-more-course h3 {
        font-size: 24px;
        font-weight: bold;
        margin-left: 10px;
    }





/*
			  ==============================================================
				   Unica Responsive Css
			  ==============================================================
		*/

@media (min-width:1921px) and (max-width:2560px) {
    .u-dashboard-top .container {
        width: auto;
        padding-left: 10%;
        padding-right: 10%;
    }

    .unica-home-menutop.hidden-xs > .container-fluid > .col-width-lg {
        max-width: 100%;
        padding-left: 10%;
        padding-right: 10%;
    }

    .unica-home-menutop.hidden-xs > div > div > .cate-md {
        width: 16.66666667%;
    }

    main > .container {
        width: auto;
        padding-left: 10%;
        padding-right: 10%;
    }
}

@media (min-width:1599px) and (max-width:1920px) {
    .unica-home-menutop .col-lg-3 {
        width: 16.66666667%;
    }

    .unica-home-menutop .col-lg-4 {
        width: 41.66666667%;
    }

    .unica-blog .container {
        width: 1600px;
    }

    .unica-blog-list .container {
        width: 1600px;
    }

    .u-bread .container {
        width: 1600px;
    }

    .img-blog-news {
        width: 22%;
    }

    .box-news-mini {
        width: 75%;
    }

        .box-news-mini img {
            width: 15%;
        }

    .blog-big-slide img {
        max-height: 400px;
    }

    .u-blog-sm-box img {
        max-height: 194px;
    }
}

@media (min-width:1366px) and (max-width:1600px) {
    .unica-main-banner-box-search {
        right: 17%;
    }

    .unica-be-teacher {
        height: 284px;
        background-size: contain;
    }

    .unica-be-teacher-txt {
        top: 12%;
    }

        .unica-be-teacher-txt h4 {
            font-size: 55px;
        }

    .uv-name-hv {
        width: 86%;
    }

    .uv-name-gv {
        width: 84%;
    }

        .uv-name-gv span {
            float: left;
        }

    .unica-daily-top {
        height: 337px;
        background-size: contain;
        padding: 80px 0;
    }

    .kq-test {
        margin-right: 10px;
    }
}

@media (min-width:1200px) and (max-width:1365px) {
    .unica-btn-search {
        right: 15px;
    }

    .unica-main-banner-box-search {
        right: 10%;
    }

    .unica-menu-cate {
        margin: 25px 0 0 25px;
    }

    .col-width-lg {
        font-size: 14px;
    }

    .unica-cart {
        margin: 5px;
    }

    .box-slider .slick-prev:before, .box-slider .slick-next:before {
        font-size: 30px;
    }

    .unica-box-course-f .slick-prev:before, .unica-box-course-f .slick-next:before {
        font-size: 30px !important;
        color: #606060 !important;
    }

    .cate-sm {
        padding: 0;
    }

    .unica-reg-acc {
        padding: 9px 12px;
    }

    .box-slider .slick-prev {
        left: -15px;
    }

    .unica-box-course-f .slick-prev {
        left: -25px;
    }

    .unica-be-teacher {
        background-size: cover;
        background-repeat: no-repeat;
        height: 250px
    }

    .unica-be-teacher-txt {
        top: 13%;
    }

        .unica-be-teacher-txt p {
            font-size: 20px;
        }

        .unica-be-teacher-txt h4 {
            font-size: 48px;
        }

    .box-teacher > button.slick-prev.slick-arrow {
        left: -25px;
    }

    .box-teacher > button.slick-next.slick-arrow {
        right: -15px;
    }

    .box-teacher .slick-prev:before, .box-teacher .slick-next:before {
        font-size: 30px !important;
        color: #606060 !important;
    }

    .u-txt-list p {
        font-size: 22px;
    }

    .u-txt-list span {
        font-size: 16px;
    }

    .u-txt-back a {
        font-size: 20px;
        margin-top: 15px;
    }

    .ua-btn-qa-bm a {
        margin: 0 2px
    }

    .uv-name-hv {
        width: 89%;
        margin-top: -2px;
    }

        .uv-name-hv p {
            width: 100%;
        }

        .uv-name-hv span {
            float: left;
            font-size: 12px;
        }

    .uv-name-gv {
        width: 87%;
        margin-top: -2px;
    }

        .uv-name-gv p {
            width: 100%;
        }

        .uv-name-gv span {
            float: left;
            font-size: 12px;
        }

    .unica-daily-top {
        height: 296px;
        background-size: contain;
        padding: 50px 0;
    }

    .kq-test {
        margin-right: 20px;
    }
}

@media (min-width:992px) and (max-width:1199px) {
    .unica-main-banner-box-search {
        right: 7%;
    }

    .unica-cart {
        top: 2px;
    }

    .unica-active-course i {
        margin: 0;
    }

    .unica-menu-cate {
        margin: 25px 0 0 12px;
    }

    .cate-md {
        padding: 0;
    }

    .unica-active-course {
        border: 1px solid #636363;
        color: #636363
    }

    .box-item {
        width: 20%;
    }

    .slick-prev:before, .slick-next:before {
        font-size: 30px !important;
        color: #606060 !important;
    }

    .box-teacher > button.slick-next.slick-arrow {
        right: -20px;
    }

    .box-slider .slick-prev {
        left: -15px;
    }

    .box-slider .slick-next {
        right: -5px;
    }

    .target-box {
        width: auto;
    }

    .course-box-slider {
        margin: 9px;
    }

    .course-box-slider-2 {
        margin: 9px;
    }

    .social-connect a {
        margin-right: 5px;
    }

    .pdR0 {
        padding: 0;
    }

    .unica-box-course-f .slick-prev {
        left: -25px;
    }

    .unica-be-teacher {
        background-size: cover;
        background-repeat: no-repeat;
        height: 213px
    }

    .unica-be-teacher-txt {
        top: 13%;
    }

        .unica-be-teacher-txt p {
            font-size: 18px;
        }

        .unica-be-teacher-txt h4 {
            font-size: 40px;
        }

    .box-teacher > button.slick-prev.slick-arrow {
        left: -30px;
    }

    .unica-box-email .pd-No {
        margin: 0;
    }

    .u-title-footer p {
        font-size: 23px;
        margin-bottom: 10px;
    }

    .u-btn-form {
        padding: 6px 16px;
    }

    .u-e-form {
        padding: 6px 10px 6px 8px;
    }

    .title-course-f {
        margin-left: 6px;
    }

    .u-list-leftbar {
        width: 25%;
    }

    .u-all-course .course-box-slider {
        margin: 0 20px 0 0;
    }

    .u-all-course .course-box-slider-2 {
        margin: 0 20px 0 0;
    }

    .u-order {
        padding-bottom: 10px;
    }

    .btn-preview {
        display: inline-block;
        padding: 5px 8px;
    }

    .block-buy {
        width: 308px;
    }

    .u-plus-course {
        width: 100%;
    }

    .u-block-plus {
        width: 100%;
    }

    .u-plus-icon {
        left: 208px;
    }

    .u-td {
        display: block;
    }

    .uct-left {
        width: 28%
    }

    .uct-right {
        width: 69%;
        margin-left: 15px;
    }

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

    .u-rate-f1-star i {
        font-size: 16px;
    }

    .u-rate-f1-star {
        width: 22%;
    }

    .u-rate-f1-num {
        width: 3%;
    }

    .u-rate-f1-progress {
        height: 32px;
    }

    .btn-buy-plus {
        width: 78%;
    }

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

    .des-combo a {
        margin-bottom: 5px;
    }

    .rate-combo {
        margin-top: 3px;
    }

        .rate-combo span:last-child {
            display: none;
        }

    .favo-combo {
        margin: 30px 10px;
    }

    .ubo-right-title {
        margin-bottom: 40px;
    }

    .ubo-right-prog {
        margin-top: 59px;
    }

    .uom-gv-left {
        width: 39%;
    }

    .uom-gv-right {
        width: 52%;
    }

    .txt-box, .box-hv-q {
        width: 81%;
    }

    .box-ad-a, .uom-block-textbox2 .txt-box {
        width: 76%;
    }

    .ua-btn-qa-bm p, .ua-btn-ap-rp p {
        display: none;
    }

    .unica-video-main p {
        font-size: 20px;
    }

    .unica-learn-bottom {
        padding: 20px 0;
    }

    .ua-btn-ap-rp i, .ua-btn-qa-bm i {
        margin: 0;
    }

    .ua-btn-qa-bm {
        float: left;
    }

    .uv-name-hv {
        width: 89%;
    }

    .uv-name-gv {
        width: 88%;
    }

    .unica-order-cart .container {
        padding: 0;
    }

    .col-cart-table {
        padding-left: 0
    }

    .col-cart-table2 {
        padding-right: 0;
        padding-left: 0
    }

    .block-ulti ul {
        margin-left: 20px;
    }

    .u-img-combo {
        height: 87px;
        overflow: hidden;
        min-width: 87px;
        width: 87px;
    }

        .u-img-combo img {
            max-width: none;
            width: auto;
            height: 87px;
            margin-left: -34px;
        }

    .u-des-combo {
        width: 15%;
    }

    .u-tit-combo {
        width: 57%;
    }

    .utt-bot .container {
        padding: 0;
    }

    .u-teacher-avatar {
        margin-right: 0;
    }

    .u-teacher-info {
        float: right;
    }

    .des-ubc-course {
        width: 58%;
    }

    .ubc-btn p, .ubc-btn a {
        width: 47%;
    }

    .tit-gv-news a {
        display: inline-block;
    }

    .unica-learn-top, .unica-learn-bottom {
        opacity: 1.0;
        z-index: 1
    }

    .unica-daily-top {
        height: 253px;
        background-size: contain;
        padding: 20px 0;
    }

    .unica-teacher-top {
        background-position-x: center;
    }

    .box-reason-teacher ul li {
        margin: 17px;
    }

    .member-box .img-wrap img {
        width: 200px;
        height: 200px;
    }

    .member-box {
        width: 216px;
    }

    .people-iq {
        margin: 21px 4px;
    }

    .box-iq-txt h3 {
        font-size: 62px;
    }

    .unica-iq-bottom-box {
        width: 95%;
    }

    .box-slider img {
        height: auto;
    }

    .u-banner-small img:first-child {
        height: 155.5px
    }

    .banner-cd-cate ul li {
        margin: 4px;
    }

    .imgBox img {
        height: 40%;
    }

    .box-about-bot p {
        min-height: 95px;
    }

    .unica-about-block-6 ul li {
        margin: 0 4px;
    }

    .block-about-right h3 {
        font-size: 26px;
    }

    .block-about-right p {
        margin: 10px 0;
    }

    .block-about-right ul li {
        font-size: 13px;
        width: 50%
    }

    .u-tags ul li {
        margin: 9px;
    }

    .box-list-teacher-inner {
        margin: 20px 25px 0 0;
    }

    .noMG {
        margin-right: 0;
    }

    .title-list-teacher ul li {
        margin: 5px 7px;
    }

    .list-box-gv-db ul li {
        margin: 4px;
    }

    .box-txt-app ul li {
        margin: 4px;
    }

    .blog-big-slide .slick-next {
        right: 15px;
    }

    .img-blog-news {
        width: 37%;
    }

    .box-news-mini ul li {
        margin-bottom: 8px;
    }

    .box-cate-list-blogs p {
        width: 69%;
    }

    .u-blog-sm-box img {
        max-height: 149px;
        min-height: 149px;
    }

    .img-blog-news img {
        min-height: 166px;
        max-height: 166px;
    }
}

@media (min-width:768px) and (max-width:991px) {
    .unica-main-banner-box-search {
        right: 13%;
        top: 50%;
    }

    .unica-logo {
        width: 50%;
        padding-top: 14px;
    }

    .cate-md, .cate-sm {
        padding: 0;
    }

    .unica-btn-search {
        right: 19px;
        padding: 6px 9px;
    }

    .unica-menu-cate {
        margin: 25px 0 0 20px;
    }

    .unica-reg-acc {
        padding: 9px 13px;
    }

    .unica-log-acc {
        padding: 9px 6px;
    }

    .unica-cart {
        margin: 0;
    }

    .unica-form {
        padding: 6px 4px;
    }

    .slick-prev:before, .slick-next:before {
        font-size: 25px !important;
        color: #606060;
    }

    .box-slider .slick-prev {
        left: -13px;
    }

    .box-slider .slick-next {
        right: -10px;
    }

    .box-slider img {
        padding: 6px;
        height: 241px;
    }

    .u-banner-small img:first-child {
        height: 113px;
    }

    .unica-big-slider h4, .unica-learn-today h4 {
        font-size: 24px;
    }

    .target-box {
        width: auto;
    }

    .pdr {
        padding-right: 9px;
    }

    .sub-email {
        text-align: center;
    }

    .course-box-slider {
        margin: 0 11px;
    }

    .course-box-slider-2 {
        margin: 0 11px;
    }

    .unica-box-course-f .slick-prev {
        left: -20px;
    }

    .title-course-f {
        margin-left: 20px;
    }

    .box-t-mi span {
        padding: 0 10px;
    }

    .txt-reason {
        font-size: 17px;
    }

    .unica-be-teacher {
        background-size: cover;
        height: 160px
    }

    .unica-be-teacher-txt {
        top: 10%;
    }

        .unica-be-teacher-txt p {
            font-size: 14px;
        }

        .unica-be-teacher-txt h4 {
            font-size: 30px;
        }

        .unica-be-teacher-txt a {
            font-size: 14px;
            padding: 6px 35px;
        }

    .box-teacher > button.slick-prev.slick-arrow {
        left: -21px;
    }

    .box-teacher > button.slick-next.slick-arrow {
        right: -15px;
    }

    .box-teacher .slick-prev:before, .box-teacher .slick-next:before {
        font-size: 25px !important;
        color: #606060;
    }

    .unica-box-email {
        text-align: center;
    }

    .u-title-footer {
        width: 75%;
        margin: 0 auto
    }

    .u-e-form {
        padding: 6px 134px 6px 8px;
    }

    .pdl {
        padding-left: 5px;
    }

    .u-list-leftbar {
        width: 33.33333333%;
    }

    .u-all-course .course-box-slider {
        margin: 0 25px 0 0;
    }

    .u-all-course .course-box-slider-2 {
        margin: 0 25px 0 0;
    }

    .u-sort {
        margin-top: 15px;
        padding-bottom: 10px;
    }

    .block-buy {
        max-height: 250px;
        width: 97.5% !important;
        bottom: 10px !important;
        top: unset !important;
        z-index: 9;
    }

    .u-detail-block-title {
        width: 100%;
    }

    .u-sm-left {
        width: 47%;
        float: left;
    }

    .u-sm-right {
        width: 50%;
        float: right;
    }

    .block-ulti a {
        margin: 5px 0;
    }

    .u-block-plus {
        width: 34%;
        margin-left: 10px;
    }

    .u-plus-course .course-box-slider {
        margin: 0 1px;
    }

    .u-plus-course .course-box-slider-2 {
        margin: 0 1px;
    }

    .u-plus-icon {
        left: 193px;
    }

    .urh-right {
        width: 75%;
        margin-left: 15px;
    }

    .u-combo-course .course-box-slider {
        margin: 0 6px;
    }

    .u-combo-course .course-box-slider-2 {
        margin: 0 6px;
    }

    .ubo-right-title {
        margin-bottom: 35px;
    }

    .ubo-right-prog {
        margin-top: 20px;
    }

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

    .btn-update {
        float: left;
    }

    .uom-gv-left {
        width: 100%;
    }

    .uom-gv-right {
        width: 100%;
        float: none;
        margin: 0;
    }

        .uom-gv-right ul {
            margin-left: 72px;
        }

    .pdLm {
        padding-left: 0;
    }

    .pdRm {
        padding-right: 0;
    }

    .pdR5 {
        padding-right: 5px;
    }

    .question-area p, .answer-area p {
        font-size: 13px;
    }

    .box-answer {
        margin: 0;
    }

    .uom-block-chat {
        padding: 15px 5px;
    }

    .box-hv-q, .txt-box {
        width: 80%;
    }

    .name-hv-q p {
        margin-right: 10px;
    }

    .name-hv-q span, .name-ad-a span {
        font-size: 12px;
    }

    .u-txt-list p {
        font-size: 20px;
    }

    .u-txt-list span {
        font-size: 14px;
    }

    .u-txt-list {
        margin-top: 5px;
    }

    .u-txt-back a {
        font-size: 18px;
        margin-top: 16px;
    }

    .unica-learn-bottom {
        padding: 20px 0;
    }

    .ua-btn-qa-bm p, .ua-btn-ap-rp p {
        display: none;
    }

    .ua-btn-ap-rp i, .ua-btn-qa-bm i {
        margin: 0;
    }

    .uv-name-hv {
        width: 86%;
    }

    .uv-name-gv {
        width: 84%;
    }

    .col-cart {
        padding: 0;
    }

    .remove-course {
        margin: 0 5px;
        font-size: 18px;
        left: 5px;
    }

    .u-cart-combo-course .remove-course {
        left: 470px;
        top: 9px
    }

    .price-cart {
        width: 17%;
    }

    .col-cart-table {
        padding-left: 0
    }

    .col-cart-table2 {
        padding-right: 0;
        padding-left: 0
    }

    .u-list-course {
        padding: 5px;
    }

    .u-teacher-right ul li {
        margin: 0 10px;
    }

    .u-teacher-right p {
        font-size: 40px;
    }

    .u-teacher-info a {
        padding: 10px;
    }

    .u-teacher-avatar {
        margin-right: 5px;
    }

    .utt-bot .padNo {
        padding: 0;
    }

    .u-teacher-right p {
        font-size: 35px;
    }

    .u-box-course-teacher h3 {
        margin-bottom: 10px;
    }

    .des-ubc-course {
        width: 58%;
    }

    .unica-learn-top, .unica-learn-bottom {
        opacity: 1.0;
        z-index: 1
    }

    .img-ubc-course, .des-ubc-course {
        width: 100%;
    }

    .box-dashboard {
        padding: 10px;
    }

    .unica-daily-top {
        height: 190px;
        background-size: contain;
        padding: 10px 0;
    }

        .unica-daily-top p {
            font-size: 30px;
        }

        .unica-daily-top span {
            font-size: 20px;
            margin: 20px 0 30px 0;
        }

        .unica-daily-top a {
            font-size: 20px;
            padding: 10 20px;
        }

    .table-dl th, .table-dl td {
        font-size: 14px !important;
    }

    .unica-teacher-top {
        height: 300px;
        background-position: center;
    }

        .unica-teacher-top p {
            font-size: 32px;
            margin-bottom: 40px;
        }

    .title-block-2 {
        font-size: 15px;
    }

    .box-reason-teacher ul li {
        margin: 6px;
        width: 135px;
    }

    .box-inner-teacher p {
        font-size: 13px;
        margin-top: 10px;
    }

    .unica-teacher-block-3 h3 {
        margin-top: 0;
    }

    .box-inner-teacher img {
        width: 50%;
    }

    .inner-block-4 img {
        width: 50%;
    }

    .inner-block-4 p {
        font-size: 16px;
        font-weight: bold;
        margin: 10px 0;
    }

    .unica-teacher-block-4 span {
        margin-top: 20px;
        font-size: 15px;
        display: inline-block;
    }

    .col-3-steps {
        width: 693px;
    }

        .col-3-steps ul li {
            margin: 0 15px;
        }

    .inner-col-steps img {
        width: 50%;
    }

    .inner-col-steps {
        width: 137px;
    }

        .inner-col-steps span {
            font-size: 13px;
        }

    .unica-teacher-block-5 h3 {
        margin-top: 0;
    }

    .member-box .img-wrap img {
        width: 220px;
        height: 220px;
    }

    .member-box {
        width: 224px;
        height: 340px;
    }

        .member-box:last-child {
            display: none;
        }

    .unica-teacher-block-7 h3 {
        font-size: 20px;
    }

    .unica-iq-aq-eq {
        padding: 0;
    }

        .unica-iq-aq-eq h3 {
            margin: 5px;
        }

    .people-iq {
        margin: 5px;
        width: 109px;
    }

    .box-iq-txt h3 {
        font-size: 34px;
    }

    .box-iq-txt p {
        margin-top: 5px;
        font-size: 13px;
    }

    .txt-result {
        float: right;
        margin: 0;
    }

        .txt-result span {
            margin-top: 0;
        }

    .result-4 {
        margin: 7px 0;
        width: 70px;
        height: 70px;
        padding: 15px 0;
    }

    .unica-iq-bottom-box .pagination {
        position: relative;
    }

    .unica-iq-bottom-box {
        width: 93%;
    }

    .inner-col-steps-aff span {
        font-size: 15px;
    }

    .searchBox {
        width: 100%;
    }

    .btn-dbs-search {
        width: 115px;
    }

    .btn-addcard {
        margin-top: 6px;
    }

    .prepaid_number {
        display: block;
    }

    .banner-cd-cate ul li {
        margin: 12px;
        width: 30%;
    }

    .db-item li {
        margin-right: 5px;
    }

    .btn-tcc {
        width: 100%;
    }

    .unica-about-block-6 ul li {
        width: 48%;
        margin-top: 10px;
    }

    .block-about-right p {
        margin: 10px 0;
    }

    .block-about-right h3 {
        font-size: 20px;
    }

    .block-about-right a {
        float: left;
    }

    .block-about-right ul li {
        width: 100%;
    }

    .block-about-right a {
        display: none;
    }

    .block-about-left {
        margin-bottom: -4px;
    }

    .unica-about-block-7 img {
        margin-top: 24px;
    }

    .u-tags ul li {
        margin: 7px;
    }

    .box-list-teacher-inner {
        margin: 20px 20px 0 0;
    }

    .noMG {
        margin-right: 0;
    }

    .title-list-teacher ul li {
        margin: 5px 2px;
    }

    .list-box-gv-db ul li {
        width: 23%;
    }

    .list-box-gv-db p {
        font-size: 12px;
    }

    .box-txt-app ul li {
        width: 44%;
        float: left;
    }

    .box-news-mini {
        width: 95%;
        margin: 10px;
    }

    .pdNoneb {
        padding: 0;
    }

    .box-cate-list-blogs p {
        width: 63%;
    }

    .img-blog-news {
        width: 96%;
    }
}

@media (max-width:767px) {
    .choice_class {
        white-space: normal !important;
    }

    .sm-mobile-menu {
        background: #fff;
        min-height: 44px;
        text-align: center;
        border-bottom: 1px solid #e1e1e1;
        -webkit-box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.75);
        -moz-box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.75);
        box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.75);
    }

    .sm-navi-btn {
        float: left;
    }

        .sm-navi-btn i {
            font-size: 20px;
            color: #000;
            margin: 12px 15px;
        }

    .navibar-mobile .navbar-offcanvas {
        background: #fff;
    }

    .logo-mobile img {
        max-width: 110px;
        margin-top: 5px;
    }

    .sidenav-brand {
        background: #eee !important;
        padding: 10px 0px;
        position: relative;
    }

        .sidenav-brand .remove-navibar {
            position: absolute;
            top: 8px;
            left: 21px;
        }

    .remove-navibar {
        float: left;
    }

    .sidenav-brand .remove-navibar i {
        color: #fff;
        font-size: 28px;
    }

    .remove-navibar i {
        color: #fff;
        margin-right: 30px;
    }

    .sm_logo_brand {
        text-align: center;
    }

        .sm_logo_brand img {
            max-width: 110px;
        }

    .navbar-offcanvas ul {
        padding: 0px;
        margin: 0;
        text-align: left;
    }

    .sm-customize-menu li {
        display: inline-block;
        width: 100%;
    }

        .sm-customize-menu li a {
            padding: 15px;
            padding-left: 25px;
            font-size: 16px;
            color: #212121;
        }

            .sm-customize-menu li a i {
                font-size: 22px;
                color: #757575;
                padding-right: 20px;
                position: relative;
                top: 3px;
            }

    .sidenav-footer {
        padding: 10px 20px;
        border-top: solid 1px #eee;
    }

        .sidenav-footer h4 {
            color: #fff;
            display: block;
            padding: 16px;
            font-size: 14px;
            text-transform: uppercase;
            margin: 0;
            background: #ccc;
            font-weight: bold;
        }

        .sidenav-footer ul {
            padding: 0;
        }

    .navbar-offcanvas ul {
        padding: 0px;
        margin: 0;
        text-align: left;
    }

    .sidenav-footer ul li {
        padding: 5px 0px;
        font-size: 16px;
        color: #212121;
    }

        .sidenav-footer ul li i {
            font-size: 22px;
            padding-right: 10px;
            position: relative;
            top: 4px;
            color: #757575;
        }

    .cart-mobile {
        color: #f26c4f;
        font-size: 22px;
        margin: 7px 11px;
        position: relative;
        top: -3px;
        right: -7px;
    }

    .c_header__search-wrapper {
        height: 44px;
        padding-top: 7px;
    }

    .c_header__mobile-bt {
        background: transparent;
        border: none;
    }

        .c_header__mobile-bt i {
            color: #f26c4f;
            font-size: 22px;
            padding-top: 2px;
        }

    .c_header__search {
        background: #fff;
        display: none;
        border-top: none;
        bottom: 0;
        box-shadow: 0 2px 1px #dedfe0;
        left: 0;
        padding: 10px 15px 15px;
        position: absolute;
        right: 0;
        top: 44px;
        visibility: visible;
        z-index: 2;
        height: 60px;
    }

    .sm-form {
        font-size: 13px;
        font-style: italic;
        height: 40px;
        width: 99% !important;
    }

    .sm-btn-search {
        position: absolute;
        right: 14px;
        top: 7px;
        background: none;
        color: #f58829;
        font-size: 22px;
    }

    .login-mobile {
        float: right;
        height: 44px;
        padding-right: 9px;
        padding-top: 8px;
        position: relative;
        cursor: pointer;
    }

    .ava-img {
        display: inline-flex;
        vertical-align: middle;
        align-items: center;
        justify-content: center;
        width: 30px;
        height: 30px;
        border-radius: 100%;
        border: solid 1px #505050;
        background-repeat: no-repeat;
        background-position: center center;
        background-size: cover;
        overflow: hidden;
        cursor: pointer;
    }

        .ava-img .fa {
            color: #505050;
            font-size: 20px;
        }

    .login-mobile .user-login-panel {
        top: 55px;
        right: 0;
        left: auto;
        box-shadow: 4px 4px 14px 2px rgba(0,0,0,0.06) !important;
        border-radius: 3px;
        border: none !important;
        padding: 10px;
    }

    .popover-content {
        padding: 9px 14px;
    }

    .popover .popover-content .btn {
        color: #464646;
        border: 1px solid #E1E5EA;
        font-weight: 400;
        line-height: 1.9;
        width: 200px;
        text-align: left;
        padding-left: 10px;
    }

    .btn-block + .btn-block {
        margin-top: 5px;
    }

    .unica-main-banner-box-search h4 {
        font-size: 24px;
        padding: 0 10px;
    }

    .unica-main-banner {
        height: 320px;
    }

    .unica-main-banner-box-search {
        right: 5%;
        top: 55%;
    }

    .unica-btn-search-box {
        top: 2px;
        right: 4px;
    }

    .unica-form-box {
        width: 99% !important;
    }

    .u-box-search {
        width: 100%;
    }

        .u-box-search form {
            margin: 0;
        }

    .unica-iq {
        margin: 20px 15px;
    }

        .unica-iq a {
            padding: 10px 15px;
            font-size: 16px;
        }

    .unica-big-slider h4, .unica-learn-today h4 {
        font-size: 20px;
    }

    .box-item {
        width: 50%;
    }

        .box-item:last-child {
            display: none;
        }

    .unica-lt-box {
        display: block;
    }

    .unica-iq {
        margin: 10px 0;
        padding: 10px 0;
    }

    .u-banner-big {
        padding: 7px;
    }

    .box-slider > .slick-prev:before, .slick-next:before {
        font-size: 20px !important;
        color: #606060 !important;
    }

    .box-slider .slick-prev {
        left: -15px;
    }

    .box-slider .slick-next {
        right: -15px
    }

    .box-slider img {
        padding: 0;
        height: auto;
    }

    .target-box {
        width: auto;
    }

    .u-title-footer {
        font-size: 16px;
    }

        .u-title-footer i {
            margin: 8px 4px 0 0;
            font-size: 25px;
        }

    .unica-main-banner-box-search {
        right: 1%;
    }

    .unica-learn-today h4 {
        margin: 15px 0;
    }

    .u-tab a {
        padding: 5px;
        font-size: 12px;
    }

    .course-box-slider {
        margin-bottom: 10px;
        width: 280px;
        min-height: 130px;
        max-height: 130px;
        border-bottom: 1px solid #ccc;
        border-right: 0;
        border-top: 0;
        border-left: 0;
        margin: 5px 0;
        display: inline-block;
        width: 100%;
    }

    .course-box-slider-2 {
        margin-bottom: 10px;
        width: 280px;
        min-height: 130px;
        max-height: 130px;
        border-bottom: 1px solid #ccc;
        border-right: 0;
        border-top: 0;
        border-left: 0;
        margin: 5px 0;
    }

    .price-a {
        font-size: 24px;
        margin-left: 5px;
    }

    .price-b, .price-c {
        font-size: 14px;
    }

    .price-b {
        float: right;
        margin: 7px 0;
    }

    .img-course {
        height: 87px;
        min-width: 87px;
        width: 87px;
        float: left;
        margin-right: 10px;
    }

        .img-course img {
            max-width: none;
            width: auto;
            height: 87px;
            margin-left: -34px;
        }

    .des-gv {
        display: none;
    }

    .price-c {
        display: none;
    }

    .title-course-f a {
        margin: 4px 12px;
    }

    .price-course {
        border: 0;
        padding-top: 0;
        margin: 0;
    }

    .name-gv, .rate-course {
        margin: 7px 0;
    }

    .unica-box-course-hot .u-tab {
        display: inline-block;
        border-bottom: 1px solid #ccc;
        width: 100%;
    }

    .unica-big-box {
        margin: 0;
    }

    .content-course {
        margin: 0px 7px 5px 7px;
    }

    .title-course-f {
        font-size: 20px;
        margin-bottom: 0;
        border-bottom: 3px solid #f67052;
        padding: 5px 0;
    }

    .unica-target h4 {
        font-size: 20px;
    }

    .unica-reason h4 {
        font-size: 18px;
        margin-top: 10px;
    }

    .target-box-inner {
        width: 50%;
    }

    .box-t-mi span {
        padding: 0 10px;
        top: 29%;
    }

    .txt-reason {
        font-size: 14px;
    }

        .txt-reason span {
            font-size: 14px;
        }

    .reason-4 {
        margin-bottom: 15px;
    }

    .u-title-footer p {
        font-size: 24px;
    }

    .img-reason {
        margin: 0 auto;
        width: 50%;
    }

    .pdm-No {
        padding: 0;
    }

    .unica-be-teacher {
        background: #44a9d5;
        height: 170px;
    }

    .unica-be-teacher-txt {
        top: 15%;
    }

        .unica-be-teacher-txt a {
            padding: 7px 35px;
            font-size: 14px;
        }

        .unica-be-teacher-txt p {
            font-size: 14px;
        }

        .unica-be-teacher-txt h4 {
            font-size: 32px;
        }

    .unica-top-teacher h4 {
        font-size: 24px;
    }

    .slick-prev:before, .slick-next:before {
        font-size: 20px !important;
        color: #606060 !important;
    }

    .box-teacher > button.slick-prev.slick-arrow {
        left: -15px;
    }

    .box-teacher > button.slick-next.slick-arrow {
        right: -15px;
    }

    .pdl {
        padding: 0 5px;
    }

    .pdm {
        padding: 0 5px;
    }

    .app-unica ul li {
        float: left;
        margin-right: 11px;
    }

    #footer2 ul {
        font-size: 12px;
    }

    .u-all-course .course-box-slider {
        width: 98%;
    }

    .u-all-course .course-box-slider-2 {
        width: 290px;
    }

    .main-content {
        width: 100%;
    }

    .col-filter {
        padding-left: 0;
        padding-right: 5px;
    }

    .filter .form-control {
        float: left;
        width: 48%;
        margin-right: 5px;
        margin-bottom: 5px;
    }

    .u-detail-block-title {
        width: 100%;
    }

        .u-detail-block-title h3 {
            font-size: 24px;
            margin-top: 0;
        }

    .u-detail-tea a {
        display: block;
    }

    .show-xs .block-buy {
        top: unset;
        margin-top: 5px;
        padding: 10px 5px 5px 5px;
    }

    .show-xs .block-ulti a {
        margin: 10px 0;
    }

    .u-list-course {
        border: 0;
        padding: 0;
    }

        .u-list-course h3 {
            margin-bottom: 10px;
            padding: 10px 10px 0;
        }

        .u-list-course .container-fluid {
            padding: 0 7px;
        }

    .u-detail-course .col-xs-12 {
        padding: 0 5px;
    }

    .u-learn-what, .u-des-course, .u-course-plus, .u-course-teacher, .u-rate-hv, .u-cm-hv, .u-combo-buy {
        padding: 7px;
    }

    .u-plus-icon {
        top: 105px;
        left: 117px;
    }

    .u-plus-course, .uct-left, .urh-left {
        width: 100%;
    }

    .u-block-plus, .uct-right, .urh-right {
        width: 100%;
        margin: 0;
    }

    .u-rate-f1-progress {
        width: 50%;
    }

    .u-rate-f1-star {
        width: 37%;
        margin: 0 5px;
    }

    .u-rate-f1 {
        width: 100%;
        display: inline-block;
    }

    .number-big-rate {
        float: left;
    }

    .star-big-rate {
        margin-top: 30px;
    }

    .block-inner {
        margin-left: 35px;
    }

    .cm-hv {
        margin-left: -28px;
        margin-top: 10px;
    }

    .u-combo-buy > div > ul > li:last-child > div > a {
        border: 0;
    }

    .u-combo-usua {
        display: inline-block;
        padding: 5px 0 0;
    }

    .name-hv {
        margin: 0;
        float: none;
    }

    .rate-hv {
        margin: 0;
    }

    .price-e {
        float: right;
        font-size: 14px;
        margin: 10px 14px;
    }

    .img-combo {
        height: 87px;
        overflow: hidden;
        min-width: 87px;
        width: 87px;
    }

        .img-combo img {
            max-width: none;
            width: auto;
            height: 87px;
            margin-left: -34px;
        }

    .des-combo {
        display: block;
    }

        .des-combo a {
            font-size: 14px;
            margin-bottom: 7px;
        }

    .gv-combo {
        font-size: 12px;
    }

    .rate-combo {
        margin-top: 7px;
    }

        .favo-combo, .price-combo-c, .rate-combo span:last-child {
            display: none;
        }

    .price-combo {
        margin: 0;
        width: 100%;
        text-align: unset;
        margin-top: 7px;
    }

    .price-combo-a {
        float: left;
    }

    .price-combo-b {
        float: right;
        margin: 10px 0 0 0;
        font-size: 14px;
    }

    .ubo-right-title {
        margin-bottom: 38px;
    }

    .ubo-right-prog {
        margin-top: 20px;
    }

    .pdLm {
        padding: 0 7px;
    }

    .btn-update {
        float: left;
    }

    .uom-file-ulti {
        float: left;
        margin-top: 10px;
    }

    .uom-block-intro, .uom-block-rate, .uom-block-doc, .uom-block-gv, .uom-block-aff-share, .uom-block-chat {
        padding: 7px;
    }

    .uom-gv-left {
        width: 100%;
    }

    .uom-gv-right {
        width: 100%;
        float: none;
        margin: 0;
    }

        .uom-gv-right ul {
            margin-left: 72px;
        }

    .question-area p, .answer-area p {
        font-size: 13px;
    }

    .box-answer {
        margin: 0;
    }

    .uom-block-chat {
        padding: 15px 5px;
    }

    .box-hv-q, .txt-box {
        width: 80%;
    }

    .name-hv-q p {
        margin-right: 10px;
    }

    .name-hv-q span, .name-ad-a span {
        font-size: 12px;
    }


    .unica-learn-video img {
        height: auto;
    }

    .u-txt-list {
        display: none;
    }

    .u-btn-list {
        margin: 16px;
    }

    .u-txt-back {
        margin-right: 10px;
        margin-top: 16px;
    }

        .u-txt-back a {
            font-size: 14px;
            margin-top: 17px;
            font-weight: bold;
        }

    .unica-list-video-course, .unica-back-course {
        margin: 5px 0;
        padding: 0
    }

    .unica-video-main p {
        font-size: 16px;
        margin: 5px 0;
    }

    .u-btn-list i, .u-btn-back i {
        font-size: 16px;
    }

    .unica-learn-bottom {
        padding: 10px 0;
    }

    .ua-btn-bn p, .ua-btn-sv p {
        display: none;
    }

    .ua-btn-bn a {
        width: auto;
    }

        .ua-btn-bn a:last-child {
            padding: 7px 10px;
        }

    .ua-btn-bn, .ua-btn-sv, .ua-btn-qa-bm, .ua-btn-ap-rp {
        padding: 0 5px;
    }

        .ua-btn-bn a {
            margin: 0;
        }

        .ua-btn-qa-bm a, .ua-btn-ap-rp a {
            margin: 0 5px;
        }

        .ua-btn-qa-bm i, .ua-btn-ap-rp i {
            margin: 0;
        }

        .ua-btn-ap-rp i, .ua-btn-qa-bm i, .ua-btn-ap-rp i {
            font-size: 14px;
        }

        .ua-btn-qa-bm p, .ua-btn-ap-rp p {
            display: none;
        }

    .col .title {
        width: 100%;
    }

    .uv-name-hv {
        width: 86%;
        margin-top: -2px;
    }

        .uv-name-hv p, .uv-name-gv p {
            width: 100%;
        }

        .uv-name-hv span, .uv-name-gv span {
            float: left;
            font-size: 12px;
            margin: 0 !important;
        }

    .overview-tabs a {
        font-size: 14px;
        padding: 5px !important;
    }

    .uv-name-hv .lession_name_a {
        margin: 0;
    }

    .u-overview-main .uv-box-an {
        margin-left: 12px;
    }

    .u-overview-main .uv-name-gv {
        margin-left: 5px;
    }

    .uv-name-gv {
        margin-top: -2px;
        width: 84%;
    }

    .col-cart {
        padding: 0 5px;
    }

    .u-cart-course {
        display: inline-block;
    }

    .img-cart-course {
        height: 87px;
        overflow: hidden;
        min-width: 87px;
        width: 87px;
        float: left;
        margin-right: 10px;
    }

        .img-cart-course img {
            max-width: none;
            width: auto;
            height: 87px;
            margin-left: -34px;
        }

    .title-cart-course {
        text-align: left;
        width: 65%;
        display: inline-block;
    }

    .u-box-cart2 {
        padding: 10px;
    }

    .price-cart {
        margin-top: 26px;
        width: 100%;
    }

        .price-cart p {
            float: left;
        }

        .price-cart span {
            vertical-align: sub;
        }

    .u-cart-price {
        margin-top: 0;
    }

    .remove-course {
        float: left;
        font-size: 16px;
        left: 90px;
    }

    .u-cart-combo-course .remove-course {
        left: 280px;
        top: 9px
    }

    .col-12-full {
        width: 100%;
    }

    .u-list-combo {
        padding: 5px;
    }

    .u-number-combo {
        width: 9%;
    }

    .u-img-combo {
        height: 87px;
        overflow: hidden;
        min-width: 87px;
        width: 87px;
    }

        .u-img-combo img {
            max-width: none;
            width: auto;
            height: 87px;
            margin-left: -34px;
        }

    .u-tit-combo {
        width: 57%;
    }

    .u-des-inner {
        display: none;
    }

    .u-price-inner {
        margin-top: 25px;
    }

    .u-des-combo {
        width: 100%;
        margin-top: 10px;
    }

    .u-des-more {
        width: 47%;
        float: left;
        margin-right: 5px;
    }

    .u-des-content {
        width: 47%;
        float: right;
    }

    .u-teacher-combo {
        max-width: 295px;
        margin-right: 0;
    }

    .img-teacher-combo {
        width: 30%;
        float: left;
        padding: 5px;
    }

    .course-tea-combo {
        margin-top: 5px;
    }

    .unica-learn-top, .unica-learn-bottom {
        opacity: 1.0;
        z-index: 1
    }

    .unica-learn-top {
        background: #000;
    }

    .u-teacher-info a {
        display: block;
        float: left;
    }

    .utt-bot {
        position: relative;
    }

    .u-teacher-avatar {
        margin-right: 0;
    }

    .uti-link {
        margin: 0;
    }

        .uti-link i {
            font-size: 18px;
            margin-right: 1px;
        }

    .u-teacher-info {
        margin: 0;
    }

        .u-teacher-info a {
            width: 140px;
            padding: 10px 5px;
        }

            .u-teacher-info a:last-child {
                margin-right: 0;
            }

    .img-ubc-course, .des-ubc-course, .ubc-btn p, .ubc-btn a {
        width: 100%;
    }

    #player_videojs {
        height: 100%;
    }

    .u-dashboard-tab {
        padding: 0;
    }

    .box-dashboard {
        padding: 10px 0;
    }

    .u-dashboard-top .navbar-toggle {
        background: #fff;
        margin: 0;
    }

    .u-dashboard-top .nav-tabs {
        border: 0;
        margin: 0
    }

    .u-dashboard-top .navbar-collapse {
        padding: 0;
    }

    .u-dashboard-top .navbar-toggle .icon-bar {
        background: #333
    }

    .u-dashboard-top ul li {
        display: list-item;
        float: none;
        margin: 0;
    }

        .u-dashboard-top ul li a {
            border-radius: 0;
            color: #fff;
        }

    #myNavbar > ul > li.dropdown.open > ul > li > a {
        border-bottom: 1px solid #6d7584;
    }

    .u-dashboard-top ul li a:focus {
        color: #000;
    }

    .u-dashboard-top p {
        float: left;
    }

    .u-dashboard-top i {
        width: 30px;
        text-align: center;
        margin-right: 3px;
    }

    .form-daily {
        width: auto;
    }

    .unica-daily-top {
        height: 200px;
        background-position-x: center;
        padding: 50px 0;
    }

        .unica-daily-top p {
            font-size: 18px;
        }

        .unica-daily-top span {
            font-size: 14px;
            margin: 20px 0 30px 0;
        }

        .unica-daily-top a {
            font-size: 14px;
        }

    .unica-daily-ql h3, .unica-daily-cs h3, .unica-daily-reg h3 {
        font-size: 18px;
    }

    .ql-dl-box {
        width: auto;
        height: 140px;
    }

        .ql-dl-box p {
            font-size: 14px;
        }

        .ql-dl-box img {
            width: 50%;
        }

    .col-3-steps {
        width: auto;
    }

    .unica-teacher-top {
        height: 200px;
        background-position: center;
        padding: 20px 0;
    }

        .unica-teacher-top p {
            font-size: 24px;
            margin-bottom: 42px;
        }

    .unica-teacher-video p {
        font-size: 14px;
        margin-bottom: 10px;
    }

    .video-youtube iframe {
        height: 200px;
    }

    .title-block-2 {
        font-size: 14px;
        line-height: 20px;
    }

    .block-3 {
        margin-top: 15px;
    }

    .box-teacher img {
        display: inline-block !important;
    }

    .block-3 .slick-dots {
        position: relative;
        bottom: 0 !important;
    }

    .box-reason-teacher ul li {
        width: unset;
        margin: unset;
        display: inline-block;
    }

    .box-inner-teacher img {
        display: inline-block !important;
    }

    .box-reason-teacher .slick-dots {
        bottom: -35px;
    }

    .inner-block-4 img {
        width: 50%;
    }

    .inner-block-4 p {
        font-size: 14px;
        margin: 10px 0;
    }

    .unica-teacher-block-4 span {
        font-size: 14px;
        margin-top: 10px;
        display: inline-block;
    }

    .col-3-steps ul li {
        margin: 0 5px;
    }

    .col-3-steps .slick-dots {
        bottom: -35px;
    }

    .unica-teacher-block-6 h3 {
        font-size: 20px;
        margin: 0;
    }

    .member-box {
        width: 150px;
        margin: 35px 5px 0;
        height: 230px;
    }

        .member-box .img-wrap img {
            width: 150px;
            height: 150px;
        }

        .member-box h4 {
            margin: 0;
        }

    .unica-teacher-block-6 {
        padding: 33px 0;
    }

    .unica-teacher-block-7 h3 {
        font-size: 18px;
    }

    .unica-teacher-block-7 .container {
        padding: 0
    }

    .unica-teacher-block-7 a {
        margin: 10px 0;
    }

    .unica-teacher-block-7 p {
        font-size: 20px;
    }

    .banner-iq {
        height: 200px;
    }

    .test-btn {
        margin: 9px;
        padding: 12px 7px;
        float: left;
    }

    .small-txt {
        display: none;
    }

    .banner-iq-aq-eq {
        padding: 50px 0 0;
    }

    .unica-iq-aq-eq h3 {
        font-size: 20px;
        margin-bottom: 15px;
    }

    .img-people-iq img {
        display: inline-block !important;
    }

    .top-6-iq .slick-dots {
        bottom: -25px;
    }

    .people-iq {
        border: 0;
        margin: 0;
    }

    .box-iq-txt h3 {
        font-size: 22px;
        margin-top: 10px;
    }

    .flR-iq {
        float: left;
        text-align: left;
    }

    .unica-box-iq {
        margin-bottom: 0;
        border-bottom: 1px solid #ccc;
    }

    .inner-iq-block-3 p, .inner-iq-block-4 p, .inner-iq-block-5 p {
        width: 100%;
    }

    .img-result, .img-result img {
        width: 100%;
    }

    .txt-result {
        width: 100%;
        margin: 0;
        float: none;
        padding: 0;
    }

        .txt-result span {
            margin: 0
        }

    .unica-iq-bottom-box .pagination {
        position: relative;
    }

    .kq-test {
        display: inline-block;
        margin-bottom: 10px;
    }

    .time-iq-t span {
        padding: 5px 15px;
    }

    .unica-iq-bottom-box {
        width: 100%;
        position: relative;
        bottom: 0;
    }

    .unica-iq-main-box {
        display: block;
        float: left;
    }

    .iq-answer-box {
        display: inline-block;
    }

    .unica-iq-block-test {
        height: 100%;
    }

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

    .iq-answer-box .radio-inline {
        width: 100%;
    }

    .iq-complete-box .congratulations {
        font-size: 18px;
    }

    .iq-result-box {
        display: inline-block;
    }

    .img-result img {
        margin: 0;
    }

    .unica-affiliate-top {
        padding: 20px 0;
        height: 300px;
    }

        .unica-affiliate-top p {
            font-size: 24px;
            margin-bottom: 20px;
        }

        .unica-affiliate-top span {
            font-size: 14px;
        }

        .unica-affiliate-top a {
            padding: 7px 15px;
            font-size: 16px;
            margin: 0;
        }

    .unica-affiliate-block-2 p {
        font-size: 20px;
    }

    .unica-affiliate-block-3 p {
        font-size: 20px;
    }

    .unica-affiliate-block-3 span {
        font-size: 14px;
    }

    .col-3-steps-aff ul li {
        width: unset;
    }

    .unica-affiliate-block-5 .col-3-steps-aff .slick-prev:before, .unica-affiliate-block-5 .col-3-steps-aff .slick-next:before {
        color: #fff !important;
    }

    .unica-affiliate-block-7 h3, .unica-affiliate-block-7 p {
        font-size: 20px;
    }

    .unica-affiliate-block-6 ul li {
        width: unset;
    }

    .unica-affiliate-block-6 .slick-prev, .unica-affiliate-block-6 .slick-next {
        display: none !important;
    }

    .searchBox {
        width: 100%;
        margin-bottom: 5px
    }

    .btn-dbs-search {
        width: 94%;
        margin-top: 10px;
    }

    .imgBox img {
        height: auto;
        width: 100%
    }

    .card {
        margin-bottom: 10px;
    }

    .mg-Xs {
        margin: 10px 0;
    }

    .list-view .table > tbody > tr > td {
        float: left;
        border: 0;
    }

    .list-view .table-log > tbody > tr > td {
        float: none;
        border: 0;
        white-space: nowrap;
    }

    .border-xs {
        border: 1px solid #ccc;
        padding: 5px;
    }

    .u-list-course .col {
        padding: 15px 10px;
    }

    .iq-question-box {
        width: 100%;
    }

    .iq-answer-box {
        width: 100%;
    }

    .box-pop {
        width: 100%;
        display: inline-block;
    }

    .banner-cd-cate ul li {
        width: 47%;
        margin: 4px;
    }

    .u-teacher-left {
        margin-top: 20px;
    }

    .u-teacher-info span {
        width: 295px;
        font-size: 15px;
    }

    .u-teacher-info p {
        font-size: 24px;
    }

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

    .pdXS0 {
        padding: 0;
    }

    .pd0p {
        padding: 0 15px;
    }

    .block-title {
        font-size: 20px;
    }

    .mg5xs {
        margin: 5px 0;
    }

    .user-card .col-lg-9 {
        padding: 0;
    }

    .guilde p {
        font-size: 14px;
    }

    .btn-search-free {
        margin-bottom: 10px;
    }

    #w1 > table > tbody > tr {
        border-bottom: 1px solid #ccc;
    }

    .pdXs5 {
        padding: 0 5px;
    }

    .unica-about-block-1 {
        padding: 50px 0;
        height: 250px;
    }

        .unica-about-block-1 h3 {
            font-size: 26px;
        }

        .unica-about-block-1 p {
            font-size: 16px;
        }

        .unica-about-block-1 span {
            font-size: 24px;
        }

    .unica-about-block-2 p {
        margin-top: 0;
    }

    .unica-about-block-3 ul li {
        width: 50%;
        margin-bottom: 20px;
    }

    .unica-about-block-3 p {
        font-size: 34px;
    }

    .unica-about-block-3 span {
        font-size: 14px
    }

    .unica-about-block-3 {
        padding: 25px 0;
    }

    .unica-about-block-4 img {
        display: inline-block;
    }

    .unica-about-block-4 ul li {
        width: auto;
        display: inline-block;
    }

    .box-list-teacher-inner {
        width: 84%;
        margin: 10px 25px;
    }

    .title-teacher-new-db p {
        float: none;
        font-size: 20px;
    }

    .list-box-gv-db ul li {
        width: 46%;
    }

    .list-box-gv-db p {
        font-size: 10px;
    }

    .box-news-mini {
        margin: 10px;
        width: auto;
    }

    .img-blog-news {
        margin: 10px;
    }

    .box-cate-list-blogs p {
        width: 70%;
    }

    .img-blog-news {
        width: 94%
    }

    .u-search-box-404 .input-group {
        width: 100%;
    }

    .u-search-box-404 .input-group-btn {
        width: auto;
    }

    .box-result-test {
        width: 100%;
    }

    .mbs-block-membership {
        margin-right: 10%
    }

    .mb-join-code {
        width: 100% !important;
    }
}

@media (min-width:321px) and (max-width:414px) {
    .unica-main-banner-box-search {
        right: 12%;
    }

    .unica-box-course-hot {
        width: 100%;
    }

        .unica-box-course-hot .u-tab {
            width: 100%;
        }

    .box-pop {
        width: 100%;
        display: inline-block;
    }

    .course-box-slider {
        width: 100%;
    }

    .course-box-slider-2 {
        width: 100%;
    }

    #footer2 ul {
        display: inline-block;
    }

    #footer2 p, #footer2 a {
        font-size: 14px;
    }

    .des-unica h4, .app-unica h4 {
        margin: 25px 0 0 0;
    }

    .u-tab a {
        font-size: 14px;
    }

    .u-list-course .col {
        padding: 15px 10px;
    }
}

.active-acount {
    border: none !important;
    height: 420px;
}
/* file /statics/css/main.css */

/* css inline */
.payment_confirm_title {
    padding-top: 20px !important;
}

.payment_confirm_button_back {
    margin: 10px 0 !important;
    display: block !important;
}

.payment_confirm_button_delete {
    color: #5c82d3 !important;
}

.register_form_payment_title {
    margin: 0 0 20px !important;
}

.payment_info_banking_default {
    background-color: #fff !important;
}

#btn-pay-banking {
    margin-top: 10px !important;
}

.payment_title_free_course {
    color: #039be5 !important;
}

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

.style_price_product_order_info {
    font-size: 20px !important;
    color: #4ca223 !important;
    font-weight: 400 !important;
}

.fee_sale_off_format_order_info {
    font-size: 20px !important;
    color: #4ca223 !important;
    font-weight: 500 !important;
}
/* css inline */
/* trang thanh toan */

/* trang chi tiet khoa hoc */
/* file statics/css/source-cate.css */
.content-course-cate {
    padding: 15px 0px;
}

    .content-course-cate:last-child {
        border-bottom: none;
    }

.img-responsive {
    max-width: 100%;
    width: 100%;
}

.desc-course a {
    font-size: 16px;
    font-weight: bold;
    color: #545454;
    margin-bottom: 10px;
    display: block;
}

.desc-course .rate-course .star-rate {
    float: left;
    margin-right: 5px;
    margin-top: 1px;
}

.content-course-cate .price-course-of-cate {
    text-align: center;
    margin-top: -4px;
    float: right;
}

    .content-course-cate .price-course-of-cate .price-course-sale {
        font-size: 20px;
        font-weight: bold;
    }

    .content-course-cate .price-course-of-cate .price-course-old {
        text-decoration: line-through;
        font-size: 16px;
        /* margin: 10px 0; */
    }

    .content-course-cate .price-course-of-cate .sale-ratio {
        color: red;
    }

.content-course-cate .desc-course span {
    margin-right: 15px;
}

.number-big-rate {
    font-size: 72px;
    font-weight: bold;
    color: #333;
}

.rating-student-left {
    text-align: center;
    float: left;
}

.star-big-rate {
    margin-bottom: 10px;
}

.rating-student-right {
    float: left;
    margin: 10px 0;
}

    .rating-student-right .u-rate-f1-progress {
        float: left;
        height: 30px;
    }

    .rating-student-right .u-rate-f1-star {
        padding: 0 10px;
        float: left;
        text-align: center;
    }

    .rating-student-right .u-rate-f1-num {
        float: left;
    }

.list_comment_course {
    margin-bottom: 20px;
}

.progress_rate_star {
    overflow: hidden;
    height: 20px;
    background-color: #cecccae0;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
}

.list-comment-course {
    border-bottom: 1px solid #d7d7d7;
    padding: 15px 0px !important;
}

    .list-comment-course:last-child {
        border-bottom: none;
    }

.ava-hv {
    width: 8%;
    text-align: center;
    float: left;
}

.block-hv {
    float: left;
}

.add-load {
    margin: 15px 0;
    text-align: center;
}

#add_load_comment {
    font-weight: 600;
    border-radius: 5px;
    padding: 6px 10px;
    text-align: center;
}

.img-thumbnail {
    padding: unset !important;
}

.cm-hv p {
    margin-top: 10px;
}

.block-rating {
    display: inline-flex;
}

.fa-star {
    color: #f18904c9;
}

@media screen and (max-width: 767px) {
    .desc-course {
        margin-top: 10px;
    }

    .u-rate-f1-progress {
        width: 45%;
    }

    .rating-student-right {
        float: none;
    }

    .ava-hv {
        width: 30%;
    }
}

@media screen and (max-width: 640px) {
    .desc-course {
        margin-top: 10px;
    }

    .u-rate-f1-progress {
        width: 35%;
    }

    .rating-student-right {
        float: none;
    }

    .ava-hv {
        width: 30%;
    }
}

@media screen and (max-width: 450px) {
    .content-course-cate .price-course-of-cate {
        margin-top: 10px;
        float: left;
        width: 100%;
    }

    .desc-course {
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .u-rate-f1-progress {
        width: 100%;
        margin-top: 10px;
    }

    .rating-student-right {
        float: none;
    }

    .ava-hv {
        width: 30%;
    }

    .rating-student-left {
        width: 100%;
    }

    .form-input-search {
        width: 85% !important;
    }
}

.header-search-boxtop-section {
    width: 85% !important;
    margin: 0 auto;
}

.progress-bar-success {
    background-color: #5cb85c;
}

.btn-cart-add {
    text-align: center;
    margin-top: 20px;
}

    .btn-cart-add a {
        background: #007bff;
        padding: 5px 10px;
        border-radius: 3px;
        color: #fff !important;
        transition: 0.5s;
        font-size: 14px;
    }

        .btn-cart-add a:hover {
            background: #034d9c;
        }

.btn-cart-mbs {
    text-align: center;
    margin: 20px 0;
}

    .btn-cart-mbs a {
        background: #007bff;
        padding: 5px 10px;
        border-radius: 3px;
        color: #fff !important;
        transition: 0.5s;
        font-size: 14px;
    }

        .btn-cart-mbs a:hover {
            background: #034d9c;
        }
/* file statics/css/source-cate.css */

/* style inline detail_course */
.image_cover_course_default {
    background-size: cover !important;
    background-position: center !important;
    max-height: 500px !important;
    position: relative !important;
}

.img_teacher_detail_course_default {
    width: 175px !important;
    height: 175px !important;
}

.color_nofify_warning_course {
    color: #f00 !important;
}
/* style inline detail_course */
/* trang chi tiet khoa hoc */



/* gop cac file css lien quan den view edit themes */





/* css cũ của themes */

.text-red {
    color: red;
}

.course-item-detail-combo .price-box p {
    margin-bottom: 0px;
}

.course-item-detail-course h3, .course-item-detail-combo h3 {
    height: 3rem;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    display: -webkit-box !important;
    -webkit-box-orient: vertical;
    min-height: unset !important;
}

.btn-ss-header-search {
    width: 5%;
}

.slider-teacher .giangvien-img img {
    width: 85px;
    height: 85px;
}



/* css trang detail theo themes uni_search */
.info-khoahoc-chitiet {
    background-color: #047082;
    padding-top: 30px;
    padding-bottom: 30px;
}

.content-khoahoc-top {
    color: #fff;
}

.count-rate {
    /*float: left;*/
    padding-right: 20px;
    width: auto;
    padding-top: 2px;
}

.intro-chitiet {
    line-height: 22px;
    margin-bottom: 20px;
    min-height: 15px;
}

.content-khoahoc-top h1 {
    font-weight: bold;
    font-size: 36px;
    margin: 0;
    margin-bottom: 15px;
}

.conent-page {
    padding-top: 10px;
    padding-bottom: 35px;
    background: #f5f5f5;
}

.box-content {
    background-color: #fff;
    padding: 5px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    /* border: solid 1px #d7d7d7; */
    /* margin-top: 10px; */
}

.khoahoc-content h2 {
    font-size: 22px;
    margin: 0;
    margin-bottom: 15px;
    font-weight: 700;
}

.cp {
    border: solid 1px #fff;
}

    .cp .hd-cp {
        background-color: #F9F9F9;
        padding: 5px 15px 10px 5px;
        font-weight: 600;
        color: #005894;
        border-bottom: 1px solid #eee;
    }

    .cp ul {
        padding-left: 10px;
    }

.khoahoc-content ul {
    margin: 15px;
    padding: 0;
}

.cp ul li {
    display: block;
    padding-bottom: 15px;
    border-bottom: 1px solid #ddd;
    margin-bottom: 15px;
}

    .cp ul li:last-child {
        border-bottom: 0px solid #ddd;
        margin-bottom: 0px;
    }

    .cp ul li .fa {
        color: #0c6ccf;
        padding-right: 5px;
    }

.giangvien-info {
    margin-bottom: 20px;
}

.giangvien-img {
    overflow: hidden;
    -webkit-border-radius: 200px;
    border-radius: 200px;
    text-align: center;
}

/*.content-detail img {
    max-width: 100%;
}*/

.thongke-giangvien {
    text-align: center;
    margin-top: 10px;
}

    .thongke-giangvien strong {
        display: block;
        font-weight: 700;
    }

.name-giangvien-info {
    font-weight: 700;
    color: #52afe2;
    font-size: 18px;
}

.content-giangvien-info {
    margin-top: 10px;
}

.ketnoi-giangvien {
    display: block;
    width: 100%;
    background-color: #52afe2;
    color: #fff;
    padding-top: 8px;
    padding-bottom: 8px;
    text-align: center;
    font-size: 14px;
    font-weight: 700;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    margin-top: 10px;
}

.box-reg-khoahoc {
    border: 0.5px solid #d7d7d7;
    border-radius: 5px;
    background: #fff;
    top: -187px;
    position: relative;
}

.info-course-detail {
    padding: 20px 15px 5px 15px;
}

.price-box-theme strong {
    font-size: 30px;
    color: black;
    font-weight: 700;
    /*text-transform: uppercase;*/
    padding-right: 15px;
}

    .price-box-theme strong sup {
        text-transform: none;
    }

.price-box-theme del {
    color: #909090;
}

.reg-now {
    background-color: #ed1c24;
    display: inline-block;
    padding: 15px 20px;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
    text-align: center;
    margin-top: 10px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    width: 100%;
    color: #fff;
}

.add-cart {
    background-color: #1e264a;
}

.intro-box-reg {
    display: block;
    margin-top: 10px;
    margin-bottom: 10px;
}

.thongke-box-reg {
    color: #414042;
    margin-top: 10px;
}

    .thongke-box-reg div {
        line-height: 30px;
        background-repeat: no-repeat;
        background-position: center left;
    }

.ib-block-info-course .col-sm-9 {
    float: left;
}

.content-course-cate .price-course-of-cate, .img-course {
    padding: 0;
}

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

#wrap-cart {
    min-height: 650px;
}

.img-cart {
    width: 100%;
    height: 70px;
}

.block-img-cart {
    margin-right: 10px;
}

.course_name_cart {
    font-weight: bold;
    color: #000;
    font-size: 16px;
    margin-top: 0;
}

.total-cart, .title-total-cart {
    font-weight: bold;
}

.block-empty-cart {
    margin: 40px 0;
    font-size: 20px;
}

    .block-empty-cart i {
        font-size: 120px;
        color: #ccc;
    }

.table-responsive .block-empty-cart a {
    color: #fff !important;
}

.img-teacher-theme {
    width: 30px;
    height: 30px;
    margin-right: 5px;
}

.block-teacher-theme {
    margin-right: 30px;
}

    .block-teacher-theme a {
        color: #fff;
    }

.block-review-theme .start-rate1 {
    margin-right: 5px;
}

.block-count-student-theme {
    margin-top: 22px;
}

    .block-count-student-theme span {
        margin: 0px 40px;
    }

.block-cart {
    background: rgb(232, 232, 232);
}

.block-title-cart {
    background: #1d9fc7;
}

    .block-title-cart h4 {
        padding: 35px 0;
        color: #fff;
        font-size: 30px;
        margin-top: 5px;
    }

.block-data-cart {
    border-bottom: 1px solid #dedfe0;
    padding-bottom: 10px;
    padding-top: 10px;
}

    .block-data-cart .price-sell {
        font-size: 20px;
        font-weight: bold;
    }

.list-price-cart {
    display: flex;
    text-align: right;
}

.block-price-theme {
    width: 80%;
}

.block-remove-cart {
    width: 20%;
    margin-top: 3px;
}

    .block-remove-cart a {
        color: #f00;
        font-size: 16px;
    }

.total-price-cart {
    color: #ec5252;
    font-size: 26px;
    font-weight: bold;
    margin-bottom: 10px;
}

    .total-price-cart sup {
        font-size: 14px;
    }

.btn-pay-cart {
    color: #fff;
    background: #ec5252;
    padding: 10px 20px;
    font-weight: bold;
    text-transform: uppercase;
}

    .btn-pay-cart:hover {
        color: #fff;
    }

.block-info-cart {
    margin-top: 15px;
}

.col-cart {
    border: 1px solid #ddd;
}

.add-more-cart {
    padding: 10px 20px;
    width: 30%;
    margin-top: 20px;
}

.box-reg-khoahoc-mobile {
    display: none;
}

@media handheld, only screen and (max-width: 768px) {
    .title-time-lesson {
        float: none !important;
        padding-left: 0px;
    }

    .hd-cp .btn-link {
        white-space: unset;
        padding: 0;
        text-align: justify;
    }

    .block-data-cart .price-sell {
        font-size: 18px;
    }

    .add-more-cart {
        width: 100%;
    }

    .box-reg-khoahoc-mobile {
        display: block;
        border: 1px solid #d7d7d7;
        border-radius: 5px;
        margin-bottom: 10px;
        margin-top: 10px;
    }

    .info_course_of_cate {
        padding-left: 0px;
        padding-bottom: 10px;
    }
}

.hd-cp .btn-link {
    text-decoration: none;
    white-space: normal !important;
    text-align: left !important;
    font-weight: bold;
    color: #3D3D3D;
    max-width: 77%;
}

@media handheld, only screen and (max-width: 579px) {
    .title-time-lesson {
        float: none !important;
    }

    .hd-cp .btn-link {
        white-space: unset;
        padding: 0;
        text-align: justify;
    }

    .block-data-cart .price-sell {
        font-size: 18px;
    }

    .add-more-cart {
        width: 100%;
    }

    .col-cart {
        border: 0;
    }

    .block-teacher-theme {
        float: none;
        margin-bottom: 10px;
    }

    .block-count-student-theme {
        float: left;
        margin-top: 3px;
    }

        .block-count-student-theme span {
            margin: 0 20px;
        }

    .name-giangvien-info {
        text-align: center;
    }

    .price-sell, .block-price-theme del {
        float: left;
    }

    .block-price-theme del {
        margin-left: 15px;
    }

    .box-reg-khoahoc {
        top: unset;
        margin-top: 5px;
    }

    .info-course-detail {
        padding: 20px 15px 15px 15px;
    }

    .hidden-xs {
        display: none !important;
    }
}

@media handheld, only screen and (max-width: 320px) {
    .trial-lesson {
        width: 485px;
    }
}

.discount-price {
    font-size: 14px;
    background: #f26c4f;
    padding: 5px;
    color: #fff;
    display: inline-block;
    float: right;
    margin-top: 10px;
}

.block-share {
    text-align: center;
    border-top: 1px solid #ccc;
    padding-top: 10px;
    display: inline-block;
    width: 100%;
    margin-top: 10px;
}

.box-content iframe {
    width: 100% !important;
}

.tab-detail {
    width: 100%;
    background: #fff;
    display: inline-block;
    margin-top: 10px;
    border: 1px solid #d7d7d7;
    border-radius: 3px;
}

    .tab-detail ul {
        width: 100%;
        margin: 0;
        display: flex;
    }

    .tab-detail li:hover {
        background: #ccc;
    }

    .tab-detail li {
        float: left;
        padding: 15px 24px;
        list-style: none;
    }

        .tab-detail li a {
            color: #333;
        }

.video-box .embed-responsives.embed-responsive-16by9 {
    padding-bottom: 56.25%;
}

.time-uudai {
    text-align: left;
    display: inline-block;
    width: 100%;
    color: #04620f;
    font-weight: bold;
    margin: 10px 0;
}

.percent_off_label {
    position: absolute;
    margin: 10px;
    color: #fff;
    background-color: red;
    border-radius: 5px;
    display: inline-block;
}

.percent_off_strong {
    margin: 0 5px;
    color: white;
}

.btn-cart-add {
    text-align: center;
    margin-top: 20px;
}

    .btn-cart-add a {
        background: #007bff;
        padding: 5px 10px;
        border-radius: 3px;
        color: #fff !important;
        transition: 0.5s;
        font-size: 14px;
    }

        .btn-cart-add a:hover {
            background: #034d9c;
        }

.btn-cart-mbs {
    text-align: center;
    margin-top: 15px;
}

    .btn-cart-mbs a {
        background: #007bff;
        padding: 5px 10px;
        border-radius: 3px;
        color: #fff !important;
        transition: 0.5s;
        font-size: 14px;
    }

        .btn-cart-mbs a:hover {
            background: #034d9c;
        }

.label-livestream-coures-relate {
    position: absolute;
    padding: 3px;
    right: 5px;
    top: 0;
    font-size: 14px;
    text-transform: uppercase;
    height: 15px;
    line-height: 15px;
    display: inline-block;
    vertical-align: middle;
    color: #d9534f;
}

    .label-livestream-coures-relate:before {
        -webkit-border-radius: 50%;
        border-radius: 50%;
        display: block;
        position: relative;
        width: 15px;
        height: 15px;
        content: '';
        margin-right: 5px;
        vertical-align: initial;
        -webkit-animation: live-pulse 1s infinite;
        -moz-animation: live-pulse 1s infinite;
        -o-animation: live-pulse 1s infinite;
        animation: live-pulse 1s infinite;
        float: left;
    }

@-webkit-keyframes live-pulse {
    0% {
        background-color: #e78dac
    }

    50% {
        background-color: white
    }

    100% {
        background-color: #d9534f
    }
}

@-moz-keyframes live-pulse {
    0% {
        background-color: #d9534f
    }

    50% {
        background-color: white
    }

    100% {
        background-color: #d9534f
    }
}

@keyframes live-pulse {
    0% {
        background-color: #d9534f
    }

    50% {
        background-color: white
    }

    100% {
        background-color: #d9534f
    }
}

.fa-star {
    color: #f18904c9;
}

.col-md-9 {
    float: left;
}

.content-course-cate .desc-course span {
    margin-right: 10px !important;
    margin-left: 5px !important;
}

.rating-student-right .u-rate-f1-star {
    float: left;
    text-align: center;
    padding: 0 15px;
}

.block-rating {
    display: inline-flex;
}

@media screen and (max-width: 1024px) {
    .rating-student-right .u-rate-f1-star {
        padding: 0 5px 0 15px;
    }
}

@media screen and (max-width: 824px) {
    .rating-student-right .u-rate-f1-star {
        padding: 0 15px;
    }

    .col-sm-3 {
        padding: 0;
    }

    .rating_course .fa-star {
        width: 15px;
    }

    .block-rating {
        display: unset !important;
    }

    .rating_course {
        float: left;
    }

    .u-rate-f1-progress {
        max-width: 100%;
        width: 100% !important;
    }

    .rating-student-right {
        float: none;
    }

    .ava-hv {
        width: 30%;
    }
}

@media screen and (min-width: 768px) {
    .desc-course {
        margin-top: 0px !important;
    }
}

@media screen and (max-width: 599px) {
    .label-livestream-coures-relate {
        font-size: 14px;
    }

        .label-livestream-coures-relate:before {
            width: 15px;
            height: 15px;
        }

    .block-rating {
        display: inline-flex;
    }

    .desc-course {
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .u-rate-f1-progress {
        width: 100%;
    }

    .rating-student-right {
        float: none;
    }

    .ava-hv {
        width: 30%;
    }
}

@media screen and (max-width: 450px) {
    .content-course-cate .price-course-of-cate {
        margin-top: 10px;
        float: left;
    }

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

    .u-rate-f1-progress {
        width: 100%;
        margin-top: 10px;
    }

    .rating-student-right {
        float: none;
    }

    .ava-hv {
        width: 30%;
    }

    .rating-student-left {
        width: 100%;
    }
}

.content-course-cate {
    margin-top: 23px !important;
    padding: inherit !important;
}

.course-item .rota-top-left {
    top: unset !important;
    left: unset !important;
    bottom: 20px;
    right: 20px;
}

.course-tag .rota-top-left {
    bottom: 15px;
}

.rota span {
    font-size: 9px;
    box-shadow: none;
}

.rota {
    width: 80px;
    height: 80px;
}

.course-item .rota-top-left::before, .course-item .rota-top-left::after {
    top: -4px;
    right: 10px;
    display: none;
}

.course-item .rota-top-left span {
    right: -35px;
    top: 0px;
    transform: unset !important;
}

.content-course-cate .rota-top-left {
    top: -6px;
    left: -5px;
}

.price-a {
    font-size: 30px;
    color: black;
    font-weight: 700;
    margin-bottom: 5px;
}

.price-d {
    text-decoration: line-through;
    margin: 0;
}

.price-c {
    font-size: 14px;
    background: #f26c4f;
    padding: 5px;
    color: #fff;
    display: inline-block;
    margin-top: 10px;
    margin-left: 10px;
}

.btn-cart-mbs a {
    background: #ed1c24 !important;
    padding: 10px !important;
}

.item-type-sell .lbl-type-sell {
    font-size: 18px;
}

.slick-slide .course-section .rota-top-left {
    top: unset !important;
    left: unset !important;
    right: 10px;
    bottom: 25px;
}

.course-item .course-item-detail h3.title {
    margin-bottom: 25px !important;
}

.text-red {
    color: red;
}

.course-item-detail-combo .price-box p {
    margin-bottom: 0px;
}

.course-item-detail-course h3, .course-item-detail-combo h3 {
    height: 3rem;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    display: -webkit-box !important;
    -webkit-box-orient: vertical;
    min-height: unset !important;
}

.btn-ss-header-search {
    width: 5%;
}

.slider-teacher .giangvien-img img {
    width: 85px;
    height: 85px;
}

@media (min-width: 320px) and (max-width: 736px) {
    .content-khoahoc-top h1 {
        font-size: 30px;
    }
}

/*css detail khóa học*/
#rating img {
    margin-bottom: 3px;
}

#rating {
    padding-left: 20px;
}

.choice_class_uni_search:hover {
    color: #fff;
    background-color: #af090f;
}

.add-cart:hover {
    background-color: #08113c;
}

/* style inline detail_course */
.style_rate_profile_teacher_uni_search {
    padding-top: 2px !important;
}

.lesson_detail_course_uni_search {
    padding-left: 10px;
}

.button_join_course_detail_uni_search {
    margin-top: 10px !important;
}

.choice_class_uni_search {
    width: 100% !important;
    color: #fff !important;
}

.title_join_free_course_uni_search {
    font-size: 30px !important;
    text-transform: uppercase !important;
}

.br_class_course {
    display: none;
}

@media handheld, only screen and (max-width: 768px) {
    .br_class_course {
        display: block;
    }

    #rating {
        padding-left: 0;
    }
}
/* style inline detail_course */

.mbs-block-youtube .embed-responsive-item {
    height: unset;
    aspect-ratio: 2/1;
}

.mbs-block-youtube .embed-responsive {
    padding-bottom: 0% !important;
}


.btn:not(:disabled):not(.disabled) {
    cursor: pointer;
}

.btn-link {
    font-weight: 400;
    color: #007bff;
    background-color: transparent;
}

.btn {
    display: inline-block;
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid transparent;
    padding: .375rem .75rem;
    font-size: 16px;
    line-height: 1.5;
    border-radius: .25rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    font-weight: 600 !important;
}

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