<h1>Long Shadow Heelo<h1>

@import "compass/css3";
@import url('https://fonts.googleapis.com/css?family=Passion+One');
@function longshadow($color_a,$color_b,$stepnum, $opacity: 1){

	$gradient_steps: null;

	@for $i from 1 through $stepnum {

		$weight: ( ( $i - 1 ) / $stepnum ) * 100;

		$colour_mix: mix($color_b, rgba($color_a, $opacity), $weight);

		$seperator: null;

		@if($i != $stepnum){ 
			$seperator: #{','}; 
		}

		$gradient_steps: append( #{$gradient_steps}, #{$i}px #{$i}px $colour_mix $seperator );

  	}

  	@return $gradient_steps;

}
$bg: #3498db;
body{
  background-color: $bg;
  font-family: 'Passion One', 'arial';
}

h1{
  text-align:center;
  font-size: 6rem;
  color: #fff;
  @include text-shadow(longshadow(darken($bg,30%),$bg,50, 0.5));
}