/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/

body{
    color: rgb(250, 248, 247);
}
.header-nav  li>a {
    color: #5d5d5d;
    font-weight: 500 !important;
}
.header-nav  li:hover>a {
    color: #0046FF;
}
.header-nav  li.active>a {
    color: #0046FF;
}
.nav>li>a {
    font-size: 16px;
    text-transform: math-auto;
    padding: 0 12px;
}
.text-number-1 {
    width: max-content;
    border: 1px solid #E7E7E7;
    padding: 3px 12px;
    background: #fff;
    color: #333;
    font-weight: 500;
    border-radius: 6px;
}
strong {
    color: #333;
}
h4.title-module {
    color: #333 !important;
}
.item-loi-ich {
    padding: 10px;
    border: 1px solid #eee;
    border-radius: 8px;
}
.list-item-loi-ich .col-inner {
    height: 100%;
}

.list-item-loi-ich .col-inner .box {
    height: 100%;
}
h1.title-home-page {
    font-size: 48px;
    color: #333;
    padding-top: 60px;
}
.tabbed-content .nav>li>a{
    font-size:14px;
    color:#333;
}
h3.title-banner {
    font-size: 48px;
    color: #888888;
    font-weight: 500;
}

p.content-banner {
    color: #707070;
    /* padding: 30px 0; */
    padding-top: 30px;
    padding-bottom: 50px;
}

.demo-free-text {
    width: max-content;
    padding: 10px;
    background: #0046FF;
    border-radius: 6px;
    position: relative;
    z-index: 99999;
    cursor: pointer;
}
.tab.active {
    background: #fff;
    
}
.tab {
    background: #E8E8E8;
    padding: 8px 16px !important;
    border-radius: 6px;
    color: #333333;
    font-weight: 500;
}

