css-magic/less/mix.less

Include Ray's CSS Library

.crisp() {
	-moz-backface-visibility: @hidden;
	-ms-backface-visibility: @hidden;
	-o-backface-visibility: @hidden;
	-webkit-backface-visibility: @hidden;
	backface-visibility: @hidden;
	-moz-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;
	-o-transform-style: preserve-3d;
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-moz-font-smoothing: @antialiased;
	-ms-font-smoothing: @antialiased;
	-o-font-smoothing: @antialiased;
	-webkit-font-smoothing: @antialiased;
	font-smoothing: @antialiased;
	-moz-transform: translateZ(0);
	-ms-transform: translateZ(0);
	-o-transform: translateZ(0);
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
}
.perspective(@p) {
	-moz-perspective: @p;
	-ms-perspective: @p;
	-o-perspective: @p;
	-webkit-perspective: @p;
	perspective: @p;
}
.appearance(@a) {
	-moz-appearance: @a;
	-ms-appearance: @a;
	-o-appearance: @a;
	-webkit-appearance: @a;
	appearance: @a;
}
.box-sizing(@m) {
	-moz-box-sizing: @m;
	-ms-box-sizing: @m;
	-o-box-sizing: @m;
	-webkit-box-sizing: @m;
	box-sizing: @m;
}
	.border-box() {
		.box-sizing(@border-box);
	}
	.content-box() {
		.box-sizing(@content-box);
	}
.overflow-scrolling(@m) {
	-moz-overflow-scrolling:@m;
	-ms-overflow-scrolling:@m;
	-o-overflow-scrolling:@m;
	-webkit-overflow-scrolling:@m;
	overflow-scrolling:@m;
}
	.touch-scrolling() {
		.overflow-scrolling(@touch);
	}
