<!DOCTYPE HTML>
<html lang="en-US">
<head>
  <meta charset="UTF-8">
  <title></title>
  <link href="http://cdn.kendostatic.com/2013.1.319/styles/kendo.common.min.css" rel="stylesheet">
  <link href="http://cdn.kendostatic.com/2013.1.319/styles/kendo.default.min.css" rel="stylesheet">
</head>
<body>
  
  <fieldset title="Step 1">
    <legend>Personal Details</legend>
    <input data-val="true" data-val-required="The TypeOfLoan field is required." id="TypeOfLoan" name="TypeOfLoan" type="hidden" value="Secured" />
    <table style="width: 955px">
        <tr style="width: 9550px">
            <td style="width: 200px">
                <div class="editor-label">
                    <label for="Title">First Name</label>
                </div>
            </td>
            <td style="width: 300px">
                <div class="editor-field">
                    <select id="Title" name="Title" title="What's your title?">
                        <option value=""></option>
                        <option value="Mr.">Mr.</option>
                        <option value="Mrs.">Mrs.</option>
                        <option value="Miss">Miss</option>
                    </select>
                </div>
            </td>
            <td style="width: auto"> <span class="field-validation-valid" data-valmsg-for="Title" data-valmsg-replace="true"></span>
            </td>
        </tr>
        <tr style="width: 955px">
            <td style="width: 200px">
                <div class="editor-label">
                    <label for="FirstName">First Name</label>
                </div>
            </td>
            <td style="width: 300px">
                <div class="editor-field">
                    <input class="text-box single-line" title="What's first name?" data-val="true" data-val-length="First Name field has a maximum length of 25." data-val-length-max="25" data-val-required="First Name field is required." id="FirstName" name="FirstName" type="text" value="" />
                </div>
            </td>
            <td style="width: auto"> <span class="field-validation-valid" data-valmsg-for="FirstName" data-valmsg-replace="true"></span>

            </td>
        </tr>
        <tr style="width: 955px">
            <td style="width: 200px">
                <div class="editor-label">
                    <label for="LastName">Last Name</label>
                </div>
            </td>
            <td style="width: 300px">
                <div class="editor-field">
                    <input class="text-box single-line" title="What's last name?" data-val="true" data-val-length="Last Name field has a maximum length of 25." data-val-length-max="25" data-val-required="Last Name field is required." id="LastName" name="LastName" type="text" value="" />
                </div>
            </td>
            <td style="width: auto"> <span class="field-validation-valid" data-valmsg-for="LastName" data-valmsg-replace="true"></span>

            </td>
        </tr>
        <tr style="width: 955px">
            <td style="width: 200px">
                <div class="editor-label">
                    <label>Date of Birth</label>
                </div>
            </td>
            <td style="width: 300px">
                <div class="editor-field">
                    <input class="text-box single-line" title="What's your date of birth?" data-val="true" data-val-date="The field Date of Birth must be a date." data-val-required="DoB field is required." id="DoB" name="DoB" type="date" value="" />
                </div>
            </td>
            <td style="width: auto"> <span class="field-validation-valid" data-valmsg-for="DoB" data-valmsg-replace="true"></span>

            </td>
        </tr>
    </table>
</fieldset>
  
  <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
  <script src="http://cdn.kendostatic.com/2013.1.319/js/kendo.all.min.js"></script>

  <script>

    (function ($) {
      
      $("input, select").kendoTooltip({
        position: "right",
        autoHide: true,
      animation: {
        open: {
          effects: "slideIn:right",
          duration: 200
        },
        // passing reverse: true reverses the slideIn animation
        close: {
          effects: "slideIn:right",
          reverse: true,
          duration: 200
        }
      }
      });}(jQuery));
      

  </script>

</body>
</html>