//-----------------------------------------------------------------------------
// CSS 2-3 mixins 
//-----------------------------------------------------------------------------

.clearFix() {
	zoom: 1;
	&:after {
		display: block;
		visibility: hidden;
		height: 0;
		clear: both;
		content: "";
	}
}

.unclearFix() {
	zoom: normal;
	&:after {
		display: block;
		visibility: hidden;
		height: 0;
		clear: none;
		content: "";
	}
}

.clrfx{
	.clearFix();
}

.verticalGradient(@c1, @p1, @c2, @p2) {
	background-color: @c1; /* Old browsers */
	background: -moz-linear-gradient(top, @c1 @p1, @c2 @p2); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(@p1, @c1), color-stop(@p2, @c2)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  @c1 @p1,@c2 @p2); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  @c1 @p1, @c2 @p2); /* Opera 11.10+ */
	background: linear-gradient(to bottom,  @c1 @p1, @c2 @p2); /* W3C */
}
.horizontalGradient(@c1, @p1, @c2, @p2) {
	background-color: @c1; /* Old browsers */
	background: -moz-linear-gradient(left,  @c1 @p1, @c2 @p2); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(@p1, @c1), color-stop(@p2,@c2)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left, @c1 @p1, @c2 @p2); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left, @c1 @p1, @c2 @p2); /* Opera 11.10+ */
	background: -ms-linear-gradient(left, @c1 @p1, @c2 @p2); /* IE10+ */
	background: linear-gradient(to right, @c1 @p1, @c2 @p2); /* W3C */
}
.verticalGradient(@c1, @p1, @c2, @p2, @c3, @p3) {
	background: @c1; /* Old browsers */
	background: -moz-linear-gradient(top, @c1 @p1, @c2 @p2, @c3 @p3); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(@p1, @c1), color-stop(@p2, @c2), color-stop(@p3, @c3)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  @c1 @p1,@c2 @p2, @c3 @p3); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  @c1 @p1, @c2 @p2, @c3 @p3); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  @c1 @p1,@c2 @p2, @c3 @p3); /* IE10+ */
	background: linear-gradient(to bottom,  @c1 @p1, @c2 @p2, @c3 @p3); /* W3C */
}
.transition(@type:all,@duration: .5s, @ease: ease-in-out, @delay: 0) {
	-webkit-transition: @type @duration @ease;
	-moz-transition: @type @duration @ease;
	-o-transition: @type @duration @ease;
	transition: @type @duration @ease;
}

.borderRadius(@radius: 5px){
	-webkit-border-radius:@radius;
	-moz-border-radius:@radius;
	-o-border-radius:@radius;
	border-radius:@radius;
}

.borderRadius(@radius_top, @radius_bottom){
	-webkit-border-radius:@radius_top @radius_bottom;
	-moz-border-radius:@radius_top @radius_bottom;
	-o-border-radius:@radius_top @radius_bottom;
	border-radius:@radius_top @radius_bottom;
}

.borderRadius(@radius_top_left, @radius_top_right, @radius_bottom_right, @radius_bottom_left){
	-webkit-border-radius:@radius_top_left @radius_top_right @radius_bottom_right @radius_bottom_left;
	-moz-border-radius:@radius_top_left @radius_top_right @radius_bottom_right @radius_bottom_left;
	-o-border-radius:@radius_top_left @radius_top_right @radius_bottom_right @radius_bottom_left;
	border-radius:@radius_top_left @radius_top_right @radius_bottom_right @radius_bottom_left;
}

.borderRadiusLeft(@radius){
	.borderRadius(@radius, 0, 0, @radius);
}
.borderRadiusRight(@radius){
	.borderRadius(0, @radius, 0, @radius, 0);
}
.borderRadiusTop(@radius){
	.borderRadius(@radius, @radius, 0, 0);
}
.borderRadiusBottom(@radius){
	.borderRadius(0, 0, @radius ,@radius);
}
.noBorderRadius(){
	.borderRadius(0);
}
.textOverflow(@overflow) {
	-ms-text-overflow:@overflow;
	-o-text-overflow:@overflow;
	text-overflow:@overflow;
}

.transform(@transform) {
	-moz-transform:@transform;
	-webkit-transform:@transform;
	-o-transform:@transform;
	-ms-transform:@transform;
	transform:@transform;
	-webkit-transform-style: preserve-3d;
	-webkit-backface-visibility:hidden;
}

.boxShadow(@x: 3px, @y: 3px, @blur: 3px, @color: #000) {
	-webkit-box-shadow: @x @y @blur @color;
	-moz-box-shadow: @x @y @blur @color;
	-o-box-shadow: @x @y @blur @color;
	box-shadow: @x @y @blur @color;
}

.noBoxShadow() {
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	-o-box-shadow: none;
	box-shadow: none;
}

