notifications-admin/app/assets/stylesheets/components/letter.scss

$iso-paper-ratio: 70.7%;

.letter {

  font-family: Helvetica, Arial, sans-serif;
  padding: 0;
  margin: 0 0 $gutter 0;
  position: relative;

  &:after {
    content: "";
    display: block;
    z-index: 10;
    position: absolute;
    top: 2px;
    left: 0;
    height: 0;
    padding: $iso-paper-ratio 0 0 0;
    width: 100%;
    background: $highlight-colour;
    transform: skew(-1deg, 0deg) scale(1, 0.99);
    transform-origin: left bottom;
    box-shadow: inset 0 0 0 2px $panel-colour;

  }

  a {

    display: block;
    overflow: hidden;
    width: 100%;
    height: 0;
    padding: $iso-paper-ratio 0 0 0;
    position: relative;
    z-index: 20;
    transition: all 0.1s ease-out;

    &:focus {

      outline: none;
      box-shadow: 0 3px 0 0 $yellow;

      img {
        box-shadow: inset 0 0 0 3px $yellow;
      }

    }

  }

  img {
    display: block;
    width: 100%;
    background: $white;
    box-shadow: inset 0 0 0 2px $panel-colour;
    position: absolute;
    top: 0;
    left: 0;
  }

}