/*=======================
        General 
=======================*/
html,
body {
    font-weight: 400;
    font-size: 18px;
    font-family: Nunito Sans;
    scroll-behavior: smooth;
}

::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.3);
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(90deg, #5E00AF 0%, #DC22FE 100%);
    border-radius: 8px;
    transition: all 0.3s ease-in-out 0s;
}

::-webkit-scrollbar-thumb:hover {
    background: #555;
}

/* 
p {
    font-size: 14px;
    line-height: 1.5;
    margin: 0 0 20px;

}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Gotham';
    color: #1f2a2e;
    font-weight: 900;
}

h3,
h4,
h5,
h6 {
    line-height: 1.3;
}

h1 {
    font-size: 54px;
}

h2 {
    font-size: 36px;
}

h3 {
    font-size: 36px;
}

h4 {
    font-size: 18px;
}

h5 {
    font-size: 16px;
}

h6 {
    font-size: 14px;
}

a:hover {
    text-decoration: none;
} */

a {
    /* -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    -ms-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s; */
    text-decoration: none;
    transition: all 0.3s ease-in-out 0s;
    -moz-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    -webkit-transition: all 0.3s ease-in-out 0s;
    -ms-transition: all 0.3s ease-in-out 0s;
}

:focus {
    outline: none;
}

img {
    max-width: 100%;
}

ul {
    padding: 0;
    margin: 0;
}

/*=======================
       Page Layout
=======================*/
body {
    background-color: #000;
}



.logo a {
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 32px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #fff;
    gap: 8px;
}

.logo a img {
    display: block;
}

.ht_mainmenu ul {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 40px;

}

.ht_mainmenu ul li a {
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0px;
    text-align: center;
    color: #FFFFFF;
    display: flex;
    align-items: center;
    gap: 16px;
}

.ht_mainmenu ul li a:hover {
    color: #D32BFF;
}


.ht_mainmenu ul li img {
    transition: all 0.3s ease-in-out 0s;
    position: absolute;
    top: 0;
    left: 0;
}

.ht_mainmenu ul li img.is-hover {
    opacity: 0;
    visibility: hidden;
}

.is-nohover {
    opacity: 1;
    visibility: visible;
}

@media (min-width:1025px) {
    .li-menu a:hover .arrow-menu .is-hover {
        opacity: 1;
        visibility: visible;
    }

    .li-menu a:hover .arrow-menu .is-nohover {
        opacity: 0;
        visibility: hidden;
    }

}

.ht_mainmenu ul li ul.ht-submenu {
    position: absolute;
    padding: 24px;
    box-shadow: 0px 2px 4px 0px #D95BFF40;
    border: 1px solid #212121;
    background: #121212;
    flex-direction: column;
    min-width: 280px;
    left: 0;
    top: 30px;
    border-radius: 12px;
    z-index: 3;
    gap: 16px;
}

.ht_mainmenu ul li ul.ht-submenu li {
    display: flex;
    align-items: center;
    gap: 16px;
    width: 100%;
}

.social-icon-submenu {
    display: flex;
    gap: 12px;
    align-items: center;
}

.ht_mainmenu ul li ul.ht-submenu li img {
    position: static;
    transition: 0s;
}

.ht_mainmenu ul li ul.ht-submenu li a {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
}

.ht_mainmenu ul li ul.ht-submenu li a:hover img {
    filter: brightness(0) saturate(100%) invert(19%) sepia(97%) saturate(4690%) hue-rotate(275deg) brightness(97%) contrast(103%);

}

.ht-submenu {
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease-in-out 0s;
}

.social-icon-submenu img {
    filter: none !important
}

.ht_mainmenu ul>li {
    display: flex;
    align-items: center;
    gap: 8px;
    position: relative;
}

.ht_mainmenu ul>li:hover .ht-submenu {
    opacity: 1;
    visibility: visible;
}

.arrow-menu {
    width: 20px;
    height: 20px;
    position: relative;
    display: inline-block;
}

.btn_header a {
    padding: 15px 55px;
}

.btn {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 20px;
    line-height: 24px;
    letter-spacing: 0%;
    text-align: center;
    color: #fff;
    /* box-shadow: 0px 4px 8px 0px #FCFBFB40 inset,
        0px 6px 24px 0px #BD1CF080; */
    border-radius: 100px;
    display: inline-block;
    position: relative;
    box-shadow: 0px 6px 24px 0px #BD1CF080;

}

/* .btn:before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 100px;
    background: linear-gradient(90deg, #4DA1FF 0%, #DC22FE 100%);
    transition: all 0.3s ease-in-out 0s;
    z-index: -1;

} */
.btn:before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 100px;
    background: linear-gradient(90deg, #5E00AF 0%, #DC22FE 100%);
    transition: all 0.3s ease-in-out 0s;
    z-index: -1;

}

.btn:hover {
    color: #000;
    box-shadow: 0px 4px 8px 0px #FFFFFF40 inset, 0px 6px 24px 0px #FFFFFF80;
    background: #FFF;

}

.wrap_header {
    padding: 16px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.content_hero_section {
    max-width: calc(100% - 390px);
}

.content_hero_section h1 {
    font-family: Orbitron;
    font-weight: 700;
    font-size: 120px;
    line-height: 130%;
    letter-spacing: 0px;
    text-transform: uppercase;
    color: #fff;
    margin-bottom: 24px;
}

.content_hero_section .ttl_hero3,
.content_hero_section .ttl_hero4 {
    font-family: Orbitron;
    font-weight: 600;
    font-size: 48px;
    line-height: 130%;
    letter-spacing: 0px;
    text-transform: uppercase;
    color: #fff;
}

.ttl_hero1 {
    align-items: end;
}

.ttl_hero2 {
    align-items: start;
}

.ttl_hero1,
.ttl_hero2 {
    display: flex;

}

.content_hero_section p {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #BBBBBB;
    max-width: 962px;
    margin-bottom: 40px;
}

.hero_section {
    display: flex;
    gap: 45px;
    align-items: center;
    padding-bottom: 84px;
    padding-top: 80px;
    position: relative;
}

.im_hero_section {
    position: absolute;
    top: 50%;
    right: 0;
    width: 500px;
    height: auto;
    display: flex
;
    align-items: center;
    justify-content: center;
    transform: translateY(-50%);

}

model-viewer {
    --poster-color: transparent;
    pointer-events: none;
    --progress-bar-color: transparent;
}

.im_hero_section model-viewer {
    width: 100%;
    height: 512px;

}

.wrap_btn_hero a {
    padding: 15px 37px;
    min-width: 180px;

}

.btn_hero_1 {
    padding: 14px 41px;
}

.btn_hero_2 {
    padding: 14px 35px;
}

.wrap_btn_hero {
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 16px;
}

.btn_hero_2 {
    color: #00E5BC;
    background: none;
    box-shadow: none;
    background-clip: padding-box;
    position: relative;

}

.btn_hero_2:before {
    background: linear-gradient(271.64deg, #4DA1FF 3.79%, #00E5BC 105.24%);
    opacity: 0;
}

.btn_hero_2::before {
    opacity: 0 !important;
}

.btn_hero_2:hover::before {
    opacity: 1 !important;
}

.btn_hero_2:hover {
    color: #000;
    box-shadow: none;
    background: none;
}

.btn_hero_2:hover:before {
    opacity: 1;
}

.btn_hero_2::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 50px;
    padding: 2px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;

    background: linear-gradient(271.64deg, #4DA1FF 3.79%, #00E5BC 105.24%);


}

.quick_info {
    border: 2px solid transparent;
    background-clip: padding-box;
    position: relative;
    border-radius: 24px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    align-items: center;
    overflow: hidden;
}

.mg-8 {
    padding-top: 80px;
    padding-bottom: 80px;

}

.quick_info::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 24px;
    padding: 2px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;

    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%);


}

.item_quick_info {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
    padding: 40px;
    transition: all 0.3s;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.2) 100%);

}

.img_quick_info {
    width: 120px;
}

.img_quick_info img {
    display: block;
}

.cont_quick_info {
    width: calc(100% - 120px - 24px);
}

.ttl_hero3 {
    margin-bottom: 19px;
}

.ttl_hero4 {
    margin-top: 23px;
}

.cont_quick_info p {
    font-family: Orbitron;
    font-weight: 700;
    font-size: 40px;
    line-height: 120%;
    letter-spacing: -2%;
    text-transform: uppercase;
    color: #fff;
    margin-bottom: 4px;
}

.cont_quick_info span {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #BBBBBB;

    display: block;
}

span.light {
    color: #fff;
}

.ttl h2,
.ttl h1 {
    font-family: Orbitron;
    font-weight: 700;
    font-size: 64px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: uppercase;
    color: #fff;
    margin-bottom: 24px;
}

.ttl p {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 24px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #BBBBBB;
    margin-bottom: 0;
}

.ttl_features {
    margin-bottom: 64px;
}

.wrap_features {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 50px;
    background-attachment: fixed;
    background-position: center left 125px;
    background-repeat: no-repeat;
    position: relative;

}

.jarallax {
    position: relative;
    z-index: 0;
}

.feature_bg {
    background-image: url('../images/Rectangle 6668102.png');
    position: absolute;
    top: 200px;
    left: 0;
    width: 745px;
    height: 900px;
    background-repeat: no-repeat;
    background-position: left center;
    background-size: contain;
    /*background-attachment: fixed;*/
    z-index: -1;
}


.menu_mobile {
    display: none;
}

.l_features {
    width: 584px;
}

.r_features {
    max-width: 896px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
}

.box_features {
    padding: 71px 40px;
    position: relative;

}

.box_features img {
    display: block;
    margin-bottom: 24px;
}

.box_features h3 {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 28px;
    line-height: 120%;
    letter-spacing: 0%;
    color: #fff;
    margin-bottom: 8px;
}

.box_features p {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #bbb;
    margin-bottom: 0;
}

.icon_box_features {
    width: 16px;
    height: 16px;
    position: absolute;
}

.icon_box_features:nth-child(1) {
    top: 0;
    left: 0;
    border-top: 2px solid #FFFFFF;
    border-left: 2px solid #FFFFFF;
}

.icon_box_features:nth-child(2) {
    top: 0;
    right: 0;
    border-top: 2px solid #FFFFFF;
    border-right: 2px solid #FFFFFF;
}

.icon_box_features:nth-child(3) {
    bottom: 0;
    left: 0;
    border-bottom: 2px solid #FFFFFF;
    border-left: 2px solid #FFFFFF;
}

.icon_box_features:nth-child(4) {
    bottom: 0;
    right: 0;
    border-bottom: 2px solid #FFFFFF;
    border-right: 2px solid #FFFFFF;
}

.ttl_technology a {
    padding: 15px 48px;
    margin-top: 40px;
}

#wrapper {
    /* max-width: 1920px; */
    margin: 0 auto;
    overflow: hidden;
    position: relative;
}

.site-header,
.site-footer {
    /*max-width: 1920px;*/
    margin: 0 auto;
}

/* bg */
.bg_1,
.bg_3 {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}

.bg_3 {
    top: -500px;
}

.bg_2 {
    position: absolute;
    top: 0;
    right: 0;
    z-index: -1;
}

.jarallax {
    transition: transform 0.3s ease-out;
}

.bg_4 {
    position: absolute;
    background: url(../images/image68.png) no-repeat center;
    top: 0;
    width: 736px;
    left: 50%;
    margin-left: -368px;
    height: 100%;
    z-index: -1;
}

.bg_4_4 {
    position: absolute;
    bottom: 100px;
    right: 0;
    z-index: -1;
}

.bg_5 {
    position: absolute;
    top: -100px;
    left: 0;
    z-index: -1;
}

.bg_6 {
    position: absolute;
    top: -900px;
    right: 0;
    z-index: -1;
}

.bg_7 {
    position: absolute;
    bottom: -600px;
    right: 0;
    z-index: -1;
}

.bg_8 {
    position: absolute;
    bottom: -600px;
    left: 0;
    z-index: -1;
}

.bg_9 {
    position: absolute;
    top: 0;
    right: 0;
    z-index: -1;
}

.bg_10 {
    position: absolute;
    top: -300px;
    left: 0;
    z-index: -1;
}

.bg_11 {
    position: absolute;
    /* top: 600px; */
    top: 400px;
    right: 0;
    z-index: -1;
}

.bg_12 {
    position: absolute;
    top: 50%;
    left: 0;
    z-index: -1;
}

.bg_13 {
    position: absolute;
    top: 100px;
    right: 0;
    z-index: -1;
}

.bg_14 {
    position: absolute;
    top: 500px;
    left: 0;
    z-index: -1;
}

.bg_15 {
    position: absolute;
    bottom: 500px;
    right: 0;
    z-index: -1;
}

.bg_16 {
    position: absolute;
    bottom: -200px;
    left: 0;
    z-index: -1;
}

body.airdrop .bg_8 {
    bottom: 0;
}

.ttl_technology {
    margin-bottom: 80px;
}

.wrap_technology {
    display: grid;
    grid-template-columns: calc(49% - 40px) 51%;
    gap: 40px;
    align-content: center;
}

.box_technology {
    padding: 48px;
    backdrop-filter: blur(10px);
    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);
    border-radius: 24px;
    position: relative;
    border: 2px solid transparent;
    background-clip: padding-box;
    min-height: 394px;
}

.box_technology::after {

    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 24px;
    /* Bo góc theo item */
    padding: 2px;
    /* Độ dày của border */
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;

    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%);
}

.box_technology h3 {
    font-family: Nunito Sans;
    font-weight: 800;
    font-size: 64px;
    line-height: 120%;
    letter-spacing: 0%;
    color: #fff;
}

.box_technology p {


    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 24px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #bbb;
    margin-bottom: 0;
}

.l_technology .box_technology img {
    display: block;
    margin: 0 auto -20px;
}

.r_technology .box_technology {
    display: flex;
    flex-direction: column;
    justify-content: end;
}

.r_technology .box_technology:nth-child(1) {
    margin-bottom: 40px;
}

