Hero title copy too large on Galaxy 8S Phone - Motion Theme

[jaimie2]

How do I make the title size within the hero image smaller and stack on mobile viewports, say Galaxy 8S size. If someone can send a code snippet so I can update the css on my end. Thank you

Live site: https://www.walaxr.com/

[GemPages · Accepted solution]

Hello @jaimie2 ,

It's GemPages support team and glad to support you today.

I would like to give you the recommendation to support you so kindly follow the steps below:

1. Go to Online Store > Theme > Edit code of your current theme

2. Open your theme.liquid theme file

3. Paste the below code before </head>

<style>
@media (max-width: 480px){
  .h1.hero__title {
   font-size: 20px;
 }
}
</style>

If you require any further information, feel free to contact me.

Best regards,
GemPages Support Team

[jaimie2]

The code snippet broke the hero image, added extra arrows to the CTA and changed the font to black. Is there a simplified code snippet to decrease the font size of the hero copy for mobile? @GemPages thank you for assistance