html,
body {
    position: relative;
    height: 100%;
    overflow: hidden;
}

@font-face {
    font-family: 'Averta';
    font-weight: normal;
    font-style: normal;
    src: url(../fonts/Averta-Regular.woff2) format("woff2");
}

@font-face {
    font-family: 'Averta';
    font-weight: bold;
    font-style: normal;
    src: url(../fonts/Averta-Semibold.woff2) format("woff2");
}

body,
h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
h6,
.h6 {
    font-family: "Averta", sans-serif !important;
    font-weight: 600;
    line-height: normal;
}
.section {
    width: 100vw;
    /* height: 100vh; */
}
#lottie {
    background-color: #ffffff;
    width: 100vw;
    height: 100vh;
    display: block;
    overflow: hidden;
    transform: translate3d(0, 0, 0);
    text-align: center;
    opacity: 1;
}
#myHome, .swiper-container, .swiper-wrapper, .swiper-slide {
    /* Ensure full height for all elements */
    /* height: 100vh!important;  */
    height: -webkit-fill-available;
    padding-top: env(safe-area-inset-top);
    padding-bottom: env(safe-area-inset-bottom);
  }
.swiper-slide {

}
html,
body,
.swiper-container,
.swiper-wrapper {
    padding: 0;
    margin: 0;
    width: 100%;
    min-height: 100%;
}

/* basic */
.swiper-container {
    transform: translate3d(0, 0, 0);
    position: relative;
    overflow: hidden;
}

.swiper-container,
.swiper-wrapper {
    padding: 0;
    margin: 0;
    width: 100%;
    height: 100%;
}

.swiper-slide {
    position: relative;
    display: flex;
    flex-shrink: 0;
    justify-content: center;
    width: 100%;
    height: fit-content;
    font-size: 18px;
    align-items: center;
    cursor: grab;
    transition: transform 0.3s ease-out;
    overflow: auto; /* Cho phép cuộn nội dung nếu dài hơn */
}


.swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
}
.swiper-slide .img-icon-impact 
{
    width: unset;
    /* height: 52px; */
}

/* plugin pagination */
.swiper-plugin-pagination {
    display: block;
    position: absolute;
    top: 50%;
    right: 2.2rem;
    width: 0.5rem;
    transform: translateY(-50%);

    &__item {
        display: block;
        margin: 100% 0;
        width: 100%;
        padding-top: 100%;
        height: 0;
        border-radius: 50% !important;
        border: none;
        background: #fff;
        transition: background ease 0.2s;
        cursor: pointer;
    }

    &__item.is-active {
        background: #333;
    }
}

/* image lazyload */
.swiper-lazy {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    transition: all ease 300ms;
}