.r_technology .box_technology:nth-child(1) img {
    position: absolute;
    top: -120px;
    right: 0;
    z-index: 1;
}

.r_technology .box_technology:nth-child(2) img {
    position: absolute;
    top: -129px;
    z-index: 1;
    right: -51px;
}

.technology {
    position: relative;
}

.technology::after {
    position: absolute;
    width: 100%;
    height: 100%;
    content: '';


    background-position: center bottom;
    left: 0;
    z-index: -1;
    bottom: 0;
    /* background-attachment: fixed; */
}


.wrap_ecosystem {
    padding-top: 180px;
    /* display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px; */
}

.box_ecosystem {
    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);
    backdrop-filter: blur(10px);
    border-radius: 24px;
    padding: 46px;
    display: flex;
    flex-direction: column;
    justify-content: end;
    position: relative;
    min-height: 478px;
    border: 2px solid transparent;
    background-clip: padding-box;
    float: left;
    margin: 0 13.33px;
    width: calc(33.33% - 26.66px);
}

.box_ecosystem::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 24px;
    padding: 2px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;

    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%);
}

.box_ecosystem img {
    position: absolute;
    top: -180px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
    transition: all 0.3s;
}

.box_ecosystem:hover img {
    transform: translateX(-50%) translateY(-16px) !important;

}

.box_ecosystem h3 {
    color: #fff;
    font-family: Nunito Sans;
    font-weight: 800;
    font-size: 64px;
    line-height: 120%;
    letter-spacing: 0%;

}

.box_ecosystem p {
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 24px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #bbb;
    margin-bottom: 0;
}

.box_ecosystem:nth-child(1) {
    margin-top: 100px;
}

.box_ecosystem:nth-child(3) {
    margin-top: 200px;
}

.clear {
    clear: both;
}


/* Timeline */
.timeline {}

.timeline {
    width: 100%;
    height: 4px;

    background: linear-gradient(90deg, rgba(36, 196, 220, 0.2) -20.14%, #E64DFF 100%);
    position: relative;

}

.timeline::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%) rotate(45deg);
    width: 15px;
    height: 15px;
    background: #E64DFF;
}

/* Phases */
.phase {
    max-width: 360px;
    background: #FFFFFF1A;
    position: relative;
    border: 2px solid transparent;
    background-clip: padding-box;
    border-radius: 24px;
    min-height: 427px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.phase::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 24px;
    padding: 2px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;

    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%);
    transition: all 0.3s ease-in-out 0s;
}

.wrap_roadmap {
    position: relative;
    z-index: 2;
}

.content-block {
    padding: 32px 24px;
}

.content-block h3 {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 28px;
    line-height: 120%;
    letter-spacing: 0%;
    color: #fff;
    margin-bottom: 8px;
}

.content-block ul {
    list-style: none;
}

.content-block ul li {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #bbb;
}

.content-block ul>ul {
    padding-left: 10px;
    padding-bottom: 0;
}

.time-marker {
    padding: 22px 55px 22px 56px;
    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);
    text-align: center;
    border-radius: 0 0 24px 24px;
    transition: all 0.3s ease-in-out 0s;
    position: relative;
}

.abs_time {
    display: inline-block;
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 20px;
    text-align: center;
    letter-spacing: 0%;
    text-transform: uppercase;
    width: 164px;
    height: 40px;
    line-height: 40px;
    color: #000;
    background: #BBBBBB;
    border-radius: 100px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: -28px;
    overflow: hidden;
    transition: all 0.3s ease-in-out;
}

.abs_time::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(271.64deg, #4DA1FF 3.79%, #00E5BC 105.24%);
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
    border-radius: 100px;
    z-index: -1;
}

.phase-active .abs_time::before {
    opacity: 1;
}

.phase-active .abs_time {
    color: #fff;
}


.time-marker p {
    color: #fff;
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 32px;
    line-height: 150%;
    letter-spacing: 0%;
    margin-bottom: 0;
}

.time-marker span {
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 24px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #bbb;
    display: block;
}

.phases {
    margin: 0 -30px;

}

.phase {
    width: 25%;
    float: left;
    margin: 0 30px;
    position: relative;
}

.phase::after {}

.inner_pha {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 427px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.phase-active .time-marker {
    background: linear-gradient(90deg, #4DA1FF 0%, #DC22FE 100%);

}

.phase-active::after {
    background: linear-gradient(90deg, #4DA1FF 0%, #DC22FE 100%);


}

.inner_pha::before {
    content: "";
    position: absolute;
    width: 68px;
    height: 69px;
    background-image: url('../images/Glass Materials@1-1410x721 3.png');
    background-position: center;
    background-repeat: no-repeat;
    left: 50%;
    transform: translateX(-50%);

    bottom: -157px;
}

.phase-active .inner_pha::before {
    background-image: url('../images/Glass\ Materials.png');

}

.r_technology {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.inner_pha::after {
    left: 50%;
    transform: translateX(-50%);
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.6) 100%);
    width: 4px;
    height: 122px;
    content: "";
    position: absolute;
    z-index: -1;
    top: -120px;

}

.phase:nth-child(odd) .inner_pha::after {
    top: auto;
    bottom: -120px;
}

.phase:nth-child(1) .inner_pha::after {
    background: linear-gradient(90deg, #24C4DC 0%, rgba(36, 196, 220, 0) 100%);


}

.phase:nth-child(even) .inner_pha::before {
    top: -157px;
    bottom: auto;
}

.phase:nth-child(even) {
    margin-top: calc(427px + 244px) !important;
}

.wrap_roadmap {
    position: relative;
}

.timeline {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
}

.wrap_bg {
    position: relative;
}

.wrap_bg {
    /* 
    background-image: url('../images/bg.png');
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed; */

}

.bg_section_1 {
    background: url('../images/bg.png');
    background-position: center;
    background-repeat: no-repeat;
    /* max-width: 1489px; */
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;

    bottom: 0;
    z-index: -1;

}

.community .container {
    max-width: 1216px;
    position: relative;
    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);
    backdrop-filter: blur(10px);
    border: 2px solid transparent;
    border-radius: 24px;
    background-clip: padding-box;

}

.wrap_community {
    max-width: 976px;
    margin: 0 auto;
}

.community .container::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 24px;
    padding: 2px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;

    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%);

}

.ttl_community {
    text-align: center;
    margin-bottom: 48px;
}

.form_community {
    max-width: 640px;
    margin: 0 auto;
}

@media (min-width: 768px) {
    .form_community form {
        width: 100%;
        position: relative;
        background: rgba(102, 102, 102, 1);
        border-radius: 50px;
        overflow: hidden;
        border: 2px solid transparent;
        background-clip: padding-box;
    }

    .form_community form::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        border-radius: 50px;
        padding: 2px;
        -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        -webkit-mask-composite: xor;
        mask-composite: exclude;
        pointer-events: none;

        background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%);


    }
}

.form_community form p {
    margin: 0;
}

.form_community form input {
    padding: 23px 190px 22px 31px;
    height: 70px;
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #fff;
    background: none;
    border: none;
    width: 100%;
}

.form_community form input::placeholder {
    color: #BBBBBB;
}

.form_community form button {
    padding: 14px 56px;
    position: absolute;
    top: 50%;
    right: 8px;
    transform: translateY(-50%);
    outline: none;
    border: none;
    background: none;
    cursor: pointer;
}

.form_community form button:hover::before {
    opacity: 0;
}

.ttl_community h2 {
    font-family: Orbitron;
    font-weight: 700;
    font-size: 40px;
    line-height: 120%;
    letter-spacing: -2%;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.ttl_community p {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #bbb;
}

.community {
    position: relative;
}

.item_community {
    position: absolute;
    z-index: -1;
    right: 0;
    top: -130px;
    width: 571px;
    bottom: 0;
    background: url('../images/community.png') no-repeat bottom center;
    height: 690px;
}


.footer_bottom {
    position: relative;
    overflow: hidden;
}

.footer_bottom::after {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 100%);
    height: 82px;
    width: 100%;
    position: absolute;
    bottom: 0;
    z-index: -1;
    left: 0;
    content: '';
}

.text_bg_footer {
    font-family: Orbitron;
    font-weight: 700;
    font-size: 300px;
    line-height: 100%;
    letter-spacing: 80px;
    text-align: center;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.1);
    position: absolute;
    bottom: -87px;
    left: 50%;
    transform: translateX(-50%);
    z-index: -1;

}

.footer {
    position: relative;
    z-index: 1;
}

.copyright {
    padding: 85px 0 60px;
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #BBBBBB;
    text-align: center;
}

.copyright a {
    background: linear-gradient(90deg, #4DA1FF 0%, #DC22FE 100%);

    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    transition: all 0.3s;
    text-decoration: none;


}

.copyright a:hover {
    color: #fff;
    background: none;
    -webkit-text-fill-color: aliceblue;
}

.footer .container {
    display: flex;
    gap: 88px;
    flex-wrap: wrap;
}



.info_footer {
    width: 320px;

}

.info_footer .logo a {
    justify-content: start;
    margin-bottom: 12px;
}

.info_footer p {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #bbb;
    margin-bottom: 32px;

}

.info_footer ul {
    display: flex;
    gap: 8px 16px;
    align-items: center;
    justify-content: start;
    list-style: none;
}

.info_footer ul li a:hover img,
.social_menu li a:hover img {
    filter: brightness(0) invert(1);
}

.info_footer ul li a i {
    font-size: 36px;
    color: #999999;
}

.info_footer ul li a {
    display: block;
}

.wrap_widget {
    width: calc(100% - 320px - 88px);
}

.wrap_widget {
    display: flex;
    gap: 88px;
    justify-content: space-between;
}

.widget h2 {

    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 24px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #fff;
    margin-bottom: 24px;
}

.widget ul {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.widget ul li a {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    color: #999999;
    white-space: nowrap;
    display: block;
}

.widget ul li a:hover {
    color: #fff;
}


/* presale page */

.buy_section {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 23px;
    padding-top: 60px;
    padding-right: 58px;
    padding-left: 180px;
}

.l_buy_section {

    padding: 36px;
    border-radius: 24px;
    position: relative;
    border: 2px solid transparent;
    background-clip: padding-box;
    border: 1px solid;

    backdrop-filter: blur(10px);

    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);

}

.l_buy_section::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 24px;
    padding: 1px;
    /* Độ dà y của border */
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

.l_buy_section {
    width: 612px;


}

.r_buy_section {
    width: calc(100% - 612px - 23px);
}

.r_buy_section .im_hero_section {
    position: initial;
    transform: none;

}

.r_buy_section img {
    display: block;
    margin: 0 auto 0 200px;
}

.ttl_buy_section h2 {
    font-family: Nunito Sans;
    font-weight: 800;
    font-size: 36px;
    line-height: 100%;
    letter-spacing: 0px;
    color: #fff;
    text-align: center;
}

.ttl_buy_section h2 span {
    color: #E323FF;
}

.ttl_buy_section p {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 24px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #bbb;
    text-align: center;
    margin-bottom: 24px;
}

.time_section {
    display: flex;
    gap: 40px;
    align-items: center;
    justify-content: center;
}

.col_time_section {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    margin-bottom: 24px;
}

.col_time_section p {

    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 64px;
    line-height: 100%;
    letter-spacing: 0px;
    margin: 0;

    color: #fff;
}

.col_time_section span {
    display: block;
    font-family: Nunito Sans;
    font-weight: 500;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0px;
    color: #fff;
}

.ttl_wrap_price {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    color: #F1F2F3;
    margin-bottom: 8px;
}

.ttl_wrap_price p {
    margin: 0;
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
}

.line_price {
    height: 12px;
    width: 100%;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.2);

    position: relative;
    overflow: hidden;
}

.line_price_color {
    position: absolute;
    top: 0;
    border-radius: 8px;
    left: 0;
    height: 100%;
    width: 150px;
    background: linear-gradient(90deg, #5E00AF 0%, #DC22FE 100%);
    box-shadow: 0px 4px 8px 0px #FCFBFB40 inset,
        0px 6px 24px 0px #BD1CF080;

}

.wrap_price {
    margin-bottom: 24px;
}

.ttl_wrap_cont_formbuy {
    position: relative;
    text-align: center;
    margin-bottom: 24px;

}

.ttl_wrap_cont_formbuy p {
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 20px;
    line-height: 24px;
    letter-spacing: -1%;
    text-align: center;
    color: #F1F2F3;
    display: inline-block;
    margin: 0;

}

.ttl_wrap_cont_formbuy::after,
.ttl_wrap_cont_formbuy::before {
    width: 100%;
    height: 1px;
    width: 220px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.2);
    position: absolute;
    top: 50%;
    content: '';
    left: 0;
    transform: translateY(-50%);

}

.ttl_wrap_cont_formbuy::before {
    left: auto;
    right: 0;

}

.checkout {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    align-items: center;
    gap: 8px;
    margin-bottom: 24px;
}

.checkbox_item {
    position: relative;
    overflow: hidden;
    border-radius: 100px;
}

.checkbox_item label {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 20px;
    line-height: 24px;
    letter-spacing: 0px;
    text-align: center;
    padding: 15px 40px;
    color: #666666;
    position: relative;
    cursor: pointer;
    z-index: 1;
    box-shadow: 0px 6px 24px 0px #BD1CF080;
    border: 1px solid #666666;
    border-radius: 100px;
    background: none;
}

.checkbox_item label::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 100px;
    padding: 2px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    z-index: -1;
    background: linear-gradient(271.64deg, #4DA1FF 3.79%, #00E5BC 105.24%);

    display: none;
}

.checkbox_item label:hover::after,
.checkbox_item input[type="radio"]:checked+label::after {

    display: block;
}

.checkbox_item label:hover,
.checkbox_item input[type="radio"]:checked+label {
    color: #00E5BC;

}

