.elementor-5611 .elementor-element.elementor-element-7bc7251{--display:flex;--background-transition:0.3s;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-5611 .elementor-element.elementor-element-11b1dfa > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-5611 .elementor-element.elementor-element-11b1dfa{width:100%;max-width:100%;}/* Start custom CSS for html, class: .elementor-element-11b1dfa */html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
  height: 100%;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
button {
  border: none;
}
a {
  text-decoration: none;
}

* {
  font-family: "Comic Sans MS", "Comic Sans", cursive;
}

main {
  background-color: #1b1d28;
}

.header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .5rem;

  >.left {
    display: flex;
    align-items: center;
    gap: 1rem;

    .icon {
      >img {
        width: 40px;
      }
    }

    >.social {
      display: flex;
      flex-direction: column;
      gap: 2px;

      >.row {
        display: flex;
        align-items: center;
        gap: 4px;
      }
    }

    >.badge {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: .5rem;
      border-radius: .25rem;
      font-size: .875rem;
      line-height: 1.25rem;
      background-color: rgb(134 239 172);
      transition: .5s;

      &.-created {
        background-color: #93c5fd;
      }
    }
  }
}

.king-of-the-hill {
  padding: 2rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;

  >.image-text {
    padding: 0.5rem 0;

    >img {
      height: 2.5rem;
    }
  }
}

.search-container {
  display: flex;
  justify-content: center;
  width: 100%;
  padding-top: 1rem;

  >.wrapper {
    width: 450px;
    display: flex;
    justify-content: center;
    gap: .5rem;
  }
}

.tokens {
  padding: 3rem;

  >.navigation {
    padding-bottom: 1rem;
    display: flex;
    flex-direction: column;
    gap: .65rem;

    >.tabs {
      display: flex;
      align-items: center;
      gap: 1rem;

      >.tab {
        cursor: pointer;
        color: rgb(107 114 128);
        padding-bottom: .5rem;
        border-bottom: 3px solid transparent;

        &.-active {
          color: rgb(134 239 172);
          border-bottom: 3px solid rgb(134 239 172);
        }
      }
    }

    >.btns {
      display: flex;
      align-items: center;
      gap: 1rem;
    }
  }

  >.token-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 2rem;
  }
}

.link {
  color: #fff;
  cursor: pointer;

  &.-bigger {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 500;
  }

  &:hover {
    font-weight: 600;
  }
}

.btn {
  padding: .5rem;
  color: #000;
  background-color: rgb(134 239 172);
  border-radius: .25rem;
  cursor: pointer;
  font-size: 1rem;

  &:hover {
    background-color: rgb(34 197 94);
  }
}

.input {
  padding: .5rem;
  font-size: .875rem;
  line-height: 1.25rem;
  background-color: rgb(134 239 172);
  border: none;
  border-radius: .25rem;
  width: 100%;
}

.mini-profile {
  width: 1rem;
  height: 1rem;
}

.mini-token-icon {
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
}

.token-box {
  display: flex;
  gap: 24px;
  padding: .5rem;
  cursor: pointer;
  border: 1px solid transparent;

  &.-bounce {
    animation: softbounce 2s ease-in-out infinite;
  }

  &:hover {
    border: 1px solid #fff;
  }
  
  >img {
    width: 5rem;
    height: 5rem;
  }

  >.text {
    font-size: .75rem;
    line-height: 1rem;
    display: flex;
    flex-direction: column;
    gap: .25rem;

    >.created-by {
      display: flex;
      align-items: center;
      gap: 8px;
      color: rgb(191 219 254);
    }

    >.market-cap {
      display: flex;
      align-items: center;
      gap: 4px;

      >p {
        color: rgb(134 239 172);
      }

      >span {
        color: rgb(34 197 94);
        display: flex;
        align-items: center;
      }
    }

    >.replies {
      color: #fff;
    }

    >.title {
      font-weight: 700;
      font-size: .875rem;
      line-height: 1.25rem;
      color: #fff;
    }
  }

  &.-grid {
    >img {
      width: 8rem;
      height: 8rem;
    } 
    .title, .replies {
      color: #9CA3AF;
    } 
  }
}

@keyframes bounce {
  0% { transform: translateX(-30px); }
  75% { transform: translateX(30px); }
  100% { transform: translateX(0); }
}

@keyframes softbounce {
  0% { transform: scale(1); }
  25% { transform: scale(1.03); background-color: #ffff00; }
  50% { background-color: unset; }
  100% { transform: scale(1); }
}/* End custom CSS */