// Signature
//
// Signature is displayed at the bottom of the page.
// The main function of this element is to display
// "Powered by Starter Project" text. Help others by
// sharing this package.
// https://starter.silvestar.codes
//
// Markup:
// <div class="sig">
//   <p>Powered by <a class="sig__link" href="https://starter.silvestar.codes"><svg width="500" height="500" viewBox="0 0 500 500" class="sig__icon"><defs><filter id="starter-project-a" width="105.2%" height="105.2%" x="-2.6%" y="-1.9%" filterUnits="objectBoundingBox"><feOffset dy="3" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset><feGaussianBlur in="shadowOffsetOuter1" result="shadowBlurOuter1" stdDeviation="3"></feGaussianBlur><feColorMatrix in="shadowBlurOuter1" result="shadowMatrixOuter1" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"></feColorMatrix><feMerge><feMergeNode in="shadowMatrixOuter1"></feMergeNode><feMergeNode in="SourceGraphic"></feMergeNode></feMerge></filter><linearGradient id="starter-project-b" x1="0%" y1="50%" y2="50%"><stop offset="0%" stop-color="#BA1ADA"></stop><stop offset="100%" stop-color="#D91A79"></stop></linearGradient><linearGradient id="starter-project-c" x1="100%" x2="0%" y1="50%" y2="50%"><stop offset="0%" stop-color="#1ED9D9"></stop><stop offset="100%" stop-color="#1EBADA"></stop></linearGradient><path id="starter-project-d" d="M250 225l-150 75V100l150 75v-75h50v200h-50v-75z"></path><filter id="starter-project-e" width="103%" height="103%" x="-1.5%" y="-1.5%" filterUnits="objectBoundingBox"><feGaussianBlur in="SourceAlpha" result="shadowBlurInner1" stdDeviation="2"></feGaussianBlur><feOffset dy="2" in="shadowBlurInner1" result="shadowOffsetInner1"></feOffset><feComposite in="shadowOffsetInner1" in2="SourceAlpha" k2="-1" k3="1" operator="arithmetic" result="shadowInnerInner1"></feComposite><feColorMatrix in="shadowInnerInner1" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"></feColorMatrix></filter></defs><g fill="none" fill-rule="evenodd" filter="url(#starter-project-a)" transform="translate(50 50)"><path fill="url(#starter-project-b)" d="M80 35h320v365H0V0h80v35z"></path><use fill="url(#starter-project-c)" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#starter-project-d"></use><use fill="#000" filter="url(#starter-project-e)" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#starter-project-d"></use></g></svg> Starter Project</a>.</p>
// </div>
//
// Weight: 301
//
// Styleguide: Footer
.sig {
  align-items: baseline;
  background-image: linear-gradient(to right, transparentize($color-gamma, 0.85), transparentize($color-delta, 0.85));
  color: $color-text;
  display: flex;
  justify-content: center;
  line-height: 1;
  padding: rem(1px) rem(10px) rem(6px);

  p {
    font-size: ms(-1);
    margin: 0;
  }
}

.sig__link {
  @include tra;
  align-items: baseline;
  display: inline-flex;
  text-decoration: none;
}

.sig__icon {
  @include tra;
  height: rem(20px);
  margin-right: rem(2px);
  transform: translateY(rem(4px));
  transform-origin: center;
  width: rem(20px);
}