.home-container {
  width: 100%;
  display: flex;
  overflow: auto;
  min-height: 100vh;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}
.home-main {
  top: 0px;
  left: 0px;
  right: 0px;
  width: 905px;
  bottom: 0px;
  height: 905px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  flex-direction: column;
  justify-content: center;
  background-color: #000000;
}
.home-background {
  top: 0px;
  left: 0px;
  right: 0px;
  width: 905px;
  bottom: 0px;
  height: 758px;
  margin: auto;
  position: absolute;
  object-fit: cover;
}
.home-loaders {
  top: 402px;
  flex: 0 0 auto;
  left: 0px;
  width: 33px;
  height: 100px;
  display: flex;
  position: absolute;
  align-items: flex-start;
}
[class^="home-container"] {
  position: absolute;
}

.home-container01 {
  left: 270px;
  bottom: -153px;
}

.home-container02,
.home-container04,
.home-container06,
.home-container08,
.home-container10,
.home-container12,
.home-container14,
.home-container16,
.home-container18 {
  display: contents;
}

.home-container03 {
  left: 558px;
  bottom: -153px;
}

.home-container05 {
  left: 116px;
  bottom: -213px;
}

.home-container07 {
  left: 191px;
  bottom: -225px;
}

.home-container09 {
  left: 246px;
  bottom: -225px;
}

.home-container11 {
  left: 299px;
  bottom: -226px;
}

.home-container13 {
  left: 495px;
  bottom: -228px;
}

.home-container15 {
  left: 550px;
  bottom: -228px;
}

.home-container17 {
  left: 603px;
  bottom: -229px;
}

.loader,
.loader1,
.loader2 {
  border-radius: 50%;
  width: 52px;
  height: 52px;
  animation: spin 2s linear infinite;
}

.loader {
  border: 7px solid rgba(235, 235, 235, 0.4); /* Light grey background */
  border-top-color: rgba(180, 236, 57, 0.75); /* Blue color */
}

.loader1 {
  border: 7px solid rgba(235, 235, 235, 0.4); /* Light grey background */
  border-top-color: rgba(57, 191, 236, 0.75); /* Blue color */
}

.loader2 {
  border: 5px solid rgba(235, 235, 235, 0.6); /* Light grey background */
  border-top-color: rgba(1, 199, 233, 0.0); /* Blue color */
}

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


.home-grey-buttons {
  top: 592.996280670166px;
  left: 645.9926300048828px;
  width: 218.01467895507812px;
  height: 42.97796630859375px;
  display: flex;
  position: absolute;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}
.home-grey-button-1 {
  top: 2.003662109375px;
  left: 0px;
  width: 31px;
  cursor: pointer;
  height: 40px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #9a9a9a;
  border-style: outset;
  border-width: 2px;
  margin-right: auto;
  justify-content: center;
  background-image: linear-gradient(135deg, rgb(230, 213, 234) 0.00%,rgb(149, 145, 159) 96.00%);
}
.home-grey-button-1:hover {
  background-image: linear-gradient(315deg, rgb(187, 105, 255) 0.00%,rgb(106, 253, 255) 99.00%);
}
.home-grey-button-1:active {
  background-image: linear-gradient(135deg, rgb(194, 229, 156) 0.00%,rgb(100, 179, 244) 100.00%);
}
.home-text-grey-1 {
  top: 10px;
  left: 5px;
  color: rgb(100, 100, 100);
  margin: auto;
  position: absolute;
  font-size: 20px;
  line-height: 1.1;
}
.home-grey-button-2 {
  top: 0.99267578125px;
  left: 37.003662109375px;
  width: 31px;
  cursor: pointer;
  height: 42px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #808080;
  border-style: outset;
  border-width: 2px;
  justify-content: center;
  background-image: linear-gradient(135deg, rgb(181, 173, 185) 0.00%,rgb(101, 98, 111) 97.00%);
}
.home-grey-button-2:hover {
  background-image: linear-gradient(315deg, rgb(187, 105, 255) 0.00%,rgb(106, 253, 255) 99.00%);
}
.home-grey-button-2:active {
  background-image: linear-gradient(135deg, rgb(194, 229, 156) 0.00%,rgb(100, 179, 244) 100.00%);
}
.home-text-grey-2 {
  top: 9px;
  left: 6px;
  color: rgb(230, 230, 230);
  margin: auto;
  position: absolute;
  font-size: 24px;
  line-height: 1.1;
}
.home-grey-button-3 {
  top: 0.99267578125px;
  left: 69.00732421875px;
  width: 31px;
  cursor: pointer;
  height: 41px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #bbbbbb;
  border-style: outset;
  border-width: 2px;
  justify-content: center;
  background-image: linear-gradient(135deg, rgb(230, 213, 234) 2.00%,rgb(149, 145, 159) 100.00%);
}
.home-grey-button-3:hover {
  background-image: linear-gradient(315deg, rgb(187, 105, 255) 0.00%,rgb(106, 253, 255) 99.00%);
}
.home-grey-button-3:active {
  background-image: linear-gradient(135deg, rgb(194, 229, 156) 0.00%,rgb(100, 179, 244) 100.00%);
}
.home-text-grey-3 {
  top: 10px;
  left: 5px;
  color: #737373;
  margin: auto;
  position: absolute;
  font-size: 22px;
  line-height: 1.1;
}
.home-grey-button-4 {
  top: 0.99267578125px;
  right: 77.996337890625px;
  width: 31px;
  cursor: pointer;
  height: 42px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #b7b7b7;
  border-style: outset;
  border-width: 2px;
  justify-content: center;
  background-image: linear-gradient(180deg, rgb(181, 173, 185) 0.00%,rgb(140, 136, 153) 95.00%);
}
.home-grey-button-4:hover {
  background-image: linear-gradient(315deg, rgb(187, 105, 255) 0.00%,rgb(106, 253, 255) 99.00%);
}
.home-grey-button-4:active {
  background-image: linear-gradient(135deg, rgb(194, 229, 156) 0.00%,rgb(100, 179, 244) 100.00%);
}
.home-text-grey-4 {
  top: 9px;
  left: 6px;
  color: rgb(230, 230, 230);
  margin: auto;
  position: absolute;
  font-size: 24px;
  line-height: 1.1;
}
.home-grey-button-5 {
  top: 0.99267578125px;
  right: 40px;
  width: 31px;
  cursor: pointer;
  height: 41px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #b9b9b9;
  border-style: outset;
  border-width: 2px;
  margin-right: auto;
  justify-content: center;
  background-image: linear-gradient(135deg, rgb(230, 213, 234) 0.00%,rgb(149, 145, 159) 96.00%);
}
.home-grey-button-5:hover {
  background-image: linear-gradient(315deg, rgb(187, 105, 255) 0.00%,rgb(106, 253, 255) 99.00%);
}
.home-grey-button-5:active {
  background-image: linear-gradient(135deg, rgb(194, 229, 156) 0.00%,rgb(100, 179, 244) 100.00%);
}
.home-text-grey-5 {
  top: 12px;
  left: 4px;
  color: rgb(100, 100, 100);
  margin: auto;
  position: absolute;
  font-size: 17px;
  line-height: 1.1;
}
.home-grey-button-6 {
  top: 0px;
  right: 0px;
  width: 31px;
  cursor: pointer;
  height: 42px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #b7b7b7;
  border-style: outset;
  border-width: 2px;
  justify-content: center;
  background-image: linear-gradient(180deg, rgb(181, 173, 185) 0.00%,rgb(126, 122, 138) 95.00%);
}
.home-grey-button-6:hover {
  background-image: linear-gradient(315deg, rgb(187, 105, 255) 0.00%,rgb(106, 253, 255) 99.00%);
}
.home-grey-button-6:active {
  background-image: linear-gradient(135deg, rgb(194, 229, 156) 0.00%,rgb(100, 179, 244) 100.00%);
}
.home-text-grey-6 {
  top: 9px;
  left: 6px;
  color: rgb(230, 230, 230);
  margin: auto;
  position: absolute;
  font-size: 24px;
  line-height: 1.1;
}
.home-pink-buttons {
  top: 678.988956451416px;
  left: 663.9889678955078px;
  width: 205.0183563232422px;
  height: 32.99627876281738px;
  display: flex;
  position: absolute;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}
