/*  0 - SETTINGS - TOOLS
 *
 *  Load the first two layers of the site.
  =========================================================== */

@import '../site/1-Settings/settings';
@import '../site/2-Tools/tools';

html {
  font-size: 20px;
}

/*  1 - Layout elements
 *  Design patterns (e.g. grids or media object)
 =========================================================== */

@import '1-Layouts/layouts';


/*  2 - COMPONENTS
 *  Discrete complete chunks of UI.
 *  Designed components
 =========================================================== */

@import '2-Components/components';


/*  3 - Templates
 *  Override styling for a specific template
 =========================================================== */

@import '3-Templates/templates';

/*  4 - UTILITIES
 *  High-specificity, very explicit selectors.
 *  Overrides and helper classes.
 =========================================================== */

@import '4-Utilities/utilities';