Looking at your .css, you have a fixed width of 800px for the header. This is affecting the widget and the responsive sizing on smaller screens.
Changing it to “100%” allows the header image to be fluid and automatically resize:
/* Title Area
——————————————— */
.title-area {
font-family: “Martel Sans”,sans-serif;
font-weight: 600;
float: left;
padding: 0;
width: 100%;
}
Also, you need to add this bit of code to the bottom of your .css to allow the header image to be sized (contained).
.header-image .site-title a {
background-size: contain !important;
}
You might (using “inspect element” on your browser) to change some of your alterations to the .css.
It looks like you have adjusted some widths here and there. I took out your complete .css and replaced it with the original .css from Epik, and everthing worked..so you might have some conflicting code somewhere.
.
