@mixin squareSize( $size ) {
	width: #{ $size }px;
	height: #{ $size }px;
}

@mixin square-size( $size ) {
	width: $size;
	height: $size;
}

@mixin horizontal-padding( $pad: 5px ) {
	padding-left: $pad; padding-right: $pad;
}
@mixin vertical-padding( $pad: 5px ) {
	padding-top: $pad; padding-bottom: $pad;
}
@mixin horizontal-margin( $pad: 5px ) {
	margin-left: $pad; margin-right: $pad;
}
@mixin vertical-margin( $pad: 5px ) {
	margin-top: $pad; margin-bottom: $pad;
}


@mixin rotation( $rotate ) {
	transform: rotate(#{ $rotate }deg);
}



@mixin elipse( $first, $second ) {
	border-radius: #{ $first }px / #{ $second }px;
}
@mixin elipsis( $first, $second ) {
	border-radius: #{percentage($first)} / #{percentage($second)} ;
}


@mixin gpu_render {
	// old style (bourbon)
	// transform: translateZ( 0 ) ;
	// twbs
	// @include translate3d(0, 0, 0);
	// bourbon
	// there is a chrome bug with that ... http://codepen.io/herzflimmern/blog/chrome-bug-with-fixed-background-and-translate3d
	transform:translate3d(0,0,0);
	// transform: translate(0,0) ;
}