@mixin transition($transitions) {
	-webkit-transition: $transitions;
    -moz-transition: $transitions;
    -ms-transition: $transitions;
    -o-transition: $transitions;
    transition: $transitions;
}

/* this mixin makes possible to add transition to a specific vendor, example: */
/* -webkit-transition: -webkit-transform 0.5s linear; */
@mixin transitionPrefix($property, $values) {
	-webkit-transition: -webkit-#{$property} #{$values};
    -moz-transition: -moz-#{$property} #{$values};
    -ms-transition: -ms-#{$property} #{$values};
    -o-transition: -o-#{$property} #{$values};
    transition: #{$property} #{$values};	
}

@mixin background-gradient($from, $to) {
	background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, $from), color-stop(100%,  $to));
	background: -webkit-linear-gradient($from, $to);
	background: -moz-linear-gradient($from, $to);
	background: -o-linear-gradient($from, $to);
	background: linear-gradient($from, $to);
}

@mixin transform ($transforms) {
	-moz-transform: $transforms;
	-o-transform: $transforms;
	-ms-transform: $transforms;
	-webkit-transform: $transforms;
	transform: $transforms;
}

@mixin transform-origin ($values) {
	-webkit-transform-origin: $values;
	-moz-transform-origin: $values;
	-o-transform-origin: $values;
	-ms-transform-origin: $values;
	transform-origin: $values;
}

@mixin placeholder {
  &::-webkit-input-placeholder {@content}
  &:-moz-placeholder           {@content}
  &::-moz-placeholder          {@content}
  &:-ms-input-placeholder      {@content}  
}

@mixin animation($animations) {
	-webkit-animation: $animations;
	-moz-animation: $animations;
	-o-animation: $animations;
	-ms-animation: $animations;
	animation: $animations;
}

@mixin animationDelay($value) {
	-webkit-animation-delay: $value;
	-moz-animation-delay: $value;
	-o-animation-delay: $value;
	-ms-animation-delay: $value;
	animation-delay: $value;
}

@mixin animationDuration($value) {
	-webkit-animation-duration: $value;
	-moz-animation-duration: $value;
	-o-animation-duration: $value;
	animation-duration: $value;
}

@mixin keyFrame($name) {
	@-webkit-keyframes $name{
		@content
	}
	@-moz-keyframes $name{
		@content
	}
	@-o-keyframes $name{
		@content
	}
	@keyframes $name{
		@content
	}
}