.swiper-lazy-preloader {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.swiper-lazy-loaded {
    opacity: 1;
}

.swiper-lazy-preloader::after {
    display: block;
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -15px 0 0 -15px;
    width: 30px;
    height: 30px;
    border: 2px solid rgba(0, 0, 0, 0.88);
    border-radius: 50%;
    border-bottom-color: transparent;
    transform-origin: 50%;
    animation: rotate 1s infinite linear;
}

@keyframes rotate {
    0% {
        transform: rotate3d(0, 0, 0, 0);
    }

    100% {
        transform: rotate3d(0, 0, 1, 360deg);
    }
}

.section {
    width: 100vw;
    /* height: 100vh; */
}


.py-40 {
    padding-top: 40px;
    padding-bottom: 40px;
}

.px-40 {
    padding-left: 40px;
    padding-right: 40px;
}

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

.pb-40 {
    padding-bottom: 40px;
}
.pb-48 {
    padding-bottom: 48px;
}

.pe-40 {
    padding-right: 40px;
}

.ps-40 {
    padding-left: 40px;
}

.p-40 {
    padding: 40px;
}

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

.pt-60 {
    padding-top: 60px;
}
.px-60 {
    padding-right: 60px;
    padding-left: 60px;
}

.pt-32 {
    padding-top: 32px;
}
.py-32 {
    padding-top: 32px;
    padding-bottom: 32px;
}
.pb-32 {
    padding-bottom: 32px;
}
.mb-32 {
    margin-bottom: 32px;
}
.ms-32 {
    margin-left: 32px;
}
.mx-60 {
    margin-right: 60px;
    margin-left: 60px;
}

.h-auto {
    height: auto;
}
.dropdown-menu-we[data-bs-popper] {
    top: 100%;
    left: -50% !important;
    margin-top: .125rem;
}

.dropdown-menu-contact[data-bs-popper] {
    top: 100%;
    left: -50% !important;
    margin-top: .125rem;
}

.text-default {
    color: #005CC7 !important;
}
.text-secondary {
    color: #C7ECFD !important;
}
.active-text {
    color: #fff !important;
    font-weight: 600 !important;
}

.text-home {
    -moz-user-select: none !important;
    -webkit-touch-callout: none !important;
    -webkit-user-select: none !important;
    -khtml-user-select: none !important;
    -moz-user-select: none !important;
    -ms-user-select: none !important;
    user-select: none !important;
    text-shadow: 0px 2px 4px rgba(0, 0, 0, 0.15), 0px 4px 12px rgba(0, 0, 0, 0.15);
}

.bg-blue-tep {
    background-color: #005CC7 !important;
    transition: background-color 2s ease;
}

.fw-600 {
    font-weight: 600;
}

.fw-700 {
    font-weight: 700;
}

.fs-20 {
    font-size: clamp(0.875rem, 0.7679rem + 0.5357vw, 1.25rem);
}

.fs-24 {
    font-size: clamp(1rem, 0.4286rem + 1.1905vw, 1.5rem) !important;
}

.fs-32 {
    font-size: clamp(1.25rem, 1.0357rem + 1.0714vw, 2rem) !important;
}
.fs-38 {
    font-size: clamp(1rem, -0.5714rem + 3.2738vw, 2.375rem) !important; 
}

.fs-40 {
    font-size: clamp(1rem, 0.5714rem + 2.1429vw, 2.5rem);
}

.fs-46 {
    font-size: clamp(1.5rem, -0.0714rem + 3.2738vw, 2.875rem) !important;
}

.fs-60 {
    font-size: clamp(1.25rem, 0.5357rem + 3.5714vw, 3.75rem);
}

.fs-68 {
    font-size: clamp(2.25rem, -0.0357rem + 4.7619vw, 4.25rem) !important;
}

.fs-80 {
    font-size: clamp(2.25rem, -0.8929rem + 6.5476vw, 5rem) !important;
    line-height: normal;
}

.fs-90 {
    font-size: clamp(2rem, 0.9643rem + 5.1786vw, 5.625rem) !important;
}

.fs-120 {
    font-size: clamp(2rem, -0.6429rem + 13.2143vw, 11.25rem);
}

.w-40 {
    width: 40%;
}

.w-60 {
    width: 60%;
}

.h-60 {
    height: 60%;
}

.h-40 {
    height: 40%;
}

.navbar-nav {
    flex-direction: unset !important;
}
.item-nav {
    font-weight: 400;
}
.item-nav-ecosystem {
    font-weight: 400;
}
.item-nav-we .active {
    font-weight: 600 !important;
}
.item-nav-we .active-white {
    font-weight: 600 !important;
}
.item-nav-we .active::after {
    content: "";
    float: left;
    background: var(--after-bg-color, #14499e);
    width: 100%;
    height: 2px;
    border-radius: 99px;
    margin-top: 4px;
    /* max-width: 62px; */
    position: absolute;
    bottom: -4px;
    left: 0;
}

.item-nav-we .active-white::after {
    content: "";
    float: left;
    background: #ffffff;
    width: 100%;
    height: 2px;
    border-radius: 99px;
    margin-top: 4px;
    /* max-width: 62px; */
    position: absolute;
    bottom: 4px;
    left: 0;
}

.navbar-custom {
    padding-top: 16px;
    padding-bottom: 16px;
    transition: background-color 1s ease;
}

.content-nav {
    height: 52px;
}

.container-content {
    padding-top: 104px;
    padding-bottom: 80px;
}
.bg-img-team {
    border-radius: 32px;
    width: -webkit-fill-available;
    height: 100%;
    position: absolute;
    top: 0;
    background: linear-gradient(180deg, rgba(0, 150, 217, 0.00) 50%, #0096D9 99.74%);
}

.bg-img-ge-team {
    border-radius: 32px;
    width: -webkit-fill-available;
    height: 100%;
    position: absolute;
    top: 0;
    background: linear-gradient(180deg, rgba(0, 150, 217, 0.00) 50%, #0096D9 99.74%);
}

.bg-img-title-team {
    width: -webkit-fill-available;
    height: 50%;
    position: absolute;
    bottom: 0;
    background: linear-gradient(180deg, rgba(0, 117, 255, 0.00) 66.76%, rgba(0, 117, 255, 0.60) 95.25%);
}

#lottie {
    background-color: #ffffff;
    width: 100vw;
    height: 100vh;
    display: block;
    overflow: hidden;
    transform: translate3d(0, 0, 0);
    text-align: center;
    opacity: 1;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

@keyframes foot {
    0% {
        bottom: 0;
        top: 100vh;
    }

    100% {
        bottom: 0;
        top: 33.333333vh;
    }
}

@keyframes footdiv {
    0% {
        left: -100vw;
    }

    100% {
        left: 0;
    }
}

body {
    margin: 0;
    padding: 0;
    position: relative;
    overflow: hidden;
    font-family: sans-serif;
}

.hero {
    top: 0;
    height: 100vh;
    background-color: transparent;
    background-attachment: fixed;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    opacity: 0;
    transition: opacity 1s ease-in-out;
}

.hero.active {
    opacity: 1;
}

#contentSlide .show {
    opacity: 1 !important;
    transition: opacity 1s ease-in;
}

#contentSlide .no-active {
    opacity: 0 !important;
    transition: opacity 1s ease-in-out;
}

#contentSlideTeam .no-active {
    opacity: 0 !important;
    transition: opacity 1s ease-in-out;
}

#contentSlideTeam .show {
    opacity: 1 !important;
    transition: opacity 1s ease-in;
}