.home-pink-button-1 {
  top: 1.010986328125px;
  left: 0px;
  width: 38px;
  cursor: pointer;
  height: 32px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #e372ff;
  border-style: ridge;
  border-width: 2px;
  margin-right: auto;
  border-radius: var(--dl-radius-radius-radius2);
  justify-content: center;
  background-image: linear-gradient(0deg, rgb(193, 73, 194) 0.00%,rgb(100, 35, 88) 95.00%);
}
.home-pink-button-1:hover {
  border-color: #72d2ff;
  background-image: linear-gradient(0deg, rgb(103, 201, 244) 0.00%,rgb(35, 50, 100) 96.00%);
}
.home-pink-button-1:active {
  border-color: #72ffae;
  background-image: linear-gradient(0deg, rgb(136, 227, 102) 0.00%,rgb(35, 100, 70) 95.00%);
}
.home-text-pinkl-1 {
  top: 7px;
  left: 11px;
  color: #fbfbfb;
  margin: auto;
  position: absolute;
  font-size: 14px;
  line-height: 1.1;
}
.home-pink-button-2 {
  top: 1.010986328125px;
  left: 41.010986328125px;
  width: 38px;
  cursor: pointer;
  height: 32px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #e372ff;
  border-style: ridge;
  border-width: 2px;
  margin-right: auto;
  border-radius: var(--dl-radius-radius-radius2);
  justify-content: center;
  background-image: linear-gradient(0deg, rgb(215, 91, 196) 0.00%,rgb(119, 42, 105) 94.00%);
}
.home-pink-button-2:hover {
  border-color: #72d2ff;
  background-image: linear-gradient(0deg, rgb(103, 201, 244) 0.00%,rgb(35, 50, 100) 96.00%);
}
.home-pink-button-2:active {
  border-color: #72ffae;
  background-image: linear-gradient(0deg, rgb(136, 227, 102) 0.00%,rgb(35, 100, 70) 95.00%);
}
.home-text-pink-2 {
  top: 8px;
  left: 9px;
  color: #fbfbfb;
  margin: auto;
  position: absolute;
  font-size: 16px;
  line-height: 1.1;
}
.home-pink-button-3 {
  top: 1.010986328125px;
  left: 84.02569580078125px;
  width: 38px;
  cursor: pointer;
  height: 32px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #fe72ff;
  border-style: ridge;
  border-width: 2px;
  margin-right: auto;
  border-radius: var(--dl-radius-radius-radius2);
  justify-content: center;
  background-image: linear-gradient(0deg, rgb(232, 94, 204) 0.00%,rgb(119, 42, 100) 94.00%);
}
.home-pink-button-3:hover {
  border-color: #72d2ff;
  background-image: linear-gradient(0deg, rgb(103, 201, 244) 0.00%,rgb(35, 50, 100) 96.00%);
}
.home-pink-button-3:active {
  border-color: #72ffae;
  background-image: linear-gradient(0deg, rgb(136, 227, 102) 0.00%,rgb(35, 100, 70) 95.00%);
}
.home-text-pink-3 {
  top: 9px;
  left: 11px;
  color: #fbfbfb;
  margin: auto;
  position: absolute;
  font-size: 14px;
  line-height: 1.1;
}
.home-pink-button-4 {
  top: 0px;
  right: 42.003662109375px;
  width: 38px;
  cursor: pointer;
  height: 32px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #fe72ff;
  border-style: ridge;
  border-width: 2px;
  margin-right: auto;
  border-radius: var(--dl-radius-radius-radius2);
  justify-content: center;
  background-image: linear-gradient(0deg, rgb(255, 128, 252) 0.00%,rgb(138, 43, 129) 94.00%);
}
.home-pink-button-4:hover {
  border-color: #72d2ff;
  background-image: linear-gradient(0deg, rgb(103, 201, 244) 0.00%,rgb(35, 50, 100) 96.00%);
}
.home-pink-button-4:active {
  border-color: #72ffae;
  background-image: linear-gradient(0deg, rgb(136, 227, 102) 0.00%,rgb(35, 100, 70) 95.00%);
}
.home-text-pink-4 {
  top: 5px;
  left: 12px;
  color: #fbfbfb;
  margin: auto;
  position: absolute;
  font-size: 18px;
  line-height: 1.1;
}
.home-pink-button-5 {
  top: 0px;
  right: 0px;
  width: 38px;
  cursor: pointer;
  height: 32px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #fe72ff;
  border-style: ridge;
  border-width: 2px;
  margin-right: auto;
  border-radius: var(--dl-radius-radius-radius2);
  justify-content: center;
  background-image: linear-gradient(0deg, rgb(253, 170, 112) 2.00%,rgb(161, 41, 159) 92.00%);
}
.home-pink-button-5:hover {
  border-color: #72d2ff;
  background-image: linear-gradient(0deg, rgb(103, 201, 244) 0.00%,rgb(35, 50, 100) 96.00%);
}
.home-pink-button-5:active {
  border-color: #72ffae;
  background-image: linear-gradient(0deg, rgb(136, 227, 102) 0.00%,rgb(35, 100, 70) 95.00%);
}
.home-text-pink-5 {
  top: 9px;
  left: 11px;
  color: #fbfbfb;
  margin: auto;
  position: absolute;
  font-size: 14px;
  line-height: 1.1;
}
.home-purple-buttons {
  top: 719px;
  right: 36px;
  width: 205.0183563232422px;
  height: 32.99627876281738px;
  display: flex;
  position: absolute;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}
