
.btn {
    padding: 8px 16px;
    //min-width: 5.14em;
    text-transform: uppercase;
    border: 0;
    line-height: 20px;
    border-radius: 3px;
    -webkit-box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.3);
    margin: 8px;
    font-size: 14px;
    letter-spacing: 1.25px;
    cursor: pointer;
    display: inline-block;

    &:first-child {
        margin-left: 0;
    }

    &:last-child {
        margin-right: 0;
    }


    &.primary {
        background-color: map_get($ui-colors, primary-color);
        color: map-get($default-colors, primary);

        &:hover {
            background-color: lighten( map_get($ui-colors, primary-color), $ligthen);
        }

        &:disabled,
        &[disabled],
        &.disabled{
            cursor: default;
            color: map_get($default-colors-transparency, secondary);
            background-color: map_get($default-colors-transparency, primary);

            &:hover {
                color: map_get($default-colors-transparency, secondary);
                background-color: map_get($default-colors-transparency, primary);

            }
        }
    }


    &.flat {
        background-color: transparent !important;
        color: map_get($ui-colors, primary-color);
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;

        &:hover {
            color: lighten( map_get($ui-colors, primary-color), $ligthen);
            background-color: transparent;
        }

        &:disabled,
        &[disabled],
        &.disabled{
            cursor: default;
            color: map_get($default-colors-transparency, secondary);

            &:hover {
                color: map_get($default-colors-transparency, secondary);
            }
        }
    }

    &.secondary {
        background-color: map-get($brand-colors, primary);
        color: map-get($default-colors, secondary);

        &:hover {
            background-color: lighten( map-get($brand-colors, primary), $ligthen);
        }

        &:disabled,
        &[disabled],
        &.disabled{
            cursor: default;
            color: map_get($default-colors-transparency, secondary);
            background-color: map_get($default-colors-transparency, primary);

            &:hover {
                color: map_get($default-colors-transparency, secondary);
                background-color: map_get($default-colors-transparency, primary);

            }
        }
    }


    &:focus,
    &:active:focus,
    &.active:focus,
    &.focus,
    &:active.focus,
    &.active.focus {
        outline: 0 !important;
    }

    .btn-icon,
    .btn-icon-left {
        padding-right: 8px;
    }

    .btn-icon-right {
        padding-left: 8px;
    }
}