#contentSlideMarket .no-active {
    opacity: 0 !important;
    transition: opacity 1s ease-in-out;
}

#contentSlideMarket .show {
    opacity: 1 !important;
    transition: opacity 1s ease-in;
}

#contentSlideImpact .no-active {
    opacity: 0 !important;
    transition: opacity 1s ease-in-out;
}

#contentSlideImpact .show {
    opacity: 1 !important;
    transition: opacity 1s ease-in;
}

.content {
    height: -webkit-fill-available;
}

#slider,
#solution,
#market,
#vision,
#growth,
#impact,
#target,
#sliderTeam,
#partner,
#prize,
#problem {
    overflow-x: hidden;
    overflow-y: auto;
    height: 100vh;
}

/* canvas {
    z-index: 1070 !important;
} */
.hero h1 {
    text-align: center;
}

.hero a {
    color: #333;
    text-decoration: none;
    outline: none;
}

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

.card {
    height: 100%;
    max-width: 200px;
    border-radius: 20px;
    display: flex;
    /* justify-content: center; */
    padding: 12px;
    align-items: center;
    border: 4px solid #005CC7;
}

.card:hover {
    background-color: #56CBFF !important;
}

.card:hover .text-content-card {
    color: #fff !important;
}

.btn-next:hover {
    background-color: #56CBFF !important;
    color: #fff !important;
}

.btn-next-page {
    bottom: 16px;
    z-index: 1700;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    text-align: center;
    cursor: pointer;
}

.card:hover .img-card {
    display: none;
}

.card:hover .img-card-active {
    display: flex !important;
}

.card .img-card {
    display: flex;
    max-width: 75px;
    height: 100%;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    /* margin-bottom: 12px; */
}

.text-content-card {
    text-shadow: 0px 0px 40px rgba(0, 0, 0, 0.15);
}
.img-vision {
    border-radius: 100%;
    box-shadow: 24px 44px 60px 0px rgba(0, 9, 54, 0.21);
}
.img-mission {
    border-radius: 100%;
    box-shadow: 24px 44px 60px 0px rgba(0, 9, 54, 0.21);
}
.card-vision:hover .img-vision {
    display: none;
}

.card-vision:hover .img-vision-blue {
    display: flex !important;
}

.card-mission:hover .img-mission {
    display: none;
}

.card-mission:hover .img-mission-blue {
    display: flex !important;
}

.card-text {
    background-size: cover;
    border-radius: 8px;
    z-index: 9999;
}
.card-text-active {
    z-index: 9999;
}

.bg-growth {
    background-image: url(../../dist/assets/img/bg-map.png);
}

