#dustRoot {
  opacity: .8 !important;
  position: fixed;
  transition: opacity .3s linear;
  z-index: -1;
}

#dustRoot.is-active {
opacity:1;
}

.button1/*,.t-submit*/ {
  background-clip:padding-box,border-box;
  background-color:initial;
  background-image:linear-gradient(180deg,#341946,#190a25),linear-gradient(90deg,#C4E2BD,#F5FFE5,#FFDC01,#F5FFE5,#C4E2BD);
  background-position:0;
  background-size:200% 100%;
  border:.5px solid #0000;
  border-radius:30px;
  box-shadow:0 0 4px 0 #d072f180,inset 0 0 0 2px #190a25;
  color:#fff;
  cursor:pointer;
  display:block;
  /*font-size:1rem;*/
  /*font-weight:400;*/
  /*line-height:18px;*/
  padding:20px 30px;
  position:relative;
  text-decoration:none;
  text-transform:uppercase;
  transition:background-position .3s linear;
  width:-webkit-max-content;
  width:max-content;
  z-index:0;
}

.button1:after, /*.t-submit:after,*/ .button1:before/*, .t-submit:before*/ {
  background:inherit;
  border:inherit;
  border-radius:inherit;
  box-shadow:inset 0 0 0 2px #190a25;
  content:"";
  display:block;
  height:calc(100% - var(--gap) * 3);
  left:var(--gap);
  position:absolute;
  top:var(--gap);
  width:calc(100% - var(--gap) * 3);
  z-index:-1;
}

.button1:before/*, .t-submit:before*/ {
  --gap:2px;
  border-radius:28px
}

.button1:after/*, .t-submit:after*/ {
  --gap:4px;
  border-radius:26.5px;
  left:calc(var(--gap) + .5px);
  top:calc(var(--gap) + .5px);
}

.button1:focus, /*.t-submit:focus,*/.button1:hover/*, .t-submit:hover*/ {
  background-position:100%;
}

.circle {
  display: block;
  position: absolute;
  height: 500px;
  width: 500px;
  border-radius: 50%;
  z-index: 4;
}
.circle.o {
  background-color: #190A25;
  border-right: 1px solid rgba(255, 220, 1, 0.05);
  box-shadow: inset -35px -5px 0px 0px rgba(91, 202, 255, 0.05);
}
.circle.h {
  z-index: 10;
  background-color: transparent;
  border: 1px solid rgba(255, 220, 1, 0.15);
  animation: spinc 12.5s linear infinite forwards;
}
.circle.v {
  z-index: 10;
  background-color: transparent;
  border: 1px solid rgba(255, 220, 1, 0.15);
  animation: spinb 12.5s linear infinite forwards;
}

.center {
  display: block;
  position: absolute;
  height: 450px;
  width: 450px;
  z-index: 4;
}

.orbit {
  display: block;
  position: absolute;
  height: 170px;
  width: 170px;
  top: -10px;
  left: -10px;
  border-radius: 50%;
  z-index: 22;
}
.orbit:first-of-type {
  box-shadow: 0px 2px 0px 1px #C4E2BD;
  transform: rotateX(70deg);
  animation: spinX 12.5s linear infinite forwards;
}
.orbit:last-of-type {
  box-shadow: 2px 0px 0px 1px #C4E2BD;
  transform: rotateY(70deg);
  animation: spinY 12.5s linear infinite alternate;
}

.dot {
  display: block;
  position: absolute;
  top: calc(50% - 3px);
  left: calc(50% - 3px);
  width: 6px;
  height: 6px;
  background-color: #C4E2BD;
  border-radius: 50%;
  will-change: transform;
  transform: translate3d(0, 0, 0);
}
.dot:nth-of-type(1) {
  animation: 5s -1.25s orbita ease-in-out infinite;
}
.dot:nth-of-type(2) {
  animation: 5s -1.25s orbitb ease-in-out infinite;
}
.dot:nth-of-type(3) {
  animation: 5s -1.25s orbitc ease-in-out infinite;
}
.dot:nth-of-type(4) {
  animation: 5s -1.25s orbitd ease-in-out infinite;
}

@keyframes orbita {
  0% {
    z-index: 4;
    transform: translate(-100px, -100px) scale(1.5);
  }
  50% {
    z-index: 4;
    transform: translate(100px, 100px) scale(0.5);
  }
  100% {
    z-index: 9;
    transform: translate(-100px, -100px) scale(1.5);
  }
}
@keyframes orbitb {
  0% {
    z-index: 4;
    transform: translate(-100px, 100px) scale(1.5);
  }
  50% {
    z-index: 4;
    transform: translate(100px, -100px) scale(0.5);
  }
  100% {
    z-index: 9;
    transform: translate(-100px, 100px) scale(1.5);
  }
}
@keyframes orbitc {
  0% {
    z-index: 4;
    transform: translate(100px, 100px) scale(1.5);
  }
  50% {
    z-index: 4;
    transform: translate(-100px, -100px) scale(0.5);
  }
  100% {
    z-index: 9;
    transform: translate(100px, 100px) scale(1.5);
  }
}
@keyframes orbitd {
  0% {
    z-index: 4;
    transform: translate(100px, -100px) scale(1.5);
  }
  50% {
    z-index: 4;
    transform: translate(-100px, 100px) scale(0.5);
  }
  100% {
    z-index: 9;
    transform: translate(100px, -100px) scale(1.5);
  }
}
@keyframes spinb {
  0% {
    transform: rotateY(0deg);
  }
  25% {
    transform: rotateY(90deg);
  }
  50% {
    transform: rotateY(180deg);
  }
  75% {
    transform: rotateY(270deg);
  }
  100% {
    transform: rotateY(359deg);
  }
}
@keyframes spinc {
  0% {
    transform: rotateX(0deg);
  }
  25% {
    transform: rotateX(90deg);
  }
  50% {
    transform: rotateX(180deg);
  }
  75% {
    transform: rotateX(270deg);
  }
  100% {
    transform: rotateX(359deg);
  }
}
@keyframes spinX {
  0% {
    transform: rotateX(0deg);
    box-shadow: 0px 2px 0px 1px #5bcaff;
  }
  25% {
    transform: rotateX(90deg);
    box-shadow: 0px 2px 0px 1px #5bcaff;
  }
  50% {
    transform: rotateX(180deg);
    box-shadow: 0px -2px 0px 1px #5bcaff;
  }
  75% {
    transform: rotateX(270deg);
    box-shadow: 0px -2px 0px 1px #5bcaff;
  }
  100% {
    transform: rotateX(359deg);
    box-shadow: 0px 2px 0px 1px #5bcaff;
  }
}
@keyframes spinY {
  0% {
    transform: rotateY(0deg);
    box-shadow: 2px 0px 0px 1px #5bcaff;
  }
  25% {
    transform: rotateY(90deg);
    box-shadow: 2px 0px 0px 1px #5bcaff;
  }
  50% {
    transform: rotateY(180deg);
    box-shadow: -2px 0px 0px 1px #5bcaff;
  }
  75% {
    transform: rotateY(270deg);
    box-shadow: -2px 0px 0px 1px #5bcaff;
  }
  100% {
    transform: rotateY(359deg);
    box-shadow: 0px 2px 0px 1px #5bcaff;
  }
}