
@function strip-units($number) {
  @return $number / ($number * 0 + 1);
}


@mixin retina {
	@media only screen and (-webkit-min-device-pixel-ratio: 1.5)
	{
		@content;
	}
}

@mixin bgImageWithSize($width, $height, $img, $extension, $version:0) {
	$versionParam: '';
	@if $version > 0 {
		$versionParam: '?v=' + $version;
	}
	
	$imgPath: $imageDirectory + $img + '.' + $extension + $versionParam;
	$imgRetinaPath: $imageDirectory + $img + '@2x' +  '.' + $extension + $versionParam;

	$width: strip-units($width);
	$height: strip-units($height);
	
	@if $width > 0 and $height > 0 {
		background-size: $width+px $height+px;
	}

	background-image: url($imgPath);
	
	@include retina(){
		background-image: url($imgRetinaPath);
	}
}

@mixin boxShadow($x, $y, $direction, $depth, $color){
	/* 3px 3px 4px #444444, direction: filter: 135 */
	-moz-box-shadow: $x $y $depth $color;
	-webkit-box-shadow: $x $y $depth $color;
	box-shadow: $x $y $depth $color;
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=$depth, Direction=$direction, Color='$color')";
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=$depth, Direction=$direction, Color='$color');
}
@mixin boxGlow($x, $y, $radius, $spread, $color){
	-webkit-box-shadow: $x $y $radius $spread $color;
	box-shadow: $x $y $radius $spread $color;
}
@mixin gradient($colorTop, $colorBottom){
	background-color: $colorBottom;
	background-image: -webkit-gradient(linear, left top, left bottom, from($colorTop), to($colorTop)); /* Saf4+, Chrome */
	background-image: -webkit-linear-gradient(top, $colorTop, $colorBottom); /* Chrome 10+, Saf5.1+, iOS 5+ */
	background-image:    -moz-linear-gradient(top, $colorTop, $colorBottom); /* FF3.6+ */
	background-image:     -ms-linear-gradient(top, $colorTop, $colorBottom); /* IE10 */
	background-image:      -o-linear-gradient(top, $colorTop, $colorBottom); /* Opera 11.10+ */
	background-image:         linear-gradient(to bottom, $colorTop, $colorBottom);
	filter:  progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='$colorTop', endColorstr='$colorTop'); /* IE6 & IE7 */
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='$colorTop', endColorstr='$colorTop')"; /* IE8 */
}
/* https://engageinteractive.co.uk/blog/top-10-scss-mixins */
@mixin push--auto {
    margin: { 
        left: auto;
        right: auto;
    }
}
@mixin pseudo($display: block, $pos: absolute, $content: ''){
    content: $content;
    display: $display;
    position: $pos;
}
@function z($name) {
    @if index($z-indexes, $name) {
        @return (length($z-indexes) - index($z-indexes, $name)) + 1;
    } @else {
        @warn 'There is no item "#{$name}" in this list; choose one of: #{$z-indexes}';
        @return null;
    }
}
$z-indexes: (
    "outdated-browser",
    "modal",
    "site-header",
    "page-wrapper",
    "site-footer"
);

/* my mixins */
@mixin pa($top, $right, $bottom, $left) {
    position:absolute;
    top: $top;
    right: $right;
    bottom: $bottom;
    left: $left;
}
@mixin position-absolute($top, $right, $bottom, $left) {
    position:absolute;
    top: $top;
    right: $right;
    bottom: $bottom;
    left: $left;
}
@mixin font($size, $line-height, $weight){
    font-size:$size;
    line-height:$line-height;
    font-weight:$weight;
}
@mixin clearfix(){
	&:after {
		clear:both;
		display:block;
		content:'';
	}
}
@mixin link-underlined(){
	text-decoration:underline;
	&:hover {
		text-decoration:none;
	}
}
@mixin link-not-underlined(){
	text-decoration:none;
	&:hover {
		text-decoration:underline;
	}
}
@mixin fc(){
	display:flex;
	justify-content:center;
	align-items:center;
}
@mixin list-reset(){
	list-style-type:none;
	margin:0px;
	padding:0px;

	li {
		list-style-type:none;
		margin:0px;
		padding:0px;
	}
}
@function get-vw($target,$viewport) { 
  $vw-context: ($viewport*.01) * 1px;
  @return ($target/$vw-context) * 1vw;
}