<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<div class="container">
<div class="row">
<div class="form-card">
<div class='form-group'>
<div class='col-xs-12 form-group'>
<label class="control-label locked" for="name-input-field">Name</label>
<input id="name" name="name" class="form-control" type="text" required="">
</div>
</div>
<div class='form-group'>
<div class='col-xs-12 form-group'>
<label class="control-label locked" for="phone-input-field">Phone Number</label>
<input id="phone_number" name="phone_number" type="text" placeholder="08xxxxxxxxxx" class="form-control locked" required="">
</div>
</div>
<div class="form-group locked">
<div class='col-xs-12 form-group'>
<label class="control-label locked" for="email-input-field">Email</label>
<input id="email" name="email" type="text" placeholder="email@email.com" class="form-control locked" required="">
</div>
</div>
<div class="form-group locked">
<div class='col-xs-12 form-group'>
<label class="control-label locked" for="desc-input-field">Description</label>
<textarea name="desc" id="desc" cols="0" rows="3" class="form-control locked"></textarea>
</div>
</div>
<div class="form-group locked">
<div class='col-xs-12 form-group'>
<label class="control-label locked" for="desc-input-field">Address</label>
<textarea name="address" id="address" cols="0" rows="3" class="form-control locked"></textarea>
</div>