.content-vison-1 {
    background-image: url(https://imagedelivery.net/5HDeqrse-hcKETywM4bnHw/4e31b7b0-8c96-4b75-f864-67b26f68ef00/2k);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.carousel-content {
    display: grid;
    position: absolute;
    top: 47%;
    right: 40px;
}

.card-img-problem:hover {
    border-radius: 12px;
    background-color: #56CBFF;
}

.card-img-problem:hover p {
    color: #fff !important;
}

.content-img-problem {
    background-image: url(../../dist/assets/img/bg_van_de.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.card-content-solution::-webkit-scrollbar {
    /* width: 10px !important;
	background: #005CC7;
    cursor: default; */
    display: none !important;
}
/* .card-content-solution::-webkit-scrollbar-track {
    background-color: #385dc0 !important;
    margin-top: 25vh !important;
    margin-bottom: 25vh !important;
}
.card-content-solution::-webkit-scrollbar-thumb {
    border-radius: 15px;
    height: 8px;
	background: radial-gradient(circle farthest-corner, #56CBFF 0%, #56CBFF 100%, transparent 100%, transparent 100%) no-repeat;
    cursor: default;
}

.card-content-solution::-webkit-scrollbar-track-piece {
    background-color: #C7ECFD;
    border-radius: 15px;
    width: 100px; 
} */

.scroll-dots {
    display: flex;
    flex-direction: column; /* Adjust to `row` for horizontal */
    position: absolute;
    align-items: center;
    top: 50%;
    right: 0.5rem; /* Adjust as needed */
    transform: translateY(-50%);
    gap: 25px;
}

.dot {
    width: 10px;
    height: 10px;
    background-color: #ccc;
    border-radius: 50%;
    opacity: 0.5;
    transition: opacity 0.3s, background-color 0.3s;
}
.dot.active {
    background-color: #FFFFFF; /* Active dot color */
    opacity: 1;
    width: 15px !important;
    height: 15px !important;
}

.title-problem {
    padding: 20px 80px;
    border-radius: 12px;
    background: #FFF;
    margin-top: -57px;
    margin-bottom: 25px;
}

.item-solution {
    border-top: 3px solid #AFC6FF;
}

.dropdown-about::after {
    display: none !important;
}

.dropdown-language::before {
    display: none !important;
}

.img-fluid {
    height: -webkit-fill-available;
}

.img-content {
    border-top-right-radius: 12px;
    border-top-left-radius: 12px;
    border-bottom-left-radius: 12px;
}

.text-content {
    border-top-right-radius: 12px;
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
}

.text-decription {
}

.text-decription-5 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
}

.list-item-wrapper {
    cursor: pointer;
}

.list-item-wrapper .active img {
    content: url(../../dist/assets/icon/active_point.svg);
}

.card-text-target {
    display: flex;
    padding: 24px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    align-self: stretch;
    border-radius: 12px;
    background: #C7ECFD;
    box-shadow: 24px 44px 60px 0px rgba(8, 147, 225, 0.15);
}

.map-lottie {
    width: 100%;
    max-width: 1440px;
    float: right;
    margin-right: 50px;
    height: 100%;
}
.shawdow-home-nav {
    background: linear-gradient(0deg, rgba(38, 53, 98, 0.00) 0%, rgba(38, 53, 98, 0.30) 52.5%, rgba(38, 53, 98, 0.70) 100%);
}
.shawdow-home-footer {
    background: linear-gradient(0deg, rgba(38, 53, 98, 0.70) 0%, rgba(38, 53, 98, 0.30) 47.5%, rgba(38, 53, 98, 0.00) 100%);
}
.footer {
    width: 100%;
    display: flex;
    height: 80px;
    /* padding: 0px 100px 0px 100px; */
    justify-content: space-between;
    align-items: flex-end;
    position: absolute;
    bottom: 0px;
}


.foot p {
    color: #eee;
    text-align: justify;
    padding: 0 50px;
    font-size: 2vh;
    max-width: 25vw;
}

.foot a {
    display: block;
    width: auto;
    color: #eee;
    text-decoration: none;
    font-size: 3vh;
    padding: 1.1vh 2vw 1vh 2vw;
    text-transform: uppercase;
    border: 2px solid #eee;
    outline: none;
}

.foot a:hover,
.foot a:focus {
    color: #333;
    background-color: #eee;
}

.foot {
    position: relative;
    background-color: #333;
    width: 100vw;
    height: 66.666667vh;
    top: 100vh;
    bottom: 0;
    animation: foot;
    animation-duration: 1s;
    animation-delay: 2s;
    animation-fill-mode: forwards;
    z-index: 2;
}

.foot div {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 100vw;
    height: 100%;
    left: -100vw;
    animation: footdiv;
    animation-duration: 1s;
    animation-delay: 3s;
    animation-fill-mode: forwards;
}

.animate__animated {
    -webkit-animation-fill-mode: none !important;
    animation-fill-mode: none !important
}

.section {
    color: #fff;
    /* text-align: center; */
}

/* Overwriting styles for the navigation dots */
#fp-nav ul li a span,
.fp-slidesNav ul li a span {
    background: white;
}

/* Backgrounds colors for sections */
.fp-section:nth-child(1) {
    background-image: linear-gradient(128deg, #40afff, #3f61ff);
}

.fp-section:nth-child(2) {
    background-image: linear-gradient(128deg, #ff9a3f, #ff4b40);
}

.fp-section:nth-child(3) {
    background-image: linear-gradient(128deg, #fc40ff, #543fff);
}

.fp-overflow {
    width: 100vw;
    height: 100vh;
}
.vertical-line {
    width: 1px;
    /* Độ rộng của đường kẻ */
    background-color: #fff;
    /* Màu của đường kẻ */
    margin-top: 60px;
    margin-bottom: 60px;
}
.item-vi {
    display: flex;
}
.item-en {
    display: flex;
}
.carousel-indicators {
    right: 20px;
    display: grid;
    padding: 0;
    margin-right: 0;
    margin-left: 0;
    justify-content: end;
    align-items: center;
    left: unset !important;
    width: fit-content !important;
}

.full-page {
    width: 100vw;
    height: 100vh;
    background-size: cover;
    background-position: center;
}

.carousel-control-next,
.carousel-control-prev {
    width: 8% !important;
}

.carousel-item.active,
.carousel-item-left,
.carousel-item-right {
    display: flex !important;
    justify-content: center;
    align-items: center;
}

.carousel-item h1 {
    color: #fff;
    font-size: 72px;
    /* padding: 0 10%; */
}

.item-indicators {
    box-sizing: content-box;
    flex: 0 1 auto;
    width: unset;
    height: unset;
    padding: unset;
    margin-right: unset;
    margin-left: unset;
    text-indent: unset;
    cursor: pointer;
    background-color: transparent;
    background-clip: unset;
    border: 0;
    border-top: unset;
    border-bottom: unset;
    opacity: unset;
    transition: unset;
}

.content-indicators-blue .active img {
    content: url(../../dist/assets/icon/ellipse-blue-active.svg);
}

.content-indicators-white .active img {
    content: url(../../dist/assets/icon/ellipse-white-active.svg);
} 

.item-people {
    width: 20%;
    /* min-height: 354px; */
}

.item-people-active {
    width: 60%;
    -webkit-transition: width 0.3s ease-in-out;
    -moz-transition: width 0.3s ease-in-out;
    -o-transition: width 0.3s ease-in-out;
    transition: width 0.3s ease-in-out;

    .card-text-active {
        display: flex;
    }

    .card-text {
        display: none;
    }
}

.item-people-no-active {
    width: 20% !important;
    -webkit-transition: width 0.3s ease-in-out;
    -moz-transition: width 0.3s ease-in-out;
    -o-transition: width 0.3s ease-in-out;
    transition: width 0.3s ease-in-out;

    .card-text-active {
        display: none;
    }

    .card-text {
        display: flex;
    }
}

.content-people {
    background-image: url(../../dist/assets/img/image_default.png);
    background-size: cover;
    background-position: top;
    background-repeat: no-repeat;
    border-radius: 32px;
    height: 100%;
}


.bg-img {
    background: linear-gradient(180deg, rgba(0, 99, 215, 0.00) 50%, #0063D7 91.07%), url(<path-to-image>) lightgray 50% / cover no-repeat, #DBF3FE;
}

/* .img-content-prize {
    -ms-overflow-style: none;
    scrollbar-width: none;
} */

/* .img-content-prize::-webkit-scrollbar {
    display: none;
} */

.menu-text-impact {
    /* list-style: url(../../dist/assets/icon/icon-check.svg); */
    list-style: none;
}

.item-icon-parnet:hover .icon-no-color {
    display: none !important;
}

.item-icon-parnet:hover .icon-color {
    display: block !important;
}

#lottieProblem svg {
    max-height: 100% !important;
    height: auto !important;
}

#lottieProblemVN svg {
    max-height: 100% !important;
    height: auto !important;
}

.shawdow-icon {
    box-shadow: 24px 44px 60px 0px rgba(0, 9, 54, 0.21);
}

.moduleBlock {
    padding-top: env(safe-area-inset-top);
    padding-bottom: env(safe-area-inset-bottom);
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
}
.gap-40 {
    gap: 40px;
}
.card-content-slide {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
@media screen and (max-width: 420px) {
    .img-logo {
        width: 82px !important;
    }

    .text-nav {
        font-size: 14px !important;
    }
}

/* responesive */
@media screen and (max-width: 767px) {
    #solution,
    #vision,
    #market,
    #growth,
    #impact,
    #target,
    #prize {
        height: -webkit-fill-available !important;
        /* height: 100vh; */
        min-height: 100vh !important;
        min-height: -webkit-fill-available !important;
    }
    .padding-env {
        padding-top: env(safe-area-inset-top);
        padding-bottom: env(safe-area-inset-bottom);
    }
    .gap-40 {
        gap: 40px !important;
    }

    .img-logo {
        width: 100px;
    }

    .container-content {
        padding-top: 88px !important;
        padding-bottom: 32px !important;
        padding-left: 2rem !important;
        padding-right: 2rem !important;
    }
    /* .container-market {
        
    } */
    .container-content-slide-team {
        /* padding-bottom: 156px !important; */
    }

    .navbar-custom {
        padding-top: 12px !important;
        padding-bottom: 12px !important;
        box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.10);
    }

    .content-nav {
        height: 40px !important;
    }

    .img-mission {
        width: 100px !important;
        height: 100px !important;
    }

    .img-vision {
        width: 100px !important;
        height: 100px !important;
    }

    .text-title-vision {
        height: 50%;
    }

    .bt-scroll-next {
        bottom: 10px;
        z-index: 1700;
        margin-left: auto;
        margin-right: auto;
        left: 0;
        right: 0;
    }

    .card .img-card {
        width: 48px !important;
        height: 48px !important;
    }

    .text-content {
        border-radius: 12px !important;
    }

    .item-people {
        min-height: 354px;
    }

    .carousel-indicators {
        bottom: 100px;
        right: 4px !important;
    }

    .content-vison-1 {
        height: 40vh !important;
    }

    .content-vison-2 {
        height: 60vh !important;
    }

    .text-title-vision {
        height: 40%;
    }

    .map-lottie { 
        float: unset !important;
    }

    .content-animation-problem {
        max-width: unset !important;
        overflow: unset !important;
        width: unset !important;
    }
    #lottieProblem svg {
        transform: rotate(90deg) !important;
        height: 100vw !important;
        width: auto !important;
        max-width: calc(100vh - 88px - 90px) !important;
    }
    #lottieProblemVN svg {
        transform: rotate(90deg) !important;
        height: 100vw !important;
        width: auto !important;
        max-width: calc(100vh - 88px - 90px) !important;
    }
    .container-animation-problem {
        z-index: 9999;
        background-color: #ffffff;
        height: -webkit-fill-available !important;
    }
    .scroll-btn {
        display: none;
    }
    .text-decription-market {
        font-size: 20px !important;
    }
    .img-icon-impact {
        width: 52px !important;
        height: 52px !important;
    }
    .item-solution {
        border-top: 1px solid #AFC6FF !important;
    }
    .content-map {
        padding-bottom: 40px !important;
    }
    .text-title-36 {
        font-size: 36px !important;
    }
    .text-title-26 {
        font-size: 26px !important;
    }
    .text-decription-24 {
         font-size: 24px !important;
    }
    .text-decription-16 {
        font-size: 16px !important;
    }
    .text-decription-14 {
        font-size: 14px !important;
    }
    .text-decription-12 {
        font-size: 12px !important;
    }
    .ms-12 {
        margin-left: 12px !important;
    }
    .rouder-22 {
        border-radius: 22px !important;
    }
    .px-06 {
        padding-left: 6px !important;
        padding-right: 6px !important;
    }
    .mx-06 {
        margin-left: 6px !important;
        margin-right: 6px !important;
    }
    .content-growth-year {
        gap: 24px !important;
    }
    .list-wrapper-year {
        min-width: 67px;
    }
    .red-line {
        height: 96% !important;
    }
    .img-content-market {
        width: 52px !important;
    }
}
@media screen and (min-width: 768px ) and (max-width: 992px){
    .card-col-solution {
        max-height: 140px;
    }
    .card .img-card {
        max-height: 52px !important;
    }
    .text-title-vision {
        height: 50%;
        width: 100%;
        max-width: 474px !important;
    }
    .content-title-vision {
        height: 50%;
        max-width: 474px !important;
    }
    .gap-xl-40 {
        gap: 40px !important;
    }
    .img-icon-impact {
        width: 68px;
    }
    .container-landmark {
        max-width: 540px !important;
    }
    .fs-md-52 {
        font-size: 52px !important;
    }
}
@media screen and (min-width: 768px) {
    .carousel-indicators {
        bottom: 45%;
    }
    .h-md-100 {
        height: 100% !important;
    }

    .h-md-60 {
        height: 60% !important;
    }
    .h-md-50 {
        height: 50% !important;
    }
    .h-md-33 {
        height: 33% !important;
    }

    .h-md-30 {
        height: 30% !important;
    }
    .h-md-70 {
        height: 70% !important;
    }
    .mh-md-50 {
        max-height: 50% !important;
    }
    .w-md-auto {
        width: auto !important;
    }
    .h-md-auto {
        height: auto !important;
    }
    .p-md-32 {
        padding: 32px !important;
    }
    .pb-md-60 {
        padding-bottom: 60px !important;
    }

    .w-md-50 {
        width: 50% !important;
    }

    .gap-md-60 {
        gap: 60px !important;
    }

    .gap-md-40 {
        gap: 40px !important;
    }

    .h-md-40 {
        height: 40% !important;
    }

    .p-md-40 {
        padding: 40px !important;
    }

    .pb-md-40 {
        padding-bottom: 40px !important;
    }

    .pt-md-60 {
        padding-top: 60px !important;
    }

    .ms-md-40 {
        margin-left: 40px !important;
    }

    .py-md-60 {
        padding-top: 60px !important;
        padding-bottom: 60px !important;
    }

    .w-md-50 {
        width: 50% !important;
    }

    .w-md-60 {
        width: 60% !important;
    }

    .w-md-40 {
        width: 40% !important;
    }

    .position-md-absolute {
        position: absolute !important;
    }

    .full-md-page {
        width: 100vw;
        height: 100vh;
    }

    .ps-md-40 {
        padding-left: 40px !important;
    }

    .pe-md-40 {
        padding-right: 40px !important;
    }

    .card-text-market:hover {
        background-color: #56CBFF;
    }

    .card-text-market-1:hover {
        border-bottom-left-radius: 12px;
    }

    /* .card-text-vn {
        border-left: 1px solid #ffffff;
    } */

    .card-text-market:hover p {
        color: #005CC7 !important;
    }

    .card-content-growth {
        position: absolute;
    }

    .img-mission {
        width: 100px !important;
        height: 100px !important;
    }

    .img-vision {
        width: 100px !important;
        height: 100px !important;
    }

    .content-title-team {
        height: calc(60vh - 104px);
    }

    .content-team-img {
        height: calc(40vh - 100px);
    }

    .content-img-prize {
        height: calc(30vh - 100px);
    }

    .content-prize {
        height: calc(50vh - 104px);
    }
    .img-content-market {
        width: 52px !important;
        height: 52px !important;
    }

    .moduleBlock::-webkit-scrollbar {
        display: none;
    }

    .moduleBlock {
        -ms-overflow-style: none;
        scrollbar-width: none;
    }
    .container-md-content {
        padding-top: 108px;
        padding-bottom: 100px;
    }
    .scroll-btn {
        display: flex;
    }
    .ms-md-32 {
        margin-left: 32px !important;
    }
    .list-wrapper-year {
        min-width: 97px;
    }
} 

@media screen and (min-width: 992px) {
    .w-xl-50 {
        width: 50% !important;
    }
    .h-xl-100 {
        height: 100% !important;
    }
    .d-xl-flex {
        display: flex !important;
    }
    .ms-xl-40 {
        margin-left: 40px !important;
    }
    .h-xl-70 {
        height: 70% !important;
    }
    .red-line {
        height: 94% !important;
    }
    .content-growth {
        height: calc(70vh - 104px - 80px);
    }
}

@media screen and (min-width: 1200px) {
    .mb-2r {
        margin-bottom: 2rem !important;
    }
    .px-lg-40 {
        padding: 40px !important;
    }
    .h-lg-60 {
        height: 60% !important;
    }
    .h-lg-40 {
        height: 40% !important;
    }
    .p-lg-40 {
        padding: 40px !important;
    }
    .pt-lg-60 {
        padding-top: 60px !important;
    }
    .w-lg-auto {
        width: auto !important;
    }
    .h-lg-100 {
        height: 100% !important;
    }

    /* .item-people {
        min-height: 354px;
    } */
    .p-lg-40 {
        padding: 40px !important;
    }

    .pb-lg-40 {
        padding-bottom: 40px !important;
    }

    .pt-lg-40 {
        padding-top: 40px !important;
    }

    .pt-lg-60 {
        padding-top: 60px !important;
    }
    .pb-lg-60 {
        padding-bottom: 60px !important;
    }
    .gap-lg-60 {
        gap: 60px !important;
    }
    .img-mission {
        width: 160px !important;
        height: 160px !important;
    }

    .img-vision {
        width: 160px !important;
        height: 160px !important;
    }

    .w-lg-40 {
        width: 40% !important;
    }
    .content-solution {
        height: unset !important;
    }
    .red-line {
        height: 95% !important;
    }
}

@media screen and (min-width: 1400px) {
    .pb-xxl-40 {
        padding-bottom: 40px !important;
    }

    .text-title-market {
        font-size: 80px !important;
    }

    .text-decription-market {
        font-size: 28px !important;
    }

    .text-decription {
        font-size: 20px !important;
    }

    .img-content-market {
        width: 52px !important;
    }
}

@media (orientation:portrait) {
    .content-mobile {
        display: block !important;
    }

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

@media (orientation:landscape) {
    .content-mobile {
        display: none !important;
    }

    .content-animation {
        display: flex !important;
    }
}

.red-line {
    background: #C7ECFD;
    z-index: 1;
    width: 2px;
    height: 95%;
    position: absolute;
    left: 13px;
}

.white-line {
    background: #FFF;
    z-index: -1;
    top: 0px;
    width: 1px;
    height: 100%;
    position: absolute;
    left: 15px;
}

.slideRiple {
    top: 0;
    height: 100vh;
    background-color: transparent;
    background-attachment: fixed;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    opacity: 0;
    transition: opacity 1s ease-in-out;
}

.slideRiple.active {
    opacity: 1;
}

.slideRiple h1 {
    text-align: center;
}

.slideRiple a {
    color: #333;
    text-decoration: none;
    outline: none;
}
.swiper2-partner,
.swiper-partner,
.swiper-team,
.swiper-slide-prize {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    list-style: none;
    padding: 0;
    z-index: 1;
    display: block;
}

.swiper-slide-partner {
    height: 100% !important;
}
.card-next-slide {
    position: absolute;
    bottom: 35px;
    right: 5px;
    z-index: 1700;
}
.item-slide-blue,
.item-slide-white {
    display: grid;
}
.icon-partner {
    max-height: 152px !important;
    max-width: 152px !important;
}

.noselect {
    -webkit-touch-callout: none; /* iOS Safari */
      -webkit-user-select: none; /* Safari */
       -khtml-user-select: none; /* Konqueror HTML */
         -moz-user-select: none; /* Old versions of Firefox */
          -ms-user-select: none; /* Internet Explorer/Edge */
              user-select: none; /* Non-prefixed version, currently
                                    supported by Chrome, Edge, Opera and Firefox */
}
.dropdown-toggle-md::before {
    display: none !important;
} 

.scrollbar::-webkit-scrollbar {
    height: 10px !important;
	background: #385dc0;
    cursor: default;
}
.scrollbar::-webkit-scrollbar-track {
    background-color: #005CC7 !important;
}
.scrollbar::-webkit-scrollbar-thumb {   
    /* background-image: url(../../dist/assets/icon/arrow-right.svg);*/
    border-radius: 15px;
    height: 8px;
	background: radial-gradient(circle farthest-corner, #c1c1c1 0%, #c1c1c1 100%, transparent 100%, transparent 100%) no-repeat;
    cursor: default;
}

.scrollbar::-webkit-scrollbar-track-piece {
    background-color: #C7ECFD;
    border-radius: 15px;
    /* width: 100px; */
}
.scrollbar::-webkit-scrollbar-track-piece:end {
    margin-right: 42vw; 
  }
  
  .scrollbar::-webkit-scrollbar-track-piece:start {
    margin-left: 42vw; 
  }