I've added a header logo and banner to mu Simple Theme via Extending SilverStripe 3 Site Settings.

The logo and banner doesn't scale on small screens. I have used SetRatioSize.
see www.sponsor-concepts.com/stripe

Is this a CSS issue, of did I make a mistake in the header.ss code?

Many thanks for your help!

Header.ss
<header class="header" role="banner">
<div class="inner">
<div class="unit size4of4 lastUnit">
<a href="$BaseHref" class="brand" rel="home">
$SiteConfig.LogoImage.SetRatioSize(300,70)
</a>
<% if $SearchForm %>
<span class="search-dropdown-icon">L</span>
<div class="search-bar">
$SearchForm
</div>
<% end_if %>
<% include Navigation %>
</div>
$SiteConfig.HeaderImage.SetRatioSize(1100,1100)
</div>
</header>

You can add inline style like below
<img src="$SiteConfig.LogoImage.SetRatioSize(300,70).url" style="max-width:100%;height:auto;">

or add an entry for image in external style sheet
img{
max-width:100%;height:auto;
}

Thank you very much! Works great, this was exactly what I needed..

you are welcome