.list-slider .arrow-wrapper svg {
    color: white;
  }
  .grey-color {
    color: #acacac !important;
  }
  .none {
    display: none !important;
  }
  #main-content {
    margin-top: 32px;
    z-index: 2;
  }
  
  #main-content.homepage {
    background-color: #0e281d;
    /* display: flex; */
    justify-content: center;
    align-items: center;
    flex-direction: column;
  }
  .color {
    background-color: #f2f2f2 !important;
    color: #0d281e !important;
  }
  .format-month,
  .format-year {
    width: 28px;
    height: 28px;
    /* border: 1.5px solid #0B4628; */
    border: none;
    border-radius: 12px;
    font-weight: 600;
    font-size: 13px;
    line-height: 15px;
    text-align: center;
    background-color: #0b4628;
    color: #f2f2f2;
  }
  
  #current-date-format-month:focus,
  #current-date-format-year:focus {
    border: 1.5px solid #027536 !important;
    outline: none;
  }
  #current-date-format-year {
    width: 38px !important;
  }
  
  .second-type {
    background: #f2f2f2 !important;
    color: #0d281e !important;
    border: 1.5px solid rgb(242, 242, 242) !important;
  }
  
  .close-button-wrapper {
    position: fixed;
    width: 32px;
    z-index: 202;
    right: 0;
    top: 64px;
    transition: 0.8s;
  }
  
  .close-button-wrapper a {
    display: none;
  }
  
  .green-divine {
    color: #00642d;
  }
  
  .change-theme .gray-bg .item-info .name {
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 600;
    font-size: 13px;
    line-height: 15px !important;
    letter-spacing: 0.02em;
    color: #0d281e !important;
  }
  .project-banner-lottie {
    /* transform: scaleX(-1); */
  }
  .gray-bg .item-info .description {
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 400 !important;
    font-size: 13px !important;
    line-height: 15px;
    letter-spacing: 0.02em;
    color: #acacac !important;
  }
  
  .arrow-wrapper {
    cursor: pointer;
  }
  
  .discussion-post-content,
  .product-post-content,
  .prosel-post-content {
    cursor: pointer;
  }
  
  .contact-button {
    display: flex;
    flex-direction: row;
    align-items: center;
    position: fixed;
    gap: 12px;
    right: 24px;
    bottom: 24px;
    z-index: 202;
    transition: 1s;
  }
  
  .buy-now-button {
    width: fit-content;
    cursor: pointer;
    padding: 8px 16px;
    border: 1.5px solid #f7541c;
    border-radius: 24px;
    background-color: inherit;
  }
  
  .buy-now-button a {
    text-decoration: none;
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
    line-height: 24px;
    color: #f7541c;
  }
  
  .actions .action a {
    display: flex;
    flex-direction: row;
  }
  .actions .action .name {
    padding-right: 5px;
    border-right: 1.5px solid #f2f2f2;
  }
  .actions .action .phone {
    padding-left: 5px;
  }
  .img-button:hover {
    transform: scale(1.15);
    transition: 0.3s;
    cursor: pointer;
  }
  
  .img-button-3:hover {
    width: 95px;
    height: 54px;
    transition: 0.3s;
    cursor: pointer;
  }
  .img-button {
    cursor: pointer;
    width: 44px;
    height: 44px;
    transition: 0.3s;
  }
  
  /* #scrollDown-2 .img-button{
    cursor: pointer;
    width: 44px;
    height: 44px;;
  } */
  
  /* .remove-scrollup {
    display: none;
  
  } */
  
  .img-button-2-wrapper {
    position: relative;
  }
  
  .img-button-2 {
    cursor: pointer;
    transition: 0.3s;
    padding: 8px 12px;
    border-radius: 24px;
    border: 1.5px #f7541c solid;
    width: 110px;
    overflow: hidden;
  }
  
  .img-button-2 .active-wrapper {
    position: absolute;
    top: 14px;
    right: 14px;
    opacity: 0;
    z-index: -1;
    transition: 0.2s;
  }
  
  .img-button-2.active .active-wrapper {
    opacity: 1;
    z-index: 1;
    transition: 0.5s;
  }
  
  .img-button-2 .unactive-wrapper {
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    width: 90px;
  }
  
  .img-button-2.active .unactive-wrapper::before {
    /* background-image: */
  }
  
  .img-button-2.active {
    width: 44px;
    transition: 0.3s;
  }
  
  .img-button-2.active .unactive-wrapper {
    opacity: 0;
    z-index: -1;
    transition: 0.5s;
  }
  
  .img-button-2-wrapper .suggest-contact-list {
    position: absolute;
    bottom: 120%;
    width: 214px;
    right: 0;
  
    font-size: 13px;
    font-weight: 400;
    line-height: 15px;
    letter-spacing: 0.02em;
  }
  
  .img-button-2-wrapper .suggest-contact-list .chip {
    padding: 8px 12px;
    border-radius: 24px;
    color: #f2f2f2;
    margin: 6px 0;
    background-color: #f7541c;
    height: 40px;
    display: flex;
    align-items: center;
  }
  
  .img-button-2-wrapper .suggest-contact-list .small-chip-wrapper {
    display: flex;
    justify-content: space-between;
  }
  
  .img-button-2-wrapper .suggest-contact-list .small-chip {
    padding: 8px 12px;
    border-radius: 24px;
    color: #f2f2f2;
    background-color: #f7541c;
    display: flex;
    width: fit-content;
    max-height: 40px;
    max-width: 120px;
    align-items: center;
    justify-content: center;
  }
  
  .img-button-2-wrapper .suggest-contact-list .small-chip a {
    display: flex;
    flex-direction: row;
  }
  
  .img-button-2-wrapper .suggest-contact-list .small-chip a p {
    display: flex;
    align-items: center;
  }
  
  .img-button-2-wrapper:hover .img-button-2 {
    background-color: #f7541c;
    transition: 0.3s;
  }
  
  .img-button-2.active {
    background-color: #f7541c;
  
    transition: 0.3s;
  }
  
  .img-button-2.active svg path {
    stroke: #f2f2f2 !important;
    transition: 0.3s;
  }
  
  .img-button-2-wrapper:hover svg path {
    stroke: #f2f2f2 !important;
    transition: 0.3s;
  }
  
  .img-button-2-wrapper:hover span {
    color: #f2f2f2 !important;
    transition: 0.3s;
  }
  
  .img-button-3 {
    width: 85px;
    height: 44px;
    transition: 0.3s;
  }
  .contact-button-mobile {
    display: none;
    transition: 0.3s;
  }
  
  .contact-button-mobile .suggest-contact-list {
    position: absolute;
    bottom: 112px;
    width: 214px;
    right: -1px;
  
    font-size: 13px;
    font-weight: 400;
    line-height: 15px;
    letter-spacing: 0.02em;
  }
  
  .contact-button-mobile .suggest-contact-list .chip {
    padding: 8px 12px;
    border-radius: 24px;
    color: #f2f2f2;
    margin: 6px 0;
    background-color: #f7541c;
    height: 40px;
    display: flex;
    align-items: center;
  }
  
  .contact-button-mobile .suggest-contact-list .small-chip-wrapper {
    display: flex;
    justify-content: space-between;
  }
  
  .contact-button-mobile .suggest-contact-list .small-chip {
    padding: 22px 12px;
    border-radius: 24px;
    color: #f2f2f2;
    background-color: #f7541c;
    display: flex;
    width: fit-content;
    max-height: 40px;
    max-width: 120px;
    align-items: center;
    justify-content: center;
  }
  
  .contact-button-mobile .suggest-contact-list .small-chip a {
    display: flex;
    flex-direction: row;
  }
  
  .contact-button-mobile .suggest-contact-list .small-chip a p {
    display: flex;
    align-items: center;
  }
  
  .contact-button-mobile .active-wrapper {
    display: none;
    position: absolute;
    top: 56px;
    right: 0px;
    width: 44px;
    background-color: #f7541c;
    height: 44px;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
  }
  
  .contact-button-mobile .active-wrapper.active {
    display: flex;
  }
  
  #current-date-format-day {
    width: 28px;
    height: 28px;
    /* border: 1.5px solid #0B4628; */
    border: none;
    border-radius: 12px;
    font-weight: 600;
    font-size: 13px;
    line-height: 15px;
    text-align: center;
    background-color: #0b4628;
    color: #f2f2f2;
  }
  
  #current-date-format-day:focus {
    border: 1.5px solid #027536 !important;
    outline: none;
  }
  
  #lottie-preload-red.load {
    background: #f7541c;
    top: 0;
    aspect-ratio: 1;
    left: calc((-100vw + 100%) / 2);
    width: 100vw;
    height: 100vw;
    z-index: 130;
    transition: 1s;
    transform: scale(2);
  }
  
  #lottie-preload-red {
    background: #f7541c;
    position: absolute;
    aspect-ratio: 1;
    top: 200px;
    left: 50px;
    right: 0;
    width: 85.5%;
    z-index: 110;
    transition: 1s;
    border-radius: 50%;
    margin-top: -12%;
  }
  
  #lottie-preload-red.mobile {
    width: 100%;
    height: 100vh;
    z-index: 130;
    transition: 1.2s cubic-bezier(0.24, 0, 0.19, 0.82);
    border-radius: 0;
    top: 0;
    left: 0;
    right: 0;
  }
  
  #lottie-preload {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 100;
  }
  #bandroll {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 32px;
    z-index: 201;
    background-color: #00642d;
    color: #fff;
    opacity: 0;
    pointer-events: none;
    transition: all ease 0.4s;
    padding: 4px 0;
  }
  #bandroll::before {
    content: "";
    position: absolute;
    width: 45px;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 1;
    background: linear-gradient(to right, #00642d, rgba(0, 100, 45, 0));
  }
  #bandroll::after {
    content: "";
    position: absolute;
    width: 45px;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    background: linear-gradient(to left, #00642d, rgba(0, 100, 45, 0));
  }
  #bandroll.active {
    opacity: 1;
    pointer-events: all;
  }
  #bandroll .content {
    white-space: nowrap;
    font-size: 16px;
    line-height: 24px;
    display: flex;
    text-transform: uppercase;
    font-family: "Be Vietnam Pro", sans-serif;
    color: #faa012;
  }
  #bandroll.active .track {
    position: relative;
    overflow: hidden;
    width: 100vw;
    height: 20px;
  }
  
  #bandroll .track {
    position: relative;
    overflow: hidden;
    width: 100vw;
    height: 20px;
  }
  
  #bandroll .content {
    display: block;
    width: 200%;
    position: absolute;
    animation: marquee 15s linear infinite;
  }
  
  #bandroll .track-inner {
    width: 50%;
    float: left;
  }
  
  #bandroll .content span {
    display: inline-block;
    float: left;
    width: fit-content;
    transition: all 0.2s ease-out;
    font-family: "Roboto Mono", sans-serif;
  }
  @keyframes marquee {
    0% {
      left: 0;
    }
    100% {
      left: -100%;
    }
  }
  
  #bandroll .icon {
    width: 35px;
    height: 26px;
    margin: 0 12px;
    padding-bottom: 2px;
    display: inline-block;
  }
  .view-all-yellow,
  .view-all {
    display: inline-block;
    /*padding: 0 16px;*/
    padding: 0.75rem 2rem;
    font-size: 14px;
    font-weight: 600;
    line-height: 24px;
    color: #f7541c;
    /* text-decoration: none */
    /* margin-top: -12px; */
    margin-bottom: 18px;
    border-radius: 40px;
    margin-left: 10px;
    border: 1.5px solid #f7541c;
  }
  .view-all-yellow {
    color: #faa012;
    border: 1.5px solid #faa012;
  }
  .view-all > img,
  .view-all-yellow > img {
    width: 11px;
    margin-left: 2px;
  }
  /********************************************************************/
  /************************* SECTION - MENU ***************************/
  
  .menu-icon-desktop {
    width: 32px;
    height: 32px;
    cursor: pointer;
  }
  
  .menu-icon {
    position: fixed;
    z-index: 300;
    left: 16px;
    bottom: 30px;
    width: 32px;
    height: 32px;
    opacity: 0;
    pointer-events: none;
    transform: translateX(-30px);
    transition: all ease 0.5s;
    display: none;
  }
  .menu-icon.active {
    cursor: pointer;
    opacity: 1;
    pointer-events: all;
    transform: translateX(0);
  }
  .menu-icon > img {
    width: 100%;
    height: 100%;
  }
  .menu-icon-mobile {
    display: none;
    position: fixed;
    z-index: 300;
    left: 16px;
    bottom: 30px;
    width: 32px;
    height: 32px;
    opacity: 0;
    pointer-events: none;
    transform: translateX(-30px);
    transition: all ease 0.5s;
  }
  .menu-icon-mobile.active {
    cursor: pointer;
    opacity: 1;
    pointer-events: all;
    transform: translateX(0);
  }
  .menu-icon-mobile > img {
    width: 100%;
    height: 100%;
  }
  .menu {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 201;
    background-color: #d3d3d3;
    transform: translateY(calc(100% + 100px));
    transition: all ease 0.5s;
    overflow: hidden;
  }
  .menu.active {
    transform: translateY(0);
  }
  .menu .lottie-bg-container {
    position: absolute;
    top: 0;
    left: 0;
    margin-top: 15vh;
    /* mix-blend-mode: darken; */
  }
  .menu .lottie-bg-container::after,
  .menu .lottie-bg-container::before {
    /* position: absolute; */
    content: "";
    top: -5px;
    height: 10px;
    left: 0;
    right: 0;
    background-color: #d3d3d3;
  }
  .menu .lottie-bg-container::after {
    top: unset;
    bottom: -5px;
  }
  .menu .lottie-bg {
    width: 100%;
    height: 100%;
  }
  .menu .header-menu {
    z-index: 3 !important;
    position: absolute;
    top: 16px;
    right: 16px;
    left: 16px;
    display: flex;
    align-items: center;
    margin-right: auto !important;
  }
  .menu .header-menu .btn {
    margin-left: auto;
    background-color: #f7541c;
    padding: 8px 16px;
    display: block;
    color: #fff;
    text-decoration: none;
    font-size: 18px;
    border-radius: 30px;
    font-weight: 600;
    z-index: 12;
  }
  .menu .header-menu .star {
    width: 30px;
    height: 30px;
    position: relative;
  }
  .menu .header-menu .star > img {
    width: 100%;
    height: 100%;
  }
  .menu .header-menu .star .badge {
    position: absolute;
    top: -6px;
    right: -6px;
    min-width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    border-radius: 9px;
    background: #f7541c;
    color: #fff;
  }
  .menu .languages {
    margin-left: 30px;
    cursor: pointer;
    z-index: 10;
  }
  
  .menu .languages .details-contact a {
    font-size: 32px;
    text-decoration: none;
    color: #fff;
    font-weight: 600;
  }
  .menu .languages .active-language {
    color: #f7541c;
  }
  .menu .header-items {
    top: 0;
    position: absolute !important;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    z-index: 1;
    padding-top: calc(50vh);
    padding-bottom: 50px;
    overflow: auto;
    margin-right: auto !important;
    /*     pointer-events: none; */
  }
  .menu .header-item {
    display: block;
    margin-bottom: 28px;
    color: #f2f2f2;
    font-weight: 600;
    text-decoration: none;
    text-align: center;
    font-size: 32px;
    pointer-events: all;
  }
  .menu .header-items .active {
    color: #f7541c !important;
  }
  .menu::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 120px;
    background: linear-gradient(to top, #f2f2f2, rgba(255, 255, 255, 0));
    z-index: 10;
    pointer-events: none;
  }
  
  .menu .section-footer-group .section-footer {
    padding: 0;
    background-color: unset;
  }
  /************************* SECTION - MENU ***************************/
  /********************************************************************/
  /********************************************************************/
  /************************* SECTION - BANNER *************************/
  .section-banner {
    background-color: #0d281e;
    padding-bottom: 52px;
    position: relative;
    /* overflow: auto; */
    /* overflow: hidden; */
    width: 100%;
  }
  .section-banner .logo {
    position: absolute;
    margin: 0 auto;
    left: 0;
    right: 0;
    top: 20px;
    /* width: 340px; */
    width: 500px;
    max-width: 90%;
    z-index: 99;
  }
  
  .section-banner .content {
    height: 100vh;
  }
  .section-banner .title {
    font-size: 48px;
    text-align: center;
    position: absolute;
    z-index: 120;
    left: 0;
    top: 100vh;
    right: 0;
    transition: all ease 1s;
    transform: translateY(calc(-100% - 40px));
    padding: 0 16px;
    color: #fff;
    opacity: 0;
    width: 100%;
    margin: 0 auto;
  }
  .section-banner .title.active {
    transform: translateY(calc(-100% + 20px));
    opacity: 1;
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 600;
    font-size: 48px;
    line-height: 52px;
    letter-spacing: -0.02em;
    color: #f2f2f2;
  }
  .section-banner .button-container {
    /* position: absolute;
      padding-top: 0;
      left: 0;
      right: 0;
      bottom: 100px; */
    margin-top: 16px;
    display: flex;
    justify-content: center;
    z-index: 2;
  }
  
  .section-banner .cut-lottie {
    position: absolute;
    top: 84%;
    width: 100%;
    height: 100px;
    z-index: 1;
    background-color: #0e281d;
  }
  .section-banner .button {
    /* width: 179px; */
    /* height: 48px; */
    display: inline-block;
    text-decoration: none;
    background-color: #f7541c;
    border-radius: 40px;
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 26px;
    color: #f2f2f2;
    padding: 0.75rem 2rem;
    align-content: center;
  }
  /************************* SECTION - BANNER *************************/
  /********************************************************************/
  
  /********************************************************************/
  /************************* SECTION - SHOWROOM ***********************/
  .section-showroom {
    padding-top: 45px;
    background-color: #0e281d;
    /* padding-bottom: 120px; */
  }
  .section-showroom .content {
    position: relative;
    z-index: 1;
    margin-bottom: 18px;
  }
  .section-showroom .title {
    /* Heading/H1/Large Semibold */
  
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 600;
    font-size: 38px;
    line-height: 52px;
    color: #f7541c;
    letter-spacing: -0.02em;
    padding: 0 16px;
    margin: 0 0 12px;
  }
  .section-showroom .description {
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    letter-spacing: 0.01em;
    color: #f2f2f2;
    padding: 0 16px;
    padding-right: 16px;
    margin-bottom: 64px;
  }
  .list-slider {
    margin-bottom: 32px;
    position: relative;
    display: flex;
    flex-direction: column-reverse;
  }
  .list-slider .swiper-slide {
    margin-right: 16px;
    width: 321px;
    max-width: calc(100vw - 16px - 38px);
  }
  
  .list-slider a {
    text-decoration: none;
    position: relative;
    display: block;
  }
  
  /* .list-slider .swiper-slide:last-of-type a {
      position: relative;
      width: 321px;
      max-width: calc(100vw - 16px - 38px);
      display: block;
  } */
  
  .list-slider .swiper-slide:last-of-type .more-image {
    position: absolute;
    top: 50%;
    width: 100%;
    padding: 30px;
    transform: translateY(-50%);
  }
  .list-slider .img {
    /* OK */
    max-height: calc(100vw - 16px - 38px);
    width: 321px;
    /* OK */
    max-width: calc(100vw - 16px - 38px);
    position: relative;
    overflow: hidden;
  }
  .list-slider .img > img {
    border-radius: 24px;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    aspect-ratio: 1;
  }
  
  .list-slider .status {
    position: absolute;
    top: 0;
    right: 0;
    width: 102px;
    height: 103px;
    background: url(../images/project-status.svg);
    background-size: 100% 100%;
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
    line-height: 22px;
    color: #00642d;
    /* padding-top: 10px;
      padding-left: 54px; */
    padding-top: 17px;
    padding-left: 57px;
  }
  .list-slider .name {
    color: #f2f2f2;
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 600;
    font-size: 24px;
    line-height: 28px;
    margin: 8px 0 4px;
  
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .list-slider .name > img {
    margin-left: 4px;
    width: 14px;
    display: inline-block;
    aspect-ratio: auto 640/360;
  }
  .list-slider .info {
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 600;
    font-size: 13px;
    line-height: 15px;
    color: #7d7d7d;
    letter-spacing: 0.02em;
  }
  .list-slider .info.white {
    color: #fff;
  }
  .list-slider .arrow-wrapper {
    /* position: absolute; */
    /* top: 30%; */
    z-index: 11;
    display: flex;
    width: 100%;
    justify-content: flex-end;
    gap: 10px;
    padding-top: 10px;
    padding-right: 12px;
  }
  
  .section-showroom .arrow-wrapper {
    top: 30%;
  }
  
  .section-question .arrow-wrapper {
    top: 30%;
  }
  
  .list-slider .arrow-wrapper .arrow {
    cursor: pointer;
    width: 32px;
    aspect-ratio: 1/1;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #0b4628;
    border-radius: 50%;
  }
.banner-sidebar .arrow-wrapper {
    /* position: absolute; */
    /* top: 30%; */
    z-index: 11;
    display: flex;
    width: 100%;
    justify-content: center;
    gap: 10px;
    padding-top: 10px;
    padding-right: 12px;
  }
.banner-sidebar .arrow-wrapper .arrow {
    cursor: pointer;
    width: 32px;
    aspect-ratio: 1/1;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #0b4628;
    border-radius: 50%;
  }
  /* .list-slider .arrow-wrapper .left-arrow { */
  /* transform: translateX(-100%);1 */
  /* } */
  
  .list-slider .arrow-wrapper .right-arrow {
    /* transform: translateX(100%); */
  }
  .list-slider .lottie {
    height: 321px;
    /* OK */
    max-height: calc(100vw - 16px - 38px);
    width: 321px;
    /* OK */
    max-width: calc(100vw - 16px - 38px);
  }
  /************************* SECTION - SHOWROOM ***********************/
  /********************************************************************/
  
  /********************************************************************/
  /************************* SECTION - PROJECT BANNER *****************/
  .section-project-banner {
    /* margin-top: -100px;
      width: 100%;
      height: calc(120vh);
      background-color: #0e281d;
      position: relative; */
  
    width: 100%;
    height: 40vh;
    object-fit: cover;
    background-color: #0e281d;
    position: relative;
    transform: rotate(180deg);
  }
  
  .section-project-banner .lottie-bg {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 110vh;
  }
  .section-project-banner .title {
    opacity: 0;
    font-size: 32px;
    font-weight: 600;
    color: #fff;
    text-align: center;
    position: absolute;
    z-index: 2;
    left: 16px;
    right: 16px;
    bottom: 50vh;
    transform: translateY(50%);
  }
  .section-project-banner .title .top {
    display: block;
    margin-bottom: 28px;
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 600;
    font-size: 32px;
    line-height: 36px;
    color: #f2f2f2;
  }
  .section-project-banner .title .bottom {
    /* display: block; */
    width: 280px;
    text-align: center;
    display: inline-block;
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 600;
    font-size: 32px;
    line-height: 36px;
    color: #f2f2f2;
  }
  .section-project .arrow-wrapper {
    top: 30%;
  }
  /************************* SECTION - PROJECT BANNER *****************/
  /********************************************************************/
  
  /********************************************************************/
  /************************* SECTION - PROJECT ************************/
  .section-project {
    background-color: #00642d;
    color: #fff;
    padding-top: 45px;
    padding-bottom: 50px;
    position: relative;
    z-index: 1;
    margin-top: -1px;
  }
  .section-project .title {
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 600;
    font-size: 38px;
    line-height: 52px;
    letter-spacing: -0.02em;
    color: #faa012;
    padding: 0 16px;
    margin: 0 0 12px;
  }
  .section-project .description {
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    letter-spacing: 0.01em;
    color: #f2f2f2;
    margin-bottom: 24px;
    padding: 0 16px;
  }
  /************************* SECTION - PROJECT ************************/
  /********************************************************************/
  
  /********************************************************************/
  /************************* SECTION - QUESTION ***********************/
  .section-question {
    padding-bottom: calc(73% + 50px);
    padding-top: 0px;
    background-color: #0e281d;
    position: relative;
    margin-bottom: 50px;
  }
  
  .section-question .content {
    background-color: #00642d;
  }
  .section-question::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    height: 300px;
    background: #00632d;
    z-index: 1;
  }
  .section-question .content {
    position: relative;
    z-index: 1;
  }
  .section-question .title {
    font-size: 38px;
    color: #faa012;
    font-weight: 600;
    padding: 0 16px;
    margin: 0 0 24px;
  }
  .section-question .outstanding-title {
    padding-top: 45px;
    margin-bottom: 32px;
  }
  .section-question .item {
    display: flex;
    margin: 0 16px 12px;
    border-radius: 24px;
    border: 1px solid #faa012;
    padding: 16px;
    color: #faa012;
    text-decoration: none;
    font-size: 20px;
    font-weight: 600;
    align-items: flex-start;
    transition: 0.4s ease;
  }
  .section-question .item:hover {
    background: #0c3322;
    transition: 0.4s ease;
    border: 1px solid #0c3322;
  }
  
  .section-question .item:last-child {
    margin-bottom: 0px;
  }
  .section-question .item .text {
    flex: 1;
  }
  .section-question .item img {
    width: 14px;
    margin-top: 5px;
  }
  .section-question .lottie-bg {
    position: absolute;
    bottom: -85px;
    left: 0;
    width: 100%;
    height: 115vh;
    transform: rotateY(0deg);
  }
  
  .question-banner-lottie .main {
  }
  /************************* SECTION - QUESTION ***********************/
  /********************************************************************/
  
  /********************************************************************/
  /************************* SECTION - OFFICE *************************/
  .section-office {
    background-color: #0e281d;
    color: #fff;
    padding-bottom: 25px;
    position: relative;
    z-index: 1;
    margin-top: -50px;
    margin-bottom: 45px;
  }
  .section-office::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50px;
    right: 0;
    bottom: 0;
    background-color: #0e281d;
  }
  .section-office .content {
    position: relative;
    z-index: 1;
  }
  .section-office .title {
    font-size: 38px;
    color: #f7541c;
    font-weight: 600;
    padding: 0 16px;
    margin: 0 0 12px;
  }
  .section-office .description {
    color: #f2f2f2;
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 64px;
    padding: 0 16px;
  }
  .section-office .arrow-wrapper {
    top: 43%;
  }
  .section-discussion .arrow-wrapper {
    top: 30%;
  }
  .section-office .office-slider {
    margin-bottom: 32px;
  }
  .section-office .swiper-wrapper {
    align-items: center;
    /*height: 393.531px; */
  }
  .section-office .swiper-wrapper img{
      border-radius: 24px;
      object-fit:cover;
      aspect-ratio: 0.8;
  }
  .section-office .swiper-slide {
    /*width: 223px; */
    /* margin-left: 16px; */
    /*padding: 24px 16px; */
    border-radius: 24px;
    /* background-color: #00642d; */
  }
  .section-office .swiper-slide:last-of-type {
    margin-right: 16px;
  }
  .section-office .swiper-slide.custom {
    width: 400px;
    background-color: transparent;
    padding: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .section-office .swiper-slide .img {
    width: 100%;
    height: 191px;
    display: block;
    margin-bottom: 40px;
  }
  
  .section-office .cmsoon {
    background-color: inherit;
    height: 100%;
    background-position: center top;
    background-size: 100% 100%;
    background-repeat: no-repeat;
  }
  
  .section-office .cmsoon a {
    opacity: 0;
  }
  
  .section-office .swiper-slide .img-cmsoon {
    height: 100%;
    display: block;
  }
  .section-office .swiper-slide .name {
    font-size: 15px;
    color: #f2f2f2;
    text-align: center;
    margin: 0 0 4px;
    height: 28px;
  }
  .section-office .swiper-slide .price {
    font-size: 18px;
    color: #f2f2f2;
    text-align: center;
    font-weight: 500;
    height: 22px;
  }
  .section-office .item {
    display: flex;
    margin: 0 16px 12px;
    border-radius: 24px;
    border: 1px solid #00642d;
    padding: 16px;
    color: #fff;
    text-decoration: none;
    font-size: 20px;
    font-weight: 600;
    align-items: flex-start;
  }
  .section-office .item .text {
    flex: 1;
    font-weight: 400;
  }
  .section-office .item img {
    width: 14px;
  }
  
  /************************* SECTION - OFFICE *************************/
  /********************************************************************/
  
  /********************************************************************/
  /************************* SECTION - PRICE BANNER *******************/
  .section-price-banner {
    height: 150vh;
    display: flex;
    align-items: center;
    background-color: #0e281d;
    position: relative;
    margin-bottom: 45px;
  }
  .section-price-banner .title {
    position: relative;
    z-index: 2;
    margin: 0;
    text-align: center;
    padding: 0 16px;
    font-size: 32px;
    color: #f2f2f2;
    font-weight: 600;
    width: 85%;
    margin: auto;
  }
  .section-price-banner .lottie-bg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
  }
  /************************* SECTION - PRICE BANNER *******************/
  /********************************************************************/
  
  /********************************************************************/
  /************************* SECTION - PRICE **************************/
  .section-price {
    margin-right: 16px;
    background-color: #0e281d;
    padding-bottom: 50px;
  }
  .section-price .title {
    font-size: 38px;
    color: #f7541c;
    font-weight: 600;
    padding: 0 16px;
    margin: 0 0 24px;
  }
  .section-price .price-slider .swiper-wrapper {
    margin-bottom: 16px;
    height: 600px;
    /* pointer-events: none; */
  }
  .section-price .price-slider.active .swiper-wrapper {
    pointer-events: all;
  }
  .section-price .price-slider .swiper-wrapper {
    transition: all ease 0.4s;
  }
  .section-price .price-slider .buy-cg .swiper-slide {
    max-height: 585px;
  }
  .section-price .price-slider .swiper-slide {
    width: 340px;
    max-width: calc(100vw - 74px);
    border-radius: 24px;
    margin-left: 8px;
    margin-right: 8px;
    padding: 16px;
    display: flex;
    flex-direction: column;
    transition: all ease 0.4s;
    overflow: hidden;
    height: 600px;
  }
  
  .section-price .price-slider .swiper-slide:last-of-type {
    margin-right: 8px;
  }
  .section-price .price-slider .swiper-slide.slide-green {
    border: 1px solid #0b4628;
    color: #f7541c;
  }
  .section-price .price-slider .swiper-slide.slide-orange {
    border: 1px solid #0b4628;
    background-color: none;
  }
  .section-price .show {
    background-color: #0b4628;
  }
  .br-color-green {
    background-color: #0b4628;
  }
  
  .section-price .price-slider .swiper-slide.slide-yellow {
    background-color: #0b4628;
    border: 1px solid #0b4628;
    color: #00642d;
  }
  .section-price .price-slider .swiper-slide.slide-green-light {
    background-color: #00642d;
    border: 1px solid #00642d;
    color: #faa012;
  }
  
  .section-price .price-slider {
    position: relative;
  }
  
  .section-price .price-slider .price-slider-nav {
    position: absolute;
    display: flex;
    justify-content: space-between;
    align-items: center;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    z-index: 3;
  }
  
  /* .section-price .price-slider .price-slider-nav > div{
    border-radius: 50%;
    background: #fff;
    cursor: pointer;
    width: 32px;
    height: 32px;
    display: flex;
    justify-content: center;
    align-items: center;
  } */
  .section-price .price-slider .price-tag-container {
    display: flex;
    font-size: 20px;
    font-weight: 600;
    margin: -16px -16px 10px;
    padding: 16px;
    cursor: pointer;
  }
  
  .section-price .price-slider.active .price-tag-container {
    cursor: initial;
  }
  
  .section-price .swiper .cill-1-images {
    pointer-events: none;
  }
  
  .section-price .swiper.active .cill-1-images {
    pointer-events: all;
  }
  
  .cill-1-images {
    position: absolute;
    top: 48.8%;
  }
  
  .coin-1 {
    position: absolute;
    width: 280.18px;
    height: 280.18px;
    transform: translateY(30px);
    /* left: -43px;
    top: 246.02px; */
    z-index: 1;
  }
  
  .coin-2 {
    position: absolute;
    width: 251px;
    height: 251px;
    left: 40px;
    z-index: 0;
    top: 52px;
  }
  .coin-4 {
    position: absolute;
    width: 390.96px;
    height: 390.96px;
    left: -243px;
    top: -110px;
    z-index: -1;
    border-radius: 24px;
    transform: rotate(2.5deg);
  }
  .coin-3 {
    position: absolute;
    width: 222.96px;
    height: 222.96px;
    left: 100px;
    top: 80px;
    z-index: -1;
    border-radius: 24px;
  }
  
  .cill-2-images {
    position: relative;
    bottom: 34px;
    width: calc(100% - 16px);
    left: -16px;
    height: 109px;
    padding-bottom: 104px;
    border-bottom-left-radius: 24px;
    overflow: hidden;
  }
  
  .price-description-wrapper {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }
  
  .price-description-wrapper a {
    height: fit-content;
    text-decoration: none;
  }
  
  .price-description-container {
    border-radius: 16px;
    border: 1.5px solid #027536;
    padding: 12px 0px 8px 12px;
  }
  
  .price-description-name {
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
    line-height: 22px;
    color: #f7541c;
    width: 257px;
    margin-bottom: 4px;
  }
  
  .price-description-old-price {
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
    letter-spacing: 0.01em;
    text-decoration-line: line-through;
    color: #027536;
  }
  
  .price-description-new-price {
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 22px;
    color: #f2f2f2;
  }
  
  .price-description-sale {
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
    color: #f2f2f2;
    letter-spacing: 0.01em;
    padding: 3px 12px 3px 8px;
    background-color: #027536;
    border-radius: 8px 0px 0px 8px;
  }
  
  .price-description-price-sale {
    display: flex;
    flex-direction: row;
    gap: 4px;
  }
  
  .price-description-sub-container {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
  .section-price .price-slider .price-tag {
    flex: 1;
    color: #f7541c;
  }
  
  .price-tag-yellow {
    flex: 1;
    color: #faa012;
  }
  .section-price .price-slider .price-count {
    transition: all ease 0.4s;
    color: #f7541c;
  }
  
  .price-count-yellow {
    color: #faa012 !important;
    transition: all ease 0.4s;
  }
  .section-price .price-slider:not(.active) .price-count {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background-color: #0b4628;
    color: #f7541c;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .section-price .price-slider:not(.active) .price-count > span {
    display: none;
  }
  .section-price .price-slider .transform {
    transform: translateY(0px) !important;
  }
  .section-price .price-slider .price-name-1 {
    /* transform: translateY(30px); */
  }
  .section-price .price-slider .price-name {
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 24px;
    margin-top: 24px;
    color: #f2f2f2;
  }
  .section-price .price-slider .price-price {
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 600;
    font-size: 12px;
    line-height: 14px;
    color: #f2f2f2;
    float: right;
    text-align: end;
    margin-top: 20px;
  }
  
  .section-price .price-slider .price-price span {
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 500;
    font-size: 22px;
    line-height: 26px;
    color: #f2f2f2;
  }
  .section-price .price-slider .price-description {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    font-size: 16px;
    font-weight: 400;
    margin-bottom: 12px;
    margin-top: 4px;
    flex: 1;
    color: #f2f2f2;
    line-height: 22px;
  }
  .section-price .price-slider .next-slide {
    margin-left: auto;
    padding-right: 7px;
  }
  .section-price ul,
  .section-price ol {
    padding-left: 0;
    margin: 16px 0 0;
  }
  .section-price ul li,
  .section-price ol li {
    margin-bottom: 4px;
  }
  
  .section-price ul {
    counter-reset: list-counter;
  }
  .section-price ul li {
    counter-increment: list-counter;
    list-style: none;
    position: relative;
  }
  .section-price ul li:before {
    content: "(" counter(list-counter) ")  —";
  }
  
  .section-price .btn-group {
    display: flex;
    margin-right: -7px;
  }
  .section-price .btn {
    flex: 1;
    margin-right: 7px;
    padding: 8px 16px;
    border: 1px solid transparent;
    text-decoration: none;
    border-radius: 14px;
    text-align: center;
  }
  
  .cill-c-button {
    margin-top: 32px;
  }
  
  .btn-green.btn-orange-border {
    /* margin-top: 20px; */
    background-color: #0b4628;
    color: #f7541c;
    border-color: #f7541c;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  .btn-orange {
    color: #f2f2f2;
    border-color: #f7541c;
    background-color: #f7541c;
  }
  
  .btn-light-green.btn-yellow-border {
    background-color: #00642d;
    color: #faa012;
    border-color: #faa012;
  }
  
  .btn-yellow {
    color: #f2f2f2;
    border-color: #faa012;
    background-color: #faa012;
  }
  
  .btn-font {
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    line-height: 24px;
  }
  /* .section-price .btn-green {
      background: #0B4628;
      color: #f7541c;
  } */
  /* .section-price .btn-green-border {
      border-color: #f7541c;
  }
  .section-price .btn-orange {
      background: #f7541c;
      color: #f2f2f2;
  }
  .section-price .btn-orange-border {
      border-color: #f7541c;
  }
  .section-price .btn-yellow {
    background: #f7541c;
    color: #0e281d;
  }
  .section-price .btn-yellow-border {
      border-color: #f7541c;
  }
  .section-price .btn-green-light {
    background: #0e281d;
    color: #f7541c;
  }
  .section-price .btn-green-light-border {
      border-color: #0e281d;
  } */
  /************************* SECTION - PRICE **************************/
  /********************************************************************/
  
  /********************************************************************/
  /************************* SECTION - DISCUSSION *********************/
  .section-discussion {
    background-color: #0e281d;
    padding-top: 40px;
    padding-bottom: 115px;
    z-index: 1;
    position: relative;
  }
  .section-discussion .title {
    font-size: 38px;
    color: #f7541c;
    font-weight: 600;
    padding: 0 16px;
    margin: 0 0 12px;
  }
  .section-discussion .description {
    color: #fff;
    font-size: 16px;
    margin-bottom: 64px;
    font-weight: 400;
    padding: 0 16px;
  }
  .section-discussion .discussion-slider {
    margin-bottom: 32px;
  }
  .section-discussion .swiper-slide {
    /* width: 301px; */
    width: 283px;
    max-width: calc(100vw - 74px);
    border-radius: 24px;
    overflow: hidden;
    margin-left: 16px;
    background: #d3d3d3;
    color: inherit;
    text-decoration: none;
    height: 105%;
  }
  .section-discussion .swiper-slide:last-of-type {
    margin-right: 16px;
  }
  .section-discussion .swiper-slide .img {
    width: 100%;
    object-fit: cover;
    /* width: 283px; */
    height: auto;
    min-height: 283px;
  }
  .section-discussion .swiper-slide .info {
    padding: 16px;
  }
  .section-discussion .swiper-slide .tag-container {
    display: flex;
    font-size: 13px;
    font-weight: 600;
    color: #0d281e;
    margin-bottom: 8px;
  }
  .section-discussion .swiper-slide .tag-name {
    flex: 1;
  }
  .section-discussion .swiper-slide .name {
    font-size: 20px;
    color: #0d281e;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
  }
  .section-discussion .swiper-slide.custom {
    width: 400px;
    background-color: transparent;
    padding: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .section-discussion .swiper-slide.custom .name {
    font-size: 32px;
    margin-bottom: 20px;
    color: #fff;
  }
  .section-discussion .item {
    display: flex;
    margin: 0 16px 12px;
    margin-left: 0;
    border-radius: 24px;
    border: 1px solid #00642d;
    padding: 16px;
    color: #fff;
    text-decoration: none;
    font-size: 20px;
    font-weight: 600;
    align-items: flex-start;
  }
  .section-discussion .item .text {
    flex: 1;
    font-weight: 400;
  }
  .section-discussion .item img {
    width: 14px;
  }
  /************************* SECTION - DISCUSSION *********************/
  /********************************************************************/
  /********************************************************************/
  /************************* SECTION - ABOUT **************************/
  .section-about-banner {
    /*     background-color: #0d281e; */
    z-index: 1;
    position: relative;
    width: 100%;
    padding-top: 143%;
  }
  .section-about-banner .lottie-bg {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
  }
  .section-about {
    padding-top: 10px;
    padding-bottom: 125%;
    background-color: #0d281e;
    position: relative;
    margin-top: -100px;
  }
  .section-about .content {
    position: relative;
    z-index: 10;
  }
  .section-about .title {
    font-size: 38px;
    color: #f7541c;
    font-weight: 600;
    padding: 0 16px;
    margin: 0 0 64px;
  }
  .section-about .description {
    color: #f2f2f2;
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 400;
    font-size: 20px;
    line-height: 26px;
    padding: 0 16px;
    padding-left: calc(16px + 10%);
  }
  
  .section-about .description p {
    margin-bottom: 12px;
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 400;
    font-size: 20px;
    line-height: 26px;
    color: #f2f2f2;
  }
  
  .section-about .view-all {
    /*padding-top: 20px;
    padding-left: 0;*/
  }
  .section-about .lottie-bg-container {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding-top: 360%;
  }
  .section-about .lottie-bg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
  }
  /************************* SECTION - ABOUT **************************/
  /********************************************************************/
  
  /********************************************************************/
  /************************* SECTION - CONTACT ************************/
  .section-contact {
    background-color: #00642d;
    padding: 0 16px;
    overflow: hidden;
    border-radius: 0 0 24px 24px;
    position: relative;
    z-index: 10;
    margin-top: -2px;
  }
  .section-contact .title {
    font-size: 38px;
    /* color: #f7541c; */
    color: #faa012;
    font-weight: 600;
    margin: 0 0 30px;
  }
  .section-contact .item {
    margin-bottom: 20px;
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    letter-spacing: 0.01em;
    color: #f2f2f2;
    display: flex;
  }
  .section-contact .item .label {
    width: 104px;
    max-width: 30%;
  }
  .section-contact .item .value {
    flex: 1;
  }
  .section-contact .item a {
    color: inherit;
    text-decoration: none;
  }
  
  .section-contact .extra {
    text-decoration: none;
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    letter-spacing: 0.01em;
    color: #f2f2f2;
    display: flex;
    width: 100%;
    margin-bottom: 8px;
    flex-direction: column;
  }
  
  .section-contact .extra .sub-extra {
    width: 100%;
    border-bottom: 1px solid #faa012;
  }
  
  .section-contact .extra .sub-extra-last {
    width: 100%;
    color: #faa012;
  }
  
  .section-contact .extra .sub-extra-last a {
    display: flex;
    color: #faa012;
    text-decoration: none;
  }
  
  .section-contact .extra .sub-extra-last .block-content {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: right;
    float: right;
    cursor: pointer;
    padding-left: 104px;
  }
  .subtitle {
    cursor: pointer;
  }
  .section-contact .blog-discussion a {
    text-decoration: none;
    color: white;
  }
  
  .section-contact .extra .subextra a {
    display: flex;
    width: 100%;
    color: #faa012;
    text-decoration: none;
  }
  
  .section-contact .subtitle {
    color: #faa012;
    padding: 4px 0;
    margin-top: 6px;
  }
  
  .section-contact .extra .block-content {
    margin: 12px 0;
  }
  
  .section-contact .extra .block-content img {
    width: 10px;
    margin-left: 3px;
  }
  
  /************************* SECTION - CONTACT ************************/
  /********************************************************************/
  
  /********************************************************************/
  /************************* SECTION - FOOTER *************************/
  
  #main-content.section-footer-group {
    /* position: sticky; */
    /* z-index: 1; */
    /* bottom: -161%; */
    margin-top: 2vh;
    /* background-color: #D4D2D4; */
  }
  
  .section-footer-group {
    position: relative;
  }
  
  .section-footer {
    padding: 18px 16px 28px;
    background-color: inherit;
    position: sticky;
    bottom: 0;
  }
  .section-footer .items {
    display: flex;
    justify-content: space-around;
    margin-bottom: 25px;
  }
  .section-footer .item {
    width: 25%;
	justify-items:center;
  }

  
  .footer-items-active .item > img,
  .section-footer .item > img {
    width: 70%;
    display: block;
  }
  .section-footer .copyright {
    color: #f7541c;
    font-size: 20px;
    font-weight: 500;
  }
  .footer-items-active {
    pointer-events: none;
    position: relative;
    z-index: 80;
	align-items:center;
  }
  .footer-items-active.active {
    pointer-events: all;
  }
  .footer-items-active .item {
    position: absolute;
    opacity: 0;
    pointer-events: none;
    transition: all ease 0.4s;
  }
  .footer-items-active .item.active {
    opacity: 1;
  }
  .footer-items-active .actions {
    position: absolute;
    left: 16px;
    right: 16px;
    transition: all ease 0.4s;
    opacity: 0;
    transform: translateY(20px);
    pointer-events: none;
  }
  .footer-items-active .actions.active {
    transform: translateY(0);
    opacity: 1;
    pointer-events: all;
  }
  .footer-items-active .action {
    display: flex;
    position: relative;
    padding: 16px 40px 16px 16px;
    background-color: #f7541c;
    color: #fff;
    background-image: url(../images/arrow-top-right-white.svg);
    background-size: 14px;
    background-repeat: no-repeat;
    background-position: calc(100% - 16px) 16px;
    margin-bottom: 20px;
    border-radius: 24px;
    text-decoration: none;
    font-weight: 600;
  }
  .section-footer > *,
  .section-contact > * {
    transition: all ease 0.4s;
  }
  .section-footer.blur > *,
  .section-contact.blur > * {
    filter: blur(4px);
  }
  /************************* SECTION - FOOTER *************************/
  /********************************************************************/
  
  /* #right-sidebar, */
  #left-sidebar {
    display: none;
    /* z-index: 1; */
    /* padding: 0 24px 32px 64px; */
    padding: 0 0px 32px 64px;
    z-index: 0;
  }
  
  #booking-toggle-btn {
    position: fixed;
    right: -55px;
    top: 208px;
    z-index: 100;
    transform: rotate(90deg);
    display: flex;
    align-items: center;
    gap: 12px;
    background-color: #0c3322;
    padding: 14px 24px;
    border-radius: 0px 0px 24px 24px;
    cursor: pointer;
  }
  
  #booking-toggle-btn svg {
    transform: rotate(-90deg) translate(-4px, 4px);
  }
  
  #popup-register {
    display: none;
    justify-content: center;
    align-items: center;
  }
  
  #popup-error {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    justify-content: center;
    align-items: center;
    z-index: 300;
  }
  
  #popup-error.active {
    display: flex;
  }
  
  .popup-lang {
    width: 265px;
    border-radius: 24px;
    padding: 32px 24px 24px 24px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: #f7541c;
    color: #ffff;
  }
  
  .popup-lang img {
    width: 32px;
    height: 32px;
    margin-bottom: 16px;
  }
  
  .popup-lang p {
    width: 100%;
    text-align: center;
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    margin-bottom: 48px;
  }
  
  .popup-lang button {
    width: 100%;
    text-align: center;
    border-radius: 16px;
    padding: 8px 12px 8px 12px;
    background-color: #ffff;
    color: #f7541c;
    border: none;
  }
  
  .change-theme #left-sidebar .box-posts .item.active {
    background-color: #ffff !important;
  }
  
  @media (max-width: 1412px) {
    #lottie-preload-red {
      top: 130px;
      left: 30px;
    }
  
    #right-sidebar {
      width: 380px !important;
      padding: 0;
    }
    #left-sidebar {
      width: 334px !important;
    }
  
    #right-sidebar .calender-bottom-buttons {
      flex-wrap: wrap;
    }
    #right-sidebar .current-date-format.green-button {
      /* width: fit-content !important;
      width: -moz-fit-content !important; */
      /* max-width: 144px; */
      /* height: 36px; */
    }
    #left-sidebar .box-posts .item {
      min-width: 255px !important;
    }
    /* #right-sidebar{
      padding-left: 60px !important;
      padding-right: 20px !important;
    } */
    /* #left-sidebar{
      padding-left: 20px !important;
      padding-right: 12px !important;
    } */
  }
  @media (max-width: 1200px) {
    #scrollDown-2 .suggest-contact-list {
      bottom: 120px;
    }
  
    #booking-toggle-btn {
      display: none !important;
    }
  
    #product-detail-zoom-button,
    #project-detail-zoom-button,
    #discussion-detail-zoom-button {
      display: none !important;
    }
  
    #lottie-preload-red.load {
      left: calc(-100vw + 570px);
    }
    .contact-button {
      display: none;
    }
    #left-sidebar .box-gallery {
      display: none;
    }
    .contact-button-mobile {
      display: flex;
      flex-direction: column;
      align-items: flex-end;
      position: fixed;
      gap: 12px;
      right: 30px;
      bottom: 14px;
      z-index: 999;
    }
    #left-sidebar {
      left: calc(50vw - 334px - 436px / 8 - 15px) !important;
    }
    #main-content {
      margin-right: calc(50vw - 436px + 336px / 8 - 15px);
      margin-left: auto !important;
    }
    .menu-icon-desktop {
      display: none;
    }
    .menu-icon {
      display: block;
    }
  }
  
  /* @media (max-width: 890px) {
    #left-sidebar .box-menu .item {
      width: 100% !important;
    }
    #left-sidebar .box-menu .item p {
      padding-left: 6px !important;
    }
    #left-sidebar .box-posts .item a {
      flex-direction: column;
      align-items: center;
      gap: 12px;
    }
    #left-sidebar .box-posts .item {
      min-width: 0 !important;
      width: 100%;
    }
    #left-sidebar .box-posts .item .img {
      max-width: 100% !important;
    }
  } */
  @media (max-width: 768px) {
    #main-content {
      width: 100% !important;
      /* max-width: 436px; */
      margin-right: 0;
      margin: auto;
    }
    #lottie-preload-red {
      /* display: none; */
      width: 85%;
      top: 120px;
      left: 28px;
    }
  
    #lottie-preload-red.load {
      background: #f7541c;
      top: 20%;
      aspect-ratio: 1;
      left: 0;
      width: 100vw;
      height: 100vw;
      z-index: 130;
      transition: 2s;
    }
  
    .section-showroom .arrow-wrapper,
    .section-project .arrow-wrapper,
    .section-office .arrow-wrapper,
    .section-discussion .arrow-wrapper {
      display: none;
    }
  
    .menu-icon {
      display: none;
    }
    .menu-icon-mobile {
      display: block;
    }
  
    img.img-button.btn-respon.mess-btn {
      display: none !important;
    }
  
    .section-banner .cut-lottie {
      top: 88%;
    }
  }
  @media screen and (max-width: 1200px) {
    .menu #lottie-bg-container {
      left: 56vw;
    }
    .silver-page {
      left: 22vw !important;
    }
    .menu .header-items {
      left: 49vw !important;
    }
    .silver-footer {
      width: 100% !important;
      /* margin-left: 4vw !important; */
    }
  }
  @media screen and (min-width: 768px) {
    .contact-button-mobile {
      display: none !important;
    }
  
    #bandroll {
      opacity: 1 !important;
    }
    /* .menu #lottie-bg-container {
          left: unset;  
      } */
    #main-content {
      width: 670px;
      margin-left: auto;
      /* margin-right: 0px; */
      position: relative;
      transition: 1s;
    }
    #lottie-preload {
      display: none;
    }
  
    .menu .lottie-bg-container {
      width: 35vw;
      left: 32vw;
    }
    .section-banner {
      position: relative;
    }
    .section-banner::before,
    .section-banner::after {
      position: absolute;
      top: -45px;
      bottom: 0;
      pointer-events: none;
      width: 28px;
      content: "";
      z-index: 1;
      height: 150%;
    }
    .section-banner::before {
      left: 0;
      background: linear-gradient(to left, #0e281d00, #0e281d);
    }
    .section-banner::after {
      right: 0;
      background: linear-gradient(to right, #0e281d00, #0e281d);
    }
    .menu-icon {
      right: calc(min(70vw, calc(55vw + 285px)) - 32px);
      left: auto;
    }
    .menu-icon.active {
      right: calc(min(70vw, calc(55vw + 285px)) - 48px);
      left: auto;
    }
    .menu-icon-mobile {
      right: calc(min(70vw, calc(55vw + 285px)) - 32px) !important;
      left: auto;
    }
    .menu-icon-mobile.active {
      right: calc(min(70vw, calc(55vw + 285px)) - 48px) !important;
      left: auto;
    }
    .section-banner .content {
      margin-top: 32px;
    }
    .section-banner .content {
      /* height: 50vw; */
      top: 0;
      min-height: 810px;
      height: 810px;
      max-height: 112vh;
    }
    #left-sidebar {
      display: flex;
      flex-direction: column;
      position: fixed;
      z-index: 10;
      top: 32px;
      bottom: 0;
      /* width: calc(100vw - 570px); */
      padding: 16px 4px 0 0px;
      /* max-width: 336px; */
      right: calc(50vw + 570px / 2 + 90px);
      margin-left: 24px;
      margin-right: 12px;
    }
    #right-sidebar {
      display: none;
      flex-direction: column;
      position: fixed;
      /* z-index: 1; */
      top: 32px;
      bottom: 0;
      width: 33vw;
      max-width: 420px;
      margin-top: 16px;
      padding-right: 24px;
      left: calc(50vw + 570px / 2 + 90px);
      transition: 1s;
    }
  
    #right-sidebar.disable {
      max-width: 0 !important;
      transition: 1s;
      padding-right: 0;
      right: 0 !important;
      left: 100%;
    }
  
    #left-sidebar .box-menu-container {
      padding: 16px;
      margin-bottom: 18px;
      background-color: #0c3322;
      border-radius: 24px;
      /* max-width: 334px; */
      min-width: 165px;
    }
  
    #left-sidebar .box-menu {
      margin: 0;
      padding: 0 0 2px 0;
      list-style-type: none;
      display: flex;
      max-width: 334px;
      /* max-height: 154px; */
      flex-flow: wrap;
      white-space: nowrap;
      font-size: 16px;
      font-weight: 600;
      line-height: 20px;
    }
    #left-sidebar .box-menu .item {
      width: 50%;
      /* height: 22px; */
      margin: 8px 0 0 0;
    }
  
    #left-sidebar .box-menu .item p {
      padding-left: 15px;
    }
  
    /* #left-sidebar .box-menu .item:first-child {
          margin-top: 0px;
      }
  
      #left-sidebar .box-menu .item:last-child {
          margin-bottom: 0px;
      } */
  
    #left-sidebar .box-menu .item-link {
      color: #00642d;
      font-weight: 600;
      text-decoration: none;
    }
    #left-sidebar .box-menu .item-link p {
      transition: 0.3s;
    }
  
    #left-sidebar .box-menu .right {
      padding-left: 25px;
    }
    #left-sidebar .box-menu .item-link:hover p,
    #left-sidebar .box-menu .item.active .item-link {
      color: #f7541c;
      transition: 0.3s;
    }
  
    #left-sidebar .box-menu .item.active,
    #left-sidebar .box-menu .item.active:hover p {
      color: #f7541c;
    }
    #left-sidebar .box-posts {
      padding: 16px;
      background-color: #0c3322;
      border-radius: 24px;
      margin: 0 0 16px;
      font-weight: 600;
      flex: 1;
      display: flex;
      flex-direction: column;
      overflow: hidden;
      position: relative;
      /* max-width: 334px; */
      min-width: 165px;
    }
    #left-sidebar .box-posts::after {
      position: absolute;
      content: "";
      bottom: 0;
      left: 0;
      right: 0;
      height: 28px;
      background: linear-gradient(to top, #05381c, #05381c00);
    }
    #left-sidebar .box-posts .title {
      margin: 0;
      margin-bottom: 10px;
      padding: 0;
      list-style-type: none;
      display: flex;
      max-width: 334px;
      flex-flow: wrap;
      font-size: 16px;
      font-weight: 600;
      line-height: 20px;
    }
    #left-sidebar .box-posts .title span {
      cursor: pointer;
      width: 50%;
      padding-left: 15px;
    }
  
    /* #left-sidebar .box-posts .new-posts-title {
  
      }*/
  
    #left-sidebar .box-posts .distinct-posts-title {
      padding-left: 7px;
    }
  
    #left-sidebar .box-posts .title span.active {
      font-weight: 600;
      justify-content: space-between;
      color: #f7541c;
    }
    #left-sidebar .box-posts .item {
      min-width: 300px;
      background-color: rgba(5, 72, 35, 0.5);
      border-radius: 16px;
      padding: 12px;
      position: relative;
      display: flex;
      align-items: flex-start;
      margin-bottom: 8px;
      width: 100%;
    }
    #left-sidebar .box-posts .posts-div-container {
      display: flex;
      position: relative;
      flex: 1;
    }
    #left-sidebar .box-posts .item a {
      width: 100%;
      display: flex;
      text-decoration: none;
      align-items: center;
    }
    #left-sidebar .box-menu .active-page {
      color: rgba(247, 84, 28, 1);
    }
    #left-sidebar .box-posts .item:hover {
      background: rgba(5, 72, 35, 1);
      transition: 0.4s;
    }
    #left-sidebar .box-posts .item .img {
      /* width: 63px;
          height: 63px; */
      aspect-ratio: 1/1;
      width: 100%;
      max-width: 63px;
      border-radius: 12px;
    }
    #left-sidebar .box-posts .item .name {
      color: #fff;
      margin-bottom: 8px;
      font-size: 13px;
      font-weight: 600;
      line-height: 15px;
      width: 100%;
    }
    #left-sidebar .box-posts .item .description {
      color: rgba(2, 117, 54, 1);
      font-weight: 400;
      font-size: 13px;
    }
    #left-sidebar .box-posts .item .item-info {
      flex: 1;
      padding-left: 12px;
    }
    #left-sidebar .box-posts .items-container {
      position: relative;
      flex: 1;
      max-width: 0;
      transition: 0.5s;
    }
    #left-sidebar .box-posts .items-container.active {
      position: relative;
      flex: 1;
      max-width: 100%;
      transition: 0.5s;
    }
    #left-sidebar .box-posts .items {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      overflow-y: auto;
      padding: 0;
    }
    #left-sidebar .box-posts .items::-webkit-scrollbar {
      display: none;
    }
    #left-sidebar .box-gallery {
      height: 126px;
      position: relative;
      /* max-width: 334px; */
      min-width: 165px;
    }
    #left-sidebar .box-gallery .main-layer {
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      height: 90px;
      z-index: 10;
      display: flex;
      /*justify-content: space-between;*/
      align-items: center;
      border-top-left-radius: 24px;
      border-top-right-radius: 24px;
      padding: 0 32px;
      background-color: #0c3322;
    }
  
    #left-sidebar .box-gallery .main-layer a {
      display: flex;
      /* justify-content: space-between; */
      width: 100%;
    }
    #left-sidebar .box-gallery .main-layer .name {
      color: #fff;
      font-family: Be Vietnam Pro;
      font-size: 16px;
      font-weight: 600;
      line-height: 20px;
      letter-spacing: 0.01em;
      margin-left: 15px;
    }
    #left-sidebar .box-gallery .main-layer .star {
      width: 30px;
      height: 30px;
      position: relative;
    }
    #left-sidebar .box-gallery .main-layer .star img {
      width: 100%;
      display: block;
    }
    #left-sidebar .box-gallery .main-layer .star .badge {
      position: absolute;
      top: -6px;
      right: -6px;
      min-width: 18px;
      height: 18px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 12px;
      border-radius: 9px;
      background: #f7541c;
      color: #fff;
    }
    #left-sidebar .box-gallery .layer-1 {
      position: absolute;
      left: 16px;
      right: 16px;
      height: 106px;
      bottom: 0;
      background-color: #00642d;
      border-radius: 8px;
      z-index: 9;
    }
    #left-sidebar .box-gallery .layer-2 {
      position: absolute;
      left: 21px;
      right: 21px;
      height: 114px;
      bottom: 0;
      background-color: #054823;
      border-radius: 8px;
      z-index: 8;
    }
    #left-sidebar .box-gallery .layer-3 {
      position: absolute;
      left: 26px;
      right: 26px;
      height: 122px;
      bottom: 0;
      background-color: #05381c;
      border-radius: 8px;
      z-index: 7;
    }
    #right-sidebar .calender-bottom-buttons {
      display: flex;
      flex-direction: row;
      gap: 12px;
      padding: 0 16px;
      align-items: center;
      justify-content: space-around;
    }
  
    #right-sidebar .booking-button {
      width: 144px;
      text-align: center;
      padding: 8px 16px;
      border-radius: 24px;
      background-color: #f7541c;
      border: 1px solid #f7541c;
      outline: none;
      font-family: "Be Vietnam Pro";
      font-style: normal;
      font-weight: 600;
      font-size: 14px;
      line-height: 16px;
      letter-spacing: 0.01em;
      color: #f2f2f2;
      cursor: pointer;
    }
  
    #right-sidebar .booking-button.disable {
      padding: 8px 6px;
      background-color: #acacac;
      cursor: none;
      pointer-events: none;
      border: 1px solid #acacac;
    }
  
    #current-date-format-white-button {
      background-color: #f2f2f2;
      border: 1px solid #f2f2f2;
      border-radius: 16px;
      padding: 3px 10px;
      font-family: "Be Vietnam Pro";
      font-style: normal;
      font-weight: 600;
      font-size: 13px;
      line-height: 1rem;
      align-items: center;
      color: #0d281e;
      cursor: pointer;
      outline: none;
    }
  
    #current-date-format-day.white {
      background-color: #f2f2f2;
      color: #0d281e;
    }
  
    #right-sidebar .booking-button-gray {
      padding: 8px 12px;
      border-radius: 24px;
      background-color: #f7541c;
      border: 1px solid #f7541c;
      outline: none;
      font-family: "Be Vietnam Pro";
      font-style: normal;
      font-weight: 600;
      font-size: 14px;
      line-height: 16px;
      letter-spacing: 0.01em;
      color: #f2f2f2;
      cursor: pointer;
    }
    #right-sidebar .booking-button-gray.disable {
      padding: 8px 6px;
      background-color: #acacac;
      cursor: none;
      pointer-events: none;
      border: 1px solid #acacac;
    }
  
    #right-sidebar .current-date-format.green-button {
      width: 144px;
      text-align: center;
      background-color: #0b4628;
      border: 1px solid #0b4628;
      border-radius: 16px;
      padding: 3px 8px;
      font-family: "Be Vietnam Pro";
      font-style: normal;
      font-weight: 600;
      font-size: 13px;
      line-height: 1rem;
      align-items: center;
      color: #f2f2f2;
      cursor: pointer;
      outline: none;
    }
    #right-sidebar .box-calendar {
      padding: 16px 16px 16px;
      background-color: #0c3322;
      border-radius: 24px;
      color: #fff;
      min-width: 250px;
      margin-right: 16px;
      margin-left: 16px;
    }
    #right-sidebar .box-calendar .current-time {
      font-size: 32px;
      line-height: 36px;
      margin-bottom: 4px;
      text-align: center;
      font-weight: 600;
    }
    #right-sidebar .box-calendar .current-date {
      font-family: "Be Vietnam Pro";
      font-style: normal;
      font-weight: 600;
      font-size: 13px;
      line-height: 15px;
      text-align: center;
      letter-spacing: 0.02em;
      margin-bottom: 0;
      color: #f2f2f2;
    }
  
    #right-sidebar .box-calendar .current-date-wrapper {
      display: flex;
      justify-content: center;
      align-items: center;
      font-family: "Be Vietnam Pro";
      font-style: normal;
      font-weight: 600;
      font-size: 13px;
      line-height: 15px;
      text-align: center;
    }
    #right-sidebar .box-calendar .calendar {
      background-color: rgba(12, 51, 34, 1);
      border-radius: 16px;
      padding: 0 16px 16px;
    }
    #right-sidebar .box-calendar .current-wrapper {
      background: rgba(13, 40, 30, 1);
      gap: 4px;
      padding: 16px;
      border-radius: 16px;
    }
    #right-sidebar .box-calendar .datepicker-days {
      width: 100%;
    }
    #right-sidebar .box-calendar .table-condensed {
      width: 100%;
    }
    #right-sidebar .box-calendar .prev,
    #right-sidebar .box-calendar .next,
    #right-sidebar .box-calendar .datepicker-switch {
      /* padding: 18px 0; */
      padding-top: 16px;
      cursor: pointer;
      font-weight: 600;
      font-family: "Be Vietnam Pro";
      font-style: normal;
      font-size: 16px;
      line-height: 20px;
      color: #f2f2f2;
    }
  
    #right-sidebar .box-calendar .datepicker-switch {
      font-size: 16px;
      font-weight: 600;
      line-height: 20px;
    }
  
    #right-sidebar .box-calendar .dow {
      font-size: 13px;
      font-weight: 600;
      line-height: 15px;
      letter-spacing: 0.02em;
      color: #027536 /*!important*/;
      padding: 16px 0 !important;
    }
    #right-sidebar .box-calendar .day {
      font-family: "Be Vietnam Pro";
      font-style: normal;
      font-weight: 400;
      font-size: 13px;
      line-height: 15px;
      color: #027536;
      letter-spacing: 0.02em;
    }
    #right-sidebar .box-calendar .day,
    #right-sidebar .box-calendar .dow {
      text-align: center;
      cursor: pointer;
      padding: 6px 0;
      background-size: 25px 25px;
      background-position: center;
      background-repeat: no-repeat;
      transition: all ease 0.4s;
      color: rgba(2, 117, 54, 1);
    }
    /* #right-sidebar .box-calendar .dow:nth-of-type(7n),
      #right-sidebar .box-calendar .dow:nth-of-type(7n + 1), */
    /* #right-sidebar .box-calendar .day:nth-of-type(7n), */
    /* #right-sidebar .box-calendar .day:nth-of-type(7n + 1), */
    #right-sidebar .box-calendar .day.new,
    #right-sidebar .box-calendar .day.old {
      opacity: 0.3;
    }
    #right-sidebar .box-calendar .day.today {
      background-image: url(../images/date-today.svg);
      color: #f2f2f2;
    }
    #right-sidebar .box-calendar .day.today.active {
      color: rgba(2, 117, 54, 1);
    }
  
    #right-sidebar .box-calendar .day.active {
      /* background-image: url(../images/date-active.svg); */
    }
    #right-sidebar .box-calendar .btn-register-disabled,
    #right-sidebar .box-calendar .btn-register {
      position: fixed;
      z-index: 10;
      background-color: #f7541c;
      border-radius: 40px;
      font-size: 14px;
      padding: 8px 16px;
      white-space: nowrap;
      display: none;
    }
    #right-sidebar .box-calendar .btn-register {
      cursor: pointer;
    }
    #right-sidebar .box-calendar .btn-register-disabled {
      background-color: #929292;
    }
    #right-sidebar .box-calendar .btn-register-disabled.active,
    #right-sidebar .box-calendar .btn-register.active {
      display: block;
    }
    #right-sidebar .box-calendar .btn-register-disabled.revert,
    #right-sidebar .box-calendar .btn-register.revert {
      transform: translateX(-100%) translateX(25px);
    }
    .filter-blur {
      filter: blur(10px);
    }
  
    #popup-register {
      display: block;
      position: fixed;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      display: flex;
      z-index: 310;
      opacity: 0;
      pointer-events: none;
      transition: all ease 0.4s;
      backdrop-filter: blur(3px);
    }
    #popup-register.open {
      pointer-events: all;
      opacity: 1;
    }
    #popup-register .box {
      margin: auto;
      width: 400px;
      padding: 16px;
      border-radius: 24px;
      background-color: #d3d3d3;
      transition: all ease 0.4s;
      transform: translateY(10px);
    }
    #popup-register.open .box {
      transform: translateY(0);
    }
    #popup-register .box .title {
      font-size: 20px;
      font-weight: 600;
      color: #05381c;
      margin-bottom: 32px;
    }
    #popup-register .box .input {
      color: #0d281e;
      font-size: 16px;
      padding: 8px 16px;
      border-radius: 16px;
      border: none;
      background-color: #fff;
      outline: none;
      width: 100%;
      font-family: inherit;
      resize: none;
    }
  
    #popup-register .box .input.text-area {
      height: 100px;
    }
  
    #popup-register .box .input-group {
      margin-bottom: 8px;
    }
    #popup-register .box .btn {
      padding: 8px 32px;
      background-color: #f7541c;
      border-radius: 50px;
      border: none;
      font-size: 16px;
      font-weight: 600;
      color: #fff;
      margin-left: auto;
      margin-right: auto;
      display: block;
      cursor: pointer;
    }
    #popup-register .close {
      position: absolute;
      z-index: 10;
      right: 16px;
      top: 16px;
      width: 26px;
      height: 26px;
      cursor: pointer;
    }
    #popup-register .close > img {
      display: block;
      width: 100%;
      height: 100%;
    }
    .section-question .lottie-bg {
      max-height: 1200px;
    }
    .section-banner .title {
      top: 82%;
    }
  }
  
  @media (max-width: 768px) {
    .silver-footer {
      max-width: none !important;
      margin: unset;
      padding: 0 24px;
    }
  }
  
  @media screen and (min-width: 750px) and (max-width: 767px) {
    .section-banner .title.active {
      transform: translateY(-145px);
      width: 374px;
      max-width: 330px;
      left: -4px;
    }
    .section-banner .content {
      height: 132vh;
    }
  }
  @media screen and (min-width: 700px) and (max-width: 750px) {
    .section-banner .title.active {
      transform: translateY(-145px);
      width: 374px;
      max-width: 330px;
      left: -4px;
    }
    .section-banner .content {
      height: 125vh;
    }
  }
  
  @media screen and (min-width: 635px) and (max-width: 700px) {
    .section-banner .title.active {
      transform: translateY(-160px);
      width: 374px;
      max-width: 330px;
      left: -4px;
    }
    .section-banner .content {
      height: 120vh;
    }
  }
  
  @media screen and (min-width: 588px) and (max-width: 635px) {
    .section-banner .title.active {
      transform: translateY(-185px);
      width: 374px;
      max-width: 330px;
      left: -4px;
    }
    .section-banner .content {
      height: 112vh;
    }
  }
  
  @media screen and (min-width: 547px) and (max-width: 588px) {
    .section-banner .title.active {
      transform: translateY(-224px);
      width: 374px;
      max-width: 330px;
      left: -4px;
    }
    .section-banner .content {
      height: 108vh;
    }
  }
  @media screen and (max-width: 500px) {
    .section-banner .title.active {
      transform: translateY(-286px);
      width: 374px;
      max-width: 330px;
      left: -4px;
    }
    .section-banner .content {
      height: 94vh;
    }
    .menu .header-menu {
      max-width: 400px !important;
    }
    .cill-2-images {
      bottom: 30px;
    }
  }
  @media screen and (max-width: 575px) {
  }
  @media screen and (max-width: 470px) {
    .section-banner .title.active {
      transform: translateY(-360px);
      width: 374px;
      max-width: 330px;
      left: -4px;
    }
    .section-banner .content {
      height: 88vh;
    }
  }
  @media screen and (max-width: 439px) {
    .section-banner .title.active {
      transform: translateY(-360px);
      width: 374px;
      max-width: 330px;
      left: -4px;
    }
    .section-banner .content {
      height: 80vh;
    }
  }
  
  @media screen and (max-width: 400px) {
    .menu .header-menu {
      max-width: 376px !important;
    }
  
    .section-banner .title.active {
      transform: translateY(-400px);
      width: 374px;
      max-width: 330px;
      left: -4px;
    }
    .section-banner .content {
      height: 76vh;
    }
  
    .menu .header-menu .btn {
      margin-left: 62px;
    }
  }
  
  @media screen and (min-width: 300px) {
    #bandroll {
      opacity: 1 !important;
    }
  }
  
  @media screen and (max-width: 373px) {
    .section-banner .title.active {
      transform: translateY(-400px);
      width: 374px;
      max-width: 330px;
      left: -4px;
    }
    .section-banner .content {
      height: 70vh;
    }
  }
  
  @media (max-width: 350px) {
    .title.active {
      transform: translateY(-444px);
      width: 374px;
      max-width: 330px;
      left: -4px;
    }
    .section-banner .content {
      height: 64vh;
    }
  }
  
  @media screen and (min-width: 1200px) {
    #main-content.enable {
      /* width: 570px; */
      margin-right: 0px;
      position: relative;
      transition: 1s;
    }
    #right-sidebar {
      display: flex;
    }
    #left-sidebar {
      /* width: 25vw; */
    }
    #main-content {
      margin-right: auto;
      margin-left: calc(50vw - 670px / 2);
    }
    #main-content.enable {
      width: calc(50vw + 436px / 2 - 180px);
      transition: 1s;
    }
  }
  @media screen and (min-width: 1440px) {
    #main-content.enable {
      width: calc(50vw + 436px / 2);
      margin-left: calc(50vw - 570px / 2 - 50px);
      margin-right: 80px;
    }
  }
  
  .change-theme.discussion-calendar .prev, 
  /* .change-theme..discussion-calendar .change-theme.datepicker-switch,  */
  .change-theme.discussion-calendar .next {
    color: #0d281e !important;
  }
  
  .change-theme.discussion-calendar .dow,
  .change-theme.discussion-calendar .day {
    color: #7d7d7d !important ;
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 600;
    font-size: 13px;
    line-height: 15px;
    letter-spacing: 0.02em;
  }
  
  .change-theme.discussion-calendar .today,
  .change-theme.discussion-calendar .active {
    color: #fff !important;
  }
  
  @media (max-width: 768px) {
    #main-content.homepage {
      margin-top: 52px;
    }
    #main-content.header-menu {
      margin-top: 25px;
      padding: 16px;
      max-width: none;
      position: relative;
    }
    .menu .header-items {
      /* padding-top: calc(100vh - 330px); */
      left: 0 !important;
    }
    .section-footer .item {
		text-align:-webkit-center!important;
	  }
	  .section-footer .items {
		  margin-bottom:0!important;
	  }
	  .section-footer {
		  padding:0px 0px 28px!important;
	  }

    .homepage .section-banner {
      margin-top: -20px;
      overflow: visible;
      width: 100%;
    }
  
    #left-sidebar,
    #right-sidebar {
      display: none;
    }
  
    .menu #lottie-bg-container {
      left: unset;
    }
  }
  
  @media (max-width: 1440px) {
    #main-content {
      width: 436px;
      margin-left: calc(50vw - 436px / 2 - 10px);
    }
    #left-sidebar {
      right: calc(50vw + 436px / 2 + 10px);
    }
  
    #right-sidebar {
      left: calc(50vw + 436px / 2 + 10px);
    }
  }
  
  @media (max-width: 576px) {
    #main-content.header-menu {
      margin-top: 15px;
    }
    .menu .header-items {
      /* padding-top: calc(100vh - 500px); */
    }
    #contact-button.contact-button-mobile .mess-btn {
      display: none;
    }
  
    #contact-button.contact-button-mobile .btn-respon .advise-btn {
      display: block !important;
    }
  }
  
  .more-post-label {
    position: absolute;
    width: 100%;
    padding: 30px;
    font-size: 204px;
    color: #f7541c;
    font-weight: 600;
    text-align: center;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  .more-post-label-1 {
    position: absolute;
    top: 50%;
    width: 100%;
    padding: 12px;
    transform: translateY(-50%);
    font-size: 176px;
    color: #faa012;
    font-weight: 700;
    text-align: center;
  }
  .under-footer {
    text-align: center;
  }
  .du-an-noi-bat .swiper-wrapper {
    margin-left: 16px;
  }
  .section-footer .under-footer img {
    max-width: 70px;
    margin-bottom: 15px;
  }
  .view-all:hover {
    background: #0b4628;
    transition: 0.4s ease;
    border: 1px solid #0b4628;
  }
  .view-all-yellow:hover {
    background: #0c3322;
    transition: 0.4s ease;
    border: 1px solid #0c3322;
  }
  /* @media (min-width: 1200px) {
    .section-footer .item {
      width: 12.2%;
    }
  } */
  
  #lottie-banner,
  #lottie-banner-start {
    position: absolute;
    width: 100%;
    aspect-ratio: 0.8;
    /*height: auto;*/
    object-fit: cover;
    margin-top: -16px;
    overflow: visible;
    transition: opacity 0.5s ease!important;
    will-change: opacity;
  }
  
  .banner-sidebar{
     max-width: 92%;
     align-self: center;
  }
  .banner-sidebar img
  {
      width: 100%;
      object-fit: cover;
      margin-top: 14px;
      aspect-ratio: 1;
      border-radius: 24px;
      border: 3px solid #0c3322;
  }
#video-banner{
    width: 100%;
    margin-top: 10px;
    transition: opacity .5s !important;
    border-radius: 24px;
	border:5px solid #0c3322;
    display: block;
}