Responsive Header-Executive Theme

[Florissa]

I have increased the height of the header image to 225 pixels on the executive theme. It is originally 100 pixels.  This displays fine on the desktop version of the site.  Now on the mobile version, the header is cut off.  I have attached a picture as the site is not live yet.  Below is the original CSS:

/* Header
------------------------------------------------------------ */

#header {
margin: 0 auto;
min-height: 100px;
width: 100%;
}

#title-area {
float: left;
overflow: hidden;
width: 25%;
}

#title {
font-family: 'Open Sans', sans-serif;
font-size: 36px;
font-weight: bold;
line-height: 1.25;
margin: 0 0 5px;
}

#title a,
#title a:hover {
color: #222;
display: block;
padding: 27px 0 0;
text-decoration: none;
}

#header .widget-area {
float: right;
width: 75%;
}
/* Image Header - Partial Width
------------------------------------------------------------ */

.header-image #title-area,
.header-image #title,
.header-image #title a {
display: block;
float: left;
height: 100px;
overflow: hidden;
padding: 0;
text-indent: -9999px;
width: 25%;
}
/* Image Header - Full Width
------------------------------------------------------------ */

.header-full-width #title-area,
.header-full-width #title,
.header-full-width #title a {
width: 100%;
}

 

I made the following changes:

.header-image #title-area, .header-image #title, .header-image #title a {
display: block;
float: left;
height: 225px;
}

#header {
margin: 0 auto;
min-height: 225px;
}

 

I tried the following to make it responsive, but this did not work: 

.header-image #title a {
width: 100%;
background-size: 100% auto !important;
}

Any help anyone could provide would be greatly appreciated.  Thanks!

Here is the link to an image: http://entrepreneurs.techiepros.com/wp-content/uploads/2013/05/MG-SCREENSHOT.png

http://entrepreneurs.techiepros.com/wp-content/uploads/2013/05/MG-SCREENSHOT.png

[dev]

Try the Genesis Responsive Header plugin. It works on many themes.

Genesis Responsive Header Updated

[Author]

Posts