Responsive Images in a Responsive Container?

Question

How do I get this Responsive Image, or what is supposed to be, to fit into the parent it is nested in?

I have applied the proper CSS, I have not defined any width or height in the HTML. Here is my CSS.

.header {
    height: 25%;
    width: 95%;
    padding: 2.5%;
    background: #fff;
}
.header img {
    max-width: 100%;
    height: auto;
}

You can view the issue here: http://www.client.noxinnovations.com/jensenblair/

The big circle image? That's supposed to be Responsive.

Thanks!

Answer 1

I may be missing something here, but setting:

height:100%;

For the image works for me...