Reply To: Custom Header Responsiveness

Thank you Eric, that was quite helpful and sent me in the right direction.

Epik’s header required a bit more info for the site title as well for the area used
when inserting the header image via Dashboard. Below is what I used to make this work by
placing that code in the 480 and 580 @media sections.

.header-image .site-title a {
float: left;
min-height: 110px;
width: 100%;
}

.header-image .site-header,
.header-image .site-header .wrap {
background-size: contain !important;
}

The minimum height can be adjusted depending on what is within the
header right widget area.

For the @media sections of 767 or larger, I only needed this added:

.header-image .site-header,
.header-image .site-header .wrap {
background-size: contain !important;
}

Hope this also helps others that desire to use custom headers with the Epik theme
for mobile responsive.