<form action="#" title="formtips">
  <fieldset>
    <legend>form typs</legend>
    <div class="row">
      <label for="input"><span>Input Box (Active):</span></label>
      <div class="input-holder">
        <input type="text" placeholder="Text Field with Active Box" class="active" id="input">
      </div>
    </div>
    <div class="row">
      <label for="input1"><span>Input Box (INActive):</span></label>
      <div class="input-holder">
        <input type="text" placeholder="Text Field with Inactive Box" id="input1">
      </div>
    </div>
    <div class="row">
      <label for="input2"><span>Text Area:</span></label>
      <div class="input-holder">
        <textarea placeholder="Text goes here" id="input2"></textarea>
      </div>
    </div>
    <div style='submit-btn'>
      <input class='btn' type='submit' href='javascript:void();' onclick="document.getElementById('ContactForm').submit();return false;" class='btn' value='Success'>
    </div>
    <div class="row"> <strong class="title-label"><span>Checkbox:</span></strong>
      <div class="checkbox-holder">
        <input type="checkbox" id="1">
        <label class="label" for="1">1</label>
        <input type="checkbox" id="2">
        <label class="label" for="2">2</label>
        <input type="checkbox" id="3">
        <label class="label" for="3">3</label>
      </div>
    </div>
    <div class="row"> <strong class="title-label"><span>Radio box:</span></strong>
      <div class="radio-buttons">
        <div class="radio-holder">
          <input type="radio" id="option1" name="option">
          <label class="label" for="option1">Option 1 (Enabled)</label>
        </div>
        <div class="radio-holder">
          <input type="radio" id="option2" name="option">
          <label class="label" for="option2">Option 2 (Disabled)</label>
        </div>
      </div>
    </div>
    <div class="row">
      <label for="dropdown"><span>DROPDOWN:</span></label>
      <div class="select-holder">
        <select data-jcf='{"wrapNative": false}' id="dropdown">
          <option>Community</option>
          <option>Community</option>
          <option>Community</option>
        </select>
      </div>
    </div>
    <div class="row"> <strong class="title-label"><span>Select Box:</span></strong>
      <div class="select-block">
        <div class="jcf-scrollable">
          <div class="select-box">
            <ul class="select-list">
              <li><a href="#">1</a></li>
              <li><a href="#">2</a></li>
              <li><a href="#">3</a></li>
              <li><a href="#">4</a></li>
              <li><a href="#">5</a></li>
            </ul>
          </div>
        </div>
      </div>
    </div>
    <div class="row"> <strong class="title-label"><span>Tags/Filter:</span></strong>
      <div class="tag-holder"> <a href="#" class="tag">tag/filter reg<span class="ico"></span></a> <a href="#" class="tag">tag/filter ovr<span class="ico"></span></a> </div>
    </div>
    <div class="row">
      <div class="btn-holder">
        <input type="submit" class="btn" value="SUBMIT">
        <input type="submit" class="btn success" value="SUCCESS">
        <input type="submit" class="btn info" value="INFO">
        <input type="submit" class="btn warning" value="WARNING">
        <input type="submit" class="btn danger" value="DANGER">
        <input type="submit" class="btn clear" value="CLEAR">
      </div>
    </div>
  </fieldset>
</form>