body,
html {
  overflow-x: hidden;
  background-color: #000 !important;
}

* {
  box-sizing: border-box !important;
}

/* .navbar{
    transition: background-color 0.4s ease-in-out;
  }
  .navbar.scrolled{
    background-color: #191a1e !important;
  } */
.navitem {
  background-color: none !important;
  border-radius: 15px !important;
  padding: 5px 0px;
}

.selected-tab {
	background-color: white;
	color: black !important;
}

@keyframes gradientShift {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
  }
  
  .animate-gradient-shift {
  background-size: 200% 200%;
  animation: gradientShift 15s ease infinite;
  }
  
  /* Floating animation for header */
  @keyframes float {
  0% { transform: translateY(0px); }
  50% { transform: translateY(-10px); }
  100% { transform: translateY(0px); }
  }
  
  .animate-float {
  animation: float 6s ease-in-out infinite;
  }
  
  /* Glowing effect for cards */
  .group:hover .glow {
  box-shadow: 0 0 15px rgba(74, 222, 128, 0.6);
  }



.jindovideosize {
  width: 560px;
  height: 315px;
  border-radius: 15px;
  border: 4px solid #0ca441;
}

.googleBar {
  position: absolute;
  top: 140px;
  left: 36px;
  background-color: #0f152e;
  padding: 10px;
  border: 3px solid #1d2959;
  border-radius: 15px;
}

.myp {
  margin: 0px !important;
  padding: 0px !important;
  font-size: 4.2em;
  /* letter-spacing: 10px; */
}


@keyframes floatAnimation1 {
  0% {
    transform: scale(1);
  }

  100% {
    transform: scale(0.9);
    /* Change the value to adjust the floating distance */
  }
}

.sec2img {
  transform: scale(0.7);
  animation: floatAnimation1 2s ease-in-out infinite alternate;
}

@keyframes floatAnimation1 {
  0% {
    transform: scale(1);
  }

  100% {
    transform: scale(0.9);
    /* Change the value to adjust the floating distance */
  }
}

.sec1img {
  animation: floatAnimation1 2s ease-in-out infinite alternate;
}

@media (max-width: 1000px) {
  .sec1img {
    height: 100px !important;
    width: auto !important;
  }

  .sec2img {
    height: 300px !important;
    width: 300px !important;
  }
}

.myper {
  margin: 0px !important;
  padding: 0px !important;
  font-size: 2.5em;
  letter-spacing: 0px;
  /* -webkit-text-stroke: 1px #0276B4; */
  /* text-shadow: 2px 3px 4px #000000; */
}

.navbar-toggler-icon {
  color: white !important;
}

.fas:hover {
  color: rgb(255, 255, 255) !important;
}

.gradient-text {
  background-image: linear-gradient(45deg, #193b60, #193b60, #9cc8d9);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  text-align: center;
  margin: 0;
}

.btn1 {
  background-image: linear-gradient(45deg, #30304e, #27283c) !important;
  width: 190px;
  height: 55px;
  border: none !important;
  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
  border-radius: 20px !important;
  vertical-align: middle;
}

.btn1:hover {
  background-image: linear-gradient(45deg, #30304eca, #27283ccf) !important;
}

.item {
  transition: transform 330ms ease-in-out;
}

/* .item:hover {
  transform: translateY(-5px);
  font-weight: bold;
} */
.nav-item:hover {
  transform: translateY(-7px) !important;
}

/* .item:hover {
  color: #F9F4B0 !important;
} */

@keyframes rotate {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

.grad-text {
  background-image: linear-gradient(to right, #ff1b6b, #45caff);
  background-clip: text;
  text-fill-color: transparent;
}

.rotateImg {
  animation: rotate 10s linear infinite;
  /* Adjust the duration and timing function as needed */
  margin-left: 50px;
}

.chartBox {
  height: 420px !important;
  width: 420px !important;
}

.n1 {
  margin-left: 280px !important;
  margin-top: 3px !important;
}

.section1 {
  background-image: url('./images/bg1.png');
  padding-top: 160px !important;
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
background-color: #070B15;
  position: relative;
}

.section1::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.5);
} 

/* .section12 {
  padding-top: 60px;
  padding-bottom: 60px;
  background: url("./images/aboutback.jpg");
  background-size: cover;
  background-position: center;
}



.ether50t {
  border-radius: 5px !important;
  border: 5px solid #0ca441 !important;
  padding: 7px 10px !important;
  font-size: 26px;
  background-color: #0eaa06 !important;
  text-align: center;
  transition: transform 0.5s ease;
}

.foser {
  font-size: 21px;
}

.ether50t:hover {
  transform: scale(1.1);
}

.section6 {
  padding-top: 100px;
  background-color: #10131e;
}

.section8 {
  background-image: linear-gradient(to bottom,
      #19202d,
      #040404,
      #040404) !important;
  padding-bottom: 100px;
}

.section9 {
  background-image: linear-gradient(to bottom,
      #040404,
      #040404,
      #19202d) !important;
  padding-top: 100px;
}

.faqaccord {
  background: #19202db9;
  border: 2px solid #9bf8f4;
  border-radius: 15px !important;
  transform: translate3d(0, 0, 0);
}

.section3 {
  padding-top: 100px;
  padding-bottom: 100px;
}

/* .section11 svg {
  Position the SVG absolutely to cover the entire section
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
} */

.section11 {
  position: relative;
  /* background-image: url('./images/7.jpg'); */
  background-size: cover;
  background-color: #d7caa7;
  background-position: center;
  /* background-color: #000; */
  padding-top: 100px;
  padding-bottom: 100px;
  /* height: 100vh; */
}

.contToke>h1 {
  font-size: 60px;
  font-family: "Inknut Antiqua";
}

.contToke>p {
  font-size: 30px;
  margin-top: 70px;
  font-family: "Inknut Antiqua";
  line-height: 70px;
}

#imgWood {
  top: -10px;
  left: 900px;
  position: absolute;
  height: 680px;
  width: 500px;
}

.section3 {
  background-color: #10131e;

  padding-top: 100px;
  padding-bottom: 100px;
}

/* .section4 {
  margin: 0px;
  background-image: url("images/background-image/out-1-2.png");

  
  height: 100%;


  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
} */

.sec4row {
  padding-top: 20px;
  padding-bottom: 100px;
  height: 100%;
}

.whitebtn {
  background-color: #0e3224 !important;
  color: #1df9ab !important;
  border: none;
  border-radius: 45px !important;
  /* height: 40px;
    width: 150px; */
  padding: 10px 30px;
  transition: transform 330ms ease-in-out;
  margin-top: 30px !important;
  margin-left: -30px;
}

.whitebtn:hover {
  background-color: #1df9ab !important;
  opacity: 1;
  color: #0e3224 !important;
  transform: translateY(-5px);
}

.section5 {}

.sec5row {
  padding-top: 100px;
  padding-bottom: 100px;
  height: 100%;
}

.sec5cont {
  padding-top: 200px;
  padding-bottom: 100px;
}

.box {
  height: 450px;
  width: 1200px;

  /* background-color: #241c14; */
  /* background: radial-gradient(circle, rgba(36,28,20,1) 0%, rgba(18,11,5,1) 0%, rgba(36,28,20,1) 64%); */
  background: linear-gradient(-40deg, #6f7bf7 18%, #9bf8f4 100%);

  margin: auto;
  border: 2px solid white;
  border-radius: 10px;
}

.childBox {
  margin: auto;

  width: 900px;
  color: white;
}

.p-card {
  font-size: 13px;
}

.contsec6 {
  padding-top: 50px;
  padding-bottom: 100px;
}

.tokencard {
  padding: 20px 60px !important;
  text-align: -webkit-center !important;
}

.section4 {
  padding-top: 50px;
  padding-bottom: 20px;
}

.section13 {
  position: relative;
  background-color: #000;
  /* background-image: url('./images/back.png');
  background-position: center;
  background-size: cover;
  background-attachment: fixed; */
}

/* .section13::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5); 
  z-index: 1;
}
.section13 > * {
  position: relative;
  z-index: 2;
} */

.faqaccord {
  background: #ffffff;
  /* border: 3px solid #19202D; */
  border: 5px solid black;
  border-radius: 70px !important;
}

.dfd {
  position: relative;
  height: 70%;
  width: 70%;
  border-radius: 25px;
  border: 3px solid black;
  bottom: 150px;
  background-color: #ffffff !important;
  z-index: 10;
  height: 300px !important;
  transform: translateX(-20%);
  animation: floatAnimation 1.5s ease-in-out infinite alternate;
}

.dgd1 {
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: center;
}

@keyframes floatAnimation {
  0% {
    transform: translateY(0);
  }

  100% {
    transform: translateY(20px);
    /* Change the value to adjust the floating distance */
  }
}

@media (max-width: 1000px) {
  .dfd {
    position: relative;
    height: 70%;
    width: 80%;
    border-radius: 25px;
    border: 3px solid black;
    bottom: 70px;
    background-color: #ffffff !important;
    z-index: 10;
    height: 300px !important;
  }

  .mtt1 {
    margin-top: 100px !important;
  }
}

.body-image {
  /* background-image: linear-gradient(80deg, rgb(0, 0, 0), rgb(0, 0, 0), #e0a400); */

  background-color: black;
}

.aboutpadder {
  color: white;
}

/* .progress-fill {
  height: 20px;
  width: 40%;
  background-color: #22cfcf;
  border-radius: 10px;
  animation: fill 2s ease-in-out;
} */

.size-change {
  color: rgb(8, 8, 8);
  margin-top: 15px;
}

.change-top {
  font-weight: 800;
  color: #e0a400;
}

/* 
.progress-fill-1 {
  height: 20px;
  width: 25%;
  background-color: #ffcd56;
  border-radius: 10px;
  animation: fill-1 2s ease-in-out;
}


.progress-fill-2 {
  height: 20px;
  width: 10%;
  background-color: #ff6384;
  border-radius: 10px;
  animation: fill-2 2s ease-in-out;
}


.progress-fill-3 {
  height: 20px;
  width: 10%;
  background-color: #059BFF;
  border-radius: 10px;
  animation: fill-3 2s ease-in-out;
}


.progress-fill-4 {

  height: 20px;
  width: 15%;
  background-color: #ff9f40;
  border-radius: 10px;
  animation: fill-3 2s ease-in-out;
}


.progress-fill-5 {
  height: 20px;
  width: 5%;
  background-color: #f37544;
  border-radius: 10px;
  animation: fill-3 2s ease-in-out;
}

.progress-fill-6 {
  height: 10px;
  width: 11%;
  background-color: #a8048c;
  border-radius: 10px;
  animation: fill-3 2s ease-in-out;
} */

.progress-bar {
  height: 20px;
  width: 80%;
  background-color: lightgrey;
  border-radius: 45px;
  overflow: hidden;
}

.progress-bar {
  height: 20px;
  width: 80%;
  background-color: lightgrey;
  border-radius: 45px;
  overflow: hidden;
}

.progress-bar {
  height: 20px;
  width: 80%;
  background-color: lightgrey;
  border-radius: 45px;
  overflow: hidden;
}

.progress-fill {
  height: 100%;
  width: 0;
  background-color: #22cfcf;
  border-radius: 10px;
  transition: width 2s ease-in-out;
}

.progress-fill-1 {
  height: 100%;
  width: 0;
  background-color: #ffcd56;
  border-radius: 10px;
  transition: width 2s ease-in-out;
}

.progress-fill-2 {
  height: 100%;
  width: 0;
  background-color: #ff6384;
  border-radius: 10px;
  transition: width 2s ease-in-out;
}

.progress-fill-3 {
  height: 100%;
  width: 0;
  background-color: #059bff;
  border-radius: 10px;
  transition: width 2s ease-in-out;
}

.progress-fill-4 {
  height: 100%;
  width: 0;
  background-color: #ff9f40;
  border-radius: 10px;
  transition: width 2s ease-in-out;
}

.progress-fill-5 {
  height: 100%;
  width: 0;
  background-color: #4bc0c0;
  border-radius: 10px;
  transition: width 2s ease-in-out;
}

.progress-fill-6 {
  height: 100%;
  width: 0;
  background-color: #9966ff;
  border-radius: 10px;
  transition: width 2s ease-in-out;
}

.progress-fill-7 {
  height: 100%;
  width: 0;
  background-color: #c9cbcf;
  border-radius: 10px;
  transition: width 2s ease-in-out;
}

/* Optional: Add hover effect */
.progress-fill:hover {
  width: 100%;
}

#donut-chart {
  width: 300px;
  height: 300px;
  margin: 0 auto;
}

.higher {
  height: 341px;
  width: 341px;
}

/* .x-box {
    width: 40vh;
    height: 40vh;
  } */

.x-box {
  width: 370px;
  height: 375px;
  border-radius: 50%;
  background-color: green;
  margin-right: 200px;
  background: repeating-conic-gradient(from 0deg,
      #ff264a 0deg calc(3.6deg * 50),
      #feec1e calc(3.6deg * 50) calc(3.6deg * 65),
      #12cbc4 calc(3.6deg * 65) calc(3.6deg * 75),
      #2569e7 calc(3.6deg * 75) calc(3.6deg * 83),
      #0ca441 calc(3.6deg * 83) calc(3.6deg * 90),
      #2629e2 calc(3.6deg * 90) calc(3.6deg * 97),
      #f37544 calc(3.6deg * 97) calc(3.6deg * 100));
}

.x-box-cont {
  font-size: 30px;
  padding-left: 50px;
}

.x-box-cont h1 {
  font-size: 30px;
  text-transform: uppercase;
}

.x-box-cont strong {
  display: block;
  margin-bottom: 15px;
}

.Yearly-timeline {
  font-family: "Poppins", sans-serif;
}

.Yearly-timeline:after {
  content: "";
  display: block;
  clear: both;
}

.Yearly-timeline .timeline {
  width: calc(50% + 17px);
  padding: 0 30px 30px 0;
  float: left;
  position: relative;
}

.Yearly-timeline .timeline:before,
.Yearly-timeline .timeline:after {
  content: "";
  height: 60px;
  width: 2px;
  border-left: 2px solid #e0a400ee;
  transform: rotate(-45deg);
  position: absolute;
  right: 30px;
  bottom: 0;
}

.Yearly-timeline .timeline:after {
  background-color: #fff;
  height: 20px;
  width: 20px;
  border: 6px solid #e0a400ee;
  border-radius: 50%;
  right: 0;
}

.Yearly-timeline .timeline-content {
  color: #555;
  background: #e0a400ee;
  text-align: center;
  min-height: 170px;
  padding: 30px 35px 35px;
  border-radius: 15px 15px 0 15px;
  display: block;
  position: relative;
  z-index: 1;
}

.Yearly-timeline .timeline-content:before {
  content: "";
  background-color: #fff;
  position: absolute;
  left: 17px;
  right: 17px;
  top: 17px;
  bottom: 17px;
  z-index: -1;
}

.Yearly-timeline .timeline-content:hover {
  text-decoration: none;
}

.Yearly-timeline .timeline-icon {
  color: #777;
  font-size: 35px;
}

.Yearly-timeline .title {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  margin: 0 0 8px;
}

.Yearly-timeline .description {
  color: #777;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.5px;
  line-height: 18px;
  margin: 0;
}

.Yearly-timeline .timeline:nth-child(even) {
  padding: 0 0 30px 30px;
  float: right;
}

.Yearly-timeline .timeline:nth-child(even):before {
  transform: rotate(45deg);
  right: auto;
  left: 30px;
}

.Yearly-timeline .timeline:nth-child(even):after {
  right: auto;
  left: 0;
}

.Yearly-timeline .timeline:nth-child(even) .timeline-content {
  border-radius: 15px 15px 15px 0;
}

.Yearly-timeline .timeline:nth-child(4n + 2):before,
.Yearly-timeline .timeline:nth-child(4n + 2):after {
  border-color: #e0a400ee;
}

.Yearly-timeline .timeline:nth-child(4n + 2) .timeline-content {
  background: #e0a400ee;
}

.Yearly-timeline .timeline:nth-child(4n + 3):before,
.Yearly-timeline .timeline:nth-child(4n + 3):after {
  border-color: #e0a400ee;
}

.Yearly-timeline .timeline:nth-child(4n + 3) .timeline-content {
  background: #e0a400ee;
}

.Yearly-timeline .timeline:nth-child(4n + 4):before,
.Yearly-timeline .timeline:nth-child(4n + 4):after {
  border-color: #e0a400ee;
}

.Yearly-timeline .timeline:nth-child(4n + 4) .timeline-content {
  background: #e0a400ee;
}

.imgbox {
  height: 350px;
  width: 900px;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: url("images/qqqq.png");
}

.claimsection {
  position: relative;
  background-image: url('./images/c0d3bfb4-aa82-4441-9dc0-ac0bd6962a76.webp');
  background-position: center;
  background-size: cover;
  background-attachment: fixed;
  z-index: 1;
}

.claimsection::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4); /* Dark overlay, adjust opacity here */
  z-index: -1;
}

/* Optional: Make sure content appears above overlay */
.claimsection > * {
  position: relative;
  z-index: 2;
}

.claimbtn:hover {
  transform: scale(1.1);
  border: 2px solid #00552e !important;
  background-color: #ffffff !important;
  /* background-image: linear-gradient(180deg, #ffffff 0%, #ffffff 50%, #ffffff 100%); */
  color: #000000 !important;
}

.claimbtnswitch {
  /* width: 450px; */
  border-radius: 15px !important;
  background-color: #0276B4 !important;
  border: 2px solid #0a4d71 !important;
  font-size: 30px !important;
  height: 70px;
  width: 200px;
  margin-top: 30px;
  margin-bottom: 10px;
  padding: 1px 20px !important;
  transition: transform 0.3s ease-in-out !important;
}

.frp1{
  font-size: 15px;
}

.nw1{
  width: 30%;
}

.claimbtn {
  width: 450px;
  border-radius: 15px !important;
  border: 2px solid #ffffff !important;
  background-color: #00552e !important;
  /* background-image: linear-gradient(180deg, #E7E497 0%, #5E3A1B 100%) !important; */
  color: #fff !important;
  font-size: 30px !important;
  height: 70px;
  margin-top: 30px;
  margin-bottom: 10px;
  transition: transform 0.3s ease-in-out, background-color 0.3s ease-in-out !important;
}

@media screen and (max-width: 767px) {
  .herow {
    padding-top: 500px !important;
  }

  .shb {
    width: 65% !important;
  }

  .section4 {
    margin: 0px;
    background-image: url("images/background-image/out-1-2.png");

    /* Full height */

    /* Center and scale the image nicely */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
  }

  .nav-link1 {
    margin-bottom: 5px;
  }

  .Yearly-timeline .timeline {
    width: 100%;
    padding: 30px 0 0 30px;
    margin: 0 0 20px;
  }

  .Yearly-timeline .timeline:before,
  .Yearly-timeline .timeline:nth-child(even):before {
    transform: rotate(-45deg);
    bottom: auto;
    top: 0;
    right: auto;
    left: 30px;
  }

  .Yearly-timeline .timeline:after,
  .Yearly-timeline .timeline:nth-child(even):after {
    bottom: auto;
    top: 0;
    right: auto;
    left: 0;
  }

  .Yearly-timeline .timeline-content,
  .Yearly-timeline .timeline:nth-child(even) .timeline-content {
    border-radius: 0 15px 15px 15px;
  }

  .htbimg1 {
    width: 189px !important;
  }
}

#set-post {
  position: relative;
}