.translate(@x,@y) {
	-moz-transform: translate(@x,@y);
	-ms-transform: translate(@x,@y);
	-o-transform: translate(@x,@y);
	-webkit-transform: translate(@x,@y);
	transform: translate(@x,@y);
}
.transform-origin(@x,@y) {
	-moz-transform-origin: @x @y;
	-ms-transform-origin: @x @y;
	-o-transform-origin: @x @y;
	-webkit-transform-origin: @x @y;
	transform-origin: @x @y;
}
.transform-origin(@m) {
	-moz-transform-origin: @m;
	-ms-transform-origin: @m;
	-o-transform-origin: @m;
	-webkit-transform-origin: @m;
	-transform-origin: @m;
}
.transform(@m) {
	-moz-transform: @m;
	-ms-transform: @m;
	-o-transform: @m;
	-webkit-transform: @m;
	transform: @m;
}
.transition(@t,@p) {
	-moz-transition: @t @p;
	-ms-transition: @t @p;
	-o-transition: @t @p;
	-webkit-transition: @t @p;
	transition: @t @p;
}
.transition(@t) {
	-moz-transition: all @t ease;
	-ms-transition: all @t ease;
	-o-transition: all @t ease;
	-webkit-transition: all @t ease;
	transition: all @t ease;
}
.transition-property(@p) {
	-moz-transition-property: @p;
	-ms-transition-property: @p;
	-o-transition-property: @p;
	-webkit-transition-property: @p;
	transition-property: @p;
}
.box-shadow(@x,@y,@s,@c) {
	-moz-box-shadow: @x @y @s @c;
	-ms-box-shadow: @x @y @s @c;
	-o-box-shadow: @x @y @s @c;
	-webkit-box-shadow: @x @y @s @c;
	box-shadow: @x @y @s @c;
}
.box-shadow(@inset,@x,@y,@s,@c) {
	-moz-box-shadow: @inset @x @y @s @c;
	-ms-box-shadow: @inset @x @y @s @c;
	-o-box-shadow: @inset @x @y @s @c;
	-webkit-box-shadow: @inset @x @y @s @c;
	box-shadow: @inset @x @y @s @c;
}
.box-shadow(@m) {
	-moz-box-shadow: @m;
	-ms-box-shadow: @m;
	-o-box-shadow: @m;
	-webkit-box-shadow: @m;
	box-shadow: @m;
}
.filter(@f) {
	-moz-filter: @f;
	-ms-filter: @f;
	-o-filter: @f;
	-webkit-filter: @f;
    filter: @f;
}
.drop-shadow(@x,@y,@s,@c) {
	-moz-filter: drop-shadow(@x @y @s @c);
	-ms-filter: drop-shadow(@x @y @s @c);
	-o-filter: drop-shadow(@x @y @s @c);
	-webkit-filter: drop-shadow(@x @y @s @c);
    filter: drop-shadow(@x @y @s @c);
}
.grayscale(@p) {
	-moz-filter: grayscale(@p);
	-ms-filter: grayscale(@p);
	-o-filter: grayscale(@p);
	-webkit-filter: grayscale(@p);
	filter: grayscale(@p);
}
.blur(@b) {
	-moz-filter: blur(@b);
	-ms-filter: blur(@b);
	-o-filter: blur(@b);
	-webkit-filter: blur(@b);
	filter: blur(@b);
}
.blurred() {
	-moz-filter: grayscale(@hunnid) blur(20px);
	-ms-filter: grayscale(@hunnid) blur(20px);
	-o-filter: grayscale(@hunnid) blur(20px);
	-webkit-filter: grayscale(@hunnid) blur(20px);
	filter: grayscale(@hunnid) blur(20px);
}
.not-blurred() {
	-moz-filter: grayscale(0) blur(@zero) brightness(140%) contrast(110%);
	-ms-filter: grayscale(0) blur(@zero) brightness(140%) contrast(110%);
	-o-filter: grayscale(0) blur(@zero) brightness(140%) contrast(110%);
	-webkit-filter: grayscale(0) blur(@zero) brightness(140%) contrast(110%);
	filter: grayscale(0) blur(@zero) brightness(140%) contrast(110%);
}
.sepia() {
	-moz-filter: grayscale(0) blur(@zero) sepia(@hunnid);
	-ms-filter: grayscale(0) blur(@zero) sepia(@hunnid);
	-o-filter: grayscale(0) blur(@zero) sepia(@hunnid);
	-webkit-filter: grayscale(0) blur(@zero) sepia(@hunnid);
	filter: grayscale(0) blur(@zero) sepia(@hunnid);
}
.pop() {
	-moz-filter: grayscale(0) blur(@zero) brightness(200%) contrast(200%) saturate(800%);
	-ms-filter: grayscale(0) blur(@zero) brightness(200%) contrast(200%) saturate(800%);
	-o-filter: grayscale(0) blur(@zero) brightness(200%) contrast(200%) saturate(800%);
	-webkit-filter: grayscale(0) blur(@zero) brightness(200%) contrast(200%) saturate(800%);
	filter: grayscale(0) blur(@zero) brightness(200%) contrast(200%) saturate(800%);
}
.modern() {
	-moz-filter: grayscale(0) blur(@zero) brightness(140%) contrast(110%);
	-ms-filter: grayscale(0) blur(@zero) brightness(140%) contrast(110%);
	-o-filter: grayscale(0) blur(@zero) brightness(140%) contrast(110%);
	-webkit-filter: grayscale(0) blur(@zero) brightness(140%) contrast(110%);
	filter: grayscale(0) blur(@zero) brightness(140%) contrast(110%);
}
.text-shadow(@x,@y,@s,@c) {
	-moz-text-shadow: @x @y @s @c;
	-ms-text-shadow: @x @y @s @c;
	-o-text-shadow: @x @y @s @c;
	-webkit-text-shadow: @x @y @s @c;
	text-shadow: @x @y @s @c;
}
.blend(@m) {
	-moz-mix-blend-mode: @m;
	-ms-mix-blend-mode: @m;
	-o-mix-blend-mode: @m;
	-webkit-mix-blend-mode: @m;
	mix-blend-mode: @m;
}
.background-blend(@m) {
	-moz-background-blend-mode: @m;
	-ms-background-blend-mode: @m;
	-o-background-blend-mode: @m;
	-webkit-background-blend-mode: @m;
	background-blend-mode: @m;
}
.border-radius(@r) {
	-moz-border-radius: @r;
	-ms-border-radius: @r;
	-o-border-radius: @r;
	-webkit-border-radius: @r;
	border-radius: @r;
}
	.circle() {
		.border-radius(50%);
	}
.border-radius(@a,@b,@c,@d) {
	-moz-border-radius: @a @b @c @d;
	-ms-border-radius: @a @b @c @d;
	-o-border-radius: @a @b @c @d;
	-webkit-border-radius: @a @b @c @d;
	border-radius: @a @b @c @d;
}
.scale(@s) {
	-moz-transform: scale(@s);
	-ms-transform: scale(@s);
	-o-transform: scale(@s);
	-webkit-transform: scale(@s);
	transform: scale(@s);
}
.layer(@l) {
	z-index: @l;
}
.layer(@l) when (@l = ~"initial") {
	z-index: @auto;
	z-index: @l;
}
.postop(@x) {
	top: @x;
}
	.postop(@x) when (@x = ~"initial") {
		top: @auto;
		top: @x;
	}
	.postop(@x) when (@x = ~"initial !important") {
		top: @auto @i;
		top: @x;
	}
