/* ==========================================================================
   Mixins
   ========================================================================== */
/**
* Media Query
*/

@mixin mq($breakpoint) {
  $mq-xxs: "(max-width: 599px)";
  $mq-xs: "(min-width: 600px) and (max-width: 767px)";
  $mq-sm: "(min-width: 768px) and (max-width: 991px)";
  $mq-md: "(min-width: 992px) and (max-width: 1199px)";
  $mq-lg: "(min-width: 1200px)";

  @if $breakpoint == xxs {
    @media #{$mq-xxs} { @content; }
  }
  @if $breakpoint == xs {
    @media #{$mq-xs} { @content; }
  } @else if $breakpoint == sm {
    @media #{$mq-sm} { @content; }
  } @else if $breakpoint == md {
    @media #{$mq-md}  { @content; }
  } @else if $breakpoint == lg {
    @media #{$mq-lg}  { @content; }
  }
}

/**
* Border-Radius
*/
@mixin customBorderRadius($topLeft: 0, $topRight: 0, $bottomRight: 0, $bottomLeft: 0) {
  @if $topLeft != 0 { border-top-left-radius: $topLeft; }
  @if $topRight != 0 { border-top-right-radius: $topRight; }
  @if $bottomRight != 0 { border-bottom-right-radius: $bottomRight; }
  @if $bottomLeft != 0 { border-bottom-left-radius: $bottomLeft; }
}