@mixin clearfix()
    &:before,
    &:after
        content: " "
        display: table

    &:after
        clear: both

@mixin inline-block()
    display: -moz-inline-stack
    display: inline-block
    *zoom: 1
    *display: inline

@mixin inset-shadow
    -webkit-box-shadow: inset 0 .1em .1em rgba(0,0,0,.1)
    -moz-box-shadow: inset 0 .1em .1em rgba(0,0,0,.1)
    box-shadow: inset 0 .1em .1em rgba(0,0,0,.1)

@mixin bottom-margin()
    margin-bottom: 10px

@mixin no-default-appearance()
    -webkit-appearance: none
    -moz-appearance: none
    appearance: none

@mixin transition($element, $transition: 0.1s)
    -webkit-transition: $element $transition
    -moz-transition: $element $transition
    transition: $element $transition

@mixin transform($transform)
    -webkit-transform: $transform
    -moz-transform: $transform
    transform: $transform

@mixin border-radius($radius: $default-radius)
    -webkit-border-radius: $radius
    -moz-border-radius: $radius
    border-radius: $radius

@mixin border-radius-top($radius: $default-radius)
    border-top-left-radius: $radius
    border-top-right-radius: $radius

@mixin border-radius-left($radius: $default-radius)
    border-top-left-radius: $radius
    border-bottom-left-radius: $radius

@mixin border-radius-right($radius: $default-radius)
    border-top-right-radius: $radius
    border-bottom-right-radius: $radius

@mixin border-radius-bottom($radius: $default-radius)
    border-bottom-left-radius: $radius
    border-bottom-right-radius: $radius