@font-face {
        font-family: "BinancePlex";
        src: url("https://db.onlinewebfonts.com/t/d05c19ccecf7003d248c60ffd6b5e8f7.eot");
        src: url("https://db.onlinewebfonts.com/t/d05c19ccecf7003d248c60ffd6b5e8f7.eot?#iefix")format("embedded-opentype"),
        url("https://db.onlinewebfonts.com/t/d05c19ccecf7003d248c60ffd6b5e8f7.woff2")format("woff2"),
        url("https://db.onlinewebfonts.com/t/d05c19ccecf7003d248c60ffd6b5e8f7.woff")format("woff"),
        url("https://db.onlinewebfonts.com/t/d05c19ccecf7003d248c60ffd6b5e8f7.ttf")format("truetype"),
        url("https://db.onlinewebfonts.com/t/d05c19ccecf7003d248c60ffd6b5e8f7.svg#Binance PLEX")format("svg");
    }


    @font-face{
        font-family: "Numbers";
        src: url("https://db.onlinewebfonts.com/t/63ca74d3bf8992d63ef6dc50c79c06fe.eot");
        src: url("https://db.onlinewebfonts.com/t/63ca74d3bf8992d63ef6dc50c79c06fe.eot?#iefix")format("embedded-opentype"),
            url("https://db.onlinewebfonts.com/t/63ca74d3bf8992d63ef6dc50c79c06fe.woff")format("woff"),
            url("https://db.onlinewebfonts.com/t/63ca74d3bf8992d63ef6dc50c79c06fe.woff2")format("woff2"),
            url("https://db.onlinewebfonts.com/t/63ca74d3bf8992d63ef6dc50c79c06fe.ttf")format("truetype"),
            url("https://db.onlinewebfonts.com/t/63ca74d3bf8992d63ef6dc50c79c06fe.svg#Numbers")format("svg");
        font-weight:normal;
        font-style:normal;
        font-display:swap;
    }
  .main_div {
    height: 300px;
  }

  /* #Chain1APIType  {
  width: 180px !important; 
  } */
  /* #ChainAPIType  {
  width: 180px !important; 
  }
  #Chain2APIType  {
  width: 180px !important; 
  } */

  .select2-container--default .select2-results {
          scrollbar-color: rgb(13, 13, 13) #525252; 
      }
  .select2-selection {
      display: none !important;
  }
  form .select2-selection {
      display: block !important; 
  }
  .select2-container {
  background-color: rgb(13, 13, 13);
  color: white; 
  border: none;
  border-radius: 10px; 
  margin-left: 8px;
}

.headings_singlecoin{
      background-color: #525252;
      width: 190px;
      border-radius: 8px;
      height: 33px;
      color: #d9d6d6;
      text-align: center;
      padding-top: 4px;
      margin-top: 10px;
  }

.headings{
      background-color: #525252;
      width: 100%;
      border-radius: 8px;
      height: 33px;
      color: #d9d6d6;
      text-align: center;
      padding-top: 4px;
      margin-left: 15%;
      min-width: max-content;
      /* margin-top: 10px; */
  }
  /* .formstyling{
      padding: 10px 40px;
      padding-right: 0px;
  } */
  
  .inputField{
      border-radius: 8px;
  }
  select option { 
      line-height: 20px;
  }

  .select2-container--default .select2-selection--single {
border-radius: 0 !important;
border: none !important;
}

.select2-container--default .select2-selection--multiple {
border-radius: 0 !important;
border: none !important;
}

.select2-dropdown {
border-radius: 0 !important;
border: none !important;

}

  .select2-container--open {
  z-index: 9999 !important; 
}

  .select2-results__option:hover {
background-color: #525252 !important;
color: white !important; 
}
.select2-results__option {
background-color: black !important;
color: white !important; 
}

.select2-container--default .select2-results__option--selected {
  background-color: green !important;
}
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
  background-color: #525252 !important;
  color: white;
}
  .select2-selection__arrow{
      color: white;
  }
  .select2-container--default .select2-selection--single {
  border: none;
}