.home-purple-button-1 {
  top: 1.010986328125px;
  left: 0px;
  width: 38px;
  cursor: pointer;
  height: 32px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #7d1aea;
  border-style: ridge;
  border-width: 2px;
  margin-right: auto;
  border-radius: var(--dl-radius-radius-radius2);
  justify-content: center;
  background-image: linear-gradient(180deg, rgb(183, 95, 230) 0.00%,rgb(55, 25, 100) 99.00%);
}
.home-purple-button-1:hover {
  border-color: #72d2ff;
  background-image: linear-gradient(0deg, rgb(103, 201, 244) 0.00%,rgb(35, 50, 100) 96.00%);
}
.home-purple-button-1:active {
  border-color: #72ffae;
  background-image: linear-gradient(0deg, rgb(136, 227, 102) 0.00%,rgb(35, 100, 70) 95.00%);
}
.home-text-purple-1 {
  top: 7px;
  left: 12px;
  color: rgb(251, 251, 251);
  margin: auto;
  position: absolute;
  font-size: 14px;
  line-height: 1.1;
}
.home-purple-button-2 {
  top: 1.010986328125px;
  left: 41.010986328125px;
  width: 38px;
  cursor: pointer;
  height: 32px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #7d1aea;
  border-style: ridge;
  border-width: 2px;
  margin-right: auto;
  border-radius: var(--dl-radius-radius-radius2);
  justify-content: center;
  background-image: linear-gradient(180deg, rgb(183, 95, 230) 0.00%,rgb(55, 25, 100) 99.00%);
}
.home-purple-button-2:hover {
  border-color: #72d2ff;
  background-image: linear-gradient(0deg, rgb(103, 201, 244) 0.00%,rgb(35, 50, 100) 96.00%);
}
.home-purple-button-2:active {
  border-color: #72ffae;
  background-image: linear-gradient(0deg, rgb(136, 227, 102) 0.00%,rgb(35, 100, 70) 95.00%);
}
.home-text-purple-2 {
  top: 7px;
  left: 11px;
  color: rgb(251, 251, 251);
  margin: auto;
  position: absolute;
  font-size: 16px;
  line-height: 1.1;
}
.home-purple-button-3 {
  top: 1.010986328125px;
  left: 84.02569580078125px;
  width: 38px;
  cursor: pointer;
  height: 32px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #7d1aea;
  border-style: ridge;
  border-width: 2px;
  margin-right: auto;
  border-radius: var(--dl-radius-radius-radius2);
  justify-content: center;
  background-image: linear-gradient(180deg, rgb(183, 95, 230) 0.00%,rgb(55, 25, 100) 99.00%);
}
.home-purple-button-3:hover {
  border-color: #72d2ff;
  background-image: linear-gradient(0deg, rgb(103, 201, 244) 0.00%,rgb(35, 50, 100) 96.00%);
}
.home-purple-button-3:active {
  border-color: #72ffae;
  background-image: linear-gradient(0deg, rgb(136, 227, 102) 0.00%,rgb(35, 100, 70) 95.00%);
}
.home-text-purple-3 {
  top: 9px;
  left: 11px;
  color: rgb(251, 251, 251);
  margin: auto;
  position: absolute;
  font-size: 14px;
  line-height: 1.1;
}
.home-purple-button-4 {
  top: 0px;
  right: 42.003662109375px;
  width: 38px;
  cursor: pointer;
  height: 32px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #7d1aea;
  border-style: ridge;
  border-width: 2px;
  margin-right: auto;
  border-radius: var(--dl-radius-radius-radius2);
  justify-content: center;
  background-image: linear-gradient(180deg, rgb(183, 95, 230) 0.00%,rgb(55, 25, 100) 99.00%);
}
.home-purple-button-4:hover {
  border-color: #72d2ff;
  background-image: linear-gradient(0deg, rgb(103, 201, 244) 0.00%,rgb(35, 50, 100) 96.00%);
}
.home-purple-button-4:active {
  border-color: #72ffae;
  background-image: linear-gradient(0deg, rgb(136, 227, 102) 0.00%,rgb(35, 100, 70) 95.00%);
}
.home-text-purple-4 {
  top: 7px;
  left: 12px;
  color: rgb(251, 251, 251);
  margin: auto;
  position: absolute;
  font-size: 18px;
  line-height: 1.1;
}
.home-purple-button-5 {
  top: 0px;
  right: 0px;
  width: 38px;
  cursor: pointer;
  height: 32px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #7d1aea;
  border-style: ridge;
  border-width: 2px;
  margin-right: auto;
  border-radius: var(--dl-radius-radius-radius2);
  justify-content: center;
  background-image: linear-gradient(180deg, rgb(183, 95, 230) 0.00%,rgb(55, 25, 100) 99.00%);
}
.home-purple-button-5:hover {
  border-color: #72d2ff;
  background-image: linear-gradient(0deg, rgb(103, 201, 244) 0.00%,rgb(35, 50, 100) 96.00%);
}
.home-purple-button-5:active {
  border-color: #72ffae;
  background-image: linear-gradient(0deg, rgb(136, 227, 102) 0.00%,rgb(35, 100, 70) 95.00%);
}
.home-text-purple-5 {
  top: 8px;
  left: 13px;
  color: rgb(251, 251, 251);
  margin: auto;
  position: absolute;
  font-size: 15px;
  line-height: 1.1;
}
.home-rounded-buttons-a {
  top: 611.9668617248535px;
  left: 343.9889678955078px;
  width: 194.99998474121094px;
  height: 17.996322631835938px;
  display: flex;
  position: absolute;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}
.home-round-ab-1 {
  top: 0px;
  flex: 0 0 auto;
  left: 0px;
  width: 18px;
  cursor: cell;
  height: 18px;
  display: flex;
  position: absolute;
  transition: 0.3s;
  align-items: flex-start;
  border-radius: var(--dl-radius-radius-round);
  background-color: #6571c7;
  display: none;
}
.home-round-ab-1:hover {
  border-color: #b9ff87;
  background-color: #68d0df;
}
.home-round-ab-1:active {
  border-color: #ccafff;
  background-color: #7ac765;
}
.home-round-ab-2 {
  top: 0px;
  flex: 0 0 auto;
  right: 0px;
  width: 18px;
  cursor: cell;
  height: 18px;
  display: flex;
  position: absolute;
  transition: 0.3s;
  align-items: flex-start;
  border-radius: var(--dl-radius-radius-round);
  background-color: #6571c7;
  display: none;
}
.home-round-ab-2:hover {
  border-color: #b9ff87;
  background-color: #68d0df;
}
.home-round-ab-2:active {
  border-color: #ccafff;
  background-color: #7ac765;
}
.home-rounded-buttons-b {
  top: 674.0073280334473px;
  left: 398.9889678955078px;
  width: 98.97055149078369px;
  height: 35.99264621734619px;
  display: flex;
  position: absolute;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}
