Google fonts isn't working on my website

I've tried adding an important tag in the CSS, I've checked the dev console for any errors, and nothing is showing up. I have no idea why this is happening.

Here's the effected code:

.links-text {
  font-family: 'Work Sans', sans-serif, !important;
  display: block;
  padding-top: 5px;
  padding-bottom: 10px;
  padding-left: 15px;
  text-align: center;
  color: black;
  font-size: 1.4em;
  font-weight: 800;
}

<html>

<head>
  <link href="https://fonts.googleapis.com/css?family=Work+Sans:100,400,700,800" rel="stylesheet">
  <link rel="stylesheet" type="text/css" href="oth_style.css">
  <link rel="stylesheet" type="text/css" href="oth_responsive.css">
  <link href="https://fonts.googleapis.com/css?family=Cabin" rel="stylesheet">
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, intial-scale=1.0">
  <title>Over The Horizion</title>
</head>

<body>
  <nav class="col-12">
    <div class="navbar">
      <ul>
        <li class="navli"><a class="links-text" href="oth_quote.html.">Get A Quote</a>
        </li>
        <li class="navli"><a class="links-text" href="oth_portfolio.html">Portfolio</a>
        </li>
        <li class="navli"><a class="links-text" href="oth_services.html">Services</a>
        </li>
      </ul>
    </div>
  </nav>
</body>

</html>

I have no idea why it isn't working. I've got it loading up right away in the HTML.

Solution

Remove the comma after sans-serif in your css.

You could remove both this and the !important. Try to avoid using !important in your CSS as it can cause a bunch of specificity headaches in the future.