$sm = 600px
$md = 960px
$lg = 1440px
$header_height = 200px;

// Prefer using this if possible
gt-sm()
  @media (min-width: $sm)
    {block}

gt-md()
  @media (min-width: $md)
    {block}

gt-lg()
  @media (min-width: $lg)
    {block}

shadow-0()
  box-shadow none

shadow-1()
  box-shadow 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24)

shadow-2()
  box-shadow 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23)

shadow-3()
  box-shadow 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23)

shadow-4()
  box-shadow 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22)

shadow-5()
  box-shadow 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22)

// Material
primary-block()
  background-color $background_primary
  color $text_default_light

secondary-block()
  background-color $background_secondary
  color $text_default_light

accent-block()
  background-color $accent
  color $text_default_light