.card-post {
  position: absolute;
}

/* .body-image2 {
    background-image: url(images/981.jpg);
    
    background-size: cover;
    width: 100vw;
     height: 100vh;
    
  } */
.image-container {
  position: relative;
}

.text-overlay {
  position: absolute;
  top: 50%;
  left: 31%;
  transform: translate(-50%, -50%);
  border-radius: 5px;
  text-align: center;
}

.text-overlaying {
  position: absolute;
  top: 10%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 5px;
  text-align: center;
}

.text-overlayed {
  position: absolute;
  top: 50%;
  left: 80%;
  transform: translate(-50%, -50%);
  border-radius: 5px;
}

.overlay-text {
  font-size: 20px;
  font-weight: bold;
}

/* .body-image3 {
    background-image: url(images/back2.png);
    position: relative;
    background-size: cover;
    width: 100%;
  
  } */
.text-change {
  font-size: 60px;
  font-weight: 800;
  line-height: normal;
}

/* .body-image4 {
    background-image: url(images/back3.png);
    position: relative;
    background-size: cover;
    width: 100%;
  } */
/* .body-image5 {
    background-image: url(images/back6.png);
    position: relative;
    background-size: cover;
    height: 120vh;
  } */
.fas.fa-copy.copied {
  color: rgb(91, 155, 91);
  /* Change the color when copied */
}

.typing-container {
  font-family: "Source Code Pro", monospace;
  font-size: 28px;
  color: black;
  overflow: hidden;
}

.typing-text {
  white-space: nowrap;
  font-size: 22px;
  animation: animated-cursor 600ms steps(30, end) infinite;
}

.adjustcontainer {
  height: 120px;
  width: 98%;
  margin-left: 10px;
  background-color: #e0a400ee;
  text-align: center;
  border-radius: 20px;
}

/* cursor animations */
@keyframes animated-cursor {
  from {
    border-right-color: rgba(0, 255, 0, 0.75);
  }

  to {
    border-right-color: transparent;
  }
}

/* .typed {
    overflow: hidden;
    white-space: nowrap;
    border-right: 2px solid;
    width: 0;
    animation: typing 3.5s steps(30, end) forwards, blinking 1s infinite;
  }
    
  @keyframes typing {
    from { width: 0 }
    to { width: 100% }
    
  }
  
  @keyframes blinking {
    0% {border-color: transparent}
    50% {border-color: black}
    100% {border-color: transparent}
  } */

.input-icon-wrap {
  width: 100%;
  height: 60px;
  align-items: center;
  padding: 0px 15px;
  color: black;
}

.butn {
  border-radius: 5px;
  background: #8392b6 !important;
  /* border: 2px solid #8392b6; */
  text-decoration: none !important;
  width: 100%;
  height: 50px;
  color: rgb(255, 255, 255) !important;
  list-style: none !important;
  box-shadow: 2px 3px 5px black;
  transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}
.butn:hover {
  background:#ce2b2b !important;
  color: #ffffff !important;
  transform: scale(0.95);
  box-shadow: 0px 0px 0px black;
  box-shadow: 1px 1px 1px 0.5px #0eaa0600 !important;
}

.butner {
  border-radius: 5px;
  text-decoration: none !important;
  background: #8392b6 !important;
  width: 100%;
  height: 50px;
  color: rgb(255, 255, 255) !important;
  list-style: none !important;
  box-shadow: 2px 3px 5px black;
  transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}

.butner:hover {
  background:#ce2b2b !important;
  color: #ffffff !important;
  transform: scale(0.95);
  box-shadow: 0px 0px 0px black;
  box-shadow: 1px 1px 1px 0.5px #0eaa0600 !important;
}

.Timerstting {
  background-color: #16b108 !important;
  height: 60px !important;
  padding: 35px !important;
  width: 65% !important;
  border: 5px solid #4aed3b;
  border-radius: 15px !important;
}

.font-size-change {
  margin-top: -20px;
  font-size: 13px;
  text-align: center;
}

#countdown-headline {
  color: #e0a500;
}

#countdown {
  align-items: center;
  /* width: 400px; */
}

#countdown ul {
  margin: 0;
  padding: 0;
  height: 20px !important;
  display: flex;
  justify-content: center;
  align-items: center;
}

#countdown ul li {
  display: inline-flex;
  padding-top: 0px;
  font-size: 14px;
  width: 14%;
  margin: 5px;
  height: 50px;
  justify-content: center;
  align-items: center;

  color: black;
  /* background: linear-gradient(302deg, rgb(51 51 34 / 10%) 0%, rgb(244 221 126 / 10%) 100%); */
  border-radius: 0px;
  background: rgba(250, 240, 240, 0.962);
}

#countdown ul li span {
  font-size: 14px;
  margin-bottom: 10px;
  display: flex;
  justify-content: center;
}

.countdown-container {
  margin: 0 auto;
  width: 100%;
  height: auto;
}



.butn1 {
  border-radius: 50px;
  border: 1px solid rgba(0, 0, 0, 0);
  box-shadow: 1px 1px 1px 0.5px #0eaa06 !important;
  background-color: #77f969 !important;
  text-decoration: none !important;
  width: 250px !important;
  height: 100px;
  color: black !important;
  list-style: none !important;
  font-weight: 800;
  font-size: 2.5rem;
  background-color: none;
  display: flex;
  animation: tranfor 0.3s ease-in-out;
  justify-content: center;
  align-items: center;
}

.butn1:active {
  color: #000 !important;
  transform: scale(0.9);
  border: 1px solid rgb(0, 0, 0);
  box-shadow: 1px 1px 1px 0.5px #0eaa06 !important;
}

.butn2 {
  border-radius: 50px;
  border: 1px solid rgba(0, 0, 0, 0);
  box-shadow: 1px 1px 1px 0.5px #0eaa06 !important;
  background-color: #77f969 !important;
  text-decoration: none !important;
  width: 150px !important;
  height: 50px;
  color: black !important;
  list-style: none !important;
  font-weight: 800;
  font-size: 2.5rem;
  background-color: none;
  display: flex;
  animation: tranfor 0.3s ease-in-out;
  justify-content: center;
  align-items: center;
}

.butn2:active {
  color: #000 !important;
  transform: scale(0.9);
  border: 1px solid rgb(0, 0, 0);
  box-shadow: 1px 1px 1px 0.5px #0eaa06 !important;
}



#purchaseButtonUSDT:hover {
  background: #ffffff !important;
  color: #191260 !important;
  /* border: 2px solid #7e9cbf !important; */
}

.conbtn {
  font-weight: 700 !important;
 background-color: #ffffff !important;
  color: #191260 !important;
  letter-spacing: 0.8px;
  font-size: 24px !important;
  border-radius: 10px;
  border: 3px solid #3e2413 !important;
  transition: transform 0.3s ease-in-out, background-color 0.3s ease-in-out, color 0.3s ease-in-out
}

.conbtn:hover {
  border: 2px solid #ffffff !important;
  background-image: linear-gradient(45deg, #191260, #191260) !important;
  color: #ffffff !important;
}

.conbtn1:hover {
  background-image: linear-gradient(to right, #ddaaed, #a944c5) !important;
}

.conbtn2:hover {
  background-image: linear-gradient(to right, #f89090, #ed3333) !important;
}

.conbtn3:hover {
  background-image: linear-gradient(to right, #a1c7fd, #1b6afd) !important;
}

.howbtn:hover {
  /* background-image: linear-gradient(180deg, #E7E497 0%, #5E3A1B 100%) !important; */
  color: rgb(19, 19, 38) !important;
  background-color: #fff !important;
}

.howbtn22:hover {
  /* background-image: linear-gradient(180deg, #51A9FD 0%, #5E3A1B 100%) !important; */
  color: rgb(0, 0, 0) !important;
  /* text-shadow: 2px 2px 4px black; */
}

#purchaseButton:hover {
  background-image: linear-gradient(180deg, #191260 50%, #191260 100%) !important;
  color: #ffffff !important;
  /* border: 2px solid #7cbbf7 !important; */

}

#purchaseButtonUSDC:hover {
  background: #191260 !important;
  color: #ffffff !important;
  /* border: 2px solid #7cbbf7 !important; */

}

#approveButton:hover {
  background-image: linear-gradient(180deg, #191260 50%, #191260 100%) !important;
  color: #ffffff !important;
  /* border: 2px solid #7cbbf7 !important; */
}

#approveButtonUSDC:hover {
  background-image: linear-gradient(180deg, #191260 50%, #191260 100%) !important;
  color: #ffffff !important;
  /* border: 2px solid #7cbbf7 !important; */
}

.btn1:hover {
  background: linear-gradient(97.79deg, #e1ff38 -10.77%, #45ff4b 126.71%);
}

.input-icon {
  margin-right: 10px;
}

.input-with-icon {
  background-color: rgb(26, 26, 26);
  border: none;
  outline: none;
  color: rgb(255, 255, 255) !important;
  /* width: 111%; */
  width: 90% !important;
}

.input-with-icon::placeholder {
  color: #fff;
}

.input-icon-img {
  max-height: 50px;
  width: 40px;
  /* size: 100%; */
}

#logo-currency {
  width: 36px;

  /* height: 50px; */
}

#currencySelect {
  border: none;
  width: 80px;
  font-size: 10px;
  font-weight: bold;
}

.size {
  margin-bottom: 2px;
  width: 25px;
  /* margin-right: 12px; */
}

.size1 {
  /* margin-bottom: 2px; */
  /* width: 20px; */
  margin-top: 7px;
  /* margin-left: -12px; */
}

.app-card-buttons {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 16px;
}

#connectButton {
  background-color: #08036a;
  color: #f7f7f7;
  width: 200px;
  height: 48px;
}

.newButton {
  background-color: #2a20db;
  color: #f7f7f7;
  width: 130px;
  height: 48px;
}

#connectButton:hover {
  background: linear-gradient(97.79deg, #e1ff38 -10.77%, #45ff4b 126.71%);
}

.newButton:hover {
  background: linear-gradient(97.79deg, #e1ff38 -10.77%, #45ff4b 126.71%);
}

#connectButton:focus {
  background: linear-gradient(97.79deg, #e1ff38 -10.77%, #45ff4b 126.71%);
}

#purchaseButton {
  display: none;
  font-weight: 700;
  width: 250px;
  height: 55px;
  background-image: linear-gradient(180deg, #ffffff 0%, #ffffff 50%, #ffffff 100%);
  border: 2px solid #ffffff;
  color: #191260 !important;
  font-size: 25px;
  border-radius: 10px;
}

.modlercardtext {
  color: black;
  font-weight: 700;
  font-size: 28px;
}

#approveButton {
  display: none;
  font-weight: 700;
  width: 250px;
  height: 55px;
  border: 2px solid white;
  background-image: linear-gradient(180deg, #ffffff 0%, #ffffff 50%, #fefefe 100%);
  color: #191260 !important;
  font-size: 25px;
  border-radius: 10px;
}

#approveButtonUSDC {
  display: none;
  font-weight: 700;
  width: 250px;
  height: 55px;
  border: 2px solid white;
  background-image: linear-gradient(180deg, #ffffff 0%, #ffffff 50%, #ffffff 100%);
  color: #191260 !important;
  font-size: 25px;
  border-radius: 10px;
}

#claimTokens {
  display: none;
}

#switchchain {
  display: none;
}

#purchaseButtonUSDT {
  display: none;
  font-weight: 700;
  width: 250px;
  height: 55px;
  border: 2px solid white;
  background: white;
  color: #191260 !important;
  font-size: 25px;
  border-radius: 10px;
}

#purchaseButtonUSDC {
  display: none;
  font-weight: 700;
  width: 250px;
  height: 55px;
  border: 2px solid white;
  background: white;
  color: #191260 !important;
  font-size: 25px;
  border-radius: 10px;
}

.token-change {
  background-color: #000000ee;
  border: 3px solid rgba(69, 71, 77, 0.759);
  border-radius: 25px;
  padding-bottom: 20px;
}

.claimtoken {
  padding: 10px;
  background-color: #e0a400ee;
  font-size: 18px;
  font-weight: 500;
  margin-left: 20px;
  height: 100px;
  border-radius: 20px;
}

.claimtoken2 {
  padding: 10px;
  font-size: 18px;
  background-color: #e0a400ee;
  font-weight: 500;
  margin-left: 20px;
  height: 100px;
  border-radius: 20px;
}

.claimtoken3 {
  padding: 10px;
  font-size: 18px;
  background-color: #e0a400ee;
  font-weight: 500;

  height: 80px;
  border-radius: 20px;
}

.logo-adjust {
  color: #f7f9fc;
  margin-left: 660px;
}

.display-change {
  display: flex;
  justify-content: space-around;
}

.navbar-toggler {
  color: #77f969;
}

.line-change {
  color: white;
  margin-top: 20px;
}

