Problem with main-styles.css in Magento 2

[aleenakhandfa2]

I've created a website with Magento 2 using a Codazon Template infinite.

I'm using URL #1 for the landing page called Megastore and the extension URL #1/shop for the page shop.

The difference between both pages is:

#1 doesn't have navigation and is a bit a different design.

#2 had navigation.

My problem is: why do I have different content in both main-styles.css and why it is disrupting my layout of #2 if I use #1 as a landing page?

What do you need for further information to help me?

Thanks a lot for your time and help.

[LitCommerce Expert]

I just had this issue, too, and found that it is because of the order by which the CSS and less are compiled. You need to use the style.less file. Copy that from the blank theme and I noticed that the .css files were then auto-generated with my custom CSS directory. However, any changes that would need to be made in the styles.less could most likely be made in the _theme.less. This is how I ultimately solved the issue. Within the _theme.less you can make specific CSS changes or make changes to variables like colors and such.