@font-face {
    font-family: Gilroy-Medium;
    src: url("../fonts/gilroy/Gilroy-Medium.ttf");
}
@font-face {
    font-family:Newake;
    src: url(../fonts/newake/NewakeFont-Demo.otf);
}
@font-face {
    font-family:Gilroy-Regular;
    src: url(../fonts/gilroy/Gilroy-Regular.ttf);
}
@font-face {
    font-family:Gilroy-Bold;
    src: url(../fonts/gilroy/Gilroy-Bold.ttf);
}
@font-face {
    font-family:norm-black;
    src: url(../fonts/TT\ Norms\ Pro\ Bold.otf);
}
* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}
.animate {
    opacity: 0;
    transform: translateY(200px);
    transition: opacity 2s, transform 2s;
  }

  .in-view {
    opacity: 1;
    transform: translateY(0);
  }
html {
    font-size: 62.5%;
    scroll-behavior: smooth;
    cursor: default;
    font-family: 'montserrat';
    font-weight: 400;
}
  body {
    background: #060F27;
  }

  .cursor {
    position: fixed;
    top: -12px;
    left: -7px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #73E0F1;
    box-shadow: 0 0 20px #73E0F1, 0 0 30px #73E0F1, 0 0 40px #73E0F1, 0 0 50px #73E0F1, 0 0 60px #73E0F1, 0 0 70px #73E0F1, 0 0 80px #73E0F1;
    mix-blend-mode: color-dodge;
    pointer-events: none;
    transform: translate(-50%, -50%) scale(1);
    transition: transform 0.2s linear;
    z-index: 1100;
    /* filter: brightness(1000%); */
    filter: drop-shadow(2px 2px 50px #fff);
  }
  @keyframes pulse {
    0%, 100% {
      box-shadow: 0 0 20px #fff, 0 0 30px #ffffff, 0 0 40px #fefefe, 0 0 50px #fefefe, 0 0 60px #ffffff, 0 0 70px #ffffff, 0 0 80px #ffffff;
    }
    50% {
      box-shadow: 0 0 20px #fff, 0 0 40px #ffffff, 0 0 50px #fefefe, 0 0 60px #fefefe, 0 0 70px #ffffff, 0 0 80px #ffffff, 0 0 90px #ffffff;
    }
  }
p{
    color: #EFF;
    font-family: Gilroy-Regular;
    font-size: 1.3vw;
    font-style: normal;
    font-weight: 400;
}
.special-para{
    font-weight: 600;
    font-size: 1.3vw;
    line-height: 1.3vw;
    letter-spacing: .5vw;
    text-transform: uppercase;
    color: #BD8D4C;
}
.text-center {
    text-align: center;
}
img{
    width: 100%;
}
h1 {
    background: var(--gt, linear-gradient(270deg, #88E4FC 0%, #FFF 100%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-family: Newake;
    font-size: 7vw;
    line-height: 7vw;
    font-style: normal;
    font-weight: 400;
    text-align: left;
    animation: FadeInLeft 1s linear 1 forwards;
}

h2 {
    font-family: Newake;
    font-size: 3.5vw;
    font-style: normal;
    font-weight: 400;
    line-height: 3.7vw;
    background: var(--gt, linear-gradient(270deg, #88E4FC 0%, #FFF 100%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    
}

h3 {
    text-align: center;
    font-family: Newake;
    font-size: 1.8vw;
    font-style: normal;
    font-weight: 400;
    background: var(--gt, linear-gradient(270deg, #88E4FC 0%, #FFF 100%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
h6{
    font-size: 1.4vw;
    color: #877C6D;
    line-height: 2vw;
}

a {
    text-decoration: none;
    cursor: pointer;
}

li {
    list-style: none;
    font-size: 1vw;
    line-height: 1.3vw;
    color: #FFFFFF;
}

.btn {
    border-radius: 7px;
    border: 3px solid #000;
    background: #FEED01;
    padding: 1vw 2vw;
    font-family:norm-black;
    font-size: 15px;
    font-weight: 250;
    letter-spacing: 0.9px;
    text-transform: capitalize;
    transition: all .5s ease;
    transform: scale(1);
}

.btn:hover {
    color: #000000;
    border:3px solid #000;
    background: #ffffff;
    transform: translateY(-0.4vw);
    transform: scale(1.1);
}

.navbar-toggle {
    display: none;
    cursor: pointer;
}

.navbar-toggle span {
    display: block;
    width: 7vw;
    height: 1.5vw;
    margin: 0.7vw;
    background: linear-gradient(271.36deg, #F2E0C8 50.01%, #c6a478 72.39%);
    border-radius: 50px;
    transition: all 0.5s;
}

.navbar-toggle span:nth-child(2) {
    width: 5vw;
}

/* -------------------------------------------Navbar Management------------------
-------------------- */

.header {
    position: relative;
    top: 1vw;
    left: 0;
    z-index: 1000;
    width: 95%;
    animation: bounce 1s;
    animation-iteration-count: 1;
    transition: 1s;
}

.header .navbar {
    padding: 1vw 2vw;
    border-radius: 2vw;
    width: 100%;
    background: transparent;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.header .navbar .left-side-menu {
    width: 20%;
    text-align: left;
}

.header .navbar .left-side-menu a {
    font-family: zangezi-black;
    font-weight: 900;
    font-size: 2vw;
    line-height: 1.7vw;
    /* or 274% */
    color: #ffffff;
}


.header .navbar .left-side-menu a img {
    width: 12vw;
    cursor: pointer;
}

.center-menu {
    width: 80%;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 3vw;  
}

.center-menu ul {
    display: flex;
    align-items: center;
    gap: 2vw;
}

.center-menu ul li a {
    color: #99CAED;
    font-family: Gilroy-Medium;
    font-size: 1VW;
    font-style: normal;
    font-weight: 400;
    letter-spacing: -0.48px;
    transition: all .3s;
}
.center-menu ul li a:hover{
    color:#4e96ca;
}
.center-menu .btn-group {
    display: flex;
    align-items: center;
    gap: 1.5vw;
}
.btn2{
    width: 10vw;
    height: 4vw;
    font-style: normal;
    color: #FFF;
    font-family: Gilroy-Medium;
    font-size: 1vw;
    font-style: normal;
    font-weight: 400;
    border-radius: 35px;
    background: linear-gradient(90deg,#0A64A4 0%,#73E0F1 100%);
    z-index: 1;
    filter: blur(.2px);
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: .2s;
}
.btn2::before{
    position: absolute;
    content: "";
    width: 96%;
    height: 89%;
    background: #093058;
    top: .2vw;
    left: .2vw;
    border-radius: 35px;
    z-index: -1;
}
.btn2:hover{
    background: #000000;
    color: #ffffff;
    border: 2px solid #ffffff;
}
/* --------------------------------hero-section--------------
-------------------- */
.parent {
    background: url("../images/hero-bg.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.hero-section {
    /* background: url("../images/hero-bg.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover; */
    display: flex;
    height: 70vw;
    flex-direction: column;
    align-items: center;
    position: relative;
}
.hero-wrap{
    display: flex;
    justify-content: space-between;
    width: 85%;
    padding: 10vw 0;
    position: relative;
}
.hero-wrap .left{
    width: 48%;
}
.hero-wrap .right {
    width: 48%;
}
.hero-wrap p{
    font-size: 1.5vw;
    line-height: 2.2vw;
    margin: 1vw 0;
    animation: ZoomIn 1s linear  1 forwards;
}
.hero-wrap .btn-group {
    display: flex;
    align-items: center;
    gap: 1vw;
}
.hero-wrap .btn-group a {
    color: #FFF;
    font-family: Gilroy-Bold;
    font-size: 1.2vw;
    font-style: normal;
    font-weight: 400;
    padding: 1vw 2vw;
    margin-top: 2vw;
    transition: all .4s;
}
.hero-wrap .btn-group a:hover{
    filter: drop-shadow(2px 2px 10px #73E0F1);
}
.hero-wrap .btn-group a:first-child{
    border-radius: 35px;
    border: 1px solid #73E0F1;
    background: linear-gradient(90deg, #0A64A4 0%, #73E0F1 100%);
}
.hero-wrap .right img{
    position: absolute;
    top: 0;
    right: -7.4vw;
    width: 40%;
}
/* --------------markets---------
------- */
.markets{
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    padding: 0 12vw;
    margin-top: -8vw;
    position: relative;
    z-index: 2;
}
.markets img {
    width: 10vw;
}
/* ------------lorem-----
------ */
.lorem{
    padding:8vw 5vw;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    /* background: url("../images/hero-bg.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover; */
}
.lorem .box{
    width: 30%;
    min-height: 25vw;
    border-radius: 20px;
    background: #071027;
    padding: 3vw;
}
.lorem .box img {
    width: 2vw;
    animation: rotate 4s linear infinite forwards;
    backface-visibility: visible;
}
@keyframes rotate {
    0%,100%{
        transform: rotateY(0deg);
    }
    50%{
        transform: rotateY(360deg);
    }
}
.lorem .box h5{
    color: #FFF;
    font-family: Poppins;
    font-size: 1.4vw;
    font-style: normal;
    font-weight: 600;
    letter-spacing: -0.6px;
    margin: 2vw 0;
}
.lorem .box p{
    color: #99A9B9;
}
/* --------------community------
----- */
.parent-2{
    background: url("../images/parent-2-bg.png")no-repeat;
    background-position: top center;
    background-size: cover;
    padding-top: 30vw;
    margin-top: -15vw;
}
.community {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 5vw 8vw 5vw 0;
    margin-top: -10vw;
}
.community .left {
    width: 48%;
}
.community .right {
    width: 48%;
}
.community p{
    color:#EFF;
    opacity: .6;
    margin: 2vw 0;
}
/* ----------join-telegram---------
------- */
.j-tg {
    margin: 3vw 8vw;
    padding: 4vw;
    border-radius: 27px;
    border: 1px solid #000;
    background: linear-gradient(108deg, #12293C 13.47%, rgba(18, 41, 60, 0.40) 96.53%);
}
.j-tg h4{
    font-family: Gilroy-Bold;
    font-size: 1.8vw;
    font-style: normal;
    font-weight: 400;
    background: linear-gradient(270deg, #88E4FC 0%, #FFF 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: 1vw;
}
.j-tg a{
    border-radius: 35px;
    border: 1px solid #73E0F1;
    background: linear-gradient(90deg, #0A64A4 0%, #73E0F1 100%);
    padding: 1vw 2vw;
    color: #FFF;
    font-family: Gilroy-Bold;
    font-size: 1vw;
    font-style: normal;
    font-weight: 400;
    transition: all .3s;
    box-shadow: 0PX 5PX 15PX #4eb4d6cd;
}
.j-tg a:hover{
    background: transparent;
    color: #73E0F1;
}
.j-tg p{
    margin-bottom: 3vw;
    color: #EFF;
    opacity: .6;
}

/* --------------more------
----- */
.more {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 5vw 8vw;
}
.more .left {
    width: 48%;
}
.more .right {
    width: 48%;
}
.more p{
    color:#EFF;
    opacity: .6;
    margin: 2vw 0;
}
/* ------------roadmap------
------ */
.parent-3{
    background: url("../images/parent-bg-3.png")no-repeat;
    background-position: top center;
     background-size: cover;
     padding-top: 25vw;
     margin-top: -18vw;
}
.roadmap{
    padding: 5vw 8vw;
}
.roadmap h2{
    text-align: center;
    margin-bottom: 5vw;
}
.road-wrap{
    display: flex;
    justify-content: space-between;
}
.road-wrap h3{
    margin-bottom: 1vw;
}
.road-wrap p{
    opacity: .6;
}
.road-wrap .road-box{
    width: 30%;
    text-align: center;
    padding: 3vw;
}

/* ----------join---------
------- */
.join {
    margin: 3vw 8vw;
    padding: 4vw;
    text-align: center;
    border-radius: 21px;
    background: linear-gradient(180deg, #69D4EA 0%, rgba(1, 1, 1, 0.00) 100%);
}
.join h2{
    margin-bottom: 1vw;
    text-align: center;
}
.join a{
    border-radius: 35px;
    border: 1px solid #73E0F1;
    background: linear-gradient(90deg, #0A64A4 0%, #73E0F1 100%);
    padding: 1vw 2vw;
    color: #FFF;
    font-family: Gilroy-Bold;
    font-size: 1vw;
    font-style: normal;
    font-weight: 400;
    transition: all .3s;
    box-shadow: 0PX 5PX 15PX #4eb4d6cd;
}
.join a:hover{
    background: transparent;
    color: #73E0F1;
}
.join p{
    margin-bottom: 3vw;
    color: #EFF;
    opacity: .6;
    text-align: center;
    
}

/* --------------------------------website Responsive--------------
-------------------- */

/* ----------------------------@ 1280px--------
------- */

@media (max-width: 1280px) {

    /* -------------------------navbar 1280px--------------------------
    ----------------------- */
    

    .header ,.navbar {
        border-radius: 2vw;
    }

    .header .navbar .left-side-menu a {
        font-size: 2.3vw;
    } 

    .header .navbar .left-side-menu a img {
        width: 15vw;
    }
    .center-menu ul li a{
        font-size: 1.2vw;
    }


}

/* ----------------------------@ 980px--------
------- */

@media (max-width: 980px) {

    .btn {
        border-radius: 5vw;
        padding: 1vw 2vw;
        font-size: 1.2vw;
    }
    .btn:hover {
        transform: scale(1.03);
    }
    .btn2::before{
        top: 0.25vw;
        left: 0.22vw;
    }

.header .navbar {
    padding-top: 1vw;
    padding-bottom: 1vw;
}

.header .navbar .left-side-menu {
    width: 30%;
}

.header .navbar .left-side-menu a img {
    width: 20vw;
    height: auto;
    position: relative;
}

.header .navbar .left-side-menu a {
    font-size: 3vw;
    font-weight: 800;
    gap: 1vw;
}

.header .center-menu a li {
    font-size: 3vw;
    padding: 2vw;
    font-weight: 600;
}

.header .center-menu a li:hover {
    border-radius: 0vw;
    background: transparent;
    top: 0;
    transform: scale(1.1);
}

.header .center-menu .tg:hover li{
    color: #000000;
}

.center-menu {
    display: flex;
    width: 40vw;
    height: 55vw;
    flex-direction: column;
    justify-content: center;
    gap: 2vw;
    padding-top: 5vw;
    /* display: none; */
    margin-top: -900px;
    transition: all 1s ease-in-out;
    position: absolute;
    top: 0vw;
    right: 0vw;
    background-color: #D3EFFF;
    z-index: -1;
    border-radius: 2vw;
    /* border-left: 2px solid rgba(255, 255, 20, 0.5);
    border-top: 2px solid rgba(255, 255, 20, 0.5); */
}
.center-menu ul{
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-bottom: 1vw;
}
.center-menu ul li a {
    font-size: 3vw;
}
.center-menu .btn-group {
    flex-direction: column;
    justify-content: center;
    gap:4vw;
}
.center-menu .btn-group a{
    font-size: 2.5vw;
    padding: 1.5vw 4vw;
    width: 18vw;
    height: 6vw;
}
.center-menu .btn-group a::before{
    width: 96%;
    left: 0.35vw;
    top: .35vw;
}

.center-menu.active {
    margin-top: 0;
    /* display: flex; */
    background-color: #1d1616;
}

.center-menu .tg {
    background-color: transparent;
    width: 100%;
    display: flex;
    justify-content: center;
    transition: all 0s;
}


.center-menu .tg:hover {
    background: #F2E0C8;
}

.header .navbar .center-menu .right-side-menu {
    margin-left: 0%;
    margin-bottom: 1vw;
}

.navbar-toggle span {
    display: block;
    width: 5vw;
    height: .5vw;
    margin: 0.7vw;
    border-radius: 50px;
    transition: all 0.5s;
}

.navbar-toggle span:nth-child(2) {
    width: 3.5vw;
}

.navbar-toggle {
    display: block;
  }
  
  .navbar-toggle.active span:nth-child(1) {
    transition-delay: 0.1s;
    transform: rotate(45deg) translate(1.3vw, 1.3vw);
  }
  
  .navbar-toggle.active span:nth-child(2) {
    opacity: 0;
  }
  
  .navbar-toggle.active span:nth-child(3) {
    transition-delay: 0.1s;
    transform: rotate(-45deg) translate(0vw, 0vw);
    position: relative;
    top: -1.6vw;
  }

}


@media (max-width: 768px) {

    
  }

/* ----------------------------@ 600px--------
------- */

@media (max-width: 600px) {
    .special-para{
        font-size: 2.4vw;
        line-height: 2.6vw;
        letter-spacing: .5vw;
        

    }
    p{
        font-size: 2.4vw;
        line-height: 3.2vw;
        text-align: center;
    }
    h1{
        font-size: 12vw;
        line-height: 12vw;
        text-align: center;
    }
    h2 {
        font-size: 9vw;
        line-height: 11vw;
    }
    h3{
        font-size: 6vw;
    }
    h6{
        font-size: 2.6vw;
        line-height: 3.8vw;
    }

    .btn {

        border-radius: 5vw;
        padding: 2vw 4vw;
        font-size: 2.8vw;
    }
    .btn2{
        width: 27vw;
        height: 8vw;
        font-size: 2.2vw;
    }
    .btn2::before {
        top: 0.46vw;
        left: 0.52vw;
    }
    

    .header .navbar .left-side-menu {
        width: 50%;
    }

    .header .navbar .left-side-menu a img {
        width: 50%;
        height: auto;
        position: relative;
    }

    .header .navbar .left-side-menu a img {
        width: 30vw;
    }
    .header .center-menu .right-side-menu{
        border: .2vw solid #BD8D4C;
        border-radius: 5vw;
        padding: 2.8vw 4vw;
        font-weight: 600;
        font-size: 2.8vw;
        line-height:2vw;
        letter-spacing: 1.6px;
        text-transform: uppercase;
        color: #F2E0C8;
        transition: all .5s;
    }
    
    .header .center-menu a li {
        font-size: 3.5vw;
        padding: 3.5vw;
    }

    .center-menu {
        border-radius: 2vw;
        height: 60vw;
        height: 70vw;
    }
    .center-menu ul {
        gap: 6vw;
        margin-bottom: 3vw;
    }

    .navbar-toggle span {
        display: block;
        width: 7vw;
        height: .7vw;
        margin: 0.7vw;
        border-radius: 50px;
        transition: all 0.5s;
    }
    
    .navbar-toggle span:nth-child(2) {
        width: 5vw;
    }
    
    .navbar-toggle {
        display: block;
      }
      
      .navbar-toggle.active span:nth-child(1) {
        transform: rotate(45deg) translate(1.3vw, 1.3vw);
      }
      
      .navbar-toggle.active span:nth-child(2) {
        opacity: 0;
      }
      
      .navbar-toggle.active span:nth-child(3) {
        transform: rotate(-45deg) translate(0vw, 0vw);
        position: relative;
        top: -2.5vw;
      }
      
/* --------------------------------hero-section--------------
-------------------- */
.parent {
    background: url("../images/hero-bg.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.hero-section {
    /* background: url("../images/hero-bg.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover; */
    display: flex;
    height: 104vw;
    flex-direction: column;
    align-items: center;
    position: relative;
}
.hero-wrap{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 90%;
    padding: 18vw 0;
    position: relative;
}
.hero-wrap .left{
    width: 100%;
}
.hero-wrap .right {
    width: 100%;
}
.hero-wrap p{
    font-size: 2.2vw;
    line-height: 3.5vw;
    margin: 3vw 0;
    padding: 0 9vw;
    animation: ZoomIn 1s linear  1 forwards;
}
.hero-wrap .btn-group {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2vw;
}
.hero-wrap .btn-group a {
    color: #FFF;
    font-family: Gilroy-Bold;
    font-size: 2.2vw;
    font-style: normal;
    font-weight: 400;
    padding: 2vw 5vw;
    margin-top: 2vw;
}
.hero-wrap .btn-group a:first-child{
    border-radius: 35px;
    border: 1px solid #73E0F1;
    background: linear-gradient(90deg, #0A64A4 0%, #73E0F1 100%);
}
.hero-wrap .right img{
    position: absolute;
    top: 0;
    right: -7.4vw;
    width: 40%;
    display: none;
}
/* --------------markets---------
------- */
.markets{
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    padding: 0 12vw;
    margin-top: -20vw;
    position: relative;
    z-index: 2;
}
.markets img {
    width: 10vw;
}
/* ------------lorem-----
------ */
.lorem{
    padding:8vw 5vw;
    display: flex;
    gap: 5vw;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    /* background: url("../images/hero-bg.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover; */
}
.lorem .box{
    width: 100%;
    min-height: 25vw;
    border-radius: 20px;
    background: #071027;
    padding: 5vw;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.lorem .box img {
    width: 5vw;
}
.lorem .box h5{
    color: #FFF;
    font-family: Poppins;
    font-size: 3.7vw;
    font-style: normal;
    font-weight: 600;
    letter-spacing: -0.6px;
    margin: 2vw 0;
}
.lorem .box p{
    color: #99A9B9;
}
/* --------------community------
----- */
.parent-2{
    background: url("../images/parent-2-bg.png")no-repeat;
    background-position: top center;
    background-size: cover;
    padding-top: 36vw;
    margin-top: -15vw;
}
.community {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    padding: 5vw;
    margin-top:0;
}
.community .left {
    width: 100%;
}
.community .right {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;

}
.community p{
    color:#EFF;
    opacity: .6;
    margin: 3vw 0;
}
/* ----------join-telegram---------
------- */
.j-tg {
    margin: 3vw 8vw;
    padding: 6vw;
    border-radius: 27px;
    text-align: center;
    border: 1px solid #000;
    background: linear-gradient(108deg, #12293C 13.47%, rgba(18, 41, 60, 0.40) 96.53%);
}
.j-tg h4{
    font-family: Gilroy-Bold;
    font-size: 4vw;
    font-style: normal;
    font-weight: 400;
    background: linear-gradient(270deg, #88E4FC 0%, #FFF 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: 2vw;
}
.j-tg a{
    border-radius: 35px;
    border: 1px solid #73E0F1;
    background: linear-gradient(90deg, #0A64A4 0%, #73E0F1 100%);
    padding: 2vw 5vw;
    color: #FFF;
    font-family: Gilroy-Bold;
    font-size: 2.2vw;
    font-style: normal;
    font-weight: 400;
    transition: all .3s;
    box-shadow: 0PX 5PX 15PX #4eb4d6cd;
}
.j-tg a:hover{
    background: transparent;
    color: #73E0F1;
}
.j-tg p{
    margin-bottom: 5vw;
    color: #EFF;
    opacity: .6;
}

/* --------------more------
----- */
.more {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    padding: 15vw 5vw;
    gap: 10vw;
    padding-bottom: 35vw;
}
.more .left {
    width: 100%;
    text-align: center;
}
.more .right {
    width: 100%;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.more p{
    color:#EFF;
    opacity: .6;
    margin: 3vw 0;
}
/* ------------roadmap------
------ */
.parent-3{
    background: url("../images/parent-bg-3.png")no-repeat;
    background-position: top center;
     background-size: cover;
     padding-top: 42vw;
     margin-top: -63vw;
}
.roadmap{
    padding: 5vw 5vw;
}
.roadmap img{
    display: none;
}
.roadmap h2{
    text-align: center;
    margin-bottom: 5vw;
}
.road-wrap{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5vw;
    justify-content: space-between;
}
.road-wrap h3{
    margin-bottom: 2vw;
}
.road-wrap p{
    opacity: .6;
    padding: 0 15vw;
}
.road-wrap .road-box{
    width: 100%;
    text-align: center;
    padding: 3vw;
}

/* ----------join---------
------- */
.join {
    margin: 3vw 8vw;
    padding: 4vw;
    text-align: center;
    border-radius: 21px;
    background: linear-gradient(180deg, #69D4EA 0%, rgba(1, 1, 1, 0.00) 100%);
}
.join h2{
    margin-bottom: 1vw;
    text-align: center;
}
.join a{
    border-radius: 35px;
    border: 1px solid #73E0F1;
    background: linear-gradient(90deg, #0A64A4 0%, #73E0F1 100%);
    padding: 2vw 5vw;
    color: #FFF;
    font-family: Gilroy-Bold;
    font-size: 2.2vw;
    font-style: normal;
    font-weight: 400;
    transition: all .3s;
    box-shadow: 0PX 5PX 15PX #4eb4d6cd;
}
.join a:hover{
    background: transparent;
    color: #73E0F1;
}
.join p{
    margin-bottom: 5vw;
    color: #EFF;
    opacity: .6;
    text-align: center;
    
}
.copyright p{
    font-size: 2.2vw !important;
}

  }
  
@keyframes FadeInLeft {
    0%{
        transform: translateX(-100%);
        opacity: 0;
        letter-spacing: .7vw;
        filter: blur(5px);
    }
    100%{
        transform:unset;
        opacity: 1;
        letter-spacing: unset;
        filter: unset;
    }
}
@keyframes ZoomIn {
    0% {
      transform: scale(0);
      transform-origin: center;
    }
    100% {
      transform: scale(1);
    }
  }