.home-round-1 {
  top: 0px;
  flex: 0 0 auto;
  left: 0px;
  width: var(--dl-size-size-xsmall);
  cursor: cell;
  height: var(--dl-size-size-xsmall);
  display: flex;
  position: absolute;
  transition: 0.3s;
  align-items: flex-start;
  border-color: #89f4ff;
  border-style: outset;
  border-width: 1px;
  border-radius: var(--dl-radius-radius-round);
  background-image: linear-gradient(135deg, rgb(149, 244, 253) 1.00%,rgb(52, 39, 159) 100.00%);
}
.home-round-1:hover {
  border-color: #b9ff87;
  background-image: linear-gradient(135deg, rgb(203, 253, 149) 0.00%,rgb(27, 132, 61) 100.00%);
}
.home-round-1:active {
  border-color: #ccafff;
  background-image: linear-gradient(135deg, rgb(152, 149, 253) 0.00%,rgb(123, 39, 159) 100.00%);
}
.home-round-2 {
  top: 0px;
  flex: 0 0 auto;
  left: 18.9705810546875px;
  width: var(--dl-size-size-xsmall);
  cursor: cell;
  height: var(--dl-size-size-xsmall);
  display: flex;
  position: absolute;
  transition: 0.3s;
  align-items: flex-start;
  border-color: #89f4ff;
  border-style: outset;
  border-width: 1px;
  border-radius: var(--dl-radius-radius-round);
  background-image: linear-gradient(135deg, rgb(149, 244, 253) 1.00%,rgb(52, 39, 159) 100.00%);
}
.home-round-2:hover {
  border-color: #b9ff87;
  background-image: linear-gradient(135deg, rgb(203, 253, 149) 0.00%,rgb(27, 132, 61) 100.00%);
}
.home-round-2:active {
  border-color: #ccafff;
  background-image: linear-gradient(135deg, rgb(152, 149, 253) 0.00%,rgb(123, 39, 159) 100.00%);
}
.home-round-3 {
  top: 0px;
  flex: 0 0 auto;
  right: 0px;
  width: var(--dl-size-size-xsmall);
  cursor: cell;
  height: var(--dl-size-size-xsmall);
  display: flex;
  position: absolute;
  transition: 0.3s;
  align-items: flex-start;
  border-color: #89f4ff;
  border-style: outset;
  border-width: 1px;
  border-radius: var(--dl-radius-radius-round);
  background-image: linear-gradient(135deg, rgb(149, 244, 253) 1.00%,rgb(52, 39, 159) 100.00%);
}
.home-round-3:hover {
  border-color: #b9ff87;
  background-image: linear-gradient(135deg, rgb(203, 253, 149) 0.00%,rgb(27, 132, 61) 100.00%);
}
.home-round-3:active {
  border-color: #ccafff;
  background-image: linear-gradient(135deg, rgb(152, 149, 253) 0.00%,rgb(123, 39, 159) 100.00%);
}
.home-round-4 {
  flex: 0 0 auto;
  left: 11.98529052734375px;
  width: var(--dl-size-size-xsmall);
  bottom: 0px;
  cursor: cell;
  height: var(--dl-size-size-xsmall);
  display: flex;
  position: absolute;
  transition: 0.3s;
  align-items: flex-start;
  border-color: #89f4ff;
  border-style: outset;
  border-width: 1px;
  border-radius: var(--dl-radius-radius-round);
  background-image: linear-gradient(135deg, rgb(149, 244, 253) 1.00%,rgb(52, 39, 159) 100.00%);
}
.home-round-4:hover {
  border-color: #b9ff87;
  background-image: linear-gradient(135deg, rgb(203, 253, 149) 0.00%,rgb(27, 132, 61) 100.00%);
}
.home-round-4:active {
  border-color: #ccafff;
  background-image: linear-gradient(135deg, rgb(152, 149, 253) 0.00%,rgb(123, 39, 159) 100.00%);
}
.home-round-5 {
  flex: 0 0 auto;
  left: 32.941162109375px;
  width: var(--dl-size-size-xsmall);
  bottom: 0.99267578125px;
  cursor: cell;
  height: var(--dl-size-size-xsmall);
  display: flex;
  position: absolute;
  transition: 0.3s;
  align-items: flex-start;
  border-color: #89f4ff;
  border-style: outset;
  border-width: 1px;
  border-radius: var(--dl-radius-radius-round);
  background-image: linear-gradient(135deg, rgb(149, 244, 253) 1.00%,rgb(52, 39, 159) 100.00%);
}
.home-round-5:hover {
  border-color: #b9ff87;
  background-image: linear-gradient(135deg, rgb(203, 253, 149) 0.00%,rgb(27, 132, 61) 100.00%);
}
.home-round-5:active {
  border-color: #ccafff;
  background-image: linear-gradient(135deg, rgb(152, 149, 253) 0.00%,rgb(123, 39, 159) 100.00%);
}
.home-round-6 {
  flex: 0 0 auto;
  right: 32.9779052734375px;
  width: var(--dl-size-size-xsmall);
  bottom: 0.99267578125px;
  cursor: cell;
  height: var(--dl-size-size-xsmall);
  display: flex;
  position: absolute;
  transition: 0.3s;
  align-items: flex-start;
  border-color: #89f4ff;
  border-style: outset;
  border-width: 1px;
  border-radius: var(--dl-radius-radius-round);
  background-image: linear-gradient(135deg, rgb(149, 244, 253) 1.00%,rgb(52, 39, 159) 100.00%);
}
.home-round-6:hover {
  border-color: #b9ff87;
  background-image: linear-gradient(135deg, rgb(203, 253, 149) 0.00%,rgb(27, 132, 61) 100.00%);
}
.home-round-6:active {
  border-color: #ccafff;
  background-image: linear-gradient(135deg, rgb(152, 149, 253) 0.00%,rgb(123, 39, 159) 100.00%);
}
.home-round-7 {
  flex: 0 0 auto;
  right: 15.95587158203125px;
  width: var(--dl-size-size-xsmall);
  bottom: 0.99267578125px;
  cursor: cell;
  height: var(--dl-size-size-xsmall);
  display: flex;
  position: absolute;
  transition: 0.3s;
  align-items: flex-start;
  border-color: #89f4ff;
  border-style: outset;
  border-width: 1px;
  border-radius: var(--dl-radius-radius-round);
  background-image: linear-gradient(135deg, rgb(149, 244, 253) 1.00%,rgb(52, 39, 159) 100.00%);
}
.home-round-7:hover {
  border-color: #b9ff87;
  background-image: linear-gradient(135deg, rgb(203, 253, 149) 0.00%,rgb(27, 132, 61) 100.00%);
}
.home-round-7:active {
  border-color: #ccafff;
  background-image: linear-gradient(135deg, rgb(152, 149, 253) 0.00%,rgb(123, 39, 159) 100.00%);
}
.home-rectangle-buttons-a {
  top: 671.9668617248535px;
  left: 354.00733947753906px;
  width: 42.99632263183594px;
  height: 39.99998474121094px;
  display: flex;
  position: absolute;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}
