// Rem output with px fallback
@mixin font-size($sizeValue: 1) {
	font-size: ($sizeValue * 18) * 1px;
}

// Center block
@mixin center-block {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

// Clearfix
@mixin clearfix() {
	content: "";
	display: table;
}

// Clear after (not all clearfix need this also)
@mixin clearfix-after() {
	clear: both;
}

@mixin fade($speed) {
	   -moz-transition: opacity $speed ease-in;
	-webkit-transition: opacity $speed ease-in;
		-ms-transition: opacity $speed ease-in;
		 -o-transition: opacity $speed ease-in;
			transition: opacity $speed ease-in;
}

@mixin fade-text($textspeed) {
	   -moz-transition: all $textspeed ease-in;
	-webkit-transition: all $textspeed ease-in;
		-ms-transition: all $textspeed ease-in;
		 -o-transition: all $textspeed ease-in;
			transition: all $textspeed ease-in;
}

@mixin stroke ($width) {
	background-color: $color__background-hr;
	content: "";
	display: block;
	height: .75px;
	margin: 3.75em auto 0;
	width: $width;
}

@mixin vertical-align {
	position: relative;
	top: 50%;
	   -moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		 -o-transform: translateY(-50%);
			transform: translateY(-50%);
}

@mixin slide ($speed) {
	   -moz-transform: translateX($speed);
	-webkit-transform: translateX($speed);
		-ms-transform: translateX($speed);
		 -o-transform: translateX($speed);
			transform: translateX($speed);
}

@mixin slideall ($x, $y, $z) {
	   -moz-transform: translate3d($x, $y, $z);
	-webkit-transform: translate3d($x, $y, $z);
		-ms-transform: translate3d($x, $y, $z);
		 -o-transform: translate3d($x, $y, $z);
	        transform: translate3d($x, $y, $z);
}
