body::-webkit-scrollbar {
    width: 0.6em;
}
 
body::-webkit-scrollbar-track {
/*  box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.3);*/
}
 
body::-webkit-scrollbar-thumb {
    background-color: var(--color-main);
    border-radius: 1rem;
}
.rounded-8{
    border-radius: 8px;
}
.vf-btn-call {
    opacity: 0;
}
@media (min-width:1200px){    
    body {
        padding-top: 80.64px;
    }
    
    .main-menu {
        position: fixed;
        top: 0;
        width: 100%;
        z-index: 1000;
    }
    .box-recruitment-top>.row>div {
        flex: 0 0 30%;
        max-width: 30%;
    }
    
    .box-recruitment-top>.row>div:nth-child(3) {
        flex: 0 0 40%;
        max-width: 40%;
    }
    .row-item-tpl {
        margin-left: calc((100% - 1170px) / 2);
    }

}

@media (min-width: 1600px) {
    .container {
        max-width: 1460px;
    }
    .row-item-tpl {
        margin-left: calc((100% - 1430px) / 2);
    }
}

body {
    font-family: 'Roboto', sans-serif;
}
.btn {
    z-index: 0;
    border: 0;
}
.btn:not(.btn-registertrial) {
    position: relative;
    overflow: hidden;
}
.btn:not(.btn-registertrial):before {
    content: '';
    position: absolute;
    height: 100%;
    width: 0%;
    top: 0;
    left: -40px;
    transform: skewX(45deg);
    background: linear-gradient(90deg, #0D5DD6 0%, #9747FF 100%);
    z-index: -1;
    transition: all 1s;
}
.btn:not(.btn-registertrial):hover:before {
    width: 160%;
}
.btn:hover {
    color: #fff !important;
}

/*--------------------------------------------------------------------------
|  Trang Home
--------------------------------------------------------------------------*/
.bg-menu {
    background: var(--bg-light);
}
.main-menu.fixed {
    /* position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    background: #fff;
    z-index: 99;
    box-shadow: 0px 2px 4px 0px rgb(208 145 122 / 50%);
    animation: sticky 1s; */
    box-shadow: 0px 2px 4px 0px rgb(208 145 122 / 50%);
}
@keyframes sticky {
    0% {
        top: -100px; 
    }
    100% {
        top: 0; 
    } 
}
.main-menu>.container>.row {
    align-items: center;
}
.main-menu>.container>.row>div[class*=col-]:last-child {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
.btn-registertrial {
    position: relative;
    padding: 1.4rem 1.7rem;
    font-size: 1.6rem;
    line-height: 2rem;
    border: 0;
    border-radius: 0.8rem;
    background: var(--bg-grd);
    transition: all 0.3s ease-in-out;
    z-index: 10;
}
.btn-registertrial:before, .btn-registertrial:after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 0.8rem;
    z-index: 0;
    background: transparent;
}
.btn-registertrial:after {
    animation: pulse-blue-small-sm 3s infinite;
}
.btn-registertrial:before {
    animation: pulse-blue-medium-sm 3s infinite;
}
@keyframes pulse-blue-small-sm {
    0% {
        box-shadow: 0 0 0 0 rgb(18 97 211 / 70%);
    }
    100%,
    30% {
        box-shadow: 0 0 0 12px transparent
    }
}

@keyframes pulse-blue-medium-sm {
    0% {
        box-shadow: 0 0 0 0 rgb(143 81 248 / 70%);
    }
    100%,
    30% {
        box-shadow: 0 0 0 20px transparent
    }
}
.btn-registertrial:hover {
    transform: translateY(-4px) translateX(-2px);
    box-shadow: 2px 5px 0 0 #f66a20;
    color: #fff !important;
}

.bg-row-1 {
    background: var(--gradient-1);
}

.bg-row-2 {
     background: url("/templates/fashion03/assets/media/group_11778.png");
     background-repeat: no-repeat;
     background-size: cover;
     background-position: left bottom;
}

.box-section-ndth-02 {
    margin-bottom: 50px;
    padding-top: 40px;
}
.box-team-count {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: left bottom;
}

.bg-row-9 {
    background: #0047B4;
}

.bg-main {
    background: var(--color-main);
}

.main-menu > .container > .row > div:nth-child(2) {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.entire-action-header {
    position: relative;
    z-index: 10;
}

.entire-action-header .form-dropdown {
    position: absolute;
    padding: 10px;
    background-color: #ffffff;
    width: 300px;
    top: 100%;
    left: auto;
    right: 0;
    z-index: 1000;
    margin-bottom: 0;
    -webkit-animation: nav_menu_anim_close 0.3s both;
    -o-animation: nav_menu_anim_close 0.3s both;
    animation: nav_menu_anim_close 0.3s both;
    -webkit-transition: opacity 0.3s ease, visibility 0.3s ease;
    transition: opacity 0.3s ease, visibility 0.3s ease;
    opacity: 0;
    filter: opacity(0);
    visibility: hidden;
    -webkit-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.15);
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.15);
}

.entire-action-header:hover .form-dropdown {
    -webkit-animation: nav_menu_anim_open 0.3s both;
    -o-animation: nav_menu_anim_open 0.3s both;
    animation: nav_menu_anim_open 0.3s both;
    opacity: 1;
    filter: opacity(1);
    visibility: visible;
    pointer-events: unset;
}

.text-title {
    font-size: 4.8rem;
    font-weight: 900;
    line-height: 1.2;
    color: var(--color-main);
    /* font-family: 'Montserrat', sans-serif; */
}

