/*
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.   ***************/
.ux-boder-bottom >.col >.col-inner{border-bottom: 1px dashed #ccc; margin-bottom: 10px;}
.ux-boder-bottom >.col >.col-inner h2{    font-size: 36px;color: #333;}
.ux-boder-bottom >.col >.col-inner h2 strong{color: #3ac255;}
.ux-h-blog .is-divider{display: none;}
.ux-h-blog h5 a{font-weight: normal; padding: 10px 0px 20px; color: #111;}
.ux-h-blog p.cat-label{padding: 8px 12px;border-radius: 99px; background: rgb(234 238 242); color: #333; text-transform: none; font-weight: normal;}
.ux-h-blog .post-item .col-inner{border-radius: 10px; overflow: hidden;}
.ux-s-brand{padding-top: 45px!important;}
/*
*
*/
.ux-doimoi h2{color: #111; font-size: 45px;}
.ux-doimoi h2 strong{color: #3ac255;}
/*
* HÀNH TRÌNH
*/
.ux-title-max p{font-size: 90px; color: #3ac255; margin-bottom: 20px; line-height: 1; font-weight: bold;}
.ux-hanhtrinh-col-2 h2{font-size: 40px;}
/*
* CÔNG NGHỆ
*/
.ux-congnghe .tabbed-content{background: rgb(255, 255, 255, 0.7); border-radius: 20px; padding: 60px 45px;}
/*
* FOOTER
*/
.ux-f-connect{padding-top: 45px!important;}
.ux-t-connect h2{margin-bottom: 0px;}
.ux-t-connect h2 a{
    color: #3ac255;
    translate: none;
    rotate: none;
    scale: none;
    transform: translate(0px, 0px);
    clip-path: polygon(0px 0%, 100% 0%, 100% 100%, 0px 100%);
    font-size: clamp(24px, var(--font-size-vw, 14.6vw), 900px);
    line-height: .7;
    white-space: nowrap;
    font-weight: 500;
    margin: 0px;
}
.ux-f-connect{padding-top: 90px!important;}
.ux-footer{padding-top: 45px!important;}
.ux-footer-top{border-top: 1px solid rgb(212 221 230); padding-top: 20px;}
.ux-footer-top .col{padding: 0px!important;}
.absolute-footer{display: none!important;}
/*
*
*/
.marquee-container .gallery-col .col-inner {background: #fff; border-radius: 10px; padding: 20px 10px;}
.marquee-container .gallery-col .col-inner img{margin: 0 auto!important;}
.marquee-container .gallery-col .col-inner .box-text{display: none;}
/* 1. Khung ngoài cùng - Tạo hiệu ứng mờ 2 đầu */
.marquee-container {
    overflow: hidden !important;
    position: relative;
    padding: 0 !important;
    max-width: 1366px !important;
    /* Mask tạo độ mờ */
    -webkit-mask-image: linear-gradient(to right, transparent, black 15%, black 85%, transparent);
    mask-image: linear-gradient(to right, transparent, black 15%, black 85%, transparent);
}

/* 2. Cột chứa nội dung - Trở thành dải chạy ngang */
.marquee-container .marquee-content {
    display: block !important;
    width: max-content !important;
    max-width: none !important;
    animation: flatsomeMarquee 40s linear infinite;
    flex: none !important;
}

/* 3. Row bên trong cùng - Ép các cột gallery nằm trên 1 hàng đơn */
.marquee-container .marquee-content .row {
    display: flex !important;
    flex-wrap: nowrap !important;
    margin: 0 !important;
    width: auto !important;
}

/* 4. Định dạng các ô logo/ảnh */
.marquee-container .gallery-col {
    flex: 0 0 auto !important;
    width: 220px !important; /* Bạn có thể tăng giảm kích thước logo tại đây */
    padding: 10px !important;
}

.marquee-container .gallery-col img {
    width: 100%;
    height: auto;
    object-fit: contain;
}

/* 5. Animation di chuyển */
@keyframes flatsomeMarquee {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%);
    }
}

/* Dừng khi hover */
.marquee-container:hover .marquee-content {
    animation-play-state: paused;
}
@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/


}