.checkbox_item input {
    position: absolute;
    margin: 0;
    opacity: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.row_cont_formbuy {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin-bottom: 24px;
}

.col_cont_formbuy {
    width: calc(50% - 8px);
}

.col_cont_formbuy label {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0px;
    color: #fff;
    display: block;
    margin-bottom: 4px;
}

.col_cont_formbuy input {
    border: 1px solid #52455C;
    background-color: #FFFFFF0D;
    border-radius: 8px;
    height: 54px;
    width: 100%;
    padding: 15px 52px 15px 20px;
    font-family: Nunito Sans;
    font-weight: 500;
    font-size: 20px;
    line-height: 24px;
    letter-spacing: 0px;
    color: #fff;
    -moz-appearance: textfield;
}

.col_cont_formbuy:nth-child(1) input {
    background-image: url('../images/eth.svg');
    background-position: center right 10px;
    background-repeat: no-repeat;
}

.col_cont_formbuy:nth-child(2) input {
    background-image: url('../images/xrp.svg');
    background-position: center right 10px;
    background-repeat: no-repeat;
}

.col_cont_formbuy input[type="number"]::-webkit-outer-spin-button,
.col_cont_formbuy input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.col_cont_formbuy input:focus {
    border: 1px solid #52455C;

}

.btn_buy_section {
    /* display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px; */

}

.btn_buy_section a {
    /* font-family: Nunito Sans;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 20px;
    border-radius: 100px;
    border: 1px solid;
    position: relative; */
    position: relative;
    padding: 15px 20px;
    display: block;
}

/* 
.btn_buy_section a:nth-child(1) {
    color: #00E5BC;
    border: 1px solid;
    background: none;
    box-shadow: none;
}

.btn_buy_section a:nth-child(1)::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 50px;
    padding: 1px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;

    background: linear-gradient(271.64deg, #4DA1FF 3.79%, #00E5BC 105.24%);


}

.btn_buy_section a:nth-child(1)::before {
    opacity: 0;
}

.btn_buy_section a:nth-child(1):hover::before {
    opacity: 1;
}

.btn_buy_section a:nth-child(1):hover {
    color: #000;
    background: linear-gradient(271.64deg, #4DA1FF 3.79%, #00E5BC 105.24%);
    box-shadow: none;
} */

.btn_buy_section a:nth-child(1):hover {
    /* box-shadow: 0px 4px 8px 0px #FCFBFB40 inset, 0px 6px 24px 0px #BD1CF080; */

}

/* .btn_buy_section a:nth-child(2) {
    color: #fff;
    background: linear-gradient(90deg, #4DA1FF 0%, #00E5BC 100%);
    border: none;

    box-shadow: 0px 4px 8px 0px #FCFBFB40 inset, 0px 6px 24px 0px #BD1CF080;
}

.btn_buy_section a:nth-child(2):hover {
    box-shadow: 0px 4px 8px 0px rgba(252, 251, 251, 0.25) inset, 0px 8px 32px 0px rgba(77, 161, 255, 0.5), 0px 8px 32px 0px rgba(0, 229, 188, 0.5);

} */

.buy_section {
    padding-bottom: 60px;
}





.box_ecosystem2 {
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: column;
}

.box_ecosystem2 .number_box_ecosystem {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: linear-gradient(270deg, #E323FF 0%, #7517F8 100%);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 32px;
    line-height: 24px;
    letter-spacing: 0px;
    margin-bottom: 12px;
    text-align: center;


}

.box_ecosystem2:nth-child(2) .number_box_ecosystem {
    background: linear-gradient(90deg, #4DA1FF 0%, #00E5BC 100%);

}

.box_ecosystem2 p {
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 24px;
    line-height: 100%;
    letter-spacing: 0px;
    text-align: center;

}

.box_ecosystem2 span {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0px;
    text-align: center;
    color: rgba(255, 255, 255, 0.6);
}

.click-mobile {
    display: none;
}

.ttl_about {
    text-align: center;
    margin-bottom: 80px;
}

.wrap_about {
    display: flex;
    gap: 100px;
    justify-content: center;
}

.presale_page .wrap_ecosystem {
    padding-top: 294px;
}

.presale_page .box_ecosystem {
    margin-top: 0 !important;
    min-height: 500px;
    float: none;
    width: 100% !important;
    margin: 0 !important;
}

.presale_page .wrap_ecosystem {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
}


@media (min-width:1281px) {
    .presale_page .box_ecosystem img {
        top: -214px;
    }
}

.presale_page .box_ecosystem h3 {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 32px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #fff;
}

.presale_page .box_ecosystem p {
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;

    color: #999;
    margin-bottom: 0;
}

.presale_page .box_ecosystem {
    padding: 24px;
}

.btn_ecosystem {
    text-align: center;
    margin-top: 80px;
}

.btn_ecosystem a {
    padding: 28px 84px;
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 32px;
    line-height: 24px;
    letter-spacing: 0px;
    text-transform: uppercase;
    text-align: center;

}

.ttl_tokenomics {
    margin-bottom: 80px;
}

.wrap_tokenomics {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 64px;
}

.info_tokenomics {
    max-width: calc(100% - 647px - 30px);
    width: 100%;
    display: flex;
    justify-content: end;

}

#tokenomicsChart {
    width: 100%;
    height: 100%;
}

/*.chart-container {
    position: relative;
    max-width: 600px;
    width: 600px;
    height: 600px;
    max-height: 600px;
    background: radial-gradient(circle, #222 30%, #111 100%);
    border-radius: 50%;
    box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.6);
}

.chart-container canvas {
    position: absolute;
    top: 0;
    left: 0;
}*/
.info_tokenomics ul {
    display: grid;
    list-style: none;
    gap: 48px 100px;
    grid-template-columns: repeat(2, 1fr);
    max-width: 706px;
    width: 100%;
}

.info_tokenomics ul li {
    display: flex;
    align-items: center;
    gap: 16px;
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 24px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #fff;
}

.relative {
    position: relative;

}

.info_tokenomics ul li div {
    width: 32px;
    height: 32px;
    border-radius: 50%;

}

.info_tokenomics ul li p {

    margin-bottom: 0;
    width: calc(100% - 32px - 16px);
}


.ttl_token_allocation {
    margin-bottom: 80px
}

.wrap_token_allocation {
    display: flex;
    gap: 40px;
    margin: 0 auto 80px;
    justify-content: center;
}

.col_token_allocation {
    position: relative;
    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);
    padding: 13px 24px;
    border-radius: 24px;
    display: inline-block;
}

.col_token_allocation::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 24px;
    padding: 1px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%);


}

.col_token_allocation p {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 24px;
    line-height: 150%;
    letter-spacing: 0%;
    text-align: center;
    margin-bottom: 8px;
}

.col_token_allocation h3 {
    color: #D32BFF;

    font-family: Nunito Sans;
    font-weight: 800;
    font-size: 64px;
    line-height: 120%;
    letter-spacing: 0%;
    text-align: center;
    margin: 0;

}

.table_token_allocation table {
    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);
    padding: 36px;
    border-radius: 24px;
    position: relative;
    max-width: 1395px;
    width: 100%;
    margin: 0 auto;
    border-spacing: 0;
}

.table_token_allocation table::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 24px;
    padding: 1px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;

    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%);

}

.table_token_allocation table tbody td {
    padding: 20px 0;
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    border-bottom: 1px solid #666666;
    text-align: left;
    color: #fff;
}

.table_token_allocation table tbody td:nth-child(1),
.table_token_allocation table tbody td:nth-child(2) {
    text-align: left;
}

.table_token_allocation table tbody tr:first-child td {
    padding-top: 24px;

}

.table_token_allocation table tbody tr:last-child td {
    padding-bottom: 0;
    border-bottom: none;
}

.table_token_allocation table thead th {
    padding-bottom: 25px;
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 24px;
    line-height: 150%;
    letter-spacing: 0%;
    text-align: left;
    color: #fff;
    border-bottom: 1px solid #fff;
    white-space: nowrap;

}

.text-center {
    text-align: center !important;
}

/* 
.token_allocation {
    background-image: url('../images/image 71.png');
    background-repeat: no-repeat;
    background-position: center bottom;
    background-attachment: fixed;
} */

.bg_token_allocation {
    background: url('../images/image 71.png');
    background-repeat: no-repeat;
    background-position: center bottom;
    position: absolute;
    top: 0;
    width: 514px;
    left: calc(50% - 257px);
    bottom: 0;
}

.ttl_answers_questions {
    margin-bottom: 80px;
}

.wrap_answers_questions {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
    max-width: 1240px;
    margin: 0 auto;

}

.box_answers_questions {
    position: relative;
    padding: 24px 23px 24px 24px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 600px;
    align-items: start;
}


.box_answers_questions img {
    display: block;
    margin-bottom: 28px;
}

.answers_questions {
    max-width: 1920px;
    margin: 0 auto;
}

.box_answers_questions h3 {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 28px;
    line-height: 120%;
    letter-spacing: 0%;
    color: #fff;
    margin-bottom: 12px;
}

.box_answers_questions p {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #888;
    margin-bottom: 0;
}

/* .answers_questions {
    background-image: url('../images/image 74.png');
    background-repeat: no-repeat;
    background-position: center right 68px;
    background-attachment: fixed;
} */

.row_token_allocation {
    display: none;
}

/* .bg_presale {
    background-image: url('../images/image 73.png');
    background-repeat: no-repeat;
    background-position: center left 350px;
    background-attachment: fixed;
} */
.bg_section_2 {
    background: url('../images/image 73.png');
    background-repeat: no-repeat;
    position: absolute;
    width: 912px;
    height: 912px;
    left: 350px;
    top: 8%;
    z-index: -1;
}

/* .bg_presale {
    position: absolute;
    top: 60%;
    left: 350px;
    z-index: -1;
    transform: translateY(-50%);
} */


.bg_answers_questions {
    position: absolute;
    right: 68px;
    bottom: 0;
    z-index: -1;
    background: url('../images/image 74.png') no-repeat center;
    width: 890px;
    top: 0;
}

.presale_page .item_community {
    top: -130px;
}

.tooltip {}

.tooltip li {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #fff;
    list-style: none;
    min-width: 180px;
    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);
    border-radius: 12px;
    padding: 12px 24px;
    position: absolute;
    display: inline-block;
    z-index: 3;
    /* opacity: 0; */
}

.tooltip li::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 12px;
    padding: 1px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%);
    border: 1px solid;
    z-index: 2;
}

