.frame-child,
.frame-item {
  position: absolute;
  object-fit: cover;
}
.frame-child {
  height: 1900px;
  width: 1500px;
  top: 1.17%;
  right: 2.16%;
  bottom: 0.84%;
  left: 0.5%;
  border-radius: 25px;
  max-width: 100%;
  overflow: hidden;
  max-height: 100%;
  opacity: 0.6;
}
.frame-item {
  top: 764.55px;
  left: -113px;
  width: 1619px;
  height: 730px;
}
.find-us-on {
  margin: 0;
  position: absolute;
  height: 1.92%;
  width: 10.95%;
  top: 90.59%;
  left: 43.66%;
  font-size: inherit;
  font-weight: 400;
  font-family: inherit;
  display: inline-block;
  text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
}
.frame-inner,
.rectangle-button {
  height: 2.33%;
  width: 2.58%;
  top: 93.87%;
  bottom: 3.8%;
  border-radius: var(--br-3xs);
}
.frame-inner {
  cursor: pointer;
  border: 0;
  padding: 0;
  background-color: transparent;
  position: absolute;
  right: 56.23%;
  left: 41.19%;
  background-image: url(./public/rectangle17@2x.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top;
  transition: transform 0.3s ease-in-out;
}
.rectangle-button {
  cursor: pointer;
  right: 50.18%;
  left: 47.24%;
  background-image: url(./public/rectangle18@2x.png);
  transition: transform 0.3s ease-in-out;
}
.frame-child1,
.frame-child2,
.rectangle-button {
  cursor: pointer;
  border: 0;
  padding: 0;
  background-color: transparent;
  position: absolute;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: top;
}
.frame-child1 {
  cursor: pointer;
  height: 2.33%;
  width: 2.58%;
  top: 93.87%;
  right: 44.14%;
  bottom: 3.8%;
  left: 53.28%;
  border-radius: var(--br-3xs);
  background-image: url(./public/rectangle19@2x.png);
  transition: transform 0.3s ease-in-out;
}
.frame-child2 {
  height: 4.32%;
  width: 19.54%;
  top: 73.8%;
  right: 41.74%;
  bottom: 21.88%;
  left: 38.73%;
  background-image: url(./Final_Logo.png);
}
.component-26-child,
.component-26-inner,
.component-26-item,
.rectangle-icon {
  position: absolute;
  height: 97.92%;
  width: 18.05%;
  top: 2.08%;
  right: 81.95%;
  bottom: 0;
  left: 0;
  max-width: 100%;
  overflow: hidden;
  max-height: 100%;
  object-fit: contain;
  transition : transform 0.3s ease-in-out;
}
.component-26-inner,
.component-26-item,
.rectangle-icon {
  right: 57.01%;
  left: 24.94%;
}
.component-26-inner,
.rectangle-icon {
  right: 24.94%;
  left: 57.01%;
}
.rectangle-icon {
  right: 0;
  left: 81.95%;
}

.component-26-inner{
  left: 352px;
}
.about-us,
.pricing,
.privacy,
.terms {
  cursor: pointer;
  border: 0;
  padding: 0;
  background-color: transparent;
  position: absolute;
  height: 87.83%;
  width: 10.1%;
  top: 0;
  left: 4.63%;
  font-size: var(--font-size-xl);
  font-family: var(--font-ntr);
  color: var(--color-black);
  text-align: left;
  display: inline-block;
  text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
  transition : transform 0.3s ease-in-out;
}
.pricing,
.privacy,
.terms {
  top: 2.08%;
  left: 30.4%;
}
.privacy,
.terms {
  left: 46%;
}
.privacy {
  left: 87.41%;
}
.component-26 {
  position: absolute;
  height: 3.29%;
  width: 58.2%;
  top: 85.93%;
  right: 22.35%;
  bottom: 10.78%;
  left: 19.45%;
}
.component-37-icon,
.image1-icon,
.image2-icon {
  position: absolute;
  top: -0px;
  left: -80px;
  width: 1600.1px;
  height: 900.89px;
  object-fit: contain;
  animation : TranslateY 2s ease-in-out infinite;
}
.image1-icon {
  height: 53%;
  width: 53%;
  top: -70px;
  right: 28.22%;
  bottom: 49.76%;
  left: 22%;
  border-radius: 50%;
  max-width: 100%;
  overflow: hidden;
  max-height: 100%;
  object-fit: contain;
  opacity: 1;
  animation : unload 2s ease-in-out infinite;

}

.component-37-icon{
  rotate: 10deg;
}
.component-36-icon {
  position: absolute;
  top: -30px;
  left: -220.58px;
  width: 2000px;
  height: 900.67px;
  object-fit: contain;
  rotate: -10deg;
  animation: TranslateX 2s ease-in-out infinite;
}
.as-a-registered {
  margin: 0;
}
.as-a-registered-container,
.upscalepromedia-powered-by {
  position: absolute;
  height: 9.45%;
  width: 94.96%;
  top: 62.98%;
  left: 4.67%;
  font-size: 32px;
  line-height: 140%;
  font-family: var(--font-ntr);
  display: inline-block;
}
.upscalepromedia-powered-by {
  margin: 0;
  height: 2.61%;
  width: 77.7%;
  top: 80.72%;
  left: 11.33%;
  font-size: inherit;
  line-height: 96.9%;
  font-weight: 400;
  font-family: var(--font-arya);
}
.frame-child3 {
  cursor: pointer;
  border: 0;
  padding: 0;
  background-color: transparent;
  position: absolute;
  height: 12.74%;
  width: 28.74%;
  top: 23.53%;
  right: 72.44%;
  bottom: 63.73%;
  left: -1.19%;
  background-image: url(./public/rectangle-134@3x.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: top;
  transition : transform 0.3s ease-in-out;
}
.frame-child4 {
  position: absolute;
  top: 80px;
  left: 450px;
  border-radius: 308px;
  width: 610px;
  height: 700px;
  object-fit: contain;
  animation: Loading 2s linear infinite;
}
.frame-child5 {
  position: absolute;
  top: 37.55px;
  left: 300px;
  width: 896px;
  height: 80px;
  object-fit: cover;
}
.frame-child6 {
  cursor: pointer;
  border: 0;
  padding: 0;
  background-color: transparent;
  position: absolute;
  height: 4.18%;
  width: 19.09%;
  top: 0;
  right: 80.91%;
  bottom: 95.82%;
  left: 0;
  background-image: url(./Final_Logo.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: top;
}
.rectangle-parent {
  position: relative;
  background-color: var(--color-black);
  width: 100%;
  height: 1460px;
  overflow: hidden;
  text-align: left;
  font-size: var(--font-size-xl);
  color: var(--color-white);
  font-family: var(--font-audiowide);
}


@keyframes load {
  0%{
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}

@keyframes unload {
  0%{
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}


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

  50% {
    opacity: 0;
  }

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

@keyframes TranslateX {
  0% {
    transform : translate(-50px,-50px);
  }
  50% {
    transform : translate(50px,50px)
  }
  100% {
    transform : translate(-50px,-50px)
  }
}

@keyframes TranslateY {
  0% {
    transform : translate(50px,-50px)
  }
  50% {
    transform : translate(0px,0px)
  }
  100% {
    transform : translate(50px,-50px)
  }
}



@media (min-width : 2000px) and (max-width : 2600px) {
  .frame-child{
    width: 2500px;
  }
  .rectangle-parent{
    height: 2000px;
  }

  .as-a-registered{
    font-size: 50px;
  }

  .upscalepromedia-powered-by{
    font-size: 50px;
  }

  .component-36-icon,
  .component-37-icon{
    width: 3000px;
    height: 3000px;
    left: -100px;
    top: -800px;
  }

  .frame-child5{
    left: 800px;
  }

  .frame-child4{
    width: 800px;
    height: 800px;
    left: 850px;
    top: 200px;
  }
}


@media screen and (max-width : 1445px){
  .as-a-registered,
  .find-us-on,
  .frame-child2,
  .frame-inner,
  .rectangle-button,
  .frame-child1,
  .upscalepromedia-powered-by,
  .component-26,
  .as-a-registered{
      transform : translateY(-80px)
  }

  .upscalepromedia-powered-by{
    font-size: 30px;
  }

  .component-36-icon,
  .component-37-icon{
    width: 1500px;
    height: 1500px;
    left: -50px;
    top: -300px;
  }


}

@media screen and (max-width : 1030px){
  .as-a-registered,
  .find-us-on,
  .frame-child2,
  .frame-inner,
  .rectangle-button,
  .frame-child1,
  .upscalepromedia-powered-by,
  .component-26,
  .as-a-registered{
      transform : translateY(-80px)
  }


  .component-36-icon,
  .component-37-icon{
    width: 1400px;
    height: 1400px;
    left: -100px;
    top: -300px;
  }

  .frame-child4{
    width: 500px;
    height: 500px;
    left: 250px;
    top: 150px;
  }

  .image1-icon{
    width: 600px;
    height: 600px;
    left: 200px;
    top: 0px;
  }
  .frame-child5{
    transform :  scale(0.8) translateX(-300px)
  }
  .find-us-on{
    width: 500px;
    left: 440px;
  }
  .as-a-registered{
    font-size: 20px;
  }
  .component-26-inner{
    transform: translateX(-100px);
  }

  .frame-child1,
  .rectangle-button{
    transform : translateY(-75px)
  }


}

@media screen and (max-width : 920px){
  .as-a-registered,
  .find-us-on,
  .frame-child2,
  .frame-inner,
  .rectangle-button,
  .frame-child1,
  .upscalepromedia-powered-by,
  .component-26,
  .as-a-registered{
      transform : translateY(-80px)
  }


  .component-36-icon,
  .component-37-icon{
    width: 1400px;
    height: 1400px;
    left: -300px;
    top: -300px;
  }

  .frame-child4{
    width: 450px;
    height: 450px;
    left: 190px;
    top: 150px;
  }

  .image1-icon{
    width: 550px;
    height: 550px;
    left: 140px;
    top: 0px;
  }
  .frame-child5{
    transform :  scale(0.7) translateX(-500px)
  }
  .find-us-on{
    width: 500px;
    left: 440px;
  }
  .as-a-registered{
    font-size: 20px;
  }
  .component-26-inner{
    transform: translateX(-100px);
  }

  .frame-child1,
  .rectangle-button{
    transform : translateY(-75px)
  }

  .frame-child6{
    transform : scale(1.4) translate(20px,10px)
  }

  .frame-child2{
    transform: scale(1.4);
  }


}

@media screen and (max-width : 550px){
  .as-a-registered,
  .find-us-on,
  .frame-child2,
  .frame-inner,
  .rectangle-button,
  .frame-child1,
  .upscalepromedia-powered-by,
  .component-26,
  .as-a-registered{
      transform : translateY(-80px)
  }


  .component-36-icon,
  .component-37-icon{
    width: 1400px;
    height: 1400px;
    left: -400px;
    top: -300px;
  }

  .frame-child4{
    width: 450px;
    height: 450px;
    left: 40px;
    top: 150px;
  }

  .image1-icon{
    width: 550px;
    height: 550px;
    left: 0px;
    top: 0px;
  }
  .frame-child5{
    transform :  scale(0.4) translateX(-1400px)
  }
  .find-us-on{
    width: 500px;
    left: 440px;
  }
  .as-a-registered{
    font-size: 20px;
  }
  .component-26-inner{
    transform: translateX(-100px);
  }

  .frame-child1,
  .rectangle-button{
    transform : translateY(-75px)
  }

  .frame-child6{
    transform : scale(2.3) translate(35px,20px)
  }

  .frame-child2{
    transform: scale(2);
  }

  .upscalepromedia-powered-by{
    font-size: 20px;
  }

  .frame-child3{
    transform : scale(2.5) translate(80px,150px)
  }


}

@media screen and (max-width : 435px){
  .as-a-registered,
  .find-us-on,
  .frame-child2,
  .frame-inner,
  .rectangle-button,
  .frame-child1,
  .upscalepromedia-powered-by,
  .component-26,
  .as-a-registered{
      transform : translateY(-80px)
  }


  .component-36-icon,
  .component-37-icon{
    width: 1400px;
    height: 1400px;
    left: -400px;
    top: -300px;
  }

  .frame-child4{
    width: 450px;
    height: 450px;
    left: 0px;
    top: 150px;
  }

  .image1-icon{
    width: 550px;
    height: 550px;
    left: 0px;
    top: 0px;
  }
  .frame-child5{
    transform :  scale(0.4) translateX(-1415px)
  }
  .find-us-on{
    width: 500px;
    left: 440px;
  }
  .as-a-registered{
    font-size: 20px;
  }
  .component-26-inner{
    transform: translateX(-100px);
  }

  .frame-child1,
  .rectangle-button{
    transform : translateY(-75px)
  }

  .frame-child6{
    transform : scale(2.3) translate(25px,20px)
  }

  .frame-child2{
    transform: scale(2);
  }

  .upscalepromedia-powered-by{
    font-size: 20px;
  }

  .frame-child3{
    transform : scale(2.5) translate(55px,150px)
  }



}

@media screen and (max-width : 320px){
  .as-a-registered,
  .find-us-on,
  .frame-child2,
  .frame-inner,
  .rectangle-button,
  .frame-child1,
  .upscalepromedia-powered-by,
  .component-26,
  .as-a-registered{
      transform : translateY(-80px)
  }


  .component-36-icon,
  .component-37-icon{
    width: 1400px;
    height: 1400px;
    left: -500px;
    top: -400px;
  }

  .frame-child4{
    width: 350px;
    height: 350px;
    left: -30px;
    top: 110px;
  }

  .image1-icon{
    width: 450px;
    height: 450px;
    left: 0px;
    top: px;
  }
  .frame-child5{
    transform :  scale(0.3) translateX(-2050px)
  }
  .find-us-on{
    width: 500px;
    left: 440px;
  }
  .as-a-registered{
    font-size: 15px;
  }
  .component-26-inner{
    transform: translateX(-100px);
  }

  .frame-child1,
  .rectangle-button{
    transform : translateY(-75px)
  }

  .frame-child6{
    transform : scale(2.3) translate(25px,20px)
  }

  .frame-child2{
    transform: scale(2);
  }

  .upscalepromedia-powered-by{
    font-size: 15px;
  }

  .frame-child3{
    transform : scale(3.5) translate(30px,100px)
  }


}