@mixin for-hd()
  @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5)
    @content

@mixin for-ios-hd()
  @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2)
    @content

@mixin for-no-js() 
  .no-js body
    @content

@mixin for-screen()
  @media only screen
    @content

@mixin for-print()
  @media only print
    @content

@mixin for-mobile-portrait()
  @media only screen and ( max-width: 479px)
    @content
  .mq-mp
    @content

@mixin for-mobile-landscape()
  @media only screen and (max-width: 767px) and (min-width: 480px)
    @content
  .mp-ml
    @content

@mixin for-tablets()
  @media only screen and (max-width: 1024px) and (min-width: 768px)
    @content
  .mp-tb
    @content

@mixin for-large-screens( $start-width: 768px )
  @media only screen and (min-width: $start-width)
    @content
  .mq-ls
    @content

@mixin for-small-screens( $max-width: 767px )
  @media only screen and (max-width: $max-width )
    @content
  .mq-sm
    @content