.tooltip-1::before {
    width: 63px;
    height: 50px;
    content: "";
    position: absolute;
    background-image: url('../images/tooltip1.svg');
    left: -58px;
    bottom: -41px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.tooltip-1 {
    top: 90px;
    right: -160px;

}

.tooltip-2::before {
    width: 77px;
    height: 72px;
    content: "";
    position: absolute;
    background-image: url('../images/tooltip2.svg');
    right: -67px;
    top: -67px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.tooltip-2 {
    bottom: -67px;
    left: -60px;

}

.tooltip-3::before {
    width: 63px;
    height: 50px;
    content: "";
    position: absolute;
    background-image: url('../images/tooltip3.svg');
    right: -53px;
    bottom: -38px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.tooltip-3 {
    top: 5px;
    left: -125px;
}

.tooltip-4::before {
    width: 73px;
    height: 61px;
    content: "";
    position: absolute;
    background-image: url('../images/tooltip4.svg');
    right: -65px;
    bottom: -54px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.tooltip-4 {
    top: -55px;
    left: -85px;
}

.tooltip-5::before {
    width: 37px;
    height: 109px;
    content: "";
    position: absolute;
    background-image: url('../images/tooltip5.svg');
    right: -30px;
    bottom: -97px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.tooltip-5 {
    top: -95px;
    left: 30px;
}

.tooltip-6::before {
    width: 18px;
    height: 101px;
    content: "";
    position: absolute;
    background-image: url('../images/tooltip6.svg');
    right: -12px;
    bottom: -82px;

    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.tooltip-6 {
    top: -80px;
    left: 105px;
}

.tooltip li {
    z-index: 1;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s;
}

.tooltip li b {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 32px;
    line-height: 150%;
    letter-spacing: 0%;
    display: block;
    margin-top: 4px;
}

/* 
.chart-1hover .tooltip-1 {
    opacity: 1;
    visibility: visible;
}

.chart-2hover .tooltip-2 {
    opacity: 1;
    visibility: visible;
}

.chart-3hover .tooltip-3 {
    opacity: 1;
    visibility: visible;
}

.chart-4hover .tooltip-4 {
    opacity: 1;
    visibility: visible;
}

.chart-5hover .tooltip-5 {
    opacity: 1;
    visibility: visible;
}

.chart-6hover .tooltip-6 {
    opacity: 1;
    visibility: visible;
} */

@media (max-width: 1024px) {
    .jarallax {
        display: none !important;
    }
}

/* airdrop */

.m-24 {
    margin-bottom: 24px;

}

.m-12 {
    margin-bottom: 12px;
}



/* blog */
.hero_blog {
    margin: 60px 0 80px;
    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);
    border-radius: 24px;
}

.hero_blog {
    display: flex;
    align-items: center;
    gap: 30px;
    justify-content: space-between;
    padding: 87px 60px 88px;
}

.r_hero_blog img {
    border-radius: 24px;
    display: block;
    transition: all 0.3s;
}

.r_hero_blog img:hover {
    transform: scale(1.1);
}

.r_hero_blog a {
    border-radius: 24px;
    display: block;
    overflow: hidden;
}

.r_hero_blog {
    width: 670px;
}

.l_hero_blog {
    width: calc(100% - 670px - 30px);
}

.l_hero_blog span {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 20px;
    line-height: 24px;
    letter-spacing: 0px;
    margin-bottom: 24px;
    color: #E323FF;
    display: block;
}

.l_hero_blog h1 a {
    font-family: Nunito Sans;
    font-weight: 800;
    font-size: 64px;
    line-height: 120%;
    letter-spacing: 0%;
    margin-bottom: 16px;
    color: #fff;
    display: block;
}

.l_hero_blog h1 a:hover {}

.l_hero_blog p {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #888888;
    margin-bottom: 32px;
}

.l_hero_blog .btn_hero_2 {
    padding: 15px 66px;
}

.title_blog {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 60px;
}

.title_blog h2 {
    margin-bottom: 0;
}

.form-search {
    max-width: 531px;
    position: relative;
    border-radius: 50px;
    width: 100%;
}

.form-search::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 50px;
    padding: 1px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%);


}

.form-search input {
    border-radius: 50px;
    width: 100%;
    height: 68px;
    padding: 21px 21px 21px 74px;
    background: #666666;
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #fff;
    border: none;
    background-image: url('../images/search-normal.svg');
    background-repeat: no-repeat;
    background-position: center left 32px;
}

.form-search input::placeholder {
    color: #888888;
}

.row_blog {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 60px 41px;
}

.thumbnail_blog a img {
    border-radius: 24px;
    display: block;
    transition: all 0.3s;
}

.thumbnail_blog a img:hover {}

.thumbnail_blog a {
    margin-bottom: 24px;
    display: block;
    overflow: hidden;
}

.date-blog {
    color: #888888;
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    margin-bottom: 16px;
}

.info-blog h3 a {
    display: block;
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 28px;
    line-height: 120%;
    letter-spacing: 0%;
    text-transform: uppercase;
    margin-bottom: 16px;
    color: #fff;
}

.info-blog h3 a:hover {}

.info-blog .excerpt {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #888888;
    margin-bottom: 24px;
}

.blog-post .btn_hero_2 {
    padding: 15px 66px;
}

.row_blog {
    padding-bottom: 60px;
    border-bottom: 1px solid #888888;
}

.load-more-blog {
    text-align: center;
    padding-top: 40px;
}

.load-more-blog a {
    padding: 15px 40px;

}

.wrap_blog {
    padding-bottom: 90px;
    position: relative;
}

.bg-blog1 {
    position: absolute;
    left: 0;
    top: -400px;
    z-index: -1;
}

.bg-blog-2 {
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: -1;
}

/* Press Kit */
.hero_press {
    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);
    border-radius: 24px;
    padding: 22px 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    margin: 136px 0 120px;

}

.info_hero_press {
    max-width: 780px;
}

.info_hero_press h1 {
    font-family: Orbitron;
    font-weight: 700;
    font-size: 80px;
    line-height: 100%;
    letter-spacing: 0px;
    text-transform: uppercase;
    margin-bottom: 24px;
    color: #fff;
}

.info_hero_press p {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 24px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #888888;
    margin-bottom: 0;
}

.row_press .container {
    display: grid;
    gap: 40px;
    grid-template-columns: repeat(2, 1fr);
}

.btn_down {
    padding: 15px 50px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.list_btn {
    display: grid;
    gap: 16px;
    flex-wrap: wrap;
    grid-template-columns: repeat(2, 1fr);
    align-items: center;
}

.list_btn a img {
    margin: 0 !important;
}

.item_press h2 {
    font-family: Orbitron;
    font-weight: 600;
    font-size: 40px;
    line-height: 120%;
    letter-spacing: -2%;
    color: #FFFFFF;
    margin-bottom: 32px;
}

.box_press {
    border: 1px solid #888888;
    border-radius: 24px;
    padding: 60px 32px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 681px;
}

.box_press p {
    padding-left: 12px;
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 32px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #fff;
    margin-bottom: 0;
}

.box_press img {
    display: block;
    margin: 0 auto;
}

.row_press {
    padding-bottom: 134px;
    position: relative;
}

.bg-press {
    position: absolute;
    z-index: -1;
    left: 0;
    top: -300px;
}


/* help */
.ttl_hero_help h1 {
    font-family: Orbitron;
    font-weight: 700;
    font-size: 64px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: uppercase;
    margin-bottom: 40px;
    color: #fff;
}

.ttl_hero_help {
    text-align: center;
    margin: 80px 60px;
}

.ttl_hero_help form {
    margin: 0 auto;
}

.getting-started {

    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);
    padding: 36px;
    border-radius: 24px;
}

.cont-getting-started {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
}

.getting-started h2 {
    font-family: Orbitron;
    font-weight: 700;
    font-size: 32px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: uppercase;
    color: #fff;
    margin-bottom: 50px;
}

.cont-getting-started a {
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 28px;
    line-height: 120%;
    letter-spacing: 0%;
    display: block;
    color: #fff;
    padding-right: 20px;
    background-image: url('../images/weui_arrow-outlined.svg');
    background-repeat: no-repeat;
    background-position: center right;
}

.cont-getting-started a:hover {
    text-decoration: underline;
}

.hero_help {
    padding-bottom: 165px;
}

.row_help {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 140px 40px;
    padding-bottom: 300px;
}

.item_help {
    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);
    border-radius: 24px;
    position: relative;
    display: flex;
    align-items: end;
    justify-content: center;
    min-height: 428px;
    padding: 0 24px 36px;
}

.item_help::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 24px;
    padding: 1px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%);

}

.item_help:hover .img_help img {
    transform: scale(1.08);
}

.img_help img {
    transition: all 0.3s;
    display: block;
    margin: 0 auto;
}

.img_help {
    position: absolute;
    left: 0;
    top: -115px;
    z-index: 1;
    display: flex;
    /* min-height: 295px; */
    width: 100%;
    align-items: center;
    z-index: 1;
}

.info_help h3 {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 32px;
    line-height: 150%;
    letter-spacing: 0%;
    text-align: center;
    color: #fff;
    margin-bottom: 16px;
}

.info_help p {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 24px;
    line-height: 150%;
    letter-spacing: 0%;
    text-align: center;
    color: #888888;
    margin-bottom: 32px;
}

.info_help span {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 24px;
    line-height: 150%;
    letter-spacing: 0%;
    text-align: center;
    color: #E323FF;
    display: block;
}

/* faq */
.hero_faq {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 31px 74px 31px 60px;
    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);
    border-radius: 24px;
    margin: 80px 0;
}

.hero_faq h1 {
    margin-bottom: 16px;
}

.ttl_hero_faq {
    max-width: 565px;
}

.content-faq .container {
    /* display: flex;
    flex-wrap: wrap;
    gap: 60px; */
}

.sidebar-faq {
    width: 420px;
    padding-top: 10px;
}

.inner-content-faq {
    width: calc(100% - 420px - 60px);
    padding-top: 10px;
}

.inner-content-faq h2 {
    font-family: Orbitron;
    font-weight: 700;
    font-size: 64px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: uppercase;
    margin-bottom: 60px;
    color: #FFFFFF;
}

.inner-content-faq h3 {
    font-family: Orbitron;
    font-weight: 700;
    font-size: 32px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: uppercase;
    color: #FFFFFF;
    margin-bottom: 24px;
}

.inner-content-faq,
.inner-content-faq p {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    color: #FFFFFF;
    letter-spacing: 0%;
    margin-bottom: 40px;
}

.menu-title-faq {
    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);
    border-radius: 24px;
    position: relative;
    margin-top: 24px;
    padding: 32px 16px;
    display: flex;
    gap: 12px;
    flex-direction: column;
}

.menu-title-faq::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 24px;
    padding: 1px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%);
}

.menu-title-faq a {
    display: flex;
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #888888;
    align-items: center;
}

.menu-title-faq a:hover {
    color: #FFF;
}

.faq-h3 a span {
    min-width: 50px;
    text-align: center;
}

.menu-title-faq a.active {
    color: #fff;
}



#sidebar.fixed {
    position: fixed;
    top: 0;
}

.content-faq {
    position: relative;
}

.content-faq .container {
    /* justify-content: end;
    position: relative; */
}

.inner-content-faq {
    float: right;
}

.sidebar-faq {
    float: left;
}

#sidebar {
    position: absolute;
}

.clear {
    clear: both;
}

/* wallet_page */
.wrap_hero_wallet {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
}

.l_hero_wallet {
    max-width: 775px;

}

.l_hero_wallet h1 {
    font-family: Orbitron;
    font-weight: 700;
    font-size: 40px;
    line-height: 120%;
    letter-spacing: -2%;
    text-transform: uppercase;
    color: #FFFFFF;
    margin-bottom: 24px;
}

.l_hero_wallet p {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    margin-bottom: 60px;
    color: #888888;
}

.l_hero_wallet span {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 28px;
    line-height: 120%;
    letter-spacing: 0%;
    margin-bottom: 24px;
    color: #fff;
    display: block;
}

.img_hero_wallet {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;

}

.img_hero_wallet img {
    display: block;
}

.img_hero_wallet a {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 14px 24px;
    border-radius: 12px;
    background: #fff;
    max-width: 260px;
}

.img_hero_wallet a:hover {
    opacity: 0.7;
}

.img_hero_wallet a p {
    font-family: Noto Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 100%;
    letter-spacing: 0%;
    color: #212121;
    margin-bottom: 0;
}

.img_hero_wallet a span {
    font-family: Noto Sans;
    font-weight: 700;
    font-size: 24px;
    line-height: 100%;
    letter-spacing: 0%;
    color: #212121;
    display: block;
    margin-bottom: 0;
}

.top_hero_wallet {
    background: linear-gradient(90deg, #5E00AF 0%, #DC22FE 100%);
    padding: 24px;
    border-radius: 24px 24px 0 0;
}

.info_wallet {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: space-between;
    margin-bottom: 16px;

}

.r_info_wallet {
    display: flex;
    gap: 4px;
    padding: 8px;
    background: #FFFFFF33;
    border-radius: 8px;
    align-items: center;
}

.r_info_wallet p {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #E2E2E2;
    margin-bottom: 0;
}

.r_hero_wallet {
    max-width: 512px;
    position: relative;
    border-radius: 24px;
    background: #000000;
    width: 100%;

}

.r_hero_wallet::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 24px;
    padding: 1px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;

    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%);


}

.l_info_wallet {
    display: flex;
    align-items: center;
    gap: 12px;

}

.copy_info_wallet img {
    display: block;
}

.cont_info_wallet {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #FFFFFF33;
    border-radius: 8px;
    padding: 8px;
}

.cont_info_wallet img {
    display: block;

}

.cont_info_wallet p {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #fff;
    margin-bottom: 0;
}

.cont_info_wallet span {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #E2E2E2;
    display: block;
}

.money_hero_wallet {
    display: flex;
    align-items: end;
    gap: 12px;
    margin-bottom: 16px;
}

.money_hero_wallet p {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 40px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #FFFFFF;
    margin-bottom: 0;
}

.money_hero_wallet span {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #9AE2AC;
    display: block;
    margin-bottom: 8px;
}

.line_wallet img {
    display: block;
    margin: 0 auto;
}

.bottom_hero_wallet {
    padding: 24px;
    border-radius: 0 0 24px 24px
}

.wrap-wallet-actions {
    margin-bottom: 24px;
    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);
    border-radius: 12px;
}

.wallet-actions {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    align-items: center;
    padding: 27px 65px;
    border-bottom: 1px solid #666666;
}

.wallet-action {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #FFFFFF;
}

.wallet-action img {
    display: block;
}

.bottom-wallet-actions {
    padding: 12px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 20px;
}

.price-wallet-actions {
    display: flex;
    gap: 8px;
    align-items: center;
}

.price-wallet-actions img {
    display: block;
}

.price-wallet-actions p {
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #FFFFFF;
    margin-bottom: 0;
}

.price-wallet-actions span {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #34C759;
    display: block;
}

.gas-station {
    display: flex;
    gap: 8px;
    align-items: center;
}

.gas-station img {
    display: block;
}

.gas-station p {
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #fff;
    margin-bottom: 0;
}

.gas-station span {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #888888;
}

.wallet-connection {
    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);
    border-radius: 12px;
    padding: 12px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.wallet-url {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

.wallet-url img {
    display: block;
    width: 32px;
}

.wallet-link {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #FFFFFF;
}

.wallet-status-indicator {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #888888;
}



.select2-container--default .select2-selection--single {
    background: none !important;
    border: none !important;
    border-radius: 0 !important;
    display: flex !important;
    gap: 8px;
    align-items: center;
    justify-content: space-between;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    padding: 0 !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered span {
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #FFFFFF;
    display: flex;
    align-items: center;

}

#wallet-network-select {
    width: 151px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
    display: none;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    width: 20px !important;
    height: 20px !important;
    background-image: url('../images/arrow-down.svg');
    background-repeat: no-repeat;
    position: initial !important;
    display: block;
}

.hero_wallet {
    padding: 89px 0 112px;
}

.ttl_wallet_different h2 {
    max-width: 985px;
}

.ttl_wallet_different p {
    max-width: 808px;
}

.ttl_wallet_different {
    margin-bottom: 80px;
}

.parent-placeholder {
    height: 550vh;
}

.timeline-section {
    /* height: 100vh; */
}

.cont_wallet_different {
    position: relative;
    height: 100vh;
    overflow: hidden;

}

.cont_wallet_different section {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    /* display: flex;
    align-items: center;
    justify-content: center;
    font-size: 48px; */
    opacity: 0;
    transition: all 0.6s cubic-bezier(0.65, 0, 0.35, 1);
    pointer-events: none;
    z-index: 0;

}

.cont_wallet_different section.active {
    pointer-events: auto;
    z-index: 1;
}


.box_wallet_different {
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
    justify-content: space-between;
    align-items: center;
    max-width: 1680px;
    margin: 0 auto;
}

.img_wallet_different {
    max-width: 800px;
    width: 100%;
    min-height: 500px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);
    border-radius: 24px;
    position: relative;
}

.img_wallet_different::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 24px;
    padding: 1px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;

    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%);


}

.info_wallet_different {
    max-width: 555px;
}

.info_wallet_different h3 {
    font-family: Orbitron;
    font-weight: 700;
    font-size: 32px;
    line-height: 100%;
    letter-spacing: 0%;
    color: #fff;
    text-transform: uppercase;
    margin-bottom: 24px;
}

.info_wallet_different p {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 28px;
    line-height: 120%;
    letter-spacing: 0%;
    color: #fff;
    margin-bottom: 12px;
}

.info_wallet_different span {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #888888;
    display: block;
}

.ttl-advanced-eatures p {
    max-width: 686px;
    margin-bottom: 27px;
}

.advanced-eatures-wallet {
    background: #070709;

}

