body {
    background: #000 !important;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Poppins", sans-serif;
}


/* ::-webkit-scrollbar-track
  {
      -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
      background-color: #F5F5F5;
      border-radius: 10px;
  }
  
  ::-webkit-scrollbar
  {
      width: 10px;
      background-color: #F5F5F5;
  }
  
  ::-webkit-scrollbar-thumb
  {
    border-radius: 10px;
    background-image: -webkit-gradient(linear,
                       left bottom,
                       left top,
                                         color-stop(0.44, #e64c4a),
                                         color-stop(0.72, #b43189)
                       color-stop(0.86, rgb(28,58,148)));
  } */


/* HEADINGS */

 ::-webkit-scrollbar {
    width: 10px;
    background: #000;
}

 ::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0px 0px 6px rgba(0, 0, 0, 0.3);
    background: #000;
}

 ::-webkit-scrollbar-thumb {
    background: #13adb5;
}

h1,
p {
    color: #fff;
    line-height: 1.4;
}

h1 {
    font-size: 2.2rem;
}

h2 {
    color: #000;
    font-size: 1.3rem;
    text-align: center;
    line-height: 1.4;
    margin-bottom: 10px;
}


/* BASIC SETUP */

.page-wrapper {
    width: 100%;
    height: auto;
}

.nav-wrapper {
    width: 100%;
    position: -webkit-sticky;
    /* Safari */
    position: sticky;
    top: 0;
    background-color: #fff0;
    z-index: 999;
}

.nav-wrapper.header_scroll {
    box-shadow: -7px 9px 10px -2px #0db1b5, 10px 9px 18px -5px #dc0d86;
    background-color: #000;
}

.nav-wrapper.header_scroll .grad-bar {
    display: none;
}

.grad-bar {
    width: 100%;
    height: 2px;
    background: linear-gradient(134deg, #dc0d86, #0db1b5);
    /*background-size: 400% 400%;*/
    -webkit-animation: gradbar 15s ease infinite;
    -moz-animation: gradbar 15s ease infinite;
    animation: gradbar 15s ease infinite;
}


/* NAVIGATION */

.navbar {
    padding: 0 2rem;
}

.navbar img.oneoption_logo {
    height: 75px;
}

.navbar img {
    height: 32px;
    width: auto;
    justify-self: start;
    margin-right: 20px;
}
.color_text{
    color: #d10172;
    margin: 0 25px;
    font-size: 25px;
}
.color_text:hover {
    color: #0db1b5;
    cursor: pointer;
}

.navbar ul {
    list-style: none;
/*    display: grid;*/
    grid-template-columns: repeat(1, 1fr);
    justify-self: end;
    justify-items: center;
}

.nav-item a {
    color: rgb(255, 255, 255);
    font-size: 0.9rem;
    font-weight: 400;
    text-decoration: none;
    transition: color 0.3s ease-out;
    font-size: 1.2rem;
}

.nav-item a:hover {
    color: #ffffff;
    text-decoration: underline;
    transition: 0.3s;
}


/* SECTIONS */

.headline {
    width: 100%;
    height: 50vh;
    min-height: 350px;
    background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.7)), url("../../../../../20230319212946im_/https_/d2v9y0dukr6mq2.cloudfront.net/video/thumbnail/jPLiQ-9/mountains-background-for-titles-intro-projects-and-etc_ew22rur3l__F0000.json");
    background-size: cover;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.features {
    width: 100%;
    height: auto;
    background-color: #f1f1f1;
    display: flex;
    padding: 50px 20px;
    justify-content: space-around;
}

.feature-container {
    flex-basis: 30%;
    margin-top: 10px;
}

.feature-container p {
    color: #000;
    text-align: center;
    line-height: 1.4;
    margin-bottom: 15px;
}

.feature-container img {
    width: 100%;
    margin-bottom: 15px;
}



/* SEARCH FUNCTION */

#search-icon {
    font-size: 0.9rem;
    margin-top: 3px;
    margin-left: 15px;
    transition: color 0.3s ease-out;
}

#search-icon:hover {
    color: #3498db;
    cursor: pointer;
}

.search {
    transform: translate(-35%);
    -webkit-transform: translate(-35%);
    transition: transform 0.7s ease-in-out;
    color: #3498db;
}

.no-search {
    transform: translate(0);
    transition: transform 0.7s ease-in-out;
}

.search-input {
    position: absolute;
    top: -4px;
    right: -125px;
    opacity: 0;
    z-index: -1;
    transition: opacity 0.6s ease;
}

.search-active {
    opacity: 1;
    z-index: 0;
}

input {
    border: 0;
    border-left: 1px solid #ccc;
    border-radius: 0;
    /* FOR SAFARI */
    outline: 0;
    padding: 5px;
}


/* MOBILE MENU & ANIMATION */

.menu-toggle .bar {
    width: 25px;
    height: 3px;
    background-color: #fff;
    margin: 5px auto;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.menu-toggle {
    justify-self: end;
    margin-right: 25px;
    display: none;
}

.menu-toggle:hover {
    cursor: pointer;
}

#mobile-menu.is-active .bar:nth-child(2) {
    opacity: 0;
}

#mobile-menu.is-active .bar:nth-child(1) {
    -webkit-transform: translateY(8px) rotate(45deg);
    -ms-transform: translateY(8px) rotate(45deg);
    -o-transform: translateY(8px) rotate(45deg);
    transform: translateY(8px) rotate(45deg);
}

#mobile-menu.is-active .bar:nth-child(3) {
    -webkit-transform: translateY(-8px) rotate(-45deg);
    -ms-transform: translateY(-8px) rotate(-45deg);
    -o-transform: translateY(-8px) rotate(-45deg);
    transform: translateY(-8px) rotate(-45deg);
}


/* KEYFRAME ANIMATIONS */

@-webkit-keyframes gradbar {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

@-moz-keyframes gradbar {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

@keyframes gradbar {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}


/* Media Queries */


/* Mobile Devices - Phones/Tablets */

@media only screen and (max-width: 1000px) {
    .features {
        flex-direction: column;
        padding: 50px;
    }
    /* MOBILE HEADINGS */
    h1 {
        font-size: 1.9rem;
    }
    h2 {
        font-size: 1rem;
    }
    p {
        font-size: 0.8rem;
    }
    /* MOBILE NAVIGATION */
    .navbar ul {
        display: flex;
        flex-direction: column;
        position: fixed;
        justify-content: start;
        top: 95px;
        left: 0;
        background-color: #000;
        width: 100%;
        height: 60vh;
        transform: translateX(-111%); /* Keep it off-screen by default */
        overflow: hidden;
        z-index: 2;
        transition: transform 0.3s ease-in-out; /* Smooth transition */
    }
    
    .navbar ul.active {
        transform: translateX(0); /* Bring it on-screen when active */
    }
    
    .navbar li {
        padding: 15px;
    }
    
    .navbar li:first-child {
        margin-top: 50px;
    }
    
    .navbar li a {
        font-size: 2rem;
    }
    
    .menu-toggle {
        display: block; 
        cursor: pointer;
    }
    
    .menu-toggle.open span {
        background-color: #fff; /* Optional: Change bar color when toggled */
    }
    

    .menu-toggle,
    .bar {
        display: block;
        cursor: pointer;
    }
    .mobile-nav {
        transform: translate(-7.5%) !important;
    }
    /* SECTIONS */
    .headline {
        height: 20vh;
    }
    .feature-container p {
        margin-bottom: 25px;
    }
    .feature-container {
        margin-top: 20px;
    }
    .feature-container:nth-child(2) {
        order: -1;
    }
    /* SEARCH DISABLED ON MOBILE */
    #search-icon {
        display: none;
    }
    .search-input {
        display: none;
    }
}

section {
    background: #000;
    color: #fff;
    display: block;
    margin: 10rem 0;
}

@media screen and (max-width: 1000px) {
    section {
        background: #000;
        display: block;
        margin: 10vh 0;
    }
    #parallax-container {
        position: relative;
    }
}

.testimonial-group>.row {
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    flex-wrap: nowrap;
}

.flex_col_center {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-content: center;
    z-index: 1;
}

.header_title {
    color: #fff;
    font-size: 4rem;
}

.header_caption {
    color: rgb(209, 209, 209);
    font-size: 1.2rem;
    text-align: center;
}

.background_image_header {
    position: absolute;
    width: 67%;
    left: -42rem;
    z-index: 0;
    top: -2%;
    opacity: 0.4;
}

.button {
    padding: 13px 20px;
    --borderWidth: 2px;
    background: #000;
    position: relative;
    border-radius: 10px;
    color: #fff;
    font-weight: 600;
    cursor: pointer;
    transition: all 300ms ease;
    text-decoration: none;
}

.button:after {
    content: "";
    position: absolute;
    top: -2px;
    left: -2px;
    height: calc(100% + var(--borderWidth) * 2);
    width: calc(100% + var(--borderWidth) * 2);
    background: linear-gradient(90deg, #e94f45, #a62994);
    border-radius: 12px;
    z-index: -1;
    transition: all 300ms ease;
    opacity: 0.7;
}

.button:hover::after {
    -webkit-filter: blur(3px);
    opacity: 1;
}

a.button2:hover {
    color: #fff !important;
}

.button2:hover::after {
    -webkit-filter: blur(3px);
    opacity: 1;
}

.section_title {
    text-shadow: 0 0 #a62994, 0 1px #e84d47, -1px 4px #e64c4a, 1px -4px #b43189;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 5em;
}

.section_title2 {
    text-shadow: 0 0 #a62994, 0 1px #e84d47, -1px 4px #e64c4a, 1px -4px #b43189;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 2em;
    color: #fff;
}

.justify_content {
    text-align: justify;
}

.proud_mamba_wrapper:before {
    background-image: url("../assets/snake_curly.png");
     content: "";
     display: block;
     position: absolute;
     background-size: contain;
     background-position: 100%;
     opacity: .7;
     width: 30%;
     height: 100%;
     right: 0;
     top: 0;
     z-index: 0;
     background-repeat: no-repeat;
}

.mambanomics_wrapper h3{
    color: #0db2b6;
}

.glass-card {
 backdrop-filter: blur(15px) saturate(200%);
 -webkit-backdrop-filter: blur(15px) saturate(200%);
 background-color: #343434;
 border-radius: 0px;
 box-shadow: 1px 1px 14px #26292f;
 position: relative;
 text-align: center;
 min-height: 275px;
 border-radius: 4rem;
 padding: 3.5rem;
 margin: 10px 0;
 border: 2px solid #fff;
}

.glass-card p {
    font-size: 0.85em;
    color: rgb(192, 192, 192);
}

.double_mamba {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, 90%);
}

.features_title {
    text-shadow: 0 0 20px #a62994;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 1.3em;
    font-family: "Lobster", cursive;
    font-family: "Righteous", cursive;
    color: #fff;
}


.proud_mamba_wrapper{
    width: 85%;
}

.clip_text{
    color: #fff;
    -webkit-text-fill-color: #494c51;
    -webkit-text-stroke: 1px #fff;
}

.clip_text.biggy{
        font-size: 5vw;
        text-align: center;

}

.mamba_user_text{
    color: #0db1b5;
    font-size: 3rem;
    text-align: center;
    word-spacing: 15px;
    letter-spacing: 10px;
    font-family: 'Gugi', cursive;
    text-transform: uppercase;
}

.gradient-text {
    background-color: #f3ec78;
    background-image: linear-gradient(45deg, #b43189, #e64c4a);
    background-size: 100%;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -webkit-text-fill-color: transparent;
    -moz-text-fill-color: transparent;
}

.glow_headding{
    text-shadow: 0px 0px 10px #0db1b5;
    animation: glow 3s infinite alternate;
}
    @keyframes glow {
      0% {
        text-shadow: 0px 0px 25px #0db1b5;
      }
      20% {
        text-shadow: 0px 0px 20px #0db1b5;
      }
      40% {
        text-shadow: 0px 0px 45px #0db1b5;
      }
      60% {
        text-shadow: 0px 0px 30px #0db1b5;
      }
      60% {
        text-shadow: 0px 0px 15px #0db1b5;
      }
      100% {
        text-shadow: 0px 0px 50px #0db1b5;
      }
    }

#diamonds .section_title {
    margin-bottom: 13rem;
}

.background_theme_bright {
    backdrop-filter: blur(5px) saturate(200%);
    -webkit-backdrop-filter: blur(5px) saturate(200%);
    background-color: rgb(50 49 49 / 73%);
    border-radius: 0px;
    box-shadow: inset 20px 0px 20px -15px #ffffff;
    text-align: center;
    border-radius: 10px 50px 50px 10px;
    padding: 8rem;
    border: 2px solid #fff;
    margin-top: 10rem;
}
.bot_mar{
    margin-bottom: 50px;
}

.background_theme_bright h3 {
    color: #fff;
}

.background_theme_bright img {
    margin-top: -13rem;
}

.background_theme_bright .counter {
    background: #000;
    box-shadow: 2px 2px 16px #e94f45, -2px -2px 16px #a62994;
    color: #fff;
    padding: 0px 15px;
    font-size: 2rem;
    border-radius: 5px;
    font-weight: 600;
}

#diamonds {
    position: relative;
}

svg.animated-lines {
    height: 100%;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
}

path {
    fill: none;
    stroke: #ad2d8d;
    stroke-width: 0.5px;
    vector-effect: non-scaling-stroke;
}

.line1 {
    background-image: url("../../../../../20230705135046im_/https_/blackmamba.buzz/assets/images/screen4/line-1.html");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    -moz-animation: showHide 5s ease-in alternate infinite;
    /* Firefox */
    -webkit-animation: showHide 5s ease-in alternate infinite;
    /* Safari and Chrome */
    -ms-animation: showHide 5s ease-in alternate infinite;
    /* IE10 */
    -o-animation: showHide 5s ease-in alternate infinite;
    /* Opera */
    animation: showHide 5s ease-in alternate infinite;
}

