@mixin hr-center-border($w: 100px, $c: #000) {
  border: none;
  border-top: 1px solid $c;
  width: $w;
  margin-top: 50px;
  margin-bottom: 50px;
}

// Example:
// .dotted
//   +hr-dotted
// .dotted--alt
//   +hr-dotted(#000, 4, 1)

@mixin hr-dotted($color:rgba(#000, 1.0), $stripe: 1, $spacing: 4, $height:1) {
  @include background-image(linear-gradient(left, $color 0%, $color ($stripe/($stripe+$spacing))*100%, transparent ($stripe/($stripe+$spacing))*100%, transparent 100%));
  background-size: ($stripe+$spacing)*1px ($stripe+$spacing)*1px;
  height: $height*1px;
  border: none;
}

// Example:
// .shaded
//   +hr-shaded

@mixin hr-shaded($deg:135deg, $color:rgba(#000, 1.0), $stripe: 1, $spacing: 1, $height:10px) {
  $_stripe: $stripe;
  $_spacing: $spacing;
  $_diagonal: ceil(($_stripe+$_spacing)*1.414);
  $_pattern: $deg, $color, $color ($_stripe)*1px, transparent ($_stripe)*1px, transparent ($_diagonal)*1px, $color ($_diagonal)*1px;
  background-image: -webkit-repeating-linear-gradient($_pattern);
  background-image: -moz-repeating-linear-gradient($_pattern);
  background-image: -o-repeating-linear-gradient($_pattern);
  background-image: -ms-repeating-linear-grad§ient($_pattern);
  background-image: repeating-linear-gradient($_pattern);
  background-size: (($_stripe+$_spacing)*2)*1px (($_stripe+$_spacing)*2)*1px;
  height: $height;
  border: none;
}