﻿html {
    scroll-behavior: smooth;
}

.top_cart_qty {
    background-image: linear-gradient(to right, #fed80d, #ffc102, #feaa0a, #fa9316, #f37c21);
    color: white;
    width: 35px;
    height: 35px;
    position: absolute;
    display: block;
    border-radius: 50%;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    top: -15px;
    right: -23px;
}

.cartHead a {
    position: relative;
}
body #fwrp{    overflow: hidden;}
.flex-row {
    /*    -js-display: flex;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%;*/
}

.dflex {
    display: flex;
}

.align-items-center {
    align-items: center;
}


.header {
}

.headerMain {
    padding: 13px 0;
}

.logo {
    margin-right: 145px;
}

    .logo a {
    }

    .logo img {
    }

.grHead {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -ms-flex-negative: 1;
    -ms-flex-preferred-size: auto !important;
    display: flex;
    gap: 15px;
}

.grProB3 {
    background-image: radial-gradient(circle, #f8c52a, #f9b220, #f89e1b, #f68a1c, #f27620) !important;
    color: #fff;
    width: 100%;
    font-size: 18px;
}

.menuMain {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -ms-flex-negative: 1;
    -ms-flex-preferred-size: auto !important;
}

    .menuMain ul {
        list-style: none;
        margin: 0;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        padding: 0;
        gap: 0px;
        display: flex;
    }

        .menuMain ul > li {
            display: inline-block;
            list-style: none;
            margin: 0;
            padding: 0;
            position: relative;
            -webkit-transition: background-color .3s;
            -o-transition: background-color .3s;
            transition: background-color .3s;
        }

            .menuMain ul > li > a {
                padding: 3px;
                border-radius: 40px;
                overflow: hidden;
                font-family: 'RobotoMono-Bold';
                display: flex;
                align-items: center;
            }

                .menuMain ul > li > a > span {
                    padding: 11px 16px;
                    display: block;
                    border-radius: 30px;
                    overflow: hidden;
                    font-weight: 700;
                    color: #5F5050;
                    font-size: 16px;
                }

                .menuMain ul > li > a:hover {
                    background-image: radial-gradient(circle, #f8c52a, #f9b220, #f89e1b, #f68a1c, #f27620);
                }

                    .menuMain ul > li > a:hover > span {
                        background-image: linear-gradient(to right, #fed80d, #ffc102, #feaa0a, #fa9316, #f37c21);
                        color: white;
                    }

.userGr {
    display: flex;
    gap: 14px;
    padding-right: 10px;
    position: relative;
}

.userGrBtn {
    padding: 13px 31px;
    background: #E3E3E3;
    border-radius: 30px;
    color: black;
    font-family: 'RobotoMono-Bold';
    display: flex;
    align-items: center;
    text-decoration: none;
    cursor: pointer;
}

    .userGrBtn:hover {
        background-image: linear-gradient(to right, #fed80d, #ffc102, #feaa0a, #fa9316, #f37c21);
    }

    .userGrBtn span {
    }

.btnLogin {
}

.btnRegister {
}

    .btnregister span {
        padding: 11px 0px;
        display: block;
        border-radius: 30px;
        overflow: hidden;
        font-weight: 700;
        font-size: 16px;
        background-image: linear-gradient(to right, #fed80d, #ffc102, #feaa0a, #fa9316, #f37c21);
        color: black;
    }

.cartHead {
    display: flex;
    align-items: center;
}

    .cartHead img {
    }

.fitHeading {
    text-align: center;
    color: #000000;
    font-size: 44px;
    font-family: 'Kimberley';
    margin-bottom: 15px;
}

    .fitHeading span {
        color: #F27620;
    }

.defaultLine {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
}

    .defaultLine span {
        display: inline-block;
    }

        .defaultLine span:nth-child(1) {
            background: url(../images/lineLeft.png) center center no-repeat;
            width: 140px;
            height: 27px;
        }

        .defaultLine span:nth-child(2) {
            background: url(../images/lineCenter.png) center center no-repeat;
            width: 94px;
            height: 22px;
        }

        .defaultLine span:nth-child(3) {
            background: url(../images/lineright.png) center center no-repeat;
            width: 140px;
            height: 27px;
        }

.stFit {
    padding: 40px 0 60px;
    background: #FFF2E9;
}

.fitList {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 60px 130px;
}

.fitItem {
}

.fitThumb {
    transition-duration: .3s;
    transition: all 300ms;
    max-width: 174px;
}

    .fitThumb img {
        height: 100%;
        width: 100%;
        -o-object-fit: contain;
        object-fit: contain;
        transition-duration: .3s;
        transition: all 300ms;
    }

.fitContent {
    padding-top: 5px;
}

.fitTitle {
    margin-bottom: 5px;
}

    .fitTitle a {
        display: block;
        color: #000000;
        font-size: 1.125em;
        font-family: 'RobotoMono-Bold';
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-line-clamp: 1;
        display: -webkit-box;
        -webkit-box-orient: vertical;
    }

.fitDesc {
    color: #595959;
    text-align: justify;
    font-family: 'RobotoMono-Regular';
    font-size: 0.95em;
    line-height: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 3;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}

.fitItem:hover .fitThumb {
    transform: translate(0, -10px);
}

    .fitItem:hover .fitThumb img {
        /*
        transform: scale(1.05);*/
    }

.fitItem:hover .fitTitle a {
}

.fitBoxHead {
    margin-bottom: 60px;
}

.stND1 {
    background-image: linear-gradient(to right top, #f27620, #f68a1c, #f89e1b, #f9b220, #f8c52a);
    border-radius: 1em;
    /* min-height: 174px; */
    align-items: center;
    display: flex;
    margin-bottom: 60px;
}

.nd1Box {
    display: grid;
    justify-content: center;
    position: relative;
    padding: 17px 0px;
}

.nd1Text1 {
    background-image: linear-gradient(to bottom, #5f5050, #513e3e, #432d2c, #351d1b, #280d06);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 24px;
    font-family: 'Kimberley';
}

.nd1Read {
    text-align: center;
    margin-top: 16px;
}

    .nd1Read a {
        animation: img_main 5s infinite;
        padding: 3px;
        border-radius: 40px;
        overflow: hidden;
        font-family: 'RobotoMono-Bold';
        display: block;
        align-items: center;
        background-image: radial-gradient(circle, #f8c52a, #f9b220, #f89e1b, #f68a1c, #f27620);
        max-width: 179px;
        margin: auto;
        position: relative;
    }

        .nd1Read a span {
            padding: 11px 0px;
            display: block;
            border-radius: 30px;
            overflow: hidden;
            font-weight: 700;
            font-size: 16px;
            background-image: linear-gradient(to right, #fed80d, #ffc102, #feaa0a, #fa9316, #f37c21);
            color: white;
        }

.stND1:hover .nd1Text1 {
}

.stND1:hover .nd1Read {
}

    .stND1:hover .nd1Read a {
    }

.header {
}

.stPro1 {
    padding: 233px 0 186px;
    background: url(../images/bg1.png) no-repeat;
    background-size: cover;
}

.pro1Box {
    margin-bottom: 40px;
}

.pro1Heading {
    background-image: linear-gradient(to bottom, #5f5050, #513e3e, #432d2c, #351d1b, #280d06);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 40px;
    font-family: 'Kimberley';
    text-align: center;
    margin-bottom: 25px;
}

.pro1List {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 30px;
}

.pro1Item {
    text-align: center;
    padding: 10px;
}

.pro1Thumb {
    margin: 0 auto;
    margin-bottom: 20px;
    width: 129px;
    height: 129px;
    display: block;
    position: relative;
}

    .pro1Thumb img {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }

.pro1Content {
}

.pro1Title {
    margin-bottom: 15px;
}

    .pro1Title a {
        color: #000000;
        line-height: normal;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-line-clamp: 2;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        font-family: 'Kimberley';
        font-size: 20px;
        height: 60px;
    }

.pro1Desc {
    background: #FFE1D0;
    border-radius: 1em;
    position: relative;
    padding: 30px 29px;
}

.pro1DescText {
    text-align: justify;
    font-family: 'RobotoMono-Regular';
    color: #595959;
    font-size: 15px;
    margin-bottom: 34px;
    line-height: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 3;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}

.pro1Read {
}

    .pro1Read a {
        /* animation: img_main 5s infinite; */
        padding: 3px;
        border-radius: 40px;
        overflow: hidden;
        font-family: 'RobotoMono-Bold';
        display: block;
        align-items: center;
        background-image: radial-gradient(circle, #f8c52a, #f9b220, #f89e1b, #f68a1c, #f27620);
        background-image: linear-gradient(to right top, #5f5050, #513e3e, #432d2c, #351d1b, #280d06);
        max-width: 179px;
        margin: auto;
        position: relative;
    }

        .pro1Read a span {
            padding: 11px 0;
            display: block;
            border-radius: 30px;
            overflow: hidden;
            font-weight: 700;
            font-size: 16px;
            background-image: linear-gradient(to right top, #280d06, #351d1b, #432d2c, #513e3e, #5f5050);
            color: white;
        }

.pro1Desc:after {
    content: "";
    position: absolute;
    width: 303px;
    height: 7px;
    background: #52403E;
    border-radius: 10px;
    left: 0;
    right: 0;
    bottom: -3px;
    margin: auto;
}

.pro1Item:hover .pro1Title a {
    color: #F27620;
}

.pro1Item:hover .pro1Thumb {
    animation: img_main 5s infinite;
}

    .pro1Item:hover .pro1Thumb img {
    }


.pro1Item:hover .pro1Read a {
    background-image: radial-gradient(circle, #f8c52a, #f9b220, #f89e1b, #f68a1c, #f27620);
}

    .pro1Item:hover .pro1Read a span {
        background-image: linear-gradient(to right, #fed80d, #ffc102, #feaa0a, #fa9316, #f37c21);
    }

.stPers {
    background: url(../images/bg2.png) no-repeat;
    background-size: cover;
    padding: 220px 0 395px;
    height: auto;
    position: relative;
}

.persBox {
    margin-bottom: 94px;
}

.persHeading {
    color: white;
    font-size: 40px;
    font-family: 'Kimberley';
    text-align: center;
}

.persItem {
    padding: 30px;
    background: white;
    border-radius: 1em;
}

.persThumb {
    height: 180px;
    width: 100%;
    overflow: hidden;
    border-radius: .8em;
}

    .persThumb img {
        height: 100%;
        object-fit: cover;
    }

.persContent {
}

.persTitle {
    font-size: 20px;
    color: #000000;
    text-align: center;
    font-family: 'Kimberley';
    margin: 15px 0;
}

.persDesc {
    font-size: 14px;
    color: #595959;
    font-family: 'RobotoMono-Regular';
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 4;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}

.persList .persOwl .owl-item {
    opacity: 0.5;
}

    .persList .persOwl .owl-item.active.center {
        opacity: 1;
    }

.persList .persOwl .owl-nav {
}

    .persList .persOwl .owl-nav button {
        text-indent: -999px;
        overflow: hidden;
        width: 62px;
        height: 62px;
        position: absolute;
        top: 45%;
    }

    .persList .persOwl .owl-nav .owl-prev {
        background: url(../images/arLeft1.png) no-repeat;
        left: -31px;
    }

    .persList .persOwl .owl-nav .owl-next {
        background: url(../images/arRight1.png) no-repeat;
        right: -31px;
    }

    .persList .persOwl .owl-nav .owl-prev span {
    }

    .persList .persOwl .owl-nav .owl-next span {
    }

.stAchi {
    transform: translate(0, -60px);
    padding: 0 0 111px 0;
}

.achiBox {
}

.achiHeading {
    background-image: linear-gradient(to bottom, #5f5050, #513e3e, #432d2c, #351d1b, #280d06);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 40px;
    font-family: 'Kimberley';
    text-align: center;
    margin-bottom: 50px;
}

.achiList {
    grid-gap: 30px;
    justify-items: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.achiItem {
    padding: 30px 35px;
    background: #FFE1D0;
    border-radius: 1em;
    flex: 0 0 calc(33.33333% - 30px);
}

.achiContent {
}

.achiTitle {
    font-size: 20px;
    color: #000000;
    text-align: left;
    font-family: 'Kimberley';
    margin: 0 0 20px 0;
    height: 60px;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}

.achiDescription {
    font-size: 14px;
    color: #595959;
    font-family: 'RobotoMono-Regular';
    text-align: justify;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 5;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    height: 105px;
    margin-bottom: 30px;
}

.achiRead {
}

    .achiRead a {
        font-size: 14px;
        color: #000000;
        text-align: left;
        font-family: 'Kimberley';
    }

.achiList .achiItem:nth-child(1) {
}

.achiList .achiItem:nth-child(2) {
    background: #FFF5D0;
}

.achiList .achiItem:nth-child(3) {
    background: #FFF6E8;
}

.achiList .achiItem:nth-child(4) {
    background: #E8FFED;
}

.achiList .achiItem:nth-child(5) {
    background: #F4F7FF;
}

.stFeel {
    background: #FFF7F2;
    padding: 55px 0 90px;
}

.feelBox {
}

.feelHeading1 {
    color: #595959;
    font-size: 24px;
    font-family: 'Kimberley';
    text-align: left;
}

.feelHeading2 {
    font-size: 40px;
    font-family: 'Kimberley';
    margin-bottom: 50px;
}

    .feelHeading2 span:first-child {
        background-image: linear-gradient(to bottom, #5f5050, #513e3e, #432d2c, #351d1b, #280d06);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    .feelHeading2 span:last-child {
        color: #F27620;
    }

.feelItem {
    display: flex;
    padding: 13px;
    background: white;
    border-radius: 1em;
    gap: 20px;
    align-items: center;
}

.feelThumb {
    max-width: 158px;
    height: 205px;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    margin-bottom: 0;
    overflow: hidden;
    border-radius: 0.5em;
}

    .feelThumb img {
        height: 100%;
        object-fit: cover;
    }

.feelContent {
}

.feelTitle {
    color: #000000;
    font-size: 1.125em;
    font-family: 'Kimberley';
    text-align: left;
    margin-bottom: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}

.feelDescription {
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 4;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    color: #595959;
    font-family: 'RobotoMono-Regular';
    font-size: 14px;
    text-align: justify;
}

.feelIbox {
}

.feelIStar {
    max-width: 177px;
}

    .feelIStar span {
        height: 28px;
        background: url(../images/5star.png) no-repeat;
        margin-bottom: 5px;
        overflow: hidden;
        display: inline-block;
    }

.feelList .feelOwl .owl-nav {
}

    .feelList .feelOwl .owl-nav button {
        text-indent: -999px;
        overflow: hidden;
        width: 62px;
        height: 62px;
        position: absolute;
        top: 45%;
    }

    .feelList .feelOwl .owl-nav .owl-prev {
        background: url(../images/arLeft1.png) no-repeat;
        left: -31px;
    }

    .feelList .feelOwl .owl-nav .owl-next {
        background: url(../images/arRight1.png) no-repeat;
        right: -31px;
    }

    .feelList .feelOwl .owl-nav .owl-prev span {
    }

    .feelList .feelOwl .owl-nav .owl-next span {
    }

.stAbout {
    padding: 138px 0;
}

.aboutList {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 63px;
}

.aboutThumb {
}

    .aboutThumb img {
        max-width: 100%;
    }

.aboutContent {
    padding-top: 20px;
}

.aboutInfo {
}

    .aboutInfo h2 {
        font-size: 40px;
        font-family: 'Kimberley';
        margin-bottom: 20px;
    }

        .aboutInfo h2 span:first-child {
            color: #F27620;
        }

        .aboutInfo h2 span:last-child {
            background-image: linear-gradient(to bottom, #5f5050, #513e3e, #432d2c, #351d1b, #280d06);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }

    .aboutInfo p {
        font-size: 16px;
        color: #595959;
        font-family: 'RobotoMono-Regular';
        text-align: justify;
    }

.aboutRead {
    margin-top: 20px;
}

    .aboutRead a {
        /* animation: img_main 5s infinite; */
        padding: 3px;
        border-radius: 40px;
        overflow: hidden;
        font-family: 'RobotoMono-Bold';
        display: block;
        align-items: center;
        background-image: radial-gradient(circle, #f8c52a, #f9b220, #f89e1b, #f68a1c, #f27620);
        max-width: 179px;
        /* margin: auto; */
        position: relative;
    }

        .aboutRead a span {
            padding: 11px 0px;
            display: block;
            border-radius: 30px;
            overflow: hidden;
            font-weight: 700;
            font-size: 16px;
            background-image: linear-gradient(to right, #fed80d, #ffc102, #feaa0a, #fa9316, #f37c21);
            color: white;
            text-align: center;
        }

.aboutInfo .title {
    font-size: 24px;
    color: #595959;
    font-family: 'RobotoMono-Bold';
}

.stForm {
    padding: 132px 0 44px;
}

.formList {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
}

.formInfo {
    padding: 60px 67px;
    background: rgb(255 241 233 / 80%);
    border-radius: 1em;
    /* overflow: hidden; */
    flex: 0 0 calc(100% - 483px - 30px );
    position: relative;
}

    .formInfo h3 {
        color: #595959;
        font-family: 'RobotoMono-Bold';
        font-size: 24px;
    }

    .formInfo h4 {
        font-size: 40px;
        font-family: 'Kimberley';
        margin-bottom: 20px;
        color: #F27620;
    }

.formVideoBox {
    flex: 0 0 483px;
}

.formVideo {
    overflow: hidden;
    border-radius: 1em;
    position: relative;
    height: 100%;
}

    .formVideo img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .formVideo a {
        content: "";
        position: absolute;
        width: 123px;
        height: 123px;
        background: url(../images/btnplayVideo.png) no-repeat;
        border-radius: 50%;
        left: 0;
        right: 0;
        bottom: 0;
        top: 0;
        margin: auto;
    }

.formInfoBox {
    margin-top: 28px;
}

    .formInfoBox input {
        padding: 25px 40px;
        background: #FFE6CF;
        border: none;
        width: 100%;
        margin-bottom: 15px;
        border-radius: 1em;
        overflow: hidden;
    }

.formInfoBoxSubmit {
    margin-top: 27px;
}

    .formInfoBoxSubmit a {
        padding: 3px;
        border-radius: 40px;
        overflow: hidden;
        font-family: 'RobotoMono-Bold';
        display: block;
        align-items: center;
        background-image: radial-gradient(circle, #f8c52a, #f9b220, #f89e1b, #f68a1c, #f27620);
        max-width: 179px;
        margin: auto;
        position: relative;
    }

        .formInfoBoxSubmit a span {
            padding: 11px 0px;
            display: block;
            border-radius: 30px;
            overflow: hidden;
            font-weight: 700;
            font-size: 16px;
            background-image: linear-gradient(to right, #fed80d, #ffc102, #feaa0a, #fa9316, #f37c21);
            color: white;
            text-align: center;
        }

.formInfoBox:after {
    content: "";
    position: absolute;
    background: url(../images/i5.png) center center no-repeat;
    width: 209px;
    height: 209px;
    left: -79.5px;
    bottom: -36.5px;
    z-index: -1;
}

.socialList {
    display: flex;
    justify-content: center;
    gap: 30px;
}

.socialItem {
    width: 177px;
    height: 76px;
    overflow: hidden;
    border-radius: 20px;
}

    .socialItem a {
    }

    .socialItem img {
    }

.stSocial {
    padding: 10px 0;
}

.footer {
    background: url(../images/bgfooter.png) no-repeat;
    background-size: cover;
    padding: 225px 0 67px 0;
}

.colInfo {
}

    .colInfo h3 {
        font-size: 22px;
        font-family: 'Kimberley';
        margin-bottom: 20px;
        color: #484848;
        padding-bottom: 25px;
        background: url(../images/lineFooter.png) left bottom no-repeat;
    }

    .colInfo h4 {
        font-size: 20px;
        color: #000000;
        font-family: 'RobotoMono-Bold';
        margin-bottom: 20px;
    }

    .colInfo p {
        font-size: 16px;
        color: #000000;
        font-family: 'RobotoMono-Regular';
        margin-bottom: 15px;
    }

.colList {
}

    .colList h3 {
        font-size: 22px;
        font-family: 'Kimberley';
        margin-bottom: 20px;
        color: #484848;
        padding-bottom: 25px;
        background: url(../images/lineFooter.png) left bottom no-repeat;
    }

    .colList h4 {
        font-size: 20px;
        color: #000000;
        font-family: 'RobotoMono-Bold';
        margin-bottom: 20px;
    }

    .colList ul {
        padding: 0;
        list-style: none;
    }

    .colList li {
        font-size: 16px;
        color: #000000;
        font-family: 'RobotoMono-Regular';
        margin-bottom: 15px;
    }

.colList2 {
}

    .colList2 h3 {
        font-size: 22px;
        font-family: 'Kimberley';
        margin-bottom: 20px;
        color: #484848;
        padding-bottom: 25px;
        background: url(../images/lineFooter.png) left bottom no-repeat;
    }

    .colList2 box {
    }

    .colList2 h4 {
        font-size: 20px;
        color: #000000;
        font-family: 'RobotoMono-Bold';
        margin-bottom: 10px;
    }

    .colList2 p {
        font-size: 14px;
        color: #000000;
        font-family: 'RobotoMono-Regular';
        margin-bottom: 0;
    }

.colftMenu {
}

    .colftMenu h3 {
        font-size: 22px;
        font-family: 'Kimberley';
        margin-bottom: 20px;
        color: #484848;
        padding-bottom: 25px;
        background: url(../images/lineFooter.png) left bottom no-repeat;
    }

    .colftMenu ul {
        padding: 0;
        list-style: none;
    }

        .colftMenu ul li {
            margin-bottom: 13px;
        }

            .colftMenu ul li a {
                display: block;
                font-size: 14px;
                font-family: 'RobotoMono-Regular';
                padding-left: 10px;
                position: relative;
                color: #000000;
            }

                .colftMenu ul li a:hover {
                    color: #F27620;
                }

                .colftMenu ul li a:before {
                    content: "";
                    width: 3px;
                    height: 3px;
                    position: absolute;
                    left: 0;
                    background: black;
                    border-radius: 50%;
                    top: 11px;
                }

.colList2 .box {
    margin-bottom: 14px;
}

.hrLine {
    margin: 32px 0 0px;
    height: 1px;
    background: #000000;
    width: 100%;
    display: block;
}

.cricleK1 {
    position: absolute;
    right: 0;
    background: url(../images/cricle0.png);
    width: 294px;
    height: 520px;
    top: 169px;
    bottom: 0;
    margin: auto;
    z-index: 0;
}

.nd1K1 {
    position: absolute;
    background: url(../images/i1.png);
    width: 142px;
    height: 87px;
    bottom: 0;
    left: -66px;
}

.nd1K2 {
    background: url(../images/i2.png) no-repeat;
    position: absolute;
    width: 91px;
    height: 91px;
    top: 0;
    left: 53px;
}

.nd1K3 {
    background: url(../images/i3.png) no-repeat;
    position: absolute;
    width: 114px;
    height: 67px;
    top: 0;
    right: -66px;
}

.nd1K4 {
    background: url(../images/i4.png) no-repeat;
    position: absolute;
    width: 121px;
    height: 121px;
    bottom: 0;
    right: 53px;
}

.mainSlide {
    position: relative;
}

.content_banner {
    position: absolute;
    bottom: 12%;
    text-align: justify;
    left: 1%;
    font-size: 16px;
    z-index: 99;
}

.mainSlide .content_banner {
    left: unset;
    right: 0;
    bottom: 50%;
    transform: translateY(50%);
    max-width: 60%;
}

    .mainSlide .content_banner .text {
        background-image: linear-gradient(to left, #673C1E, transparent);
        color: #ffffff;
        font-size: 16px;
        padding: 20px 30px;
    }

.pageAbout1 {
    padding: 40px 0;
}

.pAbout1Content {
}

    .pAbout1Content h1 {
        color: #F27620;
        font-size: 44px;
        font-family: 'Kimberley';
        margin-bottom: 15px;
    }

    .pAbout1Content p {
        color: #595959;
        text-align: justify;
        font-family: 'RobotoMono-Regular';
        font-size: 0.95em;
    }

.pAbout1Read {
}

    .pAbout1Read a {
        display: inline-block;
        max-width: 120px;
        width: 100%;
        padding: 0px 0;
        text-align: center;
        border-radius: 0.5em;
        color: white;
        font-size: 0.8em;
        font-family: 'Kimberley';
        height: 30px;
        line-height: 25px;
        background: #f27620;
    }

.pAbout1Iframe {
}

    .pAbout1Iframe iframe {
        width: 100%;
        border: 0;
        max-height: 330px;
        height: 330px;
    }

.logo img {
    width: 100%;
}

.cosoItem {
}

.cosoThumb {
    height: 385px;
}

    .cosoThumb img {
        height: 100%;
        object-fit: cover;
    }

    .cosoThumb:after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(0deg, #0e0e0e 0, transparent);
        pointer-events: none;
        z-index: 9;
    }

.cosoContent {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    /* display: flex; */
    flex-wrap: wrap;
    align-items: center;
    color: #ffffff;
    transition: 0.3s all;
    pointer-events: none;
    z-index: 99;
    padding: 15px 20px;
}

.cosoTitle {
    margin-bottom: 20px;
    font-size: 24px;
    font-family: 'Kimberley';
    display: inline-block;
    padding-bottom: 5px;
    border-bottom: 1px solid;
}

.cosoGroup {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.5s;
    display: block;
}

.cosoField {
    padding-left: 30px;
    margin-bottom: 7px;
    font-size: 0.9em;
    font-family: 'RobotoMono-Regular';
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 3;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}

    .cosoField:nth-child(1) {
        background: url(../images/ics1.png) left center no-repeat;
        background-size: 20px;
    }

    .cosoField:nth-child(2) {
        background: url(../images/ics2.png) left center no-repeat;
        background-size: 16px;
    }

    .cosoField:nth-child(3) {
        background: url(../images/ics3.png) left center no-repeat;
        background-size: 16px;
        margin-bottom: 0;
    }

.cosoHeading {
    font-weight: 500;
    text-align: center;
    padding: 5px 0 0;
    font-size: 24px;
    font-family: 'Kimberley';
}

.cosoBox {
    position: relative;
    border-radius: 18px;
    overflow: hidden;
}

.cosoItem:hover .cosoGroup {
    max-height: 130px;
}

.stCoso {
    padding: 40px 0;
}

.stVisao {
    padding: 70px 0;
    background: url(../images/bgvisao.png) no-repeat;
    background-position: center;
    background-size: cover;
    color: #ffffff;
}

.visaoHeading {
    font-size: 1.8em;
    font-family: 'Kimberley';
    text-align: center;
    color: white;
    text-transform: uppercase;
    margin-bottom: 30px;
}

.visaoItem {
    color: #000000;
    border-radius: 15px;
    background: white;
    padding: 20px;
}

.visaoBox {
    display: flex;
    align-items: center;
    gap: 10px;
    /* border-bottom: 1px solid; */
    padding-bottom: 10px;
    position: relative;
}

.visaoThumb {
    width: 73px;
    height: 73px;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    padding: 5px;
}

    .visaoThumb img {
        height: 100%;
        object-fit: contain;
    }

.stMethod {
    display: none !important
}

.visaoTitle {
    font-size: 1.1em;
    font-family: 'Kimberley';
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    color: #f27620;
    padding-bottom: 10px;
}

.visaoContent {
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 3;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-align: center;
    padding: 0px 0;
    margin-top: 10px;
    font-family: 'RobotoMono-Regular';
    font-size: 0.85em;
    position: relative;
}

.visaoBox:before {
    content: "";
    width: 50%;
    position: absolute;
    background: #707070;
    height: 1px;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

.stGiangVien {
    padding: 40px 0;
    background: #FFF7F2;
    margin-bottom: 40px;
}

.giangvienHeading {
    font-size: 1.8em;
    font-family: 'Kimberley';
    text-align: center;
    color: black;
    text-transform: uppercase;
    margin-bottom: 30px;
}

.giangvienItem {
    padding: 24px 20px;
    background: white;
    border-radius: 1em;
}

.giangvienThumb {
    height: 319px;
    overflow: hidden;
    border-radius: 0.5em;
}

    .giangvienThumb img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.giangvienContent {
    padding: 10px 0 0 0;
    text-align: center;
}

.giangvienTitle {
    font-size: 1.2em;
    font-family: 'Kimberley';
    text-align: center;
}

    .giangvienTitle a {
        color: black;
        cursor: pointer;
    }

.giangvienDesc {
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-align: center;
    padding: 0px 0;
    margin-top: 10px;
    font-family: 'RobotoMono-Regular';
    font-size: 1.0em;
    position: relative;
}

.gvSocial {
    margin =top: 3;
    margin =top: 30;
    margin =top: 30p;
    margin =top: 30px;
    margin =top: 30px;
    display: block;
    margin-top: 25px;
}

    .gvSocial ul {
        margin: 0;
        padding: 0;
        list-style: none;
        display: flex;
        gap: 12px;
        justify-content: center;
    }

        .gvSocial ul li {
        }

            .gvSocial ul li a {
                width: 36px;
                height: 36px;
                display: block;
                cursor: pointer;
            }

            .gvSocial ul li:nth-child(1) a {
                background: url(../images/gvF1.png) center center no-repeat;
            }

            .gvSocial ul li:nth-child(2) a {
                background: url(../images/gvF2.png) center center no-repeat;
            }

            .gvSocial ul li:nth-child(3) a {
                background: url(../images/gvF3.png) center center no-repeat;
            }

            .gvSocial ul li:nth-child(4) a {
                background: url(../images/gvF4.png) center center no-repeat;
            }

.stMethod {
    padding: 40px 0;
}

.methodHeading {
    font-size: 1.8em;
    font-family: 'Kimberley';
    text-align: center;
    color: #F27620;
    text-transform: uppercase;
    margin-bottom: 30px;
}

.methodItem {
    display: flex;
    flex-direction: column;
}

.methodThumb {
    height: 280px;
    overflow: hidden;
    order: 2;
    width: 100%;
}

    .methodThumb img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        < div class="img"><img src="https: //thaki.vn/thumbs/about/2022_05/[381x280-cr]phuongphap.png" alt="Học online theo bộ clips có sẵn"></div>;
        max-width: -moz-fit-content;
        /* max-width: fit-content; */
        overflow: hidden;
    }

.methodContent {
    padding: 20px;
    height: 280px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: #FFF7F2;
    order: 1;
}

.methodTitle {
    font-family: 'Kimberley';
    color: black;
    text-transform: uppercase;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    font-size: 1.2em;
    margin-bottom: 10px;
}

.methodDescription {
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 5;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    padding: 0px 0;
    margin-top: 10px;
    font-family: 'RobotoMono-Regular';
    font-size: 1.0em;
    position: relative;
    text-align: justify;
}

.methodList {
    margin-top: 60px;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    display: grid;
}

.methodItem:nth-child(2n) {
}

    .methodItem:nth-child(2n) .methodThumb {
        order: 1;
    }

    .methodItem:nth-child(2n) .methodContent {
    }

.stCount {
}

.CountBox {
    padding: 45px 15px;
    background: #FFF7F2;
    border-radius: 40px 0 40px 0;
    color: #ffffff;
}

.CountHeading {
    font-size: 1.8em;
    font-family: 'Kimberley';
    text-align: center;
    color: black;
    text-transform: uppercase;
    margin-bottom: 30px;
}

.CountList {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 33px;
}

.CountItem {
    display: flex;
    align-items: start;
    justify-content: center;
    flex-wrap: wrap;
}

.CountThumb {
    width: 66px;
    height: 66px;
}

    .CountThumb img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.CountContent {
    text-align: center;
    padding: 10px 0;
    color: black;
    display: block;
    width: 100%;
}

.CountTitle {
    text-transform: uppercase;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    font-size: 1.8em;
    font-family: 'Kimberley';
    margin: 15px 0;
}

.CountDescription {
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    padding: 0px 0;
    margin-top: 10px;
    font-family: 'RobotoMono-Regular';
    font-size: 0.9em;
    position: relative;
    text-align: center;
}

.CountItem:hover .CountThumb {
}

    .CountItem:hover .CountThumb img {
    }

.CountItem:hover .CountTitle {
}

.stBasic {
    padding: 40px 0;
}

.basicHeading {
    font-size: 1.8em;
    font-family: 'Kimberley';
    text-align: center;
    color: #F27620;
    text-transform: uppercase;
    margin-bottom: 30px;
}

.basicList {
    margin-top: 60px;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    display: grid;
    gap: 24px;
}

.basicItem {
}

.basicThumb {
    height: 280px;
    overflow: hidden;
}

    .basicThumb img {
        transition: 0.5s all;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.basicItem:hover .basicThumb img {
    transform: scale(1.05);
    transition: 0.5s all;
}

.groupwItem {
    display: grid;
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    grid-template-columns: repeat(3, 385px);
    grid-template-rows: repeat(2, 221px);
}

.workHeading {
    font-size: 1.8em;
    font-family: 'Kimberley';
    text-align: center;
    color: #F27620;
    text-transform: uppercase;
    margin-bottom: 30px;
}

.workItem {
    position: relative;
    border-radius: 10px;
    overflow: hidden;
}

.workThumb {
    display: block;
    height: 100%;
}

    .workThumb img {
        border-radius: 10px;
        height: 100%;
        object-fit: cover;
    }

.workItem:first-child {
}

.workItem:first-child {
    grid-column: 1 / span 2;
    grid-row: 1 / span 2;
}

.stWord {
    padding: 40px 0;
}

.pageRegister {
    padding: 40px 0;
    display: flex;
    align-items: center;
    margin-bottom: 70px;
    position: relative;
    background: #f3f3f3 url(../images/bgRegister.png) no-repeat;
    height: 644px;
    background-size: contain;
    background-position: right center;
}

.regisBox {
    display: grid;
    margin-top: 2rem;
}

    .regisBox input {
        width: 100%;
        max-width: 100%;
        height: 43px;
        padding: 0 15px;
        font-size: 18px;
        color: #818181;
        font-weight: 400;
        border: 1px solid #e1e1e1;
        margin-bottom: 15px;
        outline: none;
        border-radius: .5em;
    }

#txtrepass {
}

.regisMes {
}

.regisBox .regisBtn {
    display: inline-block;
    max-width: 120px;
    width: 100%;
    padding: 0px 0;
    text-align: center;
    border-radius: 0.5em;
    color: white;
    font-size: 0.8em;
    font-family: 'Kimberley';
    height: 40px;
    line-height: unset;
    background: #f27620;
}

.regisThumb img {
    max-width: 100px;
}

.box-layout-title {
}

    .box-layout-title h1 {
        color: #F27620;
        font-size: 44px;
        font-family: 'Kimberley';
        margin-bottom: 15px;
    }

    .box-layout-title span {
    }

.loginBox {
    display: grid;
    margin-top: 2rem;
}

    .loginBox input {
        width: 100%;
        max-width: 100%;
        height: 43px;
        padding: 0 15px;
        font-size: 18px;
        font-weight: 400;
        border: 1px solid #e1e1e1;
        margin-bottom: 15px;
        outline: none;
        border-radius: .5em;
    }

    .loginBox .btnPageLogin {
        display: inline-block;
        max-width: 120px;
        width: 100%;
        padding: 0px 0;
        text-align: center;
        border-radius: 0.5em;
        color: white;
        font-size: 0.8em;
        font-family: 'Kimberley';
        height: 40px;
        line-height: unset;
        background: #f27620;
    }

.loginMes {
}

.loginHeading {
}

    .loginHeading h1 {
        color: #F27620;
        font-size: 44px;
        font-family: 'Kimberley';
        margin-bottom: 15px;
    }

    .loginHeading h2 {
        font-size: 2.4em;
        color: #000000;
        font-family: 'RobotoMono-Regular';
        margin-bottom: 15px;
    }

    .loginHeading span {
    }

.btnLoginForget {
    color: #000000;
    position: relative;
    z-index: 1;
    text-align: left;
    margin: 1rem 0;
    max-width: 75%;
}

.header_user {
    padding: 10px 15px;
    background: #FFF2E9;
    font-family: 'Kimberley';
    width: 100%;
    color: #484848;
    border-radius: 5px 5px 0 0;
    font-size: 1.6em;
}

    .header_user i {
        margin-right: 10px;
        font-size: 20px;
    }

.box-layout {
    border-radius: 0 0 5px 5px;
    width: 100%;
    background: white;
    padding: 20px;
    box-shadow: 1px 3px 8px 0.5px rgb(0 0 0 / 15%);
}

    .box-layout .box-layout-content p {
        padding: 5px 0;
    }

    .box-layout .box-layout-content button {
        display: inline-block;
        max-width: 120px;
        width: 100%;
        padding: 0px 0;
        text-align: center;
        border-radius: 0.5em;
        color: white;
        font-size: 0.8em;
        font-family: 'Kimberley';
        height: 40px;
        line-height: unset;
        background: #f27620;
    }

.box-manager {
    padding: 60px 0 65px;
}

.user-form .form-group {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    width: 100%;
}

.box-layout .box-layout-content .user-form .form-group .title {
    margin-bottom: 0;
    margin-right: 15px;
}

#pnforget .btnForget {
    display: inline-block;
    max-width: 120px;
    width: 100%;
    padding: 0px 0;
    text-align: center;
    border-radius: 0.5em;
    color: white;
    font-size: 0.8em;
    font-family: 'Kimberley';
    height: 40px;
    line-height: unset;
    background: #f27620;
    border: none;
}

.pageCrHeading {
    background: #FF9900;
    text-align: center;
    padding: 25px 0 35px;
    font-size: 2.8em;
    font-family: 'Kimberley';
    color: white;
    border-radius: .5em;
    margin: 22px 0 80px;
}

.topCourse {
}

.topCourseHeading {
    background-image: linear-gradient(to right top, #f27620, #f68a1c, #f89e1b, #f9b220, #f8c52a);
    border-radius: 1em;
    align-items: center;
    display: flex;
    min-height: 174px;
    justify-content: center;
    margin-bottom: 64px;
    position: relative;
}

    .topCourseHeading .text {
        background-image: linear-gradient(to bottom, #5f5050, #513e3e, #432d2c, #351d1b, #280d06);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        font-size: 40px;
        font-family: 'Kimberley';
        text-align: center;
        margin-bottom: 25px;
    }

.topCrline1 {
    background: url(../images/topCrline1.png) no-repeat;
    width: 59px;
    height: 87px;
    position: absolute;
    left: 0;
    bottom: 0;
    /* background-size: 20px; */
}

.topCrline2 {
    background: url(../images/topCrline2.png) no-repeat;
    width: 91px;
    height: 91px;
    position: absolute;
    left: 21px;
    top: 0;
}

.topCrline3 {
    background: url(../images/topCrline3.png) no-repeat;
    width: 58px;
    height: 67px;
    position: absolute;
    right: 0;
    top: 0;
}

.topCrline4 {
    background: url(../images/topCrline4.png) no-repeat;
    width: 121px;
    height: 121px;
    position: absolute;
    right: 21px;
    bottom: 0;
}

.pageCrList {
    margin-top: 36px;
}

.asideCategory {
}

.asiCategoryHeading {
    background-image: linear-gradient(to right top, #f27620, #f68a1c, #f89e1b, #f9b220, #f8c52a);
    height: 97px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    /* justify-content: center; */
    position: relative;
    padding: 0 27px;
    margin-bottom: 27px;
}

    .asiCategoryHeading span {
        font-size: 32px;
        font-family: 'Kimberley';
        text-align: center;
        color: black;
        position: relative;
        transform: translate(0, -8px);
    }

        .asiCategoryHeading span:before {
            content: "";
            background: url(../images/iCategory.png) no-repeat;
            width: 44px;
            height: 32px;
            display: inline-block;
            transform: translate(0, 3px);
            margin-right: 29px;
        }

.pageCrName {
    height: 97px;
    display: flex;
    align-items: center;
    background: rgb(89 89 89 / 20%);
    border-radius: 20px;
    padding: 0 63px;
    margin-bottom: 27px;
}

    .pageCrName span {
        font-size: 32px;
        font-family: 'Kimberley';
        text-align: center;
        color: #595959;
        position: relative;
        transform: translate(14px, -8px);
    }

.topCrOwl .pro1Item {
    padding: 0;
}

.pgProItem {
    border: 3px solid #8B8987;
    background: #F5F5F5;
    padding: 15px;
    border-radius: 15px;
    box-shadow: 0px 5px 0px 0px #00000040;
}

.pageCrList .pgProItem {
    margin-bottom: 30px;
}

.pgProThumb {
    border-radius: 15px;
    overflow: hidden;
    height: 145px;
    margin-bottom: 25px;
}

    .pgProThumb img {
        object-fit: cover;
        width: 100%;
        height: 100%;
    }

.pgProContent {
}

.pgProTitle {
    margin-bottom: 5px;
}

    .pgProTitle a {
        background-image: linear-gradient(to bottom, #5f5050, #513e3e, #432d2c, #351d1b, #280d06);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        font-size: 16px;
        font-family: 'RobotoMono-Bold';
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-line-clamp: 1;
        display: -webkit-box;
        -webkit-box-orient: vertical;
    }

.pgProDescription {
    font-family: 'RobotoMono-Regular';
    color: #595959;
    font-size: 16px;
    margin-bottom: 32px;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    height: 48px;
}

.pgProStar {
    max-width: 129px;
    display: block;
    flex: 1;
}

    .pgProStar span {
        height: 22px;
        background: url(../images/iStarPro.png) no-repeat;
        overflow: hidden;
        display: block;
    }

.pgProGrPrice {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 60px;
}

.pgProPrice {
}

.newPrice {
    font-size: 24px;
    color: #F27620;
    font-family: 'RobotoMono-Bold';
}

.oldPrice {
    font-size: 16px;
    color: #958F8F;
    font-family: 'RobotoMono-Regular';
text-decoration: line-through;
}

.pgAddToCart {
}

    .pgAddToCart a {
        width: 56px;
        height: 56px;
        background: url(../images/iAddToCart.png) #E9E9E9 center center no-repeat;
        border-radius: 50%;
        display: block;
        cursor: pointer;
    }

.pgProGrStar {
    display: flex;
    gap: 5px;
    align-items: center;
    margin-bottom: 5px;
}

.pgProCounter {
}

    .pgProCounter span {
        font-size: 16px;
        color: #595959;
        font-family: 'RobotoMono-Regular';
    }

.pgProItem:hover .pgProThumb {
}

    .pgProItem:hover .pgProThumb img {
    }

.pgProItem:hover {
}

.asidePrMenu {
}

.asidePrMenu {
    list-style: none;
    padding: 0;
}

    .asidePrMenu li {
        margin-bottom: 10px;
    }

        .asidePrMenu li a {
            background: #FFE1D0;
            padding: 11px 14px;
            border-radius: 12px;
            gap: 19px;
            display: flex;
            align-items: center;
            position: relative;
        }

            .asidePrMenu li a span {
                color: #000000;
                font-family: 'RobotoMono-Bold';
                font-size: 20px;
            }

            .asidePrMenu li a img {
            }

    .asidePrMenu > li > a:before {
        content: "";
        width: 20px;
        height: 5px;
        background: url(../images/iMenuMinus.png);
        right: 12px;
        position: absolute;
        top: 0;
        bottom: 0;
        margin: auto;
    }

    .asidePrMenu .prSubMenu {
        padding: 0;
        list-style: none;
    }

        .asidePrMenu .prSubMenu li {
            margin-top: 9px;
        }

            .asidePrMenu .prSubMenu li a {
                background: #EEEEEE;
                padding: 11px 26px;
                color: #595959;
                font-size: 20px;
                font-family: 'RobotoMono-Bold';
            }

            .asidePrMenu .prSubMenu li.active a {
                background-image: linear-gradient(to right, #f27620, #f98e14, #fea706, #ffbf00, #fed80d);
            }


            .asidePrMenu .prSubMenu li a:before {
                content: "";
                background: url(../images/iMenuArrowBlack.png);
                width: 17px;
                height: 19px;
                position: absolute;
                right: 15px;
            }

            .asidePrMenu .prSubMenu li.active a:before {
                content: "";
                background: url(../images/iMenuArrowWhite.png);
            }

            .asidePrMenu .prSubMenu li.active a span {
                color: white;
            }

.stTeacher {
    margin-top: 40px;
    padding: 40px 0;
    background: #F8F8F8;
}

.terBoxHeaing {
}

.terHeading {
    background-image: linear-gradient(to bottom, #5f5050, #513e3e, #432d2c, #351d1b, #280d06);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 40px;
    font-family: 'Kimberley';
    text-align: center;
    margin-bottom: 25px;
}

.terOwlItem {
    margin-top: 20px;
}

.terBox1owl {
    display: flex;
    gap: 60px;
    align-items: center;
}

.terBox1owlThumb {
    width: 376px;
    height: 450px;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    overflow: hidden;
    border-radius: 20px;
}

    .terBox1owlThumb img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.terBox1owlContent {
}

.terBox1owlSubTitle {
    font-size: 24px;
    color: #595959;
    font-family: 'RobotoMono-Bold';
    margin-bottom: -10px;
}

.terBox1owlTitle {
    font-size: 64px;
    color: #F27620;
    font-family: 'Kimberley';
    margin-bottom: 25px;
}

.terBox1owlDescription {
    font-size: 18px;
    color: #595959;
    font-family: 'RobotoMono-Regular';
    text-align: justify;
}

.terBox2owl {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    margin-top: 40px;
    grid-gap: 30px;
}

    .terBox2owl .box {
        /* height: 388px; */
        padding: 20px;
        border-radius: 20px;
    }

        .terBox2owl .box .title {
            font-size: 24px;
            color: #000000;
            font-family: 'Kimberley';
            margin-bottom: 25px;
        }

        .terBox2owl .box p {
            font-size: 16px;
            color: #595959;
            text-align: justify;
        }

        .terBox2owl .box:nth-child(1) {
            background: #FFE1D0;
        }

        .terBox2owl .box:nth-child(2) {
            background: #FFF5D0;
        }

        .terBox2owl .box:nth-child(3) {
            background: #E8FFED;
        }

.ctPro1 {
    background: #FF9900;
    border-radius: 27px;
    display: block;
    box-shadow: 0 5px 20px .5px rgb(0 0 0 / 12%);
    overflow: hidden;
}

.ctPro1Heaing {
    background-image: linear-gradient(to bottom, #5f5050, #513e3e, #432d2c, #351d1b, #280d06);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 40px;
    font-family: 'Kimberley';
    text-align: center;
    padding: 10px 0 20px;
    display: block;
}

.ctProInfo {
    padding: 26px 15px;
    background: white;
    display: grid;
    border-radius: 32px 32px 0px 0px;
    height: 200px;
}

    .ctProInfo .coll {
    }

        .ctProInfo .coll:nth-child(1) {
        }

        .ctProInfo .coll:nth-child(2) {
        }

        .ctProInfo .coll:nth-child(3) {
        }

        .ctProInfo .coll:nth-child(4) {
        }

.infoNumVideo {
    font-size: 24px;
    color: #000000;
    font-family: 'RobotoMono-Bold';
}

.infoGrStar {
}

.infoProStar {
    max-width: 129px;
    display: block;
    flex: 1;
    margin: 0;
    height: 22px;
}

    .infoProStar span {
        height: 22px;
        background: url(../images/istarDetailPro.png) no-repeat;
        overflow: hidden;
        display: inline-block;
    }

.infoProCounter {
}

    .infoProCounter span {
        font-size: 16px;
        color: #595959;
        font-family: 'RobotoMono-Regular';
    }

.infoGrStar1 {
    display: flex;
    gap: 5px;
    align-items: center;
    margin-bottom: 5px;
}

.infoGrStar2 {
}

    .infoGrStar2 span {
        font-size: 16px;
        color: #000000;
        font-family: 'RobotoMono-Bold';
    }

.studenBox {
    align-items: center;
    display: grid;
    gap: 28px;
}

    .studenBox .item {
        height: 36px;
        width: 100%;
    }

        .studenBox .item span {
            color: #F27620;
        }

        .studenBox .item:nth-child(1) {
            font-size: 24px;
            color: #000000;
            font-family: 'RobotoMono-Bold';
            background: url(../images/ifo1.png) no-repeat;
            padding-left: 44px;
        }

        .studenBox .item:nth-child(2) {
            font-size: 20px;
            color: #000000;
            font-family: 'RobotoMono-Bold';
            margin-bottom: 0;
            background: url(../images/ifo2.png) no-repeat;
            padding-left: 44px;
            height: 53px;
        }

.detailsPriceBox {
    background: #EEEEEE;
    padding: 15px 30px;
    height: 143px;
    display: flex;
    border-radius: 23px;
    flex-wrap: wrap;
    align-items: center;
}

    .detailsPriceBox .new {
        width: 100%;
        font-size: 40px;
        font-family: 'Kimberley';
        color: #F27620;
    }

    .detailsPriceBox .old {
        width: 100%;
        font-size: 32px;
        font-family: 'Kimberley';
        color: #595959;
        text-decoration: line-through;
    }

    .detailsPriceBox .saleProBox {
        display: none;
    }

    .detailsPriceBox .salePro {
    }

    .detailsPriceBox .PriceBox {
        width: 100%;
        transition: unset;
        transform: translate(0, -13px);
    }

.infoBoxF {
    display: grid;
    gap: 28px;
}

.row .colr {
    padding: 0 15px;
}

.row .colBoxr2 {
    width: 220px;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    overflow: hidden;
    border-radius: 20px;
}

.row .colBoxr4 {
}

.grProButton {
    display: flex;
    flex-wrap: wrap;
    gap: 23px;
}

.grProBDefault {
    padding: 3px;
    border-radius: 40px;
    overflow: hidden;
    font-family: 'RobotoMono-Bold';
    display: block;
    align-items: center;
    background-image: linear-gradient(to right top, #5f5050, #513e3e, #432d2c, #351d1b, #280d06);
    max-width: 239px;
    margin: auto;
    position: relative;
    text-align: center;
    width: 100%;
}

    .grProBDefault a {
        padding: 11px 0;
        display: block;
        border-radius: 30px;
        overflow: hidden;
        font-weight: 700;
        font-size: 16px;
        background-image: linear-gradient(to right top, #280d06, #351d1b, #432d2c, #513e3e, #5f5050);
        color: white;
    }

.grProB1 {
}

.grProB2 {
}

.ctProInfo .row {
    align-items: center;
    justify-content: center;
}

.grProBDefault:hover {
    background-image: radial-gradient(circle, #f8c52a, #f9b220, #f89e1b, #f68a1c, #f27620);
}

    .grProBDefault:hover a {
        background-image: linear-gradient(to right, #fed80d, #ffc102, #feaa0a, #fa9316, #f37c21);
    }

        .grProBDefault:hover a span {
        }

.tabProContainer {
    margin-top: 50px;
}

.tabMenuBox {
    padding: 32px 66px;
    background: #FFF2E9;
    border-radius: 20px;
    position: relative;
}

    .tabMenuBox ul {
        padding: 0;
        list-style: none;
        display: flex;
        justify-content: space-around;
        align-items: center;
        margin: 0;
    }

        .tabMenuBox ul li {
            position: relative;
        }

            .tabMenuBox ul li a {
                font-size: 24px;
                color: #595959;
                font-family: 'RobotoMono-Bold';
            }

            .tabMenuBox ul li:hover a {
                color: #000000;
            }

            .tabMenuBox ul li.active a {
                color: #000000;
            }

            .tabMenuBox ul li:before {
                content: "";
                background-image: linear-gradient(to right top, #280d06, #351d1b, #432d2c, #513e3e, #5f5050);
                width: 57px;
                height: 7px;
                position: absolute;
                left: 0;
                right: 0;
                margin: auto;
                bottom: 0;
                transform: translate(0, 32px);
            }

.tabBlock {
}

.relatePro {
}

.proTabDefaultHeading {
    padding: 19px 63px;
    background: #FFF2E9;
    border-radius: 20px;
    position: relative;
    color: #595959;
    font-size: 32px;
    font-family: 'Kimberley';
    margin-top: 70px;
    margin-bottom: 35px;
}

.reviewHeading {
}

.relateProHeading {
}

.reviewSlide .feelItem {
    padding: 0;
}

.gvDetailsProBlock {
    background: #FFF2E9;
    padding: 48px 0;
    margin-bottom: 165px;
}

    .gvDetailsProBlock .contaiCusMBottom150 {
        margin-bottom: -150px;
    }

    .gvDetailsProBlock .proTabDefaultHeading {
        padding: 0 0;
        margin: 0 0 40px 0;
    }

    .gvDetailsProBlock .giangvienItem {
        padding: 24px 20px;
        background: white;
        border-radius: 1em;
        box-shadow: 0px 2px 4px .5px rgb(0 0 0 / 8%);
        margin-bottom: 10px;
    }

.ListProDeCrouse {
    margin-bottom: 62px;
}

.ListProDeCrouseHeading {
    background-image: linear-gradient(to right top, #f27620, #f68a1c, #f89e1b, #f9b220, #f8c52a);
    border-radius: 20px;
    padding: 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

    .ListProDeCrouseHeading h2 {
        font-family: 'RobotoMono-Bold';
        margin: 0;
        font-size: 24px;
        display: flex;
        align-items: center;
        gap: 17px;
    }

    .ListProDeCrouseHeading span {
        font-size: 24px;
        font-family: 'RobotoMono-Bold';
    }

.iconTitle {
    width: 61px;
    height: 50px;
    overflow: hidden;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    overflow: hidden;
}

    .iconTitle img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.ListProDeItem {
    margin-top: 24px;
    padding: 10px 16px;
    background: #D9D9D9;
    border-radius: 20px;
    display: flex;
    justify-content: space-between;
}

    .ListProDeItem span {
        font-size: 24px;
        color: #595959;
        font-family: 'RobotoMono-Bold';
        height: 44px;
        display: flex;
        align-items: center;
    }

        .ListProDeItem span:nth-child(1) {
            background: url(../images/iVideoe.png) no-repeat;
            padding-left: 75px;
        }

        .ListProDeItem span:nth-child(2) {
            background: url(../images/iTime.png) no-repeat;
            padding-left: 50px;
        }

.aboutDePro {
    padding-top: 55px;
}

.deCrouseThumb {
    height: 433px;
    overflow: hidden;
    width: 100%;
    border-radius: 1em;
}

    .deCrouseThumb img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .deCrouseThumb a {
        content: "";
        position: absolute;
        width: 123px;
        height: 123px;
        background: url(../images/btnplayVideo.png) no-repeat;
        border-radius: 50%;
        left: 0;
        right: 0;
        bottom: 0;
        top: 0;
        margin: auto;
    }

.deCrouseInfo {
}

    .deCrouseInfo .name {
        background-image: linear-gradient(to bottom, #5f5050, #513e3e, #432d2c, #351d1b, #280d06);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        font-size: 48px;
        font-family: 'Kimberley';
        text-align: left;
        padding: 10px 0 0px;
        display: block;
        margin-bottom: 35px;
    }

    .deCrouseInfo .description {
        max-height: 400px;
        overflow-y: scroll;
    }

        .deCrouseInfo .description ul {
        }

            .deCrouseInfo .description ul li {
                font-size: 20px;
                color: #595959;
                font-family: 'RobotoMono-Bold';
                margin-bottom: 37px;
            }

                .deCrouseInfo .description ul li:last-child {
                    margin-bottom: 0;
                }

                .deCrouseInfo .description ul li a {
                }

.ifLesTitle {
}

    .ifLesTitle span {
        background-image: linear-gradient(to bottom, #5f5050, #513e3e, #432d2c, #351d1b, #280d06);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        font-size: 40px;
        font-family: 'Kimberley';
        text-align: left;
        padding: 10px 0 5px;
        display: block;
    }

.ifDescription {
    font-size: 20px;
    color: #595959;
    font-family: 'RobotoMono-Bold';
}

.lesItem {
    margin-top: 25px;
}

.lesItemThumb {
    position: relative;
    height: 239px;
    overflow: hidden;
    border-radius: 24px;
}

    .lesItemThumb img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .lesItemThumb .videoles {
        content: "";
        position: absolute;
        width: 81px;
        height: 81px;
        background: url(../images/btnplayVideo.png) no-repeat;
        background-size: 81px;
        border-radius: 50%;
        left: 0;
        right: 0;
        bottom: 0;
        top: 0;
        margin: auto;
    }

.lesItemContent {
}

.lesItemTitle {
    margin-top: 15px;
    margin-bottom: 5px;
}

    .lesItemTitle a {
        display: block;
        color: #595959;
        font-size: 16px;
        font-family: 'RobotoMono-Bold';
    }

.lesItemTime {
    background: url(../images/lessonTime.png) left center no-repeat;
    padding-left: 42px;
    font-family: 'RobotoMono-Bold';
}

    .lesItemTime span {
        color: #F27620;
    }

.ifLesVideo {
    content: "";
    position: absolute;
    width: 123px;
    height: 123px;
    background: url(../images/btnplayVideo.png) no-repeat;
    border-radius: 50%;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    margin: auto;
    z-index: 9;
}

.ifLesThumb {
    /* height: 527px; */
    overflow: hidden;
    position: relative;
}

    .ifLesThumb img {
        width: 100%;
        object-fit: cover;
        height: 100%;
    }

    .ifLesThumb iframe {
    }

.infoLesson {
}

.ctLesson1 {
    padding: 65px 0 0;
}

.asideLessonHeading {
    background-image: linear-gradient(to bottom, #5f5050, #513e3e, #432d2c, #351d1b, #280d06);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 24px;
    font-family: 'Kimberley';
    text-align: left;
    padding: 0px 0 10px;
    display: block;
    text-transform: uppercase;
    border-bottom: 1px solid #3e2725;
}

.headInfoUser {
    padding: 2px 3px 2px 40px;
    background: url(../images/profile-user.png) left center no-repeat;
    background-size: 33px;
    border-radius: 30px;
    color: black;
    font-family: 'RobotoMono-Bold';
    display: flex;
    align-items: center;
    text-decoration: none;
    cursor: pointer;
}

    .headInfoUser span {
        font-size: 14px;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-line-clamp: 1;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        max-width: 175px;
    }

.headUserList {
    top: 100%;
    z-index: 1000;
    font-size: 1rem;
    color: #212529;
    text-align: left;
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: .25rem;
    padding: 0 0px;
    min-width: 13rem;
    margin: 0;
    position: absolute;
    left: 0;
    background: #fff7f2;
    list-style: none;
    display: none;
}

    .headUserList li {
    }

        .headUserList li a {
            font-family: 'RobotoMono-Regular';
            display: block;
            padding: 8px 10px;
            background: #FFF7F2;
            color: black;
            font-size: 14px;
            padding-left: 25px;
        }

        .headUserList li:hover a {
        }

li.divider {
    height: 1px;
    margin: 2px 0;
    overflow: hidden;
    background: #e5e5e5;
}

.box_menu_user .name_student {
    font-size: 30px;
    color: white;
    margin-bottom: 15px;
    font-family: 'Kimberley';
}

.box_menu_user ul {
    display: flex;
    align-items: center;
    list-style: none;
    padding: 0;
    margin: 0;
    gap: 10px;
}

    .box_menu_user ul li {
        padding: 7px 20px;
        background: #ffffff;
        border-top-left-radius: .5em;
        border-top-right-radius: .5em;
        overflow: hidden;
        padding-left: 30px;
    }

        .box_menu_user ul li a {
            color: black;
            font-size: 1em;
        }

.box_menu_user {
    transform: translate(0, -98px);
}

.headUserList li:nth-child(1) a {
    background: url(../images/key.png) 5px center no-repeat;
    background-size: 15px;
}

.headUserList li:nth-child(2) a {
    background: url(../images/account.png) 5px center no-repeat;
    background-size: 15px;
}

.headUserList li:nth-child(4) a {
    background: url(../images/logout.png) 7px center no-repeat;
    background-size: 15px;
}

.headUserList li:hover {
    background: #f1e2d9;
}




.box_menu_user ul li:nth-child(1) {
    background: url(../images/online-learning.png) 8px center no-repeat white;
    background-size: 18px;
}

.box_menu_user ul li:nth-child(2) {
    background: url(../images/setting.png) 8px center no-repeat white;
    background-size: 18px;
}

.box_menu_user ul li:nth-child(3) {
    background: url(../images/key.png) 8px center no-repeat white;
    background-size: 16px;
}

.box_menu_user ul li:nth-child(4) {
    background: url(../images/heart.png) 8px center no-repeat white;
    background-size: 18px;
}

.box_menu_user ul li:nth-child(5) {
    background: url(../images/shopping-cart.png) 8px center no-repeat white;
    background-size: 18px;
}

.box_menu_user ul li:nth-child(5) {
}

.box_menu_user ul li:nth-child(6) {
}

.box_menu_user ul li.active {
    background-color: #FFF7F2;
}

.box_menu_user ul li:hover {
    background-color: #FFF7F2;
}

.profileBox {
}

.usProfile {
    /* background: #FFF7F2; */
    padding-bottom: 40px;
}

.profileHeading {
    padding: 10px 15px 10px 40px;
    background: url(../images/setting.png) 8px center no-repeat #f8c42a;
    background-size: 25px;
    width: 100%;
    border-radius: 5px 5px 0 0;
    font-family: 'Kimberley';
    color: black;
    text-transform: uppercase;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    font-size: 1.2em;
}

.profileMain {
    padding: 20px;
    background: white;
    box-shadow: 0px 1px 4px 0px #00000029;
    border-bottom-left-radius: .5em;
    border-bottom-right-radius: .5em;
}

.profileThumb {
}

.profileName {
    color: black;
}

    .profileName span {
        font-family: 'Kimberley';
        color: #f27620;
    }

.profileAddress {
    margin-bottom: 8px;
}

    .profileAddress input {
    }

.profileGrField {
}

    .profileGrField input, .profileGrField select {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        width: 100%;
        margin-bottom: 10px;
        padding: 7px 12px;
        border-radius: .5em;
        border: 1px solid #bcbcbc;
        outline: none;
        color: #818181;
    }

.profileName {
    margin-bottom: 25px;
    margin-top: 8px;
}

.profileAddress input {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
    margin-bottom: 10px;
    padding: 7px 12px;
    border-radius: .5em;
    border: 1px solid #bcbcbc;
    outline: none;
}

.profileGrField .btnregister {
    padding: 3px;
    border-radius: 40px;
    overflow: hidden;
    font-family: 'RobotoMono-Bold';
    display: block;
    align-items: center;
    background-image: radial-gradient(circle, #f8c52a, #f9b220, #f89e1b, #f68a1c, #f27620);
    max-width: 179px;
    margin: auto;
    position: relative;
    text-align: center;
}

.bannerPageUser {
    /* background: #fff7f2; */
}

.checkP {
}

    .checkP input {
        width: auto;
        display: inline-block;
    }

.proField {
    margin-bottom: 3px;
}

    .proField .title {
        color: black;
        font-family: 'RobotoMono-Bold';
        font-size: .9em;
        margin-bottom: 4px;
    }

.prInput .bootstrap-select {
    width: 100% !important;
}

.activeCourse {
    padding: 0px 0;
}

.activeCourseBox {
    max-width: 500px;
    text-align: center;
    margin: 0 auto;
}

.activeCourseHeading {
    padding: 10px 15px;
    background: #f8c42a;
    width: 100%;
    border-radius: 5px 5px 0 0;
    font-family: 'Kimberley';
    color: black;
    text-transform: uppercase;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    font-size: 1.2em;
    max-width: 500px;
}

.activeCourseDesc {
    padding: 20px;
    background: white;
    box-shadow: 0px 1px 4px 0px #00000029;
    border-bottom-left-radius: .5em;
    border-bottom-right-radius: .5em;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

    .activeCourseDesc h4 {
        color: black;
        /* font-family: 'RobotoMono-Bold'; */
        font-size: 1em;
        margin-bottom: 4px;
        font-weight: 400;
        width: 100%;
        text-align: center;
    }

.activeCourseForm {
    margin-top: 10px;
}

    .activeCourseForm input {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        width: 100%;
        margin-bottom: 10px;
        padding: 7px 12px;
        border-radius: .5em;
        border: 1px solid #bcbcbc;
        outline: none;
        color: #818181;
    }

.btnActiveCourse {
    padding: 3px;
    border-radius: 40px;
    overflow: hidden;
    font-family: 'RobotoMono-Bold';
    display: block;
    align-items: center;
    max-width: 152px;
    margin: auto;
    position: relative;
    text-align: center;
}

    .btnActiveCourse span {
        padding: 5px 0px;
        display: block;
        border-radius: 30px;
        overflow: hidden;
        font-weight: 700;
        font-size: 16px;
        background: #f27620;
        color: white;
    }

.titleProfile {
    width: 100%;
    border-radius: 5px 5px 0 0;
    font-family: 'Kimberley';
    color: black;
    text-transform: uppercase;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    font-size: .95em;
    margin-bottom: 10px;
}

.profileThumb .center {
    width: 100px;
    height: 130px;
    border-radius: 0.5em;
    overflow: hidden;
    margin-bottom: 5px;
}

    .profileThumb .center img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.bootstrap-select > .dropdown-toggle.bs-placeholder, .bootstrap-select > .dropdown-toggle.bs-placeholder:hover, .bootstrap-select > .dropdown-toggle.bs-placeholder:focus, .bootstrap-select > .dropdown-toggle.bs-placeholder:active {
    height: 39px;
    line-height: 39px;
    border: 1px solid #B2B2B2;
    width: 100%;
    border-radius: 5px;
    padding: 0 15px;
    font-size: 18px;
    color: #818181;
    margin-bottom: 20px;
    background: white;
    outline: none !important;
}

.bootstrap-select > select.mobile-device:focus + .dropdown-toggle, .bootstrap-select .dropdown-toggle:focus {
    outline: none !important;
    box-shadow: none !important;
}

.cartPage {
    padding: 40px 0;
}

.commentMessage {
}

.commentBox {
}

.commentForm {
}

.commentUser {
    display: flex;
    gap: 30px;
    align-items: center;
}

.commentContent {
    width: 100%;
    max-height: 90px;
}

    .commentContent #strContent {
        width: 100%;
        border: none;
        border-bottom: 3px solid #595959;
        max-height: 90px;
        font-size: 16px;
        color: #595959 !important;
        font-family: 'RobotoMono-Bold';
        padding-bottom: 5px;
        outline: none;
    }

        .commentContent #strContent::placeholder {
            color: #595959 !important;
            font-family: 'RobotoMono-Bold';
        }

    .commentContent #send {
        margin-top: 10px;
        text-align: right;
        justify-content: end;
        display: grid;
    }

        .commentContent #send span {
            padding: 5px 10px;
            border-radius: 30px;
            overflow: hidden;
            font-weight: 700;
            font-size: 16px;
            background: #f27620;
            color: white;
            display: block;
            max-width: 100px;
            text-align: center;
            cursor: pointer;
        }

.commentThumb {
    width: 107px;
    height: 107px;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    margin-bottom: 0;
    overflow: hidden;
    border-radius: 0.5em;
    position: relative;
}

    .commentThumb .box1 {
        background-image: linear-gradient(to right top, #f37c21, #fa9316, #feaa0a, #ffc102, #fed80d);
        padding: 6px;
        height: 100%;
        width: 100%;
        overflow: hidden;
    }

    .commentThumb .box2 {
        width: 100%;
        height: 100%;
    }

    .commentThumb img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 5px;
        overflow: hidden;
    }

.commentList {
}

.commItem {
    margin-top: 50px;
}

.commItemUser {
    display: flex;
    gap: 38px;
}

.commItemThumb {
    width: 107px;
    height: 107px;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    margin-bottom: 0;
    overflow: hidden;
    border-radius: 0.5em;
    position: relative;
}

    .commItemThumb .box1 {
        background-image: linear-gradient(to right top, #f37c21, #fa9316, #feaa0a, #ffc102, #fed80d);
        padding: 6px;
        height: 100%;
        width: 100%;
        overflow: hidden;
    }

    .commItemThumb .box2 {
        width: 100%;
        height: 100%;
    }

    .commItemThumb img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 5px;
        overflow: hidden;
    }

.commItemContent {
    padding-left: 30px;
    position: relative;
}

    .commItemContent .box3 {
        padding: 21px 74px;
        background: #EBEBEB;
        position: relative;
    }

.commItemDescription {
    font-size: 16px;
    color: #595959;
    font-family: 'RobotoMono-Bold';
}

.commItemName {
    color: #000000;
    font-size: 24px;
    font-family: 'RobotoMono-Bold';
    margin-bottom: 7px;
}

.commItemStar {
    margin-bottom: 10px;
}

    .commItemStar span {
        height: 22px;
        background: url(../images/iStarPro.png) no-repeat;
        overflow: hidden;
        display: block;
    }

.commItemContent:before {
    content: "";
    position: absolute;
    width: 55PX;
    height: 50PX;
    border-left: 50px solid transparent;
    border-right: 0px solid transparent;
    border-bottom: 0px solid transparent;
    border-top: 50px solid #EBEBEB;
    left: -10px;
    top: 0;
    border-radius: 5px;
    /* background: url(../images/tamgiac.png); */
}

.fileListGroup {
}

    .fileListGroup h4 {
        background-image: linear-gradient(to bottom, #5f5050, #513e3e, #432d2c, #351d1b, #280d06);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        font-size: 1.2em;
        font-family: 'Kimberley';
        text-align: left;
        padding: 10px 0 5px;
        display: block;
        margin-bottom: 4px;
    }

    .fileListGroup ul {
        padding-left: 0;
        list-style: none;
    }

        .fileListGroup ul li {
        }

            .fileListGroup ul li a {
                font-size: 16px;
                display: block;
                padding-left: 15px;
                position: relative;
            }

                .fileListGroup ul li a:before {
                    content: "";
                    background: #007bff;
                    width: 5px;
                    height: 5px;
                    position: absolute;
                    left: 3px;
                    border-radius: 50%;
                    top: 2px;
                    bottom: 0;
                    margin: auto;
                }

.commentNumber {
    font-size: 24px;
    color: #000000;
    margin-bottom: 27px;
    font-family: 'RobotoMono-Bold';
}

.btnApDung {
    background: #B2B2B2;
    width: 100%;
    padding: 0;
    line-height: 43px !important;
    outline: none;
    border: none;
    color: white;
}
/*DeskTop*/
a.button-social-login.button-social-login-google, .widget-area a.button-social-login.button-social-login-google, .social-badge.social-badge-google {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    line-height: 2.5em;
    height: 2.5em;
    font-size: 100%;
    font-family: inherit;
    font-weight: 700;
    overflow: hidden;
    white-space: nowrap;
    border: 1px solid #333;
    color: #fff;
    background: #333;
    padding: 0 .7em 0 0;
    margin: 6px 0;
    border-radius: 2px;
    box-sizing: content-box;
    cursor: pointer;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .1);
    text-decoration: none;
    background: #f00 !important;
    border-color: #f00 !important;
    margin-right: 20px;
}

a.button-social-login.button-social-login-facebook, .widget-area a.button-social-login.button-social-login-facebook, .social-badge.social-badge-facebook {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    line-height: 2.5em;
    height: 2.5em;
    font-size: 100%;
    font-family: inherit;
    font-weight: 700;
    overflow: hidden;
    white-space: nowrap;
    border: 1px solid #333;
    color: #fff;
    background: #333;
    padding: 0 .7em 0 0;
    margin: 6px 0;
    border-radius: 2px;
    box-sizing: content-box;
    cursor: pointer;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .1);
    text-decoration: none;
    background: #3b5998;
    border-color: #3b5998;
}

.button-social-login i, .widget-area .widget a.button-social-login i, a.button-social-login i, button.button-social-login i, input.button-social-login i {
    display: inline-block;
    vertical-align: top;
    text-align: center;
    font-size: 100%;
    width: 2.5em;
    height: 2.5em;
    padding: 0;
    margin-right: .7em;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: 1.8em 1.8em;
    border-top-left-radius: 1px;
    border-bottom-left-radius: 1px;
}

.fa-facebook {
    background-image: url(../images/facebook.svg);
}

.fa-google {
    background-image: url(../images/google.svg);
}

.dflex {
    display: flex
}

.grHeadMobi .userGrBtn {
    padding: 5px 10px;
    font-size: 13px;
}
