<link href='https://fonts.googleapis.com/css?family=Open+Sans:800' rel='stylesheet' type='text/css'> 
<div id="container">
  <a href="#">Click Me</a>
</div>

@import compass


#container
  max-width: 175px
  margin: 4em auto
@mixin dropShadow($horiz, $vert, $blur, $spread, $horiz2, $vert2, $blur2, $spread2, $horiz3, $vert3, $blur3, $spread3, $horiz4, $vert4, $blur4, $spread4, $horiz5, $vert5, $blur5, $spread5 )
  -moz-box-shadow: $horiz $vert $blur $spread, $horiz2 $vert2 $blur2 $spread2, $horiz3 $vert3 $blur3 $spread3, $horiz4 $vert4 $blur4 $spread4, $horiz5 $vert5 $blur5 $spread5
  -webkit-box-shadow: $horiz $vert $blur $spread, $horiz2 $vert2 $blur2 $spread2, $horiz3 $vert3 $blur3 $spread3, $horiz4 $vert4 $blur4 $spread4, $horiz5 $vert5 $blur5 $spread5
  box-shadow: $horiz $vert $blur $spread, $horiz2 $vert2 $blur2 $spread2, $horiz3 $vert3 $blur3 $spread3, $horiz4 $vert4 $blur4 $spread4, $horiz5 $vert5 $blur5 $spread5
a
  font-family: 'Open Sans', sans-serif
  letter-spacing: 2px
  text-decoration: none
  text-transform: uppercase
  color: #000
  border: 3px solid
  padding: .25em .75em
  @include dropShadow(1px, 1px, 0px, 0px, 2px, 2px, 0px, 0px, 3px, 3px, 0px, 0px, 4px, 4px, 0px, 0px, 5px, 5px, 0px, 0px)
  position: relative
  &:active
    -moz-box-shadow: 0px 0px 0px 0px
    -webkit-box-shadow: 0px 0px 0px 0px
    box-shadow: 0px 0px 0px 0px
    top: 5px
    left: 5px