<link href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <form class="form-horizontal"> <fieldset> <!-- Form Name --> <legend>Form Name</legend> <!-- Select Basic --> <div class="form-group"> <label class="col-md-4 control-label" for="selectbasic">Institution </label> <div class="col-md-5"> <select id="selectbasic" name="selectbasic" class="form-control"> <option value="1">Anz</option> <option value="2">Bankdirect</option> <option value="">BNZ</option> <option value="">kiwibank</option> </select> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="Product Name">Product Name</label> <div class="col-md-5"> <input id="Product Name" name="Product Name" type="text" placeholder="Description" class="form-control input-md" required=""> </div> </div> <!-- Select Basic --> <div class="form-group"> <label class="col-md-4 control-label" for="Loan Type">Loan Type</label> <div class="col-md-5"> <select id="Loan Type" name="Loan Type" class="form-control"> <option value="1">Standard Variable</option> <option value="2">Fixed Home Loan</option> <option value="">Home Equity</option> </select> </div> </div> <!-- Multiple Checkboxes --> <div class="form-group"> <label class="col-md-4 control-label" for="checkboxes">Repayment Options</label> <div class="col-md-4"> <div class="checkbox"> <label for="checkboxes-0"> <input type="checkbox" name="checkboxes" id="checkboxes-0" value="1"> Principal & Interest </label> </div> <div class="checkbox"> <label for="checkboxes-1"> <input type="checkbox" name="checkboxes" id="checkboxes-1" value="2"> Interest Only </label> </div> </div> </div> <!-- Multiple Checkboxes --> <div class="form-group"> <label class="col-md-4 control-label" for="checkboxes">Availability</label> <div class="col-md-4"> <div class="checkbox"> <label for="checkboxes-0"> <input type="checkbox" name="checkboxes" id="checkboxes-0" value="1"> Owner Occupier </label> </div> <div class="checkbox"> <label for="checkboxes-1"> <input type="checkbox" name="checkboxes" id="checkboxes-1" value="2"> Investor </label> </div> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="Loan Amount Min">Loan Amount Min</label> <div class="col-md-5"> <input id="Loan Amount Min" name="Loan Amount Min" type="text" placeholder="$150,000" class="form-control input-md"> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="LoanAmountMax">Loan Amount Max</label> <div class="col-md-5"> <input id="LoanAmountMax" name="LoanAmountMax" type="text" placeholder="$900,000" class="form-control input-md"> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="LVR">LVR</label> <div class="col-md-5"> <input id="LVR" name="LVR" type="text" placeholder="80%" class="form-control input-md"> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="LoanTerm">Loan Term Min</label> <div class="col-md-5"> <input id="LoanTerm" name="LoanTerm" type="text" placeholder="10" class="form-control input-md"> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="LoanTermMax">Loan Term Max</label> <div class="col-md-5"> <input id="LoanTermMax" name="LoanTermMax" type="text" placeholder="30" class="form-control input-md"> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="IntroRate">Intro Rate</label> <div class="col-md-5"> <input id="IntroRate" name="IntroRate" type="text" placeholder="4.99%" class="form-control input-md"> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="IntroLength">Introductory Period</label> <div class="col-md-5"> <input id="IntroLength" name="IntroLength" type="text" placeholder="9 Months" class="form-control input-md"> </div> </div> <!-- Select Basic --> <div class="form-group"> <label class="col-md-4 control-label" for="IntroType">Introductory Type</label> <div class="col-md-5"> <select id="IntroType" name="IntroType" class="form-control"> <option value="1">Variable Rate</option> <option value="2">Fixed Rate</option> </select> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="VariableRate">Variable Rate</label> <div class="col-md-5"> <input id="VariableRate" name="VariableRate" type="text" placeholder="6.00%" class="form-control input-md"> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="ComparisonRate">Variable Comparison Rate</label> <div class="col-md-5"> <input id="ComparisonRate" name="ComparisonRate" type="text" placeholder="6.50%" class="form-control input-md"> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="1yrFixed">1 Year Fixed</label> <div class="col-md-5"> <input id="1yrFixed" name="1yrFixed" type="text" placeholder="6.99%" class="form-control input-md"> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="2yrFixed">2 Year Fixed</label> <div class="col-md-5"> <input id="2yrFixed" name="2yrFixed" type="text" placeholder="7.05%" class="form-control input-md"> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="3yrFixed">3 Year Fixed</label> <div class="col-md-5"> <input id="3yrFixed" name="3yrFixed" type="text" placeholder="7.25%" class="form-control input-md"> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="4yrFixed">4 Year Fixed</label> <div class="col-md-5"> <input id="4yrFixed" name="4yrFixed" type="text" placeholder="7.35%" class="form-control input-md"> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="5yrFixed">5 Year Fixed</label> <div class="col-md-5"> <input id="5yrFixed" name="5yrFixed" type="text" placeholder="7.55%" class="form-control input-md"> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="6yrFixed">6 Year Fixed</label> <div class="col-md-5"> <input id="6yrFixed" name="6yrFixed" type="text" placeholder="7.65%" class="form-control input-md"> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="7yrFixed">7 Year Fixed</label> <div class="col-md-5"> <input id="7yrFixed" name="7yrFixed" type="text" placeholder="7.99%" class="form-control input-md"> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="ApplicationFee">Application Fee</label> <div class="col-md-5"> <input id="ApplicationFee" name="ApplicationFee" type="text" placeholder="$500" class="form-control input-md"> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="ExitFee">Exit Fee</label> <div class="col-md-5"> <input id="ExitFee" name="ExitFee" type="text" placeholder="$900" class="form-control input-md"> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="ServiceFee">Service Fee</label> <div class="col-md-5"> <input id="ServiceFee" name="ServiceFee" type="text" placeholder="$100" class="form-control input-md"> </div> </div> <!-- Select Basic --> <div class="form-group"> <label class="col-md-4 control-label" for="Loan Type">Payable Frequency</label> <div class="col-md-5"> <select id="Payable Period" name="PayablePeriod" class="form-control"> <option value="1">3 months</option> <option value="2">6 Months</option> <option value="">12 Months</option> </select> </div> </div> <!-- Textarea --> <div class="form-group"> <label class="col-md-4 control-label" for="textarea">Loan Features</label> <div class="col-md-4"> <textarea class="form-control" id="textarea" name="textarea"></textarea> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="Go to Site Button URL">Go to Site Button URL</label> <div class="col-md-5"> <input id="Go to Site Button URL" name="Go to Site Button URL" type="text" placeholder="Paste URL" class="form-control input-md"> </div> </div> </fieldset> </form>