@font-face {
    font-family: 'SVN-Gilroy Light';
    font-style: normal;
    font-weight: normal;
    src: local('SVN-Gilroy Light'), url('../fonts/SVN/SVNGilroy Light.woff') format('woff');
}

@font-face {
    font-family: 'SVN-Gilroy Bold';
    font-style: normal;
    font-weight: normal;
    src: local('SVN-Gilroy Bold'), url('../fonts/SVN/SVNGilroy Bold.woff') format('woff');
}

* {
    border: none;
}

body {
    font-family: "SVN-Gilroy Light";
    background-color: #fff;
    height: 200vh;
    position: relative;
}

body:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    -webkit-transition: .3s all ease;
    -o-transition: .3s all ease;
    transition: .3s all ease;
    opacity: 0;
    visibility: hidden;
    z-index: 1;
}

body.offcanvas-menu:before {
    opacity: 1;
    visibility: visible;
}

/* p {
    color: #b3b3b3;
    font-weight: 300;
} */

/* h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    font-family: "SVN-Gilroy Light";
} */

a {
    -webkit-transition: .3s all ease;
    -o-transition: .3s all ease;
    transition: .3s all ease;
}

a,
a:hover {
    text-decoration: none !important;
}

.banner .img_banner {
    background: url("../images/banner-atp.png") no-repeat;
    background-size: cover;
}

.site-navbar {
    margin-bottom: 0;
    padding: 17px 0;
    box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.15);
    background: #fff;
    z-index: 1999;
    position: fixed;
    width: 100%;
}

/* section#header {
    padding-top: 5%;
} */


.site-navbar.transparent {
    background: transparent;
}

