You could set the styles of the iframe to something like <iframe .... style="... ;width: 100%;max-width:1200px;">.

If you wanted to center the text, there is a plugin that allows you to further customise it: https://plugins.matomo.org/CustomOptOut

Thank you for responding so quickly. Clarification please. We are using the Cloud version so it's not installed in our web server. Will this plugin work?

It won't be available on the cloud. I suggest for any cloud related questions you get in touch with our support: support at matomo.cloud

I suggest you change the <iframe style="border: 0; height: 100px; width: 1200px;" to <iframe style="border: 0;height: 120px;width: 100%;max-width:1200px;" and I noticed you also need to update the element above from <div class="row"> to <div class="col-12"> otherwise it cannot get the full width. You nested before a row within a row instead of making it a column.

should look like this:

and then you maybe don't need to center the text.

Thank you so much!! I made the 2 changes (iframe and col-12) as you suggested and the responsiveness is perfect. Very much appreciated.