.posright(@x) {
	right: @x;
}
	.posright(@x) when (@x = ~"initial") {
		right: @auto;
		right: @x;
	}
	.posright(@x) when (@x = ~"initial !important") {
		right: @auto @i;
		right: @x;
	}
.posbottom(@x) {
	bottom: @x;
}
	.posbottom(@x) when (@x = ~"initial") {
		bottom: @auto;
		bottom: @x;
	}
	.posbottom(@x) when (@x = ~"initial !important") {
		bottom: @auto @i;
		bottom: @x;
	}
.posleft(@x) {
	left: @x;
}
	.posleft(@x) when (@x = ~"initial") {
		left: @auto;
		left: @x;
	}
	.posleft(@x) when (@x = ~"initial !important") {
		left: @auto @i;
		left: @x;
	}
.poswidth(@x) {
	width: @x;
}
	.poswidth(@x) when (@x = ~"initial") {
		width: @auto;
		width: @x;
	}
	.poswidth(@x) when (@x = ~"initial !important") {
		width: @auto @i;
		width: @x;
	}
.posheight(@x) {
	height: @x;
}
	.posheight(@x) when (@x = ~"initial") {
		height: @auto;
		height: @x;
	}
	.posheight(@x) when (@x = ~"initial !important") {
		height: @auto @i;
		height: @x;
	}
.posminwidth(@x) {
	min-width: @x;
}
	.posminwidth(@x) when (@x = ~"initial") {
		min-width: @auto;
		min-width: @x;
	}
	.posminwidth(@x) when (@x = ~"initial !important") {
		min-width: @auto @i;
		min-width: @x;
	}
.posminheight(@x) {
	min-height: @x;
}
	.posminheight(@x) when (@x = ~"initial") {
		min-height: @auto;
		min-height: @x;
	}
	.posminheight(@x) when (@x = ~"initial !important") {
		min-height: @auto @i;
		min-height: @x;
	}
.posmaxwidth(@x) {
	max-width: @x;
}
	.posmaxwidth(@x) when (@x = ~"initial") {
		max-width: @auto;
		max-width: @x;
	}
	.posmaxwidth(@x) when (@x = ~"initial !important") {
		max-width: @auto @i;
		max-width: @x;
	}
.posmaxheight(@x) {
	max-height: @x;
}
	.posmaxheight(@x) when (@x = ~"initial") {
		max-height: @auto;
		max-height: @x;
	}
	.posmaxheight(@x) when (@x = ~"initial !important") {
		max-height: @auto @i;
		max-height: @x;
	}
.box(@p, @z, @t, @r, @b, @l, @w, @h) {
	position: @p;
	.layer(@z);
	.postop(@t);
	.posright(@r);
	.posbottom(@b);
	.posleft(@l);
	.poswidth(@w);
	.posheight(@h);
}
.box(@p) {
	position: @p;
	.layer(@initial);
	.postop(@initial);
	.posright(@initial);
	.posbottom(@initial);
	.posleft(@initial);
	.poswidth(@initial);
	.posheight(@initial);
}
.relative() {
	position: @relative;
}
.absolute() {
	position: @absolute;
}
.fixed() {
	position: @fixed;
}
.static() {
	position: @static;
}
.margin(@t, @r, @b, @l) {
	margin: @t @r @b @l;
}
.margin(@v, @h) {
	margin: @v @h;
}
.margin(@m) {
	margin: @m;
}
.padding(@t, @r, @b, @l) {
	padding: @t @r @b @l;
}
.padding(@v, @h) {
	padding: @v @h;
}
.padding(@m) {
	padding: @m;
}

.mm-height(@min, @max) {
	.posminheight(@min);
	.posmaxheight(@max);
}
	.mm-height(@mm) {
		.mm-height(@mm, @mm);
	}

.mm-width(@min, @max) {
	.posminwidth(@min);
	.posmaxwidth(@max);
}
	.mm-width(@mm) {
		.mm-width(@mm, @mm);
	}

.display(@d) {
	display: @d;
}
	.block(@d) when (@d = ~"true") {
		display: @block @i;
	}
	.block() {
		.display(@block);
	}
	.inline-block() {
		.display(@inline-block);
	}
	.inline() {
		.display(@inline);
	}
	.table() {
		.display(@table);
	}
	.table-row() {
		.display(@table-row);
	}
	.table-cell() {
		.display(@table-cell);
	}