@media only screen and (max-width: 576px) {
  .dgd1 {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
  }

  .token-det {
    flex-direction: row;
    justify-content: space-around;
    background-color: #0147a6 !important;
    border-radius: 70px;
    height: auto;
    justify-content: center;
    align-items: center;
  }

  .googleBar {
    top: 730px !important;
    left: 10px;
  }

  .wqwq {
    margin-top: 130px !important;
  }

  .myper {
    margin: 0px !important;
    padding: 0px !important;
    font-size: 2.2em;
  }

  .section1 {
    /* background-color: white; */
    width: 100%;
    /* background-image: none;
    background-image: url('./images/herombl1.png') !important; */

    /* background-color: #1C1D23 !important; */
  }


  .fff2{
    background-image: url('./images/tokenmbl.png') !important;
}
}

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


  .navmob {
    background-color: #000000 !important;
    margin-top: 0px !important;
  }

  .p-lines:before,
  .p-lines:after {
    content: "";
    display: block;
    padding-left: 10px !important;
    padding-right: 10px !important;
    height: 2px;
    width: 25px;
    position: absolute;
    top: 50%;
  }

  .p-lines:before {
    left: 5px;
  }

  .p-lines:after {
    right: 5px;
  }

  .am {
    font-size: 15px !important;
  }


  #approveButton {
    width: 250px !important;
    height: 50px;
    color: white;
  }

  .section3 {
    padding-top: 0px;
  }

  .sec3row {
    padding-top: 100px;
    padding-bottom: 100px;
  }

  .paraSec3 {
    line-height: 30px;
    margin-top: 80px;
  }

  .sec4row {
    padding-top: 20px;
    padding-bottom: 100px;
    height: 100%;
  }

  .whitebtn {
    background-color: #0e3224 !important;
    color: #1df9ab !important;
    border: none;

    border-radius: 45px !important;
    /* height: 40px;
    width: 150px; */
    padding: 10px 30px;
    transition: transform 330ms ease-in-out;
    margin-top: 10px !important;
    margin-left: 0px;
  }

  .whitebtn:hover {
    background-color: #1df9ab !important;
    opacity: 1;
    color: #0e3224 !important;
    transform: translateY(-5px);
  }

  .section5 {}

  .sec5row {
    padding-top: 100px;
    padding-bottom: 100px;
    height: 100%;
  }

  .box {
    height: 850px;
    width: 400px;
    /* background-color: #241c14; */
    background: linear-gradient(-40deg, #6f7bf7 18%, #9bf8f4 100%);
    margin: auto;
    border: 0px solid #362d20;
    border-radius: 10px;
  }

  .childBox {
    margin: auto;

    width: 300px;
    color: white;
  }

  .p-card {
    font-size: 13px;
  }

  .section4 {
    margin: 0px;
    background-image: url("images/background-image/out-1-2.png");

    /* Full height */

    /* Center and scale the image nicely */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
  }

  .section6 {}

  .contsec6 {
    padding-top: 30px;
    padding-bottom: 110px;
  }

  .chartBox {
    height: 320px !important;
    width: 320px !important;
    position: relative;
    top: 0px !important;
  }

  .textbox {
    margin-top: 50px;
    margin-left: 0px;
    width: 700px;
  }

  .contToke {
    height: 500px;
    width: 400px;
  }

  .contToke>h1 {
    font-size: 50px;
    font-family: "Inknut Antiqua";
  }

  .contToke>p {
    font-size: 25px;
    margin-top: 70px;
    font-family: "Inknut Antiqua";
    line-height: 70px;
  }

  .line-change {
    color: white;
    margin-top: 10px;
    font-size: 9px;
  }

  .aboutpadder {
    color: white;
  }

  .change-top {
    font-weight: 800;
    color: #e0a400;
    margin-top: 535px;
  }

  .margin-logo {
    margin-top: 35px;
  }

  .claimtoken {
    margin-left: 1px;
    margin-top: 12px;
  }

  .font-change {
    font-size: 14px;
  }

  .typing-text {
    white-space: nowrap;
    font-size: 20px;
  }

  .display-change {
    align-items: center;
    display: flex;
    flex-direction: column;
  }

  /* .body-image {
    background-image: url(images/back.png);
    position: relative;
    
    background-size: cover;
    background-position: center;
  
  } */

  /* .body-image2 {
    background-image: url(images/back1.png);
    position: relative;
    background-size: cover;
    width: 100%;
    background-position: center;
    
  } */

  /* .body-image3 {
    background-image: url(images/back2.png);
    position: relative;
    background-size: cover;
    width: 100%;
    background-position: center;
  } */

  /* .body-image4 {
    background-image: url(images/back3.png);
    position: relative;
    background-size: cover;
    width: 100%;
    background-position: center;
  } */
  /* .body-image5 {
    background-image: url(images/back6.png);
    position: relative;
    background-size: cover;
    background-position: center;
    height: 150vh;
  } */
  .logo-adjust {
    color: #f7f9fc;
    margin-left: 200px;
  }

  #donut-chart {
    display: block;
    margin: 0 auto;
    width: 200px;
    height: 200px;
  }

  .higher {
    height: 241px;
    width: 241px;
  }

  .claimtoken2 {
    margin-left: 1px;
    margin-top: 22px;
  }

  .claimtoken3 {
    margin-left: 1px;
    margin-top: 22px;
  }

  .text-change {
    font-size: 45px;
    font-weight: 800;
    line-height: normal;
  }

  .adjustcontainer {
    margin-left: 0px;
    width: 100%;
  }

  .size-change {
    color: rgb(0, 0, 0);
    margin-top: 10px;
    font-size: 20px;
  }

  .sec5cont {
    padding-top: 100px;
    padding-bottom: 100px;
  }

  .navitems {
    margin-left: 10px !important;
    margin-top: 5px !important;
  }

  .n1 {
    margin-left: 0px !important;
    margin-top: 0px !important;
  }

  .butn {
    width: 100% !important;
  }

  .butner {
    width: 100% !important;
  }

  .changewidth {
    width: 100% !important;
  }

  @keyframes rotate {
    0% {
      transform: rotate(0deg);
    }

    100% {
      transform: rotate(360deg);
    }
  }

  .rotateImg {
    animation: rotate 10s linear infinite;
    /* Adjust the duration and timing function as needed */
    margin-left: 10px;
  }

  .imgBox1 {
    width: 300px !important;
    margin-left: 7px;
    height: 300px !important;
  }

  .box {
    height: 900px;
    width: 300px;
    /* background-color: #241c14; */
    background: linear-gradient(-40deg, #6f7bf7 18%, #9bf8f4 100%);
    margin: auto;
    border: 2px solid #362d20;
    border-radius: 10px;
  }

  .childBox {
    margin: auto;

    width: 250px;
    color: white;
  }

  .chartBox {
    height: 320px;
    width: 320px;
    left: -10px;
    position: relative;
    top: -40px;
  }

  .filter1 {
    padding: 10px !important;
  }

  .shape {
    position: absolute;
    top: -100px;
    left: 150px;
    right: 0;
    width: 400px;
    height: 400px;
    transform: rotate(70deg);
    -webkit-transform: rotate(70deg);
    -moz-transform: rotate(70deg);
    -o-transform: rotate(70deg);
    -ms-transform: rotate(70deg);
    border-right: 70px solid;
    border-bottom: 70px solid;
    border-image: linear-gradient(45deg, #6710c2, #c81d77) 1;
    /* background-color: linear-gradient(to right, #ff1b6b , #45caff) ; */
    z-index: -1;
  }

  .shape1 {
    position: absolute;
    top: -100px;
    left: 80px;
    right: 0;
    width: 500px;
    height: 500px;
    transform: rotate(70deg);
    -webkit-transform: rotate(70deg);
    -moz-transform: rotate(70deg);
    -o-transform: rotate(70deg);
    -ms-transform: rotate(70deg);
    border-right: 70px solid;
    border-bottom: 70px solid;
    /* border-image: linear-gradient(45deg, #381372, #45caff) 1; */
    border-image: linear-gradient(45deg, #6710c2, #c81d77) 1;
    /* background-color: linear-gradient(to right, #ff1b6b , #45caff) ; */
    z-index: -1;
  }

  .jindovideosize {
    width: 560px;
    height: 255px;

  }

  .coltokcon1 {
    border-top: 1px solid #f389c0 !important;
    border-bottom: 1px solid #f389c0 !important;
    border-right: 1px solid #f389c0 !important;
    border-left: none !important;
  }

  .coltokcon2 {
    border-top: 1px solid #f389c0 !important;
    border-bottom: 1px solid #f389c0 !important;
    border-right: none !important;
    border-left: none !important;
  }

  .aoa {
    background-color: transparent !important;
    backdrop-filter: blur(110px);
  }

  .navmob {
    background-color: #000000 !important;
  }

  .qwq {
    padding-top: 0px !important;
  }

  .claimbtn {
    width: 350px;
    height: 60px;
    font-size: 22px !important;
  }

  .claimbtnswitch {
    /* width: 350px; */
    height: 60px;
    padding: 12px !important;
  }
}

@media only screen and (min-width: 768px) and (max-width: 1024px) {

  .p-lines:before,
  .p-lines:after {
    content: "";
    display: block;
    padding-left: 10px !important;
    padding-right: 10px !important;
    width: 15%;
    height: 2px;
    background: rgb(0, 0, 0);
    position: absolute;
    top: 50%;
  }

  .p-lines:before {
    left: 10px;
  }

  .p-lines:after {
    right: 10px;
  }

  .am {
    font-size: 13px !important;
  }

  .aoa {
    background-color: transparent !important;
    backdrop-filter: blur(30px);
  }

  .box {
    height: 500px;
    width: 800px;
    /* background-color: #241c14; */
    background: linear-gradient(-40deg, #6f7bf7 18%, #9bf8f4 100%);
    margin: auto;
    border: 2px solid #362d20;
    border-radius: 10px;
  }

  .childBox {
    margin: auto;

    width: 750px;
    color: white;
  }

  .card-change {}
}

/* circles animation on main statrs*/

.cont {
  width: 100%;
  height: 100%;

  position: relative;
}

.circle-container {
  position: absolute;
  transform: translateY(-10vh);
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

.circle-container .circle {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  mix-blend-mode: screen;
  background-image: radial-gradient(hsl(0, 0%, 100%),
      hsl(0, 0%, 100%) 10%,
      hsla(0, 0%, 100%, 0) 56%);
  animation: fadein-frames 200ms infinite, scale-frames 2s infinite;
}

@keyframes fade-frames {
  0% {
    opacity: 1;
  }

  50% {
    opacity: 0.7;
  }

  100% {
    opacity: 1;
  }
}

@keyframes scale-frames {
  0% {
    transform: scale3d(0.4, 0.4, 1);
  }

  50% {
    transform: scale3d(2.2, 2.2, 1);
  }

  100% {
    transform: scale3d(0.4, 0.4, 1);
  }
}

.circle-container:nth-child(1) {
  width: 1px;
  height: 1px;
  animation-name: move-frames-1;
  animation-duration: 30707ms;
  animation-delay: 31998ms;
}

@keyframes move-frames-1 {
  from {
    transform: translate3d(100vw, 101vh, 0);
  }

  to {
    transform: translate3d(2vw, -116vh, 0);
  }
}

.circle-container:nth-child(1) .circle {
  animation-delay: 2067ms;
}

.circle-container:nth-child(2) {
  width: 5px;
  height: 5px;
  animation-name: move-frames-2;
  animation-duration: 36376ms;
  animation-delay: 19413ms;
}

@keyframes move-frames-2 {
  from {
    transform: translate3d(60vw, 101vh, 0);
  }

  to {
    transform: translate3d(96vw, -115vh, 0);
  }
}

.circle-container:nth-child(2) .circle {
  animation-delay: 2113ms;
}

.circle-container:nth-child(3) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-3;
  animation-duration: 30379ms;
  animation-delay: 7587ms;
}

@keyframes move-frames-3 {
  from {
    transform: translate3d(79vw, 107vh, 0);
  }

  to {
    transform: translate3d(99vw, -133vh, 0);
  }
}

.circle-container:nth-child(3) .circle {
  animation-delay: 3077ms;
}

.circle-container:nth-child(4) {
  width: 6px;
  height: 6px;
  animation-name: move-frames-4;
  animation-duration: 32058ms;
  animation-delay: 21424ms;
}

@keyframes move-frames-4 {
  from {
    transform: translate3d(57vw, 110vh, 0);
  }

  to {
    transform: translate3d(57vw, -115vh, 0);
  }
}

.circle-container:nth-child(4) .circle {
  animation-delay: 1814ms;
}

.circle-container:nth-child(5) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-5;
  animation-duration: 31013ms;
  animation-delay: 25530ms;
}

@keyframes move-frames-5 {
  from {
    transform: translate3d(45vw, 101vh, 0);
  }

  to {
    transform: translate3d(13vw, -130vh, 0);
  }
}

.circle-container:nth-child(5) .circle {
  animation-delay: 976ms;
}

.circle-container:nth-child(6) {
  width: 4px;
  height: 4px;
  animation-name: move-frames-6;
  animation-duration: 28247ms;
  animation-delay: 4358ms;
}

@keyframes move-frames-6 {
  from {
    transform: translate3d(97vw, 104vh, 0);
  }

  to {
    transform: translate3d(94vw, -121vh, 0);
  }
}

.circle-container:nth-child(6) .circle {
  animation-delay: 2849ms;
}

.circle-container:nth-child(7) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-7;
  animation-duration: 33775ms;
  animation-delay: 22749ms;
}

@keyframes move-frames-7 {
  from {
    transform: translate3d(95vw, 101vh, 0);
  }

  to {
    transform: translate3d(90vw, -119vh, 0);
  }
}

.circle-container:nth-child(7) .circle {
  animation-delay: 1254ms;
}

.circle-container:nth-child(8) {
  width: 6px;
  height: 6px;
  animation-name: move-frames-8;
  animation-duration: 31685ms;
  animation-delay: 10092ms;
}

@keyframes move-frames-8 {
  from {
    transform: translate3d(52vw, 105vh, 0);
  }

  to {
    transform: translate3d(71vw, -117vh, 0);
  }
}

.circle-container:nth-child(8) .circle {
  animation-delay: 10ms;
}

.circle-container:nth-child(9) {
  width: 5px;
  height: 5px;
  animation-name: move-frames-9;
  animation-duration: 32707ms;
  animation-delay: 35698ms;
}

@keyframes move-frames-9 {
  from {
    transform: translate3d(91vw, 101vh, 0);
  }

  to {
    transform: translate3d(72vw, -108vh, 0);
  }
}

.circle-container:nth-child(9) .circle {
  animation-delay: 1645ms;
}

.circle-container:nth-child(10) {
  width: 5px;
  height: 5px;
  animation-name: move-frames-10;
  animation-duration: 29180ms;
  animation-delay: 16393ms;
}

@keyframes move-frames-10 {
  from {
    transform: translate3d(10vw, 104vh, 0);
  }

  to {
    transform: translate3d(51vw, -116vh, 0);
  }
}

.circle-container:nth-child(10) .circle {
  animation-delay: 1800ms;
}

.circle-container:nth-child(11) {
  width: 2px;
  height: 2px;
  animation-name: move-frames-11;
  animation-duration: 35252ms;
  animation-delay: 11611ms;
}

@keyframes move-frames-11 {
  from {
    transform: translate3d(71vw, 106vh, 0);
  }

  to {
    transform: translate3d(99vw, -129vh, 0);
  }
}

.circle-container:nth-child(11) .circle {
  animation-delay: 3450ms;
}

.circle-container:nth-child(12) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-12;
  animation-duration: 36652ms;
  animation-delay: 16779ms;
}

@keyframes move-frames-12 {
  from {
    transform: translate3d(55vw, 104vh, 0);
  }

  to {
    transform: translate3d(24vw, -117vh, 0);
  }
}

.circle-container:nth-child(12) .circle {
  animation-delay: 3502ms;
}

.circle-container:nth-child(13) {
  width: 7px;
  height: 7px;
  animation-name: move-frames-13;
  animation-duration: 34469ms;
  animation-delay: 798ms;
}

@keyframes move-frames-13 {
  from {
    transform: translate3d(98vw, 102vh, 0);
  }

  to {
    transform: translate3d(91vw, -121vh, 0);
  }
}

.circle-container:nth-child(13) .circle {
  animation-delay: 110ms;
}

.circle-container:nth-child(14) {
  width: 1px;
  height: 1px;
  animation-name: move-frames-14;
  animation-duration: 36439ms;
  animation-delay: 33047ms;
}

@keyframes move-frames-14 {
  from {
    transform: translate3d(11vw, 103vh, 0);
  }

  to {
    transform: translate3d(13vw, -114vh, 0);
  }
}

.circle-container:nth-child(14) .circle {
  animation-delay: 543ms;
}

.circle-container:nth-child(15) {
  width: 5px;
  height: 5px;
  animation-name: move-frames-15;
  animation-duration: 29309ms;
  animation-delay: 1050ms;
}

