@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap');
body {
    font-family: 'Golos', sans-serif;
    color: #68738D;
    background: #fff;
}
html {
    overflow-x: hidden;
}
td {
    white-space: nowrap;
}
.main-title {
    line-height: 1;
    font-size: var(--main-title-fs);
}
.navbar-toggler {
    color: transparent;
    border: none;
}
.navbar-toggler.collapsed .navbar-toggler-icon {
    
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
    height: 30px;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
.navbar-toggler .navbar-toggler-icon {
    background: url(../img/x-lg-icon.svg) no-repeat center center / contain;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
:root {
    --navy-color: #041836;
    /* pc/laptop */
    --number-fs-pc: 114px;
    --section-title-fs: 21px;
    --unit-fs-pc: 79px;
    --currency-fs-pc: 79px;
    --heading-title-pc: 64px;
    --text-box: 21px;
    --advantage-title: 38px;
    --advantage-content: 21px;
    --mini-title-fs: 38px;
    --sdk-img: 100%;
    --header-title: 88px;
    --header-des: 21px;
    --section-number-fs: 45px;
    --p-maxwidth: 380px;
    --p-maxwidth-des: 195px;
    --plugin-img: 100%;
    --unity-game-fs: 45px;
    --community-platform-img: 30%;
    --navbar-fs: 12px;
    --navbar-link-fs: 16px;
    --section-title-fs: 64px;
    --main-title-fs: 88px;
    
    /* ipad */
    --number-fs-ipad: 80px;
    --mini-title-fs-ipad: 31px;
    --title-fs-ipad: 54px;
    --des-fs-ipad: 21px;
    --mini-des-fs-ipad: 18px;
    --unit-fs-ipad: 55px;
    --currency-fs-ipad: 44px;
    --heading-title-ipad: 54px;
    
    /* mobi */
    --number-fs-mobi: 50px;
    --section-title-fs-mobi: 18px;
    --title-fs-mobi: 31px;
    --mini-des-fs-mobi: 16px;
    --unit-fs-mobi: 30px;
    --currency-fs-mobi: 30px;
    --heading-title-mobi: 45px;
    --text-box-mobi: 18px;

    /* PRICING */
    --header-subtitle-fs: 21px;
    --footer-title: 54px;
    --price-table-title: 31px;
    --price-plan-title: 21px;
    --price-heading-plan-title: 25px;
}
#homepage .numberthree img:not(:last-child) {
    max-width: var(--sdk-img);
}
.product-list, .blog-list {
    position: initial;
}
.table-title {
    white-space: nowrap;
}
img {
    max-width: 100%;
}
a {
    display: inline-block;
    text-decoration: none;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
.btn:hover {
    border-color: transparent;
}
.btn-check:focus+.btn, .btn:focus {
    border-color: transparent;
}
nav .collapse ul li{
    font-size: var(--navbar-fs);
}
nav .nav-link {
    font-size: var(--navbar-link-fs);
}
.indicator {
    z-index: -1;
    margin: 0 0 25px 25px;
}
section {
    padding: 60px 0;
}
.sub {
    background: #20c8a0;
    padding: 15px 0;
    border: 2px solid #20c8a0;
    border-radius: 12px;
}
.sub:hover {
    background: #16ecb3;
    border: 2px solid #16ecb3;
}
.lh-35 {
    line-height: 35px;
}
.lh-27 {
    line-height: 27px;
}
.lh-1 {
    line-height: 1;
}
.des {
    margin: 0 25%;
}
.bluebg {
    padding: 15px 0 15px 15px;
}
/*========================== HEADER ==========================*/
header .dev, header .dev:hover {
    background: #E2EFF8;
}
header .lightblue:hover {
    background: #2E7DAF;
}
header .hoverWhite:hover {
    background: #fff;
}
header .submenu:hover {
    background: #E2EFF8;
    border-radius: 15px;
}
header .dropdown-menu.show {
    display: flex;
}
header  .navbar-expand-lg .navbar-nav .dropdown-menu {
    border: 1px solid #fff;
    box-shadow: rgb(0 0 0 / 28%) 0px 18px 50px -10px;
    border-radius: 20px;
    margin-top: 15px;
}
header .navbar-expand-lg .navbar-nav .dropdown-menu.rightdrop {
    margin-left: -846px;
}
.top {
    background: #041836;
    padding: 12px 0 6px 0;
}
header .container-fluid {
    padding: 0 266px;
}
header .top span {
    color: #00F7C8;
}
header .register {
    padding: 13px 20px;
    border: 3px solid #fff;
    margin-top: -3px;
    margin-left: -3px;
}
header .pink-border{ 
    border-right: 4px solid #EF00FA;
    border-bottom: 4px solid #EF00FA;
    position: relative;
}
header .register:hover {
    background: #fff;
    color: #041836 !important;
    transition: 0.8s;
    margin-left: -3px;
}
header .pink-border:hover {
    border-right: 4px solid #041836;
}
header .pink-border:hover::before {
    position: absolute;
    content: "";
    background: #EF00FA;
    width: 4px;
    height: 4px;
    left: -3px;
    bottom: -4px;
}
header .pink-border:hover::after {
    position: absolute;
    content: "";
    background: #041836;
    width: 4px;
    height: 4px;
    right: -4px;
    bottom: -4px;
}
header .apply {
    font-size: 10px;
    background-color: #16ECB3;
    padding: 4px 8px;
    border-radius: 6px;
    color: #fff;
    margin-left: 6px;
}
header .address {
    background: #F2F6FF;
    border-radius: 12px;
    border: 2px solid #2e7daf33;
    padding: 15px 20px;
}
header .sub {
    background: #20c8a0;
    padding: 15px 20px;
    border: 2px solid #20c8a0;
    border-radius: 12px;
}
header .sub:hover {
    background: #16ecb3;
    border: 2px solid #16ecb3;
}
.header-des {
    max-width: var(--p-maxwidth);
    font-size: var(--header-des);
}
.des-width {
    max-width: var(--p-maxwidth-des);
}



/*========================== FOOTER ==========================*/
footer .address {
    background: #F2F6FF;
    border-radius: 12px;
    border: 2px solid #2e7daf33;
    padding: 15px 20px;
}
footer .form-check-input:checked {
    background-color: #20c8a0;
    border-color: #20c8a0;
}
footer .form-check-input {
    width: 20px;
    height: 20px;
}
footer .checktext {
    color: #04183642;
}
footer a.checktext:hover {
    color: #04183642;
    text-decoration: none !important;
}
footer .tag {
    font-size: 10px; 
    background: #20c8a0;
    padding: 2px;
    border-radius: 4px;
}
footer .tag.hot {
    background: #DB0814;
}
footer .listfooter li {
    margin: 0 10px;
}
footer .listfooter li a:hover {
    color: #00c3f8;
}
footer .privacy {
    font-size: 14px;
}
footer .social i {
    font-size: 31px;
}
  

/*========================== ALL PAGE ==========================*/
a {
    color: #68738D;
    padding: 10px;
}
footer a {
    padding: 0;
}
a:hover {
    color: #68738D;
}
.grey-text {
    color: #68738D;
}
.darkblue-text {
    color: #041836 !important;
}
.header-title {
    font-size: var(--header-title);
    line-height: 1;
    font-weight: 800;
}
.btndark {
    border: 2px solid #041836;
    border-radius: 12px;
    padding: 12px 20px;
    font-size: 16px;
    line-height: 1;
    white-space: nowrap;
}
.login-btn {
    padding: 16px 20px;
    border-radius: 12px;
    font-size: 16px;
}
.login-btn:hover {
    color: #1FA6F5;
    border-color: #F2F6FF;
    border-radius: 12px;
    background-color: #F2F6FF;
}
.btndark:hover {
    background: #041836 !important;
    color: #fff !important;
}
.black-50 {
    color: #04183642;
}
.w-45 {
    width: 45px;
}
.fs-10 {
    font-size: 10px;
}
.fs-13 {
    font-size: 13px;
}
.fs-14 {
    font-size: 14px;
}
.fs-60 {
    font-size: 60px;
}
.fs-114 {
    font-size: 114px;
}
.fs-79 {
    font-size: 79px!important;
}
.fs-64 {
    font-size: 64px!important;
}
.fs-54 {
    font-size: 54px;
}
.fw-600 {
    font-weight: 600;
}
.fw-900 {
    font-weight: 900;
}
.blue-text {
    color: #00c3f8;
}
.greydark {
    color: #527FA1;
}
.navbar-nav .nav-item .nav-link {
    color: #68738D;
    padding: 15px 20px;
    margin-right: 10px;
    border-radius: 10px;
}
.navbar-nav .nav-item .nav-link:hover {
    color: #1FA6F5;
    background: #f2f6ff;
}
.darkHover:hover {
    color: #1FA6F5 !important;
}
.bg-darkblue {
    background: #041836;
}
.radius-12 {
    border-radius: 12px;
}
.text-green {
    color: #21BF96;
}
.signUp {
    background: #20c8a0;
    padding: 14px 20px;
    border-radius: 12px;
}
.signUp:hover {
    background: #16ecb3;
}
.unit {
    font-size: var(--unit-fs-pc);
}
.currency {
    font-size: var(--currency-fs-pc);
}
.grad-green {
    background: linear-gradient(110.59deg, #14F4C9 2.63%, #069EFC 96.85%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.z-index-3 {
    z-index: 3;
}
.bgGrey {
    background: #F2F6FF;
}

/*========================== HOME PAGE ==========================*/ 
/* #homepage .backend {
    top: 97px;
    left: 98px;
} */
/* #homepage .codeLayers {
    left: 50%;
    transform: translateX(-50%);
} */
/* #homepage .fontend {
    left: 173px;
    top: 183px;
} */
#homepage .bg-blurpink::after {
    background-image: radial-gradient(37.66% 48.2% at 47.64% 52.94%, #E9CDFF 0%, rgba(255, 239, 254, 0) 100%);
    content: "";
    position: absolute;
    width: 1910px;
    height: 1160px;
    left: 421px;
    z-index: -1;
}
.blur-bg .behind img {
    max-width: var(--plugin-img)!important;
}
/* #homepage .community {
    margin-top: 55px;
} */
#homepage .community .scalable {
    padding: 130px 0;
}
#homepage .community .scalable, #homepage .community .scalable span {
    line-height: 1;
}
#homepage .scalable .mini-title {
    font-size: var(--mini-title-fs);
}
#homepage .workflow .numberGrad {
    width: 65px;
    height: 65px;
    background: linear-gradient(110.59deg, #069EFC 2.62%, #14F4C9 2.63%, #069EFC 96.85%);
    border-radius: 50%;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    position: relative;
    font-size: var(--section-number-fs);
}
#homepage .images-slider::after {
    position: absolute;
    content: "";
    background-image: radial-gradient(37.66% 48.2% at 47.64% 52.94%, #36faff4a 0%, rgba(255, 239, 254, 0) 100%);
    width: 800px;
    height: 700px;
    top: 0;
}
#homepage .workflow .text-box {
    font-size: var(--text-box);
}
.advantage-title {
    font-size: var(--advantage-title);
}
.advantage-content {
    font-size: var(--advantage-content);
}
#homepage .workflow .heading-title {
    font-size: var(--heading-title-pc);
    line-height: 1;
}
@keyframes xfade {
    25% {
        opacity: 1;
    }
    40% {
        opacity: 0;
    }
}
@keyframes fade {
    20% {
        visibility: visible;
    }
    30% {
        visibility: hidden;
    }
}
#homepage .workflow .image-holder {
    height: 300px;
}
#homepage .workflow .image-holder .image-content-slide {
    position: absolute;
    left: 50%;
    top: 60%;
    transform: translate(-50%, -50%);
    animation: xfade 12s infinite;
    opacity: 0;
}
#homepage .workflow .image-holder .thumbnail-highlted-three {
    animation-delay: 0s;
}
#homepage .workflow .image-holder .thumbnail-highlted-two {
    margin-left: 47.5%;
    animation-delay: 4s;
}
#homepage .workflow .image-holder .thumbnail-highlted-one {
    margin-left: 55%;
    animation-delay: 8s;
}
#homepage .workflow .image-content-slide:nth-child(1) {
    animation-delay: 8s;
}
#homepage .workflow .image-content-slide:nth-child(2) {
    animation-delay: 4s;
}
#homepage .workflow .image-content-slide:nth-child(3) {
    animation-delay: 0s;
}
#homepage .workflow .image-holder {
    position: relative;
    text-align: left;
    font-size: 0;
    height: 500px;
    margin-bottom: 100px;
}
#homepage .workflow .thumbnail-tab {
    position: fixed;
    left: -9999px;
}
#homepage .workflow .vertical::before {
    position: absolute;
    content: "";
    width: 4px;
    height: 84px;
    top: -107px;
    background: linear-gradient(#F2FDFF, #069EFC);
}
#homepage .workflow .number {
    padding-top: 130px;
}
#homepage .workflow .moralis {
    max-width: 112%;
    margin-left: -6%;
}
#homepage .workflow .numbertwo::before {
    position: absolute;
    content: "";
    width: 800px;
    height: 900px;
    left: -632px;
    background-image: radial-gradient(37.66% 48.2% at 47.64% 52.94%, #C5F4FF 0%, rgba(255, 239, 254, 0) 100%);
}
#homepage .workflow .numbertwo::after {
    position: absolute;
    content: "";
    width: 800px;
    height: 958px;
    right: -541px;
    top: 273px;
    background-image: radial-gradient(37.66% 48.2% at 47.64% 52.94%, #bedafd 0%, rgba(255, 239, 254, 0) 100%);
}
@keyframes border-dance {
  0% {
    background-position: 0px 0px, 253px 153px, 0px 253px, 153px 0px;
  }
  100% {
    background-position: 253px 0px, 0px 153px, 0px 0px, 153px 253px;
  }
}
#homepage .workflow .numberthree::before {
    position: absolute;
    content: "";
    width: 1046px;
    height: 111%;
    left: -522px;
    background-image: radial-gradient(37.66% 48.2% at 47.64% 52.94%, #DBD2FF 0%, rgba(255, 239, 254, 0) 100%);
}
#homepage .workflow .webthree::before {
    position: absolute;
    content: "";
    width: 705px;
    height: 566px;
    background-image: radial-gradient(37.66% 48.2% at 47.64% 52.94%, #f5dea0 0%, rgba(255, 239, 254, 0) 100%);
    right: 50%;
    transform: translateX(50%);
    bottom: 7px;
    z-index: -1;
}
#homepage .workflow .numberfour::after {
    position: absolute;
    content: "";
    width: 1178px;
    height: 1163px;
    right: -668px;
    top: -255px;
    background-image: radial-gradient(37.66% 48.2% at 47.64% 52.94%, #F5CEFF 0%, rgba(255, 239, 254, 0) 100%);
}
#homepage .workflow .unicorn {
    border-radius: 20px;
}
#homepage .workflow .blur img {
    filter: blur(3px);
    position: absolute;
    right: 0;
    top: 0;
}
#homepage .workflow .ecosystem::after {
    background-image: radial-gradient(40.6% 48.2% at 47.64% 52.94%, #7820BE 0%, rgba(4, 24, 54, 0) 100%);
    content: "";
    position: absolute;
    width: 1598px;
    height: 1463px;
    top: 192px;
    right: -793px;
    z-index: 1;
}
#homepage .thecommunity {
    background: #041836;
}
.community-title {
    font-size: var(--advantage-title);
}
.community-content {
    font-size: var(--advantage-content);
}
#homepage .thecommunity .powerimage {
    border-radius: 10px;
}
#homepage .thecommunity .fa-play {
    background: rgba(32, 200, 160, 0.7);
    padding: 29px;
    font-size: 44px;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 95px;
    height: 95px;
    margin: 0 26px;
} 
#homepage .thecommunity .unity:hover {
    color: rgba(32, 200, 160, 0.7) !important;
}
#homepage .thecommunity .game {
    background: linear-gradient(180deg, rgba(4, 24, 54, 0) 57.19%, #234271 100%);
    border-bottom-right-radius: 9px;
    border-bottom-left-radius: 9px;
}
#homepage .thecommunity .modal-header {
    border-bottom: 0;
}
#homepage .thecommunity .allgame {
    content: "";
    position: absolute;
    background: linear-gradient(180deg, rgba(4, 24, 54, 0) 0%, #041836 100%);
    width: 100%;
    height: 100%;
    bottom: 24px;
}
#homepage .thecommunity .learnmore {
    border: 2px solid;
    display: inline-block;
    border-radius: 12px;
    padding: 16px 24px;
}
#homepage .thecommunity .learnmore:hover {
    background: #fff;
    border: 2px solid #fff;
    color: #041836 !important;

}
#homepage .thecommunity .learnmore .position-absolute {
    left: 50%;
}
#homepage .thecommunity .leartop {
    margin-top: -50px;
    margin-bottom: 170px;
}
#homepage .thecommunity .blueLink {
    color: #51A5DA; 
}
#homepage .thecommunity .blueLink:hover {
    color: #069EFC;
}
#homepage .thecommunity .join {
    background: radial-gradient(97.23% 220.41% at 0% -0.14%, #FFFFFF 0%, #FFFFFF 34.4%, rgba(245, 247, 255, 0.945257) 100%);
    box-shadow: 4px 6px 70px rgb(44 97 176 / 20%);
}
#homepage .building {
    background: linear-gradient(#fff, #CBF6FF) no-repeat center center / cover;
    margin-top: -138px;
}
/* #homepage .building::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 200px;
    background: url("../img/contactGrid2.svg") center no-repeat;
    left: 0;
    bottom: 0;
    opacity: 0.5;
} */
#homepage .bgbuild {
    padding: 75px 0 0 0;
}
#homepage .modal-content {
    border: none;
    background: transparent;
}
#homepage .modal-body {
    padding: 0;
}
#homepage .trust {
    display: flex;
    justify-content: center;
    align-content: center;
}
#homepage .community .utility .utility-top #increaseNum, #homepage .community .utility .utility-top #increaseNum2  {
    font-size: 114px;
    color: #041836;
}
#homepage .community .utility .utility-bottom {
    font-size: 28px;
    line-height: 1.5;
}
#homepage .community .utility {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.unity {
    font-size: var(--unity-game-fs);
}
.join img {
    width: var(--community-platform-img);
}
/*========================== PRICING ==========================*/ 
#pricing .bluePastel {
    color: #85b3db;
}
#pricing .bgboxBlue {
    box-shadow: rgb(0 107 217 / 20%) 0px 8px 24px;
}
#pricing .borPastel {
    border: 2px solid #85b3db;
}
#pricing .focus {
    padding: 12px 22px;
}
#pricing .compare .focus {
    padding: 12px 22px;
    margin: 0 50px;
}
#pricing .tick {
    color: #21BF96;
    font-size: 13px;
}
#pricing .pasteldark {
    color: #5b8db9;
}
#pricing .starter:hover {
    background-color: #DCEFFD;
    border: 2px solid#0f7fff;
    color: #0f7fff;
}
#pricing .trans:hover {
    transform: translateY(3px);
}
#pricing .dolar {
    margin-top: 12px;
}
#pricing .pro {
    background: #21BF96;
}
#pricing .borPro {
    border: 2px solid #21BF96;
}
#pricing .borPro:hover {
    background-color: #00AD96;
    box-shadow: 0px 0px 9px 0px #33FFCC;
}
#pricing .buniness:hover{
    background: #005AC2 !important; 
    border: 2px solid #005AC2 !important;
    box-shadow: 0px 0px 9px 0px #57A5FF;
}
#pricing .enterprise {
    color: #d497ff;
}
#pricing .explore {
    color: #57A5FF;
}
#pricing .compare {
    padding-top: 400px;
    margin-top: -300px;
}
#pricing .compare .starter:hover {
    border: 2px solid#005AC2 !important;
    color: #005AC2 !important;
}
#pricing .compare .w-240 {
    width: 240px;
}
#pricing .compare .bg-table {
    background: #DCEEFE;
}
#pricing .compare .starterComp {
    border-bottom: 6px solid #85B3DB;
}
#pricing .compare .bortrans {
    border: 2px solid transparent;
}
#pricing .compare .borRgrey {
    border-right: 1px solid #00000012;
}
#pricing .compare .borbot {
    border-bottom: 1px solid #DCEEFE;
}
#pricing .compare .borblue {
    border: 1px solid #DCEEFE;
}
#pricing .compare table {
    border-collapse: collapse;
    border-radius: 25px;
    overflow: hidden;
}
#pricing .compare .borbusin {
    border-right: 2px solid #0F7FFF; 
    border-left: 2px solid #0F7FFF;
}
#pricing .building-price {
    background: linear-gradient(180deg, #120236 -0.4%, #160238 16.29%, #22053F 33.96%, #370A4C 51.63%, #005AC2 97.77%), linear-gradient(180deg, #041836 36.46%, #0A8FAC 100%);
}
#pricing .building-price::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 200px;
    background: url("../img/bgLine2.svg") center;
    left: 0;
    bottom: 0;
    opacity: 0.5;
}
#pricing .bgbuild {
    padding: 0 324px 223px;
}
#pricing .header-subtitle {
    font-size: var(--header-subtitle-fs);
    line-height: 1;
}
#pricing .header-title {
    font-size: var(--heading-title-pc);
    line-height: 1;
}
#pricing .footer-title {
    font-size: var(--footer-title);
    line-height: 1;
}
#pricing .table-title {
    font-size: var(--price-table-title);
}
#pricing .plan-title {
    font-size: var(--price-plan-title);
}
#pricing .heading-plan-title {
    font-size: var(--price-heading-plan-title);
}
#pricing .proComp::after {
    content: "";
    width: 100%;
    height: 6px;
    position: absolute;
    background: #00D1AE;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
}
#pricing .businessComp::after {
    content: "";
    width: 100%;
    height: 6px;
    position: absolute;
    background: #0F7FFF;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
}
#pricing .enterpriseComp::after {
    content: "";
    width: 100%;
    height: 6px;
    position: absolute;
    background: #D497FF;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
}
#pricing .trans {
    white-space: nowrap;
}
/*========================== FAQ ==========================*/ 
#faq img {
    margin-right: -123px;
}
#faq .quanda::after {
    width: 1760.74px;
    height: 1309.42px;
    left: 780px;
    top: -150px;
    content: "";
    position: absolute;
    background: radial-gradient(37.66% 48.2% at 47.64% 52.94%, #E9CDFF 0%, rgba(255, 239, 254, 0) 100%);
}
#faq .faqBlue::before {
    width: 656.74px;
    height: 899.42px;
    top: -70px;
    left: -472px;
    content: "";
    position: absolute;
    background: radial-gradient(37.66% 48.2% at 47.64% 52.94%, #B9E4FE 0%, rgba(255, 239, 254, 0) 100%);
}

