Как отредактировать карту в соответствии с макетом

Всем привет! В моём макете есть карта, на которой отмечен адрес магазина:

В своём проекте я использовал googleMaps.

Вот мой html-код:

<iframe class="custom-iframe"
                            src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2483.040502930052!2d-0.14200518412185018!3d51.51247291815307!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x487604d5767c9015%3A0x1cf0ab0381c7fd45!2s180%20Regent%20St%2C%20Soho%2C%20London%20W1B%205TJ%2C%20UK!5e0!3m2!1sen!2sby!4v1589627049382!5m2!1sen!2sby"
                            frameborder="0" style="border:0;" allowfullscreen="" aria-hidden="false"
                            tabindex="0"></iframe>

Вот мой CSS-код:

.custom-iframe {
                width: 100%;
                height: 100%;
            }

А вот результат:

Подскажите, как привести изображение, которое я получил в своём проекте в соответствии с макетом? Была конечно мысль вырезать картинку с макета и вставить её через тэг "img", но всё-таки карта должна быть картой, а не картинкой. Коллеги, подскажите пожалуйста, как решить данный вопрос.