.clearfix() {
	&:after {
		content: "";
		display: table;
		clear: both;
	}
}

.svg-background-image(@vector) {
	background-image: url("@{vector}.png");
	background-image: none, url("@{vector}.svg");
	background-repeat: no-repeat;
}

// binary images with retina "@2x" naming convention
.background-image(@path) {
	@highdpi: ~"(-webkit-min-device-pixel-ratio: 1.5), (min--moz-device-pixel-ratio: 1.5), (min-resolution: 1.5dppx)";
	@at2x_path: ~`@{path}.replace(/\.\w+$/, function(match) { return "@2x" + match; })`;
	background-image: url(@path);
	@media @highdpi {
		background-image: url("@{at2x_path}");
	}
}

.bgimg-hover(@path, @path-hover) {
	background-repeat: no-repeat;
	background-size: contain;
	background-position: top center;
	.background-image(@path);
	&:hover,
	&:focus {
		.background-image(@path-hover);
	}
}

.stitches-sprite(@x: 0, @y: 0, @width: 0, @height: 0) {
	background-position: @x @y;
	width: @width;
	height: @height;
}

.vertical-align() {
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.placeholder(@color) {
    &::-webkit-input-placeholder {color:@color}
    &::-moz-placeholder {color:@color}
    &:-ms-input-placeholder {color:@color}
}

//Here to support the menu
//TODO: Deprecate

.rotate(@degrees) {
	-webkit-transform:rotate(@degrees);
	-ms-transform:rotate(@degrees);
	transform:rotate(@degrees);
}

.transition(@value) {
	transition: @value;
}

.opacity(@value) {
	-khtml-opacity: @value;
	-ms-filter: %('alpha(opacity=%s)', @value*100);
	opacity: @value;
}

.transition-all(@time) {
	transition: all @time ease;
}