.boxShadowInner (@x: 3px, @y: 3px, @blur: 3px, @color: #000) {
	-webkit-box-shadow: @x @y @blur @color inset;
	-moz-box-shadow: @x @y @blur @color inset;
	-o-box-shadow: @x @y @blur @color inset;
	box-shadow: @x @y @blur @color inset;
	//filter:~"progid:DXImageTransform.Microsoft.Blur(pixelradius=@{x})";
	//-ms-filter:~"progid:DXImageTransform.Microsoft.Blur(pixelradius=@{x})";
}

.opacity (@opacity:1) {
	-moz-opacity:@opacity;
	-khtml-opacity:@opacity;
	opacity:@opacity;
}

.disableSelection() {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
	


.glow(@color) {
	@lightness : 100 - lightness(@color);
	@c1: desaturate(darken(@color, 5%), 7%);
	@c2: desaturate(darken(@color, 1%), 7%);
	@c3: desaturate(lighten(@color, 1%), 7%);
	@c4: desaturate(lighten(@color, 25%), 7%);
	background-color: @color;
	background-image: linear-gradient(bottom, @c1 0%, @c2 50%, @c3 50%, @c4 54%);
	background-image: -o-linear-gradient(bottom, @c1 0%, @c2 50%, @c3 50%, @c4 54%);
	background-image: -moz-linear-gradient(bottom, @c1 0%, @c2 50%, @c3 50%, @c4 54%);
	background-image: -webkit-linear-gradient(bottom, @c1 0%, @c2 50%, @c3 50%, @c4 54%);
	background-image: -ms-linear-gradient(bottom, @c1 0%, @c2 50%, @c3 50%, @c4 54%);
	background-image: -webkit-gradient(
		linear,
		left bottom,
		left top,
		color-stop(0, @c1),
		color-stop(0.5, @c2),
		color-stop(0.5, @c3),
		color-stop(0.93, @c4)
	);
}


//-----------------------------------------------------------------------------
// general mixins 
//-----------------------------------------------------------------------------

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

.bg(@img, @repeat: no-repeat, @bgcolor: transparent, @x:center, @y: center, @important: "!important"){
	background: url("@{skinpath}@{img}") @bgcolor @repeat  @x @y ~"@{important}";
}
.bg(@img, @repeat: no-repeat, @bgcolor: transparent, @x:center, @y: center){
	.bg(@img, @repeat, @bgcolor, @x, @y, "!important");
}
.bg(@img, @options){
	background: url("@{skinpath}@{img}") @options !important;
}
.bg(@img, @options,@important:"!important"){
	background: url("@{skinpath}@{img}") @options ~"@{important}";
}
.bgAlphaColor(@c){
	background-color: @c;
}

.bgLeft(@img){
	.bg(@img,no-repeat,transparent, left,center);
}

.bgRight(@img){
	.bg(@img,no-repeat,transparent, right,center);
}

.noIEGradient(){
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(enabled=false)";
	-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=false)";
}

.setDisable() {
	cursor:not-allowed !important;
}

.setEnable() {
	.opacity(1);
	cursor:pointer;
}

.hideText(){
	color: transparent !important;
	font-size: 0.0000001% ;
}
.boxSizing(@value: border-box){
	-moz-box-sizing: @value;
	-webkit-box-sizing: @value;
	box-sizing: @value;
}
.button(@height){
	height: @height;
	line-height: @height !important;
	text-decoration: none;
	vertical-align: middle;
	text-align: center;
	display: -moz-inline-stack;
	display: inline-block;
	zoom: 1;
	*display: inline;
	.noWrap();
	*{
		vertical-align: middle;
	}
	.disableSelection();
}

.setSize(@width, @height, @padding-top:0, @padding-left:0, @padding-bottom:0, @padding-right:0, @border-top:0, @border-left:0, @border-bottom:0, @border-right:0){
	width: @width - @padding-left - @padding-right - @border-left - @border-right;
	*width: @width;
	height: @height - @padding-top - @padding-bottom - @border-top - @border-bottom;
	*height: @height;
	padding: @padding-top @padding-left @padding-bottom @padding-right;
}

.height(@height, @padding-top:0, @padding-bottom:0, @border-top:0, @border-bottom:0) {
	height :@height - @padding-top - @padding-bottom - @border-top - @border-bottom;
	*height :@height;
	padding-top: @padding-top;
	padding-bottom : @padding-bottom;
}

.width( @width, @padding-left:0, @padding-right:0, @border-left:0, @border-right:0) {
	width: @width - @padding-left - @padding-right - @border-left - @border-right;
	*width: @width;
	padding-left: @padding-left;
	padding-right: @padding-right;
}

.noPadding(){ padding: 0;}
.noMargin(){ margin: 0;}

.pointerAsLink(){
	&:hover{
		cursor: pointer;
	}	
}

.disablePointerAsLink() {
    &:hover{
        cursor: auto;
    }   
}

.hoverUnderline(){
	&:hover{
		text-decoration: underline;
	}	
}
.displayNone{ display: none !important; }
.displayNone(){ .displayNone; }
