// transitions @mixin transform_time($total_time) { -webkit-transition: $total_time; transition: $total_time; } @mixin placeholder { &.placeholder { @content; } &:-moz-placeholder { @content; } &::-moz-placeholder { @content; } &::-webkit-input-placeholder { @content; } } @mixin transition($args: all 0.6s ease 0s) { -webkit-transition: $args; -moz-transition: $args; -o-transition: $args; transition: $args; } @mixin keyframes($name) { @-webkit-keyframes #{$name} { @content; } @-moz-keyframes #{$name} { @content; } @-ms-keyframes #{$name} { @content; } @keyframes #{$name} { @content; } } @mixin animation($animation) { -webkit-animation: #{$animation}; -moz-animation: #{$animation}; -ms-animation: #{$animation}; animation: #{$animation}; } @mixin transform($transform) { -webkit-transform: $transform; -moz-transform: $transform; -ms-transform: $transform; transform: $transform; } @include keyframes(bounce) { 0%, 20%, 50%, 80%, 100% { @include transform(translateY(0)); } 40% { @include transform(translateY(-20px)); } 60% { @include transform(translateY(-10px)); } }