.line2 {
    background-image: url("../../../../../20230705135046im_/https_/blackmamba.buzz/assets/images/screen4/line-2.html");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    -moz-animation: showHide 5s ease-in alternate infinite;
    /* Firefox */
    -webkit-animation: showHide 5s ease-in alternate infinite;
    /* Safari and Chrome */
    -ms-animation: showHide 5s ease-in alternate infinite;
    /* IE10 */
    -o-animation: showHide 5s ease-in alternate infinite;
    /* Opera */
    animation: showHide 5s ease-in alternate infinite;
}

@-webkit-keyframes showHide {
    /* Chrome, Safari */
    0% {
        width: 100%;
    }
    40% {
        width: 0%;
    }
    60% {
        width: 0%;
    }
    100% {
        width: 100%;
    }
}

@-moz-keyframes showHide {
    /* FF */
    0% {
        width: 100%;
    }
    40% {
        width: 0%;
    }
    60% {
        width: 0%;
    }
    100% {
        width: 100%;
    }
}

@-ms-keyframes showHide {
    /* IE10 */
    0% {
        width: 100%;
    }
    40% {
        width: 0%;
    }
    60% {
        width: 0%;
    }
    100% {
        width: 100%;
    }
}

@-o-keyframes showHide {
    /* Opera */
    0% {
        width: 100%;
    }
    40% {
        width: 0%;
    }
    60% {
        width: 0%;
    }
    100% {
        width: 100%;
    }
}

@keyframes showHide {
    0% {
        width: 100%;
    }
    40% {
        width: 0%;
    }
    60% {
        width: 0%;
    }
    100% {
        width: 100%;
    }
}

.w-100-px {
    width: 100px;
}

#tokenomics {
    background-image: url("../../../../../20230705135046im_/https_/blackmamba.buzz/assets/images/screen6/Tokenomics.html");
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

#tokenomics .w-100-px {
    background: #fff;
    border-radius: 50%;
}

#parallax-container {
    position: relative;
    overflow: hidden;
}

#parallax-container img:first-child {
    position: absolute;
    z-index: 1;
    right: 0;
    width: 100% !important;
}

#parallax-container img:last-child {
    position: absolute;
    z-index: 3;
    left: 0;
    width: 100% !important;
}

.spacer>h1 {
    position: absolute;
    background-image: linear-gradient( to right, #ad2d8d, #e94f43, #ad2d8d, #e94f43);
    color: #000;
    font-size: 12vmin;
    font-weight: 700;
    letter-spacing: calc(1em / 8);
    -webkit-text-stroke-color: transparent;
    -webkit-text-stroke-width: calc(1em / 16);
    -webkit-background-clip: text;
    /* writing-mode: vertical-lr; */
}

.z_index0 {
    z-index: 0;
}

.z_index1 {
    z-index: 1;
}

.z_index2 {
    z-index: 2;
}

.z_index3 {
    z-index: 3;
}

.z_index4 {
    z-index: 4;
}

 :root {
    --color-background: #000119;
    --stroke-width: calc(1em / 16);
    --font-size: 30vmin;
    --font-weight: 700;
    --letter-spacing: calc(1em / 8);
}


/* Our mixin positions a copy of our text
  directly on our existing text, while
  also setting content to the appropriate
  text set in the data-text attribute. */

.glitch {
    position: relative;
    color: white;
    font-size: 3rem !important;
    /* Animation provies a slight random skew. Check bottom of doc
    for more information on how to random skew. */
    animation: glitch-skew 1s infinite linear alternate-reverse;
    text-align: center;
    width: 90%;
    margin: 0 auto;
}

.glitch.mb-11 {
    margin-bottom: 15rem;
}

.glitch::before {
    content: attr(data-text);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    left: 2px;
    text-shadow: -2px 0 #e94f43;
    /* Creates an initial clip for our glitch. This works in
    a typical top,right,bottom,left fashion and creates a mask
    to only show a certain part of the glitch at a time. */
    clip: rect(44px, 450px, 56px, 0);
    /* Runs our glitch-anim defined below to run in a 5s loop, infinitely,
    with an alternating animation to keep things fresh. */
    animation: glitch-anim 5s infinite linear alternate-reverse;
}

.glitch::after {
    content: attr(data-text);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    left: -2px;
    text-shadow: -2px 0 #00fff9, 2px 2px #ad2d8d;
    animation: glitch-anim2 1s infinite linear alternate-reverse;
}

@keyframes glitch-anim {
    0% {
        clip: rect(25px, 9999px, 91px, 0);
        transform: skew(0.62deg);
    }
    5% {
        clip: rect(22px, 9999px, 50px, 0);
        transform: skew(0.46deg);
    }
    10% {
        clip: rect(98px, 9999px, 78px, 0);
        transform: skew(0.7deg);
    }
    15% {
        clip: rect(8px, 9999px, 15px, 0);
        transform: skew(0.11deg);
    }
    20% {
        clip: rect(37px, 9999px, 91px, 0);
        transform: skew(0.22deg);
    }
    25% {
        clip: rect(45px, 9999px, 39px, 0);
        transform: skew(0.44deg);
    }
    30% {
        clip: rect(89px, 9999px, 14px, 0);
        transform: skew(0.89deg);
    }
    35% {
        clip: rect(71px, 9999px, 85px, 0);
        transform: skew(0.28deg);
    }
    40% {
        clip: rect(62px, 9999px, 55px, 0);
        transform: skew(0.66deg);
    }
    45% {
        clip: rect(66px, 9999px, 80px, 0);
        transform: skew(0.03deg);
    }
    50% {
        clip: rect(50px, 9999px, 72px, 0);
        transform: skew(0.79deg);
    }
    55% {
        clip: rect(78px, 9999px, 94px, 0);
        transform: skew(0.04deg);
    }
    60% {
        clip: rect(58px, 9999px, 18px, 0);
        transform: skew(0.75deg);
    }
    65% {
        clip: rect(1px, 9999px, 60px, 0);
        transform: skew(0.95deg);
    }
    70% {
        clip: rect(12px, 9999px, 5px, 0);
        transform: skew(0.77deg);
    }
    75% {
        clip: rect(54px, 9999px, 66px, 0);
        transform: skew(0.92deg);
    }
    80% {
        clip: rect(96px, 9999px, 21px, 0);
        transform: skew(0.66deg);
    }
    85% {
        clip: rect(5px, 9999px, 11px, 0);
        transform: skew(0.47deg);
    }
    90% {
        clip: rect(34px, 9999px, 88px, 0);
        transform: skew(0.94deg);
    }
    95% {
        clip: rect(47px, 9999px, 94px, 0);
        transform: skew(0.42deg);
    }
    100% {
        clip: rect(29px, 9999px, 56px, 0);
        transform: skew(0.47deg);
    }
}

@keyframes glitch-anim2 {
    0% {
        clip: rect(37px, 9999px, 68px, 0);
        transform: skew(0.54deg);
    }
    5% {
        clip: rect(25px, 9999px, 78px, 0);
        transform: skew(0.37deg);
    }
    10% {
        clip: rect(20px, 9999px, 65px, 0);
        transform: skew(0.81deg);
    }
    15% {
        clip: rect(96px, 9999px, 97px, 0);
        transform: skew(0.01deg);
    }
    20% {
        clip: rect(12px, 9999px, 82px, 0);
        transform: skew(0.98deg);
    }
    25% {
        clip: rect(43px, 9999px, 50px, 0);
        transform: skew(0.34deg);
    }
    30% {
        clip: rect(68px, 9999px, 72px, 0);
        transform: skew(1deg);
    }
    35% {
        clip: rect(37px, 9999px, 64px, 0);
        transform: skew(0.3deg);
    }
    40% {
        clip: rect(63px, 9999px, 3px, 0);
        transform: skew(0.27deg);
    }
    45% {
        clip: rect(7px, 9999px, 26px, 0);
        transform: skew(0.1deg);
    }
    50% {
        clip: rect(78px, 9999px, 34px, 0);
        transform: skew(0.52deg);
    }
    55% {
        clip: rect(58px, 9999px, 73px, 0);
        transform: skew(0.91deg);
    }
    60% {
        clip: rect(8px, 9999px, 100px, 0);
        transform: skew(0.24deg);
    }
    65% {
        clip: rect(2px, 9999px, 58px, 0);
        transform: skew(0.68deg);
    }
    70% {
        clip: rect(34px, 9999px, 22px, 0);
        transform: skew(0.99deg);
    }
    75% {
        clip: rect(80px, 9999px, 86px, 0);
        transform: skew(0.33deg);
    }
    80% {
        clip: rect(100px, 9999px, 97px, 0);
        transform: skew(0.12deg);
    }
    85% {
        clip: rect(67px, 9999px, 88px, 0);
        transform: skew(0.88deg);
    }
    90% {
        clip: rect(100px, 9999px, 26px, 0);
        transform: skew(0.17deg);
    }
    95% {
        clip: rect(76px, 9999px, 4px, 0);
        transform: skew(0.97deg);
    }
    100% {
        clip: rect(38px, 9999px, 4px, 0);
        transform: skew(0.03deg);
    }
}

@keyframes glitch-skew {
    0% {
        transform: skew(0deg);
    }
    10% {
        transform: skew(4deg);
    }
    20% {
        transform: skew(2deg);
    }
    30% {
        transform: skew(-1deg);
    }
    40% {
        transform: skew(0deg);
    }
    50% {
        transform: skew(5deg);
    }
    60% {
        transform: skew(-3deg);
    }
    70% {
        transform: skew(-1deg);
    }
    80% {
        transform: skew(1deg);
    }
    90% {
        transform: skew(-4deg);
    }
    100% {
        transform: skew(-4deg);
    }
}

.eco_main {
    position: absolute;
}

.eco_left {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100px;
}

.eco_right {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100px;
}

.tokenomics_wrapper:before {
    content: "";
    position: absolute;
    top: -5px;
    bottom: -5px;
    left: -5px;
    right: -5px;
    border: 6px solid #222;
    border-radius: 0.8rem;
}

.tokenomics-icon {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: white;
    -webkit-box-shadow: 0px 22px 35px 0px rgba(2, 18, 106, 0.08);
    box-shadow: 0px 22px 35px 0px rgba(2, 18, 106, 0.08);
    width: 115px;
    height: 115px;
    margin-right: 10px;
    border-radius: 50%;
}

.tokenomics-icon .roted-around {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.tokenomics-icon .roted-around span {
    position: relative;
    display: block;
    height: 100%;
}

.tokenomics-icon .roted-around span::before,
.tokenomics-icon .roted-around span::after {
    position: absolute;
    width: 8px;
    height: 8px;
    content: "";
    border-radius: 50%;
}

.tokenomics-icon .roted-around span::before {
    left: 15px;
    bottom: 10px;
}

.tokenomics-icon .roted-around span::after {
    right: 15px;
    top: 10px;
}

.tokenomics-icon .roted-around.secondary span {
    -webkit-animation: rotation 7s infinite linear;
    animation: rotation 7s infinite linear;
}
.tokenomics-icon .roted-around.secondary span::after {
    background-image: -webkit-linear-gradient(-45deg, #15adb4 50%, #15adb4 100%);
    background-image: -ms-linear-gradient(-45deg, #15adb4 50%, #15adb4 100%);
}
.tokenomics-icon .roted-around.secondary span::before{
    background-image: -webkit-linear-gradient(-45deg, #d61087  50%, #d61087  100%);
    background-image: -ms-linear-gradient(-45deg, #a92b8f 50%, #e84e46 100%);
}

.tokenomics-icon-wrapper {
    position: absolute;
    left: -34px;
}

.tokenomics-icon-wrapper-reverse {
    position: absolute;
    right: -3rem;
}

@-webkit-keyframes rotation {
    from {
        -webkit-transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(359deg);
    }
}

.wrapper {
    box-sizing: border-box;
    margin: 1rem auto 2rem;
    padding: 0.4rem;
    /* width: 80%;
    max-width: 25rem; */
    background: linear-gradient(#000, #000), linear-gradient(to right, #0eb1b5, #d80e86);
    border: 5px solid transparent;
    background-repeat: no-repeat;
    background-origin: padding-box, border-box;
}

.wrapper--rounded {
    border-radius: 1rem;
    border-width: 10px;
    position: relative;
}

.wrapper--rounded::before {
    content: "";
    position: absolute;
    top: -5px;
    bottom: -5px;
    left: -5px;
    right: -5px;
    border: 6px solid #000;
    border-radius: 0.8rem;
}

.media-reverse {
    padding-right: 4rem !important;
    margin-left: 1rem !important;
}

.media {
    display: flex;
    -ms-flex-align: start;
    align-items: flex-start;
    align-items: center;
    justify-content: space-around;
    padding-left: 4rem;
    margin-right: 1rem;
}

.media-body {
    font-size: 1rem;
}

@media (min-width: 320px) and (max-width: 425px) {
    .media {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-align: start;
        align-items: flex-start;
        align-items: center;
        flex-direction: row;
        text-align: center;
        padding-left: 0rem;
        justify-content: flex-start;
    }
    .media-reverse {
        padding-left: 0rem;
        margin-right: 1rem;
        margin-left: 0 !important;
    }
    .tokenomics-icon-wrapper-reverse {
        right: -2rem;
        left: auto;
        top: -1rem;
    }
    .tokenomics-icon {
        margin: 0;
        margin-bottom: 10px;
    }
    #tokenomics {
        background-image: none;
        padding: 0 !important;
    }
    .media-body {
        font-size: 0.8rem;
        text-align: left;
    }
}

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

.text-cont_wrapper {
    display: flex;
    justify-content: center;
}

.text-cont h1 {
    margin-top: 0;
    padding-top: 0;
    color: white;
    font-size: 150px;
    letter-spacing: 30px;
}

.text-cont .orbit {
    margin-top: 0;
    margin-left: -10px;
    margin-right: 10px;
    height: 170px;
    width: 170px;
    border-radius: 1000px;
    background-color: #000;
    border: 7px solid white;
}

.text-cont .orbit .planet {
    height: 110px;
    width: 110px;
    border-radius: 1000px;
    margin: -74px auto;
    background-color: white;
}

.text-cont .orbit .mini-planet {
    height: 40px;
    width: 40px;
    border-radius: 1000px;
    background-color: #000;
    border: 7px solid #a62994;
    margin-left: 57.5px;
    margin-top: 55px;
    animation: rot 5s linear infinite;
}

.text-cont .orbit .mini-planet:hover {
    -webkit-animation-play-state: paused;
    -moz-animation-play-state: paused;
    -o-animation-play-state: paused;
    animation-play-state: paused;
}

.text-cont .orbit .mini-planet-2 {
    height: 40px;
    width: 40px;
    border-radius: 1000px;
    background-color: #000;
    border: 7px solid #e74e46;
    margin-left: 57.5px;
    margin-top: 55px;
    animation: rot2 5s linear infinite;
}

.text-cont .orbit .mini-planet-2:hover {
    -webkit-animation-play-state: paused;
    -moz-animation-play-state: paused;
    -o-animation-play-state: paused;
    animation-play-state: paused;
}

@keyframes rot {
    from {
        transform: rotate(0deg) translate(78px) rotate(0deg);
    }
    to {
        transform: rotate(360deg) translate(78px) rotate(-360deg);
    }
}

@keyframes rot2 {
    from {
        transform: rotate(0deg) translate(-78px) rotate(0deg);
    }
    to {
        transform: rotate(360deg) translate(-78px) rotate(-360deg);
    }
}

.title_caption {
    width: calc(100% - 35rem);
}

@media (min-width: 320px) and (max-width: 991px) {
    .title_caption {
        width: 100%;
    }
}

#circleOrbit .orbit-icon {
    width: 1.6em;
    height: 1.6em;
    line-height: 1.6em;
    font-size: 1.2em;
    border-radius: 50%;
    background: #ccc;
    color: #fff;
    text-align: center;
    display: block;
}

#circleOrbit .orbit-wrap {
    list-style: none;
    font-size: 1.3em;
}

#circleOrbit .orbit-wrap>li {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

#circleOrbit .orbit-wrap>li:hover ul {
    border-width: 2px;
    border-color: #fff;
}

#circleOrbit .orbit-wrap>li:hover~li ul {
    border-color: rgba(255, 255, 255, 0.2);
}

#circleOrbit .orbit-wrap>li:hover~li ul li {
    opacity: 0.4;
}

#circleOrbit ul[class^="ring"] {
    transition: all 300ms ease-in-out;
}

