Google Map iFrame

Hi,

wie kann ich den iFrame von Google Maps responsive machen? Die CSS befehle scheinen nicht zu greifen:

habe es so probiert:

<div class="g-maps">
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3101.061508041659!2d14.229112291265675!3d48.24345117276899!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x4773969b09367ef7%3A0x43293d8ca0a33b1d!2sCity+Outlet+Pasching!5e0!3m2!1sde!2sat!4v1465984935071" width="1920" height="600" frameborder="0" style="border:0" allowfullscreen></iframe>
</div>

in der style .css:

.g-maps {
    position: relative;
    height: 0;
    overflow: hidden;
    padding-bottom: 50%; 
}
.g-maps iframe {
    position: absolute;
    width: 100% !important;
    height: 100% !important;
    top: 0;
    left: 0;
}

Ich möchte lediglich die maps responsive und auf 100% breite haben.

Bitte um Hilfe – habe leide nichts im Forum gefunden.

Danke!!