////standart_veritables
$default_transition: all .2s ease


=transition($transition)
  transition: $transition
  -webkit-transition: $transition
  -moz-transition: $transition
  -o-transition: $transition

=box-shadow($box-shadow)
  box-shadow: $box-shadow
  -webkit-box-shadow: $box-shadow
  -moz-box-shadow: $box-shadow
  -o-box-shadow: $box-shadow
  -ms-box-shadow: $box-shadow

= box-shadow_2($sha_1, $sha_2)
  box-shadow: $sha_1, $sha_2
  -webkit-box-shadow: $sha_1, $sha_2
  -moz-box-shadow: $sha_1, $sha_2
  -o-box-shadow: $sha_1, $sha_2
  -ms-box-shadow: $sha_1, $sha_2

=border-radius($border-radius)
  border-radius: $border-radius
  -webkit-border-radius: $border-radius
  -moz-border-radius: $border-radius

//border_box, content_box
=box-sizing($box_sizing)
  -webkit-box-sizing: $box_sizing
  -moz-box-sizing: $box_sizing
  box-sizing: $box_sizing

=user_select($user_select)
  -webkit-user-select: $user_select
  -moz-user-select: $user_select
  -ms-user-select: $user_select
  user-select: $user_select

=transform($transform)
  transform: $transform
  -webkit-transform: $transform
  -moz-transform: $transform
  -o-transform: $transform
  -ms-transform: $transform

=transform_2($transform_double_1, $transform_double_2)
  transform: $transform_double_1 $transform_double_2
  -webkit-transform: $transform_double_1 $transform_double_2
  -moz-transform: $transform_double_1 $transform_double_2
  -o-transform: $transform_double_1 $transform_double_2
  -ms-transform: $transform_double_1 $transform_double_2

=transform_3( $transform_triple_1, $transform_triple_2, $transform_triple_3)
  transform: $transform_triple_1 $transform_triple_2 $transform_triple_3
  -webkit-transform: $transform_triple_1 $transform_triple_2 $transform_triple_3
  -moz-transform: $transform_triple_1 $transform_triple_2 $transform_triple_3
  -o-transform: $transform_triple_1 $transform_triple_2 $transform_triple_3
  -ms-transform: $transform_triple_1 $transform_triple_2 $transform_triple_3

=ul_li($display, $vertical)
  display: $display
  vertical-align: $vertical

///////////////////////////////////////////////
=double_shadow($color)
  +box-shadow((0 1px 0 lighten($color, 10%) inset, 0 -1px 0 darken($color, 10%) inset))

=hover-style($color)
  &:hover
    background: lighten($color, 3%)


= width_height($width, $height)
  width: $width
  height: $height
=appearance($appearance)
  -webkit-appearance: $appearance
  -moz-appearance: $appearance
  appearance: $appearance

=transition_delay($transition_sub_1, $transition_sub_2 )
  transition-delay: $transition_sub_1, $transition_sub_2
  -o-transition-delay: $transition_sub_1, $transition_sub_2
  -moz-transition-delay: $transition_sub_1, $transition_sub_2
  -webkit-transition-delay: $transition_sub_1, $transition_sub_2

=transition_delay_single($transition_sub_1 )
  transition-delay: $transition_sub_1
  -o-transition-delay: $transition_sub_1
  -moz-transition-delay: $transition_sub_1
  -webkit-transition-delay: $transition_sub_1

=transition_2($tra_1, $tra_2)
  transition: $tra_1, $tra_2
  -webkit-transition: $tra_1, $tra_2
  -moz-transition: $tra_1, $tra_2
  -ms-transition: $tra_1, $tra_2
  -o-transition: $tra_1, $tra_2

= animation_delay($animation_delay)
  -webkit-animation-delay: $animation_delay
  -moz-animation-delay: $animation_delay
  -ms-animation-delay: $animation_delay
  animation-delay: $animation_delay

=animation($content)
  animation: $content
  -webkit-animation: $content
  -moz-animation: $content
  -o-animation: $content

=keyframe($name)
  @keyframes #{$name}
    @content

  @-moz-keyframes #{$name}
    @content

  @-webkit-keyframes #{$name}
    @content

  @-o-keyframes #{$name}
    @content

=text-shadow($text_shadow)
  text-shadow: $text_shadow

=transform_origin($origin-x, $origin-y)
  -webkit-transform-origin: $origin-x, $origin-y
  -moz-transform-origin: $origin-x, $origin-y
  -o-transform-origin: $origin-x, $origin-y
  -ms-transform-origin: $origin-x, $origin-y
  transform-origin: $origin-x, $origin-y



=border($top, $bottom, $left, $right)
  border-top-color: $top !important
  border-bottom-color: $bottom !important
  border-left-color: $left !important
  border-right-color: $right !important


=position_center($position, $top, $left)
  position: $position
  top: $top
  left: $left
  +transform(translate(-50%, -50%))

=vertical_align($height)
  &:before
    content: ''
    display: inline-block
    vertical-align: middle
    height: $height
    width: .1px
=vertical_align_without_veritable()
  &:before
    content: ''
    display: inline-block
    vertical-align: middle
    width: .1px

= clearfix()
  &:before,&:after
    content: ''
    display: table
  &:after
    clear: both


= opacity($opacity)
  opacity: $opacity
  $opacity-ie: $opacity * 100
  filter: alpha(opacity = $opacity-ie)

= link_settings($link, $visited, $hover, $active)
  &:link
    color: $link
  &:visited
    color: $visited
  &:hover
    color: $hover
  &:active
    color: $active


= normal_box($s)
  width: $s
  height: $s
  line-height: $s

= perspective($size)
  perspective: $size
  -webkit-perspective: $size
  -moz-perspective: $size

= letter-spacing($letter-spacing)
  -webkit-letter-spacing: $letter-spacing
  -moz-letter-spacing: $letter-spacing
  -ms-letter-spacing: $letter-spacing
  -o-letter-spacing: $letter-spacing
  letter-spacing: $letter-spacing