_vars.scss

@mixin display-flex() {
  display: -webkit-box; // Safari :(
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}

@mixin flex($val) {
  -webkit-box-flex: 1; // Safari :(
  -webkit-flex: $val;
  -moz-flex: $val;
  -ms-flex: $val;
  -o-flex: $val;
  flex: $val;
}

@mixin justify-content($val: center) {
  -webkit-box-pack: $val;  // Safari :(
  -webkit-justify-content: $val;
  -moz-justify-content: $val;
  -ms-justify-content: $val;
  -o-justify-content: $val;
  justify-content: $val;
}

@mixin align-items($val: center) {
  -webkit-box-align: $val;  // Safari :(
  -webkit-align-items: $val;
  -moz-align-items: $val;
  -ms-align-items: $val;
  -o-align-items: $val;
  align-items: $val;
}

@mixin align-self($val: center) {
  -webkit-align-self: $val;
  -moz-align-self: $val;
  -ms-align-self: $val;
  -o-align-self: $val;
  align-self: $val;
}

@mixin flex-direction($val) {
  -webkit-box-orient: vertical;  // Safari :(
  -webkit-flex-direction: $val;
  -moz-flex-direction: $val;
  -ms-flex-direction: $val;
  -o-flex-direction: $val;
  flex-direction: $val;
}

@mixin flex-wrap($val: nowrap) {
  -webkit-flex-wrap: $val;
  -moz-flex-wrap: $val;
  -ms-flex-wrap: $val;
  -o-flex-wrap: $val;
  flex-wrap: $val;
}

@mixin width-max-content() {
  width: -webkit-max-content;
  width: -moz-max-content;
  width: -ms-max-content;
  width: -o-max-content;
  width: max-content;
}

@mixin width-min-content() {
  width: -webkit-min-content;
  width: -moz-min-content;
  width: -ms-min-content;
  width: -o-min-content;
  width: min-content;
}

@mixin user-select($val: none) {
  -webkit-user-select: $val;
  -moz-user-select: $val;
  -o-user-select: $val;
  -ms-user-select: $val;
  user-select: $val;
}

@mixin calc($property, $expression) { 
  #{$property}: -moz-calc(#{$expression}); 
  #{$property}: -o-calc(#{$expression}); 
  #{$property}: -webkit-calc(#{$expression}); 
  #{$property}: calc(#{$expression}); 
}


@mixin filter($val: none) {
  -webkit-filter: $val;
  -moz-filter: $val;
  -o-filter: $val;
  -ms-filter: $val;
  //filter: $val;
}