/*========================== BLOG ==========================*/ 
#blog {
    background: #F2F6FF;
}
#blog .input-group-text, .form-control {
    background-color: transparent;
    border: 1px solid transparent;
    border-radius: 20px;
}
#blog .input-group {
    border: 2px solid #000;
}
#blog .form-control:focus {
    border-radius: 20px;
    background-color: #F2F6FF;
    border-color: transparent;
    box-shadow: none;
}
#blog .featured img {
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
}
#blog .rightbor {
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
}
#blog .carousel-indicators {
    bottom: -48px;
}
#blog .carousel-control-next, .carousel-control-prev {
    opacity: 1;
    width: auto;
}
#blog .carousel-control-prev {
    left: -22px;
}
#blog .carousel-control-next {
    right: -22px;
}
#blog .carousel-indicators [data-bs-target] {
    background-color: #041836;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    margin-right: 8px;
    margin-left: 8px;
}
#blog .carousel-control-prev-icon, .carousel-control-next-icon {
    background-image: none;
}
#blog .fa-angle-left, .fa-angle-right {
    font-size: 25px;
    background: #ffffffb5;
    padding: 16px;
    width: 30px;
    height: 30px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}
#blog .articles .weblist li:not(:last-child) {
    margin-right: 10px;
}
#blog .articles .weblist a:hover {
    color: #fff;
    background: #041836;
}
#blog .articles .card, .projects .card{
    border-radius: 25px;
    border: none;
}
#blog .articles .card-img, .card-img-top {
    border-top-left-radius: 25px;
    border-top-right-radius: 25px;
}
#blog .articles .page-link {
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
}
#blog .active>.page-link, .page-link.active {
    background: #1FA6F5;
    border-color: #1FA6F5;
}
#blog .active .page-link:hover {
    background: #21BF96;
    border-color: #21BF96;
}
#blog .page-link:hover {
    background: #1FA6F5;
    color: #fff !important;
}
#blog .page-link {
    background-color: transparent;
    border: transparent;
}
#invest .banner {
    background-image: linear-gradient(0deg, #E6F1FF 0.76%, #FFFFFF 100%);
}
#invest .section-title {
    font-size: var(--section-title-fs);
    font-weight: 800;
}
#invest .expert {
    padding: 0;
}
#invest .metatext {
    color: #1fa6f5;
}
#invest .metatext:hover {
    color: #2E7DAF;
}
#invest .ecosystem h5 {
    line-height: 43px;
}
#invest .metatext.contact {
    padding: 18px 0;
}
#invest .metatext.contact:hover {
    color: #2E7DAF;
    background-color: #E6EDFF;
}
#invest .meta {
    box-shadow: rgb(0 129 159 / 22%) 0px 7px 29px 0px;
}
#invest .dashed {
    background: linear-gradient(#fff,#fff) padding-box, linear-gradient(to right, #069EFC80 50%, #14F4C9) border-box;
    border: 3px dashed #fff;
}
#invest .our {
    margin: 0 30px;
}
#sustainability {
    background: #F2F6FF;
    overflow: hidden;
}
#sustainability .sustainability {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
#sustainability .environmental {
    background: #86f3b84d;
}
#sustainability .social {
    background: #F3CE0A80;
}
#sustainability .economic {
    background: #37C3EF4D;
}
#sustainability .human {
    background: #F363634D;
}
#sustainability section.environmental {
    padding-top: 160px;
}
#sustainability section.social {
    padding-top: 200px;
}
#sustainability section.economic {
    padding-top: 250px;
}
#sustainability section.human {
    padding: 250px 0;
}
#sustainability section.human::after {
    position: absolute;
    content: "";
    width: 280px;
    height: 100px;
    background: url(../img/vineBottom.svg) no-repeat;
    right: 400px;
    bottom: 0;
    z-index: 2;
}
#sustainability .susText {
    z-index: 0;
    margin-bottom: 90px;
}
#sustainability .susText::before {
    position: absolute;
    content: "";
    background: url(../img/environmentalSustainabilityBig2.svg) no-repeat;
    width: 308px;
    height: 265px;
    top: -110px;
    z-index: -1;
    left: -60px;
}
#sustainability .susText::after {
    position: absolute;
    content: "";
    background: #86f3b8;
    width: 290px;
    height: 7px;
    left: 0;
    bottom: -34px;
}
#sustainability .sustain::before {
    position: absolute;
    content: "";
    background: url("../img/vineTop.svg") no-repeat;
    top: -468px;
    right: 159px;
    height: 660px;
    width: 210px;
    z-index: 2;
}
#sustainability .sustain::after {
    position: absolute;
    content: "";
    background: url("../img/vineBody.svg");
    top: 404px;
    height: 5210px;
    width: 160px;
    left: 149px;
    z-index: 2;
}
#sustainability .susText.socialText::before {
    background: url(../img/socialSustainabilityBig2.svg) no-repeat;
    top: -140px;
}
#sustainability .susText.socialText::after {
    background: #f3ce0a;
}
#sustainability .susText.economicText::before {
    background: url(../img/economicSustainabilityBig3.svg) no-repeat;
    top: -162px;
}
#sustainability .susText.economicText::after {
    background: #37c3ef;
}
#sustainability .susText.humanText::before {
    background: url(../img/humanSustainabilityBig.svg) no-repeat;
    top: -172px;
}
#sustainability .susText.humanText::after {
    background: #f36363;
}
#sustainability .sustainlast {
    background-image: linear-gradient(180deg, #F2F6FF 66.15%, #BEDCEE 100%);
    padding: 180px 0;
}
#sustainability .logoBottom {
    margin-top: 150px;
}
#sustainability .sustainlast::before {
    position: absolute;
    content: "";
    width: 470px;
    height: 529px;
    background: url(../img/environmentalFooterLeft.svg) no-repeat;
    bottom: 0;
    left: 55px;
}
#sustainability .sustainlast::after {
    position: absolute;
    content: "";
    width: 540px;
    height: 469px;
    background: url(../img/environmentalFooterRight.svg) no-repeat;
    bottom: 0;
    right: 55px;
}
.pinata {
    top: -15px;
    filter: blur(10px);
}
.exchange {
    bottom: 70px;
    left: 15%;
    border-radius: 15px;
    filter: blur(5px);
}
.ship {
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
}
.rockstar {
    right: 15%;
    bottom: 12%;
    filter: blur(2px);
}
.horse {
    top: -10%;
    right: 0;
    border-radius: 15px;
    filter: blur(1px);
}
input.form-control.address:focus {
    box-shadow: none;
    border: 2px solid #2E7DAF33;
    background: #F2F6FF;
}
.expert:hover {
    color: #00c3f8;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
.animate {
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
.smartContract {
    margin: -110px 0 0 -70px;
}
.frontend {
    margin: -365px 0 0 65px;
}
.backend {
    margin: -235px 0 0 0;
}
/*========================== RESPONSIVE ==========================*/ 
@media (max-width: 992px) {
    :root {
        --advantage-title: 31px;
        --advantage-content: 21px;
        --mini-title-fs: 31px;
        --sdk-img: 35%;
        --header-title: 60px;
        --section-number-fs: 35px;
        --unity-game-fs: 30px;
        --community-platform-img: 30%;
        --heading-title-pc: 54px;
        --footer-title: 45px;
        --price-table-title: 18px;
        --price-plan-title: 18px;
        --price-heading-plan-title: 16px;
        --section-title-fs: 54px;
        --main-title-fs: 60px;
    }
    section {
        padding: 50px 0;
    }
    .magazine {
        flex-direction: column-reverse;
        justify-content: center;
    } 
    #homepage .numberthree img:last-child {
        max-width: 90%;
    }
    .indicator {
        margin: 0 0 15px 25px;
    }
    #homepage .workflow .border-pur::before {
        top: 54%;
    }
    .d-flex-md {
        display: flex !important;
    }
    .blue-text {
        color: #00c3f8;
    }
    #homepage .workflow .heading-title {
        font-size: var(--heading-title-ipad);
        line-height: 1;
    }
    .unit {
        font-size: var(--unit-fs-ipad);
    }
    .currency {
        font-size: var(--currency-fs-ipad);
    }
    #homepage .community .utility .utility-top #increaseNum, #homepage .community .utility .utility-top #increaseNum2  {
        font-size: var(--number-fs-ipad);
        color: var(--navy-color);
    }
    .mini-des p {
        font-size: var(--mini-des-fs-ipad);
    }
    .header {
        margin: 0 auto;
    }
    .scalable .mini-title {
        display: inline-block;
        width: 50%;
    }
    #homepage .community .utility {
        justify-content: start;
        align-items: center;
    }
    /* #homepage .codeLayers {
        left: 67%;
        top: 20%;
    } */
    #homepage .header-content {
        margin: 0;
    }
    .d-block-md {
        display: block !important;
    }
    .text-center-md {
        text-align: center;
    }
    .m-0 {
        margin: 0 !important;
    }
    .p-0 {
        padding: 0 !important;
    }
    .ps-10 {
        padding-left: 10px;
    }
    .w-50-md {
        width: 50%;
    }
    .fs-16-md {
        font-size: 16px;
    }
    .fs-18-md {
        font-size: 18px;
    }
    .fs-64 {
        font-size: 64px;
    }
    .fs-54 {
        font-size: 54px;
    }
    .fs-67 {
        font-size: 67px;
    }
    .fs-30 {
        font-size: 30px;
    }
    .fs-40 {
        font-size: 40px;
    }
    .btndark {
        padding: 12px 20px;
        font-size: 16px;
    }
    header .navbar-expand-lg .navbar-nav .dropdown-menu.leftdrop, header .navbar-expand-lg .navbar-nav .dropdown-menu.rightdrop {
        margin-left: 0;
    }
    /* .bluebg {
        padding: 15px 0 15px 15px;
    } */
    .historic {
        padding: 0;
    }
    .truncate-3 {
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
    .w-100-md {
        width: 100% !important;
    }
    #homepage .community {
        margin-top: 0;
    }
    #homepage .service .smartContract {
        margin: -60px 0 0 -90px;
    }
    #homepage .backend {
        margin: -160px 0 0 -25px;
    }
    #homepage .frontend {
        margin: -230px 0 0 35px;
    }
    #homepage .bg-blurpink::after {
        width: 820px;
        height: 513px;
        left: 290px;
        top: 46px;
        background-image: radial-gradient(37.66% 48.2% at 47.64% 52.94%, #e9cdff7a 0%, rgba(255, 239, 254, 0) 100%);
    }
    #homepage .building {
        margin-top: 0;
    }
    #homepage .community .scalable {
        padding: 0;
    }
    #homepage .community .mili {
        margin-top: 0;
    }
    #homepage .workflow .identity {
        padding: 0;
    }
    #homepage .images-slider::after {
        top: -60px;
        left: -196px;
    }
    #homepage .workflow .numbertwo::after {
        right: -631px;
    }
    #homepage .workflow .numbertwo::before {
        left: -602px;
    }
    #homepage .workflow .numberthree::before {
        left: -602px;
    }
    #homepage .workflow .powerful {
        padding: 8px 0;
    }
    #homepage .workflow .webthree::before {
        width: 395px;
        height: 266px;
        bottom: 31px;
    }
    #homepage .workflow .numberfour::after {
        width: 878px;
        height: 943px;
        top: -75px;
    }
    #homepage .workflow .ecosystem::after {
        width: 999px;
        height: 603px;
        right: -525px;
        top: 666px;
    }
    #homepage .thecommunity .fa-play {
        font-size: 33px;
        width: 70px;
        height: 70px;
    }
    #homepage .join {
        padding: 20px !important;
    }
    iframe {
        width: 500px;
        height: 421px;
    }
    #faq .quanda::after {
        width: 821px;
        height: 380px;
        left: 150px;
        top: -110px;
    }
    #faq .faqBlue::before {
        left: -432px;
    }
    #faq img {
        margin-right: 0;
    }
    #blog .carousel-control-next {
        right: -9px;
    }
    #blog .carousel-control-prev {
        left: -9px;
    }
    #pricing .bgbuild {
        padding: 0 10px 158px;
    }
    #sustainability .sustain::before, #sustainability .sustain::after, #sustainability {
        z-index: -1;
    }
    #sustainability section.human::after {
        right: 15px;
    }
    #sustainability section.human {
        padding: 110px 0;
    }
    #sustainability section.economic, #sustainability section.social, #sustainability section.environmental {
        padding-top: 140px;
    }
    #sustainability .bility {
        margin-top: -70px;
    }
    #sustainability .susText::before {
        background: url("../img/environmentalSustainabilityBig2-md.png") no-repeat;
        top: -53px;
        left: 0;
        width: 160px;
        height: 160px;
    }
    #sustainability .susText.socialText::before {
        background: url("../img/socialSustainabilityBig2-md.png") no-repeat;
        top: -60px;
    }
    #sustainability .susText.economicText::before {
        background: url("../img/economicSustainabilityBig3-md.png") no-repeat;
        top: -69px;
    }
    #sustainability .susText.humanText::before {
        background: url("../img/humanSustainabilityBig-md.png") no-repeat;
        top: -50px;
    }
    #sustainability .sustainlast {
        padding: 20px 0 371px;
    }
    #sustainability .sustainlast::before {
        left: 0;
        left: 0;
        width: 420px;
        height: 570px;
        background-size: 420px 570px;
    }
    #sustainability .sustainlast::after {
        right: 0;
        width: 420px;
        height: 570px;
        background-size: 420px 570px;
    }
    #sustainability .logoBottom {
        margin-top: 50px;
        margin-bottom: 27px;
    }
    .table-md {
        width: 366px;
        overflow: auto;
        border-radius: 25px;
    }
}
@media (max-width: 420px) {
    :root {
        --advantage-title: 31px;
        --advantage-content: 18px;
        --sdk-img: 45%;
        --header-title: 45px;
        --header-des: 18px;
        --section-number-fs: 25px;
        --plugin-img: 15%;
        --unity-game-fs: 16px;
        --community-platform-img: 25%;
        --header-subtitle-fs: 18px;
        --heading-title-pc: 45px;
        --footer-title: 38px;
        --section-title-fs: 45px;
        --main-title-fs: 45px;
    }
    section {
        padding: 20px 0;
    }
    .utility {
        display: flex;
        align-items: center;
    }
    .utility p {
        text-align: center;
    }
    #homepage .service .smartContract {
        margin: 45px 0 0 -55px;
    }
    #homepage .backend {
        margin: -145px 0 0 5px;
    }
    #homepage .frontend {
    margin: -215px 0 0 50px;
}
    .inner {
        text-align: center;
    }
    .joinMe {
        text-align: center;
    }
    .header-title {
        text-align: center;
    }
    #homepage .workflow .border-pur::before {
        right: -10px;
        top: -26%;
        left: auto;
    }
    .w-100-xs {
        width: 100%;
    }
    #homepage .workflow .heading-title {
        font-size: var(--heading-title-mobi);
        line-height: 1;
    }
    #homepage .workflow .text-box {
        font-size: var(--text-box-mobi);
    }
    .unit {
        font-size: var(--unit-fs-mobi);
    }
    .currency {
        font-size: var(--currency-fs-mobi);
    }
    .p-0-xs {
        padding: 0 !important;
    }
    .scalable .mini-title {
        font-size: var(--title-fs-mobi);
        width: 75%;
    }
    #homepage .community .utility .utility-top #increaseNum, #homepage .community .utility .utility-top #increaseNum2 {
        font-size: var(--number-fs-mobi);
    }
    .mini-des p {
        font-size: var(--mini-des-fs-mobi);
    }
    .m-0-xs {
        margin: 0 !important;
    }
    .me-0-xs {
        margin-right: 0 !important;
    }
    .ms-0-xs {
        margin-left: 0 !important;
    }
    .d-block-xs {
        display: block !important;
    }
    .d-none-xs {
        display: none !important;
    }
    .flex-row-reverse-md {
        flex-flow: column-reverse;
    }
    .fs-25 {
        font-size: 25px;
    }
    .text-center-xs {
        text-align: center;
    }
    .flex-reverse-xs {
        flex-flow: column-reverse;
    }
    .flex-wrap-xs {
        flex-wrap: wrap;
    }
    .d-flex-xs {
        display: flex !important;
    }
    .justify-content-center-xs {
        justify-content: center;
    }
    .fs-40 {
        font-size: 40px;
    }
    header .latest {
        margin: 10px 0;
    }
    header .truncate {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        width: 328px;
    }
    header .dropdown-menu {
        padding: 4px !important;
    }
    header .blog {
        margin-bottom: 14px;
    }
    header .read {
        margin-left: 13px;
    }
    header .regis {
        margin: 22px 0;
    }
    footer .address {
        margin-bottom: 15px;
    }
    footer .form-check-input {
        width: 30px;
    }
    #homepage .fontend {
        left: 100px;
        top: 102px;
    }
    #homepage .community .trust img {
        width: 80%;
    }
    #homepage .community .trust a {
        text-align: center;
    }
    #homepage .community .trust a:nth-child(n+1) {
        padding: 5px 0;
    }
    #homepage .community .mili {
        margin-top: 10px;
    }
    #homepage .lh-55 {
        line-height: 55px;
    }
    #homepage .workflow .image-holder {
        margin-bottom: 40px;
        margin-top: -123px;
    }
    #homepage .images-slider::after {
        width: 570px;
        height: 474px;
        top: -50px;
        left: -75px;
    }
    #homepage .workflow .identity {
        padding: 23px 0;
    }
    #homepage .workflow .powerful {
        padding: 8px 14px;
    }
    #homepage .workflow .border-pur::after {
        width: 27px;
        left: 361px;
        top: -103px;
    }
    #homepage .workflow .webthree::before {
        width: 185px;
        height: 156px;
        bottom: 7px;
    }
    #homepage .workflow .numberthree::before {
        left: -652px;
    }
    #homepage .workflow .prominent {
        margin: 0 38px 40px;
    }
    #homepage .thecommunity .create {
        font-size: 12px;
    }
    #homepage .thecommunity .fa-play {
        font-size: 23px;
        width: 10px;
        height: 10px;
    }
    #homepage .thecommunity .fa-play {
        padding: 22px;
        margin: 0 10px;
    }
    iframe {
        width: 374px;
        height: 211px;
    }
    #homepage .workflow .ecosystem::after {
        top: 946px;
    }
    #homepage .workflow .ecosystem {
        padding: 0;
    }
    #homepage .workflow .ecosystem::after {
        top: 1036px;
        width: 939px;
        height: 273px;
    }
    #homepage .thecommunity .cade {
        padding-right: 12px !important;
    }
    #homepage .thecommunity .cord {
        padding-left: 12px !important;
    }
    #homepage .bg-blurpink::after {
        width: 590px;
        height: 513px;
        left: -120px;
        top: 321px;
    }
    #blog .featured img {
        border-top-right-radius: 20px;
        border-bottom-left-radius: 0;
    }
    #blog .rightbor {
        border-top-right-radius: 0;
        border-bottom-right-radius: 20px;
        border-bottom-left-radius: 20px;
    }
    #homepage .workflow .numberGrad {
        width: 40px;
        height: 40px;
    }
    #sustainability .sustainlast {
        padding: 20px 0 161px;
    }
    #sustainability .sustainlast::before {
        left: 0;
        width: 210px;
        height: 320px;
        background-size: 210px 320px;
    }
    #sustainability .sustainlast::after {
        right: 0;
        width: 210px;
        height: 320px;
        background-size: 210px 320px;
    }
    
}
@media (max-width: 1180px) {
    .frontend {
        margin: -340px 0 0 65px;
    }
}