// Susy Settings
$susy: (
  flow: ltr,
  math: fluid,
  output: float,
  gutter-position: after,
  container: 90%,
  container-position: center,
  columns: <%= data.layout.susy.total_columns %>,
  gutters: 1/3,
  column-width: false,
  global-box-sizing: border-box,
  last-flow: to,
  debug: (
    image: hide,
    color: rgba(#66f, .25),
    output: background,
    toggle: top right,
  ),
  use-custom: (
    background-image: true,
    background-options: false,
    box-sizing: true,
    clearfix: false,
    rem: true,
  )
);

$gutter-width: <%= data.layout.susy.gutter_width %>;
$column-width: <%= data.layout.susy.column_width %>;



// Breakpoint Settings
$breakpoint-to-ems: true;
<% data.layout.resolutions.each_with_index do |resolution, index| %>
$<%= resolution.target %>: <%= resolution.width %>px;
$<%= resolution.target %>-grid: "(<%= index %> * 2) ($column-width $gutter-width) inside fluid";
<% end %>



// Misc
$border-radius: .25em;
$sticky-contentinfo-height: rhythm(6);

@mixin square($size: $column-width) {
  width:  $size;
  height: $size;
}