.home-rectangle-button-1 {
  top: 0px;
  left: 0px;
  width: 43px;
  cursor: cell;
  height: 18px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #ffffff;
  border-style: outset;
  border-width: 1px;
  margin-right: auto;
  border-radius: var(--dl-radius-radius-radius2);
  justify-content: center;
  background-image: linear-gradient(0deg, rgb(193, 168, 205) 0.00%,rgb(92, 83, 127) 97.00%);
}
.home-rectangle-button-1:hover {
  border-color: #b4e7fd;
  background-image: linear-gradient(0deg, rgb(103, 201, 244) 0.00%,rgb(97, 75, 196) 96.00%);
}
.home-rectangle-button-1:active {
  border-color: #a8ffcd;
  background-image: linear-gradient(0deg, rgb(164, 200, 151) 2.00%,rgb(35, 100, 70) 95.00%);
}
.home-rectangle-button-2 {
  left: 0px;
  width: 43px;
  bottom: 0px;
  cursor: cell;
  height: 18px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #ffffff;
  border-style: outset;
  border-width: 1px;
  margin-right: auto;
  border-radius: var(--dl-radius-radius-radius2);
  justify-content: center;
  background-image: linear-gradient(0deg, rgb(193, 168, 205) 0.00%,rgb(92, 83, 127) 97.00%);
}
.home-rectangle-button-2:hover {
  border-color: #b4e7fd;
  background-image: linear-gradient(0deg, rgb(103, 201, 244) 0.00%,rgb(97, 75, 196) 96.00%);
}
.home-rectangle-button-2:active {
  border-color: #a8ffcd;
  background-image: linear-gradient(0deg, rgb(164, 200, 151) 2.00%,rgb(35, 100, 70) 95.00%);
}
.home-rectangle-buttons-b {
  top: 720.992618560791px;
  left: 361.9852752685547px;
  width: 117.02204895019531px;
  height: 10.974242210388184px;
  display: flex;
  position: absolute;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}
.home-rectangle-button-3 {
  top: 0.9742431640625px;
  left: 0px;
  width: 13px;
  cursor: cell;
  height: 10px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #ffffff;
  border-style: outset;
  border-width: 1px;
  margin-right: auto;
  border-radius: var(--dl-radius-radius-radius2);
  justify-content: center;
  background-image: linear-gradient(135deg, rgb(242, 242, 242) 0.00%,rgb(140, 140, 140) 99.00%);
}
.home-rectangle-button-3:hover {
  border-color: #b4e7fd;
  background-image: linear-gradient(180deg, rgb(200, 238, 255) 0.00%,rgb(131, 130, 134) 96.00%);
}
.home-rectangle-button-3:active {
  border-color: #a8ffcd;
  background-image: linear-gradient(135deg, rgb(164, 200, 151) 2.00%,rgb(46, 132, 92) 97.00%);
}
.home-rectangle-button-4 {
  top: 0px;
  left: 27.022064208984375px;
  width: 13px;
  cursor: cell;
  height: 10px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #ffffff;
  border-style: outset;
  border-width: 1px;
  margin-right: auto;
  border-radius: var(--dl-radius-radius-radius2);
  justify-content: center;
  background-image: linear-gradient(135deg, rgb(242, 242, 242) 0.00%,rgb(140, 140, 140) 99.00%);
}
.home-rectangle-button-4:hover {
  border-color: #b4e7fd;
  background-image: linear-gradient(180deg, rgb(200, 238, 255) 0.00%,rgb(131, 130, 134) 96.00%);
}
.home-rectangle-button-4:active {
  border-color: #a8ffcd;
  background-image: linear-gradient(135deg, rgb(164, 200, 151) 2.00%,rgb(46, 132, 92) 97.00%);
}
.home-rectangle-button-5 {
  top: 0px;
  left: 52.996307373046875px;
  width: 13px;
  cursor: cell;
  height: 10px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #ffffff;
  border-style: outset;
  border-width: 1px;
  margin-right: auto;
  border-radius: var(--dl-radius-radius-radius2);
  justify-content: center;
  background-image: linear-gradient(135deg, rgb(242, 242, 242) 0.00%,rgb(140, 140, 140) 99.00%);
}
.home-rectangle-button-5:hover {
  border-color: #b4e7fd;
  background-image: linear-gradient(180deg, rgb(200, 238, 255) 0.00%,rgb(131, 130, 134) 96.00%);
}
.home-rectangle-button-5:active {
  border-color: #a8ffcd;
  background-image: linear-gradient(135deg, rgb(164, 200, 151) 2.00%,rgb(46, 132, 92) 97.00%);
}
.home-rectangle-button-6 {
  top: 0px;
  right: 25.01837158203125px;
  width: 13px;
  cursor: cell;
  height: 10px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #ffffff;
  border-style: outset;
  border-width: 1px;
  margin-right: auto;
  border-radius: var(--dl-radius-radius-radius2);
  justify-content: center;
  background-image: linear-gradient(135deg, rgb(242, 242, 242) 0.00%,rgb(140, 140, 140) 99.00%);
}
.home-rectangle-button-6:hover {
  border-color: #b4e7fd;
  background-image: linear-gradient(180deg, rgb(200, 238, 255) 0.00%,rgb(131, 130, 134) 96.00%);
}
.home-rectangle-button-6:active {
  border-color: #a8ffcd;
  background-image: linear-gradient(135deg, rgb(164, 200, 151) 2.00%,rgb(46, 132, 92) 97.00%);
}
.home-rectangle-button-7 {
  top: 0.9742431640625px;
  right: 0px;
  width: 13px;
  cursor: cell;
  height: 10px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #ffffff;
  border-style: outset;
  border-width: 1px;
  margin-right: auto;
  border-radius: var(--dl-radius-radius-radius2);
  justify-content: center;
  background-image: linear-gradient(135deg, rgb(242, 242, 242) 0.00%,rgb(140, 140, 140) 99.00%);
}
.home-rectangle-button-7:hover {
  border-color: #b4e7fd;
  background-image: linear-gradient(180deg, rgb(200, 238, 255) 0.00%,rgb(131, 130, 134) 96.00%);
}
.home-rectangle-button-7:active {
  border-color: #a8ffcd;
  background-image: linear-gradient(135deg, rgb(164, 200, 151) 2.00%,rgb(46, 132, 92) 97.00%);
}
.home-rectangle-buttons-c {
  top: 759.0256996154785px;
  left: 82.99632263183594px;
  width: 118.97058296203613px;
  height: 21.985292434692383px;
  display: flex;
  position: absolute;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}
