Hi.

Try to use the px class. Add px-0 to the main card div and px-3 to the inputs:

<div class="card col-md-8 px-0" id="loginCard">

  ...

  <!-- Username -->
  <div class="md-form ">
    <input type="text" id="userInput" class="form-control border rounded-1 px-3" placeholder="Username" >
  </div>

  <!-- Password -->
  <div class="md-form">
    <input type="password" id="passwordInput" class="form-control border rounded-1 px-3" placeholder="Password">
  </div>

  ...

</div>

Then you can also remove this from css:

input :: placeholder {
  / * Firefox, Chrome, Opera * /
  padding-left: 15px;
}