@keyframes move-frames-15 {
  from {
    transform: translate3d(53vw, 107vh, 0);
  }

  to {
    transform: translate3d(72vw, -113vh, 0);
  }
}

.circle-container:nth-child(15) .circle {
  animation-delay: 1464ms;
}

.circle-container:nth-child(16) {
  width: 2px;
  height: 2px;
  animation-name: move-frames-16;
  animation-duration: 31684ms;
  animation-delay: 32560ms;
}

@keyframes move-frames-16 {
  from {
    transform: translate3d(94vw, 101vh, 0);
  }

  to {
    transform: translate3d(92vw, -118vh, 0);
  }
}

.circle-container:nth-child(16) .circle {
  animation-delay: 478ms;
}

.circle-container:nth-child(17) {
  width: 7px;
  height: 7px;
  animation-name: move-frames-17;
  animation-duration: 30239ms;
  animation-delay: 10767ms;
}

@keyframes move-frames-17 {
  from {
    transform: translate3d(62vw, 103vh, 0);
  }

  to {
    transform: translate3d(44vw, -132vh, 0);
  }
}

.circle-container:nth-child(17) .circle {
  animation-delay: 3649ms;
}

.circle-container:nth-child(18) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-18;
  animation-duration: 32466ms;
  animation-delay: 8372ms;
}

@keyframes move-frames-18 {
  from {
    transform: translate3d(6vw, 105vh, 0);
  }

  to {
    transform: translate3d(80vw, -115vh, 0);
  }
}

.circle-container:nth-child(18) .circle {
  animation-delay: 2269ms;
}

.circle-container:nth-child(19) {
  width: 1px;
  height: 1px;
  animation-name: move-frames-19;
  animation-duration: 28363ms;
  animation-delay: 16629ms;
}

@keyframes move-frames-19 {
  from {
    transform: translate3d(72vw, 103vh, 0);
  }

  to {
    transform: translate3d(57vw, -121vh, 0);
  }
}

.circle-container:nth-child(19) .circle {
  animation-delay: 2515ms;
}

.circle-container:nth-child(20) {
  width: 3px;
  height: 3px;
  animation-name: move-frames-20;
  animation-duration: 30729ms;
  animation-delay: 31260ms;
}

@keyframes move-frames-20 {
  from {
    transform: translate3d(70vw, 102vh, 0);
  }

  to {
    transform: translate3d(48vw, -103vh, 0);
  }
}

.circle-container:nth-child(20) .circle {
  animation-delay: 2527ms;
}

.circle-container:nth-child(21) {
  width: 7px;
  height: 7px;
  animation-name: move-frames-21;
  animation-duration: 35738ms;
  animation-delay: 16771ms;
}

@keyframes move-frames-21 {
  from {
    transform: translate3d(34vw, 101vh, 0);
  }

  to {
    transform: translate3d(19vw, -103vh, 0);
  }
}

.circle-container:nth-child(21) .circle {
  animation-delay: 100ms;
}

.circle-container:nth-child(22) {
  width: 5px;
  height: 5px;
  animation-name: move-frames-22;
  animation-duration: 29971ms;
  animation-delay: 29866ms;
}

@keyframes move-frames-22 {
  from {
    transform: translate3d(34vw, 107vh, 0);
  }

  to {
    transform: translate3d(47vw, -135vh, 0);
  }
}

.circle-container:nth-child(22) .circle {
  animation-delay: 3956ms;
}

.circle-container:nth-child(23) {
  width: 4px;
  height: 4px;
  animation-name: move-frames-23;
  animation-duration: 28671ms;
  animation-delay: 13438ms;
}

@keyframes move-frames-23 {
  from {
    transform: translate3d(23vw, 104vh, 0);
  }

  to {
    transform: translate3d(78vw, -122vh, 0);
  }
}

.circle-container:nth-child(23) .circle {
  animation-delay: 1412ms;
}

.circle-container:nth-child(24) {
  width: 6px;
  height: 6px;
  animation-name: move-frames-24;
  animation-duration: 35010ms;
  animation-delay: 26358ms;
}

@keyframes move-frames-24 {
  from {
    transform: translate3d(33vw, 109vh, 0);
  }

  to {
    transform: translate3d(89vw, -112vh, 0);
  }
}

.circle-container:nth-child(24) .circle {
  animation-delay: 659ms;
}

.circle-container:nth-child(25) {
  width: 5px;
  height: 5px;
  animation-name: move-frames-25;
  animation-duration: 29725ms;
  animation-delay: 28217ms;
}

@keyframes move-frames-25 {
  from {
    transform: translate3d(36vw, 104vh, 0);
  }

  to {
    transform: translate3d(10vw, -118vh, 0);
  }
}

.circle-container:nth-child(25) .circle {
  animation-delay: 868ms;
}

.circle-container:nth-child(26) {
  width: 2px;
  height: 2px;
  animation-name: move-frames-26;
  animation-duration: 30658ms;
  animation-delay: 19533ms;
}

@keyframes move-frames-26 {
  from {
    transform: translate3d(20vw, 109vh, 0);
  }

  to {
    transform: translate3d(8vw, -126vh, 0);
  }
}

.circle-container:nth-child(26) .circle {
  animation-delay: 3732ms;
}

.circle-container:nth-child(27) {
  width: 6px;
  height: 6px;
  animation-name: move-frames-27;
  animation-duration: 30003ms;
  animation-delay: 20188ms;
}

@keyframes move-frames-27 {
  from {
    transform: translate3d(96vw, 102vh, 0);
  }

  to {
    transform: translate3d(71vw, -108vh, 0);
  }
}

.circle-container:nth-child(27) .circle {
  animation-delay: 3016ms;
}

.circle-container:nth-child(28) {
  width: 1px;
  height: 1px;
  animation-name: move-frames-28;
  animation-duration: 35228ms;
  animation-delay: 23504ms;
}

@keyframes move-frames-28 {
  from {
    transform: translate3d(20vw, 102vh, 0);
  }

  to {
    transform: translate3d(58vw, -120vh, 0);
  }
}

.circle-container:nth-child(28) .circle {
  animation-delay: 553ms;
}

.circle-container:nth-child(29) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-29;
  animation-duration: 29249ms;
  animation-delay: 8948ms;
}

@keyframes move-frames-29 {
  from {
    transform: translate3d(53vw, 101vh, 0);
  }

  to {
    transform: translate3d(59vw, -116vh, 0);
  }
}

.circle-container:nth-child(29) .circle {
  animation-delay: 1124ms;
}

.circle-container:nth-child(30) {
  width: 1px;
  height: 1px;
  animation-name: move-frames-30;
  animation-duration: 29356ms;
  animation-delay: 20823ms;
}

@keyframes move-frames-30 {
  from {
    transform: translate3d(77vw, 108vh, 0);
  }

  to {
    transform: translate3d(82vw, -121vh, 0);
  }
}

.circle-container:nth-child(30) .circle {
  animation-delay: 241ms;
}

.circle-container:nth-child(31) {
  width: 6px;
  height: 6px;
  animation-name: move-frames-31;
  animation-duration: 32223ms;
  animation-delay: 36392ms;
}

@keyframes move-frames-31 {
  from {
    transform: translate3d(94vw, 106vh, 0);
  }

  to {
    transform: translate3d(19vw, -107vh, 0);
  }
}

.circle-container:nth-child(31) .circle {
  animation-delay: 3253ms;
}

.circle-container:nth-child(32) {
  width: 4px;
  height: 4px;
  animation-name: move-frames-32;
  animation-duration: 34396ms;
  animation-delay: 32358ms;
}

@keyframes move-frames-32 {
  from {
    transform: translate3d(65vw, 106vh, 0);
  }

  to {
    transform: translate3d(22vw, -133vh, 0);
  }
}

.circle-container:nth-child(32) .circle {
  animation-delay: 581ms;
}

.circle-container:nth-child(33) {
  width: 1px;
  height: 1px;
  animation-name: move-frames-33;
  animation-duration: 34591ms;
  animation-delay: 14026ms;
}

@keyframes move-frames-33 {
  from {
    transform: translate3d(79vw, 103vh, 0);
  }

  to {
    transform: translate3d(98vw, -114vh, 0);
  }
}

.circle-container:nth-child(33) .circle {
  animation-delay: 906ms;
}

.circle-container:nth-child(34) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-34;
  animation-duration: 34671ms;
  animation-delay: 3435ms;
}

@keyframes move-frames-34 {
  from {
    transform: translate3d(11vw, 102vh, 0);
  }

  to {
    transform: translate3d(86vw, -105vh, 0);
  }
}

.circle-container:nth-child(34) .circle {
  animation-delay: 241ms;
}

.circle-container:nth-child(35) {
  width: 3px;
  height: 3px;
  animation-name: move-frames-35;
  animation-duration: 30796ms;
  animation-delay: 31004ms;
}

@keyframes move-frames-35 {
  from {
    transform: translate3d(66vw, 106vh, 0);
  }

  to {
    transform: translate3d(68vw, -127vh, 0);
  }
}

.circle-container:nth-child(35) .circle {
  animation-delay: 3296ms;
}

.circle-container:nth-child(36) {
  width: 7px;
  height: 7px;
  animation-name: move-frames-36;
  animation-duration: 34690ms;
  animation-delay: 7123ms;
}

@keyframes move-frames-36 {
  from {
    transform: translate3d(60vw, 102vh, 0);
  }

  to {
    transform: translate3d(37vw, -129vh, 0);
  }
}

.circle-container:nth-child(36) .circle {
  animation-delay: 2766ms;
}

.circle-container:nth-child(37) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-37;
  animation-duration: 33591ms;
  animation-delay: 33638ms;
}

@keyframes move-frames-37 {
  from {
    transform: translate3d(97vw, 103vh, 0);
  }

  to {
    transform: translate3d(76vw, -123vh, 0);
  }
}

.circle-container:nth-child(37) .circle {
  animation-delay: 1555ms;
}

.circle-container:nth-child(38) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-38;
  animation-duration: 31796ms;
  animation-delay: 36652ms;
}

@keyframes move-frames-38 {
  from {
    transform: translate3d(3vw, 103vh, 0);
  }

  to {
    transform: translate3d(83vw, -132vh, 0);
  }
}

.circle-container:nth-child(38) .circle {
  animation-delay: 3766ms;
}

.circle-container:nth-child(39) {
  width: 5px;
  height: 5px;
  animation-name: move-frames-39;
  animation-duration: 34441ms;
  animation-delay: 13549ms;
}

@keyframes move-frames-39 {
  from {
    transform: translate3d(21vw, 101vh, 0);
  }

  to {
    transform: translate3d(26vw, -103vh, 0);
  }
}

.circle-container:nth-child(39) .circle {
  animation-delay: 3400ms;
}

.circle-container:nth-child(40) {
  width: 3px;
  height: 3px;
  animation-name: move-frames-40;
  animation-duration: 29781ms;
  animation-delay: 36703ms;
}

@keyframes move-frames-40 {
  from {
    transform: translate3d(9vw, 105vh, 0);
  }

  to {
    transform: translate3d(82vw, -117vh, 0);
  }
}

.circle-container:nth-child(40) .circle {
  animation-delay: 3129ms;
}

.circle-container:nth-child(41) {
  width: 3px;
  height: 3px;
  animation-name: move-frames-41;
  animation-duration: 30191ms;
  animation-delay: 3439ms;
}

@keyframes move-frames-41 {
  from {
    transform: translate3d(6vw, 103vh, 0);
  }

  to {
    transform: translate3d(7vw, -111vh, 0);
  }
}

.circle-container:nth-child(41) .circle {
  animation-delay: 2950ms;
}

.circle-container:nth-child(42) {
  width: 4px;
  height: 4px;
  animation-name: move-frames-42;
  animation-duration: 30269ms;
  animation-delay: 34203ms;
}

@keyframes move-frames-42 {
  from {
    transform: translate3d(79vw, 104vh, 0);
  }

  to {
    transform: translate3d(43vw, -121vh, 0);
  }
}

.circle-container:nth-child(42) .circle {
  animation-delay: 3578ms;
}

.circle-container:nth-child(43) {
  width: 3px;
  height: 3px;
  animation-name: move-frames-43;
  animation-duration: 34803ms;
  animation-delay: 6063ms;
}

@keyframes move-frames-43 {
  from {
    transform: translate3d(95vw, 106vh, 0);
  }

  to {
    transform: translate3d(31vw, -126vh, 0);
  }
}

.circle-container:nth-child(43) .circle {
  animation-delay: 3730ms;
}

.circle-container:nth-child(44) {
  width: 3px;
  height: 3px;
  animation-name: move-frames-44;
  animation-duration: 30856ms;
  animation-delay: 23896ms;
}

@keyframes move-frames-44 {
  from {
    transform: translate3d(12vw, 103vh, 0);
  }

  to {
    transform: translate3d(42vw, -105vh, 0);
  }
}

.circle-container:nth-child(44) .circle {
  animation-delay: 824ms;
}

.circle-container:nth-child(45) {
  width: 3px;
  height: 3px;
  animation-name: move-frames-45;
  animation-duration: 30820ms;
  animation-delay: 13308ms;
}

@keyframes move-frames-45 {
  from {
    transform: translate3d(20vw, 106vh, 0);
  }

  to {
    transform: translate3d(91vw, -136vh, 0);
  }
}

.circle-container:nth-child(45) .circle {
  animation-delay: 361ms;
}

.circle-container:nth-child(46) {
  width: 2px;
  height: 2px;
  animation-name: move-frames-46;
  animation-duration: 33426ms;
  animation-delay: 30984ms;
}

@keyframes move-frames-46 {
  from {
    transform: translate3d(71vw, 109vh, 0);
  }

  to {
    transform: translate3d(52vw, -115vh, 0);
  }
}

.circle-container:nth-child(46) .circle {
  animation-delay: 823ms;
}

.circle-container:nth-child(47) {
  width: 6px;
  height: 6px;
  animation-name: move-frames-47;
  animation-duration: 29777ms;
  animation-delay: 31531ms;
}

@keyframes move-frames-47 {
  from {
    transform: translate3d(9vw, 104vh, 0);
  }

  to {
    transform: translate3d(59vw, -134vh, 0);
  }
}

.circle-container:nth-child(47) .circle {
  animation-delay: 521ms;
}

.circle-container:nth-child(48) {
  width: 4px;
  height: 4px;
  animation-name: move-frames-48;
  animation-duration: 29915ms;
  animation-delay: 18301ms;
}

@keyframes move-frames-48 {
  from {
    transform: translate3d(53vw, 102vh, 0);
  }

  to {
    transform: translate3d(47vw, -110vh, 0);
  }
}

.circle-container:nth-child(48) .circle {
  animation-delay: 1280ms;
}

.circle-container:nth-child(49) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-49;
  animation-duration: 30462ms;
  animation-delay: 8827ms;
}

@keyframes move-frames-49 {
  from {
    transform: translate3d(83vw, 108vh, 0);
  }

  to {
    transform: translate3d(13vw, -112vh, 0);
  }
}

.circle-container:nth-child(49) .circle {
  animation-delay: 3317ms;
}

.circle-container:nth-child(50) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-50;
  animation-duration: 33929ms;
  animation-delay: 2212ms;
}

@keyframes move-frames-50 {
  from {
    transform: translate3d(1vw, 101vh, 0);
  }

  to {
    transform: translate3d(12vw, -110vh, 0);
  }
}

.circle-container:nth-child(50) .circle {
  animation-delay: 295ms;
}

.circle-container:nth-child(51) {
  width: 4px;
  height: 4px;
  animation-name: move-frames-51;
  animation-duration: 34273ms;
  animation-delay: 15170ms;
}

@keyframes move-frames-51 {
  from {
    transform: translate3d(71vw, 105vh, 0);
  }

  to {
    transform: translate3d(35vw, -127vh, 0);
  }
}

.circle-container:nth-child(51) .circle {
  animation-delay: 1383ms;
}

.circle-container:nth-child(52) {
  width: 1px;
  height: 1px;
  animation-name: move-frames-52;
  animation-duration: 30173ms;
  animation-delay: 19019ms;
}

@keyframes move-frames-52 {
  from {
    transform: translate3d(38vw, 103vh, 0);
  }

  to {
    transform: translate3d(49vw, -125vh, 0);
  }
}

.circle-container:nth-child(52) .circle {
  animation-delay: 518ms;
}

