@charset "UTF-8";

@font-face {
    font-family: 'SF Pro Text';
    src: url('../fonts/FontsFree-Net-SFProText-Regular.ttf');
}

.w-full {
    width: 100%;
}

.grey-bg {
    background: #f3f4f9;
}

.rowfull.pad-area-mem {
    padding-top: 1px;
    /* background: #f3f4f9; */
}

.radius-12, .banner-mem {
    border-radius: 12px;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    -ms-border-radius: 12px;
    -o-border-radius: 12px;
}

.radius-16 {
    border-radius: 16px;
    -webkit-border-radius: 16px;
    -moz-border-radius: 16px;
    -ms-border-radius: 16px;
    -o-border-radius: 16px;
}

.radius-20, .banner-mem .col-right .card-block img.card-mem {
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    -o-border-radius: 20px;
}

.radius-tabmn, .menu-tab--banner ul li div.icon {
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.mb-0 {
    margin-bottom: 0;
}

.mb-4 {
    margin-bottom: 4px;
}

.mb-8 {
    margin-bottom: 8px;
}

.mb-12 {
    margin-bottom: 12px;
}

.mb-16 {
    margin-bottom: 16px;
}

.mb-20 {
    margin-bottom: 20px;
}

.mb-32 {
    margin-bottom: 32px;
}

.d-inline-block {
    display: inline-block;
    margin: 0 auto;
    width: 100%;
}

.banner-mem {
    background-position: center;
    background-repeat: no-repeat;
    background-size: auto 100%;
    max-width: 1872px;
    height: 433px;
    margin: 0 auto 0;
}

    .banner-mem .banner-content {
        display: inline-block;
        width: 100%;
        padding-top: 45px;
    }

    .banner-mem .col-left {
        padding-left: 25px;
    }

        .banner-mem .col-left .block-text {
            font-size: 22px;
            color: #fff;
            line-height: 36px;
        }

            .banner-mem .col-left .block-text .welcome {
                opacity: .6;
                padding-bottom: 48px;
            }

            .banner-mem .col-left .block-text .title {
                font-weight: 600;
            }

            .banner-mem .col-left .block-text .using {
                font-size: 17px;
                font-weight: 400;
            }

                .banner-mem .col-left .block-text .using span {
                    font-size: 18px;
                    font-weight: 700;
                }

            .banner-mem .col-left .block-text .expired {
                font-size: 17px;
                font-style: italic;
            }

                .banner-mem .col-left .block-text .expired span {
                    font-size: 18px;
                    font-weight: 400;
                    font-style: normal;
                }

    .banner-mem .col-right {
        padding-right: 0;
        /* Add */
        /* top: -35px;
        right: -10px; */
    }

        .banner-mem .col-right .card-block {
            position: relative;
            position: relative;
            /*height: 352px;*/
            height: 253px;
            display: inline-block;
            width: 100%;
            color: #fff;
            left: 4em;
        }

            .banner-mem .col-right .card-block img.card-mem {
                position: absolute;
                border: 3px solid #fff;
                -o-object-fit: cover;
                object-fit: cover;
                width: 480px;
                height: 280px;
                width: 505px;
                /*TET*/
                /*height: 331px;*/
                /*display:none*/
            }

            .banner-mem .col-right .card-block .block-mem-text {
                position: absolute;
                padding-top: 142px;
                padding-left: 40px;
                width: 480px;
                /*TET*/
                /*padding-top: 162px;*/
            }

                .banner-mem .col-right .card-block .block-mem-text::after {
                    content: '';
                    position: absolute;
                    z-index: 11;
                    left: -33px;
                    /*bottom: -46px;*/
                    bottom: -102px;
                    background: url("../images/dot-vector.svg") center no-repeat;
                    background-size: 53px;
                    width: 53px;
                    /*height: 116px;*/
                    height: 116px;
                    display: none;
                }

                .banner-mem .col-right .card-block .block-mem-text::before {
                    content: '';
                    position: absolute;
                    z-index: 11;
                    right: -22px;
                    /*top: -48px;*/
                    top: -48px;
                    background: url("../images/dot-vector.svg") center no-repeat;
                    background-size: 46px;
                    width: 46px;
                    /*height: 100px;*/
                    height: 100px;
                    display: none;
                }

                .banner-mem .col-right .card-block .block-mem-text .name {
                    text-transform: uppercase;
                    font-size: 22px;
                    font-weight: 600;
                }

                .banner-mem .col-right .card-block .block-mem-text .rank {
                    font-size: 17px;
                }

                .banner-mem .col-right .card-block .block-mem-text .desc {
                    font-size: 14px;
                    position: relative;
                }

                    .banner-mem .col-right .card-block .block-mem-text .desc a {
                        padding-left: 4px;
                        padding-right: 4px;
                    }

                        .banner-mem .col-right .card-block .block-mem-text .desc a img {
                            margin-top: -2px;
                        }
.menu-tab--banner {
    position: absolute;
    bottom: 0;
    width: 100%;
}
.menu-tab--banner ul {
    list-style: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 23px 0 0;
    padding: 0;
}

.menu-tab--banner ul li {
    padding: 0 4px;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
}

.menu-tab--banner ul li div.icon {
    background: rgba(255, 255, 255, 0.12);
    padding: 18px 16px;
}

.menu-tab--banner ul li div.icon a {
    color: #fff;
    text-decoration: none;
    padding: 16px 28px;
    font-size: 17px;
}

.menu-tab--banner ul li div.icon a img {
    margin-right: 16px;
}

.menu-tab--banner ul li div.icon a img:last-of-type {
    display: none;
}

.menu-tab--banner ul li div.icon:hover {
    background: rgba(255, 255, 255, 0.25);
}

.menu-tab--banner ul li.active div.icon {
    background: #fff;
    padding: 23px 16px;
    margin-top: -10px;
}

.menu-tab--banner ul li.active div.icon a {
    color: #0F1E47;
    font-weight: 700;
}

.menu-tab--banner ul li.active div.icon a img:last-of-type {
    display: inline-block;
}

.menu-tab--banner ul li.active div.icon a img:first-of-type {
    display: none;
}
/* responsive menu tab */
@media screen and (max-width: 834px) {
    .menu-tab--banner ul li div.icon {
        padding: 12px 0px;
    }
    .menu-tab--banner ul li.active div.icon {
        padding: 17px 0;
    }
    .menu-tab--banner ul li div.icon a {
        padding: 16px 20px;
    }
}
/* tab menu: https://code.io/joao-goncalves/pen/ZXYGmo*/
.block-tab--content {
    margin: 0 auto;
    max-width: 100%;
    background-color: #f3f4f9;
    padding: 32px 0;
}

    .block-tab--content .col-sm-12 > div {
        position: relative;
        background: #fff;
        min-height: 60px;
        margin-bottom: 32px;
        padding: 20px;
        border-radius: 10px;
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        -ms-border-radius: 10px;
        -o-border-radius: 10px;
    }

    .block-tab--content .col-sm-12 .pd-8 {
        width:100%;
        background: #fff;
        padding: 8px;
        border-radius: 10px;
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        -ms-border-radius: 10px;
        -o-border-radius: 10px;
    }


    .block-tab--content .col-sm-12 > div.block-head--history {
        padding: 20px 28px;
    }


.filter-in-tabmenu {
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
}

    .filter-in-tabmenu .label-left {
        font-weight: 600;
        font-size: 22px;
        color: #0F1E47;
    }

    .filter-in-tabmenu .filter-block {
        display: -ms-flexbox;
        display: -webkit-box;
        display: flex;
        -ms-flex-positive: 1;
        -webkit-box-flex: 1;
        flex-grow: 1;
        -ms-flex-pack: end;
        -webkit-box-pack: end;
        justify-content: flex-end;
        -ms-flex-align: center;
        -webkit-box-align: center;
        align-items: center;
    }

        .filter-in-tabmenu .filter-block div {
            padding-left: 20px;
        }

            .filter-in-tabmenu .filter-block div span {
                padding-right: 6px;
            }

.tabs-point-history {
    margin-top: 0px;
}

    .tabs-point-history .title_mygift {
        font-weight: 600;
        font-size: 24px;
        color: #1F2636;
        margin: 12px 0 18px 20px;
    }

ul.tabs {
    background: none;
    display: inline-block;
    width: 100%;
    padding: 20px 0 0;
    text-align: center;
    border-bottom: 1px solid #eee;
    -webkit-margin-before: 0;
    -webkit-padding-start: 0;
}

    ul.tabs li {
        color: #636F7E;
        list-style: none;
        cursor: pointer;
        display: inline-block;
        padding: 0 12px;
        margin: 0 10px;
        line-height: 42px;
        font-size: 15px;
        font-weight: 500;
    }

        ul.tabs li img {
            filter: grayscale(1);
        }

        ul.tabs li.active {
            color: #2959F0;
            border-bottom: 2px solid #2959F0;
        }

            ul.tabs li.active img {
                filter: grayscale(0);
            }

.tabs_contain-point {
    padding-top: 20px;
    display: inline-block;
    width: 100%;
}

    .tabs_contain-point .tab_content-point {
        display: none;
    }

        .tabs_contain-point .tab_content-point.active {
            display: inline-block;
            width: 100%;
        }

.select-style {
    background: #F6F7FB url("../images/i-dropdown.svg") no-repeat right center;
    background-size: 22px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    line-height: 1.5;
    height: 32px;
    border: 0px solid;
    padding: 4px 24px 4px 8px;
    outline: none;
    cursor: pointer;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
}

    .select-style:hover, .select-style:focus {
        background: #fff url("../images/i-dropdown.svg") no-repeat right center;
        background-size: 22px;
        cursor: pointer;
    }

/* accordition ----------------------------- */
.accordion {
    position: relative;
    margin: 0px auto;
    width: 100%;
}

[id*="open-accordion"],
[id*="close-accordion"] {
    line-height: 28px;
    height: auto;
    display: block;
    margin: 0 auto;
    position: relative;
    width: 100%;
}

[id*="close-accordion"] {
    display: none;
}

.accordion > div {
    background: #FBFBFD;
    margin: 10px 0;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
    margin: 15px 0px 0;
}

.accordion a {
    font-size: 16px;
    text-decoration: none;
    text-shadow: none;
    color: #333;
    font-weight: 500;
    padding-right: 5px;
    padding: 12px 20px;
}

    .accordion a > div {
        display: inline-block;
    }

        .accordion a > div:nth-of-type(1) {
            width: 12%;
        }

            .accordion a > div:nth-of-type(1) span {
                float: right;
                padding-right: 22%;
                margin-top: -4px;
            }

        .accordion a > div:nth-of-type(2) {
            width: 59%;
        }

        .accordion a > div:nth-of-type(3) {
            width: 12%;
        }

        .accordion a > div:nth-of-type(4) {
            width: 15%;
        }

            .accordion a > div:nth-of-type(4) div {
                display: inline-block;
                background: #E2FFDF;
                border: 1px solid #B8F5B2;
                color: #52B848;
                font-weight: 600;
                padding: 6px 16px;
                line-height: 1.2;
                border-radius: 32px;
                -webkit-border-radius: 32px;
                -moz-border-radius: 32px;
                -ms-border-radius: 32px;
                -o-border-radius: 32px;
            }

                .accordion a > div:nth-of-type(4) div img {
                    margin-top: -4px;
                    margin-left: 8px;
                    width: 16px;
                }

[id*="open-accordion"]:after,
[id*="close-accordion"]:after {
    content: "";
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    position: absolute;
    right: 10px;
    top: 4px;
    line-height: 22px;
    z-index: 2;
    font-size: 33px;
    font-weight: 500;
    background: url("../images/arrow.svg") center no-repeat;
    width: 30px;
    height: 21px;
    background-size: 10px;
    transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
}

.target-fix {
    display: block;
    top: 0;
    left: 0;
    position: fixed;
}

.accordion-content {
    height: 0;
    margin: -1px auto 0;
    padding: 0 20px;
    position: relative;
    overflow: hidden;
    width: 100%;
    transition: all 0.1s ease;
    -webkit-transition: all 0.1s ease;
    -moz-transition: all 0.1s ease;
}

    .accordion-content > div {
        background: #fff;
        padding: 32px 28px;
        display: inline-block;
        width: 100%;
        border-radius: 8px;
        -webkit-border-radius: 8px;
        -moz-border-radius: 8px;
        -ms-border-radius: 8px;
        -o-border-radius: 8px;
    }

    .accordion-content .col--left > div {
        color: #828AA0;
    }

        .accordion-content .col--left > div span {
            color: #0F1E47;
            font-weight: 500;
        }

        .accordion-content .col--left > div:nth-of-type(1) {
            height: 116px;
        }

        .accordion-content .col--left > div .number {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
        }

            .accordion-content .col--left > div .number span {
                font-size: 30px;
                font-weight: 700;
                color: #356EFD;
            }

            .accordion-content .col--left > div .number img {
                width: 23px;
                margin-left: 4px;
            }

        .accordion-content .col--left > div .success-label {
            display: inline-block;
            background: rgba(53, 110, 253, 0.08);
            color: #356EFD;
            font-size: 17px;
            font-weight: 600;
            padding: 6px 16px;
            line-height: 1.5;
            border-radius: 32px;
            -webkit-border-radius: 32px;
            -moz-border-radius: 32px;
            -ms-border-radius: 32px;
            -o-border-radius: 32px;
        }

            .accordion-content .col--left > div .success-label img {
                margin-right: 4px;
            }

    .accordion-content .col--right > div {
        color: #828AA0;
    }

        .accordion-content .col--right > div span {
            color: #0F1E47;
            font-weight: 500;
        }

        .accordion-content .col--right > div:nth-of-type(1) {
            height: 116px;
        }

        .accordion-content .col--right > div p {
            font-weight: 600;
            font-size: 26px;
            color: #0F1E47;
        }

.accordion span:target ~ .accordion-content {
    display: block;
    height: auto;
    padding: 2px 20px 12px;
    background: #EDEFF5;
    -webkit-border-bottom-right-radius: 6px;
    -webkit-border-bottom-left-radius: 6px;
    -moz-border-radius-bottomright: 6px;
    -moz-border-radius-bottomleft: 6px;
    border-bottom-right-radius: 6px;
    border-bottom-left-radius: 6px;
}

.accordion span:target ~ [id*="close-accordion"] {
    display: block;
    background: #EDEFF5;
    -webkit-border-top-left-radius: 6px;
    -webkit-border-top-right-radius: 6px;
    -moz-border-radius-topleft: 6px;
    -moz-border-radius-topright: 6px;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}

.accordion span:target ~ [id*="open-accordion"] {
    display: none;
}

.accordion span:target ~ [id*="close-accordion"]:after {
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
}

/* // accordition -------------------- */

/* accordition myEvoucher----------------------------- */
.accordion-myEvoucher {
    position: relative;
    margin: 0px auto;
    width: 100%;
}

[id*="open-accordion-myEvoucher"],
[id*="close-accordion-myEvoucher"] {
    line-height: 28px;
    height: auto;
    display: block;
    margin: 0 auto;
    position: relative;
    width: 100%;
}

[id*="close-accordion-myEvoucher"] {
    display: none;
}

.accordion-myEvoucher > div {
    background: #FBFBFD;
    margin: 10px 0;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
    margin: 15px 0px 0;
}

.accordion-myEvoucher a {
    font-size: 16px;
    text-decoration: none;
    text-shadow: none;
    color: #333;
    font-weight: 500;
    padding-right: 5px;
    padding: 12px 1%;
    word-break: break-word;
}

    .accordion-myEvoucher a > div {
        display: -webkit-inline-box;
    }

        .accordion-myEvoucher a > div:nth-of-type(1) {
            width: 10%;
        }

            .accordion-myEvoucher a > div:nth-of-type(1) span {
                float: right;
                padding-right: 22%;
                margin-top: -4px;
            }

        .accordion-myEvoucher a > div:nth-of-type(2) {
            width: 35%;
        }

        .accordion-myEvoucher a > div:nth-of-type(3) {
            width: 12%;
        }

        .accordion-myEvoucher a > div:nth-of-type(4) {
            width: 12%;
        }

            .accordion-myEvoucher a > div:nth-of-type(4) div {
                display: inline-block;
                background: #E2FFDF;
                border: 1px solid #B8F5B2;
                color: #52B848;
                font-weight: 600;
                padding: 6px 16px;
                line-height: 1.2;
                border-radius: 32px;
                -webkit-border-radius: 32px;
                -moz-border-radius: 32px;
                -ms-border-radius: 32px;
                -o-border-radius: 32px;
            }

.accordion a > div:nth-of-type(4) div img {
    margin-top: -4px;
    margin-left: 0px;
    width: 16px;
}

.accordion-myEvoucher a > div:nth-of-type(5) {
    width: 12%;
    color: #23D45F;
}

.status-color {
    width: 12%;
    color: #23D45F !important;
}

.status {
    color: #23D45F !important;
}




.icon-mb {
    margin-bottom: 1px
}

.accordion-myEvoucher a > div:nth-of-type(6) {
    width: 13%;
    align-items: center;
    max-width: 117px;
    height: 32px;
    background: linear-gradient(180deg, #4572FF 0%, #1545DB 100%);
    border-radius: 80px;
    border-color: #fff;
    color: #fff;
    font-size: 14px;
    display: inline-flex;
    justify-content: center;
}

[id*="open-accordion-myEvoucher"]:after,
[id*="close-accordion-myEvoucher"]:after {
    content: "";
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    position: absolute;
    right: 10px;
    top: 16px;
    line-height: 22px;
    z-index: 2;
    font-size: 33px;
    font-weight: 500;
    background: url("../images/arrow.svg") center no-repeat;
    width: 30px;
    height: 21px;
    background-size: 10px;
    transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
}

.target-fix {
    display: block;
    top: 0;
    left: 0;
    position: fixed;
}

.accordion-myEvoucher-content {
    height: 0;
    margin: -1px auto 0;
    padding: 0 20px;
    position: relative;
    overflow: hidden;
    width: 100%;
    transition: all 0.1s ease;
    -webkit-transition: all 0.1s ease;
    -moz-transition: all 0.1s ease;
}

    .accordion-myEvoucher-content > div {
        background: #fff;
        padding: 32px 28px;
        display: inline-block;
        width: 100%;
        border-radius: 8px;
        -webkit-border-radius: 8px;
        -moz-border-radius: 8px;
        -ms-border-radius: 8px;
        -o-border-radius: 8px;
    }

    .accordion-myEvoucher-content .col--left > div {
        color: #828AA0;
    }

    .accordion-myEvoucher-content .col--left img {
        max-width: 260px;
        height: auto;
    }

    .accordion-myEvoucher-content .col--left > div span {
        color: #0F1E47;
        font-weight: 500;
    }

    .accordion-myEvoucher-content .col--left > div:nth-of-type(1) {
        height: 116px;
    }

    .accordion-myEvoucher-content .col--left > div .number {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

        .accordion-myEvoucher-content .col--left > div .number span {
            font-size: 30px;
            font-weight: 700;
            color: #356EFD;
        }

        .accordion-myEvoucher-content .col--left > div .number img {
            width: 23px;
            margin-left: 4px;
        }

    .accordion-myEvoucher-content .col--left > div .success-label {
        display: inline-block;
        background: rgba(53, 110, 253, 0.08);
        color: #356EFD;
        font-size: 17px;
        font-weight: 600;
        padding: 6px 16px;
        line-height: 1.5;
        border-radius: 32px;
        -webkit-border-radius: 32px;
        -moz-border-radius: 32px;
        -ms-border-radius: 32px;
        -o-border-radius: 32px;
    }

        .accordion-myEvoucher-content .col--left > div .success-label img {
            margin-right: 4px;
        }

    .accordion-myEvoucher-content .col--right > div {
        color: #828AA0;
    }

        .accordion-myEvoucher-content .col--right > div span {
            color: #0F1E47;
            font-weight: 500;
        }

        .accordion-myEvoucher-content .col--right > div:nth-of-type(1) {
            height: 80px;
        }

        .accordion-myEvoucher-content .col--right > div > p {
            font-weight: 600;
            font-size: 26px;
            color: #0F1E47;
            word-break: break-word;
        }

.accordion-myEvoucher span:target ~ .accordion-myEvoucher-content {
    display: block;
    height: auto;
    padding: 2px 20px 12px;
    background: #EDEFF5;
    -webkit-border-bottom-right-radius: 6px;
    -webkit-border-bottom-left-radius: 6px;
    -moz-border-radius-bottomright: 6px;
    -moz-border-radius-bottomleft: 6px;
    border-bottom-right-radius: 6px;
    border-bottom-left-radius: 6px;
}

.accordion-myEvoucher span:target ~ [id*="close-accordion-myEvoucher"] {
    display: block;
    background: #EDEFF5 !important;
    -webkit-border-top-left-radius: 6px;
    -webkit-border-top-right-radius: 6px;
    -moz-border-radius-topleft: 6px;
    -moz-border-radius-topright: 6px;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}

.accordion-myEvoucher span:target ~ [id*="open-accordion-myEvoucher"] {
    display: none;
}

.accordion-myEvoucher span:target ~ [id*="close-accordion-myEvoucher"]:after {
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
}

._my_gift .accordion-myEvoucher ._date_dadoi_mobile {
    display: none;
}

.btn-bgPrimary {
    /*
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 16px 40px;
    gap: 10px;
    width: 197px;
    height: 51px;
    */
    /* position: absolute; */
    /* top: 173px; */
    /* padding-top: 32px; */
    background: #506CFF;
    border-radius: 50px;
    color: #fff !important;
    font-weight: 400;
    font-size: 16px;
    border: none;
    margin-top: 16px;
    cursor: pointer;
    display: inline-block;
    padding: 12px 20px;
}


/* // accordition -------------------- */
.row-title--of-list {
    padding: 0 12px;
}

    .row-title--of-list div {
        display: inline-block;
    }

        .row-title--of-list div:nth-of-type(1) {
            width: 12%;
        }

        .row-title--of-list div:nth-of-type(2) {
            width: 58%;
        }

        .row-title--of-list div:nth-of-type(3) {
            width: 12%;
        }

        .row-title--of-list div:nth-of-type(4) {
            width: 16%;
        }

.row-title--of-table {
    padding: 0 1%;
}

    .row-title--of-table div {
        display: inline-block;
    }

        .row-title--of-table div:nth-of-type(1) {
            width: 7%;
            font-family: 'SVN-Gilroy';
            font-style: normal;
            font-weight: 600;
            font-size: 14px;
            line-height: 15px;
        }

        .row-title--of-table div:nth-of-type(2) {
            width: 39%;
            font-family: 'SVN-Gilroy';
            font-style: normal;
            font-weight: 600;
            font-size: 14px;
            line-height: 15px;
        }

        .row-title--of-table div:nth-of-type(3) {
            width: 13%;
            font-family: 'SVN-Gilroy';
            font-style: normal;
            font-weight: 600;
            font-size: 14px;
            line-height: 15px;
            text-align: center;
        }

        .row-title--of-table div:nth-of-type(4) {
            width: 13%;
            font-family: 'SVN-Gilroy';
            font-style: normal;
            font-weight: 600;
            font-size: 14px;
            line-height: 15px;
            text-align: center;
        }

        .row-title--of-table div:nth-of-type(5) {
            width: 13%;
            font-family: 'SVN-Gilroy';
            font-style: normal;
            font-weight: 600;
            font-size: 14px;
            line-height: 15px;
            text-align: center;
        }

        .row-title--of-table div:nth-of-type(6) {
            width: 13%;
            font-family: 'SVN-Gilroy';
            font-style: normal;
            font-weight: 600;
            font-size: 14px;
            line-height: 15px;
            text-align: center;
        }
/* page ------------------------- */
.paging {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    grid-auto-flow: row;
    -webkit-box-pack: right;
    -ms-flex-pack: right;
    justify-content: right;
    margin-top: 20px;
}

    .paging > li a {
        cursor: pointer;
        margin: 0px 6px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        min-width: 30px;
        max-width: 30px;
        min-height: 30px;
        max-height: 30px;
        font-weight: 500;
        color: #828AA0;
        line-height: 1;
        background: #fff;
        border: 1px solid #e7e8eb;
        border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        -ms-border-radius: 5px;
        -o-border-radius: 5px;
    }

        .paging > li a:hover, .paging > li a:focus {
            text-decoration: none;
            background: #828AA0;
            border: 1px solid #828aa0;
            color: #fff;
        }

    .paging .active a {
        background: #828AA0;
        border: 1px solid #828aa0;
        color: #fff;
    }

    .paging .pre i {
        background: url("../images/page-arrow.svg") center no-repeat;
        background-size: 16px;
        width: 16px;
        height: 16px;
        transform: rotate(-180deg);
        -webkit-transform: rotate(-180deg);
        -moz-transform: rotate(-180deg);
        -ms-transform: rotate(-180deg);
        -o-transform: rotate(-180deg);
    }

    .paging .pre a.disabled {
        opacity: .5;
        cursor: not-allowed !important;
    }

        .paging .pre a.disabled:hover {
            background-color: unset;
        }

    .paging .nxt i {
        background: url("../images/page-arrow.svg") center no-repeat;
        background-size: 16px;
        width: 16px;
        height: 16px;
    }

    .paging .nxt a.disabled {
        opacity: .5;
        cursor: not-allowed;
    }

        .paging .nxt a.disabled:hover {
            background-color: unset;
        }

/*block head LSĐ*/
.point-history--block-head {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

    .point-history--block-head .col--left {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

        .point-history--block-head .col--left div {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
        }

        .point-history--block-head .col--left .icon-gold {
            background: #ccc;
            width: 50px;
            height: 50px;
            border-radius: 8px;
            -webkit-border-radius: 8px;
            -moz-border-radius: 8px;
            -ms-border-radius: 8px;
            -o-border-radius: 8px;
        }

    .point-history--block-head .col--right {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

.footer,
.point-history--block-head {
    width: 100%;
    background-color: #F5F7FB;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

    .footer > .logofoot,
    .point-history--block-head > .row-div {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        padding: 40px 0;
        width: 100%;
        max-width: 100%;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

        .footer > .logofoot div,
        .point-history--block-head > .row-div div {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
        }

            .footer > .logofoot div img,
            .point-history--block-head > .row-div div img {
                width: 50px;
                height: 50px;
                margin-right: 16px;
            }

.block-head--history {
    padding: 50px;
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
}

    .block-head--history .block-left {
        color: #0F1E47;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        /*&>div{
            display: flex;
        }*/
        display: table;
    }

        .block-head--history .block-left div {
            display: table-cell;
            vertical-align: middle;
        }

        .block-head--history .block-left .i-fgold span {
            background: #FFF5D8;
            width: 58px;
            height: 58px;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            border-radius: 8px;
            -webkit-border-radius: 8px;
            -moz-border-radius: 8px;
            -ms-border-radius: 8px;
            -o-border-radius: 8px;
        }

            .block-head--history .block-left .i-fgold span img {
                width: 40px;
            }

        .block-head--history .block-left .gold-available {
            line-height: 1;
            padding: 0 28px;
        }

            .block-head--history .block-left .gold-available h6 {
                margin: 4px 0 10px;
                font-size: 13px;
            }

            .block-head--history .block-left .gold-available div {
                font-weight: 600;
                font-size: 32px;
            }

        .block-head--history .block-left .text-desc {
            font-size: 13px;
        }

            .block-head--history .block-left .text-desc span {
                font-weight: 600;
            }

    .block-head--history .block-right {
        display: -ms-flexbox;
        display: -webkit-box;
        display: flex;
        -ms-flex-positive: 1;
        -webkit-box-flex: 1;
        flex-grow: 1;
        -ms-flex-pack: end;
        -webkit-box-pack: end;
        justify-content: flex-end;
        -ms-flex-align: center;
        -webkit-box-align: center;
        align-items: center;
    }

        .block-head--history .block-right > div {
            padding-left: 20px;
        }

            .block-head--history .block-right > div .btn-gift {
                display: inline-block;
                text-decoration: none;
                background: #fff;
                border: 1px solid #777;
                color: #222;
                font-weight: 500;
                padding: 11px 20px;
                line-height: 1.2;
                cursor: pointer;
                border-radius: 32px;
                -webkit-border-radius: 32px;
                -moz-border-radius: 32px;
                -ms-border-radius: 32px;
                -o-border-radius: 32px;
            }

            .block-head--history .block-right > div .btn-invite {
                display: inline-block;
                text-decoration: none;
                background: -webkit-gradient(linear, left top, right top, from(#4CA7EE), to(#506CFF));
                background: linear-gradient(to right, #4CA7EE, #506CFF);
                color: #fff;
                border: 1px solid #4CA7EE;
                font-weight: 500;
                padding: 11px 20px;
                line-height: 1.2;
                cursor: pointer;
                border-radius: 32px;
                -webkit-border-radius: 32px;
                -moz-border-radius: 32px;
                -ms-border-radius: 32px;
                -o-border-radius: 32px;
            }

/* modal css */
.popup_main, .popup_main__2 {
    /* https://code.io/httpdxxx/pen/VwQgQvP */
}

    .popup_main .open_popup, .popup_main__2 .open_popup {
        background: tomato;
        border: none;
        padding: 5px 15px;
        color: #fff;
    }

    .popup_main .popup_body, .popup_main .popup_body__2, .popup_main__2 .popup_body, .popup_main__2 .popup_body__2 {
        display: none;
        position: fixed;
        z-index: 999;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        -webkit-transition: 300ms;
        transition: 300ms;
    }

        .popup_main .popup_body .popup_contain, .popup_main .popup_body .popup_contain__2, .popup_main .popup_body__2 .popup_contain, .popup_main .popup_body__2 .popup_contain__2, .popup_main__2 .popup_body .popup_contain, .popup_main__2 .popup_body .popup_contain__2, .popup_main__2 .popup_body__2 .popup_contain, .popup_main__2 .popup_body__2 .popup_contain__2 {
            position: relative;
            background: #fff;
            min-width: 400px;
            max-width: 80%;
            margin: auto;
            min-height: 150px;
            padding: 24px 20px;
            border-radius: 12px;
            -webkit-border-radius: 12px;
            -moz-border-radius: 12px;
            -ms-border-radius: 12px;
            -o-border-radius: 12px;
            max-height: 100%;
            overflow-y: auto;
        }

            .popup_main .popup_body .popup_contain .popup_close, .popup_main .popup_body .popup_contain .popup_close__2, .popup_main .popup_body .popup_contain__2 .popup_close, .popup_main .popup_body .popup_contain__2 .popup_close__2, .popup_main .popup_body__2 .popup_contain .popup_close, .popup_main .popup_body__2 .popup_contain .popup_close__2, .popup_main .popup_body__2 .popup_contain__2 .popup_close, .popup_main .popup_body__2 .popup_contain__2 .popup_close__2, .popup_main__2 .popup_body .popup_contain .popup_close, .popup_main__2 .popup_body .popup_contain .popup_close__2, .popup_main__2 .popup_body .popup_contain__2 .popup_close, .popup_main__2 .popup_body .popup_contain__2 .popup_close__2, .popup_main__2 .popup_body__2 .popup_contain .popup_close, .popup_main__2 .popup_body__2 .popup_contain .popup_close__2, .popup_main__2 .popup_body__2 .popup_contain__2 .popup_close, .popup_main__2 .popup_body__2 .popup_contain__2 .popup_close__2 {
                text-align: center;
                position: absolute;
                cursor: pointer;
            }

            .popup_main .popup_body .popup_contain .p--header, .popup_main .popup_body .popup_contain__2 .p--header, .popup_main .popup_body__2 .popup_contain .p--header, .popup_main .popup_body__2 .popup_contain__2 .p--header, .popup_main__2 .popup_body .popup_contain .p--header, .popup_main__2 .popup_body .popup_contain__2 .p--header, .popup_main__2 .popup_body__2 .popup_contain .p--header, .popup_main__2 .popup_body__2 .popup_contain__2 .p--header {
                font-size: 22px;
                font-weight: 600;
                margin-bottom: 12px;
            }

            .popup_main .popup_body .popup_contain .div-img, .popup_main .popup_body .popup_contain__2 .div-img, .popup_main .popup_body__2 .popup_contain .div-img, .popup_main .popup_body__2 .popup_contain__2 .div-img, .popup_main__2 .popup_body .popup_contain .div-img, .popup_main__2 .popup_body .popup_contain__2 .div-img, .popup_main__2 .popup_body__2 .popup_contain .div-img, .popup_main__2 .popup_body__2 .popup_contain__2 .div-img {
                margin-bottom: 24px;
            }

                .popup_main .popup_body .popup_contain .div-img img, .popup_main .popup_body .popup_contain__2 .div-img img, .popup_main .popup_body__2 .popup_contain .div-img img, .popup_main .popup_body__2 .popup_contain__2 .div-img img, .popup_main__2 .popup_body .popup_contain .div-img img, .popup_main__2 .popup_body .popup_contain__2 .div-img img, .popup_main__2 .popup_body__2 .popup_contain .div-img img, .popup_main__2 .popup_body__2 .popup_contain__2 .div-img img {
                    width: 100%;
                }

            .popup_main .popup_body .popup_contain .title-name, .popup_main .popup_body .popup_contain__2 .title-name, .popup_main .popup_body__2 .popup_contain .title-name, .popup_main .popup_body__2 .popup_contain__2 .title-name, .popup_main__2 .popup_body .popup_contain .title-name, .popup_main__2 .popup_body .popup_contain__2 .title-name, .popup_main__2 .popup_body__2 .popup_contain .title-name, .popup_main__2 .popup_body__2 .popup_contain__2 .title-name {
                font-size: 19px;
                color: #000;
            }

                .popup_main .popup_body .popup_contain .title-name span, .popup_main .popup_body .popup_contain__2 .title-name span, .popup_main .popup_body__2 .popup_contain .title-name span, .popup_main .popup_body__2 .popup_contain__2 .title-name span, .popup_main__2 .popup_body .popup_contain .title-name span, .popup_main__2 .popup_body .popup_contain__2 .title-name span, .popup_main__2 .popup_body__2 .popup_contain .title-name span, .popup_main__2 .popup_body__2 .popup_contain__2 .title-name span {
                    color: #2959F0;
                }

            .popup_main .popup_body .popup_contain .div-desc, .popup_main .popup_body .popup_contain__2 .div-desc, .popup_main .popup_body__2 .popup_contain .div-desc, .popup_main .popup_body__2 .popup_contain__2 .div-desc, .popup_main__2 .popup_body .popup_contain .div-desc, .popup_main__2 .popup_body .popup_contain__2 .div-desc, .popup_main__2 .popup_body__2 .popup_contain .div-desc, .popup_main__2 .popup_body__2 .popup_contain__2 .div-desc {
                color: #555;
            }

                .popup_main .popup_body .popup_contain .div-desc b, .popup_main .popup_body .popup_contain__2 .div-desc b, .popup_main .popup_body__2 .popup_contain .div-desc b, .popup_main .popup_body__2 .popup_contain__2 .div-desc b, .popup_main__2 .popup_body .popup_contain .div-desc b, .popup_main__2 .popup_body .popup_contain__2 .div-desc b, .popup_main__2 .popup_body__2 .popup_contain .div-desc b, .popup_main__2 .popup_body__2 .popup_contain__2 .div-desc b {
                    color: #000;
                }

            .popup_main .popup_body .popup_contain .row-invite-text, .popup_main .popup_body .popup_contain__2 .row-invite-text, .popup_main .popup_body__2 .popup_contain .row-invite-text, .popup_main .popup_body__2 .popup_contain__2 .row-invite-text, .popup_main__2 .popup_body .popup_contain .row-invite-text, .popup_main__2 .popup_body .popup_contain__2 .row-invite-text, .popup_main__2 .popup_body__2 .popup_contain .row-invite-text, .popup_main__2 .popup_body__2 .popup_contain__2 .row-invite-text {
                padding: 8px 0;
            }

            .popup_main .popup_body .popup_contain .copy-code-invite, .popup_main .popup_body .popup_contain__2 .copy-code-invite, .popup_main .popup_body__2 .popup_contain .copy-code-invite, .popup_main .popup_body__2 .popup_contain__2 .copy-code-invite, .popup_main__2 .popup_body .popup_contain .copy-code-invite, .popup_main__2 .popup_body .popup_contain__2 .copy-code-invite, .popup_main__2 .popup_body__2 .popup_contain .copy-code-invite, .popup_main__2 .popup_body__2 .popup_contain__2 .copy-code-invite {
                background: #F3F5FF;
                text-align: center;
                padding: 24px 20px;
                border-radius: 8px;
                -webkit-border-radius: 8px;
                -moz-border-radius: 8px;
                -ms-border-radius: 8px;
                -o-border-radius: 8px;
            }

                .popup_main .popup_body .popup_contain .copy-code-invite p, .popup_main .popup_body .popup_contain__2 .copy-code-invite p, .popup_main .popup_body__2 .popup_contain .copy-code-invite p, .popup_main .popup_body__2 .popup_contain__2 .copy-code-invite p, .popup_main__2 .popup_body .popup_contain .copy-code-invite p, .popup_main__2 .popup_body .popup_contain__2 .copy-code-invite p, .popup_main__2 .popup_body__2 .popup_contain .copy-code-invite p, .popup_main__2 .popup_body__2 .popup_contain__2 .copy-code-invite p {
                    color: #828AA0;
                    font-size: 13px;
                }

                .popup_main .popup_body .popup_contain .copy-code-invite div, .popup_main .popup_body .popup_contain__2 .copy-code-invite div, .popup_main .popup_body__2 .popup_contain .copy-code-invite div, .popup_main .popup_body__2 .popup_contain__2 .copy-code-invite div, .popup_main__2 .popup_body .popup_contain .copy-code-invite div, .popup_main__2 .popup_body .popup_contain__2 .copy-code-invite div, .popup_main__2 .popup_body__2 .popup_contain .copy-code-invite div, .popup_main__2 .popup_body__2 .popup_contain__2 .copy-code-invite div {
                    color: #506CFF;
                    font-size: 25px;
                    font-weight: 600;
                }

                    .popup_main .popup_body .popup_contain .copy-code-invite div .btn-copy, .popup_main .popup_body .popup_contain__2 .copy-code-invite div .btn-copy, .popup_main .popup_body__2 .popup_contain .copy-code-invite div .btn-copy, .popup_main .popup_body__2 .popup_contain__2 .copy-code-invite div .btn-copy, .popup_main__2 .popup_body .popup_contain .copy-code-invite div .btn-copy, .popup_main__2 .popup_body .popup_contain__2 .copy-code-invite div .btn-copy, .popup_main__2 .popup_body__2 .popup_contain .copy-code-invite div .btn-copy, .popup_main__2 .popup_body__2 .popup_contain__2 .copy-code-invite div .btn-copy {
                        width: 32px;
                        height: 32px;
                        border: none;
                        outline: none;
                        background: url("/images/copy-icon.svg") center no-repeat;
                        background-size: 22px;
                        padding: 5px;
                    }

            .popup_main .popup_body .popup_contain .copy-link-invite, .popup_main .popup_body .popup_contain__2 .copy-link-invite, .popup_main .popup_body__2 .popup_contain .copy-link-invite, .popup_main .popup_body__2 .popup_contain__2 .copy-link-invite, .popup_main__2 .popup_body .popup_contain .copy-link-invite, .popup_main__2 .popup_body .popup_contain__2 .copy-link-invite, .popup_main__2 .popup_body__2 .popup_contain .copy-link-invite, .popup_main__2 .popup_body__2 .popup_contain__2 .copy-link-invite {
                background: #F3F5FF;
                text-align: center;
                padding: 8px 20px;
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                border-radius: 8px;
                -webkit-border-radius: 8px;
                -moz-border-radius: 8px;
                -ms-border-radius: 8px;
                -o-border-radius: 8px;
            }

                .popup_main .popup_body .popup_contain .copy-link-invite div, .popup_main .popup_body .popup_contain__2 .copy-link-invite div, .popup_main .popup_body__2 .popup_contain .copy-link-invite div, .popup_main .popup_body__2 .popup_contain__2 .copy-link-invite div, .popup_main__2 .popup_body .popup_contain .copy-link-invite div, .popup_main__2 .popup_body .popup_contain__2 .copy-link-invite div, .popup_main__2 .popup_body__2 .popup_contain .copy-link-invite div, .popup_main__2 .popup_body__2 .popup_contain__2 .copy-link-invite div {
                    display: -webkit-box;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-align: center;
                    -ms-flex-align: center;
                    align-items: center;
                    font-size: 13px;
                    color: #1F2636;
                    font-weight: 600;
                }

                .popup_main .popup_body .popup_contain .copy-link-invite span, .popup_main .popup_body .popup_contain__2 .copy-link-invite span, .popup_main .popup_body__2 .popup_contain .copy-link-invite span, .popup_main .popup_body__2 .popup_contain__2 .copy-link-invite span, .popup_main__2 .popup_body .popup_contain .copy-link-invite span, .popup_main__2 .popup_body .popup_contain__2 .copy-link-invite span, .popup_main__2 .popup_body__2 .popup_contain .copy-link-invite span, .popup_main__2 .popup_body__2 .popup_contain__2 .copy-link-invite span {
                    display: -webkit-box;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-align: center;
                    -ms-flex-align: center;
                    align-items: center;
                    font-size: 13px;
                    font-weight: 400;
                    color: #828AA0;
                    padding: 0 8px;
                }

                .popup_main .popup_body .popup_contain .copy-link-invite .btn-copy, .popup_main .popup_body .popup_contain__2 .copy-link-invite .btn-copy, .popup_main .popup_body__2 .popup_contain .copy-link-invite .btn-copy, .popup_main .popup_body__2 .popup_contain__2 .copy-link-invite .btn-copy, .popup_main__2 .popup_body .popup_contain .copy-link-invite .btn-copy, .popup_main__2 .popup_body .popup_contain__2 .copy-link-invite .btn-copy, .popup_main__2 .popup_body__2 .popup_contain .copy-link-invite .btn-copy, .popup_main__2 .popup_body__2 .popup_contain__2 .copy-link-invite .btn-copy {
                    display: -webkit-box;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: center;
                    -ms-flex-pack: center;
                    justify-content: center;
                    -webkit-box-align: center;
                    -ms-flex-align: center;
                    align-items: center;
                    width: 32px;
                    height: 32px;
                    border: none;
                    outline: none;
                    background: url("/images/copy-icon.svg") center no-repeat;
                    background-size: 22px;
                    padding: 5px;
                }

        .popup_main .popup_body .popup_back, .popup_main .popup_body .popup_back__2, .popup_main .popup_body__2 .popup_back, .popup_main .popup_body__2 .popup_back__2, .popup_main__2 .popup_body .popup_back, .popup_main__2 .popup_body .popup_back__2, .popup_main__2 .popup_body__2 .popup_back, .popup_main__2 .popup_body__2 .popup_back__2 {
            background: rgba(0, 0, 0, 0.4);
            position: fixed;
            left: 0;
            right: 0;
            top: 0;
            bottom: 0;
        }

    .popup_main .popup_body_show, .popup_main .popup_body_show__2, .popup_main__2 .popup_body_show, .popup_main__2 .popup_body_show__2 {
        display: block;
        padding-left: 0 !important;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-transition: 300ms;
        transition: 300ms;
    }

.tab_content-point .tag-gotit .diem-doi .ellipses {
    -webkit-line-clamp: 1;
}

.tab_content-point .tag-gotit .diem-doi .fsize14 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.tab_content-point .tag-gotit .title {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

@media(max-width: 767px) {
    .br-share {
        display: none;
    }

    .condition_display_policy {
        display: none !important;
    }
}

@media(min-width: 768px) {

    .condition_display {
        display: none !important;
    }

    .popup-container {
        display: flex !important;
        gap: 20px !important;
    }

    .gtbb-text {
        margin-bottom: 12px !important;
    }

    .copy-code-invite {
        padding: 8px 20px !important
    }

    .popup-section {
        width: 50% !important;
        padding: 0 15px !important;
    }

    .block-share-code .row-head {
        /* text-align: center;
            border-bottom: 1px solid #E0E0E0;*/
        padding-bottom: 8px !important;
        /*margin-bottom: 16px;*/
        padding-top: 20px !important;
    }

    ul.pop--icon-gtbb li {
        flex: 0 1 10% !important;
    }

        ul.pop--icon-gtbb li > div {
            width: 85px !important;
            margin: 8px 5px !important;
        }

    /*span.copy-link-invite-text {
        float: left !important;
    }*/

    .border-btn-share {
        -webkit-border-radius: 8px !important;
    }
}

@media(max-width: 767px) {
    span.copy-link-invite-text {
        float: left !important;
        line-height: 32px !important;
    }

    span#display-contract-url {
        line-height: 24px !important;
        width: 100% !important;
        /*overflow: hidden;*/
    }
}

@media(min-width: 768px) {
    .popup_contain.pop-gtbb, .popup_contain__2.pop-gtbb {
        max-width: 1085px !important;
        width: auto !important;
    }

    .full-contract {
        width: auto !important;
    }

    .copy_btn_invite {
        padding-bottom: 5px !important;
    }

    .btn-copy-md {
        position: relative !important;
        right: 0 !important;
        padding: 0 20px !important;
        height: 20px !important;
        width: 20px !important;
    }
}

.row-invite-text {
    position: relative;
}

.popup_contain.pop-gtbb, .popup_contain__2.pop-gtbb {
    width: 480px;
}

.block-share-code .row-head {
    text-align: center;
    border-bottom: 1px solid #E0E0E0;
    padding-bottom: 20px;
    margin-bottom: 16px;
}

    .block-share-code .row-head span {
        display: inline-block;
        background: #EFF8FF;
        width: 140px;
        height: 140px;
        line-height: 140px;
        margin-bottom: 20px;
        border-radius: 50%;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -ms-border-radius: 50%;
        -o-border-radius: 50%;
    }

    .block-share-code .row-head h4 {
        color: #0F1E47;
        font-size: 24px;
    }

ul.pop--icon-gtbb {
    list-style: none;
    padding: 0;
    margin: 0 0 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    justify-content: center;
}

    ul.pop--icon-gtbb li {
        -webkit-box-flex: 0;
        -ms-flex: 0 1 33.33333%;
        flex: 0 1 33.33333%;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

        ul.pop--icon-gtbb li > div {
            background: #F3F4F9;
            width: 128px;
            height: 128px;
            margin: 8px auto;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            border-radius: 8px
        }

            ul.pop--icon-gtbb li > div div {
                text-align: center;
                width: 100%;
            }

                ul.pop--icon-gtbb li > div div > span {
                    margin: auto;
                    border-radius: 12px;
                    -webkit-border-radius: 12px;
                    -moz-border-radius: 12px;
                    -ms-border-radius: 12px;
                    -o-border-radius: 12px;
                }

                    ul.pop--icon-gtbb li > div div > span img {
                        width: 50px;
                        margin: 0 auto;
                        border-radius: 8px;
                    }

            ul.pop--icon-gtbb li > div a {
                text-align: center;
                width: 100%;
                text-decoration: none;
                color: black;
            }

                ul.pop--icon-gtbb li > div a > span {
                    margin: auto;
                    border-radius: 12px;
                    -webkit-border-radius: 12px;
                    -moz-border-radius: 12px;
                    -ms-border-radius: 12px;
                    -o-border-radius: 12px;
                }

                    ul.pop--icon-gtbb li > div a > span img {
                        width: 50px;
                        margin: 0 auto;
                    }

ul.pop--icon-mathe {
    list-style: none;
    padding: 0;
    margin: 0 0 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

    /* ul.pop--icon-mathe li {
        background: #f3f4f9;
        width: 136px;
        height: 60px;
        margin: 9px 4px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        border-radius: 4px;
        cursor: pointer;
    }*/


    ul.pop--icon-mathe li {
        background: #f3f4f9;
        width: 142px;
        height: 60px;
        margin: 8px auto;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        border-radius: 4px;
        box-sizing: border-box;
        border: 2px solid #fff;
        cursor: pointer;
    }

        ul.pop--icon-mathe li:hover, ul.pop--icon-mathe li.active {
            border-color: #2959F0;
            border-radius: 4px;
            box-sizing: border-box
        }

        ul.pop--icon-mathe li > div {
            background: #f3f4f9;
            width: 128px;
            margin: 8px auto;
        }

            ul.pop--icon-mathe li > div div {
                text-align: center;
                width: 100%;
            }

                ul.pop--icon-mathe li > div div > p {
                    font-family: SVN-Gilroy;
                    font-weight: 600;
                    font-size: 17px;
                    align-items: center;
                    line-height: 20.4px
                }

                ul.pop--icon-mathe li > div div > span {
                    margin: auto;
                    border-radius: 12px;
                    -webkit-border-radius: 12px;
                    -moz-border-radius: 12px;
                    -ms-border-radius: 12px;
                    -o-border-radius: 12px;
                    font-family: SVN-Gilroy;
                    font-weight: 600;
                    font-size: 14px;
                    align-items: center;
                    line-height: 20.72px;
                    color: #FFAE15;
                }


ul.pop--icon-gtbb li > div div > span img {
}

#list-gia-tien li {
    margin: 8px 2px;
}

.pop--serviceprovider {
    width: 191px;
    height: 28px;
    font-style: normal;
    font-weight: 500;
    font-size: 17px;
    line-height: 148%;
    font-family: 'SVN-Gilroy';
}

.open_popup__2.btn--share-code {
    background: #506CFF;
    color: #fff;
    font-weight: 500;
    padding: 10px 20px;
    width: 80%;
    display: block;
    text-align: center;
    margin: 0 auto;
    outline: none;
    border: none;
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    -o-border-radius: 20px;
}

.open_popup__2.policy-guidelines {
    padding: 20px 20px 10px;
    width: 80%;
    display: block;
    text-align: center;
    margin: 0 auto;
    outline: none;
    border: none;
    color: #4E5567;
    font-weight: 500;
    font-size: 14px;
}

.background-none {
    background: none !important;
}

/*.btn--close-pop span {*/
.btn--close-pop span, .btn--close-pop .btn-close {
    background: #636F7E;
    color: #fff;
    font-weight: 500;
    padding: 10px 20px;
    width: 120px;
    display: block;
    text-align: center;
    margin: 0 auto;
    cursor: pointer;
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    -o-border-radius: 20px;
    border: none;
    outline: none;
}

.policy-guidelines--content .text-head {
    font-weight: 700;
    font-size: 22px;
    color: #000;
    padding-bottom: 4px;
    border-bottom: 1px solid #DEE0E7;
    margin-bottom: 12px;
}

.policy-guidelines--content h4 {
    font-weight: 600;
    font-size: 19px;
    color: #506CFF;
    padding-bottom: 8px;
    line-height: 1.5;
}

.policy-guidelines--content h5 {
    font-weight: 600;
    font-size: 17px;
    color: #000;
    padding: 0 0 4px 0;
    line-height: 1.5;
}

.policy-guidelines--content .main-contain > div div {
    margin-bottom: 12px;
}

    .policy-guidelines--content .main-contain > div div:last-child {
        margin-bottom: 0;
    }

.showmore-questions .showmore-policy {
    height: 200px;
}

/* -----------------------------*/
.block-showmore__in_popup {
    position: relative;
}

    .block-showmore__in_popup .text__in_popup {
        position: relative;
    }

    .block-showmore__in_popup .show-more-height__in_popup {
        overflow: hidden;
    }

    .block-showmore__in_popup .show-more__in_popup {
        height: 20px;
        cursor: pointer;
    }

        .block-showmore__in_popup .show-more__in_popup span {
            color: #506CFF;
            font-weight: 500;
        }

        .block-showmore__in_popup .show-more__in_popup:hover span {
            border-bottom: 1px solid #000;
        }

.block-showmore__in_popup_2 {
    position: relative;
}

    .block-showmore__in_popup_2 .text__in_popup_2 {
        position: relative;
    }

    .block-showmore__in_popup_2 .show-more-height__in_popup_2 {
        overflow: hidden;
    }

    .block-showmore__in_popup_2 .show-more__in_popup_2 {
        height: 20px;
        cursor: pointer;
    }

        .block-showmore__in_popup_2 .show-more__in_popup_2 span {
            color: #506CFF;
            font-weight: 500;
            border-bottom: 1px solid transparent;
        }

        .block-showmore__in_popup_2 .show-more__in_popup_2:hover span {
            border-bottom: 1px solid #506CFF;
        }

[class*="show-more-height__in_popup"] {
    height: 230px;
}

.block-showmore-style {
    border-bottom: 1px solid #DEE0E7;
    padding-bottom: 12px;
    margin-bottom: 16px;
}

    .block-showmore-style:last-child {
        border-bottom: 0px solid #DEE0E7;
        margin-bottom: 0px;
    }

/* -----------------------------*/
.range-block {
    /*margin-top: 20px;*/
    width: 430px;
}

    .range-block .row-text-range {
        display: -ms-flexbox;
        display: -webkit-box;
        display: flex;
        font-size: 14px;
        line-height: 1.5;
    }

        .range-block .row-text-range .text-left {
            display: -ms-flexbox;
            display: -webkit-box;
            display: flex;
        }

        .range-block .row-text-range .text-right {
            display: -ms-flexbox;
            display: -webkit-box;
            display: flex;
            -ms-flex-positive: 1;
            -webkit-box-flex: 1;
            flex-grow: 1;
            -ms-flex-pack: end;
            -webkit-box-pack: end;
            justify-content: flex-end;
            -ms-flex-align: center;
            -webkit-box-align: center;
            align-items: center;
        }

    .range-block .range-bar {
        width: 100%;
        height: 6px;
        position: relative;
        background: rgba(255, 255, 255, 0.35);
        margin: 20px 0;
        border-radius: 20px;
        -webkit-border-radius: 20px;
        -moz-border-radius: 20px;
        -ms-border-radius: 20px;
        -o-border-radius: 20px;
        line-height: 36px;
    }

        .range-block .range-bar span.icon-left {
            position: absolute;
            left: 0;
            top: -16px;
            z-index: 1;
        }

            .range-block .range-bar span.icon-left img {
                width: 32px;
                border-radius: 100%;
                -webkit-border-radius: 100%;
                -moz-border-radius: 100%;
                -ms-border-radius: 100%;
                -o-border-radius: 100%;
            }

        .range-block .range-bar span.icon-right {
            position: absolute;
            right: 0;
            top: -16px;
            z-index: 1;
        }

            .range-block .range-bar span.icon-right img {
                width: 32px;
                border-radius: 100%;
                -webkit-border-radius: 100%;
                -moz-border-radius: 100%;
                -ms-border-radius: 100%;
                -o-border-radius: 100%;
            }

        .range-block .range-bar .range-number {
            height: 6px;
            position: absolute;
            left: 32px;
            top: 0;
            background: #3b69f8;
            border-radius: 20px;
            -webkit-border-radius: 0 20px 20px 0;
            -moz-border-radius: 0 20px 20px 0;
            -ms-border-radius: 0 20px 20px 0;
            -o-border-radius: 0 20px 20px 0;
        }

    .range-block p {
        font-size: 13px;
        font-weight: 500;
    }

        .range-block p span {
            color: #ffae15;
        }

    .range-block .range-bar .range-number.range-number-max {
        left: 0;
        -webkit-border-radius: 20px;
    }

.div-scroll {
    float: left;
    height: auto;
    width: calc(100% + 2px);
    overflow-y: auto;
    overflow-x: hidden;
}

.userrank-scroll {
    float: left;
    height: 400px;
    width: calc(100% + 2px);
    overflow-y: auto;
    overflow-x: hidden;
}

    .div-scroll .div-scroll--child {
        min-height: 100px;
        position: relative;
    }

.scrollbar-style1::-webkit-scrollbar {
    width: 4px;
}

.scrollbar-style1::-webkit-scrollbar-thumb {
    /* mau nen scroll khi chua hover */
    /*  */
    background-color: rgba(0, 0, 0, 0);
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
}

.scrollbar-style1:hover::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.1);
}

.h-100 {
    height: 100px;
}

.h-200 {
    height: 200px;
}

.h-250 {
    height: 250px;
}

.h-300 {
    height: 300px;
}

.h-350 {
    height: 350px;
}

.h-400 {
    height: 400px;
}

.h-450 {
    height: 450px;
}

.h-500 {
    height: 500px;
}

.h-550 {
    height: 550px;
}

.h-600 {
    height: 600px;
}

.h-650 {
    height: 650px;
}

.h-680 {
    height: 680px;
}

.h-710 {
    height: 710px;
    padding-top:20px; /*để chữ free ở voucher không bị che*/
}

.h-760 {
    height: 745px;
}

.h-780 {
    height: 780px;
}

.h-100perc {
    height: 100%;
}

.h-scroll-pop--auto {
    height: calc(100% - 84px);
}

.h-55vh {
    height: 55vh;
}

.h-60vh {
    height: 60vh;
}

.h-70vh {
    height: 70vh;
}

.h-80vh {
    height: 80vh;
}

.h-90vh {
    height: 90vh;
}

.div_tooltip {
    /* https://code.io/FiGu/pen/dopbea */
    cursor: pointer;
    position: relative;
    margin-top: -24px;
    height: 26px;
}

    .div_tooltip .div_tooltip--content {
        display: none;
        background: #fff;
        -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.12);
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.12);
        position: absolute;
        top: 100%;
    }

    .div_tooltip:hover .div_tooltip--content {
        display: block;
    }

.dropdown--contract {
    display: inline-block;
}

    .dropdown--contract a {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        font-weight: 500;
        text-decoration: none;
        color: #000;
        position: relative;
    }

        .dropdown--contract a .icon {
            margin-left: .25em;
        }

    .dropdown--contract .dropdown-nav--contract {
        display: none;
        opacity: 0;
        width: 98%;
        left: 0;
        -webkit-transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s cubic-bezier(0.88, -0.72, 0, 1);
        transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s cubic-bezier(0.88, -0.72, 0, 1);
        transition: transform 0.3s cubic-bezier(0.88, -0.72, 0, 1), opacity 0.3s ease-in-out;
        transition: transform 0.3s cubic-bezier(0.88, -0.72, 0, 1), opacity 0.3s ease-in-out, -webkit-transform 0.3s cubic-bezier(0.88, -0.72, 0, 1);
        -webkit-transform: translateY(-4rem);
        transform: translateY(-4rem);
        list-style: none;
        position: absolute;
        position: fixed;
        width: 500px;
        left: calc(50% - 0px);
        z-index: 1;
        padding: 12px;
        background: #fff;
        border: 1px solid #f5f5f5;
        -webkit-box-shadow: 0 0 30px -10px rgba(0, 0, 0, 0.4);
        box-shadow: 0 0 30px -10px rgba(0, 0, 0, 0.4);
        transition: all 0.1s ease;
        -webkit-transition: all 0.1s ease;
        -moz-transition: all 0.1s ease;
        -ms-transition: all 0.1s ease;
        -o-transition: all 0.1s ease;
        border-radius: 8px;
        -webkit-border-radius: 8px;
        -moz-border-radius: 8px;
        -ms-border-radius: 8px;
        -o-border-radius: 8px;
    }

        .dropdown--contract .dropdown-nav--contract li {
            border: 1px solid #e5e5e5;
            background: #f9f9f9;
            padding: 10px 12px;
            margin-bottom: 12px;
            margin-right: 4px;
            cursor: pointer;
            border-radius: 8px;
            -webkit-border-radius: 8px;
            -moz-border-radius: 8px;
            -ms-border-radius: 8px;
            -o-border-radius: 8px;
        }

            .dropdown--contract .dropdown-nav--contract li:last-child {
                margin-bottom: 0px;
            }

            .dropdown--contract .dropdown-nav--contract li:hover, .dropdown--contract .dropdown-nav--contract li.active {
                border: 1px solid #2959F0;
                background: #F3F5FF;
            }


            .dropdown--contract .dropdown-nav--contract li div {
                font-size: 18px;
                color: rgba(32, 28, 100, 0.8);
                padding-bottom: 4px;
            }

                .dropdown--contract .dropdown-nav--contract li div b {
                    color: #201c64;
                    font-weight: 600;
                }

            .dropdown--contract .dropdown-nav--contract li p {
                font-size: 14px;
            }

    .dropdown--contract.active .dropdown-nav--contract {
        display: block;
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
        box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    }

@media(min-width: 768px) {
    .dropdown--contract.active .dropdown-nav--contract {
        position: absolute;
        top: 31px;
        left: 0;
        width: 100%;
    }

    .custom-line {
        width: 280px;
        border-top: 2px solid #8c8b8b;
        margin-top: -19px;
        margin-bottom: 17px;
    }
}

@media(max-width: 767px) {
    .dropdown--contract.active .dropdown-nav--contract {
        position: absolute;
        left: 0;
        width: 100%;
    }

    .userrank-scroll {
        height: 340px !important;
    }
}

.dropdown--contract a.contact-text {
    min-width: calc(100% - 14px);
    cursor: pointer;
}

    .dropdown--contract a.contact-text::after {
        content: '';
        position: absolute;
        z-index: 11;
        right: -28px;
        bottom: -2px;
        background: url(../images/arow-right-color.svg) center no-repeat;
        background-size: 28px;
        width: 28px;
        height: 28px;
    }

.dropdown--contract.active a.contact-text::after {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    -ms-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.div-scroll.scrollbar-style1.h-250.mb-0 {
    max-height: 145px;
    overflow: hidden;
    overflow-y: auto;
}


.close-button {
    position: absolute;
    right: 10px;
    top: 10px;
    width: 24px;
    height: 24px;
    opacity: 0.6;
    z-index: 1;
}

    .close-button:hover {
        opacity: 1;
    }

    .close-button:before {
        position: absolute;
        left: 12px;
        content: ' ';
        height: 24px;
        width: 2px;
        background-color: #333;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
    }

    .close-button:after {
        position: absolute;
        left: 12px;
        content: ' ';
        height: 24px;
        width: 2px;
        background-color: #333;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }

.owl--voucher-card {
    margin-left: 0;
    margin-right: 0;
}

    .owl--voucher-card.owl-carousel .owl-next,
    .owl--voucher-card.owl-carousel .owl-prev {
        color: #ccc;
        border-color: transparent;
        background: transparent;
    }

        .owl--voucher-card.owl-carousel .owl-next:hover,
        .owl--voucher-card.owl-carousel .owl-prev:hover,
        .owl--voucher-card.owl-carousel .owl-next.disabled:hover,
        .owl--voucher-card.owl-carousel .owl-prev.disabled:hover {
            color: #a1a1a1;
            border-color: transparent;
            background: transparent;
        }

        .owl--voucher-card.owl-carousel .owl-next.disabled:hover,
        .owl--voucher-card.owl-carousel .owl-prev.disabled:hover {
            cursor: not-allowed;
        }

.itemVoucher {
    position: relative;
    /*height: 170px;*/
    padding: 0 16px;
}

    .itemVoucher span {
        cursor: pointer;
    }

.owl-carousel .owl-item .itemVoucher img {
    height: 100%;
    border-radius: 10px;
}

.owl-carousel.owl--voucher-card .owl-next,
.owl-carousel.owl--voucher-card .owl-prev {
    background: #fff;
    opacity: .9;
}

    .owl-carousel.owl--voucher-card .owl-next:hover,
    .owl-carousel.owl--voucher-card .owl-prev:hover {
        background: #fff;
        opacity: 1;
    }

.block-tab--content .col-sm-12 > div.owl--voucher-card {
    padding: 0;
    background: none;
    margin-bottom: 20px;
}

    .block-tab--content .col-sm-12 > div.owl--voucher-card .owl-prev, .block-tab--content .col-sm-12 > div.owl--voucher-card .owl-next {
        line-height: 40px;
    }

.block-tab--content .col-sm-12 > div.tab-list-voucher {
    padding: 0;
    background: none;
}

.tabs-point-history.tab-list-voucher .parents-tabs {
    padding: 0;
}

.tabs-point-history.tab-list-voucher ul.tabs {
    border-bottom: none;
    background: #fff;
    padding-top: 12px;
    margin-top: 12px;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    width: 100%;
    overflow: hidden;
    overflow-x: auto;
    display: flex;
}

    /* width */
    .tabs-point-history.tab-list-voucher ul.tabs::-webkit-scrollbar {
        width: 5px;
        height: 5px;
    }

    /* Track */
    .tabs-point-history.tab-list-voucher ul.tabs::-webkit-scrollbar-track {
    }

    /* Handle */
    .tabs-point-history.tab-list-voucher ul.tabs::-webkit-scrollbar-thumb {
        background: #939393;
    }

        /* Handle on hover */
        .tabs-point-history.tab-list-voucher ul.tabs::-webkit-scrollbar-thumb:hover {
            background: #939393;
        }

    .tabs-point-history.tab-list-voucher ul.tabs li {
        padding: 0 8px 10px;
        font-weight: 600;
        white-space: nowrap;
        flex: auto;
    }

        .tabs-point-history.tab-list-voucher ul.tabs li img:nth-of-type(1) {
            display: inline-block;
        }

        .tabs-point-history.tab-list-voucher ul.tabs li img:nth-of-type(2) {
            display: none;
        }

        .tabs-point-history.tab-list-voucher ul.tabs li.active img:nth-of-type(1) {
            display: none;
        }

        .tabs-point-history.tab-list-voucher ul.tabs li.active img:nth-of-type(2) {
            display: inline-block;
        }

.list-voucher-contain > div > div {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    min-height: 80px;
    margin-bottom: 20px;
    padding: 0;
    margin-bottom: 0;
    border-radius: 15px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    -ms-border-radius: 15px;
    -o-border-radius: 15px;
}

    .list-voucher-contain > div > div div.left-block {
        padding: 16px 0 16px 16px;
        width: 35%;
        overflow: hidden;
    }

        .list-voucher-contain > div > div div.left-block img {
            width: 182px;
            height: 182px;
            -o-object-fit: cover;
            object-fit: cover;
            border-radius: 10px;
            -webkit-border-radius: 10px;
            -moz-border-radius: 10px;
            -ms-border-radius: 10px;
            -o-border-radius: 10px;
        }

    .list-voucher-contain > div > div div.right-block {
        background: url("../images/voucher_line214.png") top left no-repeat;
        background-size: 32px auto;
        height: 214px;
        padding: 24px 32px 24px 48px;
        position: relative;
        width: 65%;
    }

        .list-voucher-contain > div > div div.right-block > span {
            font-size: 18px;
            font-weight: 700;
            display: block;
            line-height: 1.2;
        }

        .list-voucher-contain > div > div div.right-block span > b {
            display: none;
        }

        .list-voucher-contain > div > div div.right-block p {
            font-size: 14px;
            padding: 12px 0;
            /*height: 56px;*/
            overflow: hidden;
        }

        .list-voucher-contain > div > div div.right-block span > strong {
            display: block;
        }

.block-tab--content .list-voucher-contain .col-sm-12 > div {
    padding: 0;
}

.popup_main_voucher .open_popup_voucher {
    border: none;
}

.popup_main_voucher .popup_body_voucher {
    display: none;
    position: fixed;
    z-index: 999;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    -webkit-transition: 300ms;
    transition: 300ms;
}

    .popup_main_voucher .popup_body_voucher .popup_contain_voucher {
        position: relative;
        background: #fff;
        min-width: 400px;
        max-width: 80%;
        margin: auto;
        min-height: 150px;
        padding: 24px 20px;
        border-radius: 12px;
        -webkit-border-radius: 12px;
        -moz-border-radius: 12px;
        -ms-border-radius: 12px;
        -o-border-radius: 12px;
    }

        .popup_main_voucher .popup_body_voucher .popup_contain_voucher .popup_close_voucher {
            text-align: center;
            position: absolute;
            cursor: pointer;
        }

    .popup_main_voucher .popup_body_voucher .popup_back_voucher {
        background: rgba(0, 0, 0, 0.4);
        position: fixed;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
    }

.popup_main_voucher .popup_body_show_voucher {
    display: block;
    padding-left: 0 !important;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-transition: 300ms;
    transition: 300ms;
}

.pop-gift {
    display: none;
    position: fixed;
    background: #ccc;
    width: 100%;
    z-index: 999;
}

    .pop-gift .pop-gift_back {
        background: rgba(0, 0, 0, 0.4);
        position: fixed;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
    }

    .pop-gift .pop-gift-content {
        width: 500px;
        height: 650px;
        position: fixed;
        left: calc(50% - 250px);
        top: calc(50% - 325px);
        background: #fff;
        color: #636F7E;
        padding: 28px;
        border-radius: 12px;
        -webkit-border-radius: 12px;
        -moz-border-radius: 12px;
        -ms-border-radius: 12px;
        -o-border-radius: 12px;
    }

        .pop-gift .pop-gift-content h4 {
            font-weight: 700;
            font-size: 22px;
            color: #1F2636;
            margin-bottom: 16px;
            height: 26px;
            overflow-y: hidden;
            line-height: 26px;
        }

        .pop-gift .pop-gift-content .img-gift {
            width: 100%;
        }

        .pop-gift .pop-gift-content .div-gold-num {
            background: linear-gradient(140.62deg, #8FA3F8 16.46%, #6889EF 72.42%);
            color: #fff;
            font-weight: 600;
            line-height: 26px;
            font-size: 18px;
            padding: 16px 20px;
            width: 100%;
            height: 60px;
            display: block;
            margin: 14px auto;
            outline: none;
            border: none;
            position: relative;
            border-radius: 8px;
            -webkit-border-radius: 8px;
            -moz-border-radius: 8px;
            -ms-border-radius: 8px;
            -o-border-radius: 8px;
        }

            .pop-gift .pop-gift-content .div-gold-num > div {
                position: absolute;
                right: 20px;
                top: 15px;
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
            }

                .pop-gift .pop-gift-content .div-gold-num > div img {
                    width: 24px;
                    margin-right: 4px;
                }

                .pop-gift .pop-gift-content .div-gold-num > div span {
                    line-height: 30px;
                }

.pop-gift-show {
    display: block;
    background: transparent !important;
    height: 0 !important;
    min-height: unset !important;
    padding: 0 !important;
    margin: 0 !important;
}

.btn--close-pop.two-btn-inline {
    text-align: center;
}

    .btn--close-pop.two-btn-inline .btn-close {
        display: inline-block;
        margin-left: 10px;
        margin-right: 10px;
        width: calc(50% - 25px);
    }

.btn--close-pop .btn-close.btn-blue {
    background: #506CFF;
}

.title-24 {
    font-size: 24px;
    font-weight: 700;
    color: #0F1E47;
    line-height: 2;
    padding: 0;
}

@media screen and (max-width: 1200px) {
    .menu-tab--banner {
        overflow: auto;
        padding-bottom: 16px;
    }

        .menu-tab--banner ul {
            min-width: 100%;
            width: -webkit-max-content;
            width: -moz-max-content;
            width: max-content;
        }

            .menu-tab--banner ul li {
                max-width: initial;
                -webkit-box-flex: 0;
                -ms-flex: 0 0 auto;
                flex: 0 0 auto;
            }

    .tabs-point-history .parents-tabs {
        overflow: auto;
        padding-bottom: 16px;
    }

        .tabs-point-history .parents-tabs ul {
            min-width: 100%;
            width: -webkit-max-content;
            width: -moz-max-content;
            width: max-content;
        }

            .tabs-point-history .parents-tabs ul li {
                max-width: initial;
                -webkit-box-flex: 0;
                -ms-flex: 0 0 auto;
                flex: 0 0 auto;
            }
}

@media screen and (max-width: 768px) {
    .radius-0, .banner-mem {
        border-radius: 0px;
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        -ms-border-radius: 0px;
        -o-border-radius: 0px;
    }

    .red {
        background: red;
    }

    .rowfull.pad-area-mem {
        padding-top: 80px;
    }

    .menu-tab--banner {
        padding-bottom: 6px;
        position: relative;
    }

        .menu-tab--banner ul {
            min-width: 100%;
            width: -webkit-max-content;
            width: -moz-max-content;
            width: max-content;
        }

            .menu-tab--banner ul li {
                max-width: initial;
                -webkit-box-flex: 0;
                -ms-flex: 0 0 auto;
                flex: 0 0 auto;
            }

    .banner-mem {
        height: auto;
        background-size: auto 100%;
    }

        .banner-mem .col-left {
            padding-left: 0;
        }

        .banner-mem .col-right {
            padding-left: 0;
            top: 0px;
        }

            .banner-mem .col-right .card-block img.card-mem {
                width: 100%;
                height: auto;
            }

            .banner-mem .col-right .card-block .block-mem-text {
                width: 100%;
                padding-left: 20px;
                padding-top: 108px;
            }

                .banner-mem .col-right .card-block .block-mem-text::after, .banner-mem .col-right .card-block .block-mem-text::before {
                    display: none;
                }
}

@media screen and (max-width: 539px) {
    .radius-00, .banner-mem {
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -ms-border-radius: 0;
        -o-border-radius: 0;
    }

    .banner-mem {
        height: auto;
        background-size: auto 100%;
    }

        .banner-mem .col-right {
            padding-left: 0;
        }

            .banner-mem .col-right .card-block img.card-mem {
                width: 100%;
                height: auto;
            }

            .banner-mem .col-right .card-block .block-mem-text {
                width: 100%;
            }

                .banner-mem .col-right .card-block .block-mem-text::after, .banner-mem .col-right .card-block .block-mem-text::before {
                    display: none;
                }
}


/*Thong-tin-ca-nhan*/

.d-flex {
    display: flex !important
}

.flex-column {
    flex-direction: column !important
}

.flex-column-reverse {
    flex-direction: column-reverse !important
}

.bold {
    font-weight: 400
}



/*# sourceMappingURL=layoutv2.css.map */
.trudiem {
    background: #FFF5F6 !important;
    border: 1px solid #F5B2B2 !important;
    color: #FF4A5E !important;
}

.blackImg {
    filter: grayscale(1);
}

.rowspan {
    float: left;
    color: #828AA0 !important;
    font-weight: normal !important;
}

.rowspan1 {
    float: left;
    overflow: hidden;
    -webkit-line-clamp: 1;
    text-overflow: ellipsis;
    max-width: 70%;
    white-space: nowrap;
    width: 70%;
}

.rowspan2 {
    float: left;
    overflow: hidden;
    -webkit-line-clamp: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 500;
    width: 70%
}

.list-voucher-contain > div > div div.right-block .divBottom {
    position: absolute;
    bottom: 18px;
    width: calc(100% - 64px);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

    .list-voucher-contain > div > div div.right-block .divBottom > div {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        color: #828AA0;
        font-size: 14px;
    }

        .list-voucher-contain > div > div div.right-block .divBottom > div:nth-of-type(1),
        .list-voucher-contain > div > div div.right-block .divBottom > div:nth-of-type(2) {
            width: 35%;
        }

        .list-voucher-contain > div > div div.right-block .divBottom > div:nth-of-type(3) {
            width: 30%;
        }

        .list-voucher-contain > div > div div.right-block .divBottom > div div {
            width: 100%;
        }

        .list-voucher-contain > div > div div.right-block .divBottom > div:nth-of-type(3) div {
            position: relative;
        }

        .list-voucher-contain > div > div div.right-block .divBottom > div div .btn-doiqua {
            background: #506CFF;
            color: #fff;
            font-weight: 500;
            font-size: 14px;
            padding: 6px 15px;
            text-align: center;
            margin: 0 auto;
            cursor: pointer;
            border: none;
            outline: none;
            float: right;
            position: absolute;
            right: 0;
            top: 3px;
            border-radius: 20px;
            -webkit-border-radius: 20px;
            -moz-border-radius: 20px;
            -ms-border-radius: 20px;
            -o-border-radius: 20px;
        }

.list-voucher-contain > div > div div.right-block .diem-con span {
    font-weight: 600;
    font-size: 14px;
}

.list-voucher-contain > div > div div.right-block .diem-doi span {
    font-weight: 600;
    font-size: 13px;
    color: #2959F0;
}

    .list-voucher-contain > div > div div.right-block .diem-doi span img {
        margin-top: -5px;
        width: 14px;
        margin-right: 4px;
    }

.list-voucher-contain > div > div div.right-block .divBottom > div div .btn-doiqua {
    background: #506CFF;
    color: #fff;
    font-weight: 500;
    font-size: 14px;
    padding: 6px 15px;
    text-align: center;
    margin: 0 auto;
    cursor: pointer;
    border: none;
    outline: none;
    float: right;
    position: absolute;
    right: 0;
    top: 3px;
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    -o-border-radius: 20px;
}

.fa fa-chevron-right::before {
    font-size: 33px !important;
    line-height: 44px !important;
}
/*# popup xac nhan doi qua  */
.txt-center {
    margin: auto;
    text-align: center;
}

.square150pt {
    width: 100px;
    height: 100px;
}

.txt--confirm-exchange {
    font-weight: 500;
    font-size: 25px;
    padding: 5px 0;
}

.txt--content-exchange {
    /*
    justify-content: center;
    display: flex;
    align-content: center;
        */
}

.txt--value-gold {
    font-weight: 700;
    color: #506CFF;
}

.icon--gold {
    padding: 0 4px 3px 3px;
}

.txt--bold {
    font-weight: 500;
}

.txt--strong {
    font-weight: 600;
}

.txt--start {
    text-align: start;
}

.txt--end {
    text-align: end;
}

.col-sm-6 .txt--start > p {
    background: red;
}

.lineheight25 {
    line-height: 2.5;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pt16 {
    padding: 16px 16px;
}

.tab-serinumber {
    flex-direction: row;
    align-items: center;
    padding: 24px 24px;
    gap: 18px;
    width: 294px;
    height: 104px;
    background: #EDF0FF;
    border: 1px solid #506CFF;
    border-radius: 8px;
    text-align: center;
}

.tab-serinumberview {
    flex-direction: row;
    align-items: center;
    padding: 16px 24px;
    gap: 18px;
    width: 294px;
    height: 104px;
    background: #EDF0FF;
    border: 1px solid #506CFF;
    border-radius: 8px;
    text-align: center;
}

.txt--codenumber {
    font-weight: 700;
    font-size: 24px;
    color: #506CFF;
}

.tab-serinumberview .txt--codenumber {
    font-weight: 700;
    font-size: 24px;
    color: #506CFF;
    line-height: 70px;
}

.txt--serinumber {
    font-weight: 400;
    font-size: 14px;
    font-weight: 600;
    display: flex;
    justify-content: center;
}

.txt--share {
    font-weight: 700;
    font-size: 14px;
    color: #506CFF;
}

.div-share {
    flex-direction: column;
    display: flex;
    align-items: center;
    padding: 0px 0px 0px 16px;
}

.btn--sharee {
    height: 42px;
    align-items: center;
}

.pv-32 {
    padding: 10px 0 32px 16px;
}

.check-box {
    box-sizing: border-box;
    width: 16px;
    height: 16px;
    background: #F3F4F9;
    border: 1px solid #DEE0E7;
    border-radius: 5px;
    flex: none;
    order: 0;
    flex-grow: 0;
}

.mr6px {
    margin-right: 6px;
}

.pl4px {
    padding-left: 4px;
}

.pl9px {
    padding-left: 9px;
}

.d-flex {
    display: flex;
}

.fw500 {
    font-weight: 500;
}

.fw400 {
    font-weight: 400;
}

.fwb {
    font-weight: bold;
}

.fw600 {
    font-weight: 600;
}


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

.fw700 {
    font-weight: 700;
}

.fsize12 {
    font-size: 12px
}

.fsize14 {
    font-size: 14px
}

.fsize13 {
    font-size: 13px
}

.fsize15 {
    font-size: 15px
}

.fsize16 {
    font-size: 16px
}


.fsize39 {
    font-size: 39px;
    color: #1F2636;
}

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

.pb12 {
    padding-bottom: 12px;
}

.txt-copy {
    font-size: 18px;
    font-weight: 700;
    color: #506CFF;
}

.pdt16 {
    padding-top: 16px;
}

.pdr4 {
    padding-right: 4px
}

.pdb16 {
    padding-bottom: 16px;
}

/*Pop up chi tiet qua*/
.popUpDetail {
    max-height: 650px;
    overflow: hidden
}

    .popUpDetail h4.titlePopup {
        font-weight: 700;
        font-size: 22px;
        color: #1F2636;
        margin-bottom: 16px;
        /*height: 26px;*/
        overflow-y: hidden;
        line-height: 26px;
    }

    .popUpDetail .div-scroll {
        float: left;
        height: auto;
        width: calc(100% + 2px);
        overflow-y: auto;
        overflow-x: hidden;
    }

    .popUpDetail .h-scroll-pop--auto {
        height: calc(100% - 84px);
    }

    .popUpDetail .div-scroll .div-scroll--child {
        max-height: 560px;
        position: relative;
        overflow-y: auto;
        /*height: 560px;*/
        padding-bottom: 10px;
        overflow-x: hidden
    }

        .popUpDetail .div-scroll .div-scroll--child::-webkit-scrollbar {
            width: 5px;
        }

        /* Track */
        .popUpDetail .div-scroll .div-scroll--child::-webkit-scrollbar-track {
        }

        /* Handle */
        .popUpDetail .div-scroll .div-scroll--child::-webkit-scrollbar-thumb {
            background: #939393;
        }

            /* Handle on hover */
            .popUpDetail .div-scroll .div-scroll--child::-webkit-scrollbar-thumb:hover {
                background: #939393;
            }

    .popUpDetail .img-gift {
        width: 100%;
    }

    .popUpDetail .div-gold-num {
        background: linear-gradient(140.62deg, #8FA3F8 16.46%, #6889EF 72.42%);
        color: #fff;
        font-weight: 600;
        line-height: 26px;
        font-size: 18px;
        padding: 16px 20px;
        width: 100%;
        height: 60px;
        display: block;
        margin: 14px auto;
        outline: none;
        border: none;
        position: relative;
        border-radius: 8px;
        -webkit-border-radius: 8px;
        -moz-border-radius: 8px;
        -ms-border-radius: 8px;
        -o-border-radius: 8px;
    }

        .popUpDetail .div-gold-num > div {
            position: absolute;
            right: 20px;
            top: 15px;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
        }

            .popUpDetail .div-gold-num > div img {
                width: 24px;
                margin-right: 4px;
            }

            .popUpDetail .div-gold-num > div span {
                line-height: 30px;
            }

    .popUpDetail .block-showmore__in_popup {
        position: relative;
    }

    .popUpDetail .block-showmore-style {
        border-bottom: 1px solid #DEE0E7;
        padding-bottom: 12px;
        margin-bottom: 16px;
    }

        .popUpDetail .block-showmore-style:last-child {
            border-bottom: 0px solid #DEE0E7;
            margin-bottom: 0px;
            word-break: break-word;
        }

    .popUpDetail .block-showmore__in_popup .text__in_popup {
        position: relative;
    }

    .popUpDetail .block-showmore__in_popup .show-more-height__in_popup {
        overflow: hidden;
    }

    .popUpDetail .block-showmore__in_popup .show-more__in_popup {
        height: 20px;
        cursor: pointer;
    }

.popUpDetail {
    /* padding: 18px 14px 0;*/
    width: 100%;
    /*float: left;*/
    overflow: hidden
}

.btn--share {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 12px;
    gap: 16px;
    width: 100%;
    height: 112px;
    border-radius: 8px;
    color: #506CFF;
    flex: none;
    order: 0;
    flex-grow: 1;
    line-height: 0.5;
}

.div-codeUse {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 16px 24px;
    gap: 35px;
    width: auto;
    height: 50px;
    background: #F3F4F9;
    border-radius: 8px;
    flex: none;
    order: 3;
    align-self: stretch;
    flex-grow: 0;
    margin-top: 16px;
}

.codeUse {
    border-color: #F3F4F9 !important;
    border: none;
    height: 32px;
    font-weight: 500;
    font-size: 17px;
    width: 313px;
    background-color: #F3F4F9;
    border: none;
    pointer-events: none;
}

.pdvertical16 {
    padding: 16px 0 16px 0;
    font-weight:bold;
}

.masudung {
    font-weight: bold;
    font-size: 19px;
    line-height: 148%;
}

.spancheckbox {
    float: right;
    padding-right: 5px;
    font-weight: 500;
    font-size: 15px;
    line-height: 148%;
}

.btn--copycode {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 189px;
    height: 48px;
    background: #F6F7FB;
    border-radius: 8px;
    border: none;
    flex: none;
    order: 0;
    flex-grow: 1;
    margin: 16px 0px 16px 0px;
    color: #506CFF;
    font-weight: 700;
}

.btn--sharecode {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    border: none;
    flex: none;
    order: 0;
    margin-left: 16px;
    font-weight: 600;
    background-color: transparent;
}

.btn--hiddencode {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    border: none;
    flex: none;
    order: 0;
    margin-left: 16px;
    font-weight: 600;
}

.pdl8px {
    padding-left: 8px;
}


.ellipses {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.title-popup {
    font-weight: 700;
    font-size: 22px;
    color: #1F2636;
    overflow-y: hidden;
    word-break: break-word;
    margin-left: 8px;
    padding: 0;
}

.div-contract-code {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 16px 24px;
    gap: 18px;
    width: 434px;
    height: 57px;
    background: #F3F4F9;
    border-radius: 8px;
    flex: none;
    order: 1;
    flex-grow: 0;
}

.dropdown-position {
    position: absolute !important;
    top: 108px !important;
    min-height: auto !important;
}

.txt--confirmUseg {
    padding: 15px 0 8px 10px;
    font-weight: 600;
    font-size: 14px;
}

.pr-255 {
    padding-right: 294px !important;
}

/* Push */
@-webkit-keyframes hvr-push {
    50% {
        -webkit-transform: scale(0.8);
        transform: scale(0.8);
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes hvr-push {
    50% {
        -webkit-transform: scale(0.8);
        transform: scale(0.8);
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

.hvr-push {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

    .hvr-push:hover, .hvr-push:focus, .hvr-push:active {
        -webkit-animation-name: hvr-push;
        animation-name: hvr-push;
        -webkit-animation-duration: 0.3s;
        animation-duration: 0.3s;
        -webkit-animation-timing-function: linear;
        animation-timing-function: linear;
        -moz-animation-iteration-count: inherit;
        -o-animation-iteration-count: inherit;
        -webkit-animation-iteration-count: inherit;
        animation-iteration-count: inherit;
        animation-iteration-count: 1;
    }

/* Grow Shadow */
.hvr-grow-shadow {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: box-shadow, transform;
    transition-property: box-shadow, transform;
}

    .hvr-grow-shadow:hover, .hvr-grow-shadow:focus, .hvr-grow-shadow:active {
        box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5);
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }

/* Buzz Out */
@-webkit-keyframes hvr-buzz-out {
    10% {
        -webkit-transform: translateX(3px) rotate(2deg);
        transform: translateX(3px) rotate(2deg);
    }

    20% {
        -webkit-transform: translateX(-3px) rotate(-2deg);
        transform: translateX(-3px) rotate(-2deg);
    }

    30% {
        -webkit-transform: translateX(3px) rotate(2deg);
        transform: translateX(3px) rotate(2deg);
    }

    40% {
        -webkit-transform: translateX(-3px) rotate(-2deg);
        transform: translateX(-3px) rotate(-2deg);
    }

    50% {
        -webkit-transform: translateX(2px) rotate(1deg);
        transform: translateX(2px) rotate(1deg);
    }

    60% {
        -webkit-transform: translateX(-2px) rotate(-1deg);
        transform: translateX(-2px) rotate(-1deg);
    }

    70% {
        -webkit-transform: translateX(2px) rotate(1deg);
        transform: translateX(2px) rotate(1deg);
    }

    80% {
        -webkit-transform: translateX(-2px) rotate(-1deg);
        transform: translateX(-2px) rotate(-1deg);
    }

    90% {
        -webkit-transform: translateX(1px) rotate(0);
        transform: translateX(1px) rotate(0);
    }

    100% {
        -webkit-transform: translateX(-1px) rotate(0);
        transform: translateX(-1px) rotate(0);
    }
}

@keyframes hvr-buzz-out {
    10% {
        -webkit-transform: translateX(3px) rotate(2deg);
        transform: translateX(3px) rotate(2deg);
    }

    20% {
        -webkit-transform: translateX(-3px) rotate(-2deg);
        transform: translateX(-3px) rotate(-2deg);
    }

    30% {
        -webkit-transform: translateX(3px) rotate(2deg);
        transform: translateX(3px) rotate(2deg);
    }

    40% {
        -webkit-transform: translateX(-3px) rotate(-2deg);
        transform: translateX(-3px) rotate(-2deg);
    }

    50% {
        -webkit-transform: translateX(2px) rotate(1deg);
        transform: translateX(2px) rotate(1deg);
    }

    60% {
        -webkit-transform: translateX(-2px) rotate(-1deg);
        transform: translateX(-2px) rotate(-1deg);
    }

    70% {
        -webkit-transform: translateX(2px) rotate(1deg);
        transform: translateX(2px) rotate(1deg);
    }

    80% {
        -webkit-transform: translateX(-2px) rotate(-1deg);
        transform: translateX(-2px) rotate(-1deg);
    }

    90% {
        -webkit-transform: translateX(1px) rotate(0);
        transform: translateX(1px) rotate(0);
    }

    100% {
        -webkit-transform: translateX(-1px) rotate(0);
        transform: translateX(-1px) rotate(0);
    }
}

.hvr-buzz-out {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

    .hvr-buzz-out:hover, .hvr-buzz-out:focus, .hvr-buzz-out:active {
        -webkit-animation-name: hvr-buzz-out;
        animation-name: hvr-buzz-out;
        -webkit-animation-duration: 0.75s;
        animation-duration: 0.75s;
        -webkit-animation-timing-function: linear;
        animation-timing-function: linear;
        -webkit-animation-iteration-count: 1;
        animation-iteration-count: 1;
    }

.btn-copy {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 32px;
    height: 32px;
    border: none;
    outline: none;
    background: url("/images/copy-icon.svg") center no-repeat;
    background-size: 22px;
    padding: 5px;
}

.disabledLi {
    pointer-events: none;
    opacity: 0.6;
    display: none !important;
}

.showAndDisableLi {
    pointer-events: none;
    opacity: 0.6;
    display: block !important;
}

.disabledbtn {
    pointer-events: none;
    opacity: 0.6;
    background-color: #DEE0E7 !important
}


p#display-contract-ref-code {
    color: #506CFF;
    font-size: 25px !important;
    font-weight: 600;
}

.tr-btn-copy-gtbb {
    height: 25px;
    display: inline;
}

.copy-link-invite {
    display: inline-block !important;
    width: 100%;
    padding-right: 0 !important;
    position: relative;
}

.popup_main .popup_body .popup_contain .copy-link-invite .btn-copy {
    position: absolute;
    right: 16px;
}

span.copy-link-invite-text {
    width: 50%;
    /*float: left;*/
    white-space: nowrap;
    display: block !important;
    line-height: 20px;
}

span#display-contract-url {
    width: auto;
    white-space: nowrap;
    overflow: hidden;
    float: left;
    text-align: left;
    padding: 0;
    display: block;
    line-height: 20px;
}

.tr-btn-copy-gtbb-bt {
    width: 32px;
    overflow: hidden;
    line-height: 48px;
    display: block !important;
}

/* Icon Bob */
@-webkit-keyframes hvr-icon-bob {
    0% {
        -webkit-transform: translateY(-6px);
        transform: translateY(-6px);
    }

    50% {
        -webkit-transform: translateY(-2px);
        transform: translateY(-2px);
    }

    100% {
        -webkit-transform: translateY(-6px);
        transform: translateY(-6px);
    }
}

@keyframes hvr-icon-bob {
    0% {
        -webkit-transform: translateY(-6px);
        transform: translateY(-6px);
    }

    50% {
        -webkit-transform: translateY(-2px);
        transform: translateY(-2px);
    }

    100% {
        -webkit-transform: translateY(-6px);
        transform: translateY(-6px);
    }
}

@-webkit-keyframes hvr-icon-bob-float {
    100% {
        -webkit-transform: translateY(-6px);
        transform: translateY(-6px);
    }
}

@keyframes hvr-icon-bob-float {
    100% {
        -webkit-transform: translateY(-6px);
        transform: translateY(-6px);
    }
}

.hvr-icon-bob {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
}

    .hvr-icon-bob .hvr-icon {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }

    .hvr-icon-bob:hover .hvr-icon, .hvr-icon-bob:focus .hvr-icon, .hvr-icon-bob:active .hvr-icon {
        -webkit-animation-name: hvr-icon-bob-float, hvr-icon-bob;
        animation-name: hvr-icon-bob-float, hvr-icon-bob;
        -webkit-animation-duration: .3s, 1.5s;
        animation-duration: .3s, 1.5s;
        -webkit-animation-delay: 0s, .3s;
        animation-delay: 0s, .3s;
        -webkit-animation-timing-function: ease-out, ease-in-out;
        animation-timing-function: ease-out, ease-in-out;
        -webkit-animation-iteration-count: 1, infinite;
        animation-iteration-count: 1, infinite;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
        -webkit-animation-direction: normal, alternate;
        animation-direction: normal, alternate;
    }


.game-icon-bob {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
}

.game-balloon {
    cursor: pointer;
    width: auto;
    overflow: hidden;
    text-align: center;
    float: right;
    position: fixed;
    left: 10px;
    bottom: 30px;
    z-index: 900;
}

@media(min-width: 641px) {
    .game-balloon-img {
        width: 179px;
        height: 179px;
    }
}

@media(max-width: 640px) {
    .game-balloon-img {
        width: 113px;
        height: 113px;
    }
}

.btn-del {
    width: 20px;
    height: 20px;
    float: right;
    right: 0px;
    top: 0px;
}

.img-notfound {
    margin-top: 140px;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.text {
    font-family: 'SVN-Gilroy';
    font-style: normal;
    font-weight: 600;
    font-size: 24px;
    line-height: 148%;
    /* identical to box height, or 36px */

    text-align: center;
    /* #0F1E47 */

    color: #1F2636;
    margin-top: 48px;
    /* Inside auto layout */

    flex: none;
    order: 0;
    flex-grow: 0;
}

.btn-back-home-notfound {
    background-color: #506CFF;
    color: #fff;
    border: 1px solid #506CFF;
    width: 173px;
    height: 57px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 16px 48px;
    gap: 10px;
    flex: none;
    order: 0;
    flex-grow: 0;
    margin-top: 10px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 800px;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    -ms-border-radius: 50px;
    -o-border-radius: 50px;
}

    .btn-back-home-notfound:hover {
        border-color: #adadad;
        color: #fff;
    }


/* text in banner */
#voucher-card span.wrapper-img-slider {
    position: unset;
}

.div-scroll--child span.wrapper-img-slider {
    position: relative;
}

span.wrapper-img-slider span.wrapper-text-position {
    position: absolute;
    top: 53px;
    left: 46px;
    color: #fff;
    font-weight: bold;
    font-size: 17px;
}

    span.wrapper-img-slider span.wrapper-text-position span {
        width: 100%;
        float: left;
        line-height: 1.3;
    }

        span.wrapper-img-slider span.wrapper-text-position span:last-child {
            color: #f6ff0b;
        }


    span.wrapper-img-slider span.wrapper-text-position.vpn-text span,
    span.wrapper-img-slider span.wrapper-text-position.ihome-text span,
    pan.wrapper-img-slider span.wrapper-text-position.golden-text span {
        color: #000;
    }

        span.wrapper-img-slider span.wrapper-text-position.vpn-text span:last-child {
            color: #4764e9;
        }

    span.wrapper-img-slider span.wrapper-text-position.fptplay-text span:last-child {
        color: #f88c30;
    }

    span.wrapper-img-slider span.wrapper-text-position.ihome-text span:last-child {
        color: #ee9848;
    }

    span.wrapper-img-slider span.wrapper-text-position.frt-text span:last-child,
    span.wrapper-img-slider span.wrapper-text-position.payment-text span:last-child {
        color: #ecb52c;
    }



.div-scroll--child span.wrapper-img-slider span.wrapper-text-position {
    top: -20px;
    left: 33px;
}


@media screen and (max-width: 480px) {
    #back-to-top {
        display: none !important;
    }

    .userrank-scroll {
        height: 300px !important;
    }

    .btn-back-home-notfound {
        background-color: #506CFF;
        color: #fff;
        border: 1px solid #506CFF;
        width: 162px;
        height: 37px;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        padding: 16px 48px;
        gap: 10px;
        flex: none;
        order: 0;
        flex-grow: 0;
        margin-top: 4px;
        margin-left: auto;
        margin-right: auto;
        border-radius: 800px;
        -webkit-border-radius: 50px;
        -moz-border-radius: 50px;
        -ms-border-radius: 50px;
        -o-border-radius: 50px;
    }
}



.logo-white {
    display: none;
}

.fix-VoucherName {
    font-size: 18px;
    font-weight: 700;
    display: block;
    /*   white-space: nowrap;*/
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.gtbb-banner-bottom {
    width: 100%;
    height: 230px;
    padding: 28px 60px;
    background-color: #BFDFFF;
    background-image: url('../images/gtbb-banner-l.png'),url('../images/gtbb-banner-r.png');
    background-position: bottom left, top right;
    background-repeat: no-repeat;
    background-size: auto 230px, auto 230px;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    overflow: hidden;
}

    .gtbb-banner-bottom > img {
        position: absolute;
        right: 60px;
        bottom: 0;
        /*height: 100%;*/
    }

    .gtbb-banner-bottom .text-desc {
        font-size: 32px;
        font-weight: 600;
        padding-bottom: 20px;
        line-height: 44px;
    }

        .gtbb-banner-bottom .text-desc span:nth-of-type(1) {
            display: block;
        }

        .gtbb-banner-bottom .text-desc span:nth-of-type(2) {
            color: #506CFF;
        }

.bgr-nocolor {
    background: transparent !important;
    padding: 0px !important;
}

.list-voucher-contain > div > div div.right-block .wrapper-content > * {
    font-size: unset;
    margin: 0;
    padding: 0;
    font-weight: unset;
    word-break: break-word;
}

.wrapper-content {
    word-break: break-word;
}

.pop-up-redeem-card {
    width: 444px;
    font-style: normal;
    font-weight: 600;
    font-size: 22px;
    line-height: 26px;
    padding: 16px 0px 16px 0px;
}

.pd-img-redeem-card {
    padding: 0 0px 3px 3px;
}

.txt-total-value {
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
}

.txt-pricee {
    font-weight: 600;
    font-size: 17px;
}

.pt10 {
    padding-top: 10px;
    height: 40px;
}

.txt-total-price {
    color: #506CFF;
    font-style: normal;
    font-weight: 600;
    font-size: 17px;
}

.txt-gold {
    padding-left: 55px;
    color: #506CFF;
    font-weight: 600;
    font-size: 17px;
}

.active-card {
    border-color: #2959F0;
}

ul.pop--icon-mathe li.active-card {
    border-color: #2959F0;
}

.webkit-line-camp {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    width: 90%;
}



.img-notfound {
    margin-top: 140px;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.text {
    font-family: 'SVN-Gilroy';
    font-style: normal;
    font-weight: 600;
    font-size: 24px;
    line-height: 148%;
    /* identical to box height, or 36px */

    text-align: center;
    /* #0F1E47 */

    color: #1F2636;
    margin-top: 48px;
    /* Inside auto layout */

    flex: none;
    order: 0;
    flex-grow: 0;
}

.btn-back-home-notfound {
    background-color: #506CFF;
    color: #fff;
    border: 1px solid #506CFF;
    width: 173px;
    height: 57px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 16px 48px;
    gap: 10px;
    flex: none;
    order: 0;
    flex-grow: 0;
    margin-top: 10px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 800px;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    -ms-border-radius: 50px;
    -o-border-radius: 50px;
}

    .btn-back-home-notfound:hover {
        border-color: #adadad;
        color: #fff;
    }


@media screen and (max-width: 414px) {
    .block-tab--content .col-sm-12 > div.owl--voucher-card .owl-prev, .block-tab--content .col-sm-12 > div.owl--voucher-card .owl-next {
        /* width: 100%; */
        line-height: 36px;
    }
}

.pdf-50 {
    padding-left: 50px;
}


/*button#outfocus:focus-visible {
     outline: none;
}*/

.sf-pro-text {
    font-family: 'SF Pro Text';
}


.pd-text-checkuse-left {
    padding: 16px 0 16px 16px;
}

.pd-text-checkuse-right {
    padding: 16px 16px 0 0;
}

#csrolldescription {
    height: 200px;
    padding-bottom: 10px;
}
    /* width */
    #csrolldescription::-webkit-scrollbar {
        width: 5px;
    }

    /* Track */
    #csrolldescription::-webkit-scrollbar-track {
    }

    /* Handle */
    #csrolldescription::-webkit-scrollbar-thumb {
        background: #939393;
    }

        /* Handle on hover */
        #csrolldescription::-webkit-scrollbar-thumb:hover {
            background: #939393;
        }

#info-usernamehr {
    display: none
}

.floatlp {
    width: 100%;
    float: left;
}

.pdt40 {
    padding-top: 40px
}

.free-tag {
    position: relative;
    top: 27px;
    left: calc(100% - 58px);
    margin: auto;
    z-index: 2
}

.mt-21px {
    margin-top: -21px;
}

.mrlr-64 {
    margin-left: 64px;
    margin-right: 64px;
    overflow-x: hidden;
}

/*.tag-gotit-filter {
    height: 341px !important;
}*/

.tag-gotit {
    height: 385px;
    width: 245px;
    overflow: hidden;
    transition: 0.5s;
}

    .tag-gotit:hover {
        box-shadow: 0px 0px 10px 0px rgb(10 72 233 / 60%) !important;
        transition: 0.5s;
    }

.shadow-gotit {
    box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
}

#prod-section, #product-section {
    justify-content: center;
}

.parent {
    width: 100%;
    overflow: hidden;
}

.child {
    width: 65%;
    float: left;
    font-size: 15px;
    font-family: arial;
    padding: 10px 0;
    cursor: pointer;
    display: flex;
    overflow-x: auto;
    margin-right: 8px;
    position: relative;
    overflow: hidden;
}

#btn-industry.owl-carousel {
    width: auto !important;
}

.child button:hover {
    background-color: #fff;
}

.child li.btn-industry.active {
    background: #0756EC !important;
    color: #fff;
    align-items: center;
    border-color: #0756EC
}

.child li.last {
    border: none;
    font-size: 0px;
    padding: 2px 20px;
    width: 100px
}

.btn-industry {
    padding: 2px 16px;
    border-radius: 80px;
    font-family: 'SVN-Gilroy';
    margin: 0 16px 0 0;
    font-size: 15px;
    background-color: #f3f4f9;
    border: 1px solid;
}

select.select-brand {
    width: 15%;
    padding: 5px;
    font-size: 14px;
    line-height: 1;
    border-radius: 8px;
    height: 34px;
    margin-right: 15px;
    background-color: #f3f4f9;
}

    select.select-brand:hover {
        background-color: #fff;
    }

.pt-10 {
    padding-top: 10px;
}

.border-lr {
    border-left: 1px solid #D9D9D9;
    border-right: 1px solid #D9D9D9;
    text-align: center;
}

.title-product-detail {
    justify-content: space-between;
    display: flex;
    border-bottom: 1px solid #D9D9D9;
}

.share_gotit {
    display: flex;
    justify-content: center;
    position: relative;
}

.btn-share_gotit {
    display: flex;
    align-items: center;
    background: #F6F7FB;
    border-radius: 8px;
    color: #506CFF;
    border: 0;
    padding: 11px 25px;
    box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px, rgba(0, 0, 0, 0.3) 0px 7px 13px -3px, rgba(0, 0, 0, 0.2) 0px -3px 0px inset;
    font-size: 15px;
}

    .btn-share_gotit:active {
        top: 10px;
        background-color: #F6F7FB;
        -webkit-box-shadow: inset 0 1px 0 #F6F7FB, inset 0 -3px 0 #999;
        -moz-box-shadow: inset 0 1px 0 #F6F7FB, inset 0 -3px 0 #999;
        box-shadow: inset 0 1px 0 #F6F7FB, inset 0 -3px 0 #999;
    }

    .btn-share_gotit:after {
        content: "";
        height: 100%;
        width: 100%;
        padding: 4px;
        position: absolute;
        bottom: -15px;
        left: -4px;
        z-index: -1;
        /* background-color: #F6F7FB;*/
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
    }

.left {
    width: 40%;
}

.right {
    width: 60%;
}

.px-8 {
    padding: 8px 4px;
}

.btn-exchange-gotit {
    background: #2959F0;
    border: 1px solid #FFFFFF;
    border-radius: 800px;
    color: #fff;
    padding: 2px 14px;
    float: right;
}

.content-center {
    display: flex;
    justify-content: center;
}


::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

/* Track */
::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px grey;
    border-radius: 10px;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #bababa;
    border-radius: 10px;
}

    /* Handle on hover */
    ::-webkit-scrollbar-thumb:hover {
        background: #9d9d9d;
    }

.h-10 {
    height: 40px
}

.h-832 {
    height: 832px;
    overflow-y: auto;
}

.h-728 {
    height: 728px;
    overflow-y: auto;
}

#btn-industry div > .owl-stage {
    /*display: flex;
    max-width: 856px*/
}

#filterGotit {
    width: 100%;
    display: flex;
}

.w20 {
    width: 18%;
}

.w80 {
    width: 82%;
}

.w100 {
    width: 100%;
}


.circle-ticket-left {
    border-radius: 0 150px 150px 0;
    background: #D7D8E0;
    width: 9px;
    height: 14px;
    left: -3px;
}

.circle-ticket-right {
    border-radius: 150px 0 0 150px;
    background: #D7D8E0;
    width: 9px;
    height: 14px;
    right: -3px;
}

.relative {
    position: relative;
}

.absolute {
    position: absolute;
}


.ml-25 {
    margin-left: 6px;
}

.barcode {
    display: flex;
    justify-content: center;
    margin: 26px 0px;
}

.img-gotit_barcode {
    border-radius: 8px;
    margin: 21px 8px 10px 12px;
    width: 170px;
}

.img_gotit_cat {
    width: 24px;
}

.content-barcode {
    width: 100%;
    height: 228px;
    background: #FFFFFF;
    box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.15);
    border-radius: 20px;
    margin: 16px 0;
    display: flex;
    overflow: hidden;
}

.gotit-logo {
    display: flex;
    margin: auto;
    margin-top: 16px;
}

.popUpDetail .box_tab {
    margin: 32px 0 17px;
}



    .popUpDetail .box_tab .menu {
    }



        .popUpDetail .box_tab .menu li {
            font-size: 16px;
            color: #aaa;
            letter-spacing: -0.3px;
            font-weight: 400;
            margin-right: 33px;
            display: inline-block;
            padding: 0px 8px;
            line-height: 30px;
        }



            .popUpDetail .box_tab .menu li:last-child {
                margin-right: 0px;
            }



            .popUpDetail .box_tab .menu li:hover {
                cursor: pointer;
            }



            .popUpDetail .box_tab .menu li.active {
                color: #000;
                font-weight: 500;
                border-bottom: 2px solid #4564ED;
            }



    .popUpDetail .box_tab .content_tab {
        border-top: 1px solid #EBEBEB;
        padding-top: 13px;
    }



.popUpDetail .content_tab .ct_chung {
    display: none;
    color: #636F7E;
    font-size: 14px;
    line-height: 20.72px;
    font-weight: 400;
    text-align: justify;
}



.popUpDetail .content_tab .ct_scroll {
    padding-right: 10px;
    height: 144px;
    overflow-y: auto;
    margin-bottom: 5px;
}



.popUpDetail .content_tab .active {
    display: block;
}

#segment-slide .owl-item.active.center .item {
    opacity: 1;
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
}

.xanh {
    color: #23D45F;
}

.den {
    color: black !important;
}

.xam {
    color: gray !important;
}

.disabled-share {
    opacity: .5;
    color: #AAAAAA !important;
    cursor: not-allowed;
}

.position-linear1 {
    position: absolute;
    top: 10px;
    width: 37px;
    height: 28px;
    z-index: 10;
    background-image: linear-gradient(to right, rgb(255 255 255), rgba(255, 0, 0, 0) 103%, #FFFFFF 71%);
}

.position-linear2 {
    position: absolute;
    right: 0px;
    top: 10px;
    width: 30px;
    height: 29px;
    z-index: 10;
    background-image: linear-gradient(to right, rgba(255, 0, 0, 0), rgb(255 255 255 / 88%) 71%, #bababa 230%);
}

.popUpDetail_barcode .gotit-logo {
    margin-top: 26px;
}

.popUpDetail_barcode .barcode {
    margin: 18px 0px;
}

.popUpDetail_barcode .hsd {
    font-weight: 600;
}

.popUpDetail_barcode .note {
    color: #B4B4B4;
    font-size: 12px;
    margin-top: 4px;
}

.popUpDetail_barcode .share_gotit {
    margin-top: 30px;
}

.popUpDetail_barcode .resoult .box {
    padding: 5px 0px !important;
}

.popUpDetail_barcode .content_resoult {
    height: 120px !important;
}

.ml12 {
    margin-left: 12px;
}


#prod-section, #product-section {
    padding-top: 7px;
}

.selector {
    display: flex;
}
/*#selectField {
    width: 100%;
    padding: 15px 20px;
    margin-bottom: 30px;
    box-sizing: border-box;po
    display: flex;
    justify-content: space-between;
    align-items: center;
}*/
#selectField img {
    width: 12px;
}

#list {
    width: 50%;
    overflow: auto;
    height: 189px;
    background: #F6F7FB;
    position: absolute;
    z-index: 9999999;
    width: 200px;
    top: 34px;
}

.option {
    width: 100%;
    padding: 15px 0px 6px 37px;
    box-sizing: border-box;
    cursor: pointer;
    position: relative;
    border-bottom: 1px solid;
}

    .option img {
        width: 20px;
        position: absolute;
        top: 15px;
        left: 10px;
    }

.img-detail-gotit {
    width: 318px;
    /*height: 256px;*/
    border-radius: 10px;
    object-fit: contain !important;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    max-width: 100%;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #444;
    line-height: 25px !important;
    border-radius: 8px;
    border: 1px solid;
}

.select2-container--default .select2-selection--single {
    border: none !important
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable .select2-results__option--highlighted {
    width: 20px;
    border-radius: 4px;
    background-color: #ececec !important;
    color: #000 !important
}

.select2-results__option.select2-results__option--selectable > span > img {
    width: 20px;
    border-radius: 4px
}

.d-flex-select {
    display: flex;
}


.select2-results__option.select2-results__option--selectable:hover {
    background-color: #ececec !important;
    color: #000 !important
}

.select2-selection__rendered > span > img {
    width: 20px;
    border-radius: 4px
}

.select2-dropdown {
    border: 1px solid;
}

.select2-results {
    background-color: #F6F7FB;
}

.w-select {
    width: 220px !important;
}

.w-select-parent {
    width: 90px !important;
}

.select2-results__option--selectable {
    cursor: pointer;
    /* height: 48px;*/
    border-bottom: 1px solid #DEE0E7;
    align-items: center;
    display: flex;
}

.select2-selection__rendered {
    background-color: #F6F7FB;
}


#birthday-text:hover  {
    font-weight: bold;
    border-bottom: 3px solid #2959F0;
    transition: ease;
    margin-bottom: -3px;
}

@media(max-width: 440px) {
    .res-copy-code {
        padding: 16px 20px !important;
    }

    .res-popup-container {
        padding-top: 19px !important;
    }

    .res-close-btn {
        top: 5px !important;
        right: 5px !important;
        z-index: 10;
    }
}

@media screen and (max-width: 390px) {
    span .wrapper-img-slider span.wrapper-text-position {
        top: 27%;
        left: 11%;
        font-size: 14px;
    }

    .div-scroll--child span.wrapper-img-slider span.wrapper-text-position {
        top: -180%;
        left: 8%;
        font-size: 17px;
    }

    #txtSearch {
        width: 250px !important;
    }
}

.container-breadcumb {
    padding-top: 0px !important;
}

.filter {
    background: #FFFFFF;
    border: 1px solid #D7D7D7;
    border-radius: 8px;
    width: 109px;
    height: 35px;
    padding-top: 5px;
    margin-right: 27px;
    cursor: pointer;
}

.find {
    width: 27px;
    height: 27px;
    position: absolute;
    top: 9px;
    margin-left: 253px;
    margin-top: -5px;
}

.findCategory {
    width: 16px;
    height: 16px;
    margin-top: -4px;
}

.findBrand {
    width: 16px;
    height: 16px;
    margin-top: -4px;
}

.display-none {
    display: none !important;
}

.cursor-pointer {
    cursor: pointer;
}

.bodyfilter {
}

.bodyfilter-mobile {
    margin-left: 8px
}

.bodyfilter-mobile .col .tabs {
    border-radius: 8px;
    overflow: hidden;
    margin-left: -15px;
    overflow-y: auto;
    max-height: 250px;
}
.closeFilter {
    margin-left: 16px;
    width: 170px;
    height: 29px;
    color: white;
    background: #939393;
    border: none;
    margin-top: 5px;
}

.closeFilter-mobile {
    margin-left: 15px;
    width: 82%;
    height: 29px;
    color: white;
    background: #939393;
    border: none;
    margin-top: 5px;
    margin-bottom: 12px;
}

.selectFilter {
    margin-left: 16px;
    margin-bottom: 20px;
}

.pl7 {
    padding-left: 7px;
    padding-right: 7px;
}

.itemFilter {
    padding: 5px 16px 5px 16px;
    gap: 10px;
    width: auto;
    height: 33px;
    background: #F1F1F1;
    border-radius: 100px px;
    margin-left: 8px;
}

.sizeCheckbox {
    width: 16px;
    height: 16px;
}

#CheckBoxlistCategory {
    height: 160px;
    overflow-y: auto
}

#CheckBoxlistBrand {
    height: 160px;
    overflow-y: auto
}
#CheckBoxlistCategory-mobile {
    height: 160px;
    overflow-y: auto
}

#CheckBoxlistBrand-mobile {
    height: 160px;
    overflow-y: auto
}

.display-flex {
    display: grid;
    grid-template-columns: auto auto auto;
    justify-content: left;
}

.floatr {
    float: right;
}

.imgnotfound {
    text-align: center;
    margin-top: 60px;
    margin-bottom:15px;
}


/*Class for click nutton filter*/
.btn-exchange-gotit-filter {
    margin-top: 10px;
    float: left;
}

.txt-coin-filter {
    width: 100%;
    float: left;
}