glyphicon-lock is not showing

Question

I'm working on an ASP.NET MVC web application, and I'm using Bootstrap 3.

I have the following markup inside my login view to show username and password:

<fieldset>
  <div class="input-group input-group-lg">
    <span class="input-group-addon">
      <i class="glyphicon glyphicon-user blue"></i>
    </span>
    <input type="text" class="form-control" placeholder="Username" name="Username" value="@Model.UserName">
  </div>
  <div class="clearfix"></div><br>

  <div class="input-group input-group-lg">
    <span class="input-group-addon">
      <i class="glyphicon glyphicon-lock blue"></i>
    </span>
    <input type="password" class="form-control" placeholder="Password" name="password">
  </div>
  <div class="clearfix"></div>

  <p class="center col-md-5">
    <button type="submit" class="btn btn-primary">Login</button>
  </p>
</fieldset>

However, the glyphicon-lock inside the password field is not showing on IE, FF, or Safari: