.step-b {
  display: none;
}

.text {
  width: max-content;
  transform-origin: left top;
}

.step1-1 {
  right: 80%;
  top: 26%;
  display: block;
  transform-origin: right top;
}

.step1-2 {
  left: 19%;
  top: 38%;
  transform-origin: left top;
}

.step2-1 {
  right: 49%;
  top: 34%;
  transform-origin: right top;
}

.step2-1 .popover-icon {
  position: absolute;
  left: -250%;
  top: 255%;
}

.step2-1 .popover-for-icon {
  width: 725px;
  transform: none !important;
  top: 400% !important;
  left: -268% !important;
}

.step2-1 .popover-for-icon .arrow {
  top: -10px !important;
  left: 20px !important;
}

.step2-2 {
  right: 30.5%;
  top: 44%;
  transform-origin: right top;
}

.step2-3 {
  right: 50%;
  top: 76%;
  transform-origin: right top;
}

.step2-3 .popover-icon1 {
  position: absolute;
  left: 2%;
  top: -329px;
}

.step2-3 .popover-for-icon1 {
  width: 620px;
  transform: none !important;
  top: -370px !important;
  left: 35px !important;
}

.step2-3 .popover-icon2 {
  position: absolute;
  left: 2%;
  top: -295px;
}

.step2-3 .popover-for-icon2 {
  width: 830px;
  transform: none !important;
  top: -335px !important;
  left: 35px !important;
}

.step2-3 .popover-icon3 {
  position: absolute;
  left: 2%;
  top: -262px;
}

.step2-3 .popover-for-icon3 {
  width: 560px;
  transform: none !important;
  top: -314px !important;
  left: 35px !important;
}

.step3-1 {
  left: 35%;
  bottom: 50%;
  transform-origin: left bottom;
}

.step3-2 {
  right: 72%;
  bottom: 14%;
  transform-origin: right bottom;
  width: 292px;
}

.step3-3 {
  left: 29%;
  top: 8%;
  transform-origin: left top;
}

.step3-4 {
  right: 14%;
  bottom: 39%;
  transform-origin: right bottom;
}

.step3-5 {
  left: 23%;
  bottom: 23%;
  transform-origin: left bottom;
}

.step4-2 {
  left: 64%;
  top: 50.5%;
  transform-origin: left top;
}

.step4-2.text-b {
  left: 80%;
  top: 49%;
  width: 205px;
}

.step4-2 .step-a {
  display: none !important;
}

.step4-3 {
  left: 74%;
  top: 45%;
  width: 245px;
}

.step4-4 {
  top: 49%;
  width: 236px;
  left: 72%;
}

.step4-5 {
  right: 7%;
  top: 9%;
  transform-origin: right top;
}

.mobile-step4-3.text-b {
  width: 150px;
  left: auto;
  top: auto;
  right: 83.5%;
  bottom: 65%;
  transform-origin: right bottom;
}

.mobile-step4-4 {
  display: none;
  top: auto;
  width: 241px;
  left: 48%;
  bottom: 37%;
  transform-origin: left bottom;
}

.mobile-step4-5 {
  display: none;
  width: 175px;
  top: 52%;
  left: 85%;
}

.mobile-step4-6.text-b {
  top: 52%;
  left: auto;
  right: 85%;
  width: 145px;
  transform-origin: right top;
}

.mobile-step4-7 {
  left: 50%;
  width: 200px;
  top: auto;
  bottom: 38%;
  transform-origin: left bottom;
}

.mobile-step4-8 {
  left: 85%;
  top: 51%;
  width: 170px;
}

@media (max-width: 1024.98px) {
  .step1-1 {
    right: 55%;
    top: 35%;
  }
  .step1-2 {
    left: 15%;
    top: 8%;
  }
  .step2-1 {
    top: 31%;
    right: 31%;
  }
  .step2-1 .popover-icon {
    position: absolute;
    left: -204%;
    top: 275%;
  }
  .step2-1 .popover-for-icon {
    width: 560px;
    transform: none !important;
    top: 400% !important;
    left: -218% !important;
  }
  .step2-1 .popover-for-icon .arrow {
    top: -10px !important;
    left: 20px !important;
  }
  .step2-2 {
    right: 16%;
    top: 38%;
  }
  .step2-3 {
    right: 2.5%;
    top: 36%;
  }
  .step2-3 .popover-icon1,
  .step2-3 .popover-icon2,
  .step2-3 .popover-icon3,
  .step2-3 .popover-for-icon1,
  .step2-3 .popover-for-icon2,
  .step2-3 .popover-for-icon3 {
    display: none;
  }
  .step3-1 {
    left: 40%;
    bottom: 55%;
  }
  .step3-2 {
    right: 11%;
    bottom: 39%;
    width: 400px;
  }
  .step3-3 {
    left: 30%;
    top: 5%;
  }
  .step3-4 {
    right: 14%;
    bottom: 43%;
  }
  .step3-5 {
    left: 5%;
    bottom: 6%;
  }
  .step4-2 {
    left: 26%;
    top: 56.5%;
  }
  .step4-2.text-b {
    left: 45%;
    top: 36%;
    width: auto;
  }
  .step4-2 .step-a {
    display: block !important;
  }
  .step4-3 {
    left: 40%;
    width: 487px;
  }
  .step4-4 {
    top: 43%;
    left: 40%;
  }
  .step4-5 {
    transform-origin: left top;
    left: 48%;
    top: 69%;
  }
}

@media screen and (orientation: landscape) and (max-width: 1200px) {
  .mobile-step4-3.text-b {
    width: 150px;
    left: auto;
    top: auto;
    right: 83.5%;
    bottom: 65%;
    transform-origin: right bottom;
  }
  .mobile-step4-4 {
    display: none;
    top: auto;
    width: 241px;
    left: 48%;
    bottom: 37%;
    transform-origin: left bottom;
  }
  .mobile-step4-5 {
    display: none;
    width: 175px;
    top: 52%;
    left: 85%;
    transform-origin: left top;
  }
  .mobile-step4-6.text-b {
    top: 52%;
    left: auto;
    right: 85%;
    width: 145px;
    transform-origin: right top;
  }
  .mobile-step4-7 {
    left: 50%;
    width: 200px;
    top: auto;
    bottom: 38%;
    transform-origin: left bottom;
  }
  .mobile-step4-8 {
    left: 85%;
    top: 51%;
    width: 170px;
  }
}

@media screen and (orientation: portrait) {
  .mobile-step4-3.text-b {
    width: 225px;
    text-align: center;
    right: 21%;
    bottom: 15%;
  }
  .mobile-step4-4 {
    display: none;
    top: auto;
    width: 241px;
    left: 37%;
    bottom: 21%;
  }
  .mobile-step4-5 {
    width: 225px;
    text-align: center;
    left: 21%;
    top: 78%;
  }
  .mobile-step4-6.text-b {
    width: 188px;
    right: 32%;
  }
  .mobile-step4-7 {
    left: 37%;
    top: 67%;
  }
  .mobile-step4-8 {
    width: 204px;
    text-align: center;
    top: 78%;
    left: 24%;
  }
  .mobile-step4-9 {
    transform-origin: left top;
    left: 48%;
    top: 69%;
  }
}
/*# sourceMappingURL=file-upload.css.map */