.wrap-advanced-eatures-wallet {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;

}

.cont-advanced-eatures-wallet {
    max-width: 670px;
    width: 100%;
    display: flex;
    gap: 40px;
    flex-direction: column;
}

.box-advanced-eatures-wallet {

    position: relative;
    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);

    border-radius: 24px;

    padding: 36px;
}

.box-advanced-eatures-wallet::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 24px;
    padding: 1px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%);


}

.box-advanced-eatures-wallet h3 {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 32px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #FFFFFF;
    margin-bottom: 12px;
}

.box-advanced-eatures-wallet p {
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #999999;
    margin-bottom: 0;
    max-width: 485px;
}

.img-advanced-eatures-wallet img {
    display: block;
}

.img_wallet_different img {
    display: block;
}

.slider-crypto .item {
    padding: 0 12px;
}

.rabby-has .container {
    max-width: 1470px;
}

.rabby-has .ttl h2 {
    text-align: center;
    margin-bottom: 63px;
}

.slider-crypto {
    position: relative;
}

.slider-crypto::after {
    background: linear-gradient(90deg, #000000 0%, #000000 10%, rgba(0, 0, 0, 0) 50%, #000000 90%, #000000 100%);
    position: absolute;
    top: 0;
    left: 0;
    content: '';
    width: 100%;
    height: 100%;
    z-index: 1;
}

.rabby-has {
    margin-bottom: 127px;
}

.img-advanced-eatures-wallet img {
    animation: subtle-shake 2.5s infinite ease-in-out;
}

@keyframes subtle-shake {
    0% {
        transform: translate(0, 0);
    }

    20% {
        transform: translate(3px, -3px);
    }

    40% {
        transform: translate(-3px, 3px);
    }

    60% {
        transform: translate(3px, 3px);
    }

    80% {
        transform: translate(-3px, -3px);
    }

    100% {
        transform: translate(0, 0);
    }
}


.wrap-why-chose {
    display: grid;
    grid-template-columns: 470px 470px;
    /* luôn 2 cột mỗi cột đúng 470px */
    gap: 80px;
    justify-content: space-between;
    position: relative;
}

.box-why-chose {
    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);
    max-width: 470px;
    width: 100%;
    padding: 24px;
    border-radius: 24px;
    position: relative;
    transform: translate3d(100px, 50px, 0) rotateZ(8deg) scale(0.8);
    transition: none;
    will-change: transform, opacity;
}

.box-why-chose.right {
    transform: translate3d(-100px, 50px, 0) rotateZ(-8deg) scale(0.8);
}

.box-why-chose::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 24px;
    padding: 1px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;

    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%);

}

.box-why-chose img {
    display: block;
    margin-bottom: 28px;
}

.box-why-chose h3 {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 28px;
    line-height: 120%;
    letter-spacing: 0%;
    color: #fff;
    margin-bottom: 8px;
}

.box-why-chose p {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #888888;
    margin-bottom: 0;
}

.box-why-chose p strong {
    color: #fff;
}

.box-why-chose .number {
    font-family: Orbitron;
    font-weight: 700;
    font-size: 40px;
    line-height: 120%;
    text-transform: uppercase;
    color: #FFFFFF;
    position: absolute;
    right: 24px;
    top: 40px;
}

.ttl-why-chose {
    max-width: 582px;
    margin: 0 auto 104px;
    text-align: center;
}

.logo-why-chose {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.logo-why-chose img {
    display: block;
}

.logo-why-chose2 {
    display: none;
}

.text-logo-why-chose {
    position: absolute;
    width: 340px;
    top: 50%;
    left: 50%;
    /* transform: translate(-50%, -50%); */
    animation: spin 10s linear infinite;

}

.text-logo-why-chose img {
    display: block;
}

.logo-fixed {
    position: fixed !important;
    top: 50px;
    box-shadow: 0px 0px 50px 0px #FFFFFF80, 0px 5px 30px 0px #00000080 inset, 0px -5px 30px 0px #00000080 inset;
    border-radius: 50%;

}

.logo-stop {
    position: absolute !important;
}

@keyframes spin {
    from {
        transform: translate(-50%, -50%) rotate(0deg);
    }

    to {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}


.technology-2 .ttl_technology p {
    max-width: 1000px;
    text-align: center;
}

.technology-2 .ttl_technology {
    max-width: 1000px;
    text-align: center;
    margin: 0 auto 80px;
}

.wrap-technology {
    /* display: flex;
    flex-direction: column;
    gap: 120px; */

}

/* .wrap-scrollbar {
    height: 100vh;
    overflow-y: scroll;
    scroll-snap-type: y mandatory;

    scrollbar-width: none;
    -ms-overflow-style: none;
}

.wrap-scrollbar::-webkit-scrollbar {
    display: none;
}
 */

.box-wrap-technology {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    width: 100%;
    /* height: 100vh; */
    max-width: 1680px;

}

.wrap-technology section {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 48px;
    opacity: 0;
    transition: all 0.6s cubic-bezier(0.65, 0, 0.35, 1);
    pointer-events: none;
    z-index: 0;
}

.wrap-technology section.active {
    pointer-events: auto;
    z-index: 1;
}

.wrap-technology {
    position: relative;
    height: 100vh;
    overflow: hidden;
    display: block;
    max-width: none;
}

.wrap-scr-technology {
    height: 450vh;
}

.img-technology {
    max-width: 640px;

}

.img-technology img {
    display: block;
}

.ttl-cont-technology {
    position: relative;
}

.ttl-cont-technology h3 {
    position: absolute;
    left: 16px;
    bottom: 10px;
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 48px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #FFFFFF;
}

.ttl-cont-technology p {
    font-family: Orbitron;
    font-weight: 700;
    font-size: 150px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: uppercase;
    color: #FFFFFF;
    opacity: 0.2;
    margin-bottom: 40px
}

.list-cont-technology {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
}

.list-cont-technology div:last-child {
    width: 100%;
}

.list-cont-technology div {
    width: calc(50% - 12px);
    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);
    backdrop-filter: blur(10px);
    border-radius: 24px;
    padding: 24px;
    position: relative;
}

.list-cont-technology div::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 24px;
    padding: 1px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%);
}



.wrap-technology section:first-child .list-cont-technology div {
    width: calc(50% - 12px) !important;

}

.cont-technology {
    max-width: 735px;
}

.list-cont-technology h4 {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 28px;
    line-height: 120%;
    letter-spacing: 0%;
    color: #fff;
    margin-bottom: 12px;
}

.list-cont-technology p {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #888888;
    margin-bottom: 0;
}

.swiper.slider-crypto {
    width: 100%;
    overflow: hidden;
}

.slider-crypto .swiper-wrapper {
    display: flex;
}

.slider-crypto .swiper-slide {
    width: auto !important;
    display: inline-block;
    margin: 0 12px;
}

.wrap-slider-ctypto {
    overflow: hidden;
}

/* .slider-crypto-left .swiper-wrapper {
    transition-timing-function: linear !important;
    max-width: max-content;
    animation: scroll-left 20s linear infinite;
    animation-delay: 1s;


}
.slider-crypto-right .swiper-wrapper {
    transition-timing-function: linear !important;
    max-width: max-content;
    animation: scroll-right 20s linear infinite;
    animation-delay: 1s;


}  */
.d-flex {
    display: flex;
    flex-direction: column;

}

.gap-30 {
    gap: 30px;
}

.slider-crypto img {
    display: block;
}

@keyframes scroll-left {
    0% {
        transform: translateX(0%);
    }

    100% {
        transform: translateX(-50%);
    }
}

@keyframes scroll-right {
    0% {
        transform: translateX(-50%);
    }

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

.box-roadmap {
    padding: 24px;
    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);
    position: relative;
    border-radius: 24px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    max-width: 480px;
    height: auto;
    gap: 24px;
}

.box-roadmap-last {
    max-width: 6.24vw;
    opacity: 0;
}

.box-roadmap::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 24px;
    padding: 1px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%);
}

.box-roadmap img {
    display: block;
    margin-bottom: 24px;
}

.box-roadmap h3 {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 32px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #FFFFFF;
    margin-bottom: 12px;
}

.box-roadmap p {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #888888;
    margin-bottom: 12px;
}

.box-roadmap ul {
    display: flex;
    gap: 8px;
    flex-direction: column;
    list-style: none;
}

.box-roadmap ul li {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #888888;
    padding-left: 18px;
    position: relative;
}

.box-roadmap ul li::after {
    position: absolute;
    left: 0;
    top: 7px;
    background: linear-gradient(90deg, #4DA1FF 0%, #DC22FE 100%);

    width: 10px;
    height: 10px;
    border-radius: 50%;
    content: '';
}

.roadmap-btn a {
    padding: 14px 60px;
}

.slider-roadmap .horizontal-scroll {
    margin-bottom: 40px;
    margin-top: 40px;
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: flex;
    transition-property: transform;
    transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
    box-sizing: content-box;
    gap: 24px;
    padding-left: 6.25vw;
}

.box-roadmap {
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
    transition-property: transform;
}

.slider-roadmap .swiper-scrollbar {
    width: 200px;
    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);
    border-radius: 24px;
    left: 50%;
    transform: translateX(-50%);
}

.slider-roadmap .swiper-scrollbar-drag {
    border-radius: 24px;
    background: #D32BFF;

}

.ttl_timeline {
    width: 100%;
    padding-top: 30px;
}

.slider-timeline {
    display: flex;
    gap: 80px;
    align-items: center;
    justify-content: end;

    position: relative;
    max-width: 1680px;
    margin: 0 auto;
}
@media (min-width:1440px) {
    .slider-timeline{
        padding-bottom: 40px;
    }
}
.dv-tab-click {
    width: 570px;
    position: absolute;
    top: 0;
    left: 0;
    height: 100vh;
    display: flex;
    align-items: center;
}

.slider-timeline-sp {
    display: none;
}

.slider-timeline .swiper-wrapper {
    flex-direction: column;
}

.dv-tab-content {
    width: calc(100% - 556px - 80px);
    position: absolute;
    height: 100vh;
    top: 0;
}

.dv-tab-content-item {

    transition: all 0.3s ease-in-out 0s;
    pointer-events: none;
    height: 100vh;
    display: flex;
    justify-content: center;
    position: absolute;
    top: 0;
    right: 0;
    opacity: 0;
    transition: all 0.6s cubic-bezier(0.65, 0, 0.35, 1);
    pointer-events: none;
    z-index: 0;
    flex-direction: column;
    width: 100%;
}

.timeline-section {
    height: 550vh;
}

.slider-timeline .swiper-wrapper {
    transition: all 0.3s;
}

/* .slider-timeline .swiper-wrapper.slide-0 {
    transform: translateY(0);
}

.slider-timeline .swiper-wrapper.slide-1 {
    transform: translateY(-125px);
}

.slider-timeline .swiper-wrapper.slide-2 {
    transform: translateY(-250px);
}

.slider-timeline .swiper-wrapper.slide-3 {
    transform: translateY(-375px);
}

.slider-timeline .swiper-wrapper.slide-4 {
    transform: translateY(-500px);
}

.slider-timeline .swiper-wrapper.slide-5 {
    transform: translateY(-625px);
} */

.dv-tab-content-item.active {
    /* display: block;
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
    position: relative; */
    pointer-events: auto;
    z-index: 1;
}


.services-tab-click .swiper-slide span {
    font-family: Orbitron;
    font-weight: 700;
    font-size: 100px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: uppercase;
    color: #D32BFF;
    white-space: nowrap;

}

.services-swiper-container {
    height: 439px;
    overflow: hidden;
    width: 100%;
    position: relative;
}

.services-swiper-container::after,
.services-swiper-container::before {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) -100%, #000000 100%);
    height: 150px;
    width: 100%;
    left: 0;
    content: '';
    position: absolute;
    bottom: 0;
    z-index: 2;
}

.services-swiper-container::after {
    top: 0;
    bottom: auto;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0) -100%, #000000 100%);
}

.services-swiper-container .swiper-slide {
    height: auto !important;
    padding: 16px 0;
}

.tab-content-top {
    border-bottom: 1px solid #666666;
    display: flex;
    align-items: center;
    gap: 16px;
    padding-bottom: 36px;
    margin-bottom: 36px;
}

.tab-content-top p {
    margin-bottom: 0;
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #FFFFFF;
}

.line-tab-content-top {
    height: 24px;
    width: 1px;
    background: #FFFFFF;
}

.tab-content-bottom h3 {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 28px;
    line-height: 120%;
    letter-spacing: 0%;
    color: #FFFFFF;
    display: flex;
    align-items: center;
    gap: 24px;
    margin-bottom: 8px;
}