.circle-container:nth-child(53) {
  width: 7px;
  height: 7px;
  animation-name: move-frames-53;
  animation-duration: 30242ms;
  animation-delay: 2727ms;
}

@keyframes move-frames-53 {
  from {
    transform: translate3d(86vw, 107vh, 0);
  }

  to {
    transform: translate3d(11vw, -110vh, 0);
  }
}

.circle-container:nth-child(53) .circle {
  animation-delay: 3401ms;
}

.circle-container:nth-child(54) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-54;
  animation-duration: 34845ms;
  animation-delay: 15083ms;
}

@keyframes move-frames-54 {
  from {
    transform: translate3d(36vw, 110vh, 0);
  }

  to {
    transform: translate3d(34vw, -127vh, 0);
  }
}

.circle-container:nth-child(54) .circle {
  animation-delay: 1516ms;
}

.circle-container:nth-child(55) {
  width: 1px;
  height: 1px;
  animation-name: move-frames-55;
  animation-duration: 30030ms;
  animation-delay: 12944ms;
}

@keyframes move-frames-55 {
  from {
    transform: translate3d(94vw, 104vh, 0);
  }

  to {
    transform: translate3d(83vw, -130vh, 0);
  }
}

.circle-container:nth-child(55) .circle {
  animation-delay: 2079ms;
}

.circle-container:nth-child(56) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-56;
  animation-duration: 31245ms;
  animation-delay: 17729ms;
}

@keyframes move-frames-56 {
  from {
    transform: translate3d(57vw, 110vh, 0);
  }

  to {
    transform: translate3d(25vw, -118vh, 0);
  }
}

.circle-container:nth-child(56) .circle {
  animation-delay: 2298ms;
}

.circle-container:nth-child(57) {
  width: 1px;
  height: 1px;
  animation-name: move-frames-57;
  animation-duration: 32719ms;
  animation-delay: 36941ms;
}

@keyframes move-frames-57 {
  from {
    transform: translate3d(21vw, 106vh, 0);
  }

  to {
    transform: translate3d(96vw, -108vh, 0);
  }
}

.circle-container:nth-child(57) .circle {
  animation-delay: 794ms;
}

.circle-container:nth-child(58) {
  width: 7px;
  height: 7px;
  animation-name: move-frames-58;
  animation-duration: 35193ms;
  animation-delay: 2904ms;
}

@keyframes move-frames-58 {
  from {
    transform: translate3d(84vw, 108vh, 0);
  }

  to {
    transform: translate3d(57vw, -111vh, 0);
  }
}

.circle-container:nth-child(58) .circle {
  animation-delay: 1285ms;
}

.circle-container:nth-child(59) {
  width: 1px;
  height: 1px;
  animation-name: move-frames-59;
  animation-duration: 34741ms;
  animation-delay: 7824ms;
}

@keyframes move-frames-59 {
  from {
    transform: translate3d(2vw, 107vh, 0);
  }

  to {
    transform: translate3d(39vw, -130vh, 0);
  }
}

.circle-container:nth-child(59) .circle {
  animation-delay: 3180ms;
}

.circle-container:nth-child(60) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-60;
  animation-duration: 34513ms;
  animation-delay: 20760ms;
}

@keyframes move-frames-60 {
  from {
    transform: translate3d(48vw, 110vh, 0);
  }

  to {
    transform: translate3d(91vw, -123vh, 0);
  }
}

.circle-container:nth-child(60) .circle {
  animation-delay: 3527ms;
}

.circle-container:nth-child(61) {
  width: 4px;
  height: 4px;
  animation-name: move-frames-61;
  animation-duration: 29424ms;
  animation-delay: 22774ms;
}

@keyframes move-frames-61 {
  from {
    transform: translate3d(88vw, 110vh, 0);
  }

  to {
    transform: translate3d(52vw, -117vh, 0);
  }
}

.circle-container:nth-child(61) .circle {
  animation-delay: 1722ms;
}

.circle-container:nth-child(62) {
  width: 3px;
  height: 3px;
  animation-name: move-frames-62;
  animation-duration: 28241ms;
  animation-delay: 8719ms;
}

@keyframes move-frames-62 {
  from {
    transform: translate3d(56vw, 101vh, 0);
  }

  to {
    transform: translate3d(57vw, -105vh, 0);
  }
}

.circle-container:nth-child(62) .circle {
  animation-delay: 2818ms;
}

.circle-container:nth-child(63) {
  width: 1px;
  height: 1px;
  animation-name: move-frames-63;
  animation-duration: 35069ms;
  animation-delay: 16630ms;
}

@keyframes move-frames-63 {
  from {
    transform: translate3d(43vw, 101vh, 0);
  }

  to {
    transform: translate3d(87vw, -128vh, 0);
  }
}

.circle-container:nth-child(63) .circle {
  animation-delay: 291ms;
}

.circle-container:nth-child(64) {
  width: 6px;
  height: 6px;
  animation-name: move-frames-64;
  animation-duration: 33987ms;
  animation-delay: 36667ms;
}

@keyframes move-frames-64 {
  from {
    transform: translate3d(78vw, 106vh, 0);
  }

  to {
    transform: translate3d(11vw, -111vh, 0);
  }
}

.circle-container:nth-child(64) .circle {
  animation-delay: 2460ms;
}

.circle-container:nth-child(65) {
  width: 2px;
  height: 2px;
  animation-name: move-frames-65;
  animation-duration: 30453ms;
  animation-delay: 29671ms;
}

@keyframes move-frames-65 {
  from {
    transform: translate3d(42vw, 104vh, 0);
  }

  to {
    transform: translate3d(39vw, -114vh, 0);
  }
}

.circle-container:nth-child(65) .circle {
  animation-delay: 7ms;
}

.circle-container:nth-child(66) {
  width: 5px;
  height: 5px;
  animation-name: move-frames-66;
  animation-duration: 32875ms;
  animation-delay: 20381ms;
}

@keyframes move-frames-66 {
  from {
    transform: translate3d(42vw, 108vh, 0);
  }

  to {
    transform: translate3d(29vw, -133vh, 0);
  }
}

.circle-container:nth-child(66) .circle {
  animation-delay: 1091ms;
}

.circle-container:nth-child(67) {
  width: 5px;
  height: 5px;
  animation-name: move-frames-67;
  animation-duration: 34870ms;
  animation-delay: 23634ms;
}

@keyframes move-frames-67 {
  from {
    transform: translate3d(38vw, 105vh, 0);
  }

  to {
    transform: translate3d(47vw, -115vh, 0);
  }
}

.circle-container:nth-child(67) .circle {
  animation-delay: 3106ms;
}

.circle-container:nth-child(68) {
  width: 1px;
  height: 1px;
  animation-name: move-frames-68;
  animation-duration: 29845ms;
  animation-delay: 5715ms;
}

@keyframes move-frames-68 {
  from {
    transform: translate3d(88vw, 110vh, 0);
  }

  to {
    transform: translate3d(73vw, -111vh, 0);
  }
}

.circle-container:nth-child(68) .circle {
  animation-delay: 2131ms;
}

.circle-container:nth-child(69) {
  width: 5px;
  height: 5px;
  animation-name: move-frames-69;
  animation-duration: 28868ms;
  animation-delay: 23410ms;
}

@keyframes move-frames-69 {
  from {
    transform: translate3d(2vw, 101vh, 0);
  }

  to {
    transform: translate3d(90vw, -121vh, 0);
  }
}

.circle-container:nth-child(69) .circle {
  animation-delay: 3769ms;
}

.circle-container:nth-child(70) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-70;
  animation-duration: 29524ms;
  animation-delay: 10771ms;
}

@keyframes move-frames-70 {
  from {
    transform: translate3d(22vw, 107vh, 0);
  }

  to {
    transform: translate3d(78vw, -135vh, 0);
  }
}

.circle-container:nth-child(70) .circle {
  animation-delay: 3423ms;
}

.circle-container:nth-child(71) {
  width: 2px;
  height: 2px;
  animation-name: move-frames-71;
  animation-duration: 34432ms;
  animation-delay: 5963ms;
}

@keyframes move-frames-71 {
  from {
    transform: translate3d(65vw, 105vh, 0);
  }

  to {
    transform: translate3d(84vw, -121vh, 0);
  }
}

.circle-container:nth-child(71) .circle {
  animation-delay: 1133ms;
}

.circle-container:nth-child(72) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-72;
  animation-duration: 30211ms;
  animation-delay: 8641ms;
}

@keyframes move-frames-72 {
  from {
    transform: translate3d(2vw, 104vh, 0);
  }

  to {
    transform: translate3d(4vw, -132vh, 0);
  }
}

.circle-container:nth-child(72) .circle {
  animation-delay: 3027ms;
}

.circle-container:nth-child(73) {
  width: 3px;
  height: 3px;
  animation-name: move-frames-73;
  animation-duration: 32970ms;
  animation-delay: 28228ms;
}

@keyframes move-frames-73 {
  from {
    transform: translate3d(6vw, 101vh, 0);
  }

  to {
    transform: translate3d(20vw, -128vh, 0);
  }
}

.circle-container:nth-child(73) .circle {
  animation-delay: 779ms;
}

.circle-container:nth-child(74) {
  width: 3px;
  height: 3px;
  animation-name: move-frames-74;
  animation-duration: 31132ms;
  animation-delay: 13041ms;
}

@keyframes move-frames-74 {
  from {
    transform: translate3d(13vw, 101vh, 0);
  }

  to {
    transform: translate3d(5vw, -129vh, 0);
  }
}

.circle-container:nth-child(74) .circle {
  animation-delay: 1508ms;
}

.circle-container:nth-child(75) {
  width: 6px;
  height: 6px;
  animation-name: move-frames-75;
  animation-duration: 28553ms;
  animation-delay: 17916ms;
}

@keyframes move-frames-75 {
  from {
    transform: translate3d(46vw, 103vh, 0);
  }

  to {
    transform: translate3d(49vw, -111vh, 0);
  }
}

.circle-container:nth-child(75) .circle {
  animation-delay: 912ms;
}

.circle-container:nth-child(76) {
  width: 1px;
  height: 1px;
  animation-name: move-frames-76;
  animation-duration: 29437ms;
  animation-delay: 12215ms;
}

@keyframes move-frames-76 {
  from {
    transform: translate3d(92vw, 103vh, 0);
  }

  to {
    transform: translate3d(19vw, -131vh, 0);
  }
}

.circle-container:nth-child(76) .circle {
  animation-delay: 390ms;
}

.circle-container:nth-child(77) {
  width: 6px;
  height: 6px;
  animation-name: move-frames-77;
  animation-duration: 32234ms;
  animation-delay: 5035ms;
}

@keyframes move-frames-77 {
  from {
    transform: translate3d(55vw, 110vh, 0);
  }

  to {
    transform: translate3d(68vw, -128vh, 0);
  }
}

.circle-container:nth-child(77) .circle {
  animation-delay: 3001ms;
}

.circle-container:nth-child(78) {
  width: 3px;
  height: 3px;
  animation-name: move-frames-78;
  animation-duration: 29651ms;
  animation-delay: 3082ms;
}

@keyframes move-frames-78 {
  from {
    transform: translate3d(28vw, 104vh, 0);
  }

  to {
    transform: translate3d(15vw, -108vh, 0);
  }
}

.circle-container:nth-child(78) .circle {
  animation-delay: 3401ms;
}

.circle-container:nth-child(79) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-79;
  animation-duration: 34649ms;
  animation-delay: 32285ms;
}

@keyframes move-frames-79 {
  from {
    transform: translate3d(40vw, 106vh, 0);
  }

  to {
    transform: translate3d(23vw, -119vh, 0);
  }
}

.circle-container:nth-child(79) .circle {
  animation-delay: 2799ms;
}

.circle-container:nth-child(80) {
  width: 7px;
  height: 7px;
  animation-name: move-frames-80;
  animation-duration: 32995ms;
  animation-delay: 4587ms;
}

@keyframes move-frames-80 {
  from {
    transform: translate3d(26vw, 103vh, 0);
  }

  to {
    transform: translate3d(36vw, -117vh, 0);
  }
}

.circle-container:nth-child(80) .circle {
  animation-delay: 2367ms;
}

.circle-container:nth-child(81) {
  width: 6px;
  height: 6px;
  animation-name: move-frames-81;
  animation-duration: 30109ms;
  animation-delay: 1752ms;
}

@keyframes move-frames-81 {
  from {
    transform: translate3d(94vw, 110vh, 0);
  }

  to {
    transform: translate3d(93vw, -127vh, 0);
  }
}

.circle-container:nth-child(81) .circle {
  animation-delay: 3482ms;
}

.circle-container:nth-child(82) {
  width: 2px;
  height: 2px;
  animation-name: move-frames-82;
  animation-duration: 33616ms;
  animation-delay: 27733ms;
}

@keyframes move-frames-82 {
  from {
    transform: translate3d(17vw, 105vh, 0);
  }

  to {
    transform: translate3d(4vw, -134vh, 0);
  }
}

.circle-container:nth-child(82) .circle {
  animation-delay: 1750ms;
}

.circle-container:nth-child(83) {
  width: 1px;
  height: 1px;
  animation-name: move-frames-83;
  animation-duration: 28650ms;
  animation-delay: 8955ms;
}

@keyframes move-frames-83 {
  from {
    transform: translate3d(95vw, 105vh, 0);
  }

  to {
    transform: translate3d(33vw, -117vh, 0);
  }
}

.circle-container:nth-child(83) .circle {
  animation-delay: 2106ms;
}

.circle-container:nth-child(84) {
  width: 7px;
  height: 7px;
  animation-name: move-frames-84;
  animation-duration: 35486ms;
  animation-delay: 28839ms;
}

@keyframes move-frames-84 {
  from {
    transform: translate3d(41vw, 106vh, 0);
  }

  to {
    transform: translate3d(50vw, -115vh, 0);
  }
}

.circle-container:nth-child(84) .circle {
  animation-delay: 1904ms;
}

.circle-container:nth-child(85) {
  width: 5px;
  height: 5px;
  animation-name: move-frames-85;
  animation-duration: 30627ms;
  animation-delay: 27306ms;
}

@keyframes move-frames-85 {
  from {
    transform: translate3d(87vw, 101vh, 0);
  }

  to {
    transform: translate3d(17vw, -118vh, 0);
  }
}

.circle-container:nth-child(85) .circle {
  animation-delay: 3784ms;
}

.circle-container:nth-child(86) {
  width: 4px;
  height: 4px;
  animation-name: move-frames-86;
  animation-duration: 34905ms;
  animation-delay: 6993ms;
}

@keyframes move-frames-86 {
  from {
    transform: translate3d(52vw, 109vh, 0);
  }

  to {
    transform: translate3d(69vw, -112vh, 0);
  }
}

.circle-container:nth-child(86) .circle {
  animation-delay: 3322ms;
}

.circle-container:nth-child(87) {
  width: 7px;
  height: 7px;
  animation-name: move-frames-87;
  animation-duration: 29127ms;
  animation-delay: 15242ms;
}

@keyframes move-frames-87 {
  from {
    transform: translate3d(52vw, 110vh, 0);
  }

  to {
    transform: translate3d(15vw, -111vh, 0);
  }
}

.circle-container:nth-child(87) .circle {
  animation-delay: 2713ms;
}

.circle-container:nth-child(88) {
  width: 3px;
  height: 3px;
  animation-name: move-frames-88;
  animation-duration: 31518ms;
  animation-delay: 33584ms;
}

@keyframes move-frames-88 {
  from {
    transform: translate3d(46vw, 109vh, 0);
  }

  to {
    transform: translate3d(77vw, -119vh, 0);
  }
}

.circle-container:nth-child(88) .circle {
  animation-delay: 209ms;
}

.circle-container:nth-child(89) {
  width: 7px;
  height: 7px;
  animation-name: move-frames-89;
  animation-duration: 30408ms;
  animation-delay: 14498ms;
}

@keyframes move-frames-89 {
  from {
    transform: translate3d(23vw, 102vh, 0);
  }

  to {
    transform: translate3d(17vw, -130vh, 0);
  }
}

.circle-container:nth-child(89) .circle {
  animation-delay: 1616ms;
}

.circle-container:nth-child(90) {
  width: 3px;
  height: 3px;
  animation-name: move-frames-90;
  animation-duration: 35015ms;
  animation-delay: 2754ms;
}

@keyframes move-frames-90 {
  from {
    transform: translate3d(60vw, 107vh, 0);
  }

  to {
    transform: translate3d(91vw, -135vh, 0);
  }
}

