<h1>Wired.com Huge Underlined Link</h1>
<p>
  Short ribs tri-tip <a href="javascript:">pork belly</a> shank drumstick beef ribs corned beef pig tail kevin prosciutto. Cow salami turkey ribeye kevin sirloin pork loin turducken brisket shankle pork filet mignon leberkas. Strip <a href="javascript:">steak</a> chuck rump pastrami bresaola.
</p>
<ul>
  <li>
    <a href="javascript:">Bacons</a>
  </li>
  <li>
    <a href="javascript:">More Bacons</a>
  </li>
  <li>
    <a href="javascript:">Even More Bacons</a>
  </li>
</ul>  

$purple: #98489D;

/*
  Underline is composed of bottom border and inset box-shadow.
*/
a
{
  color: black;
  text-decoration: none;
  border-bottom: .0625em solid lighten($purple,40%);
  box-shadow: 0 -.25em 0 lighten($purple,40%) inset;
}

    
/*
  Page styles
*/

*
{
  text-rendering: optimizeLegibility;
  -moz-osx-font-smoothing: grayscale !important;
  -webkit-font-smoothing: antialiased !important;
  font-smoothing: antialiased !important;
  -moz-font-feature-settings: 'kern';
  -ms-font-feature-settings: 'kern';
  -o-font-feature-settings: 'kern';
  -webkit-font-feature-settings: 'kern';
  font-feature-settings: 'kern';
  font-kerning: normal;
}

html
{
  font-size: calc(16px + 0.5vw);
}
  
body
{
  max-width: 65ch;
  margin: 0 auto;
  padding: 1em 2em;
  line-height: 1.375;
  font-size: 1em;
  font-family: Georgia, serif;
  background-color: #edf2f7;
}
  
h1
{
  color: $purple;
  letter-spacing: -1px;
  font-family: 'Futura', sans-serif;
}

// Wired.com Huge Underlined Link Style