#circleOrbit ul[class^="ring"] li {
    transition: all 300ms ease-in-out;
}

#circleOrbit .ring-0 {
    width: 25em;
    height: 25em;
    -webkit-animation: clockwiseRotate 35s linear infinite;
    animation: clockwiseRotate 35s linear infinite;
}

#circleOrbit .ring-0 i {
    -webkit-animation: counterClockwiseRotate 35s linear infinite;
    animation: counterClockwiseRotate 35s linear infinite;
}

#circleOrbit .ring-0>*:nth-of-type(1) {
    transform: rotate(95deg) translate(12.5em) rotate(-95deg);
}

#circleOrbit .ring-0>*:nth-of-type(2) {
    transform: rotate(190deg) translate(12.5em) rotate(-190deg);
}

#circleOrbit .ring-0>*:nth-of-type(3) {
    transform: rotate(285deg) translate(12.5em) rotate(-285deg);
}

#circleOrbit .ring-0>*:nth-of-type(4) {
    transform: rotate(380deg) translate(12.5em) rotate(-380deg);
}

#circleOrbit .ring-1 {
    width: 20em;
    height: 20em;
    -webkit-animation: clockwiseRotate 30s linear infinite;
    animation: clockwiseRotate 30s linear infinite;
}

#circleOrbit .ring-1 i {
    -webkit-animation: counterClockwiseRotate 30s linear infinite;
    animation: counterClockwiseRotate 30s linear infinite;
}

#circleOrbit .ring-1>*:nth-of-type(1) {
    transform: rotate(126.6666666667deg) translate(10em) rotate(-126.6666666667deg);
}

#circleOrbit .ring-1>*:nth-of-type(2) {
    transform: rotate(253.3333333333deg) translate(10em) rotate(-253.3333333333deg);
}

#circleOrbit .ring-1>*:nth-of-type(3) {
    transform: rotate(380deg) translate(10em) rotate(-380deg);
}

#circleOrbit .ring-2 {
    width: 15em;
    height: 15em;
    -webkit-animation: clockwiseRotate 25s linear infinite;
    animation: clockwiseRotate 25s linear infinite;
}

#circleOrbit .ring-2 i {
    -webkit-animation: counterClockwiseRotate 25s linear infinite;
    animation: counterClockwiseRotate 25s linear infinite;
}

#circleOrbit .ring-2>*:nth-of-type(1) {
    transform: rotate(47.5deg) translate(7.5em) rotate(-47.5deg);
}

#circleOrbit .ring-2>*:nth-of-type(2) {
    transform: rotate(95deg) translate(7.5em) rotate(-95deg);
}

#circleOrbit .ring-2>*:nth-of-type(3) {
    transform: rotate(142.5deg) translate(7.5em) rotate(-142.5deg);
}

#circleOrbit .ring-2>*:nth-of-type(4) {
    transform: rotate(190deg) translate(7.5em) rotate(-190deg);
}

#circleOrbit .ring-2>*:nth-of-type(5) {
    transform: rotate(237.5deg) translate(7.5em) rotate(-237.5deg);
}

#circleOrbit .ring-2>*:nth-of-type(6) {
    transform: rotate(285deg) translate(7.5em) rotate(-285deg);
}

#circleOrbit .ring-2>*:nth-of-type(7) {
    transform: rotate(332.5deg) translate(7.5em) rotate(-332.5deg);
}

#circleOrbit .ring-2>*:nth-of-type(8) {
    transform: rotate(380deg) translate(7.5em) rotate(-380deg);
}

#circleOrbit .ring-3 {
    width: 10em;
    height: 10em;
    -webkit-animation: clockwiseRotate 20s linear infinite;
    animation: clockwiseRotate 20s linear infinite;
}

#circleOrbit .ring-3 i {
    -webkit-animation: counterClockwiseRotate 20s linear infinite;
    animation: counterClockwiseRotate 20s linear infinite;
}

#circleOrbit .ring-3>*:nth-of-type(1) {
    transform: rotate(126.6666666667deg) translate(5em) rotate(-126.6666666667deg);
}

#circleOrbit .ring-3>*:nth-of-type(2) {
    transform: rotate(253.3333333333deg) translate(5em) rotate(-253.3333333333deg);
}

#circleOrbit .ring-3>*:nth-of-type(3) {
    transform: rotate(380deg) translate(5em) rotate(-380deg);
}

#circleOrbit ul[class^="ring"] {
    border: solid 1px rgba(33, 150, 243, 0.8);
    position: relative;
    padding: 0;
    border-radius: 50%;
    list-style: none;
    box-sizing: content-box;
}

#circleOrbit ul[class^="ring"] li {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 1.6em;
    height: 1.6em;
    margin: -0.8em;
}


/*
    center;
  */

#circleOrbit .orbit-center {
    z-index: 5;
    font-size: 2em;
    width: 1.8em;
    height: 1.8em;
    line-height: 1.8em;
    text-align: center;
    background: hotpink;
    border-radius: 50%;
}

#circleOrbit .orbit-center:hover #circleOrbit .orbit-center__icon {
    transform: rotateZ(0deg);
}

#circleOrbit .orbit-center__icon {
    transform: rotateZ(-360deg);
    transition: all 300ms ease-in-out;
}

#circleOrbit .orbit-wrap>li#circleOrbit .orbit-center:hover~li>ul {
    width: 0;
    height: 0;
}

#circleOrbit .orbit-wrap>li#circleOrbit .orbit-center:hover~li>ul * {
    transform: translate(0, 0);
}


/* 
  animations 
  */

@-webkit-keyframes clockwiseRotate {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

@keyframes clockwiseRotate {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

@-webkit-keyframes counterClockwiseRotate {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(-360deg);
    }
}

@keyframes counterClockwiseRotate {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(-360deg);
    }
}

.social-media_footer {
    display: flex;
    justify-content: center;
    align-items: center;
}

.social-media_footer li img {
    width: 100px;
}

.flex_justify_center {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

@media screen and (max-width: 500px){
    .flex_justify_center {
        display: flex;
        align-items: flex-start;
        flex-direction: column;
        align-content: space-around;
        flex-wrap: wrap;
    }
}

.emailers_footer img {
    width: 35px;
    margin-right: 10px;
    vertical-align: bottom;
}

.emailers_footer a {
    font-size: 18px;
    color: #fff;
}

footer {
    padding: 2rem;
}

.background_theme_bright img {
    width: 79%;
}

ul.social-media_footer img {
    width: 50px;
}

ul.social-media_footer {
    list-style-type: none;
    padding: 0;
}

ul.social-media_footer li {
    margin: 5px;
}

@media screen and (max-width: 1000px) {
    .feature_image_top4 {
        margin: 2rem 0;
        width: 180px;
        transform: rotate(-15deg);
    }
    .glass-card {
        min-height: 355px;
    }
    .feature_image_bottom3 {
        margin: 2rem 0;
        width: 180px;
        transform: rotate(-15deg);
    }
    .mambanomics_wrapper {
        background-repeat: repeat;
        background-size: 102%;
    }
   
   
    .background_theme_bright img {
        width: 10rem;
        margin-top: -9em;
    }
    .flex_col_center.h-100vh {
        height: 38vh;
    }
    .background_image_header {
        position: absolute;
        width: 75%;
        left: 4rem;
        z-index: 0;
        top: -2%;
        opacity: 0.7;
    }
}

@media (min-width: 320px) and (max-width: 500px) {
    .header_title {
        color: #fff;
        font-size: 2.5rem;
    }
    .background_theme_bright .counter {
        font-size: 1rem;
    }
    ul.social-media_footer img {
        width: 40px;
        margin-top: 10px;
    }
    .emailers_footer img {
        width: 35px;
        display: block;
        margin: 5px auto;
    }
    .emailers_footer a {
        font-size: 12px;
        color: #fff;
    }
    footer {
        padding: 10px;
    }
    .glitch.mb-11 {
        margin-bottom: 2rem;
    }
    .glitch {
        font-size: 1.6rem !important;
    }
    .tokenomics-icon-wrapper {
        right: -2rem;
        left: auto;
        top: -1rem;
    }
    .background_theme_bright {
        margin-top: 5rem;
    }
    .background_theme_bright img {
        width: 6rem;
    }
    .button2 {
        width: 90% !important;
    }
}

.button2 {
    margin: 10px;
    width: calc(100% - 30rem);
    text-align: center;
    position: relative;
    border-radius: 6px;
    box-sizing: border-box;
    color: #fff;
    display: block;
    z-index: 2;
    overflow: hidden;
    padding: 3px;
    text-decoration: none;
}

.button2:hover:before {
    animation: SidebarCreate_rainbowSlide-1kpxK 0.75s linear infinite;
}

@keyframes SidebarCreate_rainbowSlide-1kpxK {
    to {
        transform: translateX(-50%);
    }
}

.button2:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 200%;
    height: 100%;
    background: linear-gradient(-125deg, #ee7752, #e73c7e, #ffffff);
    background-size: 50% 100%;
}

.button2 span {
    position: relative;
    z-index: 2;
    padding: 0.875rem 0;
    font-size: 1.1rem;
    align-items: center;
    background: #000;
    border-radius: 3px;
    display: block;
    justify-content: center;
    box-sizing: border-box;
    height: 100%;
}

.h-100vh {
    height: 100vh;
}
@media screen and (max-width: 768px) {
.h-100vh {
    height: 100%
}
}

.flex_adjust {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: flex-end;
    align-items: flex-end;
}

.flex_adjust p {
    font-size: 1.5rem;
}

.orange {
    color: #d3483d;
    font-size: 1rem;
    text-transform: uppercase;
}

.arrow_flex {
    transform: rotate(00deg);
}
.h_cus{
    background: #fff0;
}

@media screen and (max-width: 1024px) {
    .flex_adjust p {
        font-size: 1rem;
    }
    .jus_text {
        font-size: 18px !important;
    }
    .glass-card p{
        font-size: 11px !important;
    }
    .h_cus{
        background: linear-gradient(180deg, #dc0d86, #000);
        background-size: 400% 400%;
        animation: gradient 15s ease infinite;
        background-size: 300% 100%;
        animation: gradient 15s ease infinite;
        padding: 10px;
    }
    @keyframes gradient {
      0% {
        background-position: 0% 50%;
      }
      50% {
        background-position: 100% 50%;
      }
      100% {
        background-position: 0% 50%;
      }
    }
    .bor_over_control{
        width: 95% !important;
    }
    .n_cl_f_sec{
        margin: 4rem 0 0 !important;
    }
    svg text {
        font-size: 30px;
    }
   /* .proud_mamba_wrapper{
        margin-top: -75px;
        width: 90%;
    }*/
    .mamba_user_text{
        font-size: 25px;
    }
    .clip_text.biggy{
        font-size: 32px;
    }
    .background_theme_bright{
        margin-top: 5rem;
        padding: 2rem 6rem;
    }
    .bot_left_abso{
        bottom: -4rem !important;
    }
    .dir_col{
        display: flex !important;
        flex-direction: column !important;
    }
    .new_mar{
        margin-top: 5rem !important;
    }
    .cen_hei{
        margin-top: 25%;
    }
    #myAnchor{
        margin: 4rem 0 0rem !important;
    }
    .mambaswap_title{
        font-size: 3rem !important;
    }
    .y_mar_6{
        margin: 0 0 6rem !important;
    }
    .f_s_18{
        font-size: 18px;
    }
    .marketplace_title{
        font-size: 2rem !important;
    }
    .marketplace_title2{
        font-size: 3rem !important;
    }
    .marketplace_title3{
        font-size: 2rem !important;
    }
    .img_sec_n_mar {
        margin: 8rem 0 6rem !important;
    }
    .f_1_rem{
        font-size: 1rem !important;
    }
    .mambaworld_left{
        font-size: 2rem !important;
    }
    .border_thick_blue p{
        display: block !important;
        height: 10px !important;
        left: 0px !important;
        position: absolute !important;
        top: 40px !important;
        width: 105% !important;
        z-index: 0 !important;
        box-shadow: 0px 0px 20px 20px #0db1b5a3 !important;
        border-radius: 50% !important;
        background: #0db1b5 !important;
    }
    .m_t_6{
        margin: 0 !important;
    }
    .n_dcl_pad{
        padding-top: 15%;
    }
    .n_dcl_b_pad{
        padding-bottom: 12%;
    }
    .background_theme_bright:after{
        position: absolute;
        top: -60vh;
        left: -30vw;
    }
    .wid_25{
        width: 100% !important;
    }
    .wid_70{
        width: 100% !important;
    }
    .double_mamba{
        top: 35% !important;
    }
    .mob_txt_cen{
        font-size: 22px !important;
    }
    .second_sec{
        min-height: 70vh !important;
    }
}

@media screen and (max-width: 768px) {
    .cen_hei{
        margin-top: 0;
    }
    .glass-card{
        margin: 0 auto;
        width: 95%;
    }
    .double_mamba {
        position: absolute;
        top: 55%;
        left: 50%;
        transform: translate(-50%, 90%);
        width: 70%;
    }
    .new_mar{
        margin-top: 0 !important;
        /*padding-top: 18% !important;*/
        height: 50vh !important;
        min-height: 0 !important;
    }
    .proud_mamba_wrapper:before {
        position: absolute;
        top: 20% !important;
        right: 5px !important;
        height: 65% !important;        
    }
    .background_theme_bright:after {
        position: absolute;
        top: 0vh !important;
        left: 0vw !important;
        width: 40vW !important;
        height: 35vh !important;
        transform: none !important;
    }
    #myAnchor{
        min-height: 30vh !important;
        margin: 0 !important;
    }
    .y_mar_6{
        margin-top: 5rem !important;
        margin-bottom: 0 !important;
        min-height: 70vh !important;
    }
    .mambaswap_title{
        font-size: 2rem !important;
    }
    .para_f_size{
        font-size: 16px !important;
        text-align: center;
    }
    .f_s_18{
        font-size: 14px;
    }
    .marketplace_wrapper {
        margin-top: 0!important;
    }
    .left_top_abso{
        left: -6rem !important;
        top: 100px !important;
        width: 130px !important;
    }
    .marketplace_title{
        font-size: 16px !important;
    }
    .marketplace_title2{
        font-size: 32px !important;
    }
    .marketplace_title3{
        font-size: 16px !important;
    }
    .align-self-end{
        margin-bottom: 80px;
    }
    .img_sec_n_mar{
        margin: 4rem 0 !important;
    }
    .lef_mar_20{
        margin-left: 20px;
    }
    .lef_mar_25{
        margin-left: 25px; 
    }
    .mamba_world_wrapper {
        margin-left: 22px;
        padding: 2rem !important;
    }
    .f_1_rem{
        font-size: 16px !important;
    }
    .n_marr{
        min-height: 60vh !important;
    }
    .div-content-left h2{
        font-size: 30px !important;
        margin: 0 auto;
    }
    section .div-inner{
        margin: 0 auto !important;
    }
    section .div-content-right img {
        align-self: flex-end;
        width: 20rem !important;
        margin: 0 auto !important;
    }
    .ali_cen{
        text-align: center;
    }
    .bot_left_abso{
        width: 130px !important;
    }
    .tab_sty{
        width: 95%;
        margin-left: 10px;
    }
}

