.mobilemain {
  top: 7%;
  left: -2%;
  bottom: 0;
  right: 0;
  margin: auto auto;
  overflow: hidden;
  position: absolute;
  width: 77%;
  height: 77%;
  /* background: red; */
}
.mobileportlogo img,
.mobileporttext img,
.mobileportclose img,
.mobileportleftwingframe1 img,
.mobileportleftwingframe4 img,
.mobileportrightwingframe1 img,
.mobileportrightwingframe4 img,
.mobileportcreationbtn img,
.mobileportfindstorebtn img,
.mobileportshopnowbtn img,
.mobileportteasetxt img,
.mobileportstar1 img,
.mobileportstar2 img,
.mobileportstar3 img,
.mobileportstar4 img,
.mobileportstar5 img {
  width: 100%;
  height: auto;
}
.mobileportclose {
  width: 7%;
  position: absolute;
  right: 1%;
  top: 1%;
  z-index: 9;
}
.mobileportframe1 {
  width: 100%;
  height: 100%;
  background-image: url("../images/fame1_lanscape.jpg");
  background-size: cover;
  background-position: -328px -23px;
  transform: scale(1.1);
}
.mobileportlogo {
  width: 80%;
  position: absolute;
  bottom: 7%;
  left: 50%;
  transform: translateX(-50%);
}
.mobileporttext {
  width: 60%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.mobileportleftwingframe1 {
  width: 30%;
  position: absolute;
  top: 54%;
  left: 6%;
  transform-origin: 92% 74%;
}
.mobileportrightwingframe1 {
  width: 37%;
  position: absolute;
  top: 67%;
  left: 55%;
  transform-origin: 6% 44%;
}
.mobileportframe2 {
  width: 100%;
  height: 100%;
  background-image: url("../images/overlay_image_potrait-img.jpg");
  background-size: cover;
  background-position: center;
  transform: scale(1.1);
  position: absolute;
  top: 0%;
}
.mobileportframe3 {
  width: 100%;
  height: 100%;
  background-image: url("../images/frame2_white_potrait.jpg");
  background-size: cover;
  background-position: center;
  transform: scale(1.15);
  position: absolute;
  top: 0%;
}
.mobileportcreationbtn {
  width: 75%;
  position: absolute;
  top: 20%;
  left: 50%;
  transform: translateX(-50%);
}
.mobileportframe4 {
  width: 100%;
  height: 100%;
  background-image: url("../images/fame4_lanscape.jpg");
  background-size: cover;
  background-position: -230px -12px;
  transform: scale(1);
  position: absolute;
  top: 0%;
}
.mobileportteasetxt {
  right: 0%;
  width: 60%;
  position: absolute;
  bottom: 10%;
}
.mobileportleftwingframe4 {
  width: 40%;
  position: absolute;
  left: -10%;
  top: 6%;
  transform-origin: 92% 74%;
}
.mobileportrightwingframe4 {
  width: 50%;
  position: absolute;
  left: 67%;
  top: 28%;
  transform-origin: 6% 44%;
}
.mobileportfindstorebtn {
  width: 35%;
  position: absolute;
  bottom: 4%;
  left: 6%;
}
.mobileportshopnowbtn {
  width: 32%;
  position: absolute;
  bottom: 4%;
  right: 4%;
}
.mobileportstar1 {
  width: 9%;
  position: absolute;
  top: 7%;
  left: 77%;
}
.mobileportstar2 {
  width: 11%;
  position: absolute;
  top: 9%;
  left: 86%;
}
.mobileportstar3 {
  width: 9%;
  position: absolute;
  top: 13%;
  left: 79%;
}
.mobileportstar4 {
  width: 12%;
  position: absolute;
  top: 67%;
  left: 14%;
}
.mobileportstar5 {
  width: 8%;
  position: absolute;
  top: 71%;
  left: 27%;
}