Instructions

The site uses fluid design based on the font size of the body. Please keep this in mind when making changes to the template.
‍
What this means: Every part of this website is fully responsive and adjusts to the screen's width. It has been crafted to be scalable and ensure a perfect and consistent experience on all devices. For this reason, please follow the following advice:

• Never change the font size of the body.
  

• If you wish to change the size of a typographic element, please refer to its respective tag in the Styleguide. For instance, Paragraph, Paragraph accent, Big Headline, etc.
  

• If you want to change or add padding, margin, or typography size, prefer using the "em" unit to ensure the overall proportion of your website remains flawless.
  

• Use the "px" unit for small elements or elements you don't want to scale throughout viewports. In this design, the font size of the paragraphs is fixed.
  

• By using the "em" unit, you'll most likely not have to worry about responsiveness; it should scale automatically throughout all viewports for easy and fast editing. Be sure to check for more complexe designs, mostly for vertical screens.
  

• Please use the "Is Padding" tag to add consistent horizontal paddings to your containers.
  

• The website uses a 12-column grid. Don't hesitate to use the column classes to create your own layouts if needed. Check the Styleguide utility tab for more information.
  

To avoid the content of the site to pop before the Preloader shows, please follow these steps:

• Before publishing the site for production, be sure to set the display of the 'Preloader' block to 'Block'.
  

• Enter the 'Preloader' Block by double clicking on it.
  

• Select the 'Preloader' Block, set its display to 'Block'.
  

• Save and publish your work.
  

As working with huge typography can be challenging, I created two variations of the home hero section.
Use it to display your brand in the best way possible.

If you need any help or have any remarks or want to leave feedback, don't hesitate to contact me: fireal@resonancestudio.co

I am happy to assist you and would like to know how I can improve your experience.