.site-navbar.absolute {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

.site-navbar .site-logo {
    position: relative;
    left: 0;
    font-size: 24px !important;
}

.site-navbar .site-navigation .site-menu {
    margin-bottom: 0;
}

.site-navbar .site-navigation .site-menu .active>a span {
    background: #1E3188;
    color: #fff;
    border-radius: 30px;
    display: inline-block;
    padding: 5px 20px;
}

.site-navbar .site-navigation .site-menu a {
    text-decoration: none !important;
    display: inline-block;
}

.site-navbar .site-navigation .site-menu>li {
    display: inline-block;
}

.site-navbar .site-navigation .site-menu>li>a {
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 150%;
    color: #1E3188;
    text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
}

.site-navbar .site-navigation .site-menu>li>a>span {
    padding: 5px 20px;
    display: inline-block;
    -webkit-transition: .3s all ease;
    -o-transition: .3s all ease;
    transition: .3s all ease;
    border-radius: 30px;
}

.site-navbar .site-navigation .site-menu>li>a:hover>span {
    background: #1E3188;
    color: #fff;
    border-radius: 30px;
    display: inline-block;
}

.site-navbar .site-navigation .site-menu .has-children {
    position: relative;
}

.site-navbar .site-navigation .site-menu .has-children>a span {
    position: relative;
    padding-right: 30px;
}

.site-navbar .site-navigation .site-menu .has-children>a span:before {
    position: absolute;
    content: "\e313";
    font-size: 16px;
    top: 50%;
    right: 10px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    font-family: 'icomoon';
}

.site-navbar .site-navigation .site-menu .has-children .dropdown {
    visibility: hidden;
    opacity: 0;
    top: 100%;
    position: absolute;
    text-align: left;
    border-top: 2px solid #007bff;
    -webkit-box-shadow: 0 2px 10px -2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 10px -2px rgba(0, 0, 0, 0.1);
    padding: 0px 0;
    margin-top: 20px;
    margin-left: 0px;
    background: #fff;
    -webkit-transition: 0.2s 0s;
    -o-transition: 0.2s 0s;
    transition: 0.2s 0s;
}

.site-navbar .site-navigation .site-menu .has-children .dropdown.arrow-top {
    position: absolute;
}

.site-navbar .site-navigation .site-menu .has-children .dropdown.arrow-top:before {
    bottom: 100%;
    left: 20%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.site-navbar .site-navigation .site-menu .has-children .dropdown.arrow-top:before {
    border-color: rgba(136, 183, 213, 0);
    border-bottom-color: #fff;
    border-width: 10px;
    margin-left: -10px;
}

.site-navbar .site-navigation .site-menu .has-children .dropdown a {
    text-transform: none;
    letter-spacing: normal;
    -webkit-transition: 0s all;
    -o-transition: 0s all;
    transition: 0s all;
    color: #343a40;
}

.site-navbar .site-navigation .site-menu .has-children .dropdown .active>a {
    color: #007bff !important;
}

.site-navbar .site-navigation .site-menu .has-children .dropdown>li {
    list-style: none;
    padding: 0;
    margin: 0;
    min-width: 200px;
}

.site-navbar .site-navigation .site-menu .has-children .dropdown>li>a {
    padding: 9px 20px;
    display: block;
}

.site-navbar .site-navigation .site-menu .has-children .dropdown>li>a:hover {
    background: #fafafb;
}

.site-navbar .site-navigation .site-menu .has-children .dropdown>li.has-children>a {
    position: relative;
}

.site-navbar .site-navigation .site-menu .has-children .dropdown>li.has-children>a:after {
    position: absolute;
    right: 0;
    content: "\e315";
    right: 20px;
    font-family: 'icomoon';
}

.site-navbar .site-navigation .site-menu .has-children .dropdown>li.has-children>.dropdown,
.site-navbar .site-navigation .site-menu .has-children .dropdown>li.has-children>ul {
    left: 100%;
    top: 0;
}

.site-navbar .site-navigation .site-menu .has-children .dropdown>li.has-children:hover>a,
.site-navbar .site-navigation .site-menu .has-children .dropdown>li.has-children:active>a,
.site-navbar .site-navigation .site-menu .has-children .dropdown>li.has-children:focus>a {
    background: #fafafb;
}

.site-navbar .site-navigation .site-menu .has-children:hover>a,
.site-navbar .site-navigation .site-menu .has-children:focus>a,
.site-navbar .site-navigation .site-menu .has-children:active>a {
    color: #007bff;
}

.site-navbar .site-navigation .site-menu .has-children:hover>a span,
.site-navbar .site-navigation .site-menu .has-children:focus>a span,
.site-navbar .site-navigation .site-menu .has-children:active>a span {
    background: #007bff;
    color: #fff;
}

.site-navbar .site-navigation .site-menu .has-children:hover,
.site-navbar .site-navigation .site-menu .has-children:focus,
.site-navbar .site-navigation .site-menu .has-children:active {
    cursor: pointer;
}

.site-navbar .site-navigation .site-menu .has-children:hover>.dropdown,
.site-navbar .site-navigation .site-menu .has-children:focus>.dropdown,
.site-navbar .site-navigation .site-menu .has-children:active>.dropdown {
    -webkit-transition-delay: 0s;
    -o-transition-delay: 0s;
    transition-delay: 0s;
    margin-top: 0px;
    visibility: visible;
    opacity: 1;
}

.site-mobile-menu {
    width: 300px;
    position: fixed;
    right: 0;
    z-index: 2000;
    padding-top: 20px;
    background: #fff;
    height: calc(100vh);
    -webkit-transform: translateX(110%);
    -ms-transform: translateX(110%);
    transform: translateX(110%);
    -webkit-box-shadow: -10px 0 20px -10px rgba(0, 0, 0, 0.1);
    box-shadow: -10px 0 20px -10px rgba(0, 0, 0, 0.1);
    -webkit-transition: .3s all ease-in-out;
    -o-transition: .3s all ease-in-out;
    transition: .3s all ease-in-out;
}

.offcanvas-menu .site-mobile-menu {
    -webkit-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
}

.site-mobile-menu .site-mobile-menu-header {
    width: 100%;
    float: left;
    padding-left: 20px;
    padding-right: 20px;
}

.site-mobile-menu .site-mobile-menu-header .site-mobile-menu-close {
    float: right;
    margin-top: 8px;
}

.site-mobile-menu .site-mobile-menu-header .site-mobile-menu-close span {
    font-size: 30px;
    display: inline-block;
    padding-left: 10px;
    padding-right: 0px;
    line-height: 1;
    cursor: pointer;
    -webkit-transition: .3s all ease;
    -o-transition: .3s all ease;
    transition: .3s all ease;
}

.site-mobile-menu .site-mobile-menu-header .site-mobile-menu-close span:hover {
    color: #f8f9fa;
}

.site-mobile-menu .site-mobile-menu-header .site-mobile-menu-logo {
    float: left;
    margin-top: 10px;
    margin-left: 0px;
}

.site-mobile-menu .site-mobile-menu-header .site-mobile-menu-logo a {
    display: inline-block;
    text-transform: uppercase;
}

.site-mobile-menu .site-mobile-menu-header .site-mobile-menu-logo a img {
    max-width: 70px;
}

.site-mobile-menu .site-mobile-menu-header .site-mobile-menu-logo a:hover {
    text-decoration: none;
}

.site-mobile-menu .site-mobile-menu-body {
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    position: relative;
    padding: 0 20px 20px 20px;
    height: calc(100vh - 52px);
    padding-bottom: 150px;
}

.site-mobile-menu .site-nav-wrap {
    padding: 0;
    margin: 0;
    list-style: none;
    position: relative;
}

.site-mobile-menu .site-nav-wrap a {
    padding: 10px 20px;
    display: block;
    position: relative;
    color: #212529;
}

.site-mobile-menu .site-nav-wrap a:hover {
    color: #007bff;
}

.site-mobile-menu .site-nav-wrap li {
    position: relative;
    display: block;
}

.site-mobile-menu .site-nav-wrap li.active>a {
    color: #007bff;
}

.site-mobile-menu .site-nav-wrap .arrow-collapse {
    position: absolute;
    right: 0px;
    top: 10px;
    z-index: 20;
    width: 36px;
    height: 36px;
    text-align: center;
    cursor: pointer;
    border-radius: 50%;
}

.site-mobile-menu .site-nav-wrap .arrow-collapse:hover {
    background: #f8f9fa;
}

.site-mobile-menu .site-nav-wrap .arrow-collapse:before {
    font-size: 12px;
    z-index: 20;
    font-family: "icomoon";
    content: "\f078";
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(-180deg);
    -ms-transform: translate(-50%, -50%) rotate(-180deg);
    transform: translate(-50%, -50%) rotate(-180deg);
    -webkit-transition: .3s all ease;
    -o-transition: .3s all ease;
    transition: .3s all ease;
}

.site-mobile-menu .site-nav-wrap .arrow-collapse.collapsed:before {
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.site-mobile-menu .site-nav-wrap>li {
    display: block;
    position: relative;
    float: left;
    width: 100%;
}

.site-mobile-menu .site-nav-wrap>li>a {
    padding-left: 20px;
    font-size: 20px;
}

.site-mobile-menu .site-nav-wrap>li>ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

.site-mobile-menu .site-nav-wrap>li>ul>li {
    display: block;
}

.site-mobile-menu .site-nav-wrap>li>ul>li>a {
    padding-left: 40px;
    font-size: 16px;
}

.site-mobile-menu .site-nav-wrap>li>ul>li>ul {
    padding: 0;
    margin: 0;
}

.site-mobile-menu .site-nav-wrap>li>ul>li>ul>li {
    display: block;
}

.site-mobile-menu .site-nav-wrap>li>ul>li>ul>li>a {
    font-size: 16px;
    padding-left: 60px;
}

.site-mobile-menu .site-nav-wrap[data-class="social"] {
    float: left;
    width: 100%;
    margin-top: 30px;
    padding-bottom: 5em;
}

.site-mobile-menu .site-nav-wrap[data-class="social"]>li {
    width: auto;
}

.site-mobile-menu .site-nav-wrap[data-class="social"]>li:first-child a {
    padding-left: 15px !important;
}

.banner .img_banner .title p,
.banner .img_banner_atp .title p,
.banner .img_banner_uid .title p,
.banner .img_banner_zalo .title p,
.banner .img_banner_system .title p,
.banner .img_banner_tiktok .title p {
    color: #FFF;
    font-size: 48px;
    font-style: normal;
    font-family: 'SVN-Gilroy Bold';
    font-weight: 700;
    line-height: normal;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.banner .img_banner_uid .pad-left,
.banner .img_banner .pad-left,
.banner .img_banner_fb .pad-left,
.banner .img_banner_zl .pad-left,
.banner .img_banner_atp .pad-left,
.banner .img_banner_system .pad-left,
.banner .img_banner_zalo .pad-left,
.banner .img_banner_tiktok .pad-left {
    padding: 5% 0;
}

.dot {
    border-radius: 14px;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.00) 25%, #FFF 100%);
    width: 33%;
    height: 6px;
}

.banner .img_banner .desc h1,
.banner .img_banner_atp .desc h1,
.banner .img_banner_uid .desc h1,
.banner .img_banner_zalo .desc h1,
.banner .img_banner_system .desc h1,
.banner .img_banner_tiktok .desc h1 {
    color: #FFF;
    text-align: justify;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    letter-spacing: 0.48px;
}

.banner .img_banner .content .list-content,
.banner .img_banner_fb .content .list-content,
.banner .img_banner_zl .content .list-content,
.banner .img_banner_atp .content .list-content,
.banner .img_banner_tiktok .content .list-content,
.banner .img_banner_system .content .list-content,
.banner .img_banner_zalo .content .list-content,
.banner .img_banner_uid .content .list-content {
    list-style-type: none;
    padding: 2%;
}

.banner .img_banner .content .list-content li,
.banner .img_banner_fb .content .list-content li,
.banner .img_banner_zl .content .list-content li,
.banner .img_banner_atp .content .list-content li,
.banner .img_banner_tiktok .content .list-content li,
.banner .img_banner_system .content .list-content li,
.banner .img_banner_zalo .content .list-content li,
.banner .img_banner_uid .content .list-content li {
    color: #FFF;
    text-align: justify;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 150%;
    /* 24px */
    padding-bottom: 2%;
}

.banner .img_banner .card-register,
.banner .img_banner_fb .card-register,
.banner .img_banner_zl .card-register,
.banner .img_banner_atp .card-register,
.banner .img_banner_tiktok .card-register,
.banner .img_banner_zalo .card-register,
.banner .img_banner_system .card-register,
.banner .img_banner_uid .card-register {
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.80);
    position: relative;
}

.card-register .card-title {
    text-align: center;
}

.card-register .card-title p {
    color: #1E3188;
    text-align: center;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.48px;
}

.card-register .card-title span {
    color: #1E3287;
    font-size: 40px;
    text-align: center;
    font-family: 'SVN-Gilroy Bold';
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 0.8px;
    text-transform: uppercase;
}

.card-register .input-name,
.card-register .input-phone {
    text-align: center;
}

.card-register .input-name input,
.card-register .input-phone input {
    padding: 0 10px;
    width: 80%;
    border-radius: 20px;
    background: #FFF;
    height: 64px;
    border: 1px solid #FFFFFF;
}

.form-footer .input-name input,
.form-footer .input-phone input {
    padding: 0 10px;
    width: 100%;
    border-radius: 20px;
    background: #FFF;
    height: 49.31px;
    border: 1px solid #FFFFFF;
}

.form-footer .input-name input:focus,
.card-register .input-name input:focus,
.card-register .input-phone input:focus {
    outline: 2px solid #1E3287;
}

.form-footer .input-name input::placeholder,
.form-footer .input-phone input::placeholder {
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 21px;
    /* text-align: center; */
    letter-spacing: 0.02em;
    color: #A8AEBD;
}

.card-register .btn-sub {
    text-align: center;
}

.form-footer .btn-form-footer .btn-send {
    text-align: center;
    border-radius: 20px;
    background: #FC7C09;
    width: 100%;
    height: 50px;
    color: #FFFFFF;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 0.48px;
}

.card-register .btn-sub .btn-send {
    text-align: center;
    border-radius: 20px;
    background: #FC7C09;
    text-transform: uppercase;
    width: 50%;
    height: 65px;
    color: #FFFFFF;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 0.48px;
}

.card-register .btn-sub .btn-send:hover,
.price-product .price-items .btn-pri:hover {
    background: linear-gradient(192.33deg, #ee4e00 101.57%, #fe8e01 21.26%);
}

.card-register .excerpt {
    color: #3D3D3D;
    text-align: center;
    font-size: 14px;
    font-style: italic;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.28px;
    padding: 0 24%;
}

.introduce {
    position: relative;
    overflow: hidden;
}

.introduce::before {
    content: "";
    position: absolute;
    top: 0;
    left: 10%;
    width: 100%;
    height: 100%;
    z-index: -1;
    background: url("../images/bg_intro.png") no-repeat;
}

.introduce .intro-right .content-intro {
    padding: 17% 0;
}

.introduce .intro-right .intro-title h2 {
    color: #ee4e00;
    text-align: justify;
    font-size: 22px;
    font-family: 'SVN-Gilroy Bold';
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.introduce .intro-right .desc-intro p {
    color: #121212;
    text-align: justify;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 150%;
    /* 24px */
}
.show_video .the-title .sub-title{
    color: #ee4e00;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-family: 'SVN-Gilroy Bold';
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0.64px;
}
.show_video .the-title h2,
.feature .feature-title h2,
.comment .comment-title h2,
.price-product .price-title h2,
.introduce-apt .intro-title h2,
.fea-atp .feature-title h2,
.fea-uid .feature-title h2 {
    color: #ee4e00;
    text-align: center;
    font-size: 32px;
    font-style: normal;
    font-family: 'SVN-Gilroy Bold';
    font-weight: 700;
    line-height: 130%;
    /* 41.6px */
    letter-spacing: 0.64px;
    text-transform: uppercase;
}

.feature .feature-title span,
.comment .comment-title span,
.price-product .price-title span,
.introduce-apt .intro-title span,
.fea-atp .feature-title span,
.fea-uid .feature-title span {
    color: #ff722c;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
    letter-spacing: 0.64px;
    text-transform: uppercase;
}

.dot-2 {
    width: 198px;
    height: 7px;
    text-align: center;
    border-radius: 14px;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.00) 0%, #ee4e00 100%);
}

.feature .bg-feature {
    position: relative;
    overflow: hidden;
    background: url("../images/bg_feature.png") no-repeat;
    background-size: contain;
}

#care {
    background: url("../images/bg-fea-care (1).png") no-repeat;
    background-size: contain;
}


.bg-feature .content-1 {
    border-radius: 20px;
    background: #FFF;
    padding: 0 5%;
    /* Drop shadow cam */
    height: 100%;
    box-shadow: 0 4px 10px 5px rgba(255, 146, 1, 0.10);
}

.bg-feature .content-1 ul {
    color: #121212;
    text-align: justify;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 190%;
    /* 30.4px */
}

.bg-feature .feature-title-content h3 {
    color: #ee4e00;
    text-align: center;
    /* H4/Bold/24px */
    font-family: 'SVN-Gilroy Bold';
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 150%;
    /* 36px */
}

.bg-feature .item-feature {
    padding: 0 7%;
}

.bg-feature .container-feature {
    padding: 0 14%;
}

.bg-feature .pad-mid {
    padding: 0 6px 0 6px;
}

.reason {
    background: radial-gradient(62.44% 52.36% at 63.69% 49.95%, #f29e76 29.69%, rgba(228, 233, 255, 0.00) 100%);
}

.reason .reason-title h2,
.more .more-title .p-title {
    color: #ee4e00;
    text-align: center;
    font-size: 32px;
    font-style: normal;
    font-family: 'SVN-Gilroy Bold';
    font-weight: 700;
    line-height: 130%;
    /* 41.6px */
    letter-spacing: 0.64px;
    text-transform: uppercase;
}

.reason .reason-item-lr {
    border-radius: 20px;
    background: #FFF;
    transition: all 2s;
    box-shadow: 12px 12px 25px -10px #000C6D;
}

.reason .reason-item-lr:hover {
    transform: scale(1.05);
    box-shadow: 0 10px 20px rgba(0, 0, 0, .12), 0 4px 8px rgba(0, 0, 0, .06);
    transition: all 2s;
}

.reason .desc-item {
    color: #121212;
    text-align: center;
    font-family: 'SVN-Gilroy Bold';
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 150%;
    /* 27px */
}
.contact .contact-product {
    background: linear-gradient(92.75deg, #ffa97f 2.34%, #ee4e00 97.87%);
    border-radius: 20px;
    margin: 30px 0;
    padding: 30px 50px;
    position: relative;
    display: flex;
    text-transform: uppercase;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

#contact-tiktok {
    background: linear-gradient(129deg, #0C1B86 0%, #251072 62.50%, #431085 100%);
    border-radius: 20px;
    margin: 30px 0;
    padding: 30px 50px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.contact .contact-product .btn-contact .btn-con {
    text-align: center;
    border-radius: 20px;
    background: #ee4e00;
    width: 100%;
    text-transform: uppercase;
    padding: 0 20px;
    height: 65px;
    color: #FFFFFF;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 0.48px;
}

.contact .contact-product .btn-contact,
.contact .contact-product .contact-text {
    z-index: 1;
    text-align: center;
}

.contact .contact-product .btn-contact .btn-con:hover {
    background: linear-gradient(192.33deg, #ee4e00 101.57%, #fe8e01 21.26%);
}

.contact .contact-product .contact-text span {
    color: #FFF;
    text-align: center;
    text-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
    font-size: 36px;
    font-style: normal;
    font-family: 'SVN-Gilroy Bold';
    font-weight: 700;
    line-height: 130%;
    /* 46.8px */
    letter-spacing: 0.72px;
}

.contact .contact-product .contact-text p {
    color: #FFF;
    text-transform: initial;
    text-align: center;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 190%;
    /* 34.2px */
}

.contact .contact-product:after {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    background: url("../images/ripple.png") no-repeat;
    top: 0;
    left: 0;
    background-size: cover;
    z-index: 0;
}

.price-product {
    background: url("../images/bg-price.png") no-repeat;
    background-size: cover;
}


.price-product .price-items {
    border-radius: 20px;
    position: relative;
    background: linear-gradient(153deg, #dc3545 0%, #ee4e00 100%);
    box-shadow: 7px 8px 13px 0 rgba(0, 0, 0, 0.25);
    height: 100%;
}

#price-tiktok-1,
#price-tiktok-2,
#price-tiktok-3 {
    background: linear-gradient(129deg, #0C1B86 0%, #251072 62.50%, #431085 100%);

}

.price-product .price-items:after {
    position: absolute;
    border-radius: 18px;
    content: "";
    width: 100%;
    height: 66%;
    background: url(../images/stuna.png) no-repeat;
    bottom: 0;
    left: 0;
    z-index: 0;
}

.price-product .price-prod-vnd .center {
    color: #FFF;
    font-size: 36px;
    font-family: 'SVN-Gilroy Bold';
    font-style: normal;
    font-weight: 900;
    line-height: 150%;
    /* 54px */
}

.price-product .price-prod-vnd p {
    color: #FFF;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    padding-left: 14%;
    line-height: 150%;
    /* 30px */
}

.price-product .list-price {
    position: relative;
    z-index: 1;
    height: 35%;
}

.price-product .price-items ul li {
    padding-bottom: 3%;
    color: #FFF;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 150%;
    /* 24px */
}

.price-product .price-items ul li svg {
    margin-right: 5%;
}

.price-product .price-items .btn-price {
    text-align: center;
    position: relative;
    z-index: 1;
}

.price-product .price-items .btn-pri {
    text-align: center;
    border-radius: 20px;
    background: #FC7C09;
    padding: 7px;
    width: 46%;
    height: 49px;
    color: #FFFFFF;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 0.48px;
}

.dot-white {
    background: #FFF;
    width: 310px;
    height: 1px;
    margin: auto;
}

.more .product-more {
    padding: 0 1%;
    margin: 20px 0 40px 0;
    height: 540px;
    position: relative;
}

.more .more-img,
.more .more-img-fb {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 23px 65px;
    position: relative;
    box-shadow: 1px 1px 9px #edbbbb;
    border-top-left-radius: 15px;
    border-bottom-right-radius: 20px;
    margin-bottom: 15px;
    min-height: 320px;
    overflow: hidden;
    z-index: 1;

}
.more .more-img-zl{
    display: flex;
    align-items: center;
    justify-content: center;
    /* padding: 23px 65px; */
    position: relative;
    box-shadow: 1px 1px 9px #edbbbb;
    border-top-left-radius: 15px;
    border-bottom-right-radius: 20px;
    margin-bottom: 15px;
    min-height: 260px;
    overflow: hidden;
    z-index: 1;
}
.more .more-img-fb img:hover,
.more .more-img img:hover {
    transform: scale(1.1);
    transition: all 2s;
}

.more .more-img-fb img,
.more .more-img-zl img,
.more .more-img img {
    transition: all 2s;
}

.more .more-img:before {
    content: "";
    width: 100%;
    height: 90%;
    background: url("../images/Masktop.png") no-repeat;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    /*background-size: contain;*/
}

.more .more-img-fb:before {
    content: "";
    width: 100%;
    height: 90%;
    background: url("../images/Masktop-yl.png") no-repeat;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    /*background-size: contain;*/
}

.more .more-img:after {
    content: "";
    width: 78%;
    height: 35%;
    background: url("../images/Maskbot.png") no-repeat;
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: -1;
    background-size: cover;
}

.more .more-img-fb:after {
    content: "";
    width: 78%;
    height: 35%;
    background: url("../images/Maskbot-yl.png") no-repeat;
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: -1;
    background-size: cover;
}

.more .more-name a {
    color: #ee4e00;
    /* H4/Bold/24px */
    font-size: 24px;
    font-family: 'SVN-Gilroy Bold';
    font-style: normal;
    font-weight: 700;
    line-height: 150%;
    /* 36px */
}

.more .more-name p {
    color: #424857;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 140%;
    /* 22.4px */
}

.more .btn-more {
    position: absolute;
    bottom: 0;
    text-align: center;
    display: block;
    width: 100%;
    left: 0;
    right: 0;
}

.more .more-item {
    background-color: #fff;
    height: 100%;
    border-radius: 15px;
    padding: 15px 15px 30px 15px;
    box-shadow: 0 4px 10px 5px rgba(30, 49, 136, 0.10);
    transition: .3s transform cubic-bezier(.155, 1.105, .295, 1.12), .3s box-shadow, .3s -webkit-transform cubic-bezier(.155, 1.105, .295, 1.12);
    cursor: pointer;
}

.more .btn-more a:hover {
    background: #ee4e00;
}

.more .btn-more a {
    text-decoration: none;
    padding: 12px 33px;
    background: #ee4e00;
    text-transform: uppercase;
    border-radius: 10px;
    color: #fff;
}

.more .more-title p {
    color: #f77d42;
    text-align: center;
    /* H5/Bold/20px */
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 150%;
    /* 30px */
}

.more .more-content p {
    color: #424857;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 140%;
    /* 22.4px */
}

footer {
    border-radius: 50px 50px 0 0;
    background: linear-gradient(122.58deg, rgb(210, 216, 241) 19.06%, rgb(55, 83, 210) 57.14%, rgb(32, 53, 145) 78.26%);
}

.ft-logo .ft-img p {
    color: #1E3188;
    font-size: 18px;
    font-style: normal;
    font-weight: 800;
    line-height: 150%;
    /* 27px */
    text-transform: uppercase;
}

.ft_address.ft_list span {
    color: #fff;
}

footer .ft_policy p,
footer .ft_pay p {
    color: #FFF;
    font-size: 18px;
    font-style: normal;
    padding-top: 40%;
    font-weight: 700;
    line-height: 150%;
    /* 30px */
}

footer .ft_pay .contact-footer p {
    padding-top: 5%;
}

footer .ft_list li {
    line-height: 28px;
    text-align: justify;
}

footer .ft_list li a,
footer .ft_list li {
    color: #FFF;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 150%;
    /* 21px */
}

footer .pay_qr {
    padding-top: 50%;
}

.comment {
    background: url("../images/bg-comment.png") no-repeat;
    background-size: cover;
}

.comment .comment-card {
    border-radius: 0 0 40px 0;
    background: #FFF;
    height: 310px;
    box-shadow: 7px 7px 24px -5px rgba(30, 49, 136, 0.28);
}

.comment .name-comment span {
    color: #292929;
    text-align: center;
    font-size: 14px;
    font-family: 'SVN-Gilroy Bold';
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
    /* 18.2px */
    letter-spacing: 0.28px;
}

.comment .name-comment {
    margin-left: 2%;
}

.comment .name-comment p {
    color: #292929;
    font-size: 14px;
    text-align: initial;
    font-style: normal;
    font-weight: 400;
    line-height: 130%;
    /* 18.2px */
    letter-spacing: 0.28px;
}

.comment .profile-comment {
    display: flex;
    padding: 22px 0 10px 10px;
}

.comment .content-comment {
    color: #000;
    text-align: justify;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    padding: 0 5% 5% 5%;
    line-height: 190%;
    /* 26.6px */
}

.slick-dots li button:before {
    content: "";
}

.slick-dots li {
    background-color: #ccc;
    width: 30px;
    height: 5px;
    margin: 0px;
}

.slick-dots li button:before {
    width: 30px;
    height: 5px;
}

li.slick-active {
    background: #000;
}

.slick-dots {
    bottom: -10px;
}

.slick-prev {
    left: 40%;
    bottom: -27px;
    top: auto;
    border: 1px solid #ccc;
    width: 30px;
    height: 30px;
    border-radius: 5px;
    z-index: 22;
}

.slick-prev:before {
    color: #000;
    content: "\003c";
    font-family: sans-serif;
}

.slick-next {
    right: 40%;
    bottom: -27px;
    top: auto;
    border: 1px solid #ccc;
    width: 30px;
    height: 30px;
    border-radius: 5px;
    z-index: 22;
}

.slick-next:before {
    color: #000;
    content: "\003e";
    font-family: sans-serif;
}

.slick-dotted.slick-slider {
    margin-bottom: 50px;
}

.left-3,
.right-3 {
    margin-top: 10%;
}

/*phần của autopost*/

.banner .img_banner_atp {
    background: url("../images/banner-atp.png") no-repeat;
    background-size: cover;
}

.banner .img_banner_tiktok {
    background: url("../images/bg-tiktokchrome.png") no-repeat;
    background-size: cover;
}

.banner .img_banner_zalo {
    background: url("../images/bg-zalo.png") no-repeat;
    background-size: cover;
}

.banner .img_banner_system {
    background: url("../images/bg-system.png");
    background-size: cover;
}

.banner .img_banner_fb {
    background: url("../images/fb-1.png");
    background-size: cover;
}

.banner .img_banner_zl {
    background: url("../images/bg-zalo.png");
    background-size: 100%;
    background-repeat: round;
}

.introduce-apt .intro-top {
    background: url("../images/bg-vd-atp.png") no-repeat;
    background-size: cover;
}

.introduce-apt .intro-top .intro-img {
    display: flex;
    justify-content: center;
}

.introduce-apt .intro-bot .intro-title p {
    color: #1E3188;
    text-align: center;
    font-size: 24px;
    font-family: 'SVN-Gilroy Bold';
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 0.48px;
}

.introduce-apt .intro-bot .desc-intro p {
    color: #16181D;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 150%;
    /* 24px */
}

.fea-atp {
    background: url("../images/bg-fea-atp.png") no-repeat;
    background-size: 100%;
}

.fea-atp .fea-name h3 {
    color: #1E3188;
    font-size: 24px;
    font-family: 'SVN-Gilroy Bold';
    font-style: normal;
    font-weight: 700;
    line-height: 150%;
    /* 36px */
}

.fea-atp .list-fea li {
    color: #121212;
    text-align: justify;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 190%;
    /* 26.6px */
}

.fea-atp .fea-1 {
    margin-top: -10%;
}

.fea-atp .fea-2 {
    margin-top: -8%;
}

.fea-atp .fea-3 {
    margin-top: -6%;
}

.fea-atp .fea-4 {
    margin-top: -7%;
}

.fea-atp .fea-5 {
    margin-top: -8%;
}

.fea-atp .fea-end {
    margin-top: -14%;
}

.container1 {
    padding: 0 14%;
}

.pl-5.pr-5.ppl-5 {
    padding: 0 20%;
}

.feature .bg-feature .apt-card {
    display: flex;
    padding: 16px 16px 16px 32px;
    justify-content: center;
    align-items: center;
    gap: 32px;
    border-radius: 8px;
    background: #FFF;
    box-shadow: 0 12px 16px -8px rgba(22, 24, 29, 0.16);
}

.feature .bg-feature .apt-card p {
    color: #1E3188;
    font-family: 'SVN-Gilroy Bold';
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 150%;
    /* 24px */
}

.feature .bg-feature .apt-left-1 {
    margin-top: 15%;
}

.feature .bg-feature .apt-left-2 {
    margin: 8% 0 6% 8%;
}

.feature .bg-feature .apt-left-3 {
    margin-bottom: 6%;
}

.feature .bg-feature .apt-left-4 {
    margin: 0 0 8% 50%;
}

.feature .bg-feature .apt-right-4,
.feature .bg-feature .apt-right-2 {
    margin: 8% 0 6% -12%;
}

.feature .bg-feature .apt-right-3 {
    margin: 8% 0 8% -20%;
}

/*uid pro*/

.banner .img_banner_uid {
    background: url("../images/bg-uid-pro(1).png") no-repeat;
    background-size: cover;
}

.bg-feature .uid-card img {
    padding: 5%;
}

.bg-feature .uid-card .text-uid-card {
    display: flex;
    width: 360px;
    padding: 16px 16px 16px 32px;
    align-items: center;
    gap: 32px;
    border-radius: 8px;
    background: #FFF;
    box-shadow: 0 12px 16px -8px rgba(22, 24, 29, 0.16);
}

.bg-feature .uid-card .text-uid-card p {
    color: #424857;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    /* 24px */
}

.bg-feature .uid-left-1 {
    margin-top: 14%;
}

.bg-feature .uid-left-2 {
    margin: 6% 0 6% 20%;
}

.bg-feature .uid-left-3 {
    margin-bottom: 20%;
}

.bg-feature .uid-right-2 {
    margin: 6% 0 6% -26%;
}

.fea-uid .fea-uid-content {
    padding: 4% 28% 10% 5%;
}

.fea-uid .fea-uid-content-right {
    padding: 4% 0 10% 20%;
}

.fea-uid .fea-uid-content-bot-left {
    padding: 6% 16% 6% 4%;
}


.fea-uid .fea-uid-content h3,
.fea-uid .fea-uid-content-right h3,
.fea-uid .fea-uid-content-bot-left h3,
.fea-uid .fea-uid-content-bot-right h3 {
    color: #1E3188;
    /* H4/Bold/24px */
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 150%;
    /* 36px */
}

/*.fea-uid .all-fea{*/
/*    margin: 0 12%;*/
/*}*/

.fea-uid .fea-uid-content .list-uid-fea {
    color: #121212;
    text-align: justify;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 190%;
    /* 26.6px */
}

.fea-uid .fea-bg-uid-left,
.fea-uid .fea-bg-uid-bot-left {
    position: relative;
    left: 6%;
}

.fea-uid .fea-bg-uid-right {
    position: relative;
    right: 6%;
}

.fea-uid .fea-bg-uid-bot-right {
    position: relative;
    left: 10px;
    bottom: 90px;
}

.fea-uid .fea-uid-content-bot-right {
    margin: 20% 18% 10% 13%;
}

.h-fea {
    height: 280px;
}

.img-phay {
    margin-bottom: -10%;
}

.back-to-top {
    visibility: hidden;
    background-color: #2c3e50;
    color: #fff;
    width: 42px;
    height: 42px;
    text-align: center;
    line-height: 38px;
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 90;
    cursor: pointer;
    opacity: 0;
    border-radius: 3px;
    -webkit-transform: translateZ(0);
    transition: all .4s
}

.back-to-top .fa {
    font-size: 22px;
    vertical-align: middle
}

.back-to-top:hover {
    background-color: #1E3188;
    color: #fff;
    opacity: 1;
}

.back-to-top.show {
    visibility: visible;
    opacity: 1;
}

/*tiktok chrome*/
.fea .box-fea h2 {
    color: #1E3188;
    text-align: center;
    font-size: 32px;
    font-family: 'SVN-Gilroy Bold';
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
    /* 41.6px */
    letter-spacing: 0.64px;
    text-transform: uppercase;
}

.fea .box-fea span {
    color: #424857;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
    letter-spacing: 0.64px;
    text-transform: uppercase;
}

.fea .card-tiktok-1 {
    background: #EFEAFA;
    border-radius: 40px 40px 0 0;
    height: 333px;
}

.fea .card-tiktok-2 {
    border-radius: 40px 40px 0 0;
    background: #F8F0EE;
    height: 333px;
}

.fea .card-tiktok-3 {
    border-radius: 40px 40px 0 0;
    background: #E9FBEB;
    height: 261px;
}

.fea .card-tiktok-4 {
    border-radius: 40px 40px 0 0;
    background: #DCF2F5;
    height: 254px;
}

.fea .card-tiktok-5 {
    border-radius: 40px 40px 0 0;
    background: #FCE7D4;
    height: 317px;
}

.fea .box-card {
    padding: 0 18%;
}

.fea .card-box-tiktok .mg-top-2 {
    margin-top: -6%;
}

.fea .card-box-tiktok .mg-top-3 {
    margin-top: -10%;
}

.fea .card-box-tiktok .mg-top-4 {
    margin-top: -5%;
}

.fea .card-box-tiktok .mg-top-5 {
    margin-top: -4%;
}


.fea .icon-box-tiktok {
    padding: 4% 3% 0 3%;
}

.fea .fea-content-tiktok-right {
    padding: 3% 5% 0 5%;
}

.fea .fea-content-tiktok-left {
    padding: 3% 5% 0 5%;
}

.fea .fea-tiktok-title h3 {
    color: #1E3188;
    /* H4/Bold/24px */
    font-size: 24px;
    font-family: 'SVN-Gilroy Bold';
    font-style: normal;
    font-weight: 700;
    line-height: 150%;
    /* 36px */
}

.fea .fea-tiktok-title .list-fea-tiktok li {
    color: #1E3188;
    /* H4/Bold/24px */
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 150%;
    /* 36px */
}

/*zalo client*/

.fea .fea-bg-zalo {

    background: url("../images/bg-fea-zalo.png") no-repeat center center;
}

.fea .fea-bg-zalo .fea-zalo-title h3 {
    color: #1E3188;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 150%;
    /* 36px */
}

.fea .fea-bg-zalo .list-fea-zalo li {
    color: #121212;
    text-align: justify;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 190%;
    /* 26.6px */
}

.fea .fea-bg-zalo .zalo-1 {
    background: #EDE9F9;
    padding: 2% 1% 2% 24%;
    border-radius: 20px;
}

.fea .fea-bg-zalo .zalo-2 {
    background: #F5F0EE;
    padding: 2% 0 2% 10%;
    border-radius: 20px;
}

.fea .fea-bg-zalo .zalo-3 {
    background: #EEFBEB;
    padding: 2% 0 2% 24%;
    border-radius: 20px;
}

.fea .fea-bg-zalo .zalo-4 {
    background: #E2F2F5;
    padding: 2% 0 2% 10%;
    border-radius: 20px;
}

.fea .fea-bg-zalo .zalo-5 {
    background: #F6E6D4;
    padding: 2% 14% 2% 24%;
    border-radius: 20px;
}

.fea .card-content-zalo-right-1 {
    position: relative;
    z-index: -1;
    padding: 5% 0 5% 37%;
}

.fea .card-content-zalo-left-1 {
    position: relative;
    z-index: -1;
    padding: 5% 37% 3% 0;
}

.fea .card-content-zalo-right-2 {
    position: relative;
    z-index: -1;
    padding: 5% 0 3% 37%;
}

.fea .card-content-zalo-left-2 {
    position: relative;
    z-index: -1;
    padding: 5% 37% 5% 0;
}

.fea .card-content-zalo-right-3 {
    position: relative;
    z-index: -1;
    padding: 5% 0 3% 37%;
}

#contact-zalo {
    background: linear-gradient(129deg, #53D2FB 0%, #16A5FE 45.31%, #0094FF 100%);
    border-radius: 20px;
    margin: 30px 0;
    padding: 30px 50px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

#price-zalo-1,
#price-zalo-2,
#price-zalo-3 {
    background: linear-gradient(153deg, #95A7FF 0.66%, #2D4FFA 100%);
    box-shadow: 7px 8px 13px 0px rgba(0, 0, 0, 0.25);
    border-radius: 20px;
}

.bg-feature .zalo-right-1 {
    margin: 20% 0 2% -22%;
}

.bg-feature .zalo-right-2 {
    margin: 10% 0 0 -30%;
}

/*ninja system*/
.fea .fea-content-system-right {
    padding: 3% 5% 0 5%;
}

.fea .fea-content-system-left {
    padding: 3% 5% 0 5%;
}

.fea .card-system-1 {
    background: #EFEAFA;
    border-radius: 40px 40px 0 0;
    height: 466px;
}

.fea .card-system-2 {
    border-radius: 40px 40px 0 0;
    background: #F8F0EE;
    height: 271px;
}

.fea .card-system-3 {
    border-radius: 40px 40px 0 0;
    background: #E9FBEB;
    height: 280px;
}

.fea .card-system-4 {
    border-radius: 40px 40px 0 0;
    background: #DCF2F5;
    height: 254px;
}

.fea .card-system-5 {
    border-radius: 40px 40px 0 0;
    background: #FCE7D4;
    height: 259px;
}

.fea .card-system-6 {
    border-radius: 40px 40px 0 0;
    background: #EFEAFA;
    height: 240px;
}


.fea .card-box-tiktok .mg-zalo-top-2 {
    margin-top: -6%;
}

.fea .card-box-tiktok .mg-zalo-top-3 {
    margin-top: -3%;
}

.fea .card-box-tiktok .mg-zalo-top-4 {
    margin-top: -5%;
}

.fea .card-box-tiktok .mg-zalo-top-5 {
    margin-top: -4%;
}

.fea .card-box-tiktok .mg-zalo-top-5 {
    margin-top: -4%;
}

.fea .card-box-tiktok .mg-zalo-top-6 {
    margin-top: -4%;
}


.abc {
    position: fixed;
    top: 18%;
    right: 2%;
    margin-left: -50px;
    margin-top: -50px;
    display: inline-block;
    width: 150px;
    height: 40px;
    font-size: 14px;
    font-weight: lighter;
    text-transform: uppercase;
    text-align: center;
    line-height: 40px;
    letter-spacing: 0px;
    color: white;
    border: none;
    border-radius: 0%;
    background: rgba(230, 8, 8, 0.75);
    cursor: pointer;
    box-shadow: 0 0 0 0 rgba(230, 8, 8, 0.75);
    -webkit-animation: pulse 1.7s infinite;
}

.abc:hover {
    -webkit-animation: none;
}

@keyframes pulse {
    0% {
        transform: scale(0.95);
    }

    70% {
        transform: scale(1);
        box-shadow: 0 0 0 50px rgba(90, 153, 212, 0);
    }

    100% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(90, 153, 212, 0);
    }
}

.popup {
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    width: 100vw;
    height: 100vh;
    bottom: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.8);
    z-index: 23;
    visibility: hidden;
    opacity: 0;
    overflow: hidden;
    transition: 0.64s ease-in-out;
}

.popup-inner {
    position: relative;
    bottom: -100vw;
    right: -100vh;
    display: flex;
    align-items: center;
    max-width: 800px;
    max-height: 600px;
    width: 60%;
    height: 80%;
    background: rgba(255, 255, 255, 0.80);
    transform: rotate(32deg);
    transition: 0.64s ease-in-out;
}

.popup__photo {
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    width: 40%;
    height: 100%;
    overflow: hidden;
}

.popup__photo img {
    width: auto;
    height: 100%;
}

.popup__text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 60%;
    height: 100%;
    padding: 4rem;
}

.popup__text h1 {
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 2rem;
    text-transform: uppercase;
    color: #0A0A0A;
}

.popup__text p {
    font-size: 0.875rem;
    color: #686868;
    line-height: 1.5;
}

.popup:target {
    visibility: visible;
    opacity: 1;
}

.popup:target .popup-inner {
    bottom: 0;
    right: 0;
    transform: rotate(0);
}

.popup__close {
    position: absolute;
    right: -1rem;
    top: -1rem;
    width: 3rem;
    height: 3rem;
    font-size: 0.875rem;
    font-weight: 300;
    border-radius: 100%;
    background-color: #808080;
    z-index: 4;
    color: #fff;
    line-height: 3rem;
    text-align: center;
    cursor: pointer;
    text-decoration: none;
}

.phone-number {
    position: fixed;
    top: 30%;
    right: 2%;
}

.phone-number a {
    color: #fff;
}

.phone-number span {
    background-color: rgba(230, 8, 8, 0.75);
    border: none;

    transition: background-color 0.5s linear, color 0.5s linear;
}

.phone-number span:hover {
    background-color: rgba(230, 8, 8, 0.75);
}

.phone-number span:focus {
    outline: none;
}

.add-to-cart {
    animation: shadowFloat 1.2s linear alternate infinite;
    font-size: 16px;
    padding: 10px 30px;
    text-transform: uppercase;
    text-shadow: 0 1px 1px rgba(230, 8, 8, 0.75);
}

@keyframes shadowFloat {
    0% {
        box-shadow: 0 20px 40px #c7c7c7;
        transform: translateY(-3px);
    }

    100% {
        box-shadow: 0 10px 10px #bababa;
        transform: translateY(3px);
    }

}



span.background-call {
    width: 25px;
    height: 25px;
    background-size: cover;
}

span.background-call {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAAolBMVEUAAAD///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////8ELnaCAAAANXRSTlMA/fnwB9f2sUzq5dLDrDUi+t27jWpmXzALBOHNtJ6Dd1hUR0I9OB8Cx5mSiH1wGxkWEaWjUGLgVpsAAAFWSURBVDjLdZPpkoIwEIQn4RIFFA+8EURBXY+98v6vtrkYki38fqWmO0yqZwCDJjnsvHASbuPsC3oYjBhC4vF/+RwRxhwHLTRfm/I4IL4WkcA19CHrIVqB5pmqSjixHVetf3pMcnkVxHYMpL7Sr9/zngvbkDYAbZFs5JumtuMXOKrB8AMER9swFfno8wIkI8vg8zAifT4IebmjzGIJY/Nrruczmww7UN/lBoaJYeO5PjnshC8wmKOB58ANyYTZFFDq+5xKDHUjxvSDT60h6QypGM76nNU8/ZnSh7wirugR3KAjl5WYn4RX7wJ5QEfUhvN0ZAvFHfWEqJw4c2YgJyIjUx0Ezc50XOSl9U2Gpzd3JdwI2eaPu6rMcOFZLyH+HftenRSgedE+nZbQMuvT/SPqtRrQ9krM/icl4hpGA4AKl2GUudDxzbdJ+d0ySCn14gosgiCB9/wB7hZ8KfMqBEkAAAAASUVORK5CYII=);
}

.slick-slide .img-comment img {
    border-radius: 50%;
}

/*! CSS Used keyframes */
@-webkit-keyframes phonering-alo-circle-anim {
    0% {
        -webkit-transform: rotate(0) scale(0.5) skew(1deg);
        -webkit-opacity: 0.1;
    }

    30% {
        -webkit-transform: rotate(0) scale(0.7) skew(1deg);
        -webkit-opacity: 0.5;
    }

    100% {
        -webkit-transform: rotate(0) scale(1) skew(1deg);
        -webkit-opacity: 0.1;
    }
}

@-webkit-keyframes phonering-alo-circle-fill-anim {
    0% {
        -webkit-transform: rotate(0) scale(0.7) skew(1deg);
        opacity: 0.6;
    }

    50% {
        -webkit-transform: rotate(0) scale(1) skew(1deg);
        opacity: 0.6;
    }

    100% {
        -webkit-transform: rotate(0) scale(0.7) skew(1deg);
        opacity: 0.6;
    }
}

@-webkit-keyframes phonering-alo-circle-img-anim {
    0% {
        -webkit-transform: rotate(0) scale(1) skew(1deg);
    }

    10% {
        -webkit-transform: rotate(-25deg) scale(1) skew(1deg);
    }

    20% {
        -webkit-transform: rotate(25deg) scale(1) skew(1deg);
    }

    30% {
        -webkit-transform: rotate(-25deg) scale(1) skew(1deg);
    }

    40% {
        -webkit-transform: rotate(25deg) scale(1) skew(1deg);
    }

    50% {
        -webkit-transform: rotate(0) scale(1) skew(1deg);
    }

    100% {
        -webkit-transform: rotate(0) scale(1) skew(1deg);
    }
}

input.is-invalid {
    border: 2px solid red !important;
}

input.is-valid {
    border: 2px solid green !important;
}

/*===loading*/
.lds-spinner {
    color: official;
    position: absolute;
    width: 80px;
    height: 80px;
    left: 45%;
    top: 40%;
    z-index: 99999;
    display: none;
}

.lds-spinner div {
    transform-origin: 40px 40px;
    animation: lds-spinner 1.2s linear infinite;
}

.lds-spinner div:after {
    content: " ";
    display: block;
    position: absolute;
    top: 3px;
    left: 37px;
    width: 6px;
    height: 18px;
    border-radius: 20%;
    background: red;
}

.lds-spinner div:nth-child(1) {
    transform: rotate(0deg);
    animation-delay: -1.1s;
}

.lds-spinner div:nth-child(2) {
    transform: rotate(30deg);
    animation-delay: -1s;
}

.lds-spinner div:nth-child(3) {
    transform: rotate(60deg);
    animation-delay: -0.9s;
}

.lds-spinner div:nth-child(4) {
    transform: rotate(90deg);
    animation-delay: -0.8s;
}

.lds-spinner div:nth-child(5) {
    transform: rotate(120deg);
    animation-delay: -0.7s;
}

.lds-spinner div:nth-child(6) {
    transform: rotate(150deg);
    animation-delay: -0.6s;
}

.lds-spinner div:nth-child(7) {
    transform: rotate(180deg);
    animation-delay: -0.5s;
}

.lds-spinner div:nth-child(8) {
    transform: rotate(210deg);
    animation-delay: -0.4s;
}

.lds-spinner div:nth-child(9) {
    transform: rotate(240deg);
    animation-delay: -0.3s;
}

.lds-spinner div:nth-child(10) {
    transform: rotate(270deg);
    animation-delay: -0.2s;
}

.lds-spinner div:nth-child(11) {
    transform: rotate(300deg);
    animation-delay: -0.1s;
}

.lds-spinner div:nth-child(12) {
    transform: rotate(330deg);
    animation-delay: 0s;
}

@keyframes lds-spinner {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.bg_loading {
    width: 100%;
    opacity: 1;
    display: inline-block;
    border-radius: 20px;
    position: relative;
}

footer .ft_list li a:hover {
    color: #FC7C09;
}

.banner .img_banner_fb .desc h1 {
    font-style: normal;
    font-family: 'SVN-Gilroy Bold';
    font-weight: 800;
    font-size: 70px;
    line-height: 109%;
    color: #001894;
}

.banner .img_banner_zl .desc h1 {
    font-style: normal;
    font-family: 'SVN-Gilroy Bold';
    font-weight: 800;
    font-size: 70px;
    line-height: 109%;
    color: #001894;
}

.card-register .card-title .fb {
    font-style: normal;
    font-weight: 700;
    font-size: 24px;
    line-height: 25px;
    text-align: center;
    letter-spacing: 0.02em;
    color: #001023;
}

.introduce-fb .intro-title h2 {
    font-family: 'SVN-Gilroy Bold';
    font-style: normal;
    font-weight: 700;
    font-size: 40px;
    line-height: 50px;
    padding: 0 26%;
    text-align: center;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    /* Landing/Tím */
    color: #7246F8
}

.introduce-fb .box-1 {
    background: #FAF0D7;
    border-radius: 0px 58px 58px 58px;
    padding: 0 1% 0 0;
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.introduce-fb .box-2 {
    background: #F3DCEE;
    border-radius: 0px 58px 58px 58px;
    padding: 0 1% 0 0;
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.introduce-fb .box-3 {
    background: #E6DCF3;
    border-radius: 0px 58px 58px 58px;
    padding: 0 1% 0 0;
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.introduce-fb .box-4 {
    background: #FAF0D7;
    border-radius: 0px 58px 58px 58px;
    padding: 0 1% 0 0;
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.introduce-fb .box-5 {
    background: #F3DCEE;
    border-radius: 0px 58px 58px 58px;
    padding: 0 1% 0 0;
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.introduce-fb .card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.introduce-fb .card-top h3 {
    font-style: normal;
    font-family: 'SVN-Gilroy Bold';
    font-weight: 700;
    font-size: 32px;
    line-height: 34px;
    color: #000000;
}

.introduce-fb .card-top .title {
    padding-left: 5%;
}

.introduce-fb .card-content ul {
    list-style-type: none;
    text-align: justify;
    padding-right: 2rem;
    padding-bottom: 2rem;
}

.introduce-fb .card-content ul li {
    /* font-family: 'SVN-Gilroy Bold'; */
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 30px;

    /* Text/Dark 70 */
    color: #424857;
}

.full {
    padding: 2%;
}

.introduce-fb .row>div[class^="col-"] {
    display: flex;
    flex-direction: column;
}

.introduce-fb .row>div[class^="col-"]>* {
    flex-grow: 1;
}

.fea-fb {
    background: url('../images/bg-zalo-cca.png') no-repeat;
    background-size: cover;
    background-attachment: fixed;
}

.fea-fb .card-fea-fb .title h2 {
    font-family: 'SVN-Gilroy Bold';
    font-style: normal;
    font-weight: 700;
    font-size: 40px;
    line-height: 42px;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: #7246F8;
}

.fea-fb .card-fea-fb .content ul {
    list-style-type: none;
    display: flex;
    flex-direction: column;
    gap: 30px;
    padding: 0;
    text-align: justify;
}

.fea-fb .card-fea-fb {
    display: flex;
    flex-direction: column;
    gap: 30px;
    padding: 20% 0;
}

.fea-fb .card-fea-fb .content ul li {
    font-style: normal;
    font-weight: 900;
    font-size: 20px;
    line-height: 21px;
    letter-spacing: 0.02em;
    color: rgb(247, 247, 248);
}

.fea-fb .card-fea-fb .content ul span {
    font-family: 'SVN-Gilroy Bold';
    font-style: normal;
    font-weight: 900;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: 0.02em;
    color: rgb(247, 247, 248);
}

.comment-title h2.h2-fb {
    font-family: 'SVN-Gilroy Bold';
    font-style: normal;
    font-weight: 700;
    font-size: 32px;
    line-height: 130%;
    /* or 42px */
    text-align: center;
    letter-spacing: 0.02em;
    text-transform: uppercase;

    /* Landing/Tím */
    color: #7246F8;
}

.site-navbar .site-navigation .site-menu .active-fb>a span {
    background: #FFC600;
    color: #fff;
    border-radius: 30px;
    display: inline-block;
    padding: 5px 20px;
}

.site-navbar .site-navigation .site-menu>li>a.js-anchor-link-fb:hover>span {
    background: #FFC600;
    color: #fff;
    border-radius: 30px;
    display: inline-block;
}

.site-navbar .site-navigation .site-menu>li>a>span {
    font-style: normal;
    font-family: 'SVN-Gilroy Bold';
    font-weight: 700;
    font-size: 16px;
    line-height: 150%;
    /* identical to box height, or 24px */

    color: #5F5F5F;
}

footer .form-footer {
    background: rgba(255, 255, 255, 0.9);
    border-radius: 20px;
    padding: 25px;
    height: 369.06px;
}

footer .form-footer .title p.ft-fb-t1 {
    font-style: normal;
    font-weight: 900;
    font-size: 24px;
    line-height: 25px;
    text-align: center;
    letter-spacing: 0.02em;
    color: #001023;
}

footer .form-footer .title p.ft-fb-t2 {
    font-family: 'SVN-Gilroy Bold';
    font-style: normal;
    font-weight: 700;
    font-size: 40px;
    line-height: 42px;
    text-align: center;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: #001023;
}

.form-footer .btn-form-footer {
    padding: 0 10%;
}

.form-footer .desc p {
    font-style: italic;
    font-weight: 500;
    font-size: 14px;
    line-height: 15px;
    text-align: center;
    letter-spacing: 0.02em;
    color: #6E7891;
}

.zalo-features {
    display: flex;
    gap: 20px;
}
.zalo-features .content-zalo{
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.zalo-features ul li {
    color: rgb(66, 72, 87);
    font-family: 'SVN-Gilroy Bold';
    font-size: 14px;
    font-weight: 100;
    line-height: 16px;
    text-align: justify;
}
.zalo-features ul{
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 0;
}

.zalo-features h3 {
    font-family: 'SVN-Gilroy Bold';
    font-size: 26px;
    color: rgb(0, 0, 0);
    font-weight: 700;
    line-height: 19px;
    letter-spacing: 0%;
    text-align: left;
}
.card-tt{
    border-radius: 0px 70px 0px 70px;
    background: rgb(107 50 217);
    display: flex;
    flex-direction: column;
    gap: 20px;
    align-items: center;
    justify-content: center;
    padding: 30px;
}
.card-tt-2{
    border-radius: 70px 0 70px 0;
    background: rgb(107 50 217);
    display: flex;
    flex-direction: column;
    gap: 20px;
    align-items: center;
    justify-content: center;
    padding: 30px;
}
.list-tt{
    list-style-type: none;
    padding: 0;
}
.tt-top{
    padding-bottom: 22px;
}
.card-tt .title h3,
.card-tt-2 .title h3{
    color: rgb(255, 255, 255);
    font-family: 'SVN-Gilroy Bold';
    font-size: 26px;
    font-weight: 900;
    line-height: 19px;
    letter-spacing: 0%;
    text-align: left;
}
.card-tt ul li,
.card-tt-2 ul li{
    color: rgb(255, 255, 255);
    font-family: 'SVN-Gilroy Bold';
    font-size: 18px;
    font-weight: 100;
    line-height: 26px;
    letter-spacing: 0%;
/*    text-align: center;*/
}
.home-slider img {
    width: auto !important;
}
.card-register img {
    width: 100% !important;
    height: 100% !important;
}
.img-phay img {
    width: auto !important;
}
.icon.icon-youtube:before,
.icon.icon-facebook:before {
    content: none !important;
}
.outstanding_feature_image {
    width: 100%;
    height: auto;
}
.product-more .card-img-top_product_more {
    width: 70%;
    height: auto;
}
.introduce iframe {
    width: 100%;
    aspect-ratio: 1920/1080;
}
.bg-feature .content-1 ul li {
    list-style: square;
}