.tab-content-bottom h3 span {
    display: block;
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #fff;
    padding: 4px 24px;
    background: linear-gradient(121.77deg, #F44336 14.34%, #D32F2F 66.76%);

    border-radius: 100px;
}

.tab-content-bottom p {}

.tab-content-bottom ul {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.tab-content-bottom ul li {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #888888;
    padding-left: 18px;
    position: relative;
}

.tab-content-bottom ul li::after {
    position: absolute;
    left: 0;
    top: 7px;
    background: linear-gradient(90deg, #4DA1FF 0%, #DC22FE 100%);
    width: 10px;
    height: 10px;
    border-radius: 50%;
    content: '';
}

.tab-content-bottom ul li ul li {
    padding: 0;
}

.tab-content-bottom ul li ul li::after {
    display: none;
}

.tab-content-bottom {
    display: flex;
    align-items: center;
    gap: 0;
    justify-content: space-between;

}

.number-phase {
    font-family: Orbitron;
    font-weight: 700;
    font-size: 80px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: uppercase;
    color: #FFFFFF;
    opacity: 0.2;
    max-width: 484px;
    white-space: nowrap;

}

.community2 {
    padding: 80px 0;
}

.community2 .container {
    max-width: 1230px;
}

.wrap_community2 {
    position: relative;
    padding: 75px 165px;
    border-radius: 24px;
    margin: 0 auto;
    position: relative;

}

.item-circle2,
.ttl-hero-bridge2 {
    display: none;
}

.wrap_community2::before {
    position: absolute;
    content: '';
    width: 100%;
    background-repeat: no-repeat;
    border-radius: 24px;
    top: 0;
    left: 0;
    z-index: -2;
    background-image: url('../images/bg-cominuti.png');
    height: 100%;
    background-size: cover;
    background-position: center right;
}

.wrap_community2::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 24px;
    padding: 2px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;

    background: linear-gradient(90deg, #4DA1FF 0%, #DC22FE 100%);


}

.ttl_community2 {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.ttl_community2 h2 {
    font-family: Orbitron;
    font-weight: 700;
    font-size: 40px;
    line-height: 120%;
    letter-spacing: -2%;
    text-transform: uppercase;
    color: #fff;
    margin-bottom: 16px;
}

.ttl_community2 p {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    text-align: center;
    color: #E0E0E0;
    margin-bottom: 36px;
}

.ttl_community2 a {
    padding: 15px 35px;
}

.header-faucet {
    text-align: center;
    padding: 16px;
}

.header-faucet a {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 32px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #fff;
}

.faucet_content h1 {
    font-family: Orbitron;
    font-weight: 700;
    font-size: 64px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: uppercase;
    margin-bottom: 24px;
    color: #fff;
    text-align: center;
}

.faucet_content h1 span {
    color: #D32BFF;
}

.faucet_content p {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 24px;
    line-height: 150%;
    letter-spacing: 0%;
    text-align: center;
    color: #FFFFFF;
    margin-bottom: 60px;
}

.form-faucet {
    max-width: 680px;
    margin: 0 auto;
}

.form-faucet span {
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #E0E0E0;
    margin-bottom: 12px;
    display: block;
}

.form-faucet input {
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 24px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #fff;
    padding: 24px;
    border: 1px solid #666666;
    background: #212121;
    border-radius: 12px;
    margin-bottom: 24px;
    text-align: left;
    width: 100%;
}

.form-faucet button {
    padding: 9px 93px;
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 24px;
    line-height: 150%;
    letter-spacing: 0%;
    text-align: center;
    background: no-repeat;
    outline: none;
    border: none;
    cursor: pointer;
}

.form-faucet .text-center {
    opacity: 1;
    transform: translateZ(0);
}

.faucet_content {
    padding-top: 180px;

    min-height: calc(100vh - 80px);
}

.bg-faucet {
    background-image: url('../images/bg-faucet.png');
    background-repeat: no-repeat;
    background-position: center;
}

.wrap-bridge-chains {
    /* display: flex;
    align-items: center;
    /* justify-content: space-between; */
    /* justify-content: end;  */
}

.cont-bridge-chains {
    width: 533px;
    box-shadow: 0px 0px 50px 0px #BD1CF0;
    padding: 36px;
    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);
    border-radius: 24px;
    position: relative;
    border: 2px solid #D32BFF;
    margin-right: 140px;
    display: none;
}

.cont-bridge-chains.active {
    display: block;
}

.cont-bridge-chains img {
    display: block;
    margin: 0 auto 24px;
}

.cont-bridge-chains h3 {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 32px;
    line-height: 150%;
    letter-spacing: 0%;
    text-align: center;
    margin-bottom: 12px;
    color: #fff;
}

.cont-bridge-chains p {
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    text-align: center;
    color: #888888;
    margin-bottom: 0;
}

.ttl-bridge-chains {
    max-width: 626px;
}

.connect-with .ttl-connect-with {
    text-align: center;
    margin-bottom: 120px;
}

.ttl-industry {
    text-align: center;
    margin-bottom: 60px;
}

.list-industry {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 20px;
    max-width: 1040px;
    margin: 0 auto;
}

.list-industry a {
    display: block;
}

.list-industry img {
    filter: grayscale(1);
    display: block;
    transition: filter 0.3s ease, transform 0.3s ease;
}

.list-industry img:hover {
    filter: grayscale(0);
}

.cont-hero-bridge {
    max-width: 703px;
}

.bg_brid {
    display: none;
}

.ttl-hero-bridge p {
    margin-bottom: 48px;
}

.ttl-hero-bridge {
    margin-top: 20px;
}

.ttl-hero-bridge a {
    padding: 15px 53px;
}

.logo-hero-bridge img {
    display: block;
    margin-bottom: 48px;
}

.wrap-cont-hero-bridge .circle {
    position: absolute;
    width: 807px;
    /* height: 1392px; */
    border-radius: 50%;
    top: 50%;
    right: 624px;

    transform: translateY(-50%);
}

.circle span {
    position: absolute;
    left: 50%;
    top: 50%;
    transform-origin: 0 0;
    white-space: nowrap;
    font-family: Orbitron;
    font-weight: 700;
    font-size: 48px;
    line-height: 100%;
    letter-spacing: 0px;
    text-transform: uppercase;
    color: #888888;
}

.hero-bridge {
    overflow: hidden;
}

.wrap-cont-hero-bridge .circle .ribble {
    text-shadow: 0 0 20px #E64DFF;
    color: #D32BFF;
}

.item-circle {
    position: absolute;
    top: 0;
    right: 0;

}

.content-staking {
    max-width: 893px;
}

.wrap-staking {}

.content-staking h1 {
    font-family: Orbitron;
    font-weight: 700;
    font-size: 80px;
    line-height: 100%;
    letter-spacing: 0px;
    text-transform: uppercase;
    color: #fff;
    margin-bottom: 16px;
}

.content-staking h1 span {
    color: #D32BFF;
}

.content-staking>p {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 24px;
    line-height: 150%;
    letter-spacing: 0%;
    margin-bottom: 36px;
    max-width: 710px;
    color: #888888;
}

.content-staking ul {
    display: flex;
    gap: 80px;
    margin-bottom: 36px;
    list-style: none;

}

.content-staking ul li {
    position: relative;
}

.content-staking ul li p {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 36px;
    line-height: 120%;
    letter-spacing: 0%;
    color: #fff;
    margin-bottom: 8px;
}

.content-staking ul li span {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #888888;
    display: block;
}

.content-staking a,
.img-staking a {
    padding: 15px 28px;
}

.img-staking a {
    display: none;
}

.img-staking {
    position: absolute;
    right: 0;
    top: 14px;
}

.img-staking img {
    display: block;
}

.wrap-staking {
    position: relative;
}

.hero-staking {
    padding: 80px 0 103px;
    margin-bottom: 40px
}

.content-staking ul li:nth-child(2)::after,
.content-staking ul li:nth-child(2)::before {
    position: absolute;
    content: '';
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: calc(100% - 12px);
    left: -40px;
    background: #888888;
}

.content-staking ul li:nth-child(2)::before {
    left: auto;
    right: -40px;
}

.list-coin-name {
    position: absolute;
    top: 50%;
    right: 624px;
    margin: 0;
}

.hero-bridge {
    position: relative;
    overflow: hidden;
}

.list-coin-name ul li.highlight span {

    padding-left: 68px;
    text-shadow: 0 0 20px #E64DFF;
    color: #D32BFF;
}

.logo-hero-bridge model-viewer {
    /* display: block;
    width: 200px;
    height: 200px;
    transform: rotate(90deg); */
}

.logo-hero-bridge model-viewer.Ribble {
    /* display: block; */
}


.slider-coin-name {
    display: none;
}

.hero-bridge::after {
    height: 100%;
    width: 50%;
    position: absolute;
    z-index: 2;
    background: #000;
    content: '';
    top: 0;
    left: 0;
}

.cont-hero-bridge {
    z-index: 3;
    position: relative;
}

.wrap-cont-hero-bridge::after {
    position: absolute;
    top: 0;
    content: '';
    width: 808px;
    height: 201px;
    background: linear-gradient(180deg, #000000 0%, rgba(0, 0, 0, 0) 100%);
    z-index: 2;
    left: 50%;
}

.wrap-cont-hero-bridge::before {
    position: absolute;
    bottom: 0;
    content: '';
    width: 808px;
    height: 201px;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 100%);
    left: 50%;
    z-index: 2;
}

.item-circle {
    position: absolute;
    top: 0;
    right: 0;
}

.list-staking {
    margin: 0 -20px;

}

.box-staking {
    border: 3px solid #D32BFF;
    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);
    box-shadow: 0px 0px 24px 0px #BD1CF080;
    border-radius: 24px;
    padding: 36px;
    height: 100%;
    transition: all 0.3s;

}

.box-staking:hover {
    border-color: transparent;
    /* thay vì border: none */
    box-shadow: 0px 0px 24px 0px #BD1CF080;

}

.box-staking:hover img {
    transform: translateY(-10px);
}

.wrap-box {
    float: left;
    width: 33.33%;
    padding: 0 20px;
}

.wrap-box:nth-child(2) {
    margin-top: 40px;
}

.wrap-box:nth-child(3) {
    margin-top: 80px;
}

.box-staking img {
    display: block;
    margin: 0 auto 28px;
    transition: all 0.3s;
}

.box-staking h2 {
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 64px;
    line-height: 120%;
    letter-spacing: 0%;
    text-align: center;
    margin-bottom: 8px;
    color: #fff;
}

.box-staking p {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 24px;
    line-height: 150%;
    letter-spacing: 0%;
    text-align: center;
    color: #888888;
    margin-bottom: 0;
}

.top-ways-stake {
    display: flex;
    gap: 70px;
    align-items: center;
}

.list-ways-stake {
    width: 800px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.item-list-ways-stake {
    padding: 36px;
    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);
    backdrop-filter: blur(10px);
    border-radius: 24px;
    position: relative;
}

.item-list-ways-stake::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 24px;
    padding: 2px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%);
}

.item-list-ways-stake p {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 32px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #fff;
    margin-bottom: 12px;
}

.item-list-ways-stake span {
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #888888;
    display: block;
}

.ttl-ways-stake h2 {
    margin-bottom: 40px;
}

.box-ways-stake {
    display: flex;
    gap: 20px;
    flex-direction: column;

}

.number-ways-stake {
    font-family: Orbitron;
    font-weight: 700;
    font-size: 100px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: uppercase;
    color: #fff;
    margin-bottom: 12px;
    display: block;
}

.bottom-ways-stake h2 {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 48px;
    line-height: 120%;
    letter-spacing: 0%;
    color: #fff;
    margin-bottom: 12px;

}

.bottom-ways-stake p {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 24px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #888;
    margin-bottom: 24px;
}

.bottom-ways-stake a {
    padding: 15px 25px;
}

.bottom-ways-stake {
    max-width: 473px;
    margin-left: 480px;
}

.box-ways-stake:nth-child(even) .top-ways-stake {
    order: 2;
}

.ttl-staking-calculator h2 {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 24px;
}

.ttl-staking-calculator h2 p {
    text-transform: initial;
}




.ttl-staking-calculator h2 span {
    display: block;
    width: 100%;
}

.staking-calculator-top {
    margin-bottom: 40px;
}

.cont_wallet_different {
    min-height: var(--stick-items);
    display: block;
    max-width: none;
    position: relative;
}

.box_wallet_different {
    /* transform: scale(var(--stick-scale)); */
    /* position: absolute; */
    /* width: 100%; */
    height: 100%;
}

.info_wallet_different {
    flex-direction: column !important;
    align-items: start !important;
}

.img_wallet_different {
    align-items: center !important;
}



.wrap-bridge-chains {}



.wrap-bridge-chains {
    position: relative;

}

.ttl-bridge-chains {
    height: 80vh;
    position: relative;
    transition: filter 0.1s linear;
}

.ttl-bridge-chains.fixed {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 999;
}

.ttl-bridge-chains.sticky-bottom {
    position: absolute;
    top: auto;
    bottom: 0;
    width: 100%;
    left: auto;
}

.ttl-bridge-chains-content {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
}

.scroll-bridge-chains {
    /* position: sticky;
    top: 100px; */
    display: flex;
    flex-direction: column;
    justify-content: center;
    float: right;
}

.cont-bridge-chains {
    display: block;
    transition: opacity 0.3s ease;
}

.cont-bridge-chains.in-view {}

.h-100vh {
    height: 80vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.staking-calculator .staking-calculator-top {
    display: flex;
    gap: 80px;
    align-items: center;
    justify-content: space-between;
    position: relative;
}

.number-staking {}

.ht-animation {
    opacity: 0;
    transition-property: opacity, transform;
    transform: translate3d(0, 100px, 0);
    transition-timing-function: ease;
    transition-duration: .4s;
    transition-duration: 1s;
}

.ht-animation.in-view {
    opacity: 1;
    transform: translateZ(0);
}

.number-staking {
    width: 94px;
    display: flex;
    align-items: center;
    justify-content: start;
    position: relative;
}

.inner-number-staking {
    display: flex;
    flex-direction: column;
    gap: 18px;
    width: 54px;
}

.box-number-staking {
    font-family: Orbitron;
    font-weight: 700;
    font-size: 32px;
    line-height: 100%;
    letter-spacing: 0%;
    text-align: right;
    text-transform: uppercase;
    transition: all 0.3s;
    color: #888888;
}

.box-number-staking.active {
    color: #fff;
}

.number-staking::after {
    height: 100%;
    width: 4px;
    position: absolute;
    top: 0;
    right: 8px;
    content: '';

    background: linear-gradient(270deg, rgba(211, 43, 255, 0) 0%, #D32BFF 50%, rgba(211, 43, 255, 0) 100%);

}



@keyframes animatenumber {
    0% {
        box-shadow: 0 0 0 2px rgba(211, 43, 255, 0.2),
            0 0 8px rgba(252, 251, 251, 0.5) inset,
            0 0 24px rgba(189, 28, 240, 0.8);
    }

    100% {
        box-shadow: 0 0 0 6px rgba(211, 43, 255, 0.2),
            0 0 8px rgba(252, 251, 251, 0.5) inset,
            0 0 24px rgba(189, 28, 240, 0.8);
    }
}

.number-staking::before {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #D32BFF;
    position: absolute;
    content: '';
    top: 3px;
    right: 2px;
    box-shadow: 0 0 0 6px rgba(211, 43, 255, 0.2),
        0 0 8px rgba(252, 251, 251, 0.5) inset,
        0 0 24px rgba(189, 28, 240, 0.8);
    animation: animatenumber 2s linear infinite;
}

.l-staking-calculator {
    padding: 36px;
    background: rgba(0, 0, 0, 1);
    border: 1px solid #D32BFF;
    box-shadow: 0px 0px 20px 0px #FCFBFB80, 0px 0px 40px 0px #BD1CF080;
    border-radius: 24px;
    max-width: 798px;
    background-image: url('../images/bgstaking.png');
    background-position: top right;
    background-repeat: no-repeat;
    position: relative;
    overflow: hidden;
    float: left;
}

.l-staking-calculator::after {
    position: absolute;
    content: '';
    top: 0;
    right: 0;
    background-image: url('../images/itemstaking.png');
    width: 229px;
    height: 223px;
}

.staking-controls {
    display: flex;
    align-items: center;
    gap: 12px 50px;
    flex-wrap: wrap;
    margin-bottom: 40px;
}

.staking-controls label {
    width: 100%;
    display: block;
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 24px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 12px;
    position: relative;
}

.icon-circle2 {
    cursor: pointer;
    position: relative;
    width: 30px;
    display: flex;
    align-items: center;
}

.staking-controls label .icon-circle2 div {
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0%;
    align-items: center;
    padding: 12px 24px;
    position: absolute;
    top: 50%;
    left: 30px;
    transform: translateY(-50%);
    display: inline-flex;
    gap: 12px;
    text-transform: initial;
    z-index: 2;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease-in-out 0s;
    width: 437px;
}

.staking-controls label .icon-circle2:hover div {
    opacity: 1;
    visibility: visible;
}

.staking-controls label .icon-circle2 div::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 24px;
    padding: 2px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%);


}