.home-rec-button-bl-1 {
  top: 0px;
  left: 0px;
  width: 17px;
  cursor: pointer;
  height: 22px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #777676;
  border-style: outset;
  border-width: 1px;
  margin-right: auto;
  justify-content: center;
  background-image: linear-gradient(180deg, rgb(155, 135, 162) 0.00%,rgb(111, 106, 128) 94.00%);
}
.home-rec-button-bl-1:hover {
  background-image: linear-gradient(135deg, rgb(194, 229, 156) 0.00%,rgb(100, 179, 244) 100.00%);
}
.home-rec-button-bl-1:active {
  background-image: linear-gradient(135deg, rgb(220, 156, 229) 0.00%,rgb(100, 179, 244) 100.00%);
}
.home-rec-button-bl-2 {
  top: 0px;
  left: 18.970596313476562px;
  width: 21px;
  cursor: pointer;
  height: 22px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #777676;
  border-style: outset;
  border-width: 1px;
  margin-right: auto;
  justify-content: center;
  background-image: linear-gradient(180deg, rgb(155, 135, 162) 0.00%,rgb(111, 106, 128) 94.00%);
}
.home-rec-button-bl-2:hover {
  background-image: linear-gradient(135deg, rgb(194, 229, 156) 0.00%,rgb(100, 179, 244) 100.00%);
}
.home-rec-button-bl-2:active {
  background-image: linear-gradient(135deg, rgb(220, 156, 229) 0.00%,rgb(100, 179, 244) 100.00%);
}
.home-rec-button-bl-3 {
  top: 0px;
  left: 40.992645263671875px;
  width: 19px;
  cursor: pointer;
  height: 22px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #777676;
  border-style: outset;
  border-width: 1px;
  margin-right: auto;
  justify-content: center;
  background-image: linear-gradient(180deg, rgb(155, 135, 162) 0.00%,rgb(111, 106, 128) 94.00%);
}
.home-rec-button-bl-3:hover {
  background-image: linear-gradient(135deg, rgb(194, 229, 156) 0.00%,rgb(100, 179, 244) 100.00%);
}
.home-rec-button-bl-3:active {
  background-image: linear-gradient(135deg, rgb(220, 156, 229) 0.00%,rgb(100, 179, 244) 100.00%);
}
.home-rec-button-bl-4 {
  top: 0px;
  right: 38.98896789550781px;
  width: 19px;
  cursor: pointer;
  height: 22px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #777676;
  border-style: outset;
  border-width: 1px;
  margin-right: auto;
  justify-content: center;
  background-image: linear-gradient(180deg, rgb(155, 135, 162) 0.00%,rgb(111, 106, 128) 94.00%);
}
.home-rec-button-bl-4:hover {
  background-image: linear-gradient(135deg, rgb(194, 229, 156) 0.00%,rgb(100, 179, 244) 100.00%);
}
.home-rec-button-bl-4:active {
  background-image: linear-gradient(135deg, rgb(220, 156, 229) 0.00%,rgb(100, 179, 244) 100.00%);
}
.home-rec-button-bl-5 {
  top: 0px;
  right: 18.988967895507812px;
  width: 19px;
  cursor: pointer;
  height: 22px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #777676;
  border-style: outset;
  border-width: 1px;
  margin-right: auto;
  justify-content: center;
  background-image: linear-gradient(180deg, rgb(155, 135, 162) 0.00%,rgb(111, 106, 128) 94.00%);
}
.home-rec-button-bl-5:hover {
  background-image: linear-gradient(135deg, rgb(194, 229, 156) 0.00%,rgb(100, 179, 244) 100.00%);
}
.home-rec-button-bl-5:active {
  background-image: linear-gradient(135deg, rgb(220, 156, 229) 0.00%,rgb(100, 179, 244) 100.00%);
}
.home-rec-button-bl-6 {
  top: 0px;
  right: 0px;
  width: 17px;
  cursor: pointer;
  height: 22px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #777676;
  border-style: outset;
  border-width: 1px;
  margin-right: auto;
  justify-content: center;
  background-image: linear-gradient(180deg, rgb(155, 135, 162) 0.00%,rgb(111, 106, 128) 94.00%);
}
.home-rec-button-bl-6:hover {
  background-image: linear-gradient(135deg, rgb(194, 229, 156) 0.00%,rgb(100, 179, 244) 100.00%);
}
.home-rec-button-bl-6:active {
  background-image: linear-gradient(135deg, rgb(220, 156, 229) 0.00%,rgb(100, 179, 244) 100.00%);
}
.home-player {
  top: 548px;
  left: 467px;
  width: 36px;
  position: absolute;
  object-fit: cover;
  transform-origin: center; /* Ensures the element rotates around its center */
}
.home-dynamic-x {
  top: 550px;
  left: 424px;
  width: 36px;
  position: absolute;
  object-fit: cover;
  transform-origin: center; /* Ensures the element rotates around its center */
}
.home-location-icon-1 {
  top: 410px;
  left: 74px;
  width: 40px;
  position: absolute;
  object-fit: cover;
  filter: saturate(120%) brightness(110%);
  animation: upAndDown 2s ease-in-out infinite;
}
@keyframes upAndDown {
  0%, 100% {
      top: 410px;
  }
  50% {
      top: 390px; /* Move up by 20px */
  }
}

.home-location-icon-2 {
  top: 332px;
  left: 272px;
  width: 40px;
  position: absolute;
  object-fit: cover;
  animation: upAndDown2 2s ease-in-out infinite;
  filter: saturate(120%) brightness(110%);
  display: none;
}

@keyframes upAndDown2 {
  0%, 100% {
      top: 332px;
  }
  50% {
      top: 312px; /* Move up by 20px */
  }
}

.home-after-loc-1 {
  top: 417px;
  left: 78px;
  width: 35px;
  filter: brightness(150%);
  height: 33px;
  position: absolute;
  object-fit: cover;
  filter: saturate(120%) brightness(110%) contrast(110%);
  display: none;
  
}
.home-after-loc-1:hover {
  filter: hue-rotate(250deg) saturate(120%) brightness(110%) contrast(110%);
}

.home-after-loc-1:active {
  filter: hue-rotate(90deg) saturate(120%) brightness(110%) contrast(110%);
}