.circle-container:nth-child(90) .circle {
  animation-delay: 52ms;
}

.circle-container:nth-child(91) {
  width: 7px;
  height: 7px;
  animation-name: move-frames-91;
  animation-duration: 29922ms;
  animation-delay: 24664ms;
}

@keyframes move-frames-91 {
  from {
    transform: translate3d(39vw, 107vh, 0);
  }

  to {
    transform: translate3d(42vw, -123vh, 0);
  }
}

.circle-container:nth-child(91) .circle {
  animation-delay: 3853ms;
}

.circle-container:nth-child(92) {
  width: 3px;
  height: 3px;
  animation-name: move-frames-92;
  animation-duration: 30412ms;
  animation-delay: 27651ms;
}

@keyframes move-frames-92 {
  from {
    transform: translate3d(30vw, 103vh, 0);
  }

  to {
    transform: translate3d(28vw, -122vh, 0);
  }
}

.circle-container:nth-child(92) .circle {
  animation-delay: 3770ms;
}

.circle-container:nth-child(93) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-93;
  animation-duration: 30673ms;
  animation-delay: 30437ms;
}

@keyframes move-frames-93 {
  from {
    transform: translate3d(82vw, 108vh, 0);
  }

  to {
    transform: translate3d(90vw, -121vh, 0);
  }
}

.circle-container:nth-child(93) .circle {
  animation-delay: 148ms;
}

.circle-container:nth-child(94) {
  width: 6px;
  height: 6px;
  animation-name: move-frames-94;
  animation-duration: 36996ms;
  animation-delay: 25421ms;
}

@keyframes move-frames-94 {
  from {
    transform: translate3d(63vw, 109vh, 0);
  }

  to {
    transform: translate3d(45vw, -112vh, 0);
  }
}

.circle-container:nth-child(94) .circle {
  animation-delay: 3782ms;
}

.circle-container:nth-child(95) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-95;
  animation-duration: 34278ms;
  animation-delay: 15053ms;
}

@keyframes move-frames-95 {
  from {
    transform: translate3d(18vw, 102vh, 0);
  }

  to {
    transform: translate3d(50vw, -113vh, 0);
  }
}

.circle-container:nth-child(95) .circle {
  animation-delay: 3572ms;
}

.circle-container:nth-child(96) {
  width: 6px;
  height: 6px;
  animation-name: move-frames-96;
  animation-duration: 36352ms;
  animation-delay: 7787ms;
}

@keyframes move-frames-96 {
  from {
    transform: translate3d(98vw, 110vh, 0);
  }

  to {
    transform: translate3d(1vw, -128vh, 0);
  }
}

.circle-container:nth-child(96) .circle {
  animation-delay: 540ms;
}

.circle-container:nth-child(97) {
  width: 3px;
  height: 3px;
  animation-name: move-frames-97;
  animation-duration: 34336ms;
  animation-delay: 8207ms;
}

@keyframes move-frames-97 {
  from {
    transform: translate3d(1vw, 109vh, 0);
  }

  to {
    transform: translate3d(80vw, -116vh, 0);
  }
}

.circle-container:nth-child(97) .circle {
  animation-delay: 1597ms;
}

.circle-container:nth-child(98) {
  width: 3px;
  height: 3px;
  animation-name: move-frames-98;
  animation-duration: 30280ms;
  animation-delay: 2446ms;
}

@keyframes move-frames-98 {
  from {
    transform: translate3d(50vw, 110vh, 0);
  }

  to {
    transform: translate3d(1vw, -135vh, 0);
  }
}

.circle-container:nth-child(98) .circle {
  animation-delay: 2699ms;
}

.circle-container:nth-child(99) {
  width: 2px;
  height: 2px;
  animation-name: move-frames-99;
  animation-duration: 30764ms;
  animation-delay: 20395ms;
}

@keyframes move-frames-99 {
  from {
    transform: translate3d(51vw, 102vh, 0);
  }

  to {
    transform: translate3d(48vw, -112vh, 0);
  }
}

.circle-container:nth-child(99) .circle {
  animation-delay: 2112ms;
}

.circle-container:nth-child(100) {
  width: 7px;
  height: 7px;
  animation-name: move-frames-100;
  animation-duration: 36573ms;
  animation-delay: 11074ms;
}

@keyframes move-frames-100 {
  from {
    transform: translate3d(68vw, 110vh, 0);
  }

  to {
    transform: translate3d(3vw, -125vh, 0);
  }
}

.circle-container:nth-child(100) .circle {
  animation-delay: 2668ms;
}

.circle-container:nth-child(101) {
  width: 1px;
  height: 1px;
  animation-name: move-frames-101;
  animation-duration: 28523ms;
  animation-delay: 31289ms;
}

@keyframes move-frames-101 {
  from {
    transform: translate3d(88vw, 105vh, 0);
  }

  to {
    transform: translate3d(8vw, -128vh, 0);
  }
}

.circle-container:nth-child(101) .circle {
  animation-delay: 2330ms;
}

.circle-container:nth-child(102) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-102;
  animation-duration: 29692ms;
  animation-delay: 31983ms;
}

@keyframes move-frames-102 {
  from {
    transform: translate3d(86vw, 107vh, 0);
  }

  to {
    transform: translate3d(8vw, -131vh, 0);
  }
}

.circle-container:nth-child(102) .circle {
  animation-delay: 1442ms;
}

.circle-container:nth-child(103) {
  width: 6px;
  height: 6px;
  animation-name: move-frames-103;
  animation-duration: 33089ms;
  animation-delay: 2646ms;
}

@keyframes move-frames-103 {
  from {
    transform: translate3d(79vw, 104vh, 0);
  }

  to {
    transform: translate3d(36vw, -133vh, 0);
  }
}

.circle-container:nth-child(103) .circle {
  animation-delay: 1680ms;
}

.circle-container:nth-child(104) {
  width: 6px;
  height: 6px;
  animation-name: move-frames-104;
  animation-duration: 28216ms;
  animation-delay: 2504ms;
}

@keyframes move-frames-104 {
  from {
    transform: translate3d(36vw, 103vh, 0);
  }

  to {
    transform: translate3d(29vw, -111vh, 0);
  }
}

.circle-container:nth-child(104) .circle {
  animation-delay: 1400ms;
}

.circle-container:nth-child(105) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-105;
  animation-duration: 28296ms;
  animation-delay: 12554ms;
}

@keyframes move-frames-105 {
  from {
    transform: translate3d(17vw, 106vh, 0);
  }

  to {
    transform: translate3d(62vw, -107vh, 0);
  }
}

.circle-container:nth-child(105) .circle {
  animation-delay: 2635ms;
}

.circle-container:nth-child(106) {
  width: 3px;
  height: 3px;
  animation-name: move-frames-106;
  animation-duration: 29843ms;
  animation-delay: 17378ms;
}

@keyframes move-frames-106 {
  from {
    transform: translate3d(1vw, 101vh, 0);
  }

  to {
    transform: translate3d(72vw, -121vh, 0);
  }
}

.circle-container:nth-child(106) .circle {
  animation-delay: 1978ms;
}

.circle-container:nth-child(107) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-107;
  animation-duration: 32915ms;
  animation-delay: 9027ms;
}

@keyframes move-frames-107 {
  from {
    transform: translate3d(48vw, 102vh, 0);
  }

  to {
    transform: translate3d(30vw, -105vh, 0);
  }
}

.circle-container:nth-child(107) .circle {
  animation-delay: 413ms;
}

.circle-container:nth-child(108) {
  width: 4px;
  height: 4px;
  animation-name: move-frames-108;
  animation-duration: 30708ms;
  animation-delay: 6310ms;
}

@keyframes move-frames-108 {
  from {
    transform: translate3d(9vw, 110vh, 0);
  }

  to {
    transform: translate3d(76vw, -120vh, 0);
  }
}

.circle-container:nth-child(108) .circle {
  animation-delay: 827ms;
}

.circle-container:nth-child(109) {
  width: 5px;
  height: 5px;
  animation-name: move-frames-109;
  animation-duration: 32754ms;
  animation-delay: 1323ms;
}

@keyframes move-frames-109 {
  from {
    transform: translate3d(93vw, 102vh, 0);
  }

  to {
    transform: translate3d(66vw, -128vh, 0);
  }
}

.circle-container:nth-child(109) .circle {
  animation-delay: 522ms;
}

.circle-container:nth-child(110) {
  width: 1px;
  height: 1px;
  animation-name: move-frames-110;
  animation-duration: 36918ms;
  animation-delay: 23354ms;
}

@keyframes move-frames-110 {
  from {
    transform: translate3d(57vw, 107vh, 0);
  }

  to {
    transform: translate3d(12vw, -127vh, 0);
  }
}

.circle-container:nth-child(110) .circle {
  animation-delay: 1414ms;
}

.circle-container:nth-child(111) {
  width: 3px;
  height: 3px;
  animation-name: move-frames-111;
  animation-duration: 31882ms;
  animation-delay: 14617ms;
}

@keyframes move-frames-111 {
  from {
    transform: translate3d(67vw, 102vh, 0);
  }

  to {
    transform: translate3d(95vw, -117vh, 0);
  }
}

.circle-container:nth-child(111) .circle {
  animation-delay: 1325ms;
}

.circle-container:nth-child(112) {
  width: 7px;
  height: 7px;
  animation-name: move-frames-112;
  animation-duration: 28050ms;
  animation-delay: 9538ms;
}

@keyframes move-frames-112 {
  from {
    transform: translate3d(29vw, 102vh, 0);
  }

  to {
    transform: translate3d(5vw, -120vh, 0);
  }
}

.circle-container:nth-child(112) .circle {
  animation-delay: 2354ms;
}

.circle-container:nth-child(113) {
  width: 6px;
  height: 6px;
  animation-name: move-frames-113;
  animation-duration: 32324ms;
  animation-delay: 14845ms;
}

@keyframes move-frames-113 {
  from {
    transform: translate3d(29vw, 104vh, 0);
  }

  to {
    transform: translate3d(13vw, -131vh, 0);
  }
}

.circle-container:nth-child(113) .circle {
  animation-delay: 3998ms;
}

.circle-container:nth-child(114) {
  width: 2px;
  height: 2px;
  animation-name: move-frames-114;
  animation-duration: 35398ms;
  animation-delay: 4762ms;
}

@keyframes move-frames-114 {
  from {
    transform: translate3d(29vw, 107vh, 0);
  }

  to {
    transform: translate3d(47vw, -120vh, 0);
  }
}

.circle-container:nth-child(114) .circle {
  animation-delay: 3927ms;
}

.circle-container:nth-child(115) {
  width: 4px;
  height: 4px;
  animation-name: move-frames-115;
  animation-duration: 30898ms;
  animation-delay: 20843ms;
}

@keyframes move-frames-115 {
  from {
    transform: translate3d(12vw, 106vh, 0);
  }

  to {
    transform: translate3d(1vw, -120vh, 0);
  }
}

.circle-container:nth-child(115) .circle {
  animation-delay: 2357ms;
}

.circle-container:nth-child(116) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-116;
  animation-duration: 35416ms;
  animation-delay: 36961ms;
}

@keyframes move-frames-116 {
  from {
    transform: translate3d(43vw, 107vh, 0);
  }

  to {
    transform: translate3d(68vw, -113vh, 0);
  }
}

.circle-container:nth-child(116) .circle {
  animation-delay: 2843ms;
}

.circle-container:nth-child(117) {
  width: 4px;
  height: 4px;
  animation-name: move-frames-117;
  animation-duration: 29311ms;
  animation-delay: 4542ms;
}

@keyframes move-frames-117 {
  from {
    transform: translate3d(84vw, 104vh, 0);
  }

  to {
    transform: translate3d(8vw, -133vh, 0);
  }
}

.circle-container:nth-child(117) .circle {
  animation-delay: 2364ms;
}

.circle-container:nth-child(118) {
  width: 2px;
  height: 2px;
  animation-name: move-frames-118;
  animation-duration: 33319ms;
  animation-delay: 16793ms;
}

@keyframes move-frames-118 {
  from {
    transform: translate3d(30vw, 107vh, 0);
  }

  to {
    transform: translate3d(79vw, -133vh, 0);
  }
}

.circle-container:nth-child(118) .circle {
  animation-delay: 197ms;
}

.circle-container:nth-child(119) {
  width: 6px;
  height: 6px;
  animation-name: move-frames-119;
  animation-duration: 29234ms;
  animation-delay: 10990ms;
}

@keyframes move-frames-119 {
  from {
    transform: translate3d(68vw, 105vh, 0);
  }

  to {
    transform: translate3d(6vw, -115vh, 0);
  }
}

.circle-container:nth-child(119) .circle {
  animation-delay: 3547ms;
}

.circle-container:nth-child(120) {
  width: 6px;
  height: 6px;
  animation-name: move-frames-120;
  animation-duration: 31805ms;
  animation-delay: 17750ms;
}

@keyframes move-frames-120 {
  from {
    transform: translate3d(21vw, 109vh, 0);
  }

  to {
    transform: translate3d(46vw, -112vh, 0);
  }
}

.circle-container:nth-child(120) .circle {
  animation-delay: 1935ms;
}

.circle-container:nth-child(121) {
  width: 2px;
  height: 2px;
  animation-name: move-frames-121;
  animation-duration: 32302ms;
  animation-delay: 23955ms;
}

@keyframes move-frames-121 {
  from {
    transform: translate3d(51vw, 104vh, 0);
  }

  to {
    transform: translate3d(67vw, -127vh, 0);
  }
}

.circle-container:nth-child(121) .circle {
  animation-delay: 2502ms;
}

.circle-container:nth-child(122) {
  width: 4px;
  height: 4px;
  animation-name: move-frames-122;
  animation-duration: 35879ms;
  animation-delay: 13757ms;
}

@keyframes move-frames-122 {
  from {
    transform: translate3d(72vw, 103vh, 0);
  }

  to {
    transform: translate3d(83vw, -119vh, 0);
  }
}

.circle-container:nth-child(122) .circle {
  animation-delay: 2322ms;
}

.circle-container:nth-child(123) {
  width: 6px;
  height: 6px;
  animation-name: move-frames-123;
  animation-duration: 35419ms;
  animation-delay: 30444ms;
}

@keyframes move-frames-123 {
  from {
    transform: translate3d(92vw, 110vh, 0);
  }

  to {
    transform: translate3d(43vw, -122vh, 0);
  }
}

.circle-container:nth-child(123) .circle {
  animation-delay: 2601ms;
}

.circle-container:nth-child(124) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-124;
  animation-duration: 32951ms;
  animation-delay: 32337ms;
}

@keyframes move-frames-124 {
  from {
    transform: translate3d(44vw, 106vh, 0);
  }

  to {
    transform: translate3d(51vw, -118vh, 0);
  }
}

.circle-container:nth-child(124) .circle {
  animation-delay: 2705ms;
}

.circle-container:nth-child(125) {
  width: 4px;
  height: 4px;
  animation-name: move-frames-125;
  animation-duration: 29779ms;
  animation-delay: 27590ms;
}

@keyframes move-frames-125 {
  from {
    transform: translate3d(35vw, 105vh, 0);
  }

  to {
    transform: translate3d(50vw, -128vh, 0);
  }
}

.circle-container:nth-child(125) .circle {
  animation-delay: 428ms;
}

.circle-container:nth-child(126) {
  width: 6px;
  height: 6px;
  animation-name: move-frames-126;
  animation-duration: 36600ms;
  animation-delay: 8829ms;
}

@keyframes move-frames-126 {
  from {
    transform: translate3d(62vw, 104vh, 0);
  }

  to {
    transform: translate3d(23vw, -116vh, 0);
  }
}

.circle-container:nth-child(126) .circle {
  animation-delay: 172ms;
}

.circle-container:nth-child(127) {
  width: 5px;
  height: 5px;
  animation-name: move-frames-127;
  animation-duration: 34783ms;
  animation-delay: 22131ms;
}

@keyframes move-frames-127 {
  from {
    transform: translate3d(19vw, 104vh, 0);
  }

  to {
    transform: translate3d(51vw, -127vh, 0);
  }
}

.circle-container:nth-child(127) .circle {
  animation-delay: 454ms;
}

.circle-container:nth-child(128) {
  width: 3px;
  height: 3px;
  animation-name: move-frames-128;
  animation-duration: 28839ms;
  animation-delay: 9255ms;
}

