Very helpful – thank you Mark.
I have used the “xs” image for both platforms and deleted the “content: none” line.
However the box with the text is covering the skyscrapers as oppossed to being over the ocean which is more aesthetically pleasing.
Additionally I enlarged the font size as it was quite small on the web browser. However this change is replicated on a mobile platform to the same degree and it is just too big.
This is the code I altered:
.page-id-10 .content h3 {
color:#fff;
font-size: 30px;
text-transform: uppercase;
}
.page-id-10 .content h1 {
color: #fff;
font-size: 50px;
}
Obviously this must be universal. Is there a way to have one set of rules for the web browser and another for the mobile?
Many thanks
Richard
Definitely not the browser as I cleared the cache (normally use Chrome) then tried it with internet explorer.
The website is http://www.e7global.co.uk
On a mobile the tagline says “MOBILISING LEGAL AND DEFENCE PROFESSIONALS” however on the web browser it simply mentions legal.