.wrap-amount {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 10px 0;
}

.calc-btn {
    width: 36px;
    height: 36px;
    background: #E323FF;
    display: flex;
    align-items: center;
    border-radius: 8px;
    border: none;
    outline: none;
    cursor: pointer;

}

.calc-btn:hover {
    background: #bd1cf0;
}

#amount {
    font-family: Nunito Sans;
    font-weight: 800;
    font-size: 48px;
    line-height: 120%;
    letter-spacing: 0%;
    text-align: center;
    color: #FFFFFF;
    min-width: 115px;
}

.percentage-box {
    padding: 4px 16px;
    background: linear-gradient(90deg, #5E00AF 0%, #DC22FE 100%);
    position: relative;
    color: white;
    border-radius: 12px;
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 40px;
    line-height: 150%;
    letter-spacing: 0%;

}

.percentage-box::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 12px;
    padding: 2px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    background: linear-gradient(271.64deg, #4DA1FF 3.79%, #00E5BC 105.24%);

}



.stake-note {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #888888;
    width: 100%;
    margin-bottom: 0;
}

.list-staking-calculator {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.box-list-staking {
    padding: 24px;
    border: 1px solid #D32BFF;
    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);
    border-radius: 16px;
    background-image: url('../images/Untitled@1-2034x10676.png');
    background-position: bottom right;
    background-repeat: no-repeat;
}

.box-list-staking h3 {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 20px;
    line-height: 14px;
    color: #fff;
    letter-spacing: 0%;
    margin-bottom: 24px;
    leading-trim: both;
    text-edge: cap;

}

.box-list-staking p {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 32px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #fff;
    margin-bottom: 4px;

}

.box-list-staking span {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #888888;
    display: block;
}

.box-staking-calculator {
    min-height: 594px;
    max-width: 534px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-image: url('../images/box-staking.png');
    background-repeat: no-repeat;
    background-size: contain;
    flex-direction: column;
    position: relative;
}
.wrap_about img{
    display: block;
}
.box-staking-calculator img {
    display: block;
    margin-bottom: 24px;
}

.box-staking-calculator h3 {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 28px;
    line-height: 120%;
    letter-spacing: 0%;
    text-align: center;
    max-width: 350px;
    margin: 0 auto 12px;
    color: #fff;
}

.box-staking-calculator p {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    text-align: center;
    color: #888;
    max-width: 350px;
    margin: 0 auto;
}

.item-staking-calculator {
    max-width: 675px;
    width: 100%;
    float: right;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.img-ways-stake img {
    display: block;
}

.wrap-l-staking-calculator {
    padding-top: 80px;
}

.staking-calculator {
    padding-bottom: 80px;
    padding-top: 0;
}

.wrap-scroll-stake {
    /* height: 100vh;
    transform: translateZ(0);
    width: fit-content;
    position: relative;
    translate: none;

    transform: translate3d(0px, 0px, 0px);
    will-change: transform; */
}

.wrap-ways-stake {
    position: relative;
    width: 100%;
    height: 100vh;
}

._list_tukl7_80 {
    display: flex;
    flex-direction: row;
    gap: 0;
    margin: 0;
    height: 100%;
    /* width: 100%; */
    /* width: fit-content; */
}

.box-ways-stake {
    width: 1510px;
    flex-shrink: 0;
    margin-right: 80px;
}

#staking-calculator-scr.fixed,
.number-staking.fixed {
    position: fixed;
    top: 0;
    width: 100%;
    max-width: 1680px;
}

.number-staking.fixed {
    right: 120px;
}

.number-staking::before {
    transition: all 0.6s ease-in-out 0s;
    z-index: 1;
}

.number-staking-2::before {
    top: 58px;
}

.number-staking-3::before {
    top: 107px;
}

.number-staking-4::before {
    top: 155px;
}



.number-staking {
    transition: top 0.3s ease, opacity 0.3s ease;
    will-change: top, opacity;
}

/* Swap */
.wrap-swap-header {
    max-width: 600px;
    margin: 0 auto;
}

.wrap-swap-header .ttl {
    margin-bottom: 36px;
    text-align: center;
}

.caculato-swap-header {
    display: flex;
    flex-direction: column;

    gap: 12px;
}

.inner-box-swap-header {
    border: 2px solid #666666;
    border-radius: 20px;
    padding: 16px 24px;
}

.box-swap-header {
    position: relative;

}

.box-swap-header2 .inner-box-swap-header {
    background: #333535;

}

.ttl-caculato {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #888888;
    margin-bottom: 8px;
}

.number-swap {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 36px !important;
    line-height: 150%;
    letter-spacing: 0%;
    margin-bottom: 8px;
    color: #fff !important;
    background: none !important;
    border: none !important;
    max-width: 200px;
    position: relative;
    z-index: 3;
    padding: 0 !important;
}

.number-swap::-webkit-outer-spin-button,
.number-swap::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0;
    /* <-- Apparently some margin are still there even though it's hidden */
}

.number-swap[type=number] {
    -moz-appearance: textfield;
    /* Firefox */
}

.total-swap {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #888888;
    display: block;
}

.select-swap {
    width: 100%;
}

.box-swap-header .select2-container {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 0;
}


.wallet-network .select2-container {
    padding: 12px;
    background: none;
    border: 1px solid #666666;
    border-radius: 8px;
}

.box-swap-header .select2-container {
    border: none;
    height: 48px;
    position: absolute;
}

.box-swap-header span.selection {
    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);
    border-radius: 12px;
    padding: 8px 18px;
    height: 48px;
    max-width: 164px;
    margin: 0 24px 0 auto;
    display: block;
    position: relative;
}

.box-swap-header span.selection::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 12px;
    padding: 1px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);

}

.box-swap-header .select2-container--default .select2-selection--single .select2-selection__rendered span {
    font-weight: 700;
    font-size: 20px;
    line-height: 130%;

}

.box-swap-header .select2-container--default .select2-selection--single .select2-selection__rendered small {
    display: none;
}

.caculato-swap-header {
    position: relative;
}

.btn-caculato-swap {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    cursor: pointer;
}

.btn-caculato-swap img {
    display: block;
}

.swap-header {
    position: relative;
}

.icon-swap {
    position: absolute;
}

.icon-swap img {
    display: block;
}

.icon-swap {
    position: absolute;
    animation: floatUpDown 2.5s ease-in-out infinite;
}

@keyframes floatUpDown {
    0% {
        transform: translateY(0);
    }

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

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

@keyframes rotateSway {
    0% {
        transform: rotate(0deg) translateY(0);
    }

    50% {
        transform: rotate(3deg) translateY(-5px);
    }

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


}

.icon-swap-1 {
    top: 8.802vw;
    left: 18.333vw;
    animation-delay: 0s;
}

.icon-swap-2 {
    top: 12.5vw;
    left: 10.052vw;
    animation-delay: 0.2s;
}

.icon-swap-5 {
    bottom: 7.917vw;
    left: 21.563vw;
    animation-delay: 0.8s;
}

.icon-swap-9 {
    right: 11.719vw;
    bottom: 10.052vw;
    animation-delay: 1.6s;
}

.icon-swap-10 {
    right: 24.271vw;
    bottom: 6.042vw;
    animation-delay: 1.8s;
}

.icon-swap-3 {
    top: 17.135vw;
    left: 23.438vw;
    animation: rotateSway 3.2s ease-in-out infinite;
    animation-delay: 0.4s, 0.4s;
}

.icon-swap-4 {
    left: 12.135vw;
    bottom: 13.49vw;
    animation: rotateSway 3s ease-in-out infinite;
    animation-delay: 0.6s, 0.6s;
}

.icon-swap-6 {
    right: 20.677vw;
    top: 7.552vw;
    animation: rotateSway 3.5s ease-in-out infinite;
    animation-delay: 1s, 1s;
}

.icon-swap-7 {
    right: 25.417vw;
    top: 17.344vw;
    animation: rotateSway 2.8s ease-in-out infinite;
    animation-delay: 1.2s, 1.2s;
}

.icon-swap-8 {
    right: 10.885vw;
    top: 16.406vw;
    animation: rotateSway 3s ease-in-out infinite;
    animation-delay: 1.4s, 1.4s;
}

.btn-swap-caculato button {
    display: block;
    padding: 9px 32px;
    margin-top: 24px;
    background: none;
    border: none;
    width: 100%;
    cursor: pointer;
    outline: none;
    font-size: 24px;
    line-height: 1.5;
}

.price-chart__pair {
    gap: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #FFFFFF1A;
    padding: 12px 20px;
    border-radius: 12px;
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 24px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #fff;
    position: relative;
    margin-bottom: 12px;
}

.price-chart__pair::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 12px;
    padding: 2px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;

    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%);
}

.price-chart__price {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 56px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #FFFFFF;
}

.price-chart__wrap_price {
    display: flex;
    align-items: center;
    gap: 24px;
}

.price-chart__changes {
    display: flex;
    gap: 16px;
    align-items: center;
}

.price-chart__changes span {
    display: flex;
    align-items: center;
    gap: 4px;
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 24px;
    line-height: 150%;
    letter-spacing: 0%;

}

.price-chart__change-up {
    color: #34C759;
}

.price-chart__change-down {
    color: #FF3B30;
}

.wrap-price-chart {
    background: #FFFFFF1A;

    border-radius: 40px;
    padding: 48px;
    position: relative;
}

.wrap-price-chart::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 40px;
    padding: 2px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%);

}

.info-price-chart {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 48px;
}

.date-price-chart {
    background: #FFFFFF1A;
    border-radius: 12px;

}

.date-price-chart ul {
    list-style: none;
    display: inline-flex;
    padding: 8px;
    align-items: center;
}

.date-price-chart ul li a {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    min-width: 70px;
    border: 1px solid transparent;
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 24px;
    line-height: 150%;
    letter-spacing: 0%;
    border-radius: 8px;
    color: #888888;
}

.date-price-chart ul li a.active,
.date-price-chart ul li a:hover {
    border: 1px solid #D32BFF;
    background: #D32BFF1A;
    color: #fff;
}

.price-chart__chart-image {
    background-image: url('../images/Union.png');
    background-repeat: repeat-y;
    padding-top: 64px;
    background-size: cover;
}

.chart-image {
    display: none;
}

#chart-image-1 {
    display: block;
}

.chart-image img {
    display: block;
}

.price-chart__year {
    display: flex;
    align-items: center;
    margin-top: 9px;
    justify-content: space-between;
}

.price-chart__year p {
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #FFFFFF;
    margin-bottom: 0;
}

.ttl-price-chart {
    margin-bottom: 40px;
}

.chart-image canvas {
    width: 100%;
    max-height: 436px;
    height: 100%;
    display: block;
}

.wrap-swap-header .select2-container--default .select2-selection--single .select2-selection__arrow {
    width: 16px !important;
    height: 16px !important;
    background-size: contain;
}

.wrap-swap-header .select2-container--default .select2-selection--single {
    gap: 12px;
}

.wrap-select-bridge-app .select2-container {
    transform: none;
}

.wrap-bridge-app h1 {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 36px;
    line-height: 100%;
    letter-spacing: 0%;
    color: #fff;
    text-align: center;
    margin-bottom: 12px;
}

.wrap-bridge-app label {
    display: block;
    margin-bottom: 12px;
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #E0E0E0;
    position: relative;
}

.eva_swap-fill {
    position: absolute;
    left: 50%;
    top: 00;
    transform: translateX(-50%);
    cursor: pointer;
}

.eva_swap-fill img {
    display: block;
}

