nicoencarnacion

// USAGE

/*
.box {
  width: 100%;

  @include bp(mobile-up) {
    width: 100px;
  }
}

nicoencarnacion

$mobile-cutoff: 480px;
$tablet-cutoff: 768px;
$sdesktop-cutoff: 1136px;
$desktop-cutoff: 1440px;
$xlarge-cutoff: 1920px;

$mobile-down: "only screen and (max-width: #{$mobile-cutoff})";
$tablet-down: "only screen and (max-width: #{$tablet-cutoff})";
$sdesktop-down: "only screen and (max-width: #{$sdesktop-cutoff})";
$desktop-down: "only screen and (max-width: #{$desktop-cutoff})";

nicoencarnacion

/* -- flexbox -- */

/* -- flexbox utilities -- */

@mixin flexbox {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;