/*
Mixins  for borders and gradients
*/

@mixin box-shadow($shadow) {
    -webkit-box-shadow: $shadow;
    -moz-box-shadow: $shadow;
    box-shadow: $shadow;
}

@mixin border-radius($radius) {
	-webkit-border-radius: $radius;
	-moz-border-radius: $radius;
	border-radius: $radius;
}

@mixin linear-gradient($fromColor, $toColor) {
    background-color: $fromColor; /* Fallback Color */
    background-image: -webkit-gradient(linear, left, right, from($fromColor), to($toColor)); /* Saf4+, Chrome */
    background-image: -webkit-linear-gradient(left, $fromColor, $toColor); /* Chrome 10+, Saf5.1+, iOS 5+ */
    background-image: -moz-linear-gradient(left, $fromColor, $toColor); /* FF3.6 */
    background-image: -ms-linear-gradient(left, $fromColor, $toColor); /* IE10 */
    background-image: -o-linear-gradient(left, $fromColor, $toColor); /* Opera 11.10+ */
    background-image: linear-gradient(left, $fromColor, $toColor);
}
@mixin linear-gradient-fromtop($fromColor, $toColor) {
    background-color: $fromColor; /* Fallback Color */
    background-image: -webkit-gradient(linear, top, bottom, from($fromColor), to($toColor)); /* Saf4+, Chrome */
    background-image: -webkit-linear-gradient(top, $fromColor, $toColor); /* Chrome 10+, Saf5.1+, iOS 5+ */
    background-image: -moz-linear-gradient(top, $fromColor, $toColor); /* FF3.6 */
    background-image: -ms-linear-gradient(top, $fromColor, $toColor); /* IE10 */
    background-image: -o-linear-gradient(top, $fromColor, $toColor); /* Opera 11.10+ */
    background-image: linear-gradient(top, $fromColor, $toColor);
}


@mixin radial-gradient($color2, $color1) {
	background: $color2;
	background: -moz-radial-gradient(center, ellipse cover, $color1 0%, $color2 100%);
	background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,$color1), color-stop(100%,$color2));
	background: -webkit-radial-gradient(center, ellipse cover, $color1 0%,$color2 100%);
	background: -o-radial-gradient(center, ellipse cover, $color1 0%,$color2 100%);
	background: -ms-radial-gradient(center, ellipse cover, $color1 0%,$color2 100%);
	background: radial-gradient(ellipse at center, $color1 0%,$color2 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$color1', endColorstr='$color2',GradientType=1 );
}

@mixin radial-gradient-image($color2, $color1, $image) {
	background: $image, $color2;
	background: $image, -moz-radial-gradient(center, ellipse cover, $color1 0%, $color2 100%);
	background: $image, -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,$color1), color-stop(100%,$color2));
	background: $image, -webkit-radial-gradient(center, ellipse cover, $color1 0%,$color2 100%);
	background: $image, -o-radial-gradient(center, ellipse cover, $color1 0%,$color2 100%);
	background: $image, -ms-radial-gradient(center, ellipse cover, $color1 0%,$color2 100%);
	background: $image, radial-gradient(ellipse at center, $color1 0%,$color2 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$color1', endColorstr='$color2',GradientType=1 );
}

@mixin transition($duration, $params) {
	-webkit-transition: $duration $params;
	-moz-transition: $duration $params;
	-ms-transition: $duration $params;
	transition: $duration $params;
}

@mixin hyphens($value) {
	-moz-hyphens: $value;
	-o-hyphens: $value;
	-webkit-hyphens: $value;
	-ms-hyphens: $value;
	hyphens: $value;
}

@mixin placeholder($color) {
	::-webkit-input-placeholder {
		color: $color;
	}
	:-moz-placeholder {
		color: $color;
	}
	::-moz-placeholder {
		color: $color;
	}
	:-ms-input-placeholder {
		color: $color;
	}
}

@mixin no-list() {
	list-style: none;
	margin: 0;
	padding: 0;
	background: none;
	
	&:before {
		display: none;
	}
}

@mixin inline-block() {
	display: inline-block; 
	*display:inline; 
	*zoom:1;
}

@mixin no-margins() {
    margin: 0;
}




@mixin line-height($sizeValue: 14) {
    line-height: floor(($sizeValue * $line-height-base)); 
}


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

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


@function px2rem($font-size, $base-font-size: 16) {
	@return $font-size / $base-font-size + rem;
}

@mixin px2rem($font-size, $base-font-size: 16, $line: $font-size * 1.4) {
  font-size: $font-size + px; // für den IE8
  line-height: ($line) + px;
  font-size: px2rem($font-size, $base-font-size);
  line-height: ($line / $base-font-size) + rem;
}