.align(@a) {
	text-align: @a;
}
	.left() {
		.align(@left);
	}
	.center() {
		.align(@center);
	}
	.right() {
		.align(@right);
	}
	.left(@i) {
		.align(@left @i);
	}
	.center(@i) {
		.align(@center @i);
	}
	.right(@i) {
		.align(@right @i);
	}

.valign(@a) {
	vertical-align: @a;
}
	.top() {
		.valign(@top);
	}
	.middle() {
		.valign(@middle);
	}
	.bottom() {
		.valign(@bottom);
	}
	.top(@i) {
		.valign(@top @i);
	}
	.middle(@i) {
		.valign(@middle @i);
	}
	.bottom(@i) {
		.valign(@bottom @i);
	}

.cursor(@c) {
	cursor: @c;
}
	.pointer() {
		.cursor(@pointer);
	}
	.default() {
		.cursor(@default);
	}

.float(@d) {
	float: @d;
}
.clear() {
	clear: @both;
}

.content(@c) {
	content: @c;
}

.nounderline() {
	text-decoration: @none;
}
.color(@c) {
	color: @c;
}

.outline(@o) {
	-moz-outline: @o;
	-ms-outline: @o;
	-o-outline: @o;
	-webkit-outline: @o;
	outline: @o;
}
.border(@s, @t, @c) {
	border: @s @t @c;
}
.border(@a) {
	border: @a;
}
.border-right(@s, @t, @c) {
	border-right-width: @s;
	border-right-style: @t;
	border-right-color: @c;
}
.border-left(@s, @t, @c) {
	border-left-width: @s;
	border-left-style: @t;
	border-left-color: @c;
}
.border-top(@s, @t, @c) {
	border-top-width: @s;
	border-top-style: @t;
	border-top-color: @c;
}
.border-bottom(@s, @t, @c) {
	border-bottom-width: @s;
	border-bottom-style: @t;
	border-bottom-color: @c;
}

.overflow(@x,@y) {
	overflow-x: @x;
	overflow-y: @y;
}
	.overflow(@b) {
		.overflow(@b,@b);
	}

.background(@i,@w,@h,@p1,@p2,@r) {
	background-image: url(@i);
	background-size: @w @h;
	background-position: @p1 @p2;
	background-repeat: @r;
}
.background(@i,@s,@p1,@p2,@r) {
	background-image: url(@i);
	background-size: @s;
	background-position: @p1 @p2;
	background-repeat: @r;
}
.backgroundpos(@s,@p1,@p2,@r) {
	background-size: @s;
	background-position: @p1 @p2;
	background-repeat: @r;
}

.text-transform(@t) {
	text-transform: @t;
}
	.capitalize() {
		.text-transform(@uppercase);
	}
	.regular-case() {
		.text-transform(@none);
	}
	.sentence() {
		.text-transform(@capitalize);
	}

.hidden() {
	display: @none;
}
.hidden(@b) when (@b = ~"yes") {
	display: @none @i;
}

.nolist() {
	list-style-type: @none;
}

.nowrap() {
	white-space: @nowrap;
}

.ellipsis() {
	text-overflow: @ellipsis;
}

.pointer-events(@p) {
	pointer-events: @p;
}
	.click-thru() {
		.pointer-events(@none);
	}
	.click() {
		.pointer-events(@auto);
	}


.responsive(@d) when (@d = ~"width") {
	.block;
	width: @hunnid @i;
	.mm-width(@hunnid @i);
	height: @auto @i;
	height: @initial @i;
	.mm-height(@initial @i,@initial @i);
	html.ie & {
		height: @auto @i;
		.mm-height(@auto @i,@none @i);
	}
}
.responsive(@d) when (@d = ~"height") {
	.block;
	height: @hunnid @i;
	.mm-height(@hunnid @i);
	width: @auto @i;
	width: @initial @i;
	.mm-width(@initial @i,@initial @i);
	html.ie & {
		width: @auto @i;
		.mm-width(@auto @i,@none @i);
	}
}
	.responsive-width() {
		.responsive(width);
	}
	.responsive-height() {
		.responsive(height);
	}

.animation(@name,@duration,@type,@loop) {
	-moz-animation: @name @duration @type @loop;
	-ms-animation: @name @duration @type @loop;
	-o-animation: @name @duration @type @loop;
	-webkit-animation: @name @duration @type @loop;
	animation: @name @duration @type @loop;
	-moz-animation-fill-mode: forwards;
	-ms-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}
