body {
    height: 100vh;
    width: 100vw;
    margin: 0;
    overflow: hidden;
    background: radial-gradient(#000000, #47003c, #000000, #000000, #000000);
  }

  .container, .container--2, .container--3, .container--4, .container--5, .container--6, .container--7, .container--8, .container--9 {
    width:100%;
    height: 100%;
    position: absolute;
    cursor: move;
    display: flex;
    align-items: center;
    justify-content: center;
    perspective: 50px;
    
  }

  .container .frame {
    width: 500px;
    height: 500px;
    position: absolute;
    border-radius: 50px;
    border: 5px #ff00dd solid;
    box-shadow: 
    0px 0px 20px #e401d1,
    inset 0px 0px 20px #c401d6,
    0px 0px 60px #f500e9,
    inset 0px 0px 60px #ea01ff;
    animation: breathing 3s ease-out infinite;
  }

  .container--2 .frame {
    width: 200px;
    height: 200px;
    position: absolute;
    left: 100px;
    top: 50px;
    border-radius: 50px;
    border: 5px rgb(1, 18, 255) solid;
    box-shadow: 
    0px 0px 20px rgb(1, 18, 255),
    inset 0px 0px 20px rgb(1, 18, 255),
    0px 0px 60px rgb(1, 18, 255),
    inset 0px 0px 60px rgb(1, 18, 255);
    animation: breathing 3s ease-out infinite;
  }

  .container--3 .frame {
    width: 200px;
    height: 200px;
    position: absolute;
    right: 100px;
    top: 50px;
    border-radius: 50px;
    border: 5px rgb(43, 255, 0) solid;
    box-shadow: 
    0px 0px 20px rgb(1, 255, 22),
    inset 0px 0px 20px rgb(1, 255, 1),
    0px 0px 60px rgb(31, 255, 1),
    inset 0px 0px 60px rgb(22, 255, 1);
    animation: breathing 3s ease-out infinite;
  }

  .container--4 .frame {
    width: 100px;
    height: 100px;
    position: absolute;
    right: 170px;
    top: 500px;
    border-radius: 50px;
    border: 5px rgb(255, 94, 0) solid;
    box-shadow: 
    0px 0px 20px rgb(255, 94, 0),
    inset 0px 0px 20px rgb(255, 94, 0),
    0px 0px 60px rgb(255, 94, 0),
    inset 0px 0px 60px rgb(255, 94, 0);
    animation: breathing 3s ease-out infinite;
  }

  .container--5 .frame {
    width: 150px;
    height: 150px;
    position: absolute;
    left: 20px;
    top: 200px;
    border-radius: 50px;
    border: 5px rgb(251, 255, 0) solid;
    box-shadow: 
    0px 0px 20px rgb(251, 255, 0),
    inset 0px 0px 20px rgb(251, 255, 0),
    0px 0px 60px rgb(251, 255, 0),
    inset 0px 0px 60px rgb(251, 255, 0);
    animation: breathing 3s ease-out infinite;
  }


  .container--7 .frame {
    width: 100px;
    height: 100px;
    position: absolute;
    left: 250px;
    top: 500px;
    border-radius: 50px;
    border: 5px rgb(255, 0, 0) solid;
    box-shadow: 
    0px 0px 20px rgb(255, 0, 0),
    inset 0px 0px 20px rgb(255, 0, 0),
    0px 0px 60px rgb(255, 0, 0),
    inset 0px 0px 60px rgb(255, 0, 0);
    animation: breathing 3s ease-out infinite;
  }

  .container--8 .frame {
    width: 120px;
    height: 120px;
    position: absolute;
    right: 150px;
    top: 570px;
    border-radius: 50px;
    border: 5px rgb(255, 0, 119) solid;
    box-shadow: 
    0px 0px 20px rgb(255, 0, 119),
    inset 0px 0px 20px rgb(255, 0, 119),
    0px 0px 60px rgb(255, 0, 119),
    inset 0px 0px 60px rgb(255, 0, 119);
    animation: breathing 3s ease-out infinite;
  }

  .container--9 .frame {
    width: 100px;
    height: 100px;
    position: absolute;
    left: 250px;
    top: 600px;
    border-radius: 50px;
    border: 5px rgb(0, 139, 30) solid;
    box-shadow: 
    0px 0px 20px rgb(0, 139, 30),
    inset 0px 0px 20px rgb(0, 139, 30),
    0px 0px 60px rgb(0, 139, 30),
    inset 0px 0px 60px rgb(0, 139, 30);
    animation: breathing 3s ease-out infinite;
  }

  .container--6 .frame {
    width: 180px;
    height: 180px;
    position: absolute;
    right: 200px;
    top: 250px;
    border-radius: 50px;
    border: 5px rgb(0, 247, 255) solid;
    box-shadow: 
    0px 0px 20px rgb(0, 247, 255),
    inset 0px 0px 20px rgb(0, 247, 255),
    0px 0px 60px rgb(0, 247, 255),
    inset 0px 0px 60px rgb(0, 247, 255);
    animation: breathing 3s ease-out infinite;
  }

  .frame:nth-child(1) {
    transform: rotate(40deg) translateY(0px) translateZ(0px);
    opacity: 1.00;
    animation-delay: 0.1s;
  }

  .frame:nth-child(2) {
    transform: rotate(40deg) translateY(50px) translateZ(-10px);
    opacity: 0.9;
    animation-delay: 0.3s;
  }

  .frame:nth-child(3) {
    transform: rotate(40deg) translateY(100px) translateZ(-20px);
    opacity: 0.85;
    animation-delay: 0.5s;
  }

  .frame:nth-child(4) {
    transform: rotate(40deg) translateY(150px) translateZ(-30px);
    opacity: 0.80;
    animation-delay: 0.7s;
  }

  .frame:nth-child(5) {
    transform: rotate(40deg) translateY(200px) translateZ(-40px);
    opacity: 0.75;
    animation-delay: 0.9s;
  }

  .frame:nth-child(6) {
    transform: rotate(40deg) translateY(250px) translateZ(-50px);
    opacity: 0.70;
    animation-delay: 1.1s;
  }

  .frame:nth-child(7) {
    transform: rotate(40deg) translateY(300px) translateZ(-60px);
    opacity: 0.65;
    animation-delay: 1.3s;
  }

  .frame:nth-child(8) {
    transform: rotate(40deg) translateY(350px) translateZ(-70px);
    opacity: 0.6;
    animation-delay: 1.5s;
  }

  .frame:nth-child(9) {
    transform: rotate(40deg) translateY(400px) translateZ(-80px);
    opacity: 0.5;
    animation-delay: 1.7s;
  }

  .frame:nth-child(10) {
    transform: rotate(40deg) translateY(450px) translateZ(-90px);
    opacity: 0.4;
    animation-delay: 1.9s;
  }

  .frame:nth-child(11) {
    transform: rotate(40deg) translateY(500px) translateZ(-100px);
    opacity: 0.3;
    animation-delay: 2.1s;
  }

  .frame:nth-child(12) {
    transform: rotate(40deg) translateY(550px) translateZ(-110px);
    opacity: 0.2;
    animation-delay: 2.3s;
  }

  .frame:nth-child(13) {
    transform: rotate(40deg) translateY(600px) translateZ(-120px);
    opacity: 0.1;
    animation-delay: 2.5s;
  }

  .frame:nth-child(14) {
    transform: rotate(40deg) translateY(650px) translateZ(-130px);
    opacity: 0.09;
    animation-delay: 2.7s;
  }

  .frame:nth-child(15) {
    transform: rotate(40deg) translateY(700px) translateZ(-140px);
    opacity: 0.085;
    animation-delay: 2.9s;
  }

  .frame:nth-child(16) {
    transform: rotate(40deg) translateY(750px) translateZ(-150px);
    opacity: 0.08;
    animation-delay: 2.11s;
  }

  .frame:nth-child(17) {
    transform: rotate(40deg) translateY(800px) translateZ(-160px);
    opacity: 0.075;
    animation-delay: 2.13s;
  }

  .frame:nth-child(18) {
    transform: rotate(40deg) translateY(850px) translateZ(-170px);
    opacity: 0.070;
    animation-delay: 2.15s;
  }

  .frame:nth-child(19) {
    transform: rotate(40deg) translateY(900px) translateZ(-180px);
    opacity: 0.065;
    animation-delay: 2.17s;
  }

  .frame:nth-child(20) {
    transform: rotate(40deg) translateY(950px) translateZ(-190px);
    opacity: 0.060;
    animation-delay: 2.19s;
  }

  .frame:nth-child(21) {
    transform: rotate(40deg) translateY(1000px) translateZ(-200px);
    opacity: 0.055;
    animation-delay: 2.21s;
  }

  .frame:nth-child(22) {
    transform: rotate(40deg) translateY(1050px) translateZ(-210px);
    opacity: 0.050;
    animation-delay: 2.23s;
  }

  .frame:nth-child(23) {
    transform: rotate(40deg) translateY(1100px) translateZ(-220px);
    opacity: 0.045;
    animation-delay: 2.25s;
  }

  .frame:nth-child(24) {
    transform: rotate(40deg) translateY(1150px) translateZ(-230px);
    opacity: 0.040;
    animation-delay: 2.27s;
  }

  .frame:nth-child(25) {
    transform: rotate(40deg) translateY(1200px) translateZ(-240px);
    opacity: 0.035;
    animation-delay: 2.29s;
  }

  .frame:nth-child(26) {
    transform: rotate(40deg) translateY(1250px) translateZ(-250px);
    opacity: 0.030;
    animation-delay: 2.31s;
  }

  .frame:nth-child(27) {
    transform: rotate(40deg) translateY(1300px) translateZ(-260px);
    opacity: 0.025;
    animation-delay: 2.33s;
  }

  .frame:nth-child(28) {
    transform: rotate(40deg) translateY(1350px) translateZ(-270px);
    opacity: 0.020;
    animation-delay: 2.35s;
  }

  @keyframes breathing {
    0% {filter: brightness(1.5) contrast(3);}
    50% {filter: brightness(1.1) contrast(2);}
    100% {filter: brightness(1.5) contrast(3);}
  }

  @keyframes zooming {
    0% {perspective: 45px;}
    50% {perspective: 50px;}
    100% {perspective: 45px;}
  }