b_mq_utils.scss

/* ==========================================================================
   Media queries Utilities
   ========================================================================== */
   
   $grid-breakpoints: (
  // Extra small screen / phone
  xs: 0,
  // Small screen / phone
  sm: 544px,
  // Medium screen / tablet
  md: 768px,
  // Large screen / desktop
  lg: 992px,
  // Extra large screen / wide desktop
  xl: 1200px
) !default;


// Grid containers
//
// Define the maximum width of `.container` for different screen sizes.

$container-max-widths: (
  sm: 576px,
  md: 720px,
  lg: 940px,
  xl: 1140px
) !default;

//Media queries start points
$mqPhone: 0px;
$mqPhablet: 481px;
$mqTablet: 768px;
$mqDesktop: 992px;
$mqWideScreen: 1200px;


//Mobile first
@mixin mobile-xs () {
  @media screen and (max-width: $mqSmartphone) {
    @content;
  }
}