//Mixins

@mixin fontstyle($size, $weight, $spacing, $col)
  font-size: $size
  font-weight: $weight
  letter-spacing: $spacing
  color: $col

@mixin buttomstyle($pl, $pr, $pt, $pb, $border, $radius, $bc)
  padding-left: $pl
  padding-right: $pr
  padding-top: $pt
  padding-bottom: $pb
  border: $border
  border-radius: $radius
  background-color: $bc
  cursor: pointer

@mixin transform-scale($scale)
  -webkit-transform: scale($scale) !important
  -moz-transform: scale($scale) !important
  -ms-transform: scale($scale) !important
  -o-transform: scale($scale) !important
  transform: scale($scale) !important

@mixin transform-rotate($deg)
  -webkit-transform: rotate($deg) !important
  -moz-transform: rotate($deg) !important
  -ms-transform: rotate($deg) !important
  -o-transform: rotate($deg) !important
  transform: rotate($deg) !important

//Margin Control
.m0
  margin-top: 0 !important
  margin-bottom: 0 !important
  margin-left: 0 !important
  margin-right: 0 !important

@for $i from 0 through 100
  .mt#{$i}
    margin-top: $i+px !important

@for $i from 0 through 100
  .mb#{$i}
    margin-bottom: $i+px !important

@for $i from 0 through 100
  .ml#{$i}
    margin-left: $i+px !important

@for $i from 0 through 100
  .mr#{$i}
    margin-right: $i+px !important

//Padding Control
.p0
  padding-top: 0 !important
  padding-bottom: 0 !important
  padding-left: 0 !important
  padding-right: 0 !important

@for $i from 0 through 100
  .pt#{$i}
    padding-top: $i+px !important

@for $i from 0 through 100
  .pb#{$i}
    padding-bottom: $i+px !important

@for $i from 0 through 100
  .pl#{$i}
    padding-left: $i+px !important

@for $i from 0 through 100
  .pr#{$i}
    padding-right: $i+px !important

@mixin mq($breakpoint)

  $mq-xs: "(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 == 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