.home-st-1 {
  top: 587px;
  left: 401px;
  width: 132px;
  height: 4px;
  display: flex;
  position: absolute;
  align-items: flex-start;
  background-color: #00d5ff00;
}
.home-st-2 {
  top: 530px;
  left: 220px;
  width: 200px;
  height: 4px;
  display: flex;
  position: absolute;
  transform: rotate(35deg);
  align-items: flex-start;
  background-color: #00d5ff00;
}
.home-st-3 {
  top: 559px;
  left: 523px;
  width: 90px;
  height: 4px;
  display: flex;
  position: absolute;
  transform: rotate(-40deg);
  align-items: flex-start;
  background-color: #00d5ff00;
}
.home-st-4 {
  top: 472px;
  left: 201px;
  width: 40px;
  height: 4px;
  display: flex;
  position: absolute;
  align-items: flex-start;
  background-color: #00d5ff00;
}
.home-st-5 {
  top: 531px;
  left: 601px;
  width: 50px;
  height: 4px;
  display: flex;
  position: absolute;
  align-items: flex-start;
  background-color: #00d5ff00;
}
.home-st-6 {
  top: 436px;
  left: 346px;
  width: 230px;
  height: 4px;
  display: flex;
  position: absolute;
  align-items: flex-start;
  background-color: #00d5ff00;
}
.home-st-7 {
  top: 591px;
  right: 40px;
  width: 220px;
  height: 4px;
  display: flex;
  position: absolute;
  align-items: flex-start;
  background-color: #00d5ff00;
}
.home-st-8 {
  top: 475px;
  left: 93px;
  width: 50px;
  height: 4px;
  display: flex;
  position: absolute;
  align-items: flex-start;
  background-color: #00d5ff00;
}
.home-st-9 {
  top: 470px;
  left: 43px;
  width: 50px;
  height: 4px;
  display: flex;
  position: absolute;
  align-items: flex-start;
  background-color: #00d5ff00;
}
.home-st-10 {
  top: 73px;
  right: -1px;
  width: 4px;
  height: 758px;
  display: flex;
  position: absolute;
  align-items: flex-start;
  background-color: #00d5ff00;
}
.home-st-11 {
  top: 74px;
  left: -3px;
  width: 4px;
  height: 758px;
  display: flex;
  position: absolute;
  align-items: flex-start;
  background-color: #00d5ff00;
}
.home-st-12 {
  top: 71px;
  left: 0px;
  width: 905px;
  height: 4px;
  display: flex;
  position: absolute;
  align-items: flex-start;
  background-color: #00d5ff00;
}
.home-st-13 {
  width: 905px;
  bottom: 74px;
  height: 4px;
  display: flex;
  position: absolute;
  align-items: flex-start;
  background-color: #00d5ff00;
}
.home-blue-button-1 {
  top: 72px;
  left: -2px;
  width: 50px;
  cursor: pointer;
  height: 50px;
  margin: auto;
  display: flex;
  position: absolute;
  align-items: flex-start;
  border-color: #72f2ff;
  border-style: ridge;
  border-width: 4px;
  margin-right: auto;
  border-radius: var(--dl-radius-radius-radius2);
  justify-content: center;
  background-image: linear-gradient(0deg, rgb(81, 90, 255) 0.00%,rgb(122, 217, 255) 73.00%);
  display: none;
}
.home-blue-button-1:hover {
  border-color: #72d2ff;
  background-image: linear-gradient(0deg, rgb(103, 201, 244) 0.00%,rgb(35, 50, 100) 96.00%);
}
.home-blue-button-1:active {
  border-color: #72ffae;
  background-image: linear-gradient(0deg, rgb(136, 227, 102) 0.00%,rgb(35, 100, 70) 95.00%);
}
.home-text-blue-1 {
  top: 11px;
  left: 11px;
  color: rgb(251, 251, 251);
  margin: auto;
  position: absolute;
  font-size: 23px;
  line-height: 1.1;
}
.home-window1 {
  top: 207px;
  left: 187px;
  width: 488px;
  height: 288px;
  display: flex;
  position: absolute;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  transition: transform 0.3s ease;
}
.home-window1:hover {
  transform: scale(1.3); /* Scale up the element to 130% of its original size */
}

.home-background-blur-window-1 {
  top: 0px;
  left: 0px;
  width: 487px;
  height: 288px;
  display: flex;
  position: absolute;
  box-shadow: 5px 5px 10px 0px #000000;
  align-items: flex-start;
  background: rgba(81, 26, 158, 0.1); /* Semi-transparent white background */
  backdrop-filter: blur(20px); /* Add this line for the blur effect */
  -webkit-backdrop-filter: blur(20px); /* For Mac */
}
.home-tint-window-1 {
  top: 28px;
  left: 0px;
  width: 487px;
  height: 260px;
  display: flex;
  position: absolute;
  align-items: flex-start;
  background-image: linear-gradient(315deg, rgba(15, 8, 68, 0.393) 1.00%,rgba(5, 44, 59, 0.299) 100.00%);
}
.home-background-icon {
  top: 0px;
  right: 0px;
  width: 28px;
  height: 28px;
  display: flex;
  position: absolute;
  align-items: flex-start;
  background-color: rgba(36, 144, 212, 0.25);
}
.home-window-1-text-heading {
  top: 1px;
  left: 8px;
  color: rgb(255, 255, 255);
  position: absolute;
  font-size: 10px;
  font-style: normal;
  text-align: left;
  font-family: "Arial";
  font-weight: 700;
  line-height: 3;
  text-transform: capitalize;
}
.home-window-1-text-body {
  top: 38px;
  left: 8px;
  color: rgba(255, 255, 255, 0.57);
  width: 460px;
  height: var(--dl-size-size-large);
  position: absolute;
  font-size: 8px;
  text-align: left;
  font-family: "Arial";
  line-height: 1.4; /* Example line height, adjust as needed */
}
.home-icon-close-1 {
  top: 2px;
  fill: #ffffff;
  right: 2px;
  width: 24px;
  height: 24px;
  position: absolute;
  transition: 0.3s;
}
.home-icon-close-1:hover {
  fill: #ff0069;
}
.home-icon-close-1:active {
  fill: #b1ff00;
}
.home-drop-down-1 {
  
  left: 0px;
  width: 352px;
  height: 104px;
  overflow: hidden;
  position: absolute;
  transition: top 0.3s ease, height 0.4s ease, left 0.3s ease, opacity 0.5s ease; /* Combined transitions */
  opacity: 1;
  align-items: flex-end;
  border-color: var(--dl-color-gray-black);
  border-width: 1px;
  flex-direction: column;
  justify-content: flex-start;
  background: rgba(81, 26, 158, 0.1); /* Semi-transparent white background */
  backdrop-filter: blur(20px); /* Add this line for the blur effect */
  -webkit-backdrop-filter: blur(20px); /* For Mac */
  display: none;
}
.home-drop-down-1.active {
  height: 240px;
}
.home-heading-dd1 {
  top: 16px;
  left: 16px;
  color: rgb(255, 255, 255);
  position: absolute;
  font-size: 12px;
  font-style: normal;
  font-family: "Arial";
  font-weight: 700;
}
.home-red-dd1 {
  top: 38px;
  left: 15px;
  color: rgb(255, 255, 255, 0.605);
  width: 310px;
  position: absolute;
  font-size: 9px;
  font-style: normal;
  font-family: "Arial";
  font-weight: 400;
  line-height: 1.4; /* Example line height, adjust as needed */
}

