@charset "UTF-8";

///
/// @name $su-screen-xs
///
/// @group variable
$su-screen-xs: 0 !default;

///
/// @name $su-screen-sm
///
/// @group variable
$su-screen-sm: 576px !default;

///
/// @name $su-screen-md
///
/// @group variable
$su-screen-md: 768px !default;

///
/// @name $su-screen-lg
///
/// @group variable
$su-screen-lg: 992px !default;

///
/// @name $su-screen-xl
///
/// @group variable
$su-screen-xl: 1200px !default;

///
/// @name $su-screen-2xl
///
/// @group variable
$su-screen-2xl: $su-site-max-width !default;

///
/// Mixin for basic mobile-first media query for xs-and-up screen size.
///
/// @name $su-breakpoint-xs
///
/// @group variable
$su-breakpoint-xs: 'only screen and (min-width: #{$su-screen-xs})' !default;

///
/// Mixin for basic mobile-first media query for xs-only screen size.
///
/// @name $su-breakpoint-xs-only
///
/// @group variable
$su-breakpoint-xs-only: 'only screen and (min-width: #{$su-screen-xs}) and (max-width: #{$su-screen-sm - 1})' !default;

///
/// Mixin for basic mobile-first media query for sm-and-up screen size.
///
/// @name $su-breakpoint-sm
///
/// @group variable
$su-breakpoint-sm: 'only screen and (min-width: #{$su-screen-sm})' !default;

///
/// Mixin for basic mobile-first media query for sm-only screen size.
///
/// @name $su-breakpoint-sm-only
///
/// @group variable
$su-breakpoint-sm-only: 'only screen and (min-width: #{$su-screen-sm}) and (max-width: #{$su-screen-md - 1})' !default;

///
/// Mixin for basic mobile-first media query for md-and-up screen size.
///
/// @name $su-breakpoint-md
///
/// @group variable
$su-breakpoint-md: 'only screen and (min-width: #{$su-screen-md})' !default;

///
/// Mixin for basic mobile-first media query for md-only screen size.
///
/// @name $su-breakpoint-md-only
///
/// @group variable
$su-breakpoint-md-only: 'only screen and (min-width: #{$su-screen-md}) and (max-width: #{$su-screen-lg - 1})' !default;

///
/// Mixin for basic mobile-first media query for lg-and-up screen size.
///
/// @name $su-breakpoint-lg
///
/// @group variable
$su-breakpoint-lg: 'only screen and (min-width: #{$su-screen-lg})' !default;

///
/// Mixin for basic mobile-first media query for lg-only screen size.
///
/// @name $su-breakpoint-lg-only
///
/// @group variable
$su-breakpoint-lg-only: 'only screen and (min-width: #{$su-screen-lg}) and (max-width: #{$su-screen-xl - 1})' !default;

///
/// Mixin for basic mobile-first media query for xl-and-up screen size.
///
/// @name $su-breakpoint-xl
///
/// @group variable
$su-breakpoint-xl: 'only screen and (min-width: #{$su-screen-xl})' !default;

///
/// Mixin for basic mobile-first media query for xl-only screen size.
///
/// @name $su-breakpoint-xl-only
///
/// @group variable
$su-breakpoint-xl-only: 'only screen and (min-width: #{$su-screen-xl}) and (max-width: #{$su-screen-2xl - 1})' !default;

///
/// Mixin for basic mobile-first media query for 2xl-and-up screen size.
///
/// @name $su-breakpoint-2xl
///
/// @group variable
$su-breakpoint-2xl: 'only screen and (min-width: #{$su-screen-2xl})' !default;

///
/// Just in case.
///
/// @name $su-breakpoint-2xl-only
///
/// @group variable
$su-breakpoint-2xl-only: $su-breakpoint-2xl;
