@use "./variables" as *;

@mixin flex($alignItem, $justifyContent) {
  display: flex;
  align-items: $alignItem;
  justify-content: $justifyContent;
}

@mixin absolute() {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
}

@mixin size($width, $height) {
  width: $width;
  height: $height;
}
@mixin mb-500 {
  @media only screen and (max-width: 500px) {
    @content;
  }
}
@mixin mobile {
  @media only screen and (max-width: $mobile-width) {
    @content;
  }
}

@mixin tablet {
  @media only screen and (max-width: $tablet-width) {
    @content;
  }
}

@mixin desktop-1200 {
  @media only screen and (max-width: $desktop-width) {
    @content;
  }
}

@mixin desktop-1300 {
  @media only screen and (max-width: 1300px) {
    @content;
  }
}

@mixin desktop-1400 {
  @media only screen and (max-width: 1400px) {
    @content;
  }
}
@mixin desktop-1450 {
  @media only screen and (max-width: 1450px) {
    @content;
  }
}
@mixin desktop-1550 {
  @media only screen and (max-width: 1550px) {
    @content;
  }
}
@mixin desktop-1650 {
  @media only screen and (max-width: 1650px) {
    @content;
  }
}
@mixin desktop-1750 {
  @media only screen and (max-width: 1750px) {
    @content;
  }
}
@mixin desktop-1900 {
  @media only screen and (max-width: $desktop-1900) {
    @content;
  }
}