$button-padding : em(10px 20px);

@mixin button($bg-color:$main-color, $for-base:false) {
	// Button Shadow
	$shadow-base   : 0 1px 0 darken($bg-color, 20%);
	$shadow-hover  : inset 1px 1px 5em rgba(black, 0.2);
	
	background : $bg-color;
	color      : contrast-color($bg-color, #333, white, 70%);
	border     : none;
	
	$shadow-base  : 0 1px 0 darken($bg-color, 20%);
	@include box-shadow($shadow-base );

	@if $for-base {
		display   : inline-block;
		position  : relative;
		cursor    : pointer;
		padding   : $button-padding;
		
		&:hover {
			// background: darken($bg-color, 10%);
			@include box-shadow($shadow-base, $shadow-hover );
		}

		&:active {
			top: 1px;
			border: none;
			@include box-shadow($shadow-hover );
		}
		&:focus {
			outline: none;
		}
	}
}

@if $include-button {
	
/* ---------------
EDGE Button
--------------- */
button,
.button,
input[type="button"],
input[type="submit"],
input[type="reset"] {
	@include button($for-base:true);
}

} // $include-button