SCSS and CSS files overview

The template stylesheet is based on the SASS language. All .scss files are located in the  sass folder:

1. The sass/theme-styles folder includes main stylesheet files of the template, namely:

• _bootstrap-customization.scss  - styles for Bootstrap customization
  
• _footer.scss – styles for footer and components related to it
  
• _header.scss - stylesheet for the header, header variations, and all elements bundled with it;
• _mobile-notification-tabs.scss – stylesheet for mobile notification tabs;
  
• _section.scss — styles for rows (sections), animated background etc.
  
• _shop-cart.scss —  styles for shop cart.
  
• _stunning-header.scss — styles for stunning-header;
  
• _variables.scss - includes all global variables and their styles, main colors used in the template, font size, font families, etc.
  

2. The \sass\plugins folder includes stylesheets for all the plugins, used in the template.

3. The \sass\blocks folder includes stylesheets of all the template's blocks and components. 

4. The sass\widgets folder contains styles for all widgets in the theme. For convenience, the styles of a separate widget are moved to a separate file with the corresponding name. The file names of all widgets begin with the prefix "_w - *. Scss".

In the root of the sass/.. folder you will find the following files:

• theme-font.scss - Theme font stylesheet file;
• rtl.scss - stylesheets for the RTL version of the template;
•  main.scss - it provides paths for proper compilation of the blocks stylesheet into a single file - /css/main.css.