.tab-panels {
    color: #333;
}
.text-100 {
    color: #5D5D5D;
}
span.bg-text-bold {
    background: #F6F6F6;
    padding: 5px 8px;
    color: #0046FF;
    border-radius: 6px;
    margin-right: 10px;
}
h3.kham-pha {
    margin: 15px 0;
    font-size: 32px;
    font-weight: 600;
    color: #333 !important;
}
.mt-5 {
    margin-top: 40px;
}
.border-custom {
    border-top: 1px solid #EEEEEE;
    border-bottom: 1px solid #EEEEEE;
    padding: 15px;
}
.border-custom:before {
    content: '';
    width: 40px;
    height: 3px;
    background: #0046FF;
    position: absolute;
    top: 0px;
    left: 50%;
    transform: translateX(-50%);
}
.border-custom:after {
    content: '';
    width: 40px;
    height: 3px;
    background: #0046FF;
    position: absolute;
    bottom: 0px;
    left: 50%;
    transform: translateX(-50%);
}
.custom-flex {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.custom-demo-tinh-nang {background: #0046FF !important;color: #fff !important;margin-top: 15px;}
h4.title-onepro {
    font-size: 24px;
    color:  #333333 !important;
}
.product-custom h4 {
    font-size: 20px;
    color: #333 !important;
}
.ho-tro h4 {
    font-size: 24px;
    color: #333 !important;
}
.custom-row-support {background: #E7EEFF;border-radius: 6px;height: 100%;}

.ho-tro .col-inner {
    height: 100%;
}
strong.testimonial-name.test_name {
    color: #F99D1B;
    width: 100%;
    margin-bottom: 15px;
}

span.testimonial-company.test_company {
    color: #5D5D5D;
}

span.testimonial-name-divider {
    display: none;
}
.testimonial-meta.pt-half {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.button-dung-thu {
    margin: 0;
    color: #333333 !important;
    font-weight: 500;
}
.button-dung-thu:hover {
    background: unset;
    box-shadow: unset;
}
.footer.footer-custom {
    background: #0A0A1A;
}
.follow-footer{
    display:flex;
    flex-wrap: wrap;
}
.follow-footer span {
    color: rgba(24, 38, 77, 1);
    width: 100%;
}

.follow-footer a {
    color: rgba(7, 27, 49, 1) !important;
}
.footer-left .col-inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    height: 100%;
}
.footer-left {
    height: 100%;
}
.title-footer {
    font-size: 24px;
    font-weight: 600;
}
.bg-gradient-custom{
    background:#0A0A1A;
}
p.lien-he a:hover{
    color: rgba(0, 70, 255, 1);
}
p.lien-he a{
    color: rgba(93, 93, 93, 1);
    font-size: 16px;
    font-weight: 500;
}
button.demo a{
    color: #fff;
    font-weight: 500;
}
button.demo:hover {
    color: #333;
    box-shadow: inset 0 0 0 100px rgba(0,0,0,.2);
    background: #fff;
}
button.demo:hover a {
    color: #333;
}
button.demo {
    background: rgba(0, 70, 255, 1);
    border-radius: 6px;
    font-size: 16px;
    font-weight: 600;
    text-transform: math-auto;
    margin: 0;
}

.header-right-custom {
    display: flex;
    justify-content: space-between;
    gap: 30px;
    align-items: center;
}
h5.post-title-custom {
    font-size: 20px;
    color: rgba(51, 51, 51, 1);
    padding: 30px 0;
    text-align: left;
}
p.from_the_blog_excerpt {
    color: rgba(93, 93, 93, 1);
    text-align: left;
}
p.cat-label {
    color: rgba(0, 70, 255, 1);
    font-size: 16px;
    font-weight: 400;
    text-transform: none;
    text-align: left;
}

.post-meta {
    color: rgba(136, 136, 136, 1);
    opacity: 1;
    margin-bottom: -4px;
}
.custom-title-category-in-post {
    display: flex;
    gap: 15px;
    align-items: center;
}
.list-three-post .box-text.text-center {
    padding: 10px 0;
}
.list-three-post h5.post-title-custom{
    font-size:16px;
    padding:10px 0;
    color:rgba(87, 87, 87, 1);
}
.title-list-post {
    font-size: 24px;
    color: rgba(0, 0, 0, 1);
}
.xem-tat-ca {
    font-size: 14px;
    color: rgba(0, 70, 255, 1);
}
.list-post-custom .col-inner {
    box-shadow: none;
}
.list-post-custom  h5.post-title-custom {
    padding:10px 0;
    font-size:16px; 
}
.bg-custom {
    background: linear-gradient(180deg, #090C1F 20.23%, #071A38 100%);
}
.text-contact h1 {
    color: #fff;
    font-size: 32px;
}
.text-contact {
    color: rgba(209, 209, 209, 1);
}
.bg-custom {
    background: linear-gradient(180deg, #090C1F 20.23%, #071A38 100%);
}
.text-contact h1 {
    color: #fff;
    font-size: 32px;
}
.text-contact {
    color: rgba(209, 209, 209, 1);
}
.form-contact {
    background: #fff;
    padding: 30px;
    border-radius: 10px;
}
.custom-submit {
    text-align: center;
}
.custom-submit input{
    margin:0;
}
.custom-submit span {
    display: none;
}
.custom-submit input {
    background: rgba(48, 40, 252, 1);
    border-radius: 6px;
    text-transform: none;
}
.form-contact input, .form-contact select {
    border-radius: 6px;
}
span.text-red {
    color: rgba(240, 68, 56, 1);
}
.banner-category {
    background: rgba(250, 248, 247, 1);
    padding: 100px 0;
}

.banner-category .col {
    padding: 0;
}
.banner-category h1{
    margin-bottom:0;
    font-size:32px;
    color:#333;
}
.content-category {
    margin-top: 50px;
}

.content-category .post-title-custom {
    padding: 15px 0;
}

.content-category .box-text.text-center {
    padding:10px 0;
}

.content-category img {
    border-radius:8px;
}
.page-wrapper{
    padding-bottom: 0;
}
/* style.css (child theme) */
.my-breadcrumbs { font-size: 14px; margin: 10px 0 20px; }
.my-breadcrumbs ol { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; }
.my-breadcrumbs li { position: relative; }
.my-breadcrumbs li:not(:last-child)::after {content: "/";margin: 0 .5rem;opacity: 1;color: #000;}
.my-breadcrumbs a {text-decoration: none;color: #888;}
.my-breadcrumbs .current {opacity: 1;color: #000;}
.date_time_detail {
    font-size: 14px;
    font-weight: 400;
    color: #888;
}
.banner-hompage::before {
    content:'';
    position: absolute;
    top: 55px;
    left: 0;
    width: 100%;
    height: 78px;
    background: url("/wp-content/uploads/2025/09/stroke1.svg") no-repeat;
    background-size: cover;
    pointer-events: none;
}
.banner-hompage::after {
    content:'';
    position: absolute;
    bottom: 55px;
    left: 0;
    width: 100%;
    height: 78px;
    background: url("/wp-content/uploads/2025/09/stroke3.svg") no-repeat;
    background-size: cover;
    pointer-events: none;
    z-index:-1;
}
.section-banner::before {
    content:'';
    position: absolute;
    top: 200px;
    left: 0;
    width: 100%;
    height: 93px;
    background: url("/wp-content/uploads/2025/09/stroke2.svg") no-repeat;
    z-index:10;
}
.banner-hompage{
  position: relative;
  overflow: hidden;
  z-index: 0;
}
.bg-tinh-nang {
    border-radius: 8px;
    background: linear-gradient(101deg, #C6E2FE 0%, #E5F6FF 100%);
    padding: 50px;
}
.border-radius-custom {
    padding: 10px;
    border-radius: 6px;
    border: 1px solid #DBE4FF;
}
.pb-10 {
    padding-bottom: 10px;
}

.border-radius-custom p {
    margin-bottom: 5px;
}
.product-custom {
    padding-top: 70px !important;
}
.ho-tro {
    padding-top: 70px !important;
}
.so-hoa h3 {
    font-size: 32px;
}
.footer-custom-witdget {
    width: 75%;
    margin: auto;
    display: flex;
    color:#B0B0B0;
}
.footer-custom-witdget div#block_widget-3 {
    width: 45%;
}
.footer-custom-witdget div#block_widget-5 {
    width: 35%;
}
.footer-custom-witdget div#block_widget-7 {
    width: 20%;
}

.footer-custom-witdget strong {
    color:#B0B0B0;
}

.footer-custom-witdget .ux-menu-title {
    color:#888;
    text-transform: capitalize;
        font-size: 14px;
}
.footer-custom-witdget span.ux-menu-link__text {
    font-size: 14px;
}
.footer-custom-witdget .social-icons {
    display: flex;
    flex-wrap: wrap;
    color:#888
}
.footer-custom-witdget .social-icons span {
    width: 100%;
    margin-bottom: 15px;
    margin-top: 7px;
}
.footer-custom-witdget a:hover {
    color: #fff !important;
}
.tab:hover {
    background: #0046FF;
}
.tab:hover span {
    color: #fff;
}
.custom-demo-tinh-nang:hover {
    color: #333 !important;
    background: #fff !important;
}
.button-dung-thu:hover {
    color: #fff  !important;
    background: #0046FF !important;
}
.tab-quan-ly::before {
   content:'';
   position:absolute;
   width: 100%;
   height: 50%;
   background: #FAF8F7;
   top: 0;
}
.testimional-banner-yellow {
    border-radius: 12px;
    background: linear-gradient(270deg, #FFF 43.94%, #FFF7E3 100%);
}
.testimional-banner-puple {
    border-radius: 12px;
    background: linear-gradient(270deg, #FFF 43.94%, #E3E7FF 100%);
}
.testimional-banner-white{
    border-radius: 12px;
    background: linear-gradient(270deg, #FFF 43.94%, #FFF7E3 100%);
}

.testimional-banner-puple strong.testimonial-name.test_name {
    color: #0046FF;
}
.content-warehouse li {
    font-size: 14px;
}
.content-warehouse {
    padding-right: 30px;
}
.pb-34 {
    padding-bottom: 34px;
}

.demo-free-text:hover {
    color: #333;
    box-shadow: inset 0 0 0 100px rgba(0, 0, 0, .2);
    background: #fff;
}
.demo-free-text:hover a
{
    color: #333;
}
h1, h2, h3, h4, h5, h6, .heading-font, .banner h1, .banner h2 {
    font-weight: 500 !important;
}
.entry-content {
    color: #333;
}
.type-post h1.entry-title {
    color: #333;
}
.gallary-home-page .box-image img {
    height: 48px;
    object-fit: contain;
}
.doi-tac-img {
    padding-bottom: 0;
}
.img-animate {
  opacity: 0;
  transform: perspective(1200px) translateY(120px) scale(0.8) rotateX(60deg);
  transform-style: preserve-3d;
  backface-visibility: hidden;
  transition: transform 1s cubic-bezier(0.25, 1, 0.5, 1), 
              opacity 1s cubic-bezier(0.25, 1, 0.5, 1);
  will-change: transform, opacity;
}

.img-animate.show {
  opacity: 1;
  transform: perspective(1200px) translateY(0) scale(1) rotateX(0deg);
}
.gallary-home-page, .testimional-list-custom { overflow: hidden; position: relative; }
.gallary-home-page .marquee-track, .testimional-list-custom .marquee-track {
  display: flex; align-items: center; gap: 20px; width: max-content; will-change: transform;
}
 .testimional-list-custom .item-testimional { flex: 0 0 auto; }
.gallary-home-page .gallery-col{
    flex: 0 0 auto;
    width: 20%;
}

@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/
    h1.title-home-page {
        font-size: 30px;
        padding-top: 30px;
    }
    h3.title-banner {
        font-size: 30px;
    }
    p.content-banner {
        padding-bottom: 0px;
    }
    .tabbed-content .nav>li>a {
        font-size: 12px;
    }
    h3.kham-pha {
        font-size: 24px;
    }
    h4.title-onepro {
        font-size: 20px;
    }
    .tabbed-content .nav li{
        width:100%;
        margin-top:10px;
        margin-right:0;
    }
    .header-right-custom {
        flex-wrap: wrap;
    }
    .nav-vertical>li>a, .nav-vertical>li>ul>li a {
    color: rgba(93, 93, 93, 1);
    }
    .social-icons.follow-icons a {
        color: rgba(93, 93, 93, 1);
    }
    .footer-custom-witdget div#block_widget-3 {
        width: 100%;
        margin-bottom: 0;
    }
    .so-hoa h3 {
        font-size: 24px;
    }
    .footer-custom-witdget div#block_widget-5 {
        width: 100%;
        margin-bottom: 0;
    }

    .footer-custom-witdget div#block_widget-7 {
        width: 100%;
    }

    .footer-custom-witdget {
        flex-wrap: wrap;
        width: 100%;
    }

    .footer-custom-witdget div#block_widget-5 section {
        padding: 0;
    }

    .footer-custom-witdget div#block_widget-7 section {
        padding-top: 0;
    }
    .gallary-home-page .gallery-col {
        width: 50%;
    }
}




/* Giảm chuyển động cho người dùng có nhu cầu */
@media (prefers-reduced-motion: reduce) {
  .img-animate {
    transition: none !important;
    transform: none !important;
    opacity: 1 !important;
  }
}