@keyframes move-frames-128 {
  from {
    transform: translate3d(77vw, 104vh, 0);
  }

  to {
    transform: translate3d(45vw, -108vh, 0);
  }
}

.circle-container:nth-child(128) .circle {
  animation-delay: 1956ms;
}

.circle-container:nth-child(129) {
  width: 6px;
  height: 6px;
  animation-name: move-frames-129;
  animation-duration: 35746ms;
  animation-delay: 16012ms;
}

@keyframes move-frames-129 {
  from {
    transform: translate3d(77vw, 109vh, 0);
  }

  to {
    transform: translate3d(8vw, -112vh, 0);
  }
}

.circle-container:nth-child(129) .circle {
  animation-delay: 1205ms;
}

.circle-container:nth-child(130) {
  width: 5px;
  height: 5px;
  animation-name: move-frames-130;
  animation-duration: 30559ms;
  animation-delay: 15026ms;
}

@keyframes move-frames-130 {
  from {
    transform: translate3d(78vw, 108vh, 0);
  }

  to {
    transform: translate3d(45vw, -133vh, 0);
  }
}

.circle-container:nth-child(130) .circle {
  animation-delay: 3322ms;
}

.circle-container:nth-child(131) {
  width: 7px;
  height: 7px;
  animation-name: move-frames-131;
  animation-duration: 30652ms;
  animation-delay: 7953ms;
}

@keyframes move-frames-131 {
  from {
    transform: translate3d(59vw, 105vh, 0);
  }

  to {
    transform: translate3d(50vw, -112vh, 0);
  }
}

.circle-container:nth-child(131) .circle {
  animation-delay: 3396ms;
}

.circle-container:nth-child(132) {
  width: 2px;
  height: 2px;
  animation-name: move-frames-132;
  animation-duration: 34797ms;
  animation-delay: 7918ms;
}

@keyframes move-frames-132 {
  from {
    transform: translate3d(42vw, 109vh, 0);
  }

  to {
    transform: translate3d(33vw, -128vh, 0);
  }
}

.circle-container:nth-child(132) .circle {
  animation-delay: 3655ms;
}

.circle-container:nth-child(133) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-133;
  animation-duration: 33826ms;
  animation-delay: 347ms;
}

@keyframes move-frames-133 {
  from {
    transform: translate3d(13vw, 107vh, 0);
  }

  to {
    transform: translate3d(4vw, -137vh, 0);
  }
}

.circle-container:nth-child(133) .circle {
  animation-delay: 2946ms;
}

.circle-container:nth-child(134) {
  width: 4px;
  height: 4px;
  animation-name: move-frames-134;
  animation-duration: 30671ms;
  animation-delay: 18532ms;
}

@keyframes move-frames-134 {
  from {
    transform: translate3d(34vw, 106vh, 0);
  }

  to {
    transform: translate3d(4vw, -110vh, 0);
  }
}

.circle-container:nth-child(134) .circle {
  animation-delay: 1745ms;
}

.circle-container:nth-child(135) {
  width: 5px;
  height: 5px;
  animation-name: move-frames-135;
  animation-duration: 33619ms;
  animation-delay: 32070ms;
}

@keyframes move-frames-135 {
  from {
    transform: translate3d(54vw, 103vh, 0);
  }

  to {
    transform: translate3d(94vw, -110vh, 0);
  }
}

.circle-container:nth-child(135) .circle {
  animation-delay: 2720ms;
}

.circle-container:nth-child(136) {
  width: 7px;
  height: 7px;
  animation-name: move-frames-136;
  animation-duration: 30514ms;
  animation-delay: 12349ms;
}

@keyframes move-frames-136 {
  from {
    transform: translate3d(3vw, 108vh, 0);
  }

  to {
    transform: translate3d(6vw, -126vh, 0);
  }
}

.circle-container:nth-child(136) .circle {
  animation-delay: 2399ms;
}

.circle-container:nth-child(137) {
  width: 3px;
  height: 3px;
  animation-name: move-frames-137;
  animation-duration: 30968ms;
  animation-delay: 2923ms;
}

@keyframes move-frames-137 {
  from {
    transform: translate3d(92vw, 107vh, 0);
  }

  to {
    transform: translate3d(18vw, -132vh, 0);
  }
}

.circle-container:nth-child(137) .circle {
  animation-delay: 1132ms;
}

.circle-container:nth-child(138) {
  width: 1px;
  height: 1px;
  animation-name: move-frames-138;
  animation-duration: 32311ms;
  animation-delay: 20406ms;
}

@keyframes move-frames-138 {
  from {
    transform: translate3d(61vw, 103vh, 0);
  }

  to {
    transform: translate3d(53vw, -106vh, 0);
  }
}

.circle-container:nth-child(138) .circle {
  animation-delay: 814ms;
}

.circle-container:nth-child(139) {
  width: 2px;
  height: 2px;
  animation-name: move-frames-139;
  animation-duration: 33100ms;
  animation-delay: 12669ms;
}

@keyframes move-frames-139 {
  from {
    transform: translate3d(11vw, 103vh, 0);
  }

  to {
    transform: translate3d(34vw, -116vh, 0);
  }
}

.circle-container:nth-child(139) .circle {
  animation-delay: 2810ms;
}

.circle-container:nth-child(140) {
  width: 4px;
  height: 4px;
  animation-name: move-frames-140;
  animation-duration: 29142ms;
  animation-delay: 19619ms;
}

@keyframes move-frames-140 {
  from {
    transform: translate3d(22vw, 104vh, 0);
  }

  to {
    transform: translate3d(77vw, -124vh, 0);
  }
}

.circle-container:nth-child(140) .circle {
  animation-delay: 2703ms;
}

.circle-container:nth-child(141) {
  width: 3px;
  height: 3px;
  animation-name: move-frames-141;
  animation-duration: 28842ms;
  animation-delay: 32278ms;
}

@keyframes move-frames-141 {
  from {
    transform: translate3d(31vw, 107vh, 0);
  }

  to {
    transform: translate3d(13vw, -135vh, 0);
  }
}

.circle-container:nth-child(141) .circle {
  animation-delay: 576ms;
}

.circle-container:nth-child(142) {
  width: 3px;
  height: 3px;
  animation-name: move-frames-142;
  animation-duration: 29854ms;
  animation-delay: 1500ms;
}

@keyframes move-frames-142 {
  from {
    transform: translate3d(42vw, 103vh, 0);
  }

  to {
    transform: translate3d(58vw, -128vh, 0);
  }
}

.circle-container:nth-child(142) .circle {
  animation-delay: 3556ms;
}

.circle-container:nth-child(143) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-143;
  animation-duration: 28586ms;
  animation-delay: 8245ms;
}

@keyframes move-frames-143 {
  from {
    transform: translate3d(7vw, 101vh, 0);
  }

  to {
    transform: translate3d(15vw, -109vh, 0);
  }
}

.circle-container:nth-child(143) .circle {
  animation-delay: 2536ms;
}

.circle-container:nth-child(144) {
  width: 3px;
  height: 3px;
  animation-name: move-frames-144;
  animation-duration: 32568ms;
  animation-delay: 23743ms;
}

@keyframes move-frames-144 {
  from {
    transform: translate3d(97vw, 104vh, 0);
  }

  to {
    transform: translate3d(73vw, -123vh, 0);
  }
}

.circle-container:nth-child(144) .circle {
  animation-delay: 2389ms;
}

.circle-container:nth-child(145) {
  width: 4px;
  height: 4px;
  animation-name: move-frames-145;
  animation-duration: 28847ms;
  animation-delay: 15605ms;
}

@keyframes move-frames-145 {
  from {
    transform: translate3d(58vw, 105vh, 0);
  }

  to {
    transform: translate3d(89vw, -132vh, 0);
  }
}

.circle-container:nth-child(145) .circle {
  animation-delay: 927ms;
}

.circle-container:nth-child(146) {
  width: 2px;
  height: 2px;
  animation-name: move-frames-146;
  animation-duration: 36333ms;
  animation-delay: 12297ms;
}

@keyframes move-frames-146 {
  from {
    transform: translate3d(27vw, 101vh, 0);
  }

  to {
    transform: translate3d(50vw, -108vh, 0);
  }
}

.circle-container:nth-child(146) .circle {
  animation-delay: 3498ms;
}

.circle-container:nth-child(147) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-147;
  animation-duration: 34851ms;
  animation-delay: 33163ms;
}

@keyframes move-frames-147 {
  from {
    transform: translate3d(87vw, 103vh, 0);
  }

  to {
    transform: translate3d(32vw, -115vh, 0);
  }
}

.circle-container:nth-child(147) .circle {
  animation-delay: 3690ms;
}

.circle-container:nth-child(148) {
  width: 5px;
  height: 5px;
  animation-name: move-frames-148;
  animation-duration: 30809ms;
  animation-delay: 8062ms;
}

@keyframes move-frames-148 {
  from {
    transform: translate3d(3vw, 101vh, 0);
  }

  to {
    transform: translate3d(69vw, -104vh, 0);
  }
}

.circle-container:nth-child(148) .circle {
  animation-delay: 1509ms;
}

.circle-container:nth-child(149) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-149;
  animation-duration: 34528ms;
  animation-delay: 6346ms;
}

@keyframes move-frames-149 {
  from {
    transform: translate3d(83vw, 108vh, 0);
  }

  to {
    transform: translate3d(82vw, -121vh, 0);
  }
}

.circle-container:nth-child(149) .circle {
  animation-delay: 926ms;
}

.circle-container:nth-child(150) {
  width: 4px;
  height: 4px;
  animation-name: move-frames-150;
  animation-duration: 30770ms;
  animation-delay: 7697ms;
}

@keyframes move-frames-150 {
  from {
    transform: translate3d(64vw, 103vh, 0);
  }

  to {
    transform: translate3d(6vw, -104vh, 0);
  }
}

.circle-container:nth-child(150) .circle {
  animation-delay: 2081ms;
}

.circle-container:nth-child(151) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-151;
  animation-duration: 28560ms;
  animation-delay: 10814ms;
}

@keyframes move-frames-151 {
  from {
    transform: translate3d(72vw, 102vh, 0);
  }

  to {
    transform: translate3d(27vw, -126vh, 0);
  }
}

.circle-container:nth-child(151) .circle {
  animation-delay: 1213ms;
}

.circle-container:nth-child(152) {
  width: 2px;
  height: 2px;
  animation-name: move-frames-152;
  animation-duration: 29286ms;
  animation-delay: 9779ms;
}

@keyframes move-frames-152 {
  from {
    transform: translate3d(3vw, 110vh, 0);
  }

  to {
    transform: translate3d(6vw, -111vh, 0);
  }
}

.circle-container:nth-child(152) .circle {
  animation-delay: 1718ms;
}

.circle-container:nth-child(153) {
  width: 5px;
  height: 5px;
  animation-name: move-frames-153;
  animation-duration: 34100ms;
  animation-delay: 36677ms;
}

@keyframes move-frames-153 {
  from {
    transform: translate3d(35vw, 109vh, 0);
  }

  to {
    transform: translate3d(22vw, -116vh, 0);
  }
}

.circle-container:nth-child(153) .circle {
  animation-delay: 2678ms;
}

.circle-container:nth-child(154) {
  width: 6px;
  height: 6px;
  animation-name: move-frames-154;
  animation-duration: 29188ms;
  animation-delay: 36127ms;
}

@keyframes move-frames-154 {
  from {
    transform: translate3d(30vw, 107vh, 0);
  }

  to {
    transform: translate3d(58vw, -113vh, 0);
  }
}

.circle-container:nth-child(154) .circle {
  animation-delay: 707ms;
}

.circle-container:nth-child(155) {
  width: 1px;
  height: 1px;
  animation-name: move-frames-155;
  animation-duration: 28670ms;
  animation-delay: 4776ms;
}

@keyframes move-frames-155 {
  from {
    transform: translate3d(96vw, 108vh, 0);
  }

  to {
    transform: translate3d(63vw, -119vh, 0);
  }
}

.circle-container:nth-child(155) .circle {
  animation-delay: 3236ms;
}

.circle-container:nth-child(156) {
  width: 3px;
  height: 3px;
  animation-name: move-frames-156;
  animation-duration: 35821ms;
  animation-delay: 29122ms;
}

@keyframes move-frames-156 {
  from {
    transform: translate3d(17vw, 103vh, 0);
  }

  to {
    transform: translate3d(81vw, -131vh, 0);
  }
}

.circle-container:nth-child(156) .circle {
  animation-delay: 2378ms;
}

.circle-container:nth-child(157) {
  width: 5px;
  height: 5px;
  animation-name: move-frames-157;
  animation-duration: 35181ms;
  animation-delay: 1035ms;
}

@keyframes move-frames-157 {
  from {
    transform: translate3d(27vw, 101vh, 0);
  }

  to {
    transform: translate3d(37vw, -111vh, 0);
  }
}

.circle-container:nth-child(157) .circle {
  animation-delay: 2649ms;
}

.circle-container:nth-child(158) {
  width: 7px;
  height: 7px;
  animation-name: move-frames-158;
  animation-duration: 36586ms;
  animation-delay: 20242ms;
}

@keyframes move-frames-158 {
  from {
    transform: translate3d(56vw, 110vh, 0);
  }

  to {
    transform: translate3d(28vw, -122vh, 0);
  }
}

.circle-container:nth-child(158) .circle {
  animation-delay: 1998ms;
}

.circle-container:nth-child(159) {
  width: 7px;
  height: 7px;
  animation-name: move-frames-159;
  animation-duration: 30796ms;
  animation-delay: 28250ms;
}

@keyframes move-frames-159 {
  from {
    transform: translate3d(8vw, 105vh, 0);
  }

  to {
    transform: translate3d(70vw, -116vh, 0);
  }
}

.circle-container:nth-child(159) .circle {
  animation-delay: 153ms;
}

.circle-container:nth-child(160) {
  width: 4px;
  height: 4px;
  animation-name: move-frames-160;
  animation-duration: 28556ms;
  animation-delay: 7689ms;
}

@keyframes move-frames-160 {
  from {
    transform: translate3d(87vw, 107vh, 0);
  }

  to {
    transform: translate3d(52vw, -136vh, 0);
  }
}

.circle-container:nth-child(160) .circle {
  animation-delay: 1324ms;
}

.circle-container:nth-child(161) {
  width: 6px;
  height: 6px;
  animation-name: move-frames-161;
  animation-duration: 32878ms;
  animation-delay: 24880ms;
}

@keyframes move-frames-161 {
  from {
    transform: translate3d(84vw, 110vh, 0);
  }

  to {
    transform: translate3d(67vw, -133vh, 0);
  }
}

.circle-container:nth-child(161) .circle {
  animation-delay: 2229ms;
}

.circle-container:nth-child(162) {
  width: 7px;
  height: 7px;
  animation-name: move-frames-162;
  animation-duration: 35985ms;
  animation-delay: 6720ms;
}

@keyframes move-frames-162 {
  from {
    transform: translate3d(9vw, 108vh, 0);
  }

  to {
    transform: translate3d(10vw, -129vh, 0);
  }
}

.circle-container:nth-child(162) .circle {
  animation-delay: 1067ms;
}

.circle-container:nth-child(163) {
  width: 4px;
  height: 4px;
  animation-name: move-frames-163;
  animation-duration: 28708ms;
  animation-delay: 8666ms;
}

@keyframes move-frames-163 {
  from {
    transform: translate3d(72vw, 108vh, 0);
  }

  to {
    transform: translate3d(6vw, -135vh, 0);
  }
}

.circle-container:nth-child(163) .circle {
  animation-delay: 1881ms;
}

.circle-container:nth-child(164) {
  width: 1px;
  height: 1px;
  animation-name: move-frames-164;
  animation-duration: 36437ms;
  animation-delay: 1481ms;
}

@keyframes move-frames-164 {
  from {
    transform: translate3d(72vw, 110vh, 0);
  }

  to {
    transform: translate3d(76vw, -127vh, 0);
  }
}

.circle-container:nth-child(164) .circle {
  animation-delay: 3155ms;
}

.circle-container:nth-child(165) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-165;
  animation-duration: 31058ms;
  animation-delay: 14360ms;
}

@keyframes move-frames-165 {
  from {
    transform: translate3d(81vw, 101vh, 0);
  }

  to {
    transform: translate3d(93vw, -114vh, 0);
  }
}

.circle-container:nth-child(165) .circle {
  animation-delay: 3604ms;
}

