Untitled

<meta name="viewport" content="width=device-width" />

<style>

    *,

    *:after,

    *:before {

      -webkit-box-sizing: border-box;

      box-sizing: border-box;

    }

  

    .ue-popup__background {

      background-color: rgba(0, 0, 0, 0.8);

      display: flex;

      justify-content: center;

      align-items: center;

      overflow: visible;

      position: relative;

    }

    .ue-popup__content {

      margin: auto;

      display: flex;

      box-sizing: border-box;

      position: relative;

      max-width: 200%; 

      max-height: 200%;

     overflow: visible;

    }

    .ue-submit-button {

      border: none;

      background-color: transparent;

     max-width: 100%; 

    }

    .image-popup {

          max-width: 100%; 

  }

    a#submitButton img {

  pointer-events: none;

}

.container .btn {

  position: absolute;

  top: 90%;

  left: 50%;

  transform: translate(-50%, -50%);

  -ms-transform: translate(-50%, -50%);

  background-color: transparent;

  color: white;

  font-size: 16px;

  padding: 12px 24px;

  border: none;

  cursor: pointer;

  border-radius: 0px;

  text-align: center;

  width: 100%;

}

.centered {

  position: absolute;

  top: 37%;

  left: 50%;

  transform: translate(-50%, -50%);

  width: 100%;

}

  

 @media (max-width: 450px) {

     .btnimg {

        width: 140px;

      }

  }

 @media (max-width: 380px) {

     .btnimg  {

        width: 120px;

      }

  }

    @media (max-width: 320px) {

     .btnimg  {

        width: 100px;

      }

  }

  </style>

<div class="ue-popup__background">

    <div class="ue-popup__content">

      <span data-v-4f1211ad="" data-v-1888da8b="" data-dismiss="true"

        style="top: 15px; cursor:pointer; right: 10px; color: rgb(0, 0, 0); font-size: 2em; width: 1em; height: 1em; line-height: 1em; display: block; position: absolute; z-index: 2;">

        <svg data-v-4f1211ad="" xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 24 24" fill="none"

          stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-x">

          <line data-v-4f1211ad="" x1="18" y1="6" x2="6" y2="18"></line>

          <line data-v-4f1211ad="" x1="6" y1="6" x2="18" y2="18"></line>

        </svg>

      </span>

<div class="container">

  <a id="submitButton" class="btn" href="https://www.user.com">

         <img alt="" class="btnimg" src="https://media.user.com/uploads/ohiwhb-aobstarczyk/screenshot-2022-10-14-at-16-09-49_zxOUqrN.png">

      </a>

</div>

        <img src="https://media.user.com/uploads/ohiwhb-aobstarczyk/screenshot-2022-10-14-at-16-06-56_2NFfijJ.png" class="image-popup">

     </div>

  </div>

  <script>

  var popupIframe = window.top.document.querySelector('#ue_form');



 popupIframe.id = "popup-iframe-1";

  var parentHeader = window.top.document.head;

  var iStyleScript = document.createElement('style');

  iStyleScript.type = "text/css"

  iStyleScript.innerHTML =

    'iframe {' +

     'height: 500px !important;' +

     'width: 170px !important;' +

  '}' +

  '#ue_form { height: auto !important; }' +

  '#popup-iframe-1 {' +

    'height: 500px !important;' +

    'width: 170px !important;' +

    'position: fixed !important;' +

    'top: 20% !important;' +

    'right: 2% !important;' +

      'justify-content: center;' +

      'align-items: center;' +

      'max-width: auto;' +

      'max-height: auto;' +

  '}'; 

    

parentHeader.appendChild(iStyleScript);

</script>