.wrap-bridge-app span.selection {
    height: 82px;
    border: 1px solid #666666;
    background: #212121;
    border-radius: 12px;
    padding: 12px 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.wrap-select-bridge-app .select2-container--default .select2-selection--single {
    width: 100%;
}

.wrap-select-bridge-app .select2-container {
    height: auto;
}

.wrap-select-bridge-app {
    margin-bottom: 24px;
}

.wrap-select-bridge-app .select2-container--default .select2-selection--single .select2-selection__rendered small {
    display: block;

}

.token-selection.is-default img {
    border-radius: 0 !important;
    display: block;
}

.token-selection img {
    display: block;
}

.wrap-img-network {
    position: relative;
}

.sub-img {
    position: absolute;
    bottom: 0;
    right: -5px;
}

.wrap-ip-amount {
    height: 82px;
    display: flex;
    align-items: center;
    background: #212121;
    border: 1px solid #666666;
    border-radius: 12px;
    justify-content: space-between;
    padding: 0 24px;
}

.ip-amount-max {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #888888;
    display: block;
}

.wrap-ip-amount input {
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 32px;
    line-height: 100%;
    letter-spacing: 0%;
    border: none;
    background: none;
    width: 200px;
    color: #fff;
    height: 32px;
    padding: 0 !important;
}

.wrap-ip-amount input::-webkit-outer-spin-button,
.wrap-ip-amount input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.wrap-ip-amount input[type=number] {
    -moz-appearance: textfield;
}

.wrap-ip-amount input::placeholder {
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 32px;
    line-height: 100%;
    letter-spacing: 0%;
    color: #888;
}

.network-title {
    margin-bottom: 12px;
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #fff;
}

.token-title-ethereum {
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 14px;
    line-height: 100%;
    margin-bottom: 12px;
    letter-spacing: 0%;
    color: #AEAEAE;
}

.amount-dolas {
    display: block;
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 14px;
    line-height: 100%;
    color: #888888;
    letter-spacing: 0%;

}

.bridge-app-routes {
    padding: 24px;
    background: #212121;
    position: relative;
    border-radius: 12px;
    display: none;
}

.bridge-app-routes::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 12px;
    padding: 2px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    background: linear-gradient(271.64deg, #4DA1FF 3.79%, #00E5BC 105.24%);
}

.route-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}

.route-amount {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.route-amount img {
    display: block;
    width: 54px;
}

.route-token-amount {
    margin-bottom: 4px;
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 24px;
    line-height: 100%;
    letter-spacing: 0%;
    color: #fff;
}

.route-amount-via {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 12px;
    line-height: 100%;
    letter-spacing: 0%;
    color: #888;
}

.route-speed {
    display: flex;
    align-items: center;
    gap: 4px;
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
    color: #fff;
}

.route-lightning-icon img {
    display: block;
}

.route-card-body {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.route-info {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.route-label {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #888888;

    display: block;
}

.route-value {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #fff;
}

.route-time {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: 0%;
    background: linear-gradient(126.57deg, #3AB349 14.57%, #59C967 39.86%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.bridge-app-amount {
    margin-bottom: 24px;
}

.privaci-bridge-app a {
    display: block;
    text-align: center;
    padding-bottom: 80px;
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    text-align: center;
    text-decoration: underline;
    text-decoration-style: solid;
    text-decoration-thickness: 0%;
    text-decoration-skip-ink: auto;
    color: #fff;
}

.privaci-bridge-app a:hover {
    text-decoration: none;
}

.hero-dex {
    padding-top: 136px;
    overflow: hidden;
    /* height: calc(100vh - 84px); */
    position: relative;
}

.hero-dex::after {
    height: 200px;
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    content: '';
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 100%);

}

.ttl-hero-dex {
    max-width: 1010px;
    margin: 0 auto 80px;
    text-align: center;
}

.ttl-hero-dex p {
    margin-bottom: 24px;

}

.ttl-hero-dex a {
    padding: 9px 72px;
    font-size: 24px;
    line-height: 1.5;
}

.ttl-hero-dex div {
    text-align: center;
}

.img-hero-dex img {
    display: block;
    margin: 0 auto;
    box-shadow: 0px 4px 50px 0px #FCFBFB80, 0px 6px 50px 0px #BD1CF080;
    border-radius: 24px;
}

.ttl-high-performance {
    margin-bottom: 56px;
    max-width: 1010px;
}

.btn_header {
    opacity: 1;
    transform: translateZ(0);
}

.l-high-performance {
    max-width: 650px;
    float: left;
}

.r-high-performance {
    float: right;
    max-width: 800px;
    width: 100%;
}

.h-80vh {
    height: 80vh;
}

.box-high-performance {
    /* display: flex;
    align-items: center;
    justify-content: space-between; */
}

.inner-high-performance {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 24px;
    width: 100%;
    border-top: 1px solid #666666
}

.box-high-performance {
    display: flex;
    align-items: center;
    justify-content: center;

}

.info-box-high-performance {}

.info-box-high-performance h3 {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 32px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #fff;
    margin-bottom: 12px;
}

.info-box-high-performance ul {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.info-box-high-performance ul li {
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    color: #888888;
    padding-left: 18px;
    position: relative;
}

.info-box-high-performance ul li::after {
    background: linear-gradient(90deg, #4DA1FF 0%, #DC22FE 100%);
    width: 10px;
    height: 10px;
    border-radius: 50%;
    position: absolute;
    content: '';
    left: 0;
    top: 8px;
}



.wrap-sticky-performance.fixed {
    position: fixed;
    top: 0;

}

.wrap-sticky-performance.fixed .l-high-performance {
    animation: subtle-shake 1.5s infinite ease-in-out;

}

.number-high-performance {
    font-family: Orbitron;
    font-weight: 700;
    font-size: 80px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: uppercase;
    color: #fff;
}

.box-high-performance {
    transition: opacity 0.3s ease;
}

.high-performance {
    margin-bottom: 36px;
    padding-bottom: 80px;
}

.wrap-sticky-performance {
    padding-top: 80px;
}

.dex-page .connect-with .ttl-connect-with {
    margin-bottom: 60px;
}

.connect-with-dex .d-flex {
    max-width: 1280px;
    margin: 0 auto;
}

.ttl-how-works {
    /* margin-bottom: 80px; */
}

.wrap-works {
    padding-top: 80px;
}

.card-works {
    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);
    padding: 36px;
    position: relative;
    border-radius: 24px;
    backdrop-filter: blur(10px);
    width: 1200px;
    flex-shrink: 0;
}

.card-works::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 24px;
    padding: 2px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%);
}

.card-works-header {
    padding-bottom: 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #666666;
}

.card-works-header h3 {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 64px;
    line-height: 120%;
    letter-spacing: 0%;
    color: #fff;
}

.card-works-header img {
    display: block;
}

.card-works-content {
    display: flex;
    gap: 40px;
    align-items: center;
    justify-content: space-between;
    padding-top: 40px;
}

.inner-works-content span {
    font-family: Orbitron;
    font-weight: 700;
    font-size: 150px;
    line-height: 100%;
    letter-spacing: 0%;
    text-transform: uppercase;
    display: block;
    margin-bottom: 10px;
    color: #fff;
    opacity: 0.2;
}

.inner-works-content {
    width: calc(100% - 468px - 40px);
}

.inner-works-content p {
    font-family: Nunito Sans;
    font-weight: 600;
    font-size: 48px;
    line-height: 120%;
    letter-spacing: 0%;
    color: #fff;
    margin-bottom: 0;
}

.image-card-works-content img {
    display: block;
}

.image-card-works-content {
    width: 468px;
}

.fundraising-rounds .ttl h2 {
    margin-bottom: 81px;
    text-align: center;
}

.wrap-fundraising-rounds {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 40px;
}

.box-fundraising-rounds {
    backdrop-filter: blur(10px);
    background: linear-gradient(139.2deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 100%);
    border-radius: 24px;
    position: relative;
    padding: 40px 24px 24px;
}

.box-fundraising-rounds::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 24px;
    padding: 2px;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%);


}

.box-fundraising-rounds h3 {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 28px;
    line-height: 120%;
    letter-spacing: 0%;
    color: #fff;
    margin-bottom: 24px;
}

.cont-fundraising-rounds {
    border: 1px solid #888888;
    background: #000000;
    border-radius: 16px;
    padding: 12px 16px;
}

.header-fundraising-rounds {
    padding-bottom: 16px;
    border-bottom: 1px solid #888888;
}

.header-fundraising-rounds span {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    text-align: center;
    display: block;
    color: #888888;
    margin-bottom: 4px;
}

.header-fundraising-rounds p {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 32px;
    line-height: 150%;
    letter-spacing: 0%;
    text-align: center;
    color: #fff;
    margin-bottom: 0;
}

.bottom-fundraising-rounds {
    padding-top: 16px;
}

.bottom-fundraising-rounds span {
    font-family: Nunito Sans;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    letter-spacing: 0%;
    text-align: center;
    margin-bottom: 4px;
    display: block;
}

.bottom-fundraising-rounds p {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 32px;
    line-height: 150%;
    letter-spacing: 0%;
    text-align: center;
    color: #D32BFF;
    margin-bottom: 0;
}

.ttl-live-fundraising-rounds {
    font-family: Nunito Sans;
    font-weight: 700;
    font-size: 24px;
    line-height: 150%;
    letter-spacing: 0%;
    color: #FFFFFF;
    padding: 4px 24px;
    border-radius: 100px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: -22px;
    z-index: 1;
}

.active .ttl-live-fundraising-rounds {
    background: linear-gradient(121.77deg, #F44336 14.34%, #D32F2F 66.76%);

}

.next .ttl-live-fundraising-rounds {
    background: #888888;

}

.box-fundraising-rounds.active::after {
    background: #D32BFF;
    padding: 3px;
}

.img-hero-dex .is-pc {
    display: block;
}

.img-hero-dex .is-sp {
    display: none;
}

.wrap-sticky-performance.sticky-bottom {
    position: absolute;
    top: auto;
    bottom: 0;
    width: 100%;
    left: auto;
}

.wrap-high-performance {
    position: relative;
}

.bottom-staking-calculator {
    position: relative;
}

.wrap-l-staking-calculator.sticky-bottom {
    position: absolute;
    top: auto;
    bottom: 0;
    width: 100%;
    left: auto;
}

.wrap-works {
    display: flex;
    flex-direction: row;
    gap: 0;
    margin: 0;
    height: 100%;
    gap: 40px;
    align-items: center;
}

.cont-wrap-works {
    position: relative;
    /* height: 100vh; */
    width: 100%;
}

.site-header-dex {
    background-image: url('../images/dex-page/bg-dex.png');
    background-repeat: no-repeat;
    background-position: center;
}

@media (min-width:1921px) {
    .site-header-dex {
        background-size: cover;
    }
}

.header-sticky {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    transition: all 0.3s ease;
    z-index: 999;
}

.rst_sticky {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    transform: translateY(-100%);
    background: linear-gradient(0deg, rgba(0, 0, 0, 0) -100%, #000000 100%);

    transition: transform 0.3s ease, box-shadow 0.3s ease;
    box-shadow: none;
}

.header-sticky-show {
    transform: translateY(0);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.row-slider-timeline {
    position: relative;

    width: 100%;
    display: flex;
    height: auto;
    justify-content: space-between;
    align-items: start;
}

.dv-tab-click {
    height: auto;
    position: relative;
}

.dv-tab-content {
    height: auto;
    position: relative;
}

.slider-timeline {
    flex-wrap: wrap;
    height: 100vh;
    align-items: end;
}

.dv-tab-content-item {
    height: auto;
}

.slider-timeline {
    gap: 40px;
}

.img-ways-stake {
    max-width: 600px;
}

.item-list-ways-stake {
    padding: 24px;
}

/* .item-staking-calculator .h-100vh{
    height: 100vh;
} */
.bottom-ways-stake {
    position: relative;
}

.bottom-ways-stake::after {
    background: linear-gradient(360deg, #4DA1FF 16.88%, rgba(220, 34, 254, 0) 91.35%);
    position: absolute;
    content: '';
    top: 0;
    left: -87px;
    width: 4px;
    height: 230px;
}

.bottom-ways-stake::before {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #D32BFF;
    position: absolute;
    content: '';
    top: 3px;
    left: -97px;
    z-index: 1;
    box-shadow: 0 0 0 6px rgba(211, 43, 255, 0.2),
        0 0 8px rgba(252, 251, 251, 0.5) inset,
        0 0 24px rgba(189, 28, 240, 0.8);
    animation: animatestaking 6s linear infinite;
    box-shadow: 0px 0px 8px 0px #FCFBFB80 inset, 0px 0px 24px 0px #BD1CF0CC;

}

@keyframes animatestaking {
    0% {
        box-shadow: 0 0 0 2px rgba(211, 43, 255, 0.2),
            0 0 8px rgba(252, 251, 251, 0.5) inset,
            0 0 24px rgba(189, 28, 240, 0.8);
        top: 0px;
    }

    50% {
        box-shadow: 0 0 0 6px rgba(211, 43, 255, 0.2),
            0 0 8px rgba(252, 251, 251, 0.5) inset,
            0 0 24px rgba(189, 28, 240, 0.8);
        top: 230px
    }

    100% {
        box-shadow: 0 0 0 6px rgba(211, 43, 255, 0.2),
            0 0 8px rgba(252, 251, 251, 0.5) inset,
            0 0 24px rgba(189, 28, 240, 0.8);
        top: 0
    }
}

@keyframes animatestaking2 {
    0% {
        box-shadow: 0 0 0 2px rgba(211, 43, 255, 0.2),
            0 0 8px rgba(252, 251, 251, 0.5) inset,
            0 0 24px rgba(189, 28, 240, 0.8);
        bottom: 0px;
    }

    50% {
        box-shadow: 0 0 0 6px rgba(211, 43, 255, 0.2),
            0 0 8px rgba(252, 251, 251, 0.5) inset,
            0 0 24px rgba(189, 28, 240, 0.8);
        bottom: 230px
    }

    100% {
        box-shadow: 0 0 0 6px rgba(211, 43, 255, 0.2),
            0 0 8px rgba(252, 251, 251, 0.5) inset,
            0 0 24px rgba(189, 28, 240, 0.8);
        bottom: 0
    }
}

.box-ways-stake:nth-child(even) .bottom-ways-stake::after {
    top: auto;
    bottom: 0;
}

.box-ways-stake:nth-child(even) .bottom-ways-stake::before {
    top: auto;
    bottom: 0;
    animation: animatestaking2 6s linear infinite;

}

.bridge-app {
    padding-bottom: 315px;
}
.rst-height-fixed{
    padding-top: 86px;
}
.rst-height-fixed-dex{
    padding-top:  0 !important;
}