@media screen and (max-width: 500px) {
    .arrow_flex {
        transform: rotate(90deg);
        padding: 30px;
    }
    .flex_adjust {
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        align-content: center;
        align-items: center;
        justify-content: space-evenly;
    }
}

ul.option_ul li {
    color: #fff;
}

.stack {
    display: block;
    position: relative;
    width: 600px;
    height: 500px;
    margin: 5rem auto;
}

@media screen and (max-width: 500px) {
    .stack {
        width: 100%;
        height: 500px;
    }
}

.card_flip {
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: box;
    display: flex;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    -o-box-orient: vertical;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -o-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-box-align: center;
    -moz-box-align: center;
    -o-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    position: absolute;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    padding: 2em;
    background: linear-gradient(-45deg, #ee7752, #e73c7e);
    animation: gradient 15s ease infinite;
    border-radius: 7px;
    -webkit-box-shadow: -5px 20px 25px rgb(0 0 0);
    box-shadow: -5px 20px 25px rgb(0 0 0);
    cursor: defaut;
    -webkit-transition: -webkit-transform 0.6s, background 0.6s, opacity 0.6s;
    -moz-transition: -moz-transform 0.6s, background 0.6s, opacity 0.6s;
    -o-transition: -o-transform 0.6s, background 0.6s, opacity 0.6s;
    -ms-transition: -ms-transform 0.6s, background 0.6s, opacity 0.6s;
    transition: transform 0.6s, background 0.6s, opacity 0.6s;
    overflow: hidden;
}

.card_flip:before {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: calc(100% - (3em + 75px));
    background: #000;
    border-radius: 0 0 7px 7px;
    z-index: 0;
}

.card_flip:last-child {
    cursor: pointer;
}

.card_flip.dismissed {
    -webkit-transform-origin: 100% 150%;
    -moz-transform-origin: 100% 150%;
    -o-transform-origin: 100% 150%;
    -ms-transform-origin: 100% 150%;
    transform-origin: 100% 150%;
    -webkit-transform: translateX(4em) scale(1) rotateZ(10deg);
    -moz-transform: translateX(4em) scale(1) rotateZ(10deg);
    -o-transform: translateX(4em) scale(1) rotateZ(10deg);
    -ms-transform: translateX(4em) scale(1) rotateZ(10deg);
    transform: translateX(4em) scale(1) rotateZ(10deg);
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
}

.card_flip>.image {
    display: block;
    position: relative;
    border-radius: 50%;
    width: 150px;
    height: 150px;
    margin-top: 1em;
    cursor: cell;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.card_flip>.image>img {
    display: block;
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    pointer-events: none;
    -webkit-box-shadow: 0 0 25px rgba(0, 0, 0, 0.25);
    box-shadow: 0 0 25px rgba(0, 0, 0, 0.25);
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.card_flip>span {
    font-size: 5rem;
    color: #233240;
    pointer-events: none;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    z-index: 100;
}

.card_flip p {
    font-size: 2rem;
    color: #fff !important;
    text-transform: uppercase;
}

@media screen and (max-width: 500px) {
    .card_flip p {
        font-size: 1rem;
        color: #fff !important;
        text-transform: uppercase;
    }
}

.card_flip .linear-wipe {
    text-align: center;
    background: linear-gradient(to right, #ee7752 20%, #e73c7e 40%, #e73c7e 60%, #ee7752 80%);
    background-size: 200% auto;
    color: #000;
    background-clip: text;
    text-fill-color: transparent;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-animation: glowingText 1s linear infinite;
    animation: glowingText 1s linear infinite;
}

@-webkit-keyframes glowingText {
    to {
        background-position: 200% center;
    }
}

@keyframes glowingText {
    to {
        background-position: 200% center;
    }
}

.card_flip>p {
    font-family: "Lato", Verdana, sans-serif;
    font-weight: normal;
    text-align: justify;
    color: #233240;
    pointer-events: none;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    z-index: 100;
}

.card_flip:nth-child(0) {
    -webkit-transform: translateY(-5.5em) scale(0.875);
    -moz-transform: translateY(-5.5em) scale(0.875);
    -o-transform: translateY(-5.5em) scale(0.875);
    -ms-transform: translateY(-5.5em) scale(0.875);
    transform: translateY(-5.5em) scale(0.875);
    background: linear-gradient(-45deg, #ee775282, #e73c7e82);
    animation: gradient 15s ease infinite;
}

.card_flip:nth-child(1) {
    -webkit-transform: translateY(-4.4em) scale(0.9);
    -moz-transform: translateY(-4.4em) scale(0.9);
    -o-transform: translateY(-4.4em) scale(0.9);
    -ms-transform: translateY(-4.4em) scale(0.9);
    transform: translateY(-4.4em) scale(0.9);
    background: linear-gradient(90deg, #743826, #702542);
    animation: gradient 15s ease infinite;
}

.card_flip:nth-child(2) {
    -webkit-transform: translateY(-3.3em) scale(0.925);
    -moz-transform: translateY(-3.3em) scale(0.925);
    -o-transform: translateY(-3.3em) scale(0.925);
    -ms-transform: translateY(-3.3em) scale(0.925);
    transform: translateY(-3.3em) scale(0.925);
    background: linear-gradient(270deg, #af573c, #8f274f);
    animation: gradient 15s ease infinite;
}

.card_flip:nth-child(3) {
    -webkit-transform: translateY(-2.2em) scale(0.95);
    -moz-transform: translateY(-2.2em) scale(0.95);
    -o-transform: translateY(-2.2em) scale(0.95);
    -ms-transform: translateY(-2.2em) scale(0.95);
    transform: translateY(-2.2em) scale(0.95);
    background: linear-gradient(90deg, #b1583c, #b52c61);
    animation: gradient 15s ease infinite;
}

.card_flip:nth-child(4) {
    -webkit-transform: translateY(-1.1em) scale(0.975);
    -moz-transform: translateY(-1.1em) scale(0.975);
    -o-transform: translateY(-1.1em) scale(0.975);
    -ms-transform: translateY(-1.1em) scale(0.975);
    transform: translateY(-1.1em) scale(0.975);
    background: linear-gradient(270deg, #c96647, #c1356b);
    animation: gradient 15s ease infinite;
}

@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

.whats_next_bg {
    background: url("../../../../../20230705135046im_/https_/blackmamba.buzz/assets/images/whatnext/whats_next_bg.html");
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

@media screen and (max-width: 1000px) {
    .whats_next_bg {
        background-size: contain;
    }
}

@media screen and (max-width: 500px) {
    .whats_next_bg {
        background: none;
    }
}


/* Roadmap Start*/

 :root {
    --prompt: 'Prompt', sans-serif;
    --rubik: 'Rubik', sans-serif;
    --topposition1: 355px;
    --leftposition1: 40%;
    --topposition2: 190px;
    --leftposition2: 84.5%;
}

section .div-content-left,
section .div-inner,
section .div-content-right {
    flex: 0 0 calc(100%/3);
    max-width: calc(100%/3);
    margin: 8% auto;
}

section #myCanvas {
    margin: 8% auto;
    max-height: 70vh;
    width: 100%;
    border: 1px solid #d9d9d9;
}

section .div-inner {
    background-image: linear-gradient( 101deg, rgba(245, 247, 250, .12), rgba(245, 247, 250, .06) 52%, rgba(245, 247, 250, 0));
    -webkit-backdrop-filter: blur(40px);
    backdrop-filter: blur(40px);
    position: relative;
    padding: 40px;
    border-radius: 24px;
    display: grid;
    grid-gap: 20px;
    grid-template-rows: 80px 150px 100px;
    box-shadow: 8px 8px 24px 0 rgba(9 13 20 / 20%), -4px -4px 8px 0 rgba(224 224 255 / 4%), 0 1px 1px 0 rgba(9 13 20 / 20%);
    border: 1px solid rgba(245, 247, 250, .06);
    z-index: 2;
    width: 100%;
}

section .div-inner .marker {
    background-image: linear-gradient(3deg, rgb(13 177 181), rgb(13 177 181));
    width: 65px;
    height: 65px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
    justify-content: center;
}

section .div-inner .marker img {
    width: 100px;
    height: 80px;
    margin-left: -2px;
    border-radius: 50%;
}

section .div-inner .marker i {
    color: #fff;
    font-size: 25px;
}

section .div-inner .badge {
    position: absolute;
    right: 40px;
    top: 8%;
    display: flex;
    align-items: center;
    padding: 5px 12px;
    border-radius: 12px;
    color: #0fa;
    background-color: rgba(0, 255, 170, 0.07);
}

section .div-inner .badge i {
    color: #0fa;
    margin-right: 4px;
}

section .div-inner .badge span {
    color: #0fa;
    background-color: rgba(0, 255, 170, .03);
}

section .div-inner .footer {
    flex: 1;
    display: flex;
    justify-content: space-between;
    padding: 0 5px;
}

section .div-inner .body {
    display: none;
}

section .div-inner .body.active {
    display: block;
    animation: fadeIn 0.8s ease-in-out;
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

.div-content-right img {
    opacity: 0.5;
}

section .div-inner .body p {
    font-family: var(--prompt);
    word-spacing: 0.001px;
}

section .div-inner .body h2 {
    color: #fff;
    font-size: 34px;
    font-weight: bold;
    margin-bottom: 19px;
    font-family: var(--rubik);
}

section .div-inner .footer button {
    color: #fff;
    text-decoration: none;
    border-radius: 12px;
    border: none;
    background: rgba(29, 26, 26, 0.11);
    padding: 12px 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    align-self: flex-end;
    grid-column-gap: 12px;
    -moz-column-gap: 12px;
    column-gap: 12px;
    cursor: pointer;
}

section .div-inner .footer button span {
    font-size: 18px;
    font-weight: 500;
    line-height: 1.33;
    letter-spacing: 0.5px;
    color: #fff;
    transition: all 0.3s ease;
}

section .div_right {
    position: absolute;
    height: 500px;
    right: 0;
    z-index: 2;
}

section .div_left {
    position: absolute;
    height: 700px;
    width: 250px;
    left: 0;
    z-index: 2;
}

section .div-content-left {
    position: relative;
    z-index: 3;
}

section .div-content-left .roadmap_head {
    background-color: rgba(0, 187, 255, .07);
    border-radius: 12px;
    padding: 5px 15px;
    margin-bottom: 22px;
    display: inline-block;
}

section .div-content-left h2 {
    color: #fff;
    font-size: 35px;
    font-weight: bolder;
    line-height: 2.35rem;
    width: 85%;
    font-family: var(--rubik);
}

section .div-content-left .roadmap_head p {
    color: #0bf;
    font-size: 17px;
    letter-spacing: 0.2px;
}

section .div-content-right {
    display: flex;
    /* justify-content: center; */
}

section .div-content-right img {
    align-self: flex-end;
    margin-left: 15px;
    width: 12rem;
}

section {
}

section .div-flex {
    display: flex;
    max-width: 1190px;
    min-height: 600px;
    overflow: hidden;
    position: absolute;
    z-index: 1;
}

section .div-flex .img_container {
    height: 100%;
    width: 100%;
    display: flex;
    transition: all 1s ease-in-out;
}

section .div-flex .img-contain1,
section .div-flex .img-contain2,
section .div-flex .img-contain3,
section .div-flex .img-contain4,
section .div-flex .img-contain5,
section .div-flex .img-contain6,
section .div-flex .img-contain7,
section .div-flex .img-contain8 {
    height: 470px;
}

section .div-flex .img-contain1::after,
section .div-flex .img-contain2::after,
section .div-flex .img-contain3::after,
section .div-flex .img-contain4::after,
section .div-flex .img-contain5::after,
section .div-flex .img-contain6::after,
section .div-flex .img-contain7::after,
section .div-flex .img-contain8::after {
    position: relative;
}

section .div-flex .img-contain1::after,
section .div-flex .img-contain2::after,
section .div-flex .img-contain3::after,
section .div-flex .img-contain4::after,
section .div-flex .img-contain5::after,
section .div-flex .img-contain6::after,
section .div-flex .img-contain7::after,
section .div-flex .img-contain8::after {
    position: absolute;
    top: var(--topposition1);
    left: var(--leftposition1);
    content: url(../../../../../20230705135046im_/https_/blackmamba.buzz/assets/images/roadmap/superpower.html);
    background-image: linear-gradient(135deg, rgb(0, 255, 170), rgb(0, 187, 255) 53%, rgb(69, 121, 245));
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
    justify-content: center;
    flex-direction: column;
    padding-top: 5px;
    padding-right: 5px;
    transform: scale(0.92);
}

section .div-flex .img-contain2::after {
    top: var(--topposition2);
    left: var(--leftposition2);
    content: url(../../../../../20230705135046im_/https_/blackmamba.buzz/assets/images/roadmap/clipboard.html);
    padding-left: 5px;
    background-image: linear-gradient(135deg, rgb(0, 255, 170), rgb(69, 121, 245) 53%, rgb(156, 66, 245) 100%);
}

section .div-flex .img-contain3::after {
    top: 30px;
    left: 126%;
    content: url(../../../../../20230705135046im_/https_/blackmamba.buzz/assets/images/roadmap/eye2.html);
    background-image: linear-gradient(135deg, rgb(0, 187, 255), rgb(69, 121, 245) 51%, rgb(93, 45, 225));
}

section .div-flex .img-contain4::after {
    top: -136px;
    left: 167.6%;
    content: url(https://web.archive.org/web/20230705135046im_/https://blackmamba.buzz/assets/images/roadmap/config.svg);
    padding-left: 5px;
    background-image: linear-gradient(135deg, rgb(0, 187, 255), rgb(156, 66, 245) 53%, rgb(93, 45, 225));
}

section .div-flex .img-contain5::after {
    top: -300px;
    left: 209.5%;
    content: url(../../../../../20230705135046im_/https_/blackmamba.buzz/assets/images/roadmap/fire.html);
    background-image: linear-gradient(135deg, rgb(255, 0, 170), rgb(156, 66, 245) 50%, rgb(93, 45, 225));
}

section .div-flex .img-contain6::after {
    top: -461px;
    left: 251.3%;
    content: url(../../../../../20230705135046im_/https_/blackmamba.buzz/assets/images/roadmap/recycle2.html);
    padding-top: 5px;
    padding-right: 5px;
    background-image: linear-gradient(135deg, rgb(255, 94, 0), rgb(245, 69, 98) 54%, rgb(195, 45, 225));
}

section .div-flex .img-contain7::after {
    top: -628px;
    left: 292.5%;
    content: url(https://web.archive.org/web/20230705135046im_/https://blackmamba.buzz/assets/images/roadmap/light.svg);
}

section .div-flex .img-contain8::after {
    top: -795px;
    left: 333.5%;
}

section .div-flex .child1 {
    transform: rotateX(66deg) translate(-4%, 150%);
}

section .div-flex .child2 {
    transform: rotateX(66deg) translate(-17%, 53%);
}

section .div-flex .child3 {
    transform: rotateX(66deg) translate(-32%, -40%);
}

section .div-flex .child4 {
    transform: rotateX(66deg) translate(-46%, -136%);
}

section .div-flex .child5 {
    transform: rotateX(66deg) translate(-61%, -228.2%);
}

section .div-flex .child6 {
    transform: rotateX(66deg) translate(-76%, -320.2%);
}

section .div-flex .child7 {
    transform: rotateX(66deg) translate(-91%, -412.2%);
}

section .div-flex .child8 {
    transform: rotateX(66deg) translate(-106%, -504.2%);
}

section .div-flex .child9 {
    transform: rotateX(66deg) translate(-121%, -596.2%);
}

@media(max-width: 850px) {
    section {
        /*max-height: 100vh;*/
        background: -webkit-linear-gradient(left, #000, #000 86%, rgba(33, 36, 41, 1));
        background: linear-gradient(left, #000, #000 86%, rgba(33, 36, 41, 1));
        height: 100%;
    }
    section .div-flex {
        display: flex;
        width: 90%;
        min-height: 90vh;
        overflow: hidden;
        position: absolute;
        z-index: 1;
    }
    section .div-flex .m-none {
        display: none !important;
    }
    section .div-flex .img_container {
        height: 100%;
        width: 100%;
        display: flex;
        transition: all 1s ease-in-out;
    }
    section .div-content-left,
    section .div-inner,
    section .div-content-right {
        flex: 0 0 100%;
        max-width: 100%;
        margin: 0 15px;
        padding: 15px;
    }
    section .div-inner {
        flex: 0 0 91.5%;
        margin-top: 20px;
    }
}

@media(min-width: 750px) and (max-width: 1050px) {
     :root {
        --topposition1: 335px;
        --leftposition1: 52.5%;
        --topposition2: 190px;
        --leftposition2: 103.5%;
    }
    section .container {
        max-width: 950px;
    }
    section .div-flex {
        display: none;
    }
    section .div-flex .child1 {
        transform: rotateX(66deg) translate(1%, 86%);
    }
    section .div-flex .child2 {
        transform: rotateX(66deg) translate(-14%, -9%);
    }
    section .div-flex .child3 {
        transform: rotateX(66deg) translate(-28%, -103%);
    }
    section .div-flex .child4 {
        transform: rotateX(66deg) translate(-44%, -194%);
    }
    section .div-flex .child5 {
        transform: rotateX(66deg) translate(-60%, -285.2%);
    }
    section .div-flex .child6 {
        transform: rotateX(66deg) translate(-76%, -379%);
    }
    section .div-flex .child7 {
        transform: rotateX(66deg) translate(-91%, -473.2%);
    }
    section .div-flex .child8 {
        transform: rotateX(66deg) translate(-106%, -564.2%);
    }
    section .div-flex .child9 {
        transform: rotateX(66deg) translate(-121%, -650.2%);
    }
    section .div-flex .img-contain3::after {
        top: -79px;
        left: 154%;
    }
    section .div-flex .img-contain4::after {
        top: -241px;
        left: 204.2%;
    }
    section .div-flex .img-contain5::after {
        top: -410px;
        left: 255.1%;
    }
    section .div-flex .img-contain6::after {
        top: -583px;
        left: 306.1%;
    }
    section .div-flex .img-contain7::after {
        top: -744px;
        left: 356.8%;
    }
    section .div-flex .img-contain8::after {
        top: -893px;
        left: 407.5%;
    }
}

@media (max-width: 2000px) {
    section .div_right {
        width: calc(50% - 450px);
    }
    section .div_left {
        width: calc(50% - 450px);
    }
}


/* Roadmap end*/


.footer_n_a[href="javascript:;"] {
    position: relative; /* Ensure the tooltip positions relative to the link */
    color: #fff; /* Default link color */
    text-decoration: none; /* Remove underline */
}

.footer_n_a[href="javascript:;"]:hover {
    text-decoration: underline; /* Optional: Add underline on hover */
    cursor: pointer; /* Indicate hoverable element */
}

/* Tooltip container */
.footer_n_a[href="javascript:;"]:hover::after {
    content: "Coming Soon"; /* Tooltip text */
    position: absolute; /* Position relative to the link */
    bottom: 100%; /* Position above the link */
    left: 50%; /* Center tooltip */
    transform: translateX(-50%);
    background-color: #333; /* Tooltip background */
    color: #fff; /* Tooltip text color */
    padding: 5px 10px; /* Padding for tooltip */
    border-radius: 5px; /* Rounded corners */
    white-space: nowrap; /* Prevent text wrapping */
    font-size: 0.9rem; /* Adjust font size */
    opacity: 0; /* Start hidden */
    visibility: hidden; /* Ensure hidden when not hovered */
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

/* Show the tooltip on hover */
.footer_n_a[href="javascript:;"]:hover::after {
    opacity: 1;
    visibility: visible;
}

/* Exclude specific links */
.footer_n_a[href="javascript:;"]:not([href="./mamba-swap.html"]):not([href="javascript:void(0);"]) {
    /* Only apply to other links with href="javascript:;" */
}



.bg-bl{
    background-color: #000;
}

.mamba_bg{
    background: #000;
}

.mamba_world_wrapper {
    border: 4px solid #0db1b5;
    border-radius: 15px;
    padding: 4rem;
    position: relative;
    box-shadow: 0px -20px 25px #0db1b5, 0px 20px 25px #0db1b5;
}

.mambaworld_left{
    color: #0db1b5;
    word-spacing: 15px;
    letter-spacing: 10px;
    font-family: 'Gugi', cursive;
    text-transform: uppercase;
    text-align: center;
    font-size: 2rem;
}
.mambaworld_right p{
    color: #fff;
    font-size: 1.1rem;
}

.mambaworld_left {
    color: #0db1b5;
    letter-spacing: 8px;
    font-family: 'Gugi', cursive;
    text-transform: uppercase;
    font-size: 2.7rem;
}

.border_thick_blue {
    height: 120%;
    margin-right: 3rem;
    background: linear-gradient(to top, rgba(255,255,255,0) 0%, #0db1b5 15%, #0db1b5 25%, #0db1b5 25%, #0db1b5 35%, #0db1b5 35%, #0db1b5 50%, #0db1b5 65%, #0db1b5 65%, #0db1b5 75%, #0db1b5 75%, #0db1b5 85%, rgba(255,255,255,0) 100%);
    position: relative;
    top: -40px;
}

.border_thick_blue p{
    background-image: -webkit-gradient(radial, 50% -51%, 51, 51% 0, 77, from(#0db1b5), to(rgba(255, 255, 255, 0)));
    display: block;
    height: 20px;
    left: 0px;
    position: absolute;
    top: 55px;
    width: 70rem;
    z-index: 0;
    box-shadow: 0px 0px 20px 20px #0db1b5a3;
    border-radius: 50%;
    background: #0db1b5;
}
.pd_sm{
    padding-left: 20px;
    padding-right: 20px;
}

.bite_bg{
    background: url(./assets/button_bg.png) 0 10px no-repeat;
    background-size: 100%;
    width: 11rem;
    height: 5rem;
    font-size: 1.4rem;
    border: 0;
    color: #e1017b;
    text-align: left;
    padding: 20px 57px 10% 21px;
}

@media screen and (min-width: 1025px) and (max-width: 1440px) {
    .first_sec{
        margin: 4rem 0;
    }
    .second_sec{
        margin: 0px;
    }
    .new_mar{
        margin-top: 10rem;
        margin-bottom: 2rem;
    }
    #myAnchor{
        margin: 5rem 0 0;
    }
    .y_mar_6{
        margin: 0 0 6rem;
    }
    .img_sec_n_mar{
        margin: 10rem 0 6rem;
    }
    .n_marr{
        margin: 6rem 0 4rem;
    }
    .m_t_6{
        margin: 6rem 0 0;
    }
    .glow_headding{
        font-size: 8vh !important
    }
}
@media screen and (min-width: 1200px) and (max-width: 1399px) {
    .border_thick_blue p{
        position: absolute !important;
        height: 15px !important;
        left: -4px !important;
        top: 60px !important;
        width: 105% !important;
    }
}

@media screen and (min-width: 1025px) and (max-width: 1199px) {
    .border_thick_blue p{
        position: absolute !important;
        top: 25px !important;
        left: 60px !important;
        width: 85% !important;
        height: 10px !important;
    }
}
@media screen and (min-width: 769px) and (max-width: 975px) {
    .glass-card{
        margin-left: 15px!important;
    }
}
@media screen and (min-width: 768px) and (max-width: 850px) {
    .double_mamba {
        /*top: 40% !important;*/
    }
    .new_mar{
        margin-top: -8rem !important;
        min-height: 50vh !important;
    }
    .proud-mamba_wrapper{
        margin-left: 25px;
    }
    .proud_mamba_wrapper:before{
        width: 25% !important;
        height: 80% !important;
        right: 10px !important;
        top: 60px !important;
    }
    .background_theme_bright:after{
        top: 0 !important;
        left: 0 !important;
        width: 35vh !important;
        height: 35vh !important;
    }
}
@media screen and (min-width: 1025px ) and (max-width: 1399px) {
        .new_mar{
            margin-top: 15rem !important;
        }
}
@media screen and (min-width: 1025px) and (max-width: 1279px) {
    .mambaswap_title{
        font-size: 4rem !important;
    }
}
@media screen and (max-width: 425px) {
    .mob_mar{
        margin-left: 30px;
    }
    svg text {
        font-size: 6rem;
    }
    .glass-card{
        margin-left: 15px;
    }
    .background_theme_bright{
        padding: 0 2rem !important;
    }
    .double_mamba{
        top: 75% !important;
    }
    .second_sec{
        min-height: 95vh;
        margin: 0 !important;
    }
    .bot_mar {
        margin-bottom: 20px;
    }
    .mob_txt_cen{
        text-align: center;
    }
    .mamba_user_text{
        font-size: 12px;
        margin-left: 12px;
        margin-bottom: 15px;
        word-spacing: 0;
    }
    .clip_text .biggy{
        font-size: 20px;
    }
    .new_mar{
        height: 37vh !important;
        margin-bottom: 25px !important;
        margin-top: 6rem !important;
    }
    .tab_sty{
        /*width: 60% !important;*/
        margin-left: 10px;
        display: block;
    }
  /*  .w-100{
        width: 60% !important;
    }*/
    .mob_ali{
        display: flex;
        flex-direction: column;
    }
    .marketplace_wrapper{
        padding: 2rem !important;
        /*width: 85% !important;*/
    }
    .f_s_18{
        font-size: 12px;
    }
    .top_abso{
        left: 15rem !important;
        top: -5rem !important;
        width: 100px !important;
    }
    .left_top_abso{
        left: -3rem !important;
        width: 100px !important;
        top: -75px !important;
    }
    .bot_left_abso {
        bottom: -3rem !important;
        width: 100px !important;
        left: - 3rem !important; 
    }
    .fs_big{
        font-size: 2rem !important;
    }
    .img_sec_n_mar {
        min-height: 55vh !important;
        margin: 6rem 0 0 !important;
    }
    .mambaworld_left{
        font-size: 1rem !important;
    }
    .f_1_rem{
        font-size: 11px !important;
    }
    .mob_sz{
        margin: 10vh 0 0 !important;
    }
    .sm_l_mr{
        margin-left: 10px;
    }
    .y_mar_6{
   /*     padding: 2rem !important;*/
        margin-top: 4rem !important;
        margin-bottom: 0 !important;
        min-height: 65vh !important;
    }
}
@media screen and (max-width: 375px) {
    .n_cl_f_sec {
        margin: 1rem 0 0 !important;
    }
    .f_s_11{
        font-size: 11px;
    }
    .glass-card{
        padding: 56px 12px !important;
    }
    .clip_text.biggy{
        font-size: 24px !important;
    }
    .new_mar{
        margin-top: 40px !important;
        margin-bottom: 00px !important;
    }
    .y_mar_6{
        margin-top: 3rem !important;
    }
    .sm_l_mar{
        margin-left: 10px; 
    }
    .top_abso {
        left: 11rem !important;
        top: -22% !important;
        width: 100px !important;
    }
    .marketplace_wrapper {
        padding: 2rem !important;
        margin-left: 30px !important;
    }
    .left_top_abso{
        width: 100px !important;
        top: -80px !important;
        left: -10px !important;
    }
    .mamba_user_text {
        font-size: 10px;
        margin-left: 12px;
        margin-bottom: 20px;
    }
    .bot_left_abso{
        width: 100px !important;
        left: -10px !important;
        bottom: -4rem !important;
    }
    .para_f_size{
        font-size: 12px !important;
    }
    .mob_ali{
        margin-left: 10px;
    }
    .div-content-left h2{
        font-size: 15px !important;
    }
    .border_thick_blue p{
        width: 125% !important;
    }
}
@media screen and (max-width: 320px) {
    .glass-card {
        margin-left: 20px;
    }
    .clip_text.biggy{
        font-size: 18px !important;
    }
    .align-self-center {
        padding: 0 !important;
    }
    .mamba_user_text{
        font-size: 9px !important;
        margin-bottom: 10px !important;
    }
    .background_theme_bright{
        margin-top: 3rem !important;
    }
    .proud_mamba_wrapper:before{
        top: 10% !important;
    }
    .double_mamba {
        top: 82% !important;
    }
    .background_theme_bright:after{
        height: 20vh !important;
    }
    .new_mar{
        height: 30vh !important;
    }
    .mambaswap_title{
        font-size: 24px !important;
    }
    .tab_sty{
        margin-left: 15px !important;
    }
    .para_f_size{
        font-size: 10px !important;
    }
    .pd_sm{
        padding-right: 30px !important;
        padding-left: 30px !important;
    }
    .marketplace_title{
        font-size: 10px !important;
    }
    .marketplace_title2{
        font-size: 24px !important;   
    }
    .marketplace_title3{
        font-size: 12px !important;   
    }
    .f_s_18{
        font-size: 10px !important;
    }
    .top_abso{
        left: 10rem !important;
        top: -28% !important;
    }
    .y_mar_6 {
        min-height: 60vh !important;
    }
    .img_sec_n_mar{
        margin: 4rem 0 0 !important;
    }
    .img_sec_n_mar{
        min-height: 50vh !important;
    }
    .mob_sz {
        margin: 5vh 0 0 !important;
    }
    .mambaworld_left{
        font-size: 11px !important;
    }
    .f_1_rem{
        font-size: 9px !important
    }
    .border_thick_blue p{
        top: 35px !important;
        height: 5px !important;
    }
    section .div-inner{
        margin-left: 10% !important;
        max-width: 85% !important;
    }
    .div-content-left h2{
        font-size: 12px !important;
    }
    section .div-content-right img{
        width: 15rem !important;
    }
    .size_icon{
        width: 30px;
    }
    ul.social-media_footer li{
        margin: 8px;
    }
    .emailers_footer a{
        font-size: 10px;
    }
}
.jus_text{
    text-align: justify;
    font-family: "Poppins", sans-serif;
}
.changes_shijisha{
    display: flex;
    flex-direction: column;
}
.mambaworld_right{
    margin-top: 5%;
}
.f_1_rem{
    text-align: justify;
}

/*css of cards ecosystem*/

    body{

    }
    .navbar img {
        height: 32px;
        width: auto;
        justify-self: start;
        margin: 0 10px ;
    }
    .button_theme2:hover{
        text-decoration: none !important;
    }
    .z1{
        z-index: 1;
    }
    .z2{
        z-index: 2;
    }
    .z3{
        z-index: 3;
    }
    .z4{
        z-index: 4;
    }
    .z5{
        z-index: 5;
    }
    .z6{
        z-index: 6;
    }
    .z7{
        z-index: 7;
    }

    .big_text {
        font-size: 6vh;
        font-family: 'Josefin Sans', sans-serif;
    }
    .flex_normal {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }
    .flex_normal_reverse {
        display: flex;
        flex-direction: row-reverse;
        justify-content: space-between;
        align-items: center;
    }
    .flex_col_center p{
        margin-bottom: 0;
        color: #0db2b6;
    }
    svg text {
      letter-spacing: 10px;
      stroke: #fff;
      font-weight: 700;
      stroke-width: 1;
     
      animation: textAnimate 5s infinite alternate;
      
    }

    @keyframes textAnimate {
      0% {
        stroke-dasharray: 0 50%;
        stroke-dashoffset:  20%;
        fill:hsl(189, 68%, 75%)

      }
      
      100% {
        stroke-dasharray: 50% 0;
        stroke-dashoffstet: -20%;
        fill: hsla(189, 68%, 75%,0%)
      }
      
    }

    .border_glow {
        border: 1px solid #c40d77;
        box-shadow: -9px 2px 15px 5px #c11078, 9px -2px 15px 5px #07b6b8;
    }
    .mambaswap_title, .marketplace_title2{
        color: #0db1b5;
        font-size: 5rem;
        word-spacing: 15px;
        letter-spacing: 10px;
        font-family: 'Gugi', cursive;
        text-transform: uppercase;
        text-align: center;
    }

    .marketplace_title{
        color: #0db1b5;
        font-size: 3rem;
        word-spacing: 15px;
        letter-spacing: 10px;
        font-family: 'Gugi', cursive;
        text-transform: uppercase;
        text-align: center;
    }
    .marketplace_title3 {
        color: #fff;
        text-align: center;
        font-size: 4rem;
        word-spacing: 15px;
        letter-spacing: 10px;
        font-family: 'Gugi', cursive;
        text-transform: uppercase;
    }

    .marketplace_wrapper {
        backdrop-filter: blur(5px) saturate(200%);
        -webkit-backdrop-filter: blur(5px) saturate(200%);
        background-color: rgb(50 49 49 / 73%);
        border-radius: 0px;
        box-shadow: inset -20px 0px 20px -15px #ffffff;
        text-align: center;
        border-radius: 10px 50px 50px 10px;
        padding: 4rem;
        border: 2px solid #fff;
        margin-top: 10rem;
        text-align: justify;
        font-size: 1.5rem;
    }

    .top_abso {
        top: -4.5rem;
        width: 130px;
        left: 10rem;
        border: 2px solid #09b1b3;
        border-radius: 10px;
    }

    .left_top_abso {
        left: -9rem;
        top: 100px;
        width: 12rem;
        border: 2px solid #09b1b3;
        border-radius: 10px;
    }

    .bot_left_abso {
        bottom: -6rem;
        left: -3rem;
        width: 166px;
    }

    .theme_gugi{
        color: #0db1b5;
        word-spacing: 15px;
        letter-spacing: 10px;
        font-family: 'Gugi', cursive;
        text-transform: uppercase;
    }


    .fs_big {
    font-size: 4rem;
}

.bite_bg {
    text-decoration: none;
}
a:hover {
    color: #08b6b8;
}

#fluidCanvas{
    width: 100vw;
    height: 100vh;
}
canvas {
    width: 100%;
    max-width: 100%;
    height: 100%;
    position: absolute;
    top: 0%;
    right: 0%;
    bottom: 0%;
    left: 0%;
    z-index: -1;
}

h1.header_text {
  display: inline-block;
  color: white;
  font-family: 'Righteous', serif;
  font-size: calc(1.375rem + 1.5vw);
  }
  @media screen and (max-width: 500px){
    h1.header_text {
    font-size: calc(1.375rem + 1.3vw);
    }
  }

  .underline{
    width: 10vw;
    height: 10px;
    display: block;
    border-radius: 10px;
  }

  .box {
    position: relative;
    width: 100%;
    height: 400px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #000;
    margin-bottom: 2rem;
    border-radius: 20px;
  }

  .box::before {
    content: '';
    position: absolute;
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
    background: #fff;
    z-index: -1;
    border-radius: 20px;
  }

  .box::after {
    content: '';
    position: absolute;
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
    background: #fff;
    z-index: -2;
    filter: blur(40px);

  }

  .box::after,
  .box::before {
    background: linear-gradient(235deg, #14bfc0, #000000, #d61187);
    animation: anim 2s linear infinite; 
  }
  .box .glass {
    position: absolute;
    top: 0;
    left: 0;
    width: 50%;
    height: 100%;
    display: block;
    background: rgba(255,255,255,.1);
    pointer-events:none;
  }

  .box .content {
    padding: 20px;
    color: #fff;
  }

  @keyframes anim {
    0%,100% {
      opacity: 1;
    }
    50% {
      opacity: 0;
    }
  }

@media screen and (max-width: 1710px) {

}

.normal h1{
    color: #fff;
    background: linear-gradient(to Right, #d61187, #ffffff, #0db2b6 45%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 1.9rem;
}

.background_seperator {
    text-align: center;
    margin-top: -8vw !important;
    margin-bottom: 4rem;
    background: #13adb5;
    padding: 10px;
}
.right_side_dark_snake{
    width: 100%;
    margin : 0 auto;
}

.posi_for_mainsnake{
    position: absolute;
        top: 10rem;
        right: 10rem;}
.benefits_image{
    width: 75%;
    margin: 0 auto;
}
@media screen and (max-width : 500px){
    .right_side_dark_snake,
    .benefits_image{
        width: 100%;
    }
.posi_for_mainsnake{
    display: none;
}
}
.colorgreen{
    color : #0db1b5;
}

.btn_theme{
    color: #f3f0f5;
    background-color: transparent;
    font-size: 20px;
    border-radius: 12px;
    border: 1px solid #AE207E;
    display: block;
    width: 100%;
    line-height: 3;
}


}
.ol_sty{
    color: #fff;
}

.wrapperleftBorder {
    padding: 2rem;
    border-radius: 10px;
    border-left: 5px solid #13adb5;
    border-right: 5px solid #13adb5;
    box-shadow: 0px 0px 20px 10px #484848;
    animation: pulse 2s infinite;
}

@-webkit-keyframes pulse {
  0% {
    -webkit-box-shadow: 0 0 0 0 #13adb5;
  }
  70% {
      -webkit-box-shadow: 0 0 0 10px #13adb5;
  }
  100% {
      -webkit-box-shadow: 0 0 0 0 #13adb5;
  }
}
@keyframes pulse {
  0% {
    -moz-box-shadow: 0 0 0 0 rgba(19,173,181, 0.4);
    box-shadow: 0 0 0 0 rgba(19,173,181, 0.4);
  }
  70% {
      -moz-box-shadow: 0 0 0 10px rgba(19,173,181, 0);
      box-shadow: 0 0 0 10px rgba(19,173,181, 0);
  }
  100% {
      -moz-box-shadow: 0 0 0 0 rgba(19,173,181, 0);
      box-shadow: 0 0 0 0 rgba(19,173,181, 0);
  }
}

.blog-slider {
  width: 95%;
  position: relative;
  max-width: 800px;
  margin: auto;
  background: #000;
  box-shadow: 0px 0px 20px rgb(41 124 145);
  padding: 25px;
  border-radius: 25px;
  height: 400px;
  transition: all 0.3s;
}
@media screen and (max-width: 992px) {
  .blog-slider {
    max-width: 680px;
    height: 400px;
  }
}
@media screen and (max-width: 768px) {
  .blog-slider {
    min-height: 500px;
    height: auto;
    margin: 180px auto;
  }
}
@media screen and (max-height: 500px) and (min-width: 992px) {
  .blog-slider {
    height: 350px;
  }
}
.blog-slider__item {
  display: flex;
  align-items: center;
}
@media screen and (max-width: 768px) {
  .blog-slider__item {
    flex-direction: column;
  }
}
.blog-slider__item.swiper-slide-active .blog-slider__img img {
  opacity: 1;
  transition-delay: 0.3s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > * {
  opacity: 1;
  transform: none;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(1) {
  transition-delay: 0.3s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(2) {
  transition-delay: 0.4s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(3) {
  transition-delay: 0.5s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(4) {
  transition-delay: 0.6s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(5) {
  transition-delay: 0.7s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(6) {
  transition-delay: 0.8s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(7) {
  transition-delay: 0.9s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(8) {
  transition-delay: 1s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(9) {
  transition-delay: 1.1s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(10) {
  transition-delay: 1.2s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(11) {
  transition-delay: 1.3s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(12) {
  transition-delay: 1.4s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(13) {
  transition-delay: 1.5s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(14) {
  transition-delay: 1.6s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(15) {
  transition-delay: 1.7s;
}
.blog-slider__img {
  width: 300px;
  flex-shrink: 0;
  height: 300px;
  background-image: linear-gradient(147deg, #1e9aa7 0%, #b01e7e 74%);
  box-shadow: 8px 8px 20px -11px rgb(13 178 182 / 31%);
  border-radius: 20px;
  transform: translateX(-80px);
  overflow: hidden;
}
.blog-slider__img:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(147deg, #1e9aa7 0%, #b01e7e 74%);
  border-radius: 20px;
  opacity: 0.8;
  z-index: -1;
}
.blog-slider__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  opacity: 0;
  border-radius: 20px;
  transition: all 0.3s;
}
@media screen and (max-width: 768px) {
  .blog-slider__img {
    transform: translateY(-50%);
    width: 90%;
  }
}
@media screen and (max-width: 576px) {
  .blog-slider__img {
    width: 95%;
  }
  .blog-slider__img:after{
    background: none;
  }
  .blog-slider__img{
    background: none;
    box-shadow: none;
  }
}
@media screen and (max-height: 500px) and (min-width: 992px) {
  .blog-slider__img {
    height: 270px;
  }
}
.blog-slider__content {
  padding-right: 25px;
}
@media screen and (max-width: 768px) {
  .blog-slider__content {
    margin-top: -80px;
    text-align: center;
    padding: 0 30px;
  }
}
@media screen and (max-width: 576px) {
  .blog-slider__content {
    padding: 0;
  }
}
.blog-slider__content > * {
  opacity: 0;
  transform: translateY(25px);
  transition: all 0.4s;
}
.blog-slider__code {
  color: #7b7992;
  margin-bottom: 15px;
  display: block;
  font-weight: 500;
}
.blog-slider__title {
  font-size: 24px;
  font-weight: 700;
  color: #fff;
  background: linear-gradient(to Right, #d61187, #ffffff, #0db2b6 45%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-bottom: 20px;
}
.blog-slider__text {
  color: #fff;
  margin-bottom: 30px;
  line-height: 1.5em;
}
.blog-slider__button {
  display: inline-flex;
  background-image: linear-gradient(147deg, #1e9aa7 0%, #b01e7e 74%);
  padding: 15px 35px;
  border-radius: 50px;
  color: #fff;
  box-shadow: 0px 14px 80px rgba(252, 56, 56, 0.4);
  text-decoration: none;
  font-weight: 500;
  justify-content: center;
  text-align: center;
  letter-spacing: 1px;
}
@media screen and (max-width: 576px) {
  .blog-slider__button {
    width: 100%;
  }
}
.blog-slider .swiper-container-horizontal > .swiper-pagination-bullets, .blog-slider .swiper-pagination-custom, .blog-slider .swiper-pagination-fraction {
  bottom: 10px;
  left: 0;
  width: 100%;
}
.blog-slider__pagination {
  position: absolute;
  z-index: 21;
  right: 20px;
  width: 11px !important;
  text-align: center;
  left: auto !important;
  top: 50%;
  bottom: auto !important;
  transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
  .blog-slider__pagination {
    transform: translateX(-50%);
    left: 50% !important;
    top: 205px;
    width: 100% !important;
    display: flex;
    justify-content: center;
    align-items: center;
  }
}
.blog-slider__pagination.swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 8px 0;
}
@media screen and (max-width: 768px) {
  .blog-slider__pagination.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 5px;
  }
}
.blog-slider__pagination .swiper-pagination-bullet {
  width: 11px;
  height: 11px;
  display: block;
  border-radius: 10px;
  background: #fff;
  opacity: 0.2;
  transition: all 0.3s;
}
.blog-slider__pagination .swiper-pagination-bullet-active {
  opacity: 1;
  background: #c90876;
  height: 30px;
  box-shadow: 0px 0px 20px rgb(13 178 182);
}
@media screen and (max-width: 768px) {
  .blog-slider__pagination .swiper-pagination-bullet-active {
    height: 11px;
    width: 30px;
  }
}
.badge {
  position: relative;
  width: 240px;
  display: inline-block;
  margin: 40px;
}
.badge .title {
  font-family: "Montserrat", sans-serif;
  font-weight: bold;
  font-size: 1.7em;
  position: absolute;
  top: -28px;
  border-radius: 8px 8px 0 0;
  text-align: center;
  width: 100%;
  background: red;
  padding: 20px 0;
}
.badge .subtitle {
  position: absolute;
  font-family: "Fjalla One", sans-serif;
  font-size: 4.8em;
  width: 100%;
  text-align: center;
  color: white;
  position: absolute;
  top: 80px;
  color: #fff;
  background: linear-gradient(to top, #d61187, #ffffff, #0db2b6 99%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.badge .subtitle:after {
  /*content: "★ ★ ★";*/
  display: block;
  font-size: 1.4em;
  position: relative;
  margin: 15px 0 0;
  transition: all .3s;
}
.badge:hover .subtitle:after {
  word-spacing: 30px;
}

.pinkish .title {
  background: #c70a76;
}
.pinkish .subtitle:after {
  color: #c70a76;
}

.greenish .title {
  background: #0db1b5;
}
.greenish .subtitle:after {
  color: #0db1b5;
}


.notes {
  margin: auto;
  padding: 2rem 1.2rem 0;
  max-width: 35rem;
  font-family: Open Sans, sans serif;
  text-align: center;
}

.mamba-container {
  width: 100%;
  padding: 1em;
  display: flex;
  flex-flow: column nowrap;
  justify-content: flex-start;
  align-items: center;
  overflow: hidden;
}

.lg-container {
  max-width: 100%;
  position: relative;
}

.lg-image {
  width: 109vw;
  transform: rotate(15deg);
}

.lg-hotspot__label ul li {
    color: #0db2b6;
}


.lg-hotspot {
  position: absolute;
  margin: 0;
  padding: 0;
  transform: translate(-50%, -50%);
  z-index: 0;
  cursor: pointer;
}
.lg-hotspot:hover .lg-hotspot__button, .lg-hotspot:active .lg-hotspot__button {
  border-color: #fff;
}
.lg-hotspot:hover .lg-hotspot__button:after, .lg-hotspot:active .lg-hotspot__button:after {
  background-color: #fff;
}
.lg-hotspot--selected {
  z-index: 999;
}
.lg-hotspot--selected .lg-hotspot__label {
  opacity: 1;
}
.lg-hotspot__button {
  height: 48px;
  width: 48px;
  padding: 0px;
  border-radius: 100%;
  border: 1px solid #be0167;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  z-index: 999;
  animation: button-pulse 7s ease-in-out infinite;
}
.lg-hotspot__button:after {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
  content: "";
  display: block;
  height: 16.8px;
  width: 16.8px;
  border-radius: 100%;
  border: 3px solid white;
  background-color: #be0167;
  transition: border-color 1s linear;
}
.lg-hotspot__label {
  position: absolute;
  padding: 0 0 1.1em 0;
  width: 16em;
  max-width: 50vw;
  background-color: #00000080;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  font-family: "Open Sans", sans-serif;
  font-size: 14.5px;
  line-height: 1.45em;
  z-index: -1;
  pointer-events: none;
  border-radius: 2px;
  user-select: none;
  opacity: 0;
  transition: all 0.1s linear;
}
.lg-hotspot__label h4 {
  margin: 0;
  padding: 0.65em 24px;
  background-color: #00000080;
  font-size: 1.1em;
  font-weight: normal;
  letter-spacing: 0.02em;
  color: white;
  border-radius: 2px 2px 0 0;
}
.lg-hotspot__label p {
  margin: 0;
  padding: 1.1em 24px 0 24px;
  color: #333;
}

.lg-hotspot--top-left .lg-hotspot__label {
  top: 24px;
  left: 24px;
}

.lg-hotspot--top-right .lg-hotspot__label {
  top: 24px;
  right: -12px;
}

.lg-hotspot--bottom-right .lg-hotspot__label {
  right: 24px;
  bottom: 24px;
}

.lg-hotspot--bottom-left .lg-hotspot__label {
  bottom: 24px;
  left: 24px;
}

@keyframes button-pulse {
  0% {
    transform: scale(1, 1);
    opacity: 1;
  }
  40% {
    transform: scale(1.15, 1.15);
    opacity: 1;
  }
  100% {
    transform: scale(1, 1);
    opacity: 1;
  }
}

.color_text a.nav_top{
  color: #fff;
  background: linear-gradient(to Right, #d61187, #ffffff, #0db2b6 45%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-decoration: none;
}


.mamba_overflow{
  overflow: hidden;
}
.height_width{
  height: 32px;
  width: 32px;
}
.style_p{
  font-size: 18px;
  font-weight: 800;
}
.border-networks{
  border: 2px solid #fff;
  border-radius: 10px;
}
@media only screen and (max-width: 1900px) {
  .d_none{
    display: none;
  }
}
@media only screen and (max-width: 420px) {
  .style_p{
    font-size: 12px;
    font-weight: 500;
  }
} 

@media only screen and (max-width: 500px) {
    .d_mobile{
        display: block;
    }
    .d_tab_web{

    }
}
@media (min-width: 500px) and (max-width: 5000px) {
    .d_mobile{
        display: none;
    }
    .d_tab_web{
        display: block;
    }
}

a.btnMamba:hover{
    color: #fff !important;
}
.btnMamba:link,
.btnMamba:visited {
    text-transform: uppercase;
    text-decoration: none;
    padding: 15px 40px;
    display: inline-block;
    border-radius: 10px;
    transition: all .2s;
    position: absolute;
}

.btnMamba:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

.btnMamba:active {
    transform: translateY(-1px);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}

.btnMamba-white {
    background-color: #13adb5;
    color: #fff;
}

.btnMamba::after {
    content: "";
    display: inline-block;
    height: 100%;
    width: 100%;
    border-radius: 10px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    transition: all .4s;
}

.btnMamba-white::after {
    background-color: #13adb5;
}

.btnMamba:hover::after {
    transform: scaleX(1.4) scaleY(1.6);
    opacity: 0;
}

.btnMamba-animated {
    animation: moveInBottom 5s ease-out;
    animation-fill-mode: backwards;
}

@keyframes moveInBottom {
    0% {
        opacity: 0;
        transform: translateY(30px);
    }

    100% {
        opacity: 1;
        transform: translateY(0px);
    }
}
.timer_wrapper{
    padding-top: 5.5rem;
    font-size: calc(100% + 4vmin);
}
.timerspan{
    color: #13adb5;
    font-size: 2rem;
}

@media screen and (max-width: 991){
    .timer_wrapper{
        font-size: 2.8rem;
    }
    .timerspan{
        font-size: 1.5rem;
    }
}
@media screen and (max-width: 500px){
    .timer_wrapper{
        font-size: 1rem;
    }
    .timerspan{
        font-size: 1.1rem;
    }
}
#MambaTimer{
    background: rgb(255 255 255 / 12%);
    box-shadow: 0 8px 32px 0 rgb(31 38 135 / 0%);
    backdrop-filter: blur( 3px );
    -webkit-backdrop-filter: blur( 3px );
    border-radius: 10px;
    border: 1px solid rgb(255 255 255 / 7%);
    padding: 1rem;
}
.border-networks{
  border: 2px solid #fff;
  border-radius: 10px;
}
.ul_networks{
    list-style-type: none;
}
.ul_networks > li {
    /*padding: 10px;*/
    /*border: 4px solid #d3d3d342;*/
    background: #22242c;
    border-radius: 10px;
    margin-right: 10px; 
}
.networks_images{
    cursor: pointer;
    border-radius: 50px; 
}
.networks_img_width{
    width: 50px;
}
.lower_images_width{
    width: 30px;
}
.networks_images:hover {
    transition: all 1s;
    transform: rotate(360deg);
}
.vertical_margin{
    margin-top: 30px;
    margin-bottom: 100px;
}
.How_works_p{
    font-size: 1rem;
    font-family: "Poppins", sans-serif;
}
.bg_logo{
    background: url('../../../../../20220526114954im_/https_/mamba.stashack.cloud/assets/logo_mamba_400.png'); 
    background-position: -2% 50%;
    background-repeat: no-repeat;
    background-size: 350px 350px;
}
.no_right-margin {
    margin-top: 10px;
}
.mambaswap_title_new {
    color: #0db1b5;
    font-size: 2rem;
    word-spacing: 15px;
    letter-spacing: 10px;
    font-family: 'Gugi', cursive;
    text-transform: uppercase;
    text-align: center;
}
.font_weight {
    font-weight: 600;
}
.mid_div_swap {
    border: 6px solid #212529;
    border-radius: 50px;
    /*padding: 20px;*/
}
.inpunt_trade {
    border: 2px solid #fff;
    border-radius: 30px;
    padding: 5px 10px;
}
.span_input {
    position: absolute;
    top: 10px;
    right: 20px;
}
.input_swap {
    background: #000;
    color: #fff;
    padding: 10px 20px;
    width: 100%;
    border: 2px solid #fff;
    border-radius: 30px;
    margin-bottom: 10px;
}
.button_trade {
    padding: 10px 20px;
    background: transparent;
    color: #fff;
    border: 2px solid #fff;
    border-radius: 30px;
    text-decoration: none;
}
.border-radius_img {
    border-radius: 50px !important;
}
.padding_lower_images{
    /*padding: 18px !important;*/
    margin-top: 10px;
    margin-bottom: 10px;
}
.width_img_icon {
    width: 50px;
}
.align_img_1 {
    position: absolute;
    top: 80px;
    left: 60%;
}
.width_img_swap{
    width: 30px;
}
#hover_color:hover {
    color: #0db1b5;
}
.how-it-work-main {
    background: radial-gradient(40.45% 40.45% at 50% 46.16%,#d80175 3.12%,rgba(14,17,32,0) 100%);
}
.posi_relative{
    position: relative;
}
.align_image_howitworks{
    position: absolute;
    top: 14%;
    left: -10%;
    width: 30%;
}
/*mamba swap ecosystem partners*/
@media only screen and (max-width: 939px) {
    .networks_img_width {
        width: 40px;
    }
} 
@media only screen and (max-width: 799px) {
    .networks_img_width {
        width: 30px;
    }
}
@media only screen and (max-width: 750px) {
    .tab_responsive {
        align-content: center;
        flex-direction: column;
        flex-wrap: wrap;
    }
}
@media only screen and (max-width: 768px) {
    .d_none_mobile {
        /*display: none;*/
    }
    .align_image_howitworks{
        display: none;
    }
    .vertical_margin{
        margin-bottom: 0;
        padding: 10px 50px;
        text-align: justify;
    }
    .width_img_icon{
        width: 44px;
    }
    .tab_view {
        padding-top: 18%;
    }
    .background_seperator {
        margin-top: 0vw !important;
    }
}
@media only screen and (max-width: 430px) {
    .d_none_mobile {
        display: none;
    }
    .font_size_mob{
        font-size: 18px !important;
    }
    .mobile_view_mt{
        margin-top: 36vh;
    }
    .DEX_top_margin{
        /*margin-top: 70rem !important;*/
    }
    .proud_mamba_mt{
        margin-top: 16% !important;
    }
    .background_theme_bright{
        padding: 2rem 2rem;
    }
    .mamba_user_text {
        font-size: 18px;
    }
    .proud_mamba_wrapper:before {
        top: 10% !important;
        width: 45%;
    }
    .align_image_howitworks{
        display: none;
    }
    .vertical_margin{
        margin-bottom: 0;
    }
    .how-it-work-main{
        padding: none;
        /*text-align: justify;*/
        margin: 30px 0;
    }
    .bot_left_abso {
        left: 65%;
    }
    .top_abso {
        left: 16rem;
    }
    .left_top_abso {
        left: 0rem !important;
        top: -15% !important;
    }
    .img_sec_n_mar {
        margin: 5rem 0 !important;
    }
    .mambaworld_left{
        font-size: 22px !important;
    }
    .f_1_rem{
        font-size: 14px !important;
    }
}
@media only screen and (max-width: 1024px){
    .align_image_howitworks {
        top: 24%;
        left: 0;
    }
}
@media only screen and (max-width:  1440px) {
    .align_image_howitworks{
        left: -2%;
    }
}
@media only screen and (max-width: 575px) {
    .d_none_mobile {
        display: none;
    }
}
@media only screen and (max-width: 375px) {
    .left_top_abso {
        top: -22% !important;
    }
    .mob_sz {
        margin: 24vh 0 0 !important;
    }
    .mamba_world_wrapper{
        margin-left: 0;
    }
    .proud_mamba_wrapper:before {
        top: 20% !important;
    }
}
@media only screen and (max-width: 320px) {
    .networks_img_width {
        width: 20px;
    }
}
@media only screen and (max-width: 850px) {
    .DEX_top_margin{
        /*margin-top: 50rem;*/
    }
}
@media only screen and (max-width: 991px) {
    .vertical_margin{
        margin-bottom: 0;
    }
    .align_image_howitworks{
        display: none;
    }
}
@media only screen and (min-width: 751px) and (max-width: 850px) {
    .DEX_top_margin {
        /*margin-top: 40rem;*/
    }
}
@media only screen and (max-width: 750px) {
    .DEX_top_margin {
        /*margin-top: 55rem;*/
    }
}
@media only screen and (min-width: 576px) and (max-width: 749px) {
    .DEX_top_margin {
        /*margin-top: 88rem;*/
    }
}
@media only screen and (min-width: 431px) and (max-width: 575px) {
    .DEX_top_margin {
        /*margin-top: 65rem;*/
    }
}
@media only screen and (min-width: 576px) and (max-width: 733px) {
    .width_img_icon {
        width: 26px;
    }
}
@media only screen and (min-width: 356px) and (max-width: 366px) {
    .DEX_top_margin {
        /*margin-top: 75rem !important;*/
    }
}
@media only screen and (min-width: 339px) and (max-width: 355px) {
    .DEX_top_margin {
        /*margin-top: 82rem !important;*/
    }
}
@media only screen and (min-width: 330px) and (max-width: 339px) {
    .DEX_top_margin {
        margin-top: 86rem !important;
    }
}
@media only screen and (min-width: 321px) and (max-width: 330px) {
    .DEX_top_margin {
        margin-top: 96rem !important;
    }
}
@media only screen and (min-width: 294px) and (max-width: 320px) {
    .DEX_top_margin {
        /*margin-top: 94rem !important;*/
    }
}
@media only screen and (min-width: 777px) and (max-width: 991px) {
    .new_resp{
        margin-top: 10rem !important;
    }
}
@media only screen and (min-width: 431px) and (max-width: 539px) {
    #mobile_view_mt_n{
        margin: 32vh 0;
    }
}
@media only screen and (min-width: 769px) and (max-width: 991px) {
    .six_heading_respo{
        padding: 1rem 4rem !important;
    }
}
@media only screen and (min-width: 501px) and (max-width: 552) {
    .DEX_top_margin {
        margin-top: 72rem !important;
    }
}
@media only screen and (min-width: 769px) and (max-width: 845px) {
    .mambaswap_title{
        font-size: 2rem !important;
    }
}
@media only screen and (min-width: 769px) and (max-width: 806px) {
    .blog-slider{
        padding: 25px 35px;
    }
}
@media only screen and (min-width: 1025px) and (max-width: 1352px) {
    .marketplace_title2{
        font-size: 3rem;
    }
    .marketplace_title {
        font-size: 2rem;
    }
    .marketplace_title3{
        font-size: 2rem;
    }
}
@media only screen and (min-width: 769px) and (max-width: 894px) {
    .marketplace_title{
        font-size: 1rem;
    }
    .marketplace_title2{
        font-size: 2rem !important;
    }
}
@media only screen and (min-width: 1545px) and (max-width: 1770px) {
    .left_top_abso{
        top: 30px;
    }
}
@media only screen and (min-width: 769px) and (max-width: 1024px) {
    .bot_left_abso {
        bottom: -8rem !important;
    }
}
@media only screen and (min-width: 376px) and (max-width: 426px) {
    .mamba_world_wrapper {
        margin-top: 14rem;
    }
}
@media only screen and (min-width: 576px) and (max-width: 749px) {
    .networks_img_width {
        width: 20px;
    }
    .DEX_top_margin {
        /*margin-top: 62rem;*/
    }
}
@media only screen and (min-width: 580px) and (max-width: 767px) {
    .top_abso{
        left: 24rem;
    }
    .left_top_abso{
        left: 0 !important;
        top: -75px !important;
    }
}
@media only screen and (min-width: 431px) and (max-width: 579px) {
    .top_abso{
        left: 16rem;
    }
    .left_top_abso{
        left: 0 !important;
        top: -75px !important;
    }
}
@media only screen and (min-width: 320px) and (max-width: 425px)  {
    .left_top_abso{
        top: -24% !important;
    }
}
@media only screen and (min-width: 376px) and (max-width: 425px) {
    .top_abso{
        left: 10rem !important;
    }
}
@media only screen and (min-width: 431px) and (max-width: 560px) {
    .bot_left_abso{
        left: 16rem;
    }
}
@media only screen and (min-width: 560px) and (max-width: 767px) {
    .bot_left_abso{
        left: 24rem;
    }
}
.width_mambanomi{
    width: 50vw;
}
.color_2mamba{
    color: #14AAB3; 
}
.color_on_hover:hover {
    color: #14AAB3;   
}
.bite_bg:hover {
    color: #14AAB3;
}

/*whitepaper button desing*/
.theme_button_bg {
    background: #212429;
    border: 0;
    margin: 10px;
    border-radius: 10px;
    color: #fff;
}
.hover_solve {
    color: #fff !important;
}
.block {
    position: relative;
}
.glow::before,
.glow::after {
  content: "";
  position: absolute;
  left: -2px;
  top: -2px;
  background: linear-gradient( 90deg, #1b9eab, #1b9eac, #a9217f, #a8217e, #635e95 );
  background-size: 400%;
  height: calc(100% + 5px);
  width: calc(100% + 5px);
  z-index: -1;
  animation: change 40s linear infinite;
  border-radius: 10px;
}
@keyframes color {
  0%   { background: #33CCCC; }
  20%  { background: #33CC36; }
  40%  { background: #B8CC33; }
  60%  { background: #FCCA00; }
  80%  { background: #33CC36; }
  100% { background: #33CCCC; }
}

.footer_a{
    color: #14AAB3;
    text-decoration: none;
}
.footer_a:hover {
    color: #fff;
}

/*White paper button css*/
.btnw {
    display: inline-block;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    border-radius: 0.25rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.block {
    position: relative;
}
.btn_n_wid {
    width: 42%;
}
.hover_solve {
    color: #fff !important;
}
.glow::before, .glow::after {
    content: "";
    position: absolute;
    left: -2px;
    top: -2px;
    background: linear-gradient( 90deg, #1b9eab, #1b9eac, #a9217f, #a8217e, #635e95 );
    background-size: 400%;
    height: calc(100% + 5px);
    width: calc(100% + 5px);
    z-index: -1;
    animation: change 40s linear infinite;
    border-radius: 10px;
}
.glow::after {
    filter: blur(40px);
    opacity: .5;
}
.glow::before, .glow::after {
    content: "";
    position: absolute;
    left: -2px;
    top: -2px;
    background: linear-gradient( 90deg, #1b9eab, #1b9eac, #a9217f, #a8217e, #635e95 );
    background-size: 400%;
    height: calc(100% + 5px);
    width: calc(100% + 5px);
    z-index: -1;
    animation: change 40s linear infinite;
    border-radius: 10px;
}
@keyframes change{
   0%{
      background-position: 0 0;
   }
   50%{
      background-position: 400% 0;
   }
   100%{
      background-position: 0 0;
   }
}
.theme_button_bg{
  background: #212429;
  border: 0;
  margin: 10px;
  border-radius: 10px;
  color: #fff;
}
.fs_halfrem{font-size: 1.5rem;}
.fs_1rem{font-size: 1rem;}

.button_wrapper{
  border: 1px solid #727272;
  border-radius: 10px;
  margin: 0 10px;
}
/*close css*/

.footer_adjust{
    flex-direction: column;
}

.width_logo_footer{
    width: 10vw;
}
.glitchf{
    position: relative;
    animation: glitch-skew 1s infinite linear alternate-reverse;
    text-align: center;
    margin: 0 auto;
}
.footer_n_a {
    text-decoration: none;
    color: #fff;
}
.footer_n_a:hover {
    color: #14AAB3;
}
.footer_tnc{
    color: #14AAB3;
    text-decoration: none;
}
.footer_tnc:hover {
    color: #fff;
}
.fs_2_rem{
    font-size: 2rem;
}
.footer_color_h{
    color: #AE207E;
}
/*.center_vertically {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}*/
@media only screen and (min-width: 768px) and (max-width: 1079px) {
    .width_logo_footer {
        width: 14vw;
    }
}
@media only screen and (min-width: 425px) and (max-width: 767px) {
    .width_logo_footer {
        width: 24vw;
    }
}
@media only screen and (min-width: 320px) and (max-width: 424px) {
    .width_logo_footer {
        width: 24vw;
    }
}
.text_align_normal{
    text-align: left;
}
@media only screen and (max-width: 600px) {
    .timerspan{
        font-size: 9px;
    }
}
@media only screen and (min-width: 290) and (max-width: 320px) {
    .timerspan{
        font-size: 5px;
    }
}
@media only screen and (min-width: 290px) and (max-width: 500px) {
    .lg-hotspot--top-right .lg-hotspot__label {
        top: 24px;
        right: -80px;
    }
}

@media only screen and (min-width: 430px) and (max-width: 320px) {
        .mobile_view_2_col {
        width: 45%;
        margin: 0 auto;
    }
}
/*
     FILE ARCHIVED ON 13:50:46 Jul 05, 2023 AND RETRIEVED FROM THE
     INTERNET ARCHIVE ON 11:55:00 Dec 05, 2024.
     JAVASCRIPT APPENDED BY WAYBACK MACHINE, COPYRIGHT INTERNET ARCHIVE.

     ALL OTHER CONTENT MAY ALSO BE PROTECTED BY COPYRIGHT (17 U.S.C.
     SECTION 108(a)(3)).
*/
/*
playback timings (ms):
  captures_list: 0.465
  exclusion.robots: 0.014
  exclusion.robots.policy: 0.007
  esindex: 0.009
  cdx.remote: 25.266
  LoadShardBlock: 124.225 (3)
  PetaboxLoader3.datanode: 95.316 (5)
  PetaboxLoader3.resolve: 259.696 (2)
  load_resource: 282.516
  loaddict: 27.928
*/