.home-body-dd1 {
  top: 110px;
  left: 15px;
  color: rgb(255, 255, 255,0.901);
  width: 300px;
  position: absolute;
  font-size: 9px;
  font-family: "Arial";
  line-height: 1.4; /* Example line height, adjust as needed */
}
.home-close-dd1 {
  top: 11px;
  fill: #ffffff;
  right: 13px;
  width: 24px;
  height: 24px;
  position: absolute;
  transition: 0.3s;
}
.home-close-dd1:hover {
  fill: #ff0072;
}
.home-close-dd1:active {
  fill: #b1ff00;
}
.home-drop-down-2 {
  
  left: 1px;
  width: 352px;
  height: 104px;
  overflow: hidden;
  position: absolute;
  transition: top 0.3s ease, height 0.4s ease, left 0.3s ease, opacity 0.5s ease; /* Combined transitions */
  opacity: 1;
  align-items: flex-end;
  border-color: var(--dl-color-gray-black);
  border-width: 1px;
  flex-direction: column;
  justify-content: flex-start;
  background: rgba(81, 26, 158, 0.1); /* Semi-transparent white background */
  backdrop-filter: blur(20px); /* Add this line for the blur effect */
  -webkit-backdrop-filter: blur(20px); /* For Mac */
  display: none;
}
.home-drop-down-2.active {
  height: 240px;
}
.home-heading-dd2 {
  top: 16px;
  left: 16px;
  color: rgb(255, 255, 255);
  position: absolute;
  font-size: 12px;
  font-style: normal;
  font-family: "Arial";
  font-weight: 700;
}
.home-red-dd2 {
  top: 38px;
  left: 15px;
  color: rgb(255, 255, 255, 0.605);
  width: 310px;
  position: absolute;
  font-size: 9px;
  font-style: normal;
  font-family: "Arial";
  font-weight: 400;
  line-height: 1.4; /* Example line height, adjust as needed */

}

.home-body-dd2 {
  top: 110px;
  left: 15px;
  color: rgb(255, 255, 255,0.901);
  width: 300px;
  position: absolute;
  font-size: 9px;
  font-family: "Arial";
  line-height: 1.4; /* Example line height, adjust as needed */

}
.home-close-dd2 {
  top: 11px;
  fill: #ffffff;
  right: 13px;
  width: 24px;
  height: 24px;
  position: absolute;
  transition: 0.3s;
}
.home-close-dd2:hover {
  fill: #ff0072;
}
.home-close-dd2:active {
  fill: #b1ff00;
}
.home-drop-down-3 {
  
  left: 0px;
  width: 352px;
  height: 104px;
  overflow: hidden;
  position: absolute;
  transition: top 0.3s ease, height 0.4s ease, left 0.3s ease, opacity 0.5s ease; /* Combined transitions */
  opacity: 1;
  align-items: flex-end;
  border-color: var(--dl-color-gray-black);
  border-width: 1px;
  flex-direction: column;
  justify-content: flex-start;
  background: rgba(81, 26, 158, 0.1); /* Semi-transparent white background */
  backdrop-filter: blur(20px); /* Add this line for the blur effect */
  -webkit-backdrop-filter: blur(20px); /* For Mac */
  display: none;
}
.home-drop-down-3.active {
  height: 240px;
}
.home-heading-dd3 {
  top: 16px;
  left: 16px;
  color: rgb(255, 255, 255);
  position: absolute;
  font-size: 12px;
  font-style: normal;
  font-family: "Arial";
  font-weight: 700;
}
.home-red-dd3 {
  top: 38px;
  left: 15px;
  color: rgb(255, 255, 255, 0.605);
  width: 310px;
  position: absolute;
  font-size: 9px;
  font-style: normal;
  font-family: "Arial";
  font-weight: 400;
  line-height: 1.4; /* Example line height, adjust as needed */

}

.home-body-dd3 {
  top: 110px;
  left: 15px;
  color: rgb(255, 255, 255,0.901);
  width: 300px;
  position: absolute;
  font-size: 9px;
  font-family: "Arial";
  line-height: 1.4; /* Example line height, adjust as needed */

}
.home-close-dd3 {
  top: 11px;
  fill: #ffffff;
  right: 13px;
  width: 24px;
  height: 24px;
  position: absolute;
  transition: 0.3s;
}
.home-close-dd3:hover {
  fill: #ff0072;
}
.home-close-dd3:active {
  fill: #b1ff00;
}
@media(max-width: 991px) {
  .home-main {
    top: 100px;
    left: 0px;
    right: 0px;
    margin: auto;
    position: absolute;
  }
  .home-background {
    top: 64px;
    left: 0px;
    right: 0px;
    margin: auto;
    position: absolute;
  }
  .home-loaders {
    top: 434px;
    left: -1px;
  }
  .home-grey-buttons {
    top: 625px;
    right: 40px;
  }
  .home-pink-buttons {
    top: 710px;
    right: 35px;
  }
  .home-purple-buttons {
    top: 749px;
    right: 37px;
  }
  .home-player {
    top: 581px;
    left: 462px;
  }
  .home-dynamic-x {
    top: 583px;
    left: 419px;
  }
  .home-location-icon-1 {
    top: 443px;
    left: 69px;
  }
  .home-location-icon-2 {
    top: 369px;
    left: 265px;
  }
  .home-after-loc-1 {
    top: 444px;
    left: 73px;
  }
  .home-st-1 {
    top: 614px;
    left: 403px;
  }
  .home-st-2 {
    top: 557px;
    left: 223px;
  }
  .home-st-3 {
    top: 586px;
    left: 524px;
  }
  .home-st-4 {
    top: 499px;
    left: 203px;
  }
  .home-st-5 {
    top: 558px;
    left: 603px;
  }
  .home-st-6 {
    top: 463px;
    left: 348px;
  }
  .home-st-7 {
    top: 622px;
    right: 41px;
  }
  .home-st-8 {
    top: 503px;
    left: 98px;
  }
  .home-st-9 {
    top: 504px;
    left: 45px;
  }
  .home-st-10 {
    top: 106px;
    right: -3px;
  }
  .home-st-11 {
    top: 107px;
    left: -1px;
  }
  .home-st-12 {
    top: 104px;
    left: 0px;
  }
  .home-st-13 {
    right: -2px;
    bottom: 41px;
  }
  .home-blue-button-1 {
    top: 105px;
    left: -1px;
  }
  .home-drop-down-1 {
    top: 107px;
    left: -2px;
  }
  .home-drop-down-2 {
    top: 236px;
    left: -1px;
  }
  .home-drop-down-3 {
    top: 363px;
    left: -2px;
  }
}