.circle-container:nth-child(166) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-166;
  animation-duration: 32090ms;
  animation-delay: 22575ms;
}

@keyframes move-frames-166 {
  from {
    transform: translate3d(61vw, 108vh, 0);
  }

  to {
    transform: translate3d(52vw, -109vh, 0);
  }
}

.circle-container:nth-child(166) .circle {
  animation-delay: 1792ms;
}

.circle-container:nth-child(167) {
  width: 2px;
  height: 2px;
  animation-name: move-frames-167;
  animation-duration: 32499ms;
  animation-delay: 32928ms;
}

@keyframes move-frames-167 {
  from {
    transform: translate3d(93vw, 107vh, 0);
  }

  to {
    transform: translate3d(70vw, -117vh, 0);
  }
}

.circle-container:nth-child(167) .circle {
  animation-delay: 2110ms;
}

.circle-container:nth-child(168) {
  width: 4px;
  height: 4px;
  animation-name: move-frames-168;
  animation-duration: 36364ms;
  animation-delay: 3776ms;
}

@keyframes move-frames-168 {
  from {
    transform: translate3d(48vw, 103vh, 0);
  }

  to {
    transform: translate3d(88vw, -130vh, 0);
  }
}

.circle-container:nth-child(168) .circle {
  animation-delay: 3697ms;
}

.circle-container:nth-child(169) {
  width: 7px;
  height: 7px;
  animation-name: move-frames-169;
  animation-duration: 30268ms;
  animation-delay: 27888ms;
}

@keyframes move-frames-169 {
  from {
    transform: translate3d(71vw, 101vh, 0);
  }

  to {
    transform: translate3d(80vw, -130vh, 0);
  }
}

.circle-container:nth-child(169) .circle {
  animation-delay: 610ms;
}

.circle-container:nth-child(170) {
  width: 7px;
  height: 7px;
  animation-name: move-frames-170;
  animation-duration: 29324ms;
  animation-delay: 29175ms;
}

@keyframes move-frames-170 {
  from {
    transform: translate3d(10vw, 102vh, 0);
  }

  to {
    transform: translate3d(51vw, -109vh, 0);
  }
}

.circle-container:nth-child(170) .circle {
  animation-delay: 1113ms;
}

.circle-container:nth-child(171) {
  width: 1px;
  height: 1px;
  animation-name: move-frames-171;
  animation-duration: 30376ms;
  animation-delay: 27683ms;
}

@keyframes move-frames-171 {
  from {
    transform: translate3d(60vw, 107vh, 0);
  }

  to {
    transform: translate3d(22vw, -122vh, 0);
  }
}

.circle-container:nth-child(171) .circle {
  animation-delay: 3952ms;
}

.circle-container:nth-child(172) {
  width: 7px;
  height: 7px;
  animation-name: move-frames-172;
  animation-duration: 32148ms;
  animation-delay: 6215ms;
}

@keyframes move-frames-172 {
  from {
    transform: translate3d(19vw, 101vh, 0);
  }

  to {
    transform: translate3d(77vw, -107vh, 0);
  }
}

.circle-container:nth-child(172) .circle {
  animation-delay: 2010ms;
}

.circle-container:nth-child(173) {
  width: 7px;
  height: 7px;
  animation-name: move-frames-173;
  animation-duration: 32116ms;
  animation-delay: 13013ms;
}

@keyframes move-frames-173 {
  from {
    transform: translate3d(36vw, 101vh, 0);
  }

  to {
    transform: translate3d(91vw, -118vh, 0);
  }
}

.circle-container:nth-child(173) .circle {
  animation-delay: 3209ms;
}

.circle-container:nth-child(174) {
  width: 7px;
  height: 7px;
  animation-name: move-frames-174;
  animation-duration: 29706ms;
  animation-delay: 25211ms;
}

@keyframes move-frames-174 {
  from {
    transform: translate3d(38vw, 105vh, 0);
  }

  to {
    transform: translate3d(62vw, -118vh, 0);
  }
}

.circle-container:nth-child(174) .circle {
  animation-delay: 1802ms;
}

.circle-container:nth-child(175) {
  width: 4px;
  height: 4px;
  animation-name: move-frames-175;
  animation-duration: 32301ms;
  animation-delay: 3418ms;
}

@keyframes move-frames-175 {
  from {
    transform: translate3d(54vw, 104vh, 0);
  }

  to {
    transform: translate3d(64vw, -109vh, 0);
  }
}

.circle-container:nth-child(175) .circle {
  animation-delay: 3009ms;
}

.circle-container:nth-child(176) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-176;
  animation-duration: 35715ms;
  animation-delay: 33913ms;
}

@keyframes move-frames-176 {
  from {
    transform: translate3d(70vw, 102vh, 0);
  }

  to {
    transform: translate3d(53vw, -109vh, 0);
  }
}

.circle-container:nth-child(176) .circle {
  animation-delay: 1463ms;
}

.circle-container:nth-child(177) {
  width: 4px;
  height: 4px;
  animation-name: move-frames-177;
  animation-duration: 35462ms;
  animation-delay: 2981ms;
}

@keyframes move-frames-177 {
  from {
    transform: translate3d(92vw, 107vh, 0);
  }

  to {
    transform: translate3d(13vw, -134vh, 0);
  }
}

.circle-container:nth-child(177) .circle {
  animation-delay: 1937ms;
}

.circle-container:nth-child(178) {
  width: 5px;
  height: 5px;
  animation-name: move-frames-178;
  animation-duration: 34308ms;
  animation-delay: 3008ms;
}

@keyframes move-frames-178 {
  from {
    transform: translate3d(56vw, 102vh, 0);
  }

  to {
    transform: translate3d(88vw, -115vh, 0);
  }
}

.circle-container:nth-child(178) .circle {
  animation-delay: 1040ms;
}

.circle-container:nth-child(179) {
  width: 1px;
  height: 1px;
  animation-name: move-frames-179;
  animation-duration: 36004ms;
  animation-delay: 16234ms;
}

@keyframes move-frames-179 {
  from {
    transform: translate3d(43vw, 108vh, 0);
  }

  to {
    transform: translate3d(83vw, -132vh, 0);
  }
}

.circle-container:nth-child(179) .circle {
  animation-delay: 778ms;
}

.circle-container:nth-child(180) {
  width: 7px;
  height: 7px;
  animation-name: move-frames-180;
  animation-duration: 29084ms;
  animation-delay: 13260ms;
}

@keyframes move-frames-180 {
  from {
    transform: translate3d(93vw, 110vh, 0);
  }

  to {
    transform: translate3d(15vw, -113vh, 0);
  }
}

.circle-container:nth-child(180) .circle {
  animation-delay: 1647ms;
}

.circle-container:nth-child(181) {
  width: 5px;
  height: 5px;
  animation-name: move-frames-181;
  animation-duration: 29436ms;
  animation-delay: 10433ms;
}

@keyframes move-frames-181 {
  from {
    transform: translate3d(61vw, 103vh, 0);
  }

  to {
    transform: translate3d(41vw, -129vh, 0);
  }
}

.circle-container:nth-child(181) .circle {
  animation-delay: 3247ms;
}

.circle-container:nth-child(182) {
  width: 7px;
  height: 7px;
  animation-name: move-frames-182;
  animation-duration: 32486ms;
  animation-delay: 34277ms;
}

@keyframes move-frames-182 {
  from {
    transform: translate3d(99vw, 103vh, 0);
  }

  to {
    transform: translate3d(39vw, -122vh, 0);
  }
}

.circle-container:nth-child(182) .circle {
  animation-delay: 2926ms;
}

.circle-container:nth-child(183) {
  width: 7px;
  height: 7px;
  animation-name: move-frames-183;
  animation-duration: 29582ms;
  animation-delay: 33520ms;
}

@keyframes move-frames-183 {
  from {
    transform: translate3d(87vw, 102vh, 0);
  }

  to {
    transform: translate3d(63vw, -114vh, 0);
  }
}

.circle-container:nth-child(183) .circle {
  animation-delay: 2334ms;
}

.circle-container:nth-child(184) {
  width: 3px;
  height: 3px;
  animation-name: move-frames-184;
  animation-duration: 34427ms;
  animation-delay: 29421ms;
}

@keyframes move-frames-184 {
  from {
    transform: translate3d(94vw, 106vh, 0);
  }

  to {
    transform: translate3d(23vw, -132vh, 0);
  }
}

.circle-container:nth-child(184) .circle {
  animation-delay: 1310ms;
}

.circle-container:nth-child(185) {
  width: 2px;
  height: 2px;
  animation-name: move-frames-185;
  animation-duration: 36789ms;
  animation-delay: 28016ms;
}

@keyframes move-frames-185 {
  from {
    transform: translate3d(39vw, 109vh, 0);
  }

  to {
    transform: translate3d(3vw, -119vh, 0);
  }
}

.circle-container:nth-child(185) .circle {
  animation-delay: 2964ms;
}

.circle-container:nth-child(186) {
  width: 5px;
  height: 5px;
  animation-name: move-frames-186;
  animation-duration: 28192ms;
  animation-delay: 19752ms;
}

@keyframes move-frames-186 {
  from {
    transform: translate3d(50vw, 105vh, 0);
  }

  to {
    transform: translate3d(53vw, -118vh, 0);
  }
}

.circle-container:nth-child(186) .circle {
  animation-delay: 3487ms;
}

.circle-container:nth-child(187) {
  width: 1px;
  height: 1px;
  animation-name: move-frames-187;
  animation-duration: 32598ms;
  animation-delay: 28086ms;
}

@keyframes move-frames-187 {
  from {
    transform: translate3d(25vw, 107vh, 0);
  }

  to {
    transform: translate3d(53vw, -135vh, 0);
  }
}

.circle-container:nth-child(187) .circle {
  animation-delay: 2062ms;
}

.circle-container:nth-child(188) {
  width: 5px;
  height: 5px;
  animation-name: move-frames-188;
  animation-duration: 34996ms;
  animation-delay: 34611ms;
}

@keyframes move-frames-188 {
  from {
    transform: translate3d(53vw, 105vh, 0);
  }

  to {
    transform: translate3d(17vw, -135vh, 0);
  }
}

.circle-container:nth-child(188) .circle {
  animation-delay: 1075ms;
}

.circle-container:nth-child(189) {
  width: 7px;
  height: 7px;
  animation-name: move-frames-189;
  animation-duration: 34992ms;
  animation-delay: 29331ms;
}

@keyframes move-frames-189 {
  from {
    transform: translate3d(17vw, 109vh, 0);
  }

  to {
    transform: translate3d(65vw, -111vh, 0);
  }
}

.circle-container:nth-child(189) .circle {
  animation-delay: 3685ms;
}

.circle-container:nth-child(190) {
  width: 1px;
  height: 1px;
  animation-name: move-frames-190;
  animation-duration: 28679ms;
  animation-delay: 22014ms;
}

@keyframes move-frames-190 {
  from {
    transform: translate3d(8vw, 108vh, 0);
  }

  to {
    transform: translate3d(18vw, -121vh, 0);
  }
}

.circle-container:nth-child(190) .circle {
  animation-delay: 1025ms;
}

.circle-container:nth-child(191) {
  width: 6px;
  height: 6px;
  animation-name: move-frames-191;
  animation-duration: 32860ms;
  animation-delay: 6635ms;
}

@keyframes move-frames-191 {
  from {
    transform: translate3d(89vw, 101vh, 0);
  }

  to {
    transform: translate3d(8vw, -110vh, 0);
  }
}

.circle-container:nth-child(191) .circle {
  animation-delay: 598ms;
}

.circle-container:nth-child(192) {
  width: 3px;
  height: 3px;
  animation-name: move-frames-192;
  animation-duration: 32380ms;
  animation-delay: 819ms;
}

@keyframes move-frames-192 {
  from {
    transform: translate3d(52vw, 107vh, 0);
  }

  to {
    transform: translate3d(84vw, -113vh, 0);
  }
}

.circle-container:nth-child(192) .circle {
  animation-delay: 2332ms;
}

.circle-container:nth-child(193) {
  width: 6px;
  height: 6px;
  animation-name: move-frames-193;
  animation-duration: 35727ms;
  animation-delay: 30722ms;
}

@keyframes move-frames-193 {
  from {
    transform: translate3d(52vw, 103vh, 0);
  }

  to {
    transform: translate3d(5vw, -112vh, 0);
  }
}

.circle-container:nth-child(193) .circle {
  animation-delay: 1039ms;
}

.circle-container:nth-child(194) {
  width: 7px;
  height: 7px;
  animation-name: move-frames-194;
  animation-duration: 29486ms;
  animation-delay: 30396ms;
}

@keyframes move-frames-194 {
  from {
    transform: translate3d(26vw, 102vh, 0);
  }

  to {
    transform: translate3d(47vw, -106vh, 0);
  }
}

.circle-container:nth-child(194) .circle {
  animation-delay: 2959ms;
}

.circle-container:nth-child(195) {
  width: 1px;
  height: 1px;
  animation-name: move-frames-195;
  animation-duration: 30782ms;
  animation-delay: 18293ms;
}

@keyframes move-frames-195 {
  from {
    transform: translate3d(28vw, 106vh, 0);
  }

  to {
    transform: translate3d(56vw, -122vh, 0);
  }
}

.circle-container:nth-child(195) .circle {
  animation-delay: 1808ms;
}

.circle-container:nth-child(196) {
  width: 1px;
  height: 1px;
  animation-name: move-frames-196;
  animation-duration: 31914ms;
  animation-delay: 26157ms;
}

@keyframes move-frames-196 {
  from {
    transform: translate3d(66vw, 108vh, 0);
  }

  to {
    transform: translate3d(30vw, -127vh, 0);
  }
}

.circle-container:nth-child(196) .circle {
  animation-delay: 3590ms;
}

.circle-container:nth-child(197) {
  width: 2px;
  height: 2px;
  animation-name: move-frames-197;
  animation-duration: 33077ms;
  animation-delay: 6017ms;
}

@keyframes move-frames-197 {
  from {
    transform: translate3d(30vw, 108vh, 0);
  }

  to {
    transform: translate3d(6vw, -123vh, 0);
  }
}

.circle-container:nth-child(197) .circle {
  animation-delay: 2841ms;
}

.circle-container:nth-child(198) {
  width: 8px;
  height: 8px;
  animation-name: move-frames-198;
  animation-duration: 35909ms;
  animation-delay: 34181ms;
}

@keyframes move-frames-198 {
  from {
    transform: translate3d(74vw, 102vh, 0);
  }

  to {
    transform: translate3d(38vw, -107vh, 0);
  }
}

.circle-container:nth-child(198) .circle {
  animation-delay: 2250ms;
}

.circle-container:nth-child(199) {
  width: 4px;
  height: 4px;
  animation-name: move-frames-199;
  animation-duration: 31127ms;
  animation-delay: 24663ms;
}

@keyframes move-frames-199 {
  from {
    transform: translate3d(57vw, 107vh, 0);
  }

  to {
    transform: translate3d(100vw, -116vh, 0);
  }
}

.circle-container:nth-child(199) .circle {
  animation-delay: 2819ms;
}

.circle-container:nth-child(200) {
  width: 2px;
  height: 2px;
  animation-name: move-frames-200;
  animation-duration: 29622ms;
  animation-delay: 22763ms;
}

@keyframes move-frames-200 {
  from {
    transform: translate3d(46vw, 106vh, 0);
  }

  to {
    transform: translate3d(93vw, -135vh, 0);
  }
}

.circle-container:nth-child(200) .circle {
  animation-delay: 95ms;
}

/* circles animation on main ends*/

.token-det {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background-color: #0147a6 !important;
  border-radius: 70px;
  height: auto;
  justify-content: center;
  align-items: center;
}

.animal {
  position: relative;
  left: 0%;
  padding-top: 10vh;
}

/* .addRightBorder {
  border-right: 1px solid darkgrey;
}


.moveBorder{
  border-right:none;
  border-bottom: dotted black 2px;
} */
@media (max-width: 576px) {
  .Timerstting {
    padding: 25px !important;
    width: 60% !important;
  }
}



.cardssection {
  position: relative;
  background-image: url('./images/c0d3bfb4-aa82-4441-9dc0-ac0bd6962a76.webp');
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  z-index: 1;
}

.cardssection::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4); /* Black overlay, adjust opacity as needed */
  z-index: -1;
  pointer-events: none;
}

/* Ensures section content sits above the overlay */
.cardssection > * {
  position: relative;
  z-index: 2;
}