The code below will make iframe embeds responsive. Instead of openstreetmap use your own embed url.
Here is a working example: https://responsive-iframe.softr.app/
<div class="iframe-container">
<iframe class="responsive-iframe" src="https://www.openstreetmap.org/export/embed.html?bbox=12.639770507812502%2C52.24546054143251%2C13.793334960937502%2C52.786984035719925&layer=mapnik" frameBorder="0" title="Berlin">
</iframe>
</div>
<style>
.iframe-container {
position: relative;
overflow: hidden;
width: 100%;
padding-top: 56.25%; /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */
}
/* Then style the iframe to fit in the container div with full height and width */
.responsive-iframe {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
width: 100%;
height: 100%;
}
</style>