.select2-dropdown--below, .select2-search--dropdown, .select2-search__field{
      background-color: rgb(19, 23, 26) !important;
      color: white !important;
  }

  .label-shine {
position: absolute;
top: 5%;
left: 50%;
transform: translate(-50%, -50%);
padding: 12px 48px;
color: white; 
background: linear-gradient(to right, rgb(202, 196, 186), #f3f2f1, #696867);
background-position: 0;
background-size: 200% auto;
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
animation: shine 3s infinite linear;
animation-fill-mode: forwards;
font-weight: 600;
font-size: 20px;
text-decoration: none;
white-space: nowrap;
font-family: "Poppins", sans-serif;
}

@-moz-keyframes shine {
0% {
  background-position: 0;
}
60% {
  background-position: 180px;
}
100% {
  background-position: 180px;
}
}
@-webkit-keyframes shine {
0% {
  background-position: 0;
}
60% {
  background-position: 180px;
}
100% {
  background-position: 180px;
}
}
@-o-keyframes shine {
0% {
  background-position: 0;
}
60% {
  background-position: 180px;
}
100% {
  background-position: 180px;
}
}
@keyframes shine {
0% {
  background-position: 0;
}
60% {
  background-position: 180px;
}
100% {
  background-position: 180px;
}
}

.coin_name_input1_singlecoin{
background-color: #212121;
max-width: 176px;
height: 34px;
padding: 10px;
border-radius: 11px;
margin-left: 9px;
padding-top: 5px;
}

.coin_name_input1, .trigger_details {
background-color: #212121;
/* max-width: 176px; */
height: 34px;
padding: 10px;
border-radius: 11px;
margin-left: 17%;
padding-top: 5px;
width: 60%;
}

.coin_name_input1:focus, .trigger_details:focus {
color: rgb(146, 160, 160);
background-color: #212121;
outline-color: rgb(146, 160, 160);
box-shadow: -3px -3px 15px rgb(146, 160, 160);;
transition: .1s;
transition-property: box-shadow;
}

.hr-with-text {
  margin-left: 10px;
  margin-right: 10px;
display: flex;
align-items: center;
text-align: center;
width: 190%;
/* margin: 6px 0; */
}

.hr-with-text hr {
flex: 1;
border: none;
border-top: 1px solid #ccc;
}

.hr-with-text span {
margin-left: 10px;
margin-right: 10px;
padding: 0 5px;
color: #898888;
font-weight: bold;
font-size: 14px;
white-space: nowrap;
}

.animated-dotted-line {
width: 85%;
height: 1px;
background-image: radial-gradient(#e1e1e1 2px, transparent 2px);
background-size: 10px 1px;
background-repeat: repeat-x;
animation: moveDots 2s linear infinite;
position: absolute;
margin-top: 74px;
margin-left: 11px;
}

@keyframes moveDots {
0% {
  background-position: 0 0;
}
100% {
  background-position: 10px 0;
}
}

/* #coin_groups + .select2-container {
  width: 60% !important; 
} */

/* #Chain1NameDropDown + .select2-container {
  width: 178px !important;
} */


.cssbuttons-io {
position: relative;
font-family: inherit;
font-weight: 500;
font-size: 18px;
letter-spacing: 0.05em;
border-radius: 0.6em;
cursor: pointer;
border: none;
background: linear-gradient(to right, #6e6e6e, #000000); 
color: ghostwhite;
overflow: hidden;
/* top: 50px;
left: 730px; */
}

.cssbuttons-io span {
position: relative;
z-index: 10;
transition: color 0.4s;
display: inline-flex;
align-items: center;
padding: 0.5em 0.5em 0.5em 0.5em;
font-size: 15px;
}

.cssbuttons-io::before,
.cssbuttons-io::after {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 0;
}

.cssbuttons-io::before {
content: "";
background: #000;
width: 120%;
left: -10%;
transform: skew(30deg);
transition: transform 0.4s cubic-bezier(0.3, 1, 0.8, 1);
}

.cssbuttons-io:hover::before {
transform: translate3d(100%, 0, 0);
}

.cssbuttons-io:active {
transform: scale(0.95);
}

.select2-container--default .select2-selection--single {
background-color: rgb(13, 13, 13) !important;
height: 34px;
border-radius: 8px !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
color: white !important;
}

.select2-container--default .select2-results > .select2-results__options {
background-color: rgb(13, 13, 13);
}

input[type="checkbox"] {
      cursor: pointer;
      appearance: none;
      height: 15px;
      width: 10px;
      min-width: 16px;
      /* background: #ffffff; */
      background-color: red;
      transition: all 250ms linear;
      box-shadow: inset 0 0 0 1px #ffffff;
      border: 1px solid #6a6a6a;
  }

  input[type="checkbox"] {
      border-radius: none;
  }

  input[type="checkbox"]:checked {
      border-color: rgb(14, 194, 149);
      background-color: rgb(0, 147, 110);
  }

  .tooltip2 {
      position: relative;
      display: inline-block;
  }

  .tooltip2 .tooltip2text {
      visibility: hidden;
      width: 120px;
      background-color: black;
      color: #fff;
      text-align: center;
      border-radius: 6px;
      padding: 5px 0;

      position: absolute;
      z-index: 1;
  }

  .tooltip2:hover .tooltip2text {
      visibility: visible;
  }

  .neon-checkbox {
--primary: #00ffaa;
--primary-dark: #00cc88;
--primary-light: #88ffdd;
--size: 30px;
position: relative;
width: var(--size);
height: var(--size);
cursor: pointer;
-webkit-tap-highlight-color: transparent;
}

.neon-checkbox input {
display: none;
}

.neon-checkbox__frame {
position: relative;
width: 75%;
height: 75%;
}

.neon-checkbox__box {
position: absolute;
inset: 0;
background: rgba(0, 0, 0, 0.8);
border-radius: 4px;
border: 2px solid var(--primary-dark);
transition: all 0.4s ease;
}

.neon-checkbox__check-container {
position: absolute;
inset: 2px;
display: flex;
align-items: center;
justify-content: center;
}

.neon-checkbox__check {
width: 80%;
height: 80%;
fill: none;
stroke: var(--primary);
stroke-width: 3;
stroke-linecap: round;
stroke-linejoin: round;
stroke-dasharray: 40;
stroke-dashoffset: 40;
transform-origin: center;
transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.neon-checkbox__glow {
position: absolute;
inset: -2px;
border-radius: 6px;
background: var(--primary);
opacity: 0;
filter: blur(8px);
transform: scale(1.2);
transition: all 0.4s ease;
}

.neon-checkbox__borders {
position: absolute;
inset: 0;
border-radius: 4px;
overflow: hidden;
}

.neon-checkbox__borders span {
position: absolute;
width: 40px;
height: 1px;
background: var(--primary);
opacity: 0;
transition: opacity 0.4s ease;
}

.neon-checkbox__borders span:nth-child(1) {
top: 0;
left: -100%;
animation: borderFlow1 2s linear infinite;
}

.neon-checkbox__borders span:nth-child(2) {
top: -100%;
right: 0;
width: 1px;
height: 40px;
animation: borderFlow2 2s linear infinite;
}

.neon-checkbox__borders span:nth-child(3) {
bottom: 0;
right: -100%;
animation: borderFlow3 2s linear infinite;
}

.neon-checkbox__borders span:nth-child(4) {
bottom: -100%;
left: 0;
width: 1px;
height: 40px;
animation: borderFlow4 2s linear infinite;
}

.neon-checkbox__particles span {
position: absolute;
width: 4px;
height: 4px;
background: var(--primary);
border-radius: 50%;
opacity: 0;
pointer-events: none;
top: 50%;
left: 50%;
box-shadow: 0 0 6px var(--primary);
}

.neon-checkbox__rings {
position: absolute;
inset: -20px;
pointer-events: none;
}

.neon-checkbox__rings .ring {
position: absolute;
inset: 0;
border-radius: 50%;
border: 1px solid var(--primary);
opacity: 0;
transform: scale(0);
}

.neon-checkbox__sparks span {
position: absolute;
width: 20px;
height: 1px;
background: linear-gradient(90deg, var(--primary), transparent);
opacity: 0;
}

/* Hover Effects */
.neon-checkbox:hover .neon-checkbox__box {
border-color: var(--primary);
transform: scale(1.05);
}

/* Checked State */
.neon-checkbox input:checked ~ .neon-checkbox__frame .neon-checkbox__box {
border-color: var(--primary);
background: rgba(0, 255, 170, 0.1);
}

.neon-checkbox input:checked ~ .neon-checkbox__frame .neon-checkbox__check {
stroke-dashoffset: 0;
transform: scale(1.1);
}

.neon-checkbox input:checked ~ .neon-checkbox__frame .neon-checkbox__glow {
opacity: 0.2;
}

.neon-checkbox
input:checked
~ .neon-checkbox__frame
.neon-checkbox__borders
span {
opacity: 1;
}

.neon-checkbox
input:checked
~ .neon-checkbox__frame
.neon-checkbox__particles
span {
animation: particleExplosion 0.6s ease-out forwards;
}

.neon-checkbox
input:checked
~ .neon-checkbox__frame
.neon-checkbox__rings
.ring {
animation: ringPulse 0.6s ease-out forwards;
}

.neon-checkbox
input:checked
~ .neon-checkbox__frame
.neon-checkbox__sparks
span {
animation: sparkFlash 0.6s ease-out forwards;
}

@keyframes borderFlow1 {
0% {
  transform: translateX(0);
}
100% {
  transform: translateX(200%);
}
}

@keyframes borderFlow2 {
0% {
  transform: translateY(0);
}
100% {
  transform: translateY(200%);
}
}

@keyframes borderFlow3 {
0% {
  transform: translateX(0);
}
100% {
  transform: translateX(-200%);
}
}

@keyframes borderFlow4 {
0% {
  transform: translateY(0);
}
100% {
  transform: translateY(-200%);
}
}

@keyframes particleExplosion {
0% {
  transform: translate(-50%, -50%) scale(1);
  opacity: 0;
}
20% {
  opacity: 1;
}
100% {
  transform: translate(
      calc(-50% + var(--x, 20px)),
      calc(-50% + var(--y, 20px))
    )
    scale(0);
  opacity: 0;
}
}

@keyframes ringPulse {
0% {
  transform: scale(0);
  opacity: 1;
}
100% {
  transform: scale(2);
  opacity: 0;
}
}

@keyframes sparkFlash {
0% {
  transform: rotate(var(--r, 0deg)) translateX(0) scale(1);
  opacity: 1;
}
100% {
  transform: rotate(var(--r, 0deg)) translateX(30px) scale(0);
  opacity: 0;
}
}

/* Particle Positions */
.neon-checkbox__particles span:nth-child(1) {
--x: 25px;
--y: -25px;
}
.neon-checkbox__particles span:nth-child(2) {
--x: -25px;
--y: -25px;
}
.neon-checkbox__particles span:nth-child(3) {
--x: 25px;
--y: 25px;
}
.neon-checkbox__particles span:nth-child(4) {
--x: -25px;
--y: 25px;
}
.neon-checkbox__particles span:nth-child(5) {
--x: 35px;
--y: 0px;
}
.neon-checkbox__particles span:nth-child(6) {
--x: -35px;
--y: 0px;
}
.neon-checkbox__particles span:nth-child(7) {
--x: 0px;
--y: 35px;
}
.neon-checkbox__particles span:nth-child(8) {
--x: 0px;
--y: -35px;
}
.neon-checkbox__particles span:nth-child(9) {
--x: 20px;
--y: -30px;
}
.neon-checkbox__particles span:nth-child(10) {
--x: -20px;
--y: 30px;
}
.neon-checkbox__particles span:nth-child(11) {
--x: 30px;
--y: 20px;
}
.neon-checkbox__particles span:nth-child(12) {
--x: -30px;
--y: -20px;
}

/* Spark Rotations */
.neon-checkbox__sparks span:nth-child(1) {
--r: 0deg;
top: 50%;
left: 50%;
}
.neon-checkbox__sparks span:nth-child(2) {
--r: 90deg;
top: 50%;
left: 50%;
}
.neon-checkbox__sparks span:nth-child(3) {
--r: 180deg;
top: 50%;
left: 50%;
}
.neon-checkbox__sparks span:nth-child(4) {
--r: 270deg;
top: 50%;
left: 50%;
}

/* Ring Delays */
.neon-checkbox__rings .ring:nth-child(1) {
animation-delay: 0s;
}
.neon-checkbox__rings .ring:nth-child(2) {
animation-delay: 0.1s;
}
.neon-checkbox__rings .ring:nth-child(3) {
animation-delay: 0.2s;
}

.recheck_button {
          /* border-radius: 12px; */
          border: none;
          /* padding: 2px 15px; */
          margin-top: 4px;
          background-color: transparent;
          color: rgb(147, 147, 147);
          font-weight: bolder;
          font-size: 20px;
      }

      .recheck_button:hover {
          /* background-color: rgb(159, 176, 198); */
          color: rgb(213, 213, 213);
      }

      .loader2 {
      border: 3px solid #f3f3f3;
      border-radius: 50%;
      border-top: 3px solid #757575;
      width: 20px;
      height: 20px;
      /* margin-right: 224px; */
      /* margin-top: -31px; */
      -webkit-animation: spin 2s linear infinite;
      animation: spin 2s linear infinite;
  }

  .chain_loader {
      /* margin-right: 0px !important;
      margin-left: 724px !important; */
  }

  /* From Uiverse.io by Li-Deheng */ 
.loader {
display: flex;
justify-content: center;
align-items: center;
--color: hsl(0, 0%, 87%);
--animation: 2s ease-in-out infinite;
}

.loader .circle {
display: flex;
align-items: center;
justify-content: center;
position: relative;
width: 7px;
height: 7px;
border: solid 2px var(--color);
border-radius: 50%;
margin: 0 10px;
background-color: transparent;
animation: circle-keys var(--animation);
}

.loader .circle .dot {
position: absolute;
transform: translate(-50%, -50%);
width: 10px;
height: 10px;
border-radius: 50%;
background-color: var(--color);
animation: dot-keys var(--animation);
}

.loader .circle .outline {
position: absolute;
transform: translate(-50%, -50%);
width: 10px;
height: 10px;
border-radius: 50%;
animation: outline-keys var(--animation);
}

.circle:nth-child(2) {
animation-delay: 0.3s;
}

.circle:nth-child(3) {
animation-delay: 0.6s;
}

.circle:nth-child(4) {
animation-delay: 0.9s;
}

.circle:nth-child(5) {
animation-delay: 1.2s;
}

.circle:nth-child(2) .dot {
animation-delay: 0.3s;
}

.circle:nth-child(3) .dot {
animation-delay: 0.6s;
}

.circle:nth-child(4) .dot {
animation-delay: 0.9s;
}

.circle:nth-child(5) .dot {
animation-delay: 1.2s;
}

.circle:nth-child(1) .outline {
animation-delay: 0.9s;
}

.circle:nth-child(2) .outline {
animation-delay: 1.2s;
}

.circle:nth-child(3) .outline {
animation-delay: 1.5s;
}

.circle:nth-child(4) .outline {
animation-delay: 1.8s;
}

.circle:nth-child(5) .outline {
animation-delay: 2.1s;
}

@keyframes circle-keys {
0% {
  transform: scale(1);
  opacity: 1;
}

50% {
  transform: scale(1.5);
  opacity: 0.5;
}

100% {
  transform: scale(1);
  opacity: 1;
}
}

@keyframes dot-keys {
0% {
  transform: scale(1);
}

50% {
  transform: scale(0);
}

100% {
  transform: scale(1);
}
}

@keyframes outline-keys {
0% {
  transform: scale(0);
  outline: solid 20px var(--color);
  outline-offset: 0;
  opacity: 1;
}

100% {
  transform: scale(1);
  outline: solid 0 transparent;
  outline-offset: 20px;
  opacity: 0;
}
}


.neon-checkbox__frame,
.neon-checkbox__box {
  /* border-radius: 26px !important;  */
}

.add_group_form {
padding: 30px;
border-radius: 20px;
text-align: center;
max-width: 400px;
box-shadow: 2px 2px 10px #c5c5c5,
-1.5px -1.5px 10px #ffffff;
background-color: black;
  margin-left: 42%;
margin-top: 280px;
position: absolute;
z-index: 3000;
}

.add_group_form h2{
margin-bottom: 30px;
color: white;
margin-top: 0;
font-size: 24px;
}

.add_group_form label {
display: block;
margin-bottom: 10px;
font-size: 15px;
text-align: left;
color: white;
}

.add_group_form input[type="text"],
.add_group_form .submit-button{
width: 100%;
padding: 15px;
border-radius: 12px;
border: none;
box-sizing: border-box;
font-size: 16px;
background-color: rgba(255,255,255,0.07);
color: white;
}

.add_group_form .submit-button{
background-color:#525252;
color: white;
cursor: pointer;
transition: background-color 0.3s ease;
font-size:17px;
}

.add_group_form .submit-button:hover {
background-color: #a7a6a2;
transition: all 0.7s ease-in-out;
}


.add_socket_topic {
padding: 30px;
border-radius: 20px;
text-align: center;
/* max-width: 400px; */
box-shadow: 2px 2px 10px #c5c5c5,
-1.5px -1.5px 10px #ffffff;
background-color: black;
  margin-left: 36%;
margin-top: 280px;
position: absolute;
z-index: 3000;
width: 25% !important;
}

.add_socket_topic h2{
margin-bottom: 30px;
color: white;
margin-top: 0;
font-size: 24px;
}

.add_socket_topic label {
display: block;
margin-bottom: 10px;
font-size: 15px;
text-align: left;
color: white;
}

.add_socket_topic input[type="text"],
.add_socket_topic .submit-button{
width: 100%;
padding: 15px;
border-radius: 12px;
border: none;
box-sizing: border-box;
font-size: 16px;
background-color: rgba(255,255,255,0.07);
color: white;
}

.add_socket_topic .submit-button{
background-color:#525252;
color: white;
cursor: pointer;
transition: background-color 0.3s ease;
font-size:17px;
}

.add_socket_topic .submit-button:hover {
background-color: #a7a6a2;
transition: all 0.7s ease-in-out;
}

.overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 5000;
}

/* input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
-webkit-box-shadow: 0 0 0px 1000px rgb(13, 13, 13) inset !important;
-webkit-text-fill-color: white !important;
background-color: rgb(13, 13, 13) !important;
} */

/* #editForm {
display: flex;
justify-content: center;
align-items: center;
width: 92.5%;
margin: 3px;
overflow: visible;
}

#editFormModal {
max-width: 2045px; 
max-height: 1065px;
overflow: auto; 
} */

.name_row{
margin-top: 10%;
}

/* #inverted_and_Ws_div1{
margin-left: 600px !important;
}
#inverted_and_Ws_div2{
margin-left: 600px !important;
} */
/* #custom_rpc1{
right: 79.6%
} */
/* .tooltip2{
margin-left: 608px !important;
} */

.select2-hidden-accessible{
position: static !important;
margin-left: 15% !important;
}

/* @media (max-width: 768px) {
#myform {
  flex-direction: column !important;
}

.select2-hidden-accessible{
position: static !important;
margin-left: 30% !important;
}
#Chain1Token{
margin-left: 34% !important;
}
#Chain2Token{
margin-left: 34% !important;
}
#triggerPercentage1, #triggerPercentage2{
margin-left: 34% !important;
}

} */

.single_coin_div {
  border: 0 !important;
  clip: rect(0 0 0 0) !important;
  -webkit-clip-path: inset(50%) !important;
  clip-path: inset(50%) !important;
  height: 1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  width: 1px !important;
  white-space: nowrap !important;
}