mobile site issues

Love the theme so far. I am having 2 issues with the responsiveness of mobile site.

  1. Site identity logo on mobile site: The logo ‘PUNQTUM’ at the top is stretched out. Letters should be more “square” not stretched. This only happens on mobile site. It looks fine in preview mode in the customizer tool in WP
  2. First parallax section (image of Zodiac): does not scale on mobile site. Rather it is simply cut off on both sides. It is set to Background Full

I have disabled the mobile optimization in Jetpack and still it does not adjust. As a designer/videographer I cannot have my brand looking wonky.

Pease help!

Hey there,
Hope you’re doing well today

  1. Kindly add and save the following code to Appearance > Customize > Additional CSS:

@media(max-width: 550px){
.logo {
height: 32px!important;
width: auto!Important;

  1. The issue with scaling on mobile is that with your image, the orientation makes it extremely difficult to display the entire image without having to cut the sides. If you were to display the entire image, it would look like the attached screenshot (I coded it just so you could see). An issue like this is totally out of our control, it’s just a small price to pay for responsiveness. Maybe you could use a different image for mobile devices, that’s just about the best thing you could do if you really want complete responsiveness.

Sorry about that.

Best Regards,

Got it. How would I specify a different image solely for mobile devices?
Also, the code provided does not fix the mobile site ID issue. It is still stretched out

thank you. PLease advise

Hi there,
Thanks for keeping in touch with us.

Kindly add and save the following code to Appearance > Customize > Additional CSS:

@media(max-width: 550px){
.parallax-window.fullscreen {
background-image: url(“http://yourimagelinkhere”)!important;

Simply replace http://yourimagelinkhere with the link to your image and you should be good.

I hope this helps :slight_smile:

Best Regards,