.text-gradient {
    background: linear-gradient(to right, var(--color-main) 0%, #9248FE 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.home-ss1 {
    padding-top: 7rem;
}

.welcome-4s-desc {
    color: #002152;
    margin: 2.5rem 0;
}

.welcome-4s-desc .text-1 {
    font-size: 2.4rem;
    font-weight: bold;
    margin-bottom: 3rem;
}

.bg-span {
    display: inline-block;
    background: var(--color-main);
    transform: skewX(335deg);
    padding: 4px 8px;
    margin: 0;
}

.welcome-4s-desc .text-1 span {
    position: relative;
    color: white;
    transform: skewX(25deg);
    display: inline-block;
}

.welcome-4s-desc ul {
    list-style: none;
    padding: 0;
}

.welcome-4s-desc ul li:before {
    content: "\f00c";
    font-family: 'Font Awesome 6 Pro';
    font-weight: 900;
    background: rgb(13 93 214 / 50%);
    text-align: center;
    display: inline-block;
    width: 24px;
    height: 24px;
    line-height: 24px;
    border-radius: 5px;
    color: var(--color-main);
    margin-right: 1rem;
}

.welcome-4s-desc ul li {
    margin-bottom: 1rem;
    font-size: 1.6rem;
    color: #002152;
}
.welcome-4s-desc .text-3 {
    font-size: 1.6rem;
    color: #002152;
}
.welcome-4s .btn-pad {
    position: relative;
    padding: 1.5rem 6.6rem;
    font-size: 1.6rem;
    border: 0;
    border-radius: 0.8rem;
    transition: all 0.4s ease;
    z-index: 1;
    -webkit-box-shadow: 0 5px 15px rgba(33, 33, 33, .2);
    box-shadow: 0 5px 15px rgba(33, 33, 33, .2);
}
.welcome-4s .btn-pad:hover {
    background-color: var(--color-main);
    color: #fff;
}

.welcome-4s .note-commit {
    color: #002152;
    font-size: 1.6rem;
}

.welcome-4s-desc .text-3 span {
    font-size: 4rem;
    font-weight: bold;
    color: var(--color-main);
}

.btn-scroll {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: nowrap;
    border: 1px solid #c2cddb;
    padding: 1rem 1.5rem;
    border-top-left-radius: 7rem;
    border-top-right-radius: 7rem;
    border-bottom-left-radius: 10rem;
    border-bottom-right-radius: 10rem;
    margin: 6rem 0 10rem;
    min-height: 7rem;
    box-shadow: 0px 2px 2px 0px #c2cddb;
}

.btn-scroll i {
    color: white;
}

.icon-scroll {
    position: relative;
    display: inherit;
    height: 20px;
    width: 8px;
    background: #6799d9;
    border-radius: 1rem;
    margin-bottom: 20px;
    animation: scroll ease 2s infinite;
}
.icon-scroll:before {
    content: "";
    position: absolute;
    bottom: 5px;
    left: 50%;
    transform: translateX(-50%);
    width: 1px;
    height: 30%;
    background: #fff;
}
@keyframes scroll {
    0% {
        transform: translateY(0);
    }
    60% {
        transform: translateY(20px);
    }
}
.swiper-template-home .product-home {
    margin-bottom: 0;
}
.list-category .img-category {
    border-radius: 0.8rem;
    overflow: hidden;
}
.list-category, .client-main .swiper-slide {
    transition: .3s;
}
.list-category:hover {
    border-radius: 0.8rem;
    box-shadow: 0px 2px 4px 0px rgb(208 145 122 / 50%);
    transition: .3s;
}
.client-main .swiper-slide:hover {
    box-shadow: 1rem 1rem 2.4rem rgba(0,0,0,.1);
    transition: .3s;
}
.swiper-scrollbar-drag {
    cursor: grab;
}
.home-ss2 {
    background: #155CD9;
    background: -moz-linear-gradient(-45deg, #155CD9 0%, #9248FE 100%);
    background: -webkit-linear-gradient(-45deg, #155CD9 0%, #9248FE 100%);
    background: linear-gradient(135deg, #155CD9 0%, #9248FE 100%);
    padding: 3rem;
    border-radius: 1.8rem;
    height: calc(100% - 0.5rem);
}

.toplist-web4s {
    color: white;
    text-transform: uppercase;
    position: relative;
    line-height: 5.5rem;
    /* font-family: 'Montserrat', sans-serif; */
}

.toplist-web4s p {
    font-size: 3rem;
    font-weight: 900;
    position: relative;
}

.title-toplist-4s {
    font-size: 2.4rem;
    position: relative;
}

.toplist-web4s:before {
    content: "";
    width: 50%;
    position: absolute;
    top: 0;
    left: 0;
    background: #155CD9;
    background: -moz-linear-gradient(-45deg, #155CD9 30%, #9248FE 70%);
    background: -webkit-linear-gradient(-45deg, #155CD9 30%, #9248FE 70%);
    background: linear-gradient(135deg, #155CD9 30%, #9248FE 70%);
    aspect-ratio: 1/1;
    border-radius: 100%;
}

.view-param {
    color: white;
    position: relative;
    margin-bottom: 4rem;
}
.view-param .single-param {
    margin-bottom: 2.5rem;
}
.view-param .single-param:last-child {
    margin-bottom: 0;
}
.home-ss2 .btn {
    padding: 1.5rem 3.8rem;
    font-size: 1.6rem;
    line-height: 1.1;
    border-radius: 0.8rem;
    transition: all 0.3s ease-in-out;
}
.vc-label {
    background: white;
    width: 100%;
    height: .6rem;
    position: relative;
    border-radius: 1rem;
    overflow: hidden;
    margin-bottom: 0;
}

.title-param {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    font-size: 1.6rem;
    margin-bottom: 0.6rem;
}

.vc-bar.animated {
    display: block;
    position: absolute;
    height: 100%;
    top: 0;
    left: 0;
    background: #9747FF;
    border-radius: 0;
}

.ytb-4s {
    position: relative;
    padding: 4rem;
    transition: all .4s ease;
}
.ytb-4s.run-video {
    padding: 0;
    transition: all .4s ease;
}

.user-box-ytb {
    background: white;
    padding: 1rem;
    position: relative;
    z-index: 1;
    border-radius: 1rem;
    box-shadow: 0px 2px 4px 0px rgb(208 145 122 / 50%);
    transition: all .4s ease;
}
.user-box-ytb .ratio-user-ytb:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: hsl(0deg 0% 0% / 49%);
    z-index: 1;
    border-radius: 0.5rem;
}
.user-box-ytb .icon-play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
    cursor: pointer;
}
.user-box-ytb .icon-play .sppb-ripple-effect {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    border-radius: 100%;
    box-shadow: 0 0 0 15px rgba(255,255,255,.8), 0 0 0 30px rgba(255,255,255,.6), 0 0 0 45px rgba(255,255,255,.4);
    z-index: -1;
    animation: sppbModalRipple 2s infinite;
}
@keyframes sppbModalRipple {
    0% {
        opacity: 0;
        -webkit-transform: scale(.5);
        transform: scale(.5)
    }

    10% {
        opacity: 1
    }

    90% {
        opacity: 0
    }

    to {
        opacity: 0;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}
.user-box-ytb iframe {
    border-radius: 0.5rem;
}

.user-numb {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 2;
    background-size: cover;
    aspect-ratio: 1/1;
    padding: 1.5rem;
    box-shadow: 0px 2px 4px 0px rgb(208 145 122 / 50%);
    border-radius: 2rem;
    overflow: hidden;
    animation: moving_object 6s infinite linear;
    animation-delay: 3s;
}
@keyframes moving_object {
    0% {
        transform: translateY(0);
    }

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

    100% {
        transform: translateY(0);
    }
}

.user-after {
    position: absolute;
    right: 0;
    top: 0;
}

.user-numb i {
    background: #B9D5FF;
    aspect-ratio: 1/1;
    padding: .8rem;
    border-radius: 100%;
    color: var(--color-main);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.8rem;
    margin-bottom: .5rem;
}

.user-numb .i-numb {
    font-size: 2rem;
    font-weight: 700;
    color: #002152;
    /* font-family: 'Montserrat', sans-serif; */
}

.user-numb .text-numb {
    color: gray;
}
.run-video .user-numb, .run-video .icon-play, .run-video .ratio-user-ytb:before {
    visibility: hidden;
    opacity: 0;
    transition: visibility 0s linear 0.33s, opacity 0.33s linear;
}

.item-title-category {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center;
    font-size: 1.6rem;
    color: white;
    margin: 0;
    padding: .8rem;
    z-index: 5;
}

.bg-responsive {
    background-repeat: no-repeat;
    background-size: cover;
}

.bg-row-3 {
    background-position: center bottom;
    padding: 8rem 0;
    background-size: contain !important;
}
.list-category .img-category:before {
    content: '';
    position: absolute;
    bottom: 0;
    height: 50%;
    background-image: linear-gradient(359deg, #000000, #ffc0cb00);
    z-index: 1;
    width: 100%;
    left: 0;
    pointer-events: none;
}
.bg-row-4 {
    background: #f0f5fe;
    background: -moz-linear-gradient(top, #f0f5fe 0%, #fbfcfe 100%);
    background: -webkit-linear-gradient(top, #f0f5fe 0%, #fbfcfe 100%);
    background: linear-gradient(to bottom, #f0f5fe 0%, #fbfcfe 100%);
}

.client-main .swiper-button-next, .client-main .swiper-button-prev {
    position: relative;
    top: 0;
    left: 0;
    right: 0;
    font-size: 18px;
    display: inline-flex;
    transform: none;
    color: black;
    margin: 0 .5rem;
    align-items: center;
    justify-content: center;
    line-height: initial !important;
    padding-bottom: 0;
    padding-top: 1px;
}

.client-main .swiper-scrollbar {
    bottom: 0;
}

.client-main .swiper-pagination-fraction {
    bottom: -10px;
}

.client--tile {
    font-weight: 700;
    font-size: 1.6rem;
    color: #002152;
    text-transform: capitalize;
    margin-bottom: 0.4rem;
}

.client--manager {
    font-size: 1.2rem;
    color: #7E7E7E;
    white-space: pre-wrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    display: -webkit-box;
}

.client--description {
    color: #7E7E7E;
    margin-top: 1rem;
    font-size: 1.3rem;
    white-space: pre-wrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    display: -webkit-box;
}

.ratio-client {
    padding-top: 130%;
    overflow: hidden;
    border-radius: 8px;
}

.bg-row-5 {
    background-position: top;
    background-size: contain;
    padding: 7rem 0;
}

.card {
    background: #EEF8FF;
    border: 1px solid var(--color-main);
    border-radius: 8px;
    margin-bottom: 1.5rem;
    overflow: hidden;
}

.card:last-child {
    margin: 0;
}

.card-body {
    padding: 1rem  2rem 2rem 2rem;
}

.card-header h5 button {
    width: 100%;
    text-align: left;
    font-size: 1.5rem;
    padding: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: bold;
    color: var(--color-main);
}

.card-header h5 button:hover {
    color: var(--color-highlight);
    text-decoration: none;
}

.card-header h5 button:focus {
    text-decoration: none;
}

.card-header h5 button:not(.collapsed) i {
    transform: rotate(180deg);
}

.card-header h5 button.collapsed {
    background: white;
    font-weight: 400;
    color: #002152;
}

.home-ss3 {
    padding: 3rem 0;
}

.home-ss3 .fa-quote-left {
    position: absolute;
    top: -40px;
    left: -75px;
    font-size: 10rem;
    color: rgb(138 188 236 / 50%);
}

.home-form {
    background: white;
    padding: 2.5rem;
    border-radius: 2rem;
    box-shadow: 0px 0px 48px rgba(13, 93, 214, 0.25);
    position: relative;
}
.home-form .form-group {
    margin-bottom: 1.5rem;
}
.home-form .form-control {
    background: #f5f5f5;
    border-radius: 0.5rem;
    font-size: 1.6rem;
    height: 4.8rem;
}
.home-form textarea.form-control {
    height: 7rem;
}
.home-form .btn {
    font-size: 1.6rem;
    padding: 1.4rem;
    line-height: 1.1;
}
.title-form {
    color: var(--color-main);
    font-weight: 700;
    font-size: 2.1rem;
    line-height: 1.2;
    /* font-family: 'Montserrat', sans-serif; */
    margin-bottom: 1rem;
}
.desc-form {
    color: #002152;
    /* font-family: 'Montserrat', sans-serif; */
    margin-bottom: 1.5rem;
}

.article-category .bg-cate {
    background: #BAD5FF;
    padding: 0.6rem;
    border-radius: 3rem;
    /* font-family: 'Montserrat', sans-serif; */
    font-size: 1.2rem;
    margin-right: 3px;
}
.article-item .inner-content .view {
    font-size: 1.2rem;
    /* font-family: 'Montserrat', sans-serif; */
}

.article-category .bg-id25 {
    background: #F4E4C6 !important;
    color: #BE5300 !important;
}

.home-ss4 {
    padding: 3rem 0;
    background-size: cover;
    background-position: center;
    border-radius: 2rem;
}

.title-tabs {
    font-size: 3.2rem;
    font-weight: 700;
    /* font-family: 'Montserrat', sans-serif; */
    color: var(--color-main);
    text-transform: uppercase;
}

.btn-pad {
    padding: 0.85rem 6.25rem;
}

.product-home {
    position: relative;
}

.product-home .inner-content {
    position: absolute;
    width: 100%;
    bottom: -110px;
    background: rgb(255 255 255 / 75%);
    -webkit-transition: all 3s ease-in-out 0s;
    -moz-transition: all 3s ease-in-out 0s;
    -ms-transition: all 3s ease-in-out 0s;
    transition: all 1s ease-in-out 0s;
}

.ratio-home {
    padding-top: 150%;
}

.product-home:hover .inner-content {
    bottom: 0;
}

.swiper-template-home .swiper-scrollbar {
    left: inherit;
    right: 1%;
    width: 20%;
    background: #BAD5FF;
}

.swiper-template-home .swiper-scrollbar .swiper-scrollbar-drag {
    background: var(--color-main);
}

.home  .article-item.swiper-slide {
    margin-bottom: 0;
    /* font-family: 'Montserrat', sans-serif; */
}

.img-category img {
    -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -ms-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
}

.list-category:hover .img-category img {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
}

/*--------------------------------------------------------------------------
|  Footer
--------------------------------------------------------------------------*/
footer {
    /* font-family: Montserrat; */
}
.home-ss4 .title-phone-contact {
    color: white;
    font-size: 3.2rem;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 3.2rem;
}

.home-ss4 form .form-group {
    position: relative;
}

.home-ss4 form .form-group .form-control {
    background: rgb(255 255 255 / 50%);
    border: 0;
    line-height: 1.5;
    height: 6.6rem;
    border-radius: 6rem;
    color: #002152;
    padding: 1.5rem 0 1.5rem 2.5rem;
    font-size: 1.6rem;
}

.home-ss4 form .form-group .form-control::placeholder {
    color: #002152;
    opacity: 1;
}

.home-ss4 form .form-group .form-control::-ms-input-placeholder {
    color: #002152;
}

.home-ss4 form .form-group .btn-submit {
    position: absolute;
    right: 1rem;
    top: 0.5rem;
    border-radius: 3rem;
    padding: 1.5rem 2.25rem;
    font-size: 1.6rem;
    font-weight: 700;
    min-width: 11.5rem;
    height: 5.6rem;
}

.bg-row-7 {
    background: white;
    background: -moz-linear-gradient(top, #FFFFFF 50%, #F7F8FA 50%);
    background: -webkit-linear-gradient(top, #FFFFFF 50%, #F7F8FA 50%);
    background: linear-gradient(to bottom, #FFFFFF 50%, #F7F8FA 50%);
}

.bg-row-8 {
    background: #f7f8fa;
}

.title-address {
    color: #002152;
    font-size: 2.4rem;
    font-weight: 700;
}
.entire-info-website address {
    margin-bottom: 2.5rem;
}
.entire-info-website .block-tab.nav .nav-link.active {
    background: white;
    font-weight: bold;
    color: #002152;
}
.entire-info-website .block-tab.nav .nav-item {
    margin-right: 0;
}
.entire-info-website .block-tab.nav .nav-link {
    border-radius: 0;
    padding: .8rem 3rem;
    text-transform: capitalize !important;
}

.entire-info-website .tab-content {
    color: #002152;
    padding: 2.5rem 1.5rem;
    border-radius: 0 0 .8rem .8rem;
    box-shadow: 2px 7px 9px 0px rgb(0 0 0 / 16%);
}

.entire-info-website address p i {
    font-size: 17px;
    width: 30px;
    aspect-ratio: 1/1;
    color: #002152;
    text-align: center;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-right: .8rem;
}

.entire-info-website address p:nth-child(n+2) i {
    background: #002152;
    color: white;
    border-radius: 100%;
}
.app-mobile {
    align-items: center;
    justify-content: space-between;
}
.app-mobile>div[class*=col-] {
    justify-content: flex-end;
}
.app-mobile p {
    color: #002152;
    font-size: 1.6rem;
}
.app-mobile a {
    color: #002152;
    font-size: 1.6rem;
}

.title-footer {
    font-size: 1.8rem;
    color: #002152;
    font-weight: 700;
}

.footer-menu-section ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-menu-section ul li {
    margin-bottom: 1.5rem;
}
.footer-contact-info {
    padding: 5rem 0;
}
.footer-menu-section a {
    color: #002152;
}

.certificate-image {
    background: #F6F6F6;
    padding: 1rem;
    border-radius: 1rem;
    text-align: center;
}

.certificate-image img {
    height: 3.5rem;
    max-width: 15rem;
}
.footer-menu {
    padding: 5rem 0;
}
.footer-menu-section ul.social {
    display: flex;
    flex-wrap: wrap;
}
.footer-menu-section ul.social li {
    flex: 0 0 20%;
    max-width: 20%;
}
.title-tag {
    font-size: 2rem;
    color: white;
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
}

.footer-tag-section ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-tag-section ul li {
    margin-bottom: .8rem;
}

/*--------------------------------------------------------------------------
|  Modal dang ky dung thu
--------------------------------------------------------------------------*/
#registertrial-modal {
    background: #0D5DD6;
    background: -moz-linear-gradient(left, #0D5DD6 42.8%, #E6EAF3 42.8%);
    background: -webkit-linear-gradient(left, #0D5DD6 42.8%, #E6EAF3 42.8%);
    background: linear-gradient(to right, #0D5DD6 42.8%, #E6EAF3 42.8%);
    padding: 0 !important;
}

#registertrial-modal .modal-dialog {
    max-width: 1170px;
}

#registertrial-modal button.close {
    position: absolute;
    right: 0;
    top: -30px;
    font-size: 1.6rem;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    justify-content: center;
    z-index: 1;
}

#registertrial-modal button.close span {
    font-size: 2rem;
    width: 25px;
    height: 25px;
    border: 1px solid;
    border-radius: 100%;
    margin-right: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 2px;
}

#registertrial-modal .modal-content {
    border: 0;
    border-radius: 1rem;
    box-shadow: 0px 0px 36px rgba(0, 58.78, 147.69, 0.25);
}

.ratio-registertrial {
    padding-top: 115%;
}

.text-registertrial {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    transform: translateY(-50%);
    padding: 3rem;
    color: white;
}

.text-registertrial p {
    font-size: 3rem;
    font-weight: 700;
}

.form-registertrial .first-input-group {
    background: white;
    color: var(--color-main);
    font-size: 1.7rem;
    border-color: #bfdaff;
    border-radius: 5px;
}

/*--------------------------------------------------------------------------
|  Trang gioi thieu
--------------------------------------------------------------------------*/
.bg-about-1 {
    position: relative;
    background: var(--gradient-2);
}

.swiper-about-thumbs .swiper-slide {
    border: 0;
    color: #002152;
    padding: 1rem 0;
}

.swiper-about--tile {
    font-size: 1.8rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.swiper-about-thumbs .fa-circle {
    font-size: 3rem;
    border-radius: 100%;
}

.swiper-about-thumbs .swiper-slide.swiper-slide-thumb-active .fa-circle {
    color: var(--color-highlight);
    background: var(--color-highlight);
    box-shadow: 0px 0px 0 5px #FFCBA5;
}

.swiper-about-thumbs .swiper-slide:before {
    content: "";
    width: 90%;
    height: 1px;
    background: #002152;
    position: absolute;
    left: 64%;
    top: 24px;
}

.swiper-about-thumbs .swiper-slide:last-child::after {
    content: "\f054";
    position: absolute;
    width: auto;
    right: 0;
    top: 15px;
    font-family: 'Font Awesome 6 Pro';
    font-weight: 900;
    z-index: 1;
}

.benefit-main {
    background-size: 650px;
    background-position: left top;
    padding: 3rem 0;
}

.benefit-image {
    background: #D6E6FF;
    padding: 2rem;
    border-radius: 100%;
    display: inline-block;
    transition: transform .2s;
}

.item-benefit:hover .benefit-image {
    transform: scale(.8);
    box-shadow: 0px 0px 0px 8px #ECF2FC;
}

.benefit--title {
    font-weight: 600;
    margin-bottom: 1rem;
    font-size: 1.6rem;
}

.ecosystem-icon {
    background: var(--color-main);
    display: inline-flex;
    height: 82px;
    width: 82px;
    padding: 2rem;
    border-radius: 100%;
    align-items: center;
    justify-content: center;
    align-content: center;
}

.ecosystem-tile {
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.ecosystem-description {
    font-size: 13px;
    white-space: pre-wrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    display: -webkit-box;
}

.item-ecosystem {
    padding: 1.5rem;
    border-radius: 2rem;
}

.bg-item-0 {
    background: #DBEAFE;
}

.bg-icon-0 {
    box-shadow: 0px 0px 0px 5px #ADD0FF;
}

.bg-item-1 {
    background: #FFE4E6;
}

.bg-icon-1 {
    background: #F43F4C;
    box-shadow: 0px 0px 0px 5px #FFB6BB;
}

.bg-item-2 {
    background: #CCFBF1;
}

.bg-icon-2 {
    background: #40A18D;
    box-shadow: 0px 0px 0px 5px #83EAD4;
}

.bg-item-3 {
    background: #FAE8FF;
}

.bg-icon-3 {
    background: #B247CF;
    box-shadow: 0px 0px 0px 5px #F1C0FF;
}

.bg-item-4 {
    background: #CFFAFE;
}

.bg-icon-4 {
    background: #62C1CA;
    box-shadow: 0px 0px 0px 5px #96E5EC;
}

.bg-item-5 {
    background: #E0E7FF;
}

.bg-icon-5 {
    background: #6C85DA;
    box-shadow: 0px 0px 0px 5px #A3B7FF;
}

.bg-item-6 {
    background: #EDE9FE;
}

.bg-icon-6 {
    background: #735FCB;
    box-shadow: 0px 0px 0px 5px #D3C9FF;
}

.bg-item-7 {
    background: #FCE7F3;
}

.bg-icon-7 {
    background: #DB278E;
    box-shadow: 0px 0px 0px 5px #FFBEE3;
}

.bg-item-8 {
    background: #DCFCE7;
}

.bg-icon-8 {
    background: #6BB785;
    box-shadow: 0px 0px 0px 5px #ABEDC2;
}

.bg-item-9 {
    background: #FFEDD5;
}

.bg-icon-9 {
    background: #C69758;
    box-shadow: 0px 0px 0px 5px #FFDBAB;
}

.bg-about-2 {
    background: #F4F8FF;
}

.item-marketing {
    color: #002152;
}

.marketing--number {
    font-size: 4rem;
    font-weight: bold;
    color: var(--color-main);
    margin-bottom: 1rem;
}

.marketing--tile {
    font-size: 1.6rem;
    font-weight: 600;
    margin-bottom: 1.5rem;
}

.title-html {
    background: #0D5DD6;
    background: -moz-linear-gradient(top, #0D5DD6 0%, #9747FF 100%);
    background: -webkit-linear-gradient(top, #0D5DD6 0%, #9747FF 100%);
    background: linear-gradient(to bottom, #0D5DD6 0%, #9747FF 100%);
    display: flex;
    height: 100%;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    color: white;
    font-size: 3rem;
    font-weight: 700;
    border-radius: 8px;
}

.item-html {
    background: var(--color-main);
    height: 100%;
    padding: 2rem;
}

.bg1--item-html {
    background: #DBEAFE;
}

.bg2--item-html {
    background: #EDE9FE;
}

.reg-html {
    background: var(--color-main);
    height: 100%;
    padding: 2rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    color: white;
}

.reg-html h4 {
    font-weight: 600;
}

.reg-html .btn {
    color: white;
    border: 1px solid white;
    border-radius: 8px;
}

.reg-html .btn:hover {
    background: white;
    color: var(--color-main);
}

/*--------------------------------------------------------------------------
|  Trang cham soc website
--------------------------------------------------------------------------*/
.swiper-bmdn-main .item-bmdn {
    background: white;
    padding: 2rem;
    border-radius: 1.8rem;
    box-shadow: 0px 0px 10px 1px rgb(0 59 148 / 25%);
}

.swiper-bmdn-main .swiper-slide:nth-child(odd) .item-bmdn {
    background: var(--color-main);
    color: white;
}

.swiper-bmdn-main .swiper-slide {
    margin-top: 8rem;
    padding: .5rem;
}

.image-bmdn {
    margin-top: -8rem;
}

.change--tile {
    font-size: 3rem;
    font-weight: bold;
    color: var(--color-main);
    margin-bottom: 1rem;
}

.block-cust-care > li > a {
    background: none;
    color: var(--color-main);
    display: flex;
    align-content: center;
    align-items: center;
}

.block-cust-care .nav-item i {
    height: 5rem;
    width: 5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: white;
    border-radius: 100%;
    font-size: 2.5rem;
    box-shadow: 0px 0px 4px 2px #E3EEFF;
}

.block-cust-care > li > a.nav-link.active {
    background: none;
    color: var(--color-main);
}

.block-cust-care > li > a.nav-link.active i {
    background: var(--color-main);
    color: white;
}

.position-vector.vec1 {
    text-align: right;
}

.position-vector.vec2 {
    text-align: left;
}

.block-cust-care {
    position: absolute;
    top: 0;
}

.cust-care2 {
    left: 0;
}

.cust-care1 {
    right: 0;
}

.tab-number {
    font-size: 5rem;
    font-weight: bold;
    color: var(--color-main);
    margin-bottom: 3rem;
}

/*--------------------------------------------------------------------------
|  Trang nhan dien thuong hieu
--------------------------------------------------------------------------*/
.swiper-ndth-main .swiper-slide {
    padding: 3.5rem;
}

.item-ndth {
    aspect-ratio: 1/1;
    background: white;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    box-shadow: 0px 0px 4px 2px #D6E6FF;
    border-radius: 1rem;
    padding: 2rem;
}

.swiper-ndth-main .swiper-slide {
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: 100% 0 !important;
}

/*.swiper-ndth-main .swiper-slide:nth-child(1) {
    background: url(https://cdn1585.cdn4s4.io.vn/media/template/nd-thuong-hieu/group11914.png);
}

.swiper-ndth-main .swiper-slide:nth-child(2) {
    background: url(https://cdn1585.cdn4s4.io.vn/media/template/nd-thuong-hieu/group11915.png);
}

.swiper-ndth-main .swiper-slide:nth-child(3) {
    background: url(https://cdn1585.cdn4s4.io.vn/media/template/nd-thuong-hieu/group11916.png);
}

.swiper-ndth-main .swiper-slide:nth-child(4) {
    background: url(https://cdn1585.cdn4s4.io.vn/media/template/nd-thuong-hieu/group11917.png);
}
*/
.item-log-brand:hover {
    transform: scale(1.1);
    box-shadow: 0px 0px 4px 1px #cdcdcd;
}

.item-log-brand {
    transition: transform .2s;
}

.faq-list-price .bg-row-5 {
    background: linear-gradient(to bottom, #f0f5fe 0%, #ffffff 100%) !important;
}

.item-price-list-brand {
    background: #fff;
    text-align: center;
    border-radius: 15px;
    box-shadow: 0 3px 6px 0 rgba(0,0,0,.16);
    position: relative;
    overflow: hidden;
}

.item-price-list-brand .title-price-list-brand {
    padding: 20px 0 0;
    font-size: 23px;
    font-weight: 700;
    color: var(--color-main);
}

.price-brand {
    font-size: 30px;
    font-weight: 700;
    background-image: linear-gradient(to right, #0D8AD6, #3AB4FF);
    height: 68px;
    line-height: 68px;
    color: #fff;
}

.description-brand {
    padding: 15px;
    margin-bottom: 0px;
    font-size: 16px;
    font-weight: 700;
    color: var(--color-main);
}

.description-brand-bottom {
    padding: 15px 20px;
    text-align: center;
}

.description-brand-bottom p {
    font-size: 16px;
    font-weight: 700;
}

.description-brand-bottom>ul>li {
    margin-bottom: 10px;
    position: relative;
    font-size: 14px;
    padding-left: 0;
    list-style: none;
}

.item-price-list-brand:before {
    content: '';
    position: absolute;
    left: -41px;
    width: 83px;
    height: 83px;
    background-image: linear-gradient(to right, #0D8AD6, #39b3fe);
    transform-Origin: 50% 50%;
    transform: rotate(45deg);
    top: -41px;
}

.price-list-brand .row>div:nth-child(2) .item-price-list-brand:before {
    background-image: linear-gradient(to right, #00CCFA, #00D365);
}

.price-list-brand .row>div:nth-child(2) .item-price-list-brand .price-brand {
    background-image: linear-gradient(to right, #00CCFA, #00D365);
}

.price-list-brand .row>div:nth-child(3) .item-price-list-brand .price-brand {
    background-image: linear-gradient(to right, #F76F05, #FFAA00);
}

.price-list-brand .row>div:nth-child(3) .item-price-list-brand:before {
    background-image: linear-gradient(to right, #F76F05, #FFAA00);
}

.img-price-list-brand {
    padding-bottom: 20px;
}
.img-price-list-brand img {
    padding: 20px;
}
.img-typical-projects {
    position: relative;
    padding-top: 68%;
    margin-bottom: 20px;
    border-radius: 5px;
    overflow: hidden;
}

.img-typical-projects img {
    width: 100%;
    position: absolute;
    top: 0;
    height: 100%;
    left: 0;
    object-fit: cover;
}

/*--------------------------------------------------------------------------
|  Trang kho tempalte
--------------------------------------------------------------------------*/
.product-item img {
    object-position: top;
    -webkit-transition: all 3s ease-in-out 0s;
    -moz-transition: all 3s ease-in-out 0s;
    -ms-transition: all 3s ease-in-out 0s;
    transition: all 3s ease-in-out 0s;
}

.product-item:hover img {
    object-position: bottom;
}

.btn-submit-white {
    width: 100%;
    border: 1px solid var(--color-main);
    color: var(--color-main);
    border-radius: 0.5rem;
}

.btn-submit-white:hover {
    background: var(--color-main);
    color: white;
}

.swiper-album-image {
    padding: 8rem 0;
}
.swiper-album-image .swiper-wrapper {
    align-items: center;
}
.swiper-album-image .swiper-slide-visible.swiper-slide-active {
    transform: scale(1.9) !important;
}
.swiper-album-image .swiper-slide .ratio-custome {
    padding-top: 196%;
}
.swiper-album-image .swiper-slide:not(.swiper-slide-active) .ratio-custome:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, rgba(13, 93, 214, 0.25) 0%, rgba(13, 93, 214, 0.25) 100%);
    z-index: 1;
}
.swiper-album-image .swiper-slide-visible.swiper-slide-active .ratio-custome {
    padding-top: 130%;
}
.swiper-button-next-lydo, .swiper-button-prev-lydo, .swiper-button-next-loiich, .swiper-button-prev-loiich {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-text);
    font-size: 2.1rem;
}
.swiper-button-next-lydo, .swiper-button-next-loiich {
    right: -1rem;
    background: #ddd !important;
}
.swiper-button-prev-lydo, .swiper-button-prev-loiich {
    left: -1rem;
    background: #ddd !important;
}
.swiper-album-image .swiper-button-prev, .swiper-album-image .swiper-button-next, .swiper-button-next-lydo, .swiper-button-prev-lydo, .swiper-button-next-loiich, .swiper-button-prev-loiich {
    width: 4rem;
    height: 4rem;
    background: var(--white);
    border-radius: 100%;
}
.swiper-album-image .swiper-button-next {
    right: 8rem;
}
.swiper-album-image .swiper-button-prev {
    left: 8rem;
}
.item-album-image {
    border: 2px solid white;
    border-radius: 1rem;
    overflow: hidden;
}

.item-album-image img {
    object-position: top;
}

.filter-product {
    padding: 1.5rem;
    border-radius: 0.9rem;
    border: 1px solid #D6E6FF;
    background: #FFF;
    box-shadow: 0 0 3.6rem 0 #D6E6FF;
}
.filter-product .input-group > .form-control.bg-search {
    background: #D6E6FF;
    border-radius: 0.5rem !important;
    height: 4.8rem;
}
.filter-product .ms-options-wrap {
    position: relative;
    padding: 0 3rem;
}
.filter-product .ms-options-wrap > div {
    position: relative;
}
.filter-product .ms-options-wrap > div > a {
    padding: 1rem 0;
    color: #002F75;
    /* font-family: Montserrat; */
    font-size: 16px;
}
.filter-product .ms-options-wrap > div > a.active {
    font-weight: 700;
}
.filter-product .ms-options-wrap .ms-options {
    position: absolute;
    min-width: 26rem;
    top: 100%;
    left: 0;
    right: 0;
    /* font-family: 'Montserrat', sans-serif; */
    background: #fff;
    box-shadow: 0px 0px 4px 1px #E6E6E6;
    border-radius: 0.4rem;
    z-index: 10;
    opacity: 0;
    filter: opacity(0);
    visibility: hidden;
    -webkit-transition: opacity 0.05s ease;
    transition: opacity 0.05s ease;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    -o-transform: translateY(20px);
    transform: translateY(20px);
}
.filter-product .ms-options-wrap .ms-options ul {
    padding: 0;
    margin-bottom: 0;
}
.filter-product .ms-options-wrap > div:hover .ms-options {
    opacity: 1;
    filter: opacity(1);
    visibility: visible;
    -webkit-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
}
.filter-product .ms-options-wrap .ms-options ul li a {
    display: block;
    width: 100%;
    padding: 1rem;
    margin: 0;
    border-bottom: 1px solid #D9D9D9;
    color: black;
}
.filter-product .ms-options-wrap .ms-options ul li:last-child a {
    border-bottom: 0;
}


.menu-icon .icon-image {
    height: 5rem;
    width: 5rem;
    background: #D6E6FF;
    padding: 1rem;
    border-radius: 100%;
    margin: 0 auto 1rem auto;
}

.item--menu-icon {
    color: #002F75;
    padding: 2rem;
    /* aspect-ratio: 15/9; */
    height: 100%;
}

.item--menu-icon:hover {
    background: white;
    border-radius: .8rem;
    box-shadow: 0px 0px 10px 1px #D6E6FF;
    overflow: hidden;
}

.btn-reg-ico {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #D6E6FF;
    padding: .5rem;
    border-radius: 3rem;
}

.btn-reg-ico span {
    padding: 1rem;
}

.btn-reg-ico .btn-submit {
    border-radius: 3rem;
}

.swiper-arrow {
    display: flex;
    margin-top: 1rem;
}

.swiper-arrow > div {
    position: relative;
    left: 0;
    right: 0;
    top: 0;
    transform: translateY(0px);
    background: #D6E6FF;
    color: var(--color-main);
    aspect-ratio: 1/1;
    padding: .8rem 1rem;
    border-radius: 100%;
}

.swiper-arrow .swiper-button-next {
    margin-right: 1rem;
}

.swiper-arrow > div:hover {
    background: var(--color-main);
    color: white;
}

.swiper-experience-main {
    padding: 3rem;
    box-shadow: 0px 0px 10px 1px rgb(118 172 255 / 25%);
    border-radius: 2rem;
    background: white;
}

.item-experience {
    color: #002152;
}

.swiper-experience--tile {
    font-size: 2.4rem;
    color: var(--color-main);
    font-weight: bold;
    margin-bottom: 1rem;
}

.quote-experience {
    position: absolute;
    top: -50px;
    left: -50px;
    font-size: 11rem;
    color: #FFF7E6;
}

/*--------------------------------------------------------------------------
|  Trang tin tuc
--------------------------------------------------------------------------*/
.breadcrumbs-list-cate {
    text-align: center;
    padding: 8rem 0;
    font-size: 3.6rem;
    color: white;
    text-transform: uppercase;
    font-weight: bold;
    background-position: center;
}

.item-2-art {
    margin: 0;
}

.item-2-art .inner-content {
    position: absolute;
    bottom: 0px;
    left: 0;
    right: 0;
    background: transparent;
    background: -moz-linear-gradient(top, transparent 0%, #000000 100%);
    background: -webkit-linear-gradient(top, transparent 0%, #000000 100%);
    background: linear-gradient(to bottom, transparent 0%, #000000 100%);
    padding: 3rem;
}

.box-art-page .box-title-tabs {
    box-shadow: 0px -2px 8px 1px #14141540;
    padding: 1rem 2rem;
    border-radius: .8rem;
    background: white;
}

.box-art-page .title-tabs {
    font-weight: bold;
    font-size: 1.8rem;
    color: black;
    text-transform: capitalize;
}

.line-dashed {
    border-top: 1px dashed rgba(0, 0, 0, 0.1);
}

.box-art-page .box-title-tabs .nav-item .nav-link {
    color: var(--color-main);
    background: #D6E6FF;
    margin-left: 1rem;
}

.box-art-page .box-title-tabs .nav-item .nav-link.active, .box-art-page .box-title-tabs .nav-item .nav-link:hover {
    background: var(--color-main);
    color: white;
}

/*--------------------------------------------------------------------------
|  Trang chi tiet tin tuc
--------------------------------------------------------------------------*/
.article-breacrums {
    padding: 8rem 0;
}

.social-share {
    background: #fff;
    padding: 1rem;
    border-radius: 3rem;
    /* box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important; */
}

.social-share > div {
    margin-bottom: 10px;
}

.social-share > div:last-child {
    margin: 0;
}

.btn-social a:hover {
    background: var(--color-main);
}

.btn-social a {
    background: #383838;
    aspect-ratio: 1/1;
    display: flex;
    width: 31px;
    text-align: center;
    align-items: center;
    justify-content: center;
    color: white;
    border-radius: 100%;
}

.article-bottom {
    background: #ffffff;
    padding: 15px;
}

.box-article-created {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.box-article-created .fa-user {
    aspect-ratio: 1/1;
    width: 52px;
    padding: .5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 2.5rem;
    border: 3px solid var(--color-main);
    border-radius: 100%;
    background: white;
}

.article-view {
    padding: .5rem 1rem;
    background: #EAEAEA;
    border-radius: 3rem;
}

/*menu custom*/
.submega-custom {
    display: flex;
    flex-wrap: nowrap;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    width: 110%;
    /* font-family: 'Montserrat', sans-serif; */
    background: #fff;
    box-shadow: 0px 0px 40px rgba(13, 93, 214, 0.25);
    border-radius: 13px;
    padding: 30px;
    z-index: 20;
    opacity: 0;
    filter: opacity(0);
    visibility: hidden;
    -webkit-transition: opacity 0.05s ease;
    transition: opacity 0.05s ease;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    -o-transform: translateY(20px);
    transform: translateY(20px);
}
.menu-section > ul > li:hover > .submega-custom {
    opacity: 1;
    filter: opacity(1);
    visibility: visible;
    -webkit-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
}

.submega-custom .column-icon .item {
    display: flex;
    margin-bottom: 20px;
    padding-right: 10px;
}

.submega-custom .column-icon .item .icon {
    flex: 0 0 36px;
    max-width: 36px;
}

.submega-custom .column-icon .item .inner {
    flex: 0 0 calc(100% - 36px);
    max-width: calc(100% - 36px);
    padding-left: 10px;
}

.submega-custom .column-icon .item .icon img {
    width: 100%;
    height: auto;
}

.submega-custom .column-icon .item .inner .title span {
    background: #F76C06;
    color: #fff;
    font-size: 12px;
    padding: 0 4px;
    border-radius: 4px;
    text-transform: capitalize;
    margin-right: 5px;
    font-weight: 400;
}

.submega-custom .column-icon .item .inner .title {
    font-weight: 700;
    margin-bottom: 5px;
}
.submega-custom .column-icon .item .inner .title a {
    color: black;
    font-size: 16px;
}

.submega-custom .column-icon .item .inner .description {
    font-size: 13px;
    color: #4d4d4d;
}

.submega-custom .column .title-menu {
    font-size: 16px;
    color: #000000;
    font-weight: 700;
    margin-bottom: 15px;
}
.submega-custom .column .menu-child ul li {
    margin-bottom: 15px;
}
.submega-custom .column .menu-child ul li a {
    color: black;
}
.submega-custom .column .menu-child ul li::marker {
    color: #f66a20;
}
.submega-custom .column .menu-child ul {
    list-style: disc;
    padding-left: 15px;
}
.submega-custom .column .banner-menu {
    position: relative;
    padding-top: 75%;
}

.submega-custom .column .banner-menu a img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
}
.submega-custom .column.column-icon {
    flex: 0 0 40%;
    max-width: 40%;
}
.submega-custom .column {
    flex: 0 0 30%;
    max-width: 30%;
    position: relative;
}
.submega-custom .column:nth-child(2) {
    padding: 0 30px;
}
.submega-custom .column:nth-child(2):before, .submega-custom .column:nth-child(2):after {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    width: 1px;
    height: 80%;
    background: #D9D9D9;
}
.submega-custom .column:nth-child(2):after {
    left: initial;
    right: 30px;
}
.box-search {
    position: absolute;
    top: 150%;
    right: -260%;
    width: 47rem;
    background: #fff;
    border-radius: 1.1rem;
    padding: 1.4rem;
    z-index: 9;
    box-shadow: 0 3px 6px 0px rgb(0 0 0 / 16%);
    opacity: 0;
    filter: opacity(0);
    visibility: hidden;
    -webkit-transition: opacity 0.05s ease;
    transition: opacity 0.05s ease;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    -o-transform: translateY(20px);
    transform: translateY(20px);
}
.box-search.show {
    opacity: 1;
    filter: opacity(1);
    visibility: visible;
    -webkit-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
}
.box-search .input-group .btn {
    background: transparent;
    border: 1px solid #76ACFF;
    border-right: 0;
    padding: 1.2rem 1.6rem;
}
.box-search .input-group .form-control {
    border-left: 0;
    border-color: #76ACFF;
    padding: 1.2rem 1.2rem 1.2rem 0;
    font-size: 1.6rem;
    line-height: 2.2rem;
    color: #7E7E7E;
    height: auto;
    border-top-right-radius: 0.8rem;
    border-bottom-right-radius: 0.8rem;
}
.box-search .menu-search {
    margin-top: 2rem;
}
.box-search .menu-search .title-menu-search {
    color: #707070;
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 1.5rem;
}
.box-search .menu-search ul {
    list-style: none;
    padding-left: 1.5rem;
}
.box-search .menu-search ul>li {
    margin-bottom: 1.5rem;
}
.box-search .menu-search ul>li>a {
    color: #707070;
    font-size: 16px;
    font-weight: 400;
    display: flex;
    align-items: center;
}
.box-search .menu-search ul>li>a>i {
    margin-right: 1.2rem;
    font-size: 2rem;
}
/*end menu custom*/
.section-category-theme .btn {
    position: relative;
    padding: 1.5rem;
    font-size: 1.6rem;
    line-height: 1;
    transition: all .2s;
}
.section-category-theme .btn .icon {
    margin-left: 1rem;
}
.section-image {
    text-align: right;
    position: relative;
    padding-top: 65%;
}
.section-image img {
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    object-fit: contain;
    object-position: right;
}
.section-faq .faq-main>.row {
    align-items: center;
}
.bg-title {
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}
.section-news {
    padding: 7rem 0 40px;
}
.template-ss1 {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}
.template-ss1 .welcome-4s, .template-ss1 .image-theme{
    flex: 0 0 50%;
    max-width: 50%;
    z-index: 2;
}
.template-ss1 .welcome-4s {
    padding-right: 12rem;
}
.template-ss1 .welcome-4s .theme-desc {
    margin-bottom: 3rem;
    font-size: 1.6rem;
    /* font-family: 'Montserrat', sans-serif; */
    color: #002F75;
    text-align: justify;
}
.bg-about-1:before {
    content: "";
    position: absolute;
    top: -50%;
    right: -3rem;
    width: 88rem;
    height: 88rem;
    background: #E3EEFF;
    border-radius: 100%;
    z-index: 0;
}
.section-themes {
    padding: 3rem 0 3rem;
}
.desc-section-about {
    color: #002F75;
    font-size: 16px;
    /* font-family: Montserrat; */
    margin-bottom: 5rem;
}
._price-list {
    margin: 0 auto;
    margin-bottom: 10rem;
}
@media (min-width: 1400px) {
    ._price-list {
        /* width: 80%; */
        /* margin-bottom: 30px; */
    }
}
._price-list .item-price {
    display: flex;
    flex-direction: column;
    margin-top: 3rem;
    border-radius: 0.9rem;
    padding-bottom: 3rem;
    background: #FFF;
    height: 100%;
    box-shadow: 0px 0px 10px 1px rgb(255 174 131 / 15%);
}
._price-list .item-price ._action {
    margin-top: auto;
    text-align: center;
}
._price-list .item-price ._header {
    position: relative;
    text-align: center;
    background: var(--color-main);
    color: #fff;
    padding: 2.5rem 2rem 10rem;
    border-top-left-radius: 0.9rem;
    border-top-right-radius: 0.9rem;
}
._price-list .item-price ._header .title {
    font-size: 2.8rem;
    font-weight: bold;
    text-transform: uppercase;
}
._price-list .item-price ._header svg {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
}
._price-list .item-price ._header svg .f-fill-white {
    fill: #fff;
}
._price-list .item-price ._header svg {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
}
._price-list .item-price ._header svg .f-fill-white {
    fill: #fff;
}
._price-list .item-price ._header .price {
    font-size: 4rem;
    font-weight: bold;
}
._price-list .item-price ._header .price span {
    font-size: 50%;
}
._price-list .item-price ._header .description {
    font-size: 1.6rem;
}
._price-list .item-price ._inner-info {
    padding: 0 3rem;
}
._price-list .item-price ._inner-info .bullet-item {
    position: relative;
    padding: 1.2rem 0;
}
._price-list .item-price ._inner-info .bullet-item .text {
    display: flex;
    align-items: center;
    line-height: 1.3;
    font-size: 1.5rem;
}
._price-list .item-price ._inner-info .bullet-item .text i {
    color: var(--color-main);
    margin-right: 0.5rem;
}
._price-list .item-price ._action .btn {
    background: var(--color-main);
    border-radius: 10rem;
    padding: 1rem 3rem;
}
._price-list .item-price ._action .btn i {
    margin-left: 1rem;
}
.benefits-info .title {
    font-size: 3.6rem;
    font-weight: 700;
    /* font-family: 'Montserrat', sans-serif; */
    color: var(--color-main);
    text-transform: uppercase;
    margin-bottom: 2rem;
    padding-top: 1.5rem;
}
.benefits-info .description {
    font-size: 1.5rem;
}
.benefits-info {
    padding-right: 5rem;
    text-align: center;
}
.benefits-info .swiper-button-next-benefits, .benefits-info .swiper-button-prev-benefits {
    text-align: right;
    display: inline-block;
    font-size: 2.1rem;
    margin-right: 2rem;
}
.website-benefits {
    margin-bottom: 5rem;
}
.website-benefits .swiper {
    padding: 1.5rem;
}
.website-benefits .swiper .swiper-wrapper {
/*    justify-content: center;*/
}
.website-benefits .swiper-slide.item {
    box-shadow: 0 1px 14px rgba(0,0,0,.1);
    border-radius: 20px;
    background: #fff;
    padding: 3rem;
    height: auto;
}
.website-benefits .swiper-slide.item .title {
    font-weight: 700;
    margin-bottom: 1.5rem;
    font-size: 1.8rem;
    display: flex;
    align-items: center;
}
.website-benefits .swiper-slide.item .description {
    text-align: justify;
}
.form-recruitment .form-group {
    margin-bottom: 15px;
}

.form-recruitment .form-group .input-group textarea.form-control {
    border-radius: 5px;
    height: 100px;
}
.form-recruitment .form-group.box-file .input-group .input-group-text {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

.form-recruitment .form-group.box-file .input-group >.input-group-prepend> span.input-group-text {
    border-top-left-radius: 5px !IMPORTANT;
    border-bottom-left-radius: 5px !important;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.form-recruitment .form-group .input-group input.form-control {
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

.form-recruitment .form-group .input-group>.input-group-prepend .input-group-text {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

.form-recruitment .form-group.box-file .input-group input {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-right: 0;
}
@media (max-width: 1760px) {
    .toplist-web4s {
        margin-bottom: 2rem !important;
    }
    .title-toplist-4s {
        line-height: 1.4;
    }
    .toplist-web4s p {
        font-size: 3.2rem;
    }
}

@media (max-width: 1680px) {
    .toplist-web4s p {
        line-height: 1.6;
    }
}

@media (max-width: 1200px) {
    .menu-section > ul > li {
        margin-right: 1rem;
    }
    .submega-custom {
        width: 125%;
    }
    .text-title {
        font-size: 3.2rem;
    }
    .welcome-4s-desc {
        margin: 2rem 0;
    }
    .welcome-4s-desc .text-1 {
        font-size: 2rem;
        margin-bottom: 2rem;
    }
    .welcome-4s-desc .text-3 span {
        font-size: 3.4rem;
    }
    .ratio-user-ytb {
        padding-top: 62%;
    }

    .row-item-tpl > .row.no-gutters > div[class*=col-]:first-child {
        flex: 0 0 29.33333%;
        max-width: 29.33333%;
    }
    .row-item-tpl > .row.no-gutters > div[class*=col-]:last-child {
        flex: 0 0 70.66667%;
        max-width: 70.66667%;
    }
    .swiper-template-home {
        padding-left: 0;
    }
    .toplist-web4s p {
        font-size: 3rem;
    }
    .view-param .single-param {
        margin-bottom: 1.5rem;
    }
    .view-param {
        margin-bottom: 2.5rem;
    }
    .swiper-template-home .swiper {
        padding-bottom: 5rem;
    }
    .ratio-home {
        padding-top: 164%;
    }
}

/*--------- Responsive ---------*/
@media (max-width: 500px) {
    .mobile-menu .row > div:nth-child(2) {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .row-mobile > .container > .row > div {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .home-ss4 {
        padding: 2rem 1rem;
    }

    .home-ss4 .title-phone-contact {
        font-size: 1.6rem;
        margin-bottom: 1.2rem;
    }

    .block-cust-care {
        position: relative;
        justify-content: space-around;
    }

    .item-ndth {
        aspect-ratio: auto;
    }

    .image-ndth img {
        width: 8rem;
    }

    .item-log-brand img {
        max-height: 10rem;
    }

    .item-price-list-brand {
        margin-bottom: 30px;
    }

   
    #registertrial-modal button.close {
        right: 10px;
        top: 10px;
        z-index: 1;
    }
    
    .ecosystem-tile {
        min-height: 40px;
    }
}

@media (min-width:1200px){
    .row-item-tpl > .row.no-gutters > div:nth-child(1) {
        flex: 0 0 27%;
        max-width: 27%;
    }
    .row-item-tpl > .row.no-gutters > div:nth-child(2) {
        max-width: 73%;
    }
}

@media (min-width:1200px) and (max-width:1430px){
    .title-toplist-4s {
        font-size: 19px;
    }
    
    .toplist-web4s p {
        font-size: 25px;
    }
    .swiper-template-home .product-home {
        margin-bottom: 30px;
    }
    .text-title {
        /* font-size: 25px; */
    }

    .btn-scroll {
        margin: 4rem 0 7rem;
    }
    .row-item-tpl > .row.no-gutters, .website-benefits > .row {
        margin-left: calc( (100% - 1200px) / 2);
    }
    .section-faq .faq-main>.row {
        margin-left: calc( (100% - 1200px) / 2);
    }

}

@media (min-width: 1430px)  {
    .row-item-tpl > .row.no-gutters, .website-benefits > .row {
        margin-left: calc( (100% - 1430px) / 2);
    }
    .section-faq .faq-main>.row {
        margin-left: calc( (100% - 1430px) / 2);
    }
    .swiper-template-home {
        /* padding-left: 3rem; */
    }
    .swiper-template-home .swiper {
        padding-bottom: 5rem;
    }

    #registertrial-modal {
        background: #0D5DD6;
        background: -moz-linear-gradient(left, #0D5DD6 44.9%, #E6EAF3 44.9%);
        background: -webkit-linear-gradient(left, #0D5DD6 44.9%, #E6EAF3 44.9%);
        background: linear-gradient(to right, #0D5DD6 44.9%, #E6EAF3 44.9%);
    }
    
}

@media screen and (min-width: 1350px) and (max-width: 1600px) {
    #registertrial-modal {
        background: #0D5DD6;
        background: -moz-linear-gradient(left, #0D5DD6 43.65%, #E6EAF3 43.65%);
        background: -webkit-linear-gradient(left, #0D5DD6 43.65%, #E6EAF3 43.65%);
        background: linear-gradient(to right, #0D5DD6 43.65%, #E6EAF3 43.65%);
    }
}


@media screen and (min-width: 1024px) and (max-width: 1290px) {
    #registertrial-modal {
        background: #0D5DD6;
        background: -moz-linear-gradient(left, #0D5DD6 42.35%, #E6EAF3 42.35%);
        background: -webkit-linear-gradient(left, #0D5DD6 42.35%, #E6EAF3 42.35%);
        background: linear-gradient(to right, #0D5DD6 42.35%, #E6EAF3 42.35%);
    }
}

@media (max-width:1200px){
        .block-cust-care>li {
        margin: 0.5rem 0;
        padding: 0 .5rem;
        flex: 0 0 100%;
        max-width: 100%;
    }
}

@media (min-width:1200px) {
    .col-cate {
        flex: 0 0 20%;
        max-width: 20%;
    }

    .client-main .swiper-slide {
        transform: translateX(30px);
    }

    .client-main .swiper-slide:nth-child(n+6) {
        transform: translateX(-80px);
    }

    .client-main .swiper-slide:nth-child(n+11) {
        transform: translateX(30px);
    }

    .block-cust-care {
        position: absolute;
        top: 0;
        bottom: 0;
        display: flex;
        justify-content: space-between;
    }

    .cust-care2 {
        left: 0;
    }

    .cust-care1 {
        right: 0;
    }

    .cust-care1 li:nth-child(1) {
        transform: translate(50px, -20px);
    }

    .cust-care1 li:nth-child(2) {
        transform: translate(-56px, 0px);
    }

     .cust-care1 li:nth-child(3) {
        transform: translate(-100px, 0px);
    }
    .cust-care1 li:nth-child(4) {
        transform: translate(20px, 20px);
    }

    .cust-care2 li:nth-child(1) {
        transform: translate(-50px, -20px);
    }

    .cust-care2 li:nth-child(2) {
        transform: translate(88px, 0px);
    }
    .cust-care2 li:nth-child(3) {
        transform: translate(100px, 0px);
    }
    .cust-care2 li:nth-child(4) {
        transform: translate(-56px, 20px);
    }

    .block-art1 {
        margin-top: -3rem;
    }
}
.reason-used-service .swiper-slide.item {
    padding: 30px 15px 30px 15px;
    box-shadow: 0px 0px 10px 1px rgb(13 97 210 / 20%);
    border-radius: 0.8rem;
    height: auto;
    position: relative;
    text-align: center;
}
.reason-used-service .swiper {
    padding: 1.5rem;
}
.reason-used-service .swiper-slide.item .icon {
    text-align: center;
    position: relative;
    margin-bottom: 3rem;
}
.reason-used-service .swiper-slide.item .icon img {
    height: 6.5rem;
    width: auto;
}
.reason-used-service .swiper-slide.item .icon:before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%) rotate(22deg);
    width: 70px;
    height: 70px;
    border-radius: 10px;
    background: linear-gradient(62.5deg, transparent, rgba(47, 85, 212, 0.09));
}
.reason-used-service .swiper-slide.item .title {
    text-align: center;
    font-weight: 600;
    margin-bottom: 1.5rem;
    font-size: 2rem;
}
.reason-used-service .swiper-slide.item .description {
    text-align: center;
    font-size: 1.6rem;
    color: #525F81;
}
.reason-used-service .swiper-slide.item:after {
    position: absolute;
    bottom: 0;
    content: "";
    width: 0;
    background: #437eeb;
    transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    z-index: 2;
}
.reason-used-service .swiper-slide.item:hover:after {
    height: 4px;
    left: 0;
    width: 100%;
}
.website-benefits .swiper-slide.item .title .number {
    font-size: 5rem;
    color: var(--color-main);
    font-weight: bold;
    /* font-family: 'Montserrat', sans-serif; */
    margin-right: 1rem;
}

/*hieutx*/
.product-detail-head {
    background: #fff;
    padding: 15px;
    box-shadow: 0 .3rem 1.525rem -.375rem rgba(0, 0, 0, .1);
    border-radius: 8px;
}

.detail-theme-image .inner-image .img img {
    object-position: top;
    -webkit-transition: all 3s ease-in-out 0s;
    -moz-transition: all 3s ease-in-out 0s;
    -ms-transition: all 3s ease-in-out 0s;
    transition: all 3s ease-in-out 0s;
}

.detail-theme-image .inner-image .img:hover img {
    object-position: bottom;
}

.detail-theme-image .inner-image {
    border-radius: 8px;
    overflow: hidden;
}
.detail-theme-image {
    position: relative;
}

.theme-bottom-image {
    position: absolute;
    bottom: 15px;
    z-index: 2;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
}

.theme-bottom-image>ul {
    padding-left: 0;
    display: flex;
    justify-content: center;
    margin-bottom: 0;
}

.theme-bottom-image>ul>li {
    list-style: none;
    padding-left: 10px;
    padding-right: 10px;
}

.theme-bottom-image>ul>li>a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-grd);
    color: #fff;
    height: 37px;
    padding: 0 20px;
    border-radius: 5px;
}

.theme-bottom-image>ul>li>a>i {
    margin-right: 10px;
}

.theme-detail-head .name {
    font-size: 25px;
    font-weight: 700;
    margin-bottom: 10px;
}

.box-highlight-theme, .box-endow-theme, .box-note-theme, .point-conversion {
    padding: 15px;
    display: inline-flex;
    width: 100%;
    background: var(--bg-light);
    border-radius: 8px;
    border: 1px dashed var(--indigo);
    margin-bottom: 15px;
}

.box-highlight-theme .item {
    text-align: center;
}

.box-highlight-theme .item .icon {
    color: var(--indigo);
    font-size: 20px;
    margin-bottom: 10px;
}

.box-highlight-theme .item .title {font-size: 16px;}

.box-endow-theme {
    display: block;
}

.box-endow-theme .title {
    font-size: 20px;
    font-weight: 700;
    color: var(--indigo);
    margin-bottom: 10px;
}

.box-endow-theme .inter-content .name {
    margin-bottom: 10px;
}

.box-endow-theme .inter-content .name i {
    color: var(--indigo);
    display: inline-block;
    margin-right: 5px;
}

.box-note-theme {
    display: flex;
    align-items: center;
}

.box-note-theme .img {
    flex: 0 0 50px;
    margin-right: 10px;
}

.box-note-theme .text {
    font-size: 16px;
}
.point-conversion .inter-content {
    font-size: 16px;
}

.point-conversion .inter-content span {
    font-weight: 700;
    color: var(--red);
}

.box-button-theme .btn-cart-buy .add-to-cart {
    background: var(--bg-grd);
    max-width: calc(50% - 5px);
    flex-basis: calc(50% - 5px);
    height: 50px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 16px;
}

.box-button-theme .btn-cart-buy .add-to-cart.add-to-cart-buy {
    background: var(--red);
}


.product-detail-footer {
    background: #fff;
    padding: 30px;
    box-shadow: 0 .3rem 1.525rem -.375rem rgba(0, 0, 0, .1);
    border-radius: 8px;
    margin-bottom: 30px;
}

.product-detail-footer .content {
    font-size: 16px;
}

.product-detail-footer .content h2 {
    margin-bottom: 20px;
    font-size: 24px;
}

.product-detail-footer .content h3 {
    margin-bottom: 20px;
    font-size: 22px;
}

.product-detail-footer .content h4 {
    margin-bottom: 20px;
    font-size: 20px;
}

.box-section-theme-01 {
    margin-bottom: 30px;
}
.theme-detail-head .price .price-amount {
    font-size: 20px;
    font-weight: 700;
    color: red;
}
.box-theme-lq .title-section {
    color: #000;
    font-weight: 600;
    margin-bottom: 30px;
    position: relative;
}

.box-theme-lq .title-section:before {
    content: '';
    position: absolute;
    bottom: -7px;
    left: 0;
    width: 100px;
    height: 4px;
    background: var(--bg-grd);
}
.theme-bottom-image>ul>li>a:hover {
    background: linear-gradient(90deg, #0D5DD6 0%, #0D5DD6 100%);
}

.box-button-theme .btn-cart-buy .add-to-cart:hover {
    background: linear-gradient(90deg, var(--color-highlight) 0%, var(--indigo) 100%);
}

.box-button-theme .btn-cart-buy .add-to-cart.add-to-cart-buy:hover {
    background: var(--indigo);
}
.box-app {
    display: flex;
    align-items: center;
}
@media (max-width: 1200px){
    .row {
        margin-right: -5px;
        margin-left: -5px;
    }

    .row>div {
        padding-right: 5px;
        padding-left: 5px;
    }

    .product-item {
        margin-bottom: 10px;
        box-shadow: 0px 0px 1px 1px #E6E6E6;
        border-radius: 8px;
    }
    .mobile-menu>.container>.row>div:nth-child(3) {
        display: flex;
        justify-content: flex-end;
    }

    .btn-registertrial {
        padding: 1rem 1.2rem;
        font-size: 12px;
        position: fixed;
        right: 10px;
        bottom: 0;
        /* writing-mode: vertical-rl; */
        /* text-orientation: mixed; */
        z-index: 999;
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }
    .btn-menu-mobile svg {
        fill: var(--color-highlight);
    }

    .btn-menu-mobile svg path {
        stroke: var(--color-main);
    }
    .entire-action-header {
        border-left: 0 !important;
    }

    .btn-action-header {
        display: inline-flex;
        margin-left: 0;
        border: 1px solid var(--color-main);
        padding: 0;
        height: 36px;
        width: 36px;
        border-radius: 4px;
        align-items: center;
        justify-content: center;
    }

    .box-search {
        right: 0;
        width: 300px;
    }

    .box-search .menu-search ul>li>a {
        font-size: 14px;
    }

    .box-search .menu-search ul {
        padding-left: 0.5rem;
    }

    .box-search .menu-search ul>li>a>i {
        font-size: 14px;
        margin-right: 5px;
    }

    .box-search .menu-search .title-menu-search {
        font-size: 14px;
    }
    .home-ss1 {
        padding-top: 0;
    }
    
    .btn-scroll {
        margin: 2rem 0 5px;
        min-height: 3rem;
    }
    
    .btn-action-header img {
        width: 24px;
        height: 24px;
        object-fit: contain;
    }
}


@media (max-width:992px){
    .box-section-theme-01>.container>.row>div {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .product-detail-head {
        padding: 10px;
        margin-bottom: 15px;
    }

    .theme-bottom-image>ul>li>a {
        padding: 0 15px;
    }

    .theme-bottom-image>ul>li {
        padding-left: 5px;
        padding-right: 5px;
    }

    .box-highlight-theme .item .title {
        font-size: 14px;
    }

    .box-note-theme .text {
        font-size: 14px;
    }

    .point-conversion .inter-content {
        font-size: 14px;
    }

    .box-endow-theme .title {
        font-size: 16px;
    }

    .box-section-theme-01 {
        margin-bottom: 15px;
    }

    .product-detail-footer {
        padding: 15px;
    }
        
    .product-detail-footer .content {
        font-size: 14px;
    }
    
    .product-detail-footer .content h2 {
        margin-bottom: 15px;
        font-size: 22px;
    }
    
    .product-detail-footer .content h3 {
        margin-bottom: 15px;
        font-size: 20px;
    }
    
    .product-detail-footer .content h4 {
        margin-bottom: 15px;
        font-size: 18px;
    }
    body {
        overflow-x: hidden;
    }
}
@media (max-width:767px){
    .home-ss1 {
        padding-top: 0;
    }
    
    .btn-scroll {
        margin: 2rem 0 0;
        min-height: 3rem;
        display: none;
    }
}

.menu-container-mb .menu-section .box-menu-scoll {
    display: flex;
    flex-wrap: wrap;
    border-top: 1px solid var(--bg-light);
    height: calc(100% - 63px);
}

.menu-scoll-left {
    flex: 0 0 85px;
    background: rgb(255 255 255);
    overflow-y: auto;
    height: 100%;
}

.menu-scoll-right {
    flex-basis: calc(100% - 85px);
    background: #eaf1ff;
}

.menu-scoll-left ul>li {
    margin-right: 5px;
}

.menu-scoll-left ul>li>a {
    display: flex;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
    padding: 12px 7px 12px;
    background-color: #ffffff;
    position: relative;
    flex-shrink: 0;
    border: 0;
    border-bottom: 1px solid #eaf1ff;
    margin-bottom: 0;
    color: #000;
    font-size: 13px;
    border-right: 1px solid #eaf1ff;
}

.menu-scoll-left ul>li>a>img {
    margin-right: 0;
    height: 30px;
    width: 30px;
    margin-bottom: 8px;
}

.menu-container-mb .menu-top {
    background: var(--bg-light);
    padding: 15px;
    margin: 0;
    margin-bottom: 5px;
}

.menu-scoll-left ul>li>a .name {
    display: block;
    text-align: center;
    font-size: 12px;
    font-weight: 700;
}
.menu-scoll-right .list-info-menu .inner-menu .name-item {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    background-color: rgb(255, 255, 255);
    padding: 10px 0px;
    margin-bottom: 0;
    text-decoration: none;
}

.menu-scoll-right .list-info-menu .inner-menu .name-item a {
    color: var(--color-main) !important;
    background: none;
    font-weight: 700;
    font-size: 16px;
}

.menu-scoll-right .list-info-menu .inner-menu .inter-content {margin: 5px;background: #fff;padding-top: 5px;padding-left: 2.5px;padding-right: 2.5px;height: calc(100% - 48px);}

.menu-scoll-right .list-info-menu .inner-menu .inter-content .item {
    flex: 0 0 33.33%;
    max-width: 33.33%;
    padding-left: 2.5px;
    padding-right: 2.5px;
    margin-bottom: 5px;
}
.menu-scoll-right .list-info-menu .inner-menu .inter-content .list {
    display: flex;
    flex-wrap: wrap;
}

.menu-scoll-right .list-info-menu .inner-menu .inter-content .item>a {
    display: flex;
    height: 100%;
    flex-direction: column;
    align-items: center;
    text-align: center;
    font-size: 11px;
    border: 1px solid #eaf1ff;
    padding: 10px 5px;
    border-radius: 5px;
    color: #000;
}

.menu-scoll-right .list-info-menu .inner-menu .inter-content .item>a .icon {
    margin-bottom: 8px;
}

.menu-scoll-right .list-info-menu .inner-menu .inter-content .item>a .icon img {
    width: 25px;
    max-width: 25px;
    object-fit: contain;
}
.menu-scoll-right .list-info-menu .inner-menu .inter-content .item .name {
    overflow: hidden;
    line-height: 1.4;
}
.list-info-menu {
    height: 100%;
}

.list-info-menu .inner-menu.active {
    background: none;
    height: 100%;
    display: block;
}

.list-info-menu .inner-menu {
    display: none;
    height: 100%;
}
.menu-scoll-right .list-info-menu .inner-menu.menu-home .inter-content .item {
    flex: 0 0 50%;
    max-width: 50%;
}

.menu-scoll-right .list-info-menu .inner-menu.menu-home .inter-content .item .name {
    font-size: 12px;
}
.menu-scoll-left ul>li>a.active {
    background: #eaf1ff;
}
 #registertrial-modal button.close {
    color: #000;
    opacity: 1;
    font-weight: 400;
    text-shadow: none;
}

.form-registertrial input.form-control {
    border-color: #bfdaff;
    border-radius: 5px;
}

.form-registertrial .input-group-append {
    border-color: #bfdaff;
    border: 1px solid #bfdaff;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

.form-registertrial .input-group-append span.input-group-text {
    border: aliceblue;
}

.form-registertrial .form-group .input-group .dropdown-toggle {
    background: #fff;
    border: 1px solid #bfdaff;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

.form-registertrial .form-group .input-group .dropdown-menu {
    width: 100%;
}
@media (max-width:767px){
    .ytb-4s {
        margin-top: 15px;
    }
    .box-team-count .home-ss2 {
        height: auto;
        margin-bottom: 15px;
    }

    .toplist-web4s p {
        /* font-size: 2.5rem; */
    }
    .box-theme-home {
        margin-bottom: 15px;
        height: auto !important;
    }
    .swiper-template-home .swiper {
        padding-bottom: 3rem;
    }
    .box-section-home-01 {
        padding-bottom: 40px;
        padding-top: 30px;
    }

    .bg-row-3 {
        padding: 40px 0 40px;
    }

    .title-desc, .title-section-about {
        font-size: 2.1rem;
        margin-bottom: 2rem;
    }

    .title-section {
        font-size: 1.8rem;
        margin-bottom: 0.5rem;
    }

    .list-category {
        margin-bottom: 10px !important;
    }
    .bg-row-5 {
        padding: 40px 0;
    }
    .bg-row-5 {
        padding: 40px 0;
    }
    
    .section-image img {
        object-fit: contain;
        width: 100%;
    }
    
    .section-image {
        margin-bottom: 20px;
    }
    
    .no-gutters {
        margin-right: 0;
        margin-left: 0;
    }
 
    .mobile-menu {
        border-bottom: 1px solid #ffff;
    }
    .bg-row-5 {
        padding: 40px 0;
    }
    
    .section-image img {
        object-fit: contain;
        width: 100%;
    }
    
    .section-image {
        margin-bottom: 20px;
        display: none;
    }
    
    .no-gutters {
        margin-right: 0;
        margin-left: 0;
    }

    
    .mobile-menu {
        border-bottom: 1px solid #ffff;
    }
    
    .box-section-home-07 {
        padding-top: 40px;
    }
    
    .box-title-tabs {
        display: flex;
        flex-direction: column;
    }
    
    .box-title-tabs .block-tab.nav .nav-item {
        margin-right: 0.5rem;
    }
    
    .box-title-tabs .block-tab.nav .nav-item>a {
        padding: 5px;
        font-size: 13px;
        background: #e9f1f8;
    }
    
    .box-title-tabs .block-tab.nav .nav-item:last-child {
        margin-right: 0;
    }
    .home-ss4 form .form-group .form-control {
        height: 45px;
        border-radius: 5rem;
        padding: 1.5rem 0 1.5rem 1.5rem;
    }
    
    .home-ss4 form .form-group {
        margin-bottom: 0;
    }
    
    .home-ss4 form .form-group .btn-submit {
        padding: 0;
        height: 37.5px;
        right: 9px;
        top: 4px;
        display: flex;
        align-items: center;
        justify-content: center;
        min-width: 8.5rem;
    }
    .title-tabs {
        font-size: 2.1rem;
        margin-bottom: 10px !important;
    }
     .item-log-brand {
        flex: 0 0 25%;
        max-width: 25%;
    }

    .item-log-brand:nth-child(3), .item-log-brand:nth-child(12), .item-log-brand:nth-child(17), .item-log-brand:nth-child(20) {
        flex: 0 0 50%;
        max-width: 50%;
    }
}
.submega-custom  ul li a:hover {
    color: var(--color-main) !important;
}
.article-detail, .article-detail span, .article-detail p, .article-detail a {
    font-family: 'Inter', sans-serif !important;
    font-size: 16px !important;
}

.article-detail h2 {
    font-size: 20px;
    font-weight: 700;
}

.article-detail h3 {
    font-size: 19px;
    font-weight: 700;
}

.article-detail h4 {
    font-weight: 700;
    font-size: 18px;
}

.article-detail ul {
    padding-left: 20px;
}
.breadcrumbs-section a:last-child:after {
    display: none;
}

.article-detail .title-article {
    font-size: 25px;
    font-weight: 700;
    margin-bottom: 15px;
}
.sticky-top {
    z-index: 9;
}
.box-article-detail {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.box-article-detail .box-article-content {
    flex-basis: calc(100% - 80px);
    max-width: calc(100% - 80px);
}

.box-article-detail .box-article-share {
    flex: 0 0 52px;
    max-width: 52px;
}

.box-article-created .avatar {
    flex: 0 0 50px;
}

.box-article-created .avatar img {
    width: 50px;
    height: 50px;
    object-fit: cover;
    border-radius: 50%;
    border: 2px solid var(--color-main);
}
.tab-content .article-item {
    background: #ffffff;
    border-radius: 8px;
}

.tab-content .article-item .inner-content {
    padding: 15px;
}

.swiper .swiper-wrapper .article-item .inner-content .article-description {
    display: -webkit-box;
    max-width: 100%;
    font-size: 14px;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.swiper .swiper-wrapper .article-item .inner-content .article-title {
    height: 45px;
    overflow: hidden;
}
.box-section-kho-01 {
    padding-bottom: 50px;
}

.box-section-kho-08 {
    padding: 60px 0;
}

.box-section-kho-09 {
    padding: 60px 0;
}

/*mobile*/

.box-section-ndth-07 {
    padding-top: 60px;
    padding-bottom: 10px;
}

.box-section-ndth-06 .home-ss3 {
    padding: 5rem 0;
}
.item-log-brand {
    flex: 0 0 11.11%;
    max-width: 11.11%;
}

.item-log-brand:nth-child(3), .item-log-brand:nth-child(12), .item-log-brand:nth-child(17), .item-log-brand:nth-child(20) {
    flex: 0 0 22.22%;
    max-width: 22.22%;
}
.item-log-brand img {
    width: 100%;
}
.swiper .swiper-wrapper .article-item {
    margin-left: 1px;
    margin-right: 1px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    transition: all 0.3s cubic-bezier(.25,.8,.25,1);
    margin-bottom: 5px;
}
@media (min-width:1200px){
    .home-ss4 form .form-group .btn-submit {
        right: 2rem;
    }
}
@media (max-width:1200px){
    .bg-about-1:before {
        display: none;
    }

    .template-ss1 .welcome-4s {
        padding-right: 0;
        margin-bottom: 15px;
    }


    .box-section-kho-01 {
        padding-top: 30px;
        padding-bottom: 30px;
    }
    
    .section-themes {
        padding: 35px 0 30px;
    }
    
    .box-section-kho-08 {
        padding: 30px 0;
    }
    
    .item--menu-icon {
        padding: 1rem;
        background: #fff;
        border-radius: 8px;
        font-size: 12px;
    }
    .btn-reg-ico {
        margin-top: 10px;
    }
    .box-section-kho-09 {
        padding: 30px 0 0;
    }
    .item-price-list-brand .btn-brand .btn-submit {
        display: inline-flex;
        align-items: center;
        width: 100%;
        max-width: 180px;
        text-align: center;
        justify-content: center;
        padding: 10px;
    }
    
    .description-brand-bottom>ul {
        padding-left: 0;
    }
    
    .description-brand-bottom>ul>li {
        list-style: none;
    }
    .box-section-ndth-01 {
        padding-top: 20px;
    }


   
    .box-section-ndth-07 {
        padding-top: 30px;
        padding-bottom: 0;
    }

    .box-section-ndth-06 .home-ss3 {
        padding: 3rem 0;
    }

    .box-section-ndth-04 .price-list-brand {
        padding-bottom: 10px;
    }
    h1, .h1 {
        font-size: 23px;
    }
     .box-footer-01 {
        padding-top: 30px;
        padding-bottom: 30px;
        position: relative;
    }
    
    .box-footer-01:before {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 50%;
        background: #f3f3f3;
    }
    
    .box-footer-02 {
        background: #f3f3f3;
        padding-bottom: 25px;
        margin-bottom: 10px;
    }
    
    .title-address {
        margin-bottom: 1rem !important;
    }
    
    .entire-info-website .block-tab.nav .nav-item {
        flex: 0 0 33.33%;
    }
    
    .entire-info-website .block-tab.nav .nav-link {
        padding: 5px 10px;
        background: #fff;
    }
    
    .entire-info-website .block-tab.nav .nav-link>span {
        display: none;
    }
    
    .entire-info-website .block-tab.nav {
        width: 100%;
        text-align: center;
        border: 0;
    }
    
    .entire-info-website .block-tab.nav .nav-link.active {
        background: var(--color-main);
        color: #fff;
    }
    
    .entire-info-website .block-tab.nav .nav-link {
        border-right: 1px solid #ddd;
    }
    
    .entire-info-website .block-tab.nav .nav-item:last-child .nav-link {
        border-right: 0;
    }
     .box-footer-03>.container>.row>div {
        flex: 0 0 50%;
        max-width: 50%;
        margin-bottom: 15px;
    }
    
    .footer-contact-info {
        padding: 3rem 0 20px;
    }
    .box-art-page .article-item.item-2-art {
        box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
        transition: all 0.3s cubic-bezier(.25,.8,.25,1);
    }

   
    .box-article-page .article-item .inner-content .category-page {
        display: none !important;
    }

    .box-article-page .article-item .inner-content {
        padding: 10px !important;
    }

    .box-article-page .article-item .inner-content .article-description {
        /* height: 50px; */
        overflow: hidden;
        font-size: 12px;
        margin-bottom: 10px !important;
    }

    .box-article-page .article-item .inner-content .article-title {
        font-size: 14px;
    }
    .box-art-page .article-item.item-2-art .inner-content .article-title {
        min-height: auto;
    }
     .box-article-detail .box-article-content {
        max-width: 100%;
    }

    .box-article-detail .box-article-share .social-share {
        border-radius: 8px;
        width: 100%;
        margin-top: 15px;
    }

    .box-article-detail .box-article-share {
        max-width: 100%;
        display: block;
    }

    .box-article-detail .box-article-share .social-share .btn-social {
        margin-right: 10px;
    }
    .box-article-detail {
        display: block;
    }
     .social-share > div {
        margin-bottom: 0;
    }
    .article-detail .title-article {
        font-size: 20px;
    }

    .article-detail, .article-detail span, .article-detail p, .article-detail a {
        font-size: 14px !important;
    }
    .breadcrumbs-section a {
        font-size: 14px;
        white-space: nowrap;
    }
    .box-table-nav nav {
        display: none;
    }
    .box-table-nav nav.collapse.show {
        display: block;
    }
    .table-content-section {
        margin-bottom: 15px !important;
    }
    ._price-list .item-price ._inner-info {
        padding: 0 1rem;
    }
    
    ._price-list .item-price ._inner-info .bullet-item {
        padding: 1rem 0;
    }
    .home-ss1 .text-title {
        font-size: 25px;
    }
}

@media (max-width: 576px){
    .list-category-home>.row>div:nth-child(15) {
        display: none;
    }
    .template-ss1 .welcome-4s, .template-ss1 .image-theme {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .template-ss1 .text-title {
        text-align: center;
        font-size: 25px;
    }

    .template-ss1 .welcome-4s .theme-desc {
        text-align: center;
        margin-bottom: 20px !important;
    }

    .template-ss1 .welcome-4s .btn-pad {
        margin-left: auto;
        margin-right: auto;
        display: block;
    }
    .item.item-view-demo {
        margin-bottom: 5px;
    }

    .article-detail .title-article {
        font-size: 20px;
    }
    
    .article-detail h2 {
        font-size: 18px;
        font-weight: 700;
    }
    
    .article-detail h3 {
        font-size: 17px;
        font-weight: 700;
    }
    
    .article-detail h4 {
        font-weight: 700;
        font-size: 16px;
    }
    .box-footer-03>.container>.row>div {
        flex: 0 0 50%;
        max-width: 50%;
        margin-bottom: 15px;
    }
    
    .footer-contact-info {
        padding: 3rem 0 20px;
    }
    
    .footer-menu-section {
        margin-top: 15px;
    }
    
    .certificate-image {
        margin-top: 15px;
    }

    .client-main .inter-content {
        margin-top: 10px;
    }

    .client-main .inter-content .client--manager {
        height: 30px;
        overflow: hidden;
    }

    .client--description {
        margin-top: 5px;
    }
   
    #registertrial-modal {
        background: #00000091;
    }
    
    .ratio-registertrial {
        padding-top: 310px;
    }
    [show-theme] .ratio-registertrial img {
    border-bottom-left-radius: 0 !important;
    }
    .ratio-registertrial img {
        object-fit: cover !important;
        object-position: top;
        border-top-left-radius: 8px;
        border-top-right-radius: 8px;
    }
    
    .text-registertrial p {
        font-size: 25px;
    }
    
    .text-registertrial {
        padding: 2rem;
    }
    
   .form-registertrial .logo-section {
        display: none;
    }
    .form-registertrial .form-group .title-input {
        display: none;
    }
    .box-art-page .tab-scoll {
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        display: block;
    }

    .box-art-page .tab-scoll ul.block-tab {
        display: flex;
        flex-wrap: nowrap;
        justify-content: flex-start !important;
        align-items: flex-start;
    }

    .box-art-page .tab-scoll ul.block-tab>li>a {
        white-space: nowrap;
    }

    .box-art-page .tab-scoll>.block-tab>li>a {
        margin-left: 0 !important;
    }

    .box-art-page .box-title-tabs {
        padding: 1rem 1rem;
    }

    .breadcrumbs-list-cate {
        padding: 3rem 0;
        margin-bottom: 30px;
    }

    .box-art-page .title-tabs {
        margin-bottom: 10px !important;
    }
    .box-art-page .tab-scoll::-webkit-scrollbar {
        display: none;
    } 
    .pagination .page-item {
        margin-top: 3px;
        margin-bottom: 3px;
    }
    .box-article-page .article-item .inner-content .link-more {
        font-size: 12px;
    }
     .box-art-page .article-item.item-2-art .inner-content {
        position: inherit;
        background: #fff;
    }

    .box-art-page .article-item.item-2-art .inner-content .article-title a {
        color: #000 !important;
    }

    .box-art-page .article-item.item-2-art .inner-content {
        padding: 15px;
    }

    .box-art-page .article-item.item-2-art .inner-content .post-date {
        color: #000 !important;
    }

    .box-art-page .article-item.item-2-art .inner-content .article-description {
        margin-bottom: 0 !important;
        color: #000 !important;
    }
}

@media (min-width:576px) and (max-width:1200px){
    .list-category {
        margin-bottom: 10px;
    }
    .list-category {
        margin-bottom: 10px;
    }

    .toplist-web4s p {
        font-size: 15px;
    }

    .home-ss2 {padding: 2rem;}

    .toplist-web4s {
        margin-bottom: 10px !important;
    }

    .title-toplist-4s {
        font-size: 15px;
    }

    .view-param {
        margin-bottom: 2rem;
    }

    .home-ss2 .btn {
        padding: 1rem 3.8rem;
        width: 100%;
    }

    .box-section-home-02 {
        /* padding-top: 20px; */
    }
    .product-home .inner-content {
        bottom: 0;
        padding: 10px !important;
    }

    .product-home .inner-content .btn {
        height: 32px;
        padding: 5px;
        display: flex;
        text-align: center;
        align-items: center;
        justify-content: center;
    }
    .title-desc, .title-section-about {
        margin-bottom: 3rem;
        font-size: 26px;
    }
    .box-section-home-07 {
        padding-top: 40px;
        padding-bottom: 10px;
    }
    .box-footer-02 {
        margin-bottom: 30px;
    }
    .view-small .inner-content .post-date {   
         display: none;
     }
    .view-small .inner-content .article-title .post-date {
        display: none;
    }

    .view-small .inner-content .post-date {
        display: none;
    }

    .breadcrumbs-list-cate {
        margin-bottom: 30px;
    }

    

    .box-art-page .article-item.item-2-art .inner-content .article-description {
        height: 65px;
        overflow: hidden;
        margin-bottom: 0 !important;
    }
    .swiper .swiper-wrapper .article-item {
        margin-left: 1px;
        margin-right: 1px;
        margin-bottom: 30px;
    }

    .swiper .swiper-wrapper .article-item .inner-content .article-title {
        min-height: 37px;
        height: 37px;
    }

    .swiper .swiper-wrapper .article-item .inner-content .article-description {
        height: 52px;
    }
    .box-section-ndth-01 {
        padding-bottom: 30px;
    }
    .image-ndth img {
        width: 100px;
    }

    .box-section-ndth-02 {
        padding-bottom: 30px;
    }
    .box-section-ndth-04 .price-list-brand {
        padding: 5rem 0 0;
    }

    .price-brand {
        font-size: 17px;
        height: 56px;
        line-height: 56px;
    }

    .item-price-list-brand .title-price-list-brand {
        padding: 10px 0;
        font-size: 17px;
    }

    .description-brand {
        padding: 10px;
    }

    .description-brand-bottom>ul>li {
        margin-bottom: 5px;
    }

    .description-brand-bottom {
        padding: 10px 20px;
    }
    .faq-list-price .bg-row-5 {
        padding: 5rem 0;
    }
    .box-tab-article-home .article-item .inner-content .article-description {
        height: 45px !important;
        margin-bottom: 5px;
    }

    .box-tab-article-home .article-item .inner-content .article-title {
        height: auto !important;
    }
  
}


.box-article-page .article-item {
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
    transition: all 0.3s cubic-bezier(.25,.8,.25,1);
    margin-bottom: 0;
    border-radius: 8px;
}

.box-article-page .article-item .inner-content {
    padding: 15px;
}
.box-suggest .input-group .form-control {border-color: var(--color-main);border-top-left-radius: 8px;border-bottom-left-radius: 8px;height: 50px;}

.box-suggest .input-group .btn-submit {
    width: 120px;
}
.add-theme .btn-xct {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 9;
    background: var(--white);
    border-radius: 5px;
    border: 1px solid var(--color-main);
}

.add-theme .btn-xct a {
    color: var(--color-main);
    width: 120px;
    font-weight: 700;
}

.add-theme .img-theme {
    object-position: top;
    transition: 2s;
}

.add-theme:hover .img-theme {
    object-position: bottom;
}
.form-registertrial .form-group {
    margin-bottom: 1.5rem;
}
[show-theme] .ratio-registertrial img {
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
}
.form-advise .modal-content {
    border-radius: 8px;
    padding: 15px;
}

.form-advise .close {
    position: absolute;
    right: 5px;
    top: 5px;
    opacity: 1;
    text-shadow: none;
}

.form-advise .close i {
    color: red;
}

.form-advise .form .inter-form .title {
    font-size: 24px;
    margin-bottom: 15px;
    color: var(--color-main);
    font-weight: 700;
}

.form-advise .form .inter-form .form-group {
    margin-bottom: 15px;
}

.form-advise .form .inter-form .form-group .form-control {
    border-radius: 8px;
    border-color: #c7c7c7;
    height: 42px;
}

.form-advise .form .inter-form .form-group .btn.btn-submit {
    border-radius: 8px;
    height: 45px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.form-advise .form .inter-form .form-group textarea.form-control {
    height: 100px;
}
.box-section-order {
    background-image: linear-gradient(180deg, #eaf1ff, white);
}
.item-order-theme .img {
    padding-top: 120%;
    border-radius: 8px;
    overflow: hidden;
}

.item-order-theme .img img {
    object-position: top;
    transition: 2s;
}

.item-order-theme .img:hover img {
    object-position: bottom;
}

.mx-7-5{
    margin-left: -7.5px;
    margin-right: -7.5px;
}
.mx-7-5>
.px-7-5{
    padding-left: 7.5px;
    padding-right: 7.5px;
}
.item-order-theme .top-name-right .name-element {
    font-size: 25px;
}
.item-order-theme .price-quantity .price-amount {
    font-size: 18px;
}

.item-order-theme .top-name-right .box-highlight-theme {
    margin-top: 15px;
    padding: 10px;
}

.item-order-theme .top-name-right .box-highlight-theme .title {
    font-size: 13px;
}
.item-order-theme .top-name-right .box-highlight-theme>.row {
    margin-right: -7.5px;
    margin-left: -7.5px;
}

.item-order-theme .top-name-right .box-highlight-theme>.row>div {
    padding-right: 7.5px;
    padding-left: 7.5px;
}
.form-billing .form-group .form-control {
    background: #fff;
    border-radius: 5px;
    border-color: #ddd;
}

.form-billing .form-group .dropdown-toggle {
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 5px;
}

.form-billing>.row {
    margin-right: -7.5px;
    margin-left: -7.5px;
}

.form-billing>.row>div {
    padding-right: 7.5px;
    padding-left: 7.5px;
}
.billing-details .form-group textarea.form-control {
    height: 100%;
    border-color: #ddd;
    border-radius: 5px;
}
.payment-section , .order-section{
    font-size: 1.6rem;
}


/*lienhe*/
.box-form-contact-page {
    padding: 40px;
    border-radius: 12px;
    background: #FFF;
    box-shadow: 1px 1px 9px 0px rgba(0, 0, 0, 0.15);
    margin-bottom: 30px;
}

.box-form-contact-page .form-group {
    margin-bottom: 20px;
    font-size: 1.6rem;
}

.box-form-contact-page .form-group label {
    font-weight: 400;
    margin-bottom: 10px;
    display: flex;
    align-content: center;
}

.box-form-contact-page .form-group label i {
    font-size: 19px;
    margin-right: 9px;
    line-height: 1;
    display: inline-flex;
    align-content: center;
    align-items: center;
}

.box-form-contact-page .form-group .form-control {
    border-radius: 8px;
    border-color: rgba(165, 178, 175, 1);
    height: 45px;
}

.box-form-contact-page .form-group textarea.form-control {
    height: calc(100% - 35px);
}

.box-form-contact-page .info-form-right {
    height: 100%;
    position: relative;
}

.box-form-contact-page .info-form-right .form-group {
    height: 100%;
    margin-bottom: 0;
}

.box-form-contact-page .info-form-right span.btn.btn-submit {
    position: absolute;
    bottom: 12.5px;
    width: calc(100% - 25px);
    left: 12.5px;
    border-radius: 20px;
    background: none;
    color: var(--color-main);
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--color-main);
    padding: 10px;
}
.box-form-contact-page .info-form-right span.btn.btn-submit i {
    font-size: 16px;
    display: inline-block;
    margin-right: 10px;
}

.box-form-contact-page .title {
    font-size: 25px;
    font-weight: 700;
    margin-bottom: 10px;
}

.box-form-contact-page .dsc-section {
    font-size: 20px;
    margin-bottom: 30px;
}
.box-list-branch {
    margin-bottom: 40px;
}

.box-list-branch .title {
    font-size: 25px;
    /* max-width: 500px; */
    margin-left: auto;
    margin-right: auto;
    font-weight: 700;
    margin-bottom: 30px;
}

.box-list-branch .list .item-branch {
    padding: 30px;
    border-radius: 12px;
    background: #FFF;
    box-shadow: 1px 1px 9px 0px rgba(0, 0, 0, 0.15);
    height: 100%;
    font-size: 1.6rem;
}

.box-list-branch .list .item-branch .note, .box-list-branch .list .item-branch .map a {
    display: flex;
    margin-bottom: 10px;
}

.box-list-branch .list .item-branch .note i, .box-list-branch .list .item-branch .map i {
    display: inline-block;
    margin-top: 5px;
    flex: 0 0 30px;
    color: var(--color-main);
}

.box-list-branch .list .item-branch .note:last-child,.box-list-branch .list .item-branch .map a {
    margin-bottom: 0;
}
.box-list-branch .list .item-branch .note.branch {
    font-size: 20px;
    font-weight: 700;
    color: var(--color-main);
}
.dropdown-toggle.btn:not(.btn-registertrial):before {
    display: none;
}

.dropdown-toggle.btn:hover {
    color: var(--color-main) !important;
}
/*lienhe*/
.img-registertrial img {
    height: 100%;
}
span.article-category {
    display: flex;
    flex-wrap: nowrap;
    flex: 0 0 60%;
    max-width: 60%;
    overflow-x: auto;
}

span.article-category a {
    white-space: nowrap;
}


span.article-category::-webkit-scrollbar {
    height: 3px;
    background-color: #ffffff;
    border:1px solid #9d9d9d;
    
} 
span.article-category::-webkit-scrollbar-thumb {
    background-color: #9E9E9E;
    height:3x;
    
}

.row.no-gutters {
    margin-right: 0;
    margin-left: 0;
}

.list-payment-checkout .nav {
    display: flex;
    flex-wrap: wrap;
    margin-left: -5px;
    margin-right: -5px;
}

.list-payment-checkout .nav li.nav-item {
    flex: 0 0 50%;
    max-width: 50%;
    padding-left: 5px;
    padding-right: 5px;
}

.list-payment-checkout .list-bank {
    background: #f1f1f1;
    padding: 15px;
    border-radius: 8px;
    margin-bottom: 20px;
}

.list-payment-checkout .list-bank>.row {
    margin-right: -7.5px;
    margin-left: -7.5px;
}

.list-payment-checkout .list-bank>.row>div {
    padding-right: 7.5px;
    padding-left: 7.5px;
}
.item-qr-code .qr-code img {
    border-radius: 8px;
}
.order-section-theme {
    text-align: center;
    max-width: 700px;
    background: #fff;
    padding: 30px;
    border-radius: 20px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 30px !important;
    background-image: linear-gradient(180deg, #fff, #f9f9f9);
}

.order-section-theme .icon img {
    width: 100px;
    height: 100px;
}

.order-section-theme .inter-content {
    font-size: 20px;
    text-align: left;
}

.order-section-theme .icon {
    margin-bottom: 15px;
}
.order-section-theme .inter-content .item {
    margin-bottom: 5px;
}

.order-section-theme .inter-content .item>span {
    font-weight: 700;
    color: var(--color-main);
}

.order-section-theme .inter-content .item {
    margin-bottom: 10px;
}

.order-section-theme .inter-content  .link {
    text-align: center;
}
.order-section-theme .inter-content .title.item {
    color: var(--color-main);
    font-weight: 700;
    font-size: 30px;
    text-align: center;
}

.order-section-theme .inter-content .item>span {
    font-weight: 700;
}
.order-section-theme .inter-content .link a {
    border: 1px solid var(--color-main);
    display: inline-block;
    padding: 7px 25px;
    border-radius: 5px;
    color: var(--color-main);
    font-size: 18px;
}
.tags.list-unstyled>li>a {
    background: #ddd;
    padding: 2px 15px;
    display: inline-block;
    border-radius: 23px;
    font-size: 13px !important;
    margin-right: 5px;
    color: #636363;
}
.article-breacrums .article-category {
    flex: none;
    max-width: none;
    display: inline-block;
}
.box-section-dt-article-02 {
    margin-top: 50px;
}

.box-section-dt-article-01 {
    padding-bottom: 50px;
}
@media (max-width:1200px){
    .box-list-branch .title {
        font-size: 19px;
        margin-bottom: 20px;
    }

    .box-list-branch .list .item-branch {
        padding: 20px;
        margin-bottom: 15px;
        height: auto;
    }

    .box-list-branch {
        margin-bottom: 20px;
    }

    .box-form-contact-page {
        padding: 20px;
        margin-bottom: 0;
    }

    .box-form-contact-page .dsc-section {
        font-size: 16px;
        margin-bottom: 20px;
    }

    .box-form-contact-page .title {
        font-size: 22px;
    }

    .box-form-contact-page .info-form-right .form-group {
        height: 150px;
    }

    .box-form-contact-page .info-form-right span.btn.btn-submit {
        position: initial;
        width: 100%;
        margin-top: 10px;
        border-radius: 8px;
    }
    #registertrial-modal .modal-content>.row {
        background: var(--color-main);
    }
    #registertrial-modal .modal-content>.row>div:nth-child(2) {
        background: #fff;
    }
    .content-inter-price .content-price .top-price-col .item-package.packages-data .img {
        display: none;
    }
    .breadcrumbs-section {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
    }
    .breadcrumbs-section::-webkit-scrollbar {
        display:none;
    }
    .sticky-top {
        position: initial;
    }
    .box-section-dt-article-01 {
        padding-bottom: 30px;
    }

    .box-section-dt-article-02 {
        margin-top: 30px;
    }
    .article-content {
        overflow: hidden;
    }
    .order-section-theme .inter-content {
        font-size: 14px;
    }

    .order-section-theme .inter-content .title.item {
        font-size: 20px;
    }
    .order-section-theme {
        margin-bottom: 0 !important;
    }
    .breadcrumbs-list-cate {
        font-size: 23px;
    }
    html {
        overflow-x: hidden;
    }
    .box-section-kho-03 {
        padding-top: 30px;
    }
    ._price-list {
        margin-bottom: 0;
    }
}

@media (max-width:767px){
    .item-order-theme .top-name-right .name-element {
        font-size: 17px;
    }

    .item-order-theme .price-quantity .price-amount {
        font-size: 15px;
    }
    .img-registertrial {
        position: relative;
        padding-top: 310px;
    }
    
    .img-registertrial img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        object-fit: cover;
    }
    .recruitment-item .inner-image {
        text-align: center;
        margin-bottom: 5px;
    }

    .recruitment-item .inner-image span.position {
        display: none;
    }

    .recruitment-item .recruitment-content {
        text-align: center;
        margin-top: 5px;
    }

    article.recruitment-item .recruitment-content span.position {
        display: none;
    }
    ._price-list .item-price {
        height: auto;
    }
    .product-home .inner-content {
        bottom: 0;
        padding: 7px !important;
    }
    .product-home .inner-content .btn {
        font-size: 11px !important;
        padding: 5px 2px 3px;
    }

}
@media (min-width:768px) and (max-width:1200px){
    ._price-list .item-price {
        margin-top: 10px;
    }
    
    ._price-list .item-price ._header .price {
        font-size: 2.5rem;
    }
    
    ._price-list .item-price ._header {
        padding: 2.5rem 2rem 5rem;
    }
}

@media (min-width:1200px){
    .main-menu>.container>.row>div:nth-child(3) .search-section {
        display: none;
    }
    .box-landing-hn-012 {
        padding-top: 50px;
    }
    .article-item .article-description {
        margin-bottom: 1.5rem;
        color: #002152;
        display: -webkit-box;
        max-width: 100%;
        font-size: 14px;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .row-item-tpl>.row>div:nth-child(1) {
        flex: 0 0 430px;
        max-width: 430px;
    }

    .row-item-tpl>.row>div:nth-child(2) {
        flex-basis: calc(100% - 430px);
        max-width: calc(100% - 430px);
    }
    .box-themes-home .swiper .swiper-wrapper .product-item {
        flex: 0 0 29%;
        max-width: 29%;
    }
}
@media (min-width:1400px) and (max-width:1600px){
    .box-themes-home .swiper .swiper-wrapper .product-item {
        flex: 0 0 36%;
        max-width: 36%;
    }
}
@media (min-width:1200px) and (max-width:1400px){
    .box-themes-home .swiper .swiper-wrapper .product-item {
        flex: 0 0 38%;
        max-width: 38%;
    }
    .row-item-tpl>.row>div:nth-child(1) {
        flex: 0 0 390px;
        max-width: 390px;
    }

    .row-item-tpl>.row>div:nth-child(2) {
        flex-basis: calc(100% - 390px);
        max-width: calc(100% - 390px);
    }
}
@media (min-width:1200px) and (max-width:1500px){
    .is-pc .box-highlight-theme .item .title , .box-note-theme .text, .point-conversion .inter-content,.product-detail-footer .content{
        font-size: 14px;
    }
    .box-section-ndth-01, .box-section-ndth-02 {
        padding-bottom: 40px;
    }
    .entire-info-website .block-tab.nav .nav-link {
        font-size: 14px;
        padding: .8rem 1rem;
    }
    .box-section-ndth-04 .price-list-brand {
        padding-bottom: 0;
    }
    
}   
@media (min-width:500px) and (max-width:1200px){
    .main-menu>.container>.row>div {
        flex: 0 0 33.33%;
        max-width: 33.33%;
    }

    .main-menu>.container>.row>div:nth-child(2) {
        order: 1;
        display: flex;
        justify-content: flex-start;
    }

    .is-pc .main-menu>.container>.row>div:nth-child(1) {
        order: 2;
    }

    .is-pc .main-menu>.container>.row>div:nth-child(3) {
        order: 3;
    }

    .is-pc .main-menu>.container>.row>div:nth-child(2) .search-section {
        display: none;
    }

    .is-pc .main-menu {
        padding: 10px 0;
    }

    .is-pc .main-menu .logo-section {
        text-align: center;
    }
    .is-pc .client--manager {
        height: 18px;
        overflow: hidden;
    }
    .is-pc .box-highlight-theme .item .title {
        font-size: 14px;
    }
    .is-pc .title-phone-contact {
        font-size: 2rem;
    }
    .is-pc .box-section-home-05 {
        padding: 0 15px;
    }
    .is-pc .box-section-home-02 {
        padding-right: 15px;
        padding-left: 15px;
    }

   .is-pc .entire-info-website .block-tab.nav .nav-link {
        height: 54px;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .is-pc .box-form-contact .title-desc {
        font-size: 18px !important;
    }
    .is-pc .menu-section > ul > li {
        padding: 5px 0px;
    }

    .is-pc .menu-section > ul > li .submega-custom {
        display: none;
    }

    .is-pc .menu-section .grower {
        display: none;
    }
    .box-team-count {
        padding-top: 20px;
    }
}

@media (min-width:500px) and (max-width:768px){
    .is-pc .home-ss4 form {
        max-width: 400px;
        margin-left: auto;
        margin-right: auto;
    }
    .is-pc .box-section-home-02>.row>div:nth-child(1) {
        display: none;
    }

    .is-pc .box-section-home-02>.row>div:nth-child(2) {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }
}

@media (min-width:768px) and (max-width:1200px){
    .is-pc .box-section-home-02>.row.no-gutters {
        margin-right: -7.5px;
        margin-left: -7.5px;
    }
    
    .is-pc .box-section-home-02>.row.no-gutters>div {
        padding-right: 7.5px;
        padding-left: 7.5px;
    }
    .box-footer-03>.container>.row>div {
        flex: 0 0 25%;
        max-width: 25%;
    }
    .client--description {
        margin-top: 5px;
    }
}
.search-recruitment .btn-outline-secondary {
    width: 100%;
    height: 100%;
}
/*hieutx*/

.opt-register-site--background {
    position: relative;
}
.opt-register-site--background::before{
    content: '';
    position:absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width:100%;
    height:100%;
    background: url('https://web4s.vn/uploads/plugin/custom_img/2024-03-21/otpbackground.jpg') no-repeat;
    background-size: 100% 100%;
    z-index:-1;
}
.entire-info-website address p a {
    color: #000;
    display: inline-block;
    margin-left: 5px;
}
.opt-register-site {
    padding: 70px 0;
    max-width: 913px;
    margin: 0 auto;
}
.opt-register-site--form{
    max-width: 523px;
    margin: 0 auto 57px;
}
.opt-register-site--logo {
    margin-bottom: 90px;
}
.opt-register-site--logo.opt-register-site--seccess{
    margin-bottom: 83px;
}
.opt-register-site--title {
    margin-bottom: 15px;
    color: #0D5DD6;
    font-size: 36px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}
.opt-register-site--description {
    margin-bottom: 50px;
    color: #7E7E7E;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    max-width: 628px;
    margin: 0 auto 50px;
}
.opt-register-site--support {
    color: #4A4A4A;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}
.opt-register-site--form .form-control{
    height: 56px;
    border-radius: 12px;
    border: 1px solid #E2E2E2;
    background: #F1F1F1;
    padding-left: 16px;
    padding-right: 16px;
}
.opt-register-site--resend {
    width: 100%;
    height: 56px;
    line-height: 54px;
    padding: 0;
    border-radius: 12px !important;
    border: 1px solid #FFD0AD;
    background: #FFDFC7;
    color: #F76C06;
    text-align: center;
}
.opt-register-site--submit {
    height: 56px;
    border-radius: 12px !important;
    background: #DDEBFF;
    border: 1px solid #DDEBFF;
    color: #88B7FF;
    display: block;
    padding-top: 0;
    padding-bottom: 0;
    line-height: 54px;
    width: 100%;
}
.opt-register-site--alert {
    text-align: left;
    padding: 15px 16px;
    color: #0D5DD6;
    font-size: 16px;
    border-radius: 12px;
    border: 1px solid #88B7FF;
    background: #DDEBFF;
}
.opt-register-site--alert svg{
    vertical-align: bottom;
    margin-right: 6px;
}
.opt-register-site--image {
    margin-top: 23px;
    margin-bottom: 98px;
}
.opt-register-site--access {
    height: 56px;
    border-radius: 12px !important;
    line-height: 54px;
    padding: 0 37px;
    color: #FFF;
    font-size: 16px;
    font-weight: 400;
     /* 150% */
    background: #0D5DD6;
    margin-bottom: 38px;
}
.toggle-password {
    display: none;
    line-height: 1;
    position:absolute;
    top: 50%;
    right: 16px;
    transform: translateY(-50%);
}
.opt-register-site--form .result-validate{
    text-align:left;
}
.title-param a {
    color: #fff;
}

.box-art-page .item-2-art .inner-content .article-title {
    min-height: auto;
    font-size: 20px;
}


/*Button Contact Fixed*/
.contact-fixed {
    z-index: 999;
    right: 20px;
    bottom: 15px;
    position: fixed;
    height: 60px;
    width: 60px;
    background: linear-gradient(90deg, #0D5DD6 0%, #9747FF 100%);
    border-radius: 50%;
    cursor: pointer;
}

.contact-fixed__button {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    color: var(--white);
    font-size: 10px;
    line-height: 11px;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    -webkit-transition: ease-in .12s all;
    -o-transition: ease-in .12s all;
    transition: ease-in .12s all;
}

.contact-fixed__button.show {
    -webkit-transform: rotate(0) scale(1);
    -ms-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
}

.contact-fixed__button i {
    font-size: 18px;
    margin-bottom: 2px;
}

.contact-fixed__pulsation {
    width: 84px;
    height: 84px;
    background: linear-gradient(90deg, #0D5DD6 0%, #9747FF 100%);
    border-radius: 50px;
    position: absolute;
    left: -12px;
    top: -12px;
    z-index: -1;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    -webkit-animation: arcontactus-pulse 2s infinite;
    animation: arcontactus-pulse 2s infinite;
}

.contact-fixed__pulsation:nth-child(2n) {
    -webkit-animation-delay: .5s;
    animation-delay: .5s;
}

.contact-fixed__close {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    color: var(--white);
    font-size: 24px;
    -webkit-transform: rotate(180deg) scale(0);
    -ms-transform: rotate(180deg) scale(0);
    transform: rotate(180deg) scale(0);
    -webkit-transition: ease-in .12s all;
    -o-transition: ease-in .12s all;
    transition: ease-in .12s all;
}

.contact-fixed__close.show {
    -webkit-transform: scale(1);
    -ms-transform: rotate(-45deg) scale(1);
    transform: scale(1);
}

.contact-fixed__list {
    background: center no-repeat var(--white);
    box-shadow: 0 0 10px rgb(0 0 0 / 60%);
    width: 235px;
    position: absolute;
    bottom: 80px;
    right: 0;
    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: start;
    -ms-flex-align: start;
    align-items: flex-start;
    padding: 10px 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 7px;
    -webkit-transform-origin: 80% 105%;
    -ms-transform-origin: 80% 105%;
    transform-origin: 80% 105%;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    -webkit-transition: ease-out .12s all;
    -o-transition: ease-out .12s all;
    transition: ease-out .12s all;
    z-index: 10000;
}

.contact-fixed__list:before {
    position: absolute;
    bottom: -7px;
    right: 25px;
    left: auto;
    display: inline-block!important;
    border-right: 8px solid transparent;
    border-top: 8px solid #FFF;
    border-left: 8px solid transparent;
    content: '';
}

.contact-fixed__list.show {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

.contact-fixed__item {
    display: flex;
    align-items: center;
    padding: 8px 15px;
    width: 100%;
    color: #000;
}

.contact-fixed__item:hover {
    background-color: #eeeeee;
    color: var(--color-text);
}

.contact-fixed__item-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin-right: 12px;
    background: linear-gradient(90deg, #0D5DD6 0%, #9747FF 100%);
    border-radius: 50%;
    padding: 8px;
}

.contact-fixed__item-icon img {
    filter: brightness(0) invert(1);
    width: 22px;
}

@keyframes arcontactus-pulse {
    0% {
        -webkit-transform:scale(0);
        transform:scale(0);
        opacity:1
    }
    50% {
        opacity:.5
    }
    100% {
        -webkit-transform:scale(1);
        transform:scale(1);
        opacity:0
    }
}
/*End Button Contact Fixed*/
@media (max-width:1200px){
    .contact-fixed {
        bottom: 75px;
        right: 6px;
    }
    .box-category-landing-img .item a {
        padding: 15px 5px !important;
        height: 100%;
        font-size: 12px;
    }

    .box-category-landing-img .item {
        height: 100%;
    }
    
}
.filter-product .bootstrap-select.form-control .dropdown-toggle {
    background: #D6E6FF;
    border-radius: 0.5rem !important;
    height: 4.8rem;
}

.filter-product .bootstrap-select.form-control .dropdown-toggle .filter-option {
    display: flex;
    align-items: center;
    color: #70757d;
}
body.view_demo {
    padding-top: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.view-demo .top-header {
    background-color: #171a23;
    height: 50px;
}
.view-demo .top-header .view-back {
    display: inline-block;
    color: #fff;
    font-size: 14px;
    line-height: 50px;
    margin-right: 20px;
    margin-left: 10px;
    text-transform: uppercase;
    font-weight: bold;
}
.view-demo .top-header .view-back .fa-reply,
.view-demo .top-header .view-type a.type-item .fas {
    margin-right: 5px;
}
.view-demo .top-header .view-type a.type-item {
    position: relative;
    display: inline-block;
    font-size: 16px;
    color: rgba(255, 255, 255, .58);
    font-weight: 300;
    line-height: 24px;
    padding: 13px 15px;
    cursor: pointer;
}
.view-demo .top-header .view-type a.type-item:hover, .view-demo .top-header .view-type a.type-item.current {
    color: #fff;
    text-decoration: none;
}
.view-demo .top-header .btn-registration {
    display: inline-block;
    padding: 0px 15px;
    font-size: 14px;
    line-height: 14px;
    margin: 0px 15px;
    border-radius: 5px;
    color: #fff;
    background-image: none;
    background: var(--bg-grd);
    background: var(--bg-grd);
    text-transform: none;
    height: 35px;
    line-height: 35px;
}
#demo-wrapper {
    position: relative;
    width: 100%;
    height: calc(100% - 50px);
    text-align: center;
}
#demo-container {
    /*-webkit-transition-property: all;
    -moz-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 300ms;
    -moz-transition-duration: 300ms;
    transition-duration: 300ms;
    -webkit-transition-timing-function: cubic-bezier(0.605, 0.195, 0.175, 1);
    -moz-transition-timing-function: cubic-bezier(0.605, 0.195, 0.175, 1);
    transition-timing-function: cubic-bezier(0.605, 0.195, 0.175, 1);
    max-width: 100%;
    max-height: 100%;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    background: #ddd;*/
    height: 100vh;
    position: relative;
}
#demo-container iframe {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   border: 0;
   z-index: 1;
}
.view-demo .top-header>.row {
    display: flex;
    align-items: center;
}

.box-category-landing-img .item a {
    padding: 10px 15px;
}

.box-category-landing-img .item .icon {
    width: 40px;
    height: 40px;
}

.box-category-landing-img .item .icon img {
    width: 20px;
    height: 20px;
}


[nh-nh-popup-programme] .modal-content {
    background: none;
    padding: 0;
    border: 0;
}

[nh-nh-popup-programme] .modal-content .modal-body {
    padding: 0;
}

.box-info-popup img {
    width: 100%;
    height: auto;
}
[nh-nh-popup-programme] .modal-content .close {
    position: absolute;
    right: 10px;
    top: 10px;
    z-index: 8;
    color: red;
    opacity: 1;
    text-shadow: none;
    line-height: 1;
}
[nh-nh-popup-programme] .modal-content .close img {
    width: 30px;
    height: 30px;
}
.modal-backdrop.show {
    opacity: 0.8;
}


.box-form-modal .icon-modal {
    z-index: 6;
    position: fixed;
    left: 15px;
    bottom: 100px;
}

.box-form-modal .icon-modal .img-tv img {
    width: 45px;
    position: absolute;
    bottom: 0px;
    left: 50%;
    transform: translateX(-50%);
}

.box-form-modal .icon-modal .img-tv {
    width: 80px;
    height: 80px;
    position: relative;
    background: #000000;
    border-radius: 50%;
}

.box-form-modal {
    position: fixed;
    background: var(--bg-grd);
    color: #fff;
    font-size: 10px;
    padding: 15px;
    border-radius: 8px;
    right: 5px;
    bottom: 5px;
    padding-right: 70px;
    z-index: 99;
    cursor: pointer;
}

.box-form-modal:before {
    content: '';
    position: absolute;
    left: 5px;
    top: 5px;
    width: calc(100% - 10px);
    height: calc(100% - 10px);
    z-index: -1;
    border-radius: 8px;
    border: 1px dashed #fff;
    cursor: pointer;
}
.box-form-modal img {
    width: 50px;
    position: absolute;
    bottom: 0;
    right: 3px;
}

.box-form-modal span {
    display: inline-block;
    min-width: 122px;
    text-align: right;
    max-width: 183px;
}

.box-form-modal-mb {
    position: fixed;
    bottom: -5px;
    left: 5px;
    z-index: 99;
}

.box-form-modal-mb img {
    height: 45px;
}
.user-box-ytb video {
    object-fit: contain;
    background: #000000;
}
.article-detail strong {
    font-weight: 700;
}
.swiper-bmdn-main .item-bmdn .inter-image {
    max-width: 170px;
    margin-left: auto;
    margin-right: auto;
}
.description-brand-bottom>ul {
    padding-left: 0;
}
.home-ss1 .text-title {
    font-size: 33px;
}
@media (max-width:1200px){
    .table-content-packages .packages-list .table tbody tr td img {
        width: 15px;
        height: 15px;
    }
    .box-form-modal {
        font-size: 9px;
        padding: 10px;
        padding-right: 40px;
        bottom: 0;
    }
    
    .box-form-modal span {
        max-width: 165px;
    }
    
    .box-form-modal img {
        width: 31px;
    }
    .block-cust-care li.nav-item a {
        background: #ffffff;
        border-radius: 5px;
        padding: 7px 15px;
    }
    
    .block-cust-care li.nav-item a.active {
        background: var(--color-main);
        color: #fff;
    }
    ul.block-cust-care {
        position: inherit !important;;
    }
}

@media (min-width:1200px) and (max-width:1400px){
    .submega-custom .column:nth-child(2) {
        padding: 0 20px 0 15px;
    }

    .submega-custom {
        padding: 15px;
    }

    .submega-custom .column:nth-child(2):after {
        right: 15px;
    }
    .submega-custom {
        min-width: 1000px;
        left: -10%;
    }
}
.opt-register-site--background 
.progress{
    width: 150px;
    height: 7px;
    line-height: 150px;
    background: none;
    box-shadow: none;
    position: relative;
}
.progress:after{
    content: "";
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 12px solid #fff;
    position: absolute;
    top: 0;
    left: 0;
}
.progress > span{
    width: 50%;
    height: 100%;
    overflow: hidden;
    position: absolute;
    top: 0;
    z-index: 1;
}
.progress .progress-left{
    left: 0;
}
.progress .progress-bar{
    width: 100%;
    height: 100%;
    background: none;
    border-width: 12px;
    border-style: solid;
    position: absolute;
    top: 0;
}
.progress .progress-left .progress-bar{
    left: 100%;
    border-top-right-radius: 80px;
    border-bottom-right-radius: 80px;
    border-left: 0;
    -webkit-transform-origin: center left;
    transform-origin: center left;
}
.progress .progress-right{
    right: 0;
}
.progress .progress-right .progress-bar{
    left: -100%;
    border-top-left-radius: 80px;
    border-bottom-left-radius: 80px;
    border-right: 0;
    -webkit-transform-origin: center right;
    transform-origin: center right;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}
.progress .progress-value{
    width: 90%;
    height: 90%;
    border-radius: 50%;
    background: #ffffff;
    font-size: 24px;
    color: var(--color-main);
    line-height: 135px;
    text-align: center;
    position: absolute;
    top: 5%;
    left: 5%;
}
.progress.blue .progress-bar{
    border-color: var(--color-main);
}

.btn-contact-modal {
    position: fixed;
    left: 0;
    bottom: 0;
    z-index: 9;
}

.btn-contact-modal img {
    width: 105px;
    position: absolute;
    left: 0;
    bottom: 0;
}

.text-modal {
    width: 183px;
    padding: 45px 18px 19px 30px;
    height: 130px;
    font-size: 13px;
    display: flex;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    -webkit-animation: ring 6s 2s ease-in-out infinite;
    -webkit-transform-origin: 50% 4px;
    -moz-animation: ring 4s 2s ease-in-out infinite;
    -moz-transform-origin: 50% 4px;
    animation: ring 4s 2s ease-in-out infinite;
}
.btn-contact-modal .inter-pub {
    position: relative;
    padding-left: 85px;
}
.text-modal span {
    display: flex;
    align-items: center;
    color: var(--black);
    font-weight: 700;
    line-height: 1.2;
}

@-webkit-keyframes ring {
    0% {
        -webkit-transform: rotateZ(0)
    }

    1% {
        -webkit-transform: rotateZ(30deg)
    }

    27% {
        -webkit-transform: rotateZ(-12deg)
    }

    29% {
        -webkit-transform: rotateZ(10deg)
    }

    31% {
        -webkit-transform: rotateZ(-8deg)
    }

    33% {
        -webkit-transform: rotateZ(6deg)
    }

    35% {
        -webkit-transform: rotateZ(-4deg)
    }

    37% {
        -webkit-transform: rotateZ(2deg)
    }

    39% {
        -webkit-transform: rotateZ(-1deg)
    }

    41% {
        -webkit-transform: rotateZ(1deg)
    }

    43% {
        -webkit-transform: rotateZ(0)
    }

    100% {
        -webkit-transform: rotateZ(0)
    }
}

@-moz-keyframes ring {
    0% {
        -moz-transform: rotate(0)
    }

    1% {
        -moz-transform: rotate(30deg)
    }

    27% {
        -moz-transform: rotate(-12deg)
    }

    31% {
        -moz-transform: rotate(-8deg)
    }

    33% {
        -moz-transform: rotate(6deg)
    }

    35% {
        -moz-transform: rotate(-4deg)
    }

    37% {
        -moz-transform: rotate(2deg)
    }

    39% {
        -moz-transform: rotate(-1deg)
    }

    41% {
        -moz-transform: rotate(1deg)
    }

    43% {
        -moz-transform: rotate(0)
    }

    100% {
        -moz-transform: rotate(0)
    }
}

@keyframes ring {
    0% {
        transform: rotate(0)
    }

    1% {
        transform: rotate(30deg)
    }

    27% {
        transform: rotate(-12deg)
    }

    31% {
        transform: rotate(-8deg)
    }

    33% {
        transform: rotate(6deg)
    }

    35% {
        transform: rotate(-4deg)
    }

    37% {
        transform: rotate(2deg)
    }

    39% {
        transform: rotate(-1deg)
    }

    41% {
        transform: rotate(1deg)
    }

    43% {
        transform: rotate(0)
    }

    100% {
        transform: rotate(0)
    }
}

.km-hot {
    width: 2.8rem;
    height: 2.8rem;
    object-fit: contain;
    /*position: absolute;*/
    margin-top: -1.4rem;
    /*transform: rotate(45deg);*/
}

@media (max-width:1200px){
    .btn-contact-modal img {
        width: 75px;
    }
    
    .text-modal {
        width: 150px;
        padding: 38px 13px 16px 19px;
        height: 104px;
        font-size: 11px;
    }
    
    .btn-contact-modal .inter-pub {
        padding-left: 54px;
    }
}
.table-content-packages .packages-list a {
    color: inherit;
}
.table-content-packages .packages-list a:hover {
    color: var(--color-highlight);
}

.modal-table-service .modal-dialog {
    max-width: 100%;
    width: 900px;
}
.modal-table-service .close-popup {
    background: #222 !important;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    color: #fff !important;
    font-size: 14px;
    border: 2px solid #fff !important;
    position: absolute;
    top: -15px;
    right: -15px;
    opacity: 1;
}
.modal-table-service .vertical-content {
    display: block !important;
    font-size: 13px;
}
.modal-table-service .modal-dialog .modal-content {
    padding: 15px 15px 15px 15px;
}

.modal-table-service .modal-content {
    position: relative;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 5px solid rgba(225, 225, 225, .2);
    border-radius: 5px !important;
    outline: 0;
    -webkit-box-shadow: 0 3px 9px rgb(0 0 0 / 10%);
    box-shadow: 0 3px 9px rgb(0 0 0 / 10%);
}
.title-bao-gia-nhan-dien td {
    color: #ffffff;
    font-weight: 700;
    text-transform: uppercase;
    background: #0083d3;
}

.scoll-table-nhan-dien .table-bordered thead th, .scoll-table-nhan-dien .table-bordered thead td {
    border-bottom-width: 1px;
}

.vertical-content.bang-gia-nhan-dien .table-service-2 tbody tr td {
    text-align: center;
    white-space: nowrap;
}
.vertical-content.bang-gia-nhan-dien .table-service-2 tbody tr td:first-child {
    text-align: left;
    white-space: initial;
}
.vertical-content.bang-gia-nhan-dien tr>th:nth-child(1) {
    text-align: left;
}
.vertical-content.bang-gia-nhan-dien tr > th {
    text-align: center;
    font-size: 14px;
    vertical-align: inherit;
}
.vertical-content.bang-gia-nhan-dien .table-service-2 tbody tr td > i {
    color: #0083d3;
}
.vertical-content.bang-gia-nhan-dien .title-main {
    color: var(--color-main);
    font-weight: 700;
}
.description-brand-bottom .link-all a {
    color: #fff;
    background: var(--color-highlight);
    padding: 5px 10px;
    display: inline-flex;
    border-radius: 5px;
}

.swiper-ndth--title {
    font-size: 18px;
    font-weight: 700;
    color: var(--color-highlight);
    margin-bottom: 10px;
}
.list-table-price-service .title-all {
    margin-bottom: 30px;
        font-weight: 700 !important;
}
.list-table-price-service table thead tr th {
    vertical-align: middle;
    color: #0083D3;
    border-bottom: 0;
    text-align: center;
    font-size: 16px;
    padding: 15px 5px;
}
.list-table-price-service table thead tr th:nth-child(1) {
    width: 210px;
}
.list-table-price-service table tr td {
    vertical-align: middle;
    text-align: center;
    padding: 15px 5px;
}
.list-table-price-service table tr td span.img img {
    height: 64px;
}
.box-ndth-005 {
    background: #f1f6fe;
    padding-top: 30px;
}


.form-contact-phone .modal-dialog {
    max-width: 400px;
}

.form-contact-phone .modal-dialog .modal-content {
    background: #fff;
    padding: 20px;
    margin: auto;
    border-top: 5px solid var(--color-main);
    position: relative;
    border-radius: 15px;
}

.form-contact-phone .modal-dialog .modal-content .close {
    position: absolute;
    right: 5px;
    top: 5px;
    color: red;
    opacity: 1;
}

.form-contact-phone  .form .inter-form i {
    font-size: 33px;
}

.form-contact-phone .modal-dialog .modal-content .modal-body {
    padding: 0;
}

.form-contact-phone .form .inter-form i {
    color: var(--color-main);
    font-size: 33px;
    display: inline-block;
    margin-bottom: 5px;
}

.form-contact-phone .form .inter-form .title {
    font-size: 20px;
    font-weight: 700;
    color: var(--color-main);
    margin-bottom: 3px;
}

.form-contact-phone .form .inter-form .slogan {
    margin-bottom: 10px;
}

.form-contact-phone .form .inter-form form .form-group:last-child {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.form-contact-phone .form .inter-form form .form-group .form-control {
    border: 1px solid #ddd;
    border-radius: 5px;
    height: 40px;
    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
}

.form-contact-phone .form .inter-form form .form-group textarea.form-control {
    height: 80px;
}

.form-contact-phone .form .inter-form form .form-ratio .custom-control {
    padding-left: 0;
    margin-right: 20px;
}

.form-contact-phone .form .inter-form form .form-ratio .custom-control input {
}

.form-contact-phone .form .inter-form form .form-ratio .custom-control .custom-control-label {
    font-weight: 400;
    padding-left: 25px;
}

.form-contact-phone .form .inter-form form .form-ratio .custom-control .custom-control-label::before {
    width: 20px;
    height: 20px;
    border-color: var(--color-main);
    left: 0;
    top: 1px;
    border-width: 2px;
}

.form-contact-phone .form .inter-form form .form-ratio .custom-control .custom-control-label::before {
    background: #fff;
}

.form-contact-phone .form .inter-form form .form-ratio .custom-control .custom-control-label::after {
    width: 10px;
    height: 10px;
    background: #fff;
    border-radius: 50%;
    left: 5px;
    top: 6px;
}

.form-contact-phone .form .inter-form form .form-ratio .custom-control  .custom-control-input:checked ~ .custom-control-label::after {
    background: var(--color-main);
}
.go-hotline a {
    display: inline-block;
    font-weight: 700;
    color: var(--color-main);
    margin-left: 3px;
}

.go-hotline {
    font-size: 14px;
}

.form-contact-phone .form .form-ratio {
    border-bottom: 1px dashed #ddd;
    padding-bottom: 12px;
    margin-bottom: 12px;
}


.form-contact-phone .form .inter-form form .radio-form .title-gl {
    font-size: 15px;
    margin-bottom: 7px;
}
[id^="b_fe7bdba0_"] {
    display: none;
}
.box-demo-like {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    position: relative;
        height: 28px;
}

.box-demo-like .fb-like.fb_iframe_widget {
    width: 70px;
    top: 5px;
    overflow: hidden;
}
.fb-share-button {
    opacity: 0;
    display: none;
}
.box-like-share [nh-link-redirect-blank] {
    color: #fff;
    font-size: 11px;
    background: #4080ff;
    padding: 0 10px;
    height: 20px;
    position: relative;
    top: 5px;
    border-radius: 2px;
    margin-left: 10px;
    display: flex;
    align-items: center;
}
.view-demo .top-header .view-back {
    font-size: 11px;
    margin-right: 0;
}

.packages-list-ldp {
    background: white;
    padding: 2rem;
    border-radius: 1rem;
}

.packages-list-ldp .table th, .packages-list-ldp .table td {
    border: 0;
    padding: 1.5rem 1rem;
}

@media (max-width:767px){
    .view-demo .top-header .btn-registration {
        font-size: 10px;
        padding: 0 5px;
        height: 30px;
        line-height: 30px;
        margin-left: 10px;
        margin-right: 10px;
    }
    
    .box-like-share [nh-link-redirect-blank] {
        padding-left: 7px;
        padding-right: 7px;
        margin-left: 3px;
    }
    .home-ss1 .text-title{
        font-size: 21px;
    }
    .scoll-table-nhan-dien,.list-table-price-service .inter-content-price-dv {
        overflow-x: auto;
    }
    
    .scoll-table-nhan-dien .table, .list-table-price-service .inter-content-price-dv .table {
        width: 700px;
    }
    .modal-table-service .close-popup {
        right: 5px;
        top: 5px;
    }
}

.box-like-share {
    display: flex;
    justify-content: flex-end;
    height: 28px;
}

.box-like-share .fb-share-button.fb_iframe_widget span {
    color: #ffff !important;
    top: -8px;
}

.box-like-share .fb-share-button.fb_iframe_widget iframe {
    color: #fff;
    position: relative;
    background: #4080ff;
    height: 19px !important;
    border-radius: 2px;
    width: 63px !important;
    text-align: center;
    padding-top: 1px;
    padding-left: 13px;
}
.box-like-share .fb-share-button.fb_iframe_widget ._6a._6b, .box-like-share .fb-share-button.fb_iframe_widget  a {
    color: #fff;
}
._6a._6b {
    color: #fff;
    margin-left: auto;
    margin-right: auto;
    display: inline-block;
}

.box-like-share .fb-share-button.fb_iframe_widget iframe .mrs {
    display: none !important;
}

.mrs {
    display: none;
}
#vfone_call {
    opacity: 0;
    visibility: hidden;
}

.opt-register-site--background 
.progress{
    width: 0;
    /* height: 150px; */
    line-height: 150px;
    background: none;
    /* margin: 0 auto; */
    box-shadow: none;
    position: relative;
}
.progress:after{
    content: "";
    width: 100%;
    height: 100%;
    border-radius: 0;
    border: 4px solid #0d62d2;
    position: absolute;
    top: 0;
    left: 0;
}
.progress > span{
    width: 50%;
    height: 100%;
    overflow: hidden;
    position: absolute;
    top: 0;
    z-index: 1;
}
.progress .progress-left{
    left: 0;
}
.progress .progress-bar{
    width: 100%;
    height: 100%;
    background: none;
    border-width: 12px;
    border-style: solid;
    position: absolute;
    top: 0;
}
.progress .progress-left .progress-bar{
    left: 100%;
    border-top-right-radius: 80px;
    border-bottom-right-radius: 80px;
    border-left: 0;
    -webkit-transform-origin: center left;
    transform-origin: center left;
}
.progress .progress-right{
    right: 0;
}
.progress .progress-right .progress-bar{
    left: -100%;
    border-top-left-radius: 80px;
    border-bottom-left-radius: 80px;
    border-right: 0;
    -webkit-transform-origin: center right;
    transform-origin: center right;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}
.progress .progress-value{
    width: 90%;
    height: 90%;
    border-radius: 50%;
    background: #ffffff;
    font-size: 24px;
    color: var(--color-main);
    line-height: 135px;
    text-align: center;
    position: absolute;
    top: 5%;
    left: 5%;
}
.progress.blue .progress-bar{
    border-color: var(--color-main);
}

.btn-contact-modal {
    position: fixed;
    left: 0;
    bottom: 0;
    z-index: 9;
}

.btn-contact-modal img {
    width: 105px;
    position: absolute;
    left: 0;
    bottom: 0;
}

.text-modal {
    width: 183px;
    padding: 45px 18px 19px 30px;
    height: 130px;
    font-size: 13px;
    display: flex;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    -webkit-animation: ring 6s 2s ease-in-out infinite;
    -webkit-transform-origin: 50% 4px;
    -moz-animation: ring 4s 2s ease-in-out infinite;
    -moz-transform-origin: 50% 4px;
    animation: ring 4s 2s ease-in-out infinite;
}
.btn-contact-modal .inter-pub {
    position: relative;
    padding-left: 85px;
}
.text-modal span {
    display: flex;
    align-items: center;
    color: var(--black);
    font-weight: 700;
    line-height: 1.2;
}

@-webkit-keyframes ring {
    0% {
        -webkit-transform: rotateZ(0)
    }

    1% {
        -webkit-transform: rotateZ(30deg)
    }

    27% {
        -webkit-transform: rotateZ(-12deg)
    }

    29% {
        -webkit-transform: rotateZ(10deg)
    }

    31% {
        -webkit-transform: rotateZ(-8deg)
    }

    33% {
        -webkit-transform: rotateZ(6deg)
    }

    35% {
        -webkit-transform: rotateZ(-4deg)
    }

    37% {
        -webkit-transform: rotateZ(2deg)
    }

    39% {
        -webkit-transform: rotateZ(-1deg)
    }

    41% {
        -webkit-transform: rotateZ(1deg)
    }

    43% {
        -webkit-transform: rotateZ(0)
    }

    100% {
        -webkit-transform: rotateZ(0)
    }
}

@-moz-keyframes ring {
    0% {
        -moz-transform: rotate(0)
    }

    1% {
        -moz-transform: rotate(30deg)
    }

    27% {
        -moz-transform: rotate(-12deg)
    }

    31% {
        -moz-transform: rotate(-8deg)
    }

    33% {
        -moz-transform: rotate(6deg)
    }

    35% {
        -moz-transform: rotate(-4deg)
    }

    37% {
        -moz-transform: rotate(2deg)
    }

    39% {
        -moz-transform: rotate(-1deg)
    }

    41% {
        -moz-transform: rotate(1deg)
    }

    43% {
        -moz-transform: rotate(0)
    }

    100% {
        -moz-transform: rotate(0)
    }
}

@keyframes ring {
    0% {
        transform: rotate(0)
    }

    1% {
        transform: rotate(30deg)
    }

    27% {
        transform: rotate(-12deg)
    }

    31% {
        transform: rotate(-8deg)
    }

    33% {
        transform: rotate(6deg)
    }

    35% {
        transform: rotate(-4deg)
    }

    37% {
        transform: rotate(2deg)
    }

    39% {
        transform: rotate(-1deg)
    }

    41% {
        transform: rotate(1deg)
    }

    43% {
        transform: rotate(0)
    }

    100% {
        transform: rotate(0)
    }
}

@media (max-width:1200px){
    .btn-contact-modal img {
        width: 75px;
    }
    
    .text-modal {
        width: 150px;
        padding: 38px 13px 16px 19px;
        height: 104px;
        font-size: 11px;
    }
    
    .btn-contact-modal .inter-pub {
        padding-left: 54px;
    }
}
.loading-screen {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition: opacity 0.8s ease-in-out;
    margin-bottom: 8rem;
}

.particle {
    position: absolute;
    width: 4px;
    height: 4px;
    background: #818cf8;
    border-radius: 50%;
    pointer-events: none;
    opacity: 0;
}

.loading-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2.5rem;
    position: relative;
}

.loader-ring {
    position: relative;
    width: 150px;
    height: 150px;
}

.loader-ring::before,
.loader-ring::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #0d62d2;
    animation: spin 2s linear infinite;
}

.loader-ring::after {
    border: 3px solid transparent;
    border-top-color: #0d62d2;
    animation: spin 1.5s linear infinite reverse;
}

.loader-core {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80px;
    height: 80px;
    background: radial-gradient(circle, #0d62d2 0%, transparent 70%);
    border-radius: 50%;
    animation: pulse 2s ease-in-out infinite;
}

.progress-container {
    width: 240px;
    height: 4px;
    position: relative;
}

.progress-bar {
    width: 100%;
    height: 7px;
    background: rgb(219 231 247);
    border-radius: 4px;
    overflow: hidden;
    position: relative;
}

.progress {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    background: linear-gradient(90deg, #6366f1, #818cf8);
    width: 0%;
    transition: width 0.3s ease-out;
}

.progress-text {
    position: absolute;
    top: -20px;
    right: 0;
    font-size: 12px;
    font-weight: 500;
    opacity: 0.8;
}

.loading-text {
    font-size: 1.2rem;
    font-weight: 500;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    background: linear-gradient(90deg, #6366f1, #818cf8);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: shimmer 2s linear infinite;
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

@keyframes pulse {
    0%, 100% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 0.6;
    }
    50% {
        transform: translate(-50%, -50%) scale(1.2);
        opacity: 0.8;
    }
}

@keyframes shimmer {
    0% {
        background-position: -200% center;
    }
    100% {
        background-position: 200% center;
    }
}

@keyframes particleFloat {
    0% {
        transform: translateY(0) translateX(0);
        opacity: 0;
    }
    50% {
        opacity: 0.8;
    }
    100% {
        transform: translateY(-100px) translateX(var(--translateX));
        opacity: 0;
    }
}
.opt-register-site--alert .info .domain {
    color: #0d62d2;
    line-height: 1.4;
}
.opt-register-site--alert .date-info {
    color: #585858;
    font-size: 14px;
    font-style: italic;
}
.circlePercent {
    position: relative;
    /* top: 26px; */
    /* left: 26px; */
    width: 192px;
    height: 192px;
    border-radius: 50%;
    background: #4183dd;
    margin: 0 auto;
}
.circlePercent:before,
.circlePercent > .progressEnd {
    position: absolute;
    z-index: 3;
    top: 6px;
    left: 95px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: white;
    -ms-transform-origin: 4px 96px;
    transform-origin: 3px 92px;
    content: "";
}
.circlePercent:after,
.circlePercent > .progress {
    position: absolute;
    -ms-transform-origin: 98px 98px;
    transform-origin: 98px 98px;
    z-index: 0;
    top: 0;
    left: 0;
    width: 98px;
    height: 196px;
    border-radius: 98px 0 0 98px;
    background: #4183dd;
    content: "";
}
.circlePercent > .progress:after {
    display: none;
}
.circlePercent.fiftyPlus:after {
    background: white;
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}
.circlePercent > .progress.progress {
    background: white;
}
.circlePercent > .counter {
    position: absolute;
    box-sizing: border-box;
    z-index: 2;
    width: 200px;
    height: 200px;
    margin-top: -2px;
    margin-left: -2px;
    border-radius: 50%;
    border: 8px solid #0d62d2;
}
.circlePercent > .counter:before {
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 0;
    right: 0;
    transform: translateY(-50%);
    width: 100%;
    font-size: 41px;
    font-family: sans-serif;
    text-align: center;
    font-weight: bold;
    color: white;
    content: attr(data-percent)"%";
}
.circlePercent > .counter:after {
    position: absolute;
    width: 168px;
    height: 168px;
    top: 8px;
    left: 8px;
    border-radius: 50%;
    background: #0d62d2;
    content: "";
}
.circlePercent > .counter[data-percent="100"] {
    background: white;
}
.loading-initialization {
    margin-bottom: 5rem;
}
.create-idvn .welcome-4s .btn-pad, .themes-idvn .price {
    display: none;
}