.animation-duration(@duration) {
	-moz-animation-duration: @duration;
	-ms-animation-duration: @duration;
	-o-animation-duration: @duration;
	-webkit-animation-duration: @duration;
	animation-duration: @duration;
}
.animation-delay(@duration) {
	-moz-animation-delay: @duration;
	-ms-animation-delay: @duration;
	-o-animation-delay: @duration;
	-webkit-animation-delay: @duration;
	animation-delay: @duration;
}
.transition-delay(@duration) {
	-moz-transition-delay: @duration;
	-ms-transition-delay: @duration;
	-o-transition-delay: @duration;
	-webkit-transition-delay: @duration;
	transition-delay: @duration;
}

.linear-gradient(@start, @end) {
    background: mix(@start, @end, 50%);
    filter: ~"progid:DXImageTransform.Microsoft.gradient(startColorStr="@start~", EndColorStr="@end~")";
    background: -moz-linear-gradient(top, @start, @end);
    background: -ms-linear-gradient(@start, @end);
    background: -o-linear-gradient(@start, @end);
    background: -webkit-gradient(linear, left top, left bottom, from(@start), to(@end));
    background: -webkit-linear-gradient(@start, @end);
    background: linear-gradient(@start, @end);
    zoom: 1;
}

.awesome () {
	font-family: FontAwesome;
}

.collapse() {
	border-collapse: @collapse;
	border-spacing: @zero;
}

.perspective(@u) {
	-moz-perspective: @u;
	-ms-perspective: @u;
	-o-perspective: @u;
	-webkit-perspective: @u;
	perspective: @u;
}
.perspective-origin(@x,@y) {
	-moz-perspective-origin: @x @y;
	-ms-perspective-origin: @x @y;
	-o-perspective-origin: @x @y;
	-webkit-perspective-origin: @x @y;
	perspective-origin: @x @y;
}

.invisible () {
	visibility: @hidden;
}
.visible () {
	visibility: @visible;
}

.placeholder (@c) {
	&::-webkit-input-placeholder { /* Safari, Chrome and Opera */
	  color: @c;
	}

	&:-moz-placeholder { /* Firefox 18- */
	  color: @c;
	}

	&::-moz-placeholder { /* Firefox 19+ */
	  color: @c;
	}

	&:-ms-input-placeholder { /* IE 10+ */
	  color: @c
	}

	&::-ms-input-placeholder { /* Edge */
	  color: @c
	}

	&:placeholder-shown { /* Standard one last! */
	  color: @c;
	}
}

.text-decoration-color (@c) {
	-moz-text-decoration-color: @c;
	-ms-text-decoration-color: @c;
	-o-text-decoration-color: @c;
	-webkit-text-decoration-color: @c;
    text-decoration-color: @c;
}

.ellipsis () {
	text-overflow: @ellipsis;
}

.left-wing-black () {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&1+0,0+100 */
	background: -moz-linear-gradient(left,  rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#00000000',GradientType=1 ); /* IE6-9 */
}
.right-wing-black () {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0+0,1+100 */
	background: -moz-linear-gradient(left,  rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=1 ); /* IE6-9 */
}

.left-wing-white () {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&1+0,0+100 */
	background: -moz-linear-gradient(left,  rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 */
}

.right-wing-white () {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&0+0,1+100 */
	background: -moz-linear-gradient(left,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 */
}

.center-gradient-white () {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&1+0,0+100 */
	background: -moz-radial-gradient(center, ellipse cover,  rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
	background: -webkit-radial-gradient(center, ellipse cover,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: radial-gradient(ellipse at center,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

.center-gradient-white-complete () {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,ffffff+75&1+0,0+75 */
	background: -moz-radial-gradient(center, ellipse cover,  rgba(255,255,255,1) 0%, rgba(255,255,255,0) 75%); /* FF3.6-15 */
	background: -webkit-radial-gradient(center, ellipse cover,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 75%); /* Chrome10-25,Safari5.1-6 */
	background: radial-gradient(ellipse at center,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 75%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

.object-fit(@fit) {
	-moz-object-fit: @fit;
	-ms-object-fit: @fit;
	-o-object-fit: @fit;
	-webkit-object-fit: @fit;
	object-fit: @fit;
}

.multiply() {
	-moz-mix-blend-mode: @multiply;
	-ms-mix-blend-mode: @multiply;
	-o-mix-blend-mode: @multiply;
	-webkit-mix-blend-mode: @multiply;
	mix-blend-mode: @multiply;
}

.no-multiply() {
	-moz-mix-blend-mode: @initial;
	-ms-mix-blend-mode: @initial;
	-o-mix-blend-mode: @initial;
	-webkit-mix-blend-initial: @initial;
	mix-blend-mode: @initial;
}

.will-change(@c) {
	-moz-will-change: @c;
	-ms-will-change: @c;
	-o-will-change: @c;
	-webkit-will-change: @c;
	will-change: @c;
}

.hidden {
	display: @none @i;
}