<!DOCTYPE html>
<html>
<head>
<title>
Wufoo · Theme Kit
</title>
<!--
Hey friend! Don't edit this file!
It shows you how your custom CSS
will affect Wufoo form markup.
Check out the README.txt for more info.
-->
<!-- Meta Tags -->
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- CSS -->
<link rel="stylesheet" href="//www.wufoo.com/stylesheets/public/forms/css/index.css" type="text/css" />
<!-- for some reason when you add a custom theme wufoo like to add the following to really annoy you -->
<link href="https://derbyuni.wufoo.com/css/custom/17/theme.css" rel="stylesheet">
<link rel="stylesheet" href="../../styles/app.css" type="text/css" />
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body id="public">
<div id="container">
<h1 id="logo"><a>Wufoo</a></h1>
<form class="wufoo" action="#" novalidate>
<header id="header" class="info">
<h2>Title</h2>
<div>Description</div>
</header>
<ul>
<li class="section first">
<section>
<h3>Section Title</h3>
<div>Description of the section.</div>
</section>
</li>
<li class="focused">
<label class="desc">Field Title<span class="req"> * </span></label>
<div>
<textarea rows="10" cols="50" class="field textarea medium">The quick brown fox jumped over the lazy dog.</textarea>
</div>
<p class="instruct"><small>
Instructions for the user. Robots are typically used to do the tasks that are too dirty, dangerous, difficult, repetitive or dull for humans.
<br /><br />Chris is Wufoo's robot.
</small></p>
</li>
<li>
<label class="desc">Another Field Title<span class="req"> * </span></label>
<div>
<input class="field text medium" type="text" maxlength="255" value="Example text." />
</div>
</li>
<li>
<label class="desc">Another Field Title<span class="req"> * </span></label>
<div>
<input class="field text large" type="text" maxlength="255" value="Example text." />
</div>
</li>
<li>
<label class="desc">Another Field Title<span class="req"> * </span></label>
<div>
<input class="field text large" type="text" maxlength="255" placeholder="Example text." />
</div>
</li>
<li class="section">
<section>
<h3>Section Title</h3>
<div>Description of another section.</div>
</section>
</li>
<li>
<fieldset>
<legend class="desc">Multiple Choice (default)</legend>
<div class="col">
<span>
<input class="field radio" type="radio" value="Robots" checked="checked" />
<label class="choice">Robots</label>
</span>
<span>
<input class="field radio" type="radio" value="Monkeys"/>
<label class="choice">Monkeys</label>
</span>
<span>
<input class="field radio" type="radio" value="Ninjas"/>
<label class="choice">Ninjas</label>
</span>
</div>
</fieldset>
</li>
<li class="twoColumns">
<fieldset>
<legend class="desc">Multiple Choice (2 cols)</legend>
<div class="col">
<span>
<input class="field radio" type="radio" value="Robots" checked="checked" />
<label class="choice">Robots</label>
</span>
<span>
<input class="field radio" type="radio" value="Monkeys"/>
<label class="choice">Monkeys</label>
</span>
<span>
<input class="field radio" type="radio" value="Ninjas"/>
<label class="choice">Ninjas</label>
</span>
</div>
</fieldset>
</li>
<li class="threeColumns">
<fieldset>
<legend class="desc">Multiple Choice (3 cols)</legend>
<div class="col">
<span>
<input class="field radio" type="radio" value="Robots" checked="checked" />
<label class="choice">Robots</label>
</span>
<span>
<input class="field radio" type="radio" value="Monkeys"/>
<label class="choice">Monkeys</label>
</span>
<span>
<input class="field radio" type="radio" value="Ninjas"/>
<label class="choice">Ninjas</label>
</span>
</div>
</fieldset>
</li>
<li class="notStacked">
<fieldset>
<legend class="desc">Multiple Choice (side by side)</legend>
<div class="col">
<span>
<input class="field radio" type="radio" value="Robots" checked="checked" />
<label class="choice">Robots</label>
</span>
<span>
<input class="field radio" type="radio" value="Monkeys"/>
<label class="choice">Monkeys</label>
</span>
<span>
<input class="field radio" type="radio" value="Ninjas"/>
<label class="choice">Ninjas</label>
</span>
</div>
</fieldset>
</li>
<li>
<fieldset>
<legend class="desc">Checkboxes</legend>
<div class="col">
<span>
<input class="field checkbox" type="checkbox" value="Invisibility" checked="checked" />
<label class="choice">Invisibility</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Super Strength"/>
<label class="choice">Super Strength</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Eye Lasers"/>
<label class="choice">Eye Lasers</label>
</span>
</div>
</fieldset>
</li>
<li class="twoColumns">
<fieldset>
<legend class="desc">Checkboxes (2 cols)</legend>
<div class="col">
<span>
<input class="field checkbox" type="checkbox" value="Invisibility" checked="checked" />
<label class="choice">Invisibility</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Super Strength"/>
<label class="choice">Super Strength</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Eye Lasers"/>
<label class="choice">Eye Lasers</label>
</span>
</div>
</fieldset>
</li>
<li class="threeColumns">
<fieldset>
<legend class="desc">Checkboxes (3 cols)</legend>
<div class="col">
<span>
<input class="field checkbox" type="checkbox" value="Invisibility" checked="checked" />
<label class="choice">Invisibility</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Super Strength"/>
<label class="choice">Super Strength</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Eye Lasers"/>
<label class="choice">Eye Lasers</label>
</span>
</div>
</fieldset>
</li>
<li class="notStacked">
<fieldset>
<legend class="desc">Checkboxes (side by side)</legend>
<div class="col">
<span>
<input class="field checkbox" type="checkbox" value="Invisibility" checked="checked" />
<label class="choice">Invisibility</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Super Strength"/>
<label class="choice">Super Strength</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Eye Lasers"/>
<label class="choice">Eye Lasers</label>
</span>
</div>
</fieldset>
</li>
<li class="section">
<section>
<h3>Section Title</h3>
<div>Description of another section.</div>
</section>
</li>
<li>
<label class="desc">Name Field</label>
<span>
<input class="field text" size="2" value=""/>
<label>Title</label>
</span>
<span>
<input class="field text" size="8" value=""/>
<label>First</label>
</span>
<span>
<input class="field text" size="14" value=""/>
<label>Last</label>
</span>
<span>
<input class="field text" size="3" value=""/>
<label>Suffix</label>
</span>
</li>
<li>
<label class="desc">Date Field</label>
<span>
<input class="field text" size="2" type="text" maxlength="2" value=""/> /
<label>MM</label>
</span>
<span>
<input class="field text" size="2" type="text" maxlength="2" value=""/> /
<label>DD</label>
</span>
<span>
<input class="field text" size="4" type="text" maxlength="4" value=""/>
<label>YYYY</label>
</span>
<img src="http://wufoo.com/images/icons/calendar.png" class="icon" alt="Pick date." id="pickdate111" />
</li>
<li>
<label class="desc">Time Field</label>
<span>
<input class="field text" size="2" type="text" maxlength="2" value=""/> :
<label>HH</label>
</span>
<span>
<input class="field text" size="2" type="text" maxlength="2" value=""/> :
<label>MM</label>
</span>
<span>
<input class="field text" size="2" type="text" maxlength="2" value=""/>
<label>SS</label>
</span>
<span>
<select class="field select" style="width:4em">
<option value="AM">AM</option>
<option value="PM">PM</option>
</select>
<label>AM/PM</label>
</span>
</li>
<li>
<label class="desc">Phone Field</label>
<span>
<input class="field text" type="tel" size="3" maxlength="3" value=""/> -
<label>###</label>
</span>
<span>
<input class="field text" type="tel" size="3" maxlength="3" value=""/> -
<label>###</label>
</span>
<span>
<input class="field text" type="tel" size="4" maxlength="4" value=""/>
<label>####</label>
</span>
</li>
<li>
<label class="desc">Currency Field</label>
<span>$</span>
<span>
<input class="field text currency nospin" type="number" size="10" value=""/> .
<label>Dollars</label>
</span>
<span>
<input class="field text nospin" size="2" type="number" maxlength="2" value=""/>
<label>Cents</label>
</span>
</li>
<li class="complex">
<label class="desc">Address Field</label>
<div>
<span class="full">
<input class="field text addr" type="text" value="" />
<label>Street Address</label>
</span>
<span class="full">
<input class="field text addr" type="text" value="" />
<label>Address Line 2</label>
</span>
<span class="left">
<input class="field text addr" type="text" value="" />
<label>City</label>
</span>
<span class="right">
<input class="field text addr" type="text" value="" />
<label>State / Province / Region</label>
</span>
<span class="left">
<input class="field text addr" type="text" maxlength="15" value="" />
<label>Postal / Zip Code</label>
</span>
<span class="right">
<select class="field select addr">
<option value="" selected="selected"></option>
<option value="Afghanistan">Afghanistan</option>
<option value="Albania">Albania</option>
<option value="Algeria">Algeria</option>
<option value="Andorra">Andorra</option>
<option value="Antigua and Barbuda">Antigua and Barbuda</option>
<option value="Argentina">Argentina</option>
<option value="Armenia">Armenia</option>
<option value="Australia">Australia</option>
<option value="Austria">Austria</option>
<option value="Azerbaijan">Azerbaijan</option>
<option value="Bahamas">Bahamas</option>
<option value="Bahrain">Bahrain</option>
<option value="Bangladesh">Bangladesh</option>
<option value="Barbados">Barbados</option>
<option value="Belarus">Belarus</option>
<option value="Belgium">Belgium</option>
<option value="Belize">Belize</option>
<option value="Benin">Benin</option>
<option value="Bhutan">Bhutan</option>
<option value="Bolivia">Bolivia</option>
<option value="Bosnia and Herzegovina">Bosnia and Herzegovina</option>
<option value="Botswana">Botswana</option>
<option value="Brazil">Brazil</option>
<option value="Brunei">Brunei</option>
<option value="Bulgaria">Bulgaria</option>
<option value="Burkina Faso">Burkina Faso</option>
<option value="Burundi">Burundi</option>
<option value="Cambodia">Cambodia</option>
<option value="Cameroon">Cameroon</option>
<option value="Canada">Canada</option>
<option value="Cape Verde">Cape Verde</option>
<option value="Central African Republic">Central African Republic</option>
<option value="Chad">Chad</option>
<option value="Chile">Chile</option>
<option value="China">China</option>
<option value="Colombia">Colombia</option>
<option value="Comoros">Comoros</option>
<option value="Congo">Congo</option>
<option value="Costa Rica">Costa Rica</option>
<option value="Côte d'Ivoire">Côte d'Ivoire</option>
<option value="Croatia">Croatia</option>
<option value="Cuba">Cuba</option>
<option value="Cyprus">Cyprus</option>
<option value="Czech Republic">Czech Republic</option>
<option value="Denmark">Denmark</option>
<option value="Djibouti">Djibouti</option>
<option value="Dominica">Dominica</option>
<option value="Dominican Republic">Dominican Republic</option>
<option value="East Timor">East Timor</option>
<option value="Ecuador">Ecuador</option>
<option value="Egypt">Egypt</option>
<option value="El Salvador">El Salvador</option>
<option value="Equatorial Guinea">Equatorial Guinea</option>
<option value="Eritrea">Eritrea</option>
<option value="Estonia">Estonia</option>
<option value="Ethiopia">Ethiopia</option>
<option value="Fiji">Fiji</option>
<option value="Finland">Finland</option>
<option value="France">France</option>
<option value="Gabon">Gabon</option>
<option value="Gambia">Gambia</option>
<option value="Georgia">Georgia</option>
<option value="Germany">Germany</option>
<option value="Gibraltar">Gibraltar</option>
<option value="Ghana">Ghana</option>
<option value="Greece">Greece</option>
<option value="Grenada">Grenada</option>
<option value="Guatemala">Guatemala</option>
<option value="Guinea">Guinea</option>
<option value="Guinea-Bissau">Guinea-Bissau</option>
<option value="Guyana">Guyana</option>
<option value="Haiti">Haiti</option>
<option value="Honduras">Honduras</option>
<option value="Hungary">Hungary</option>
<option value="Iceland">Iceland</option>
<option value="India">India</option>
<option value="Indonesia">Indonesia</option>
<option value="Iran">Iran</option>
<option value="Iraq">Iraq</option>
<option value="Ireland">Ireland</option>
<option value="Israel">Israel</option>
<option value="Italy">Italy</option>
<option value="Jamaica">Jamaica</option>
<option value="Japan">Japan</option>
<option value="Jordan">Jordan</option>
<option value="Kazakhstan">Kazakhstan</option>
<option value="Kenya">Kenya</option>
<option value="Kiribati">Kiribati</option>
<option value="North Korea">North Korea</option>
<option value="South Korea">South Korea</option>
<option value="Kuwait">Kuwait</option>
<option value="Kyrgyzstan">Kyrgyzstan</option>
<option value="Laos">Laos</option>
<option value="Latvia">Latvia</option>
<option value="Lebanon">Lebanon</option>
<option value="Lesotho">Lesotho</option>
<option value="Liberia">Liberia</option>
<option value="Libya">Libya</option>
<option value="Liechtenstein">Liechtenstein</option>
<option value="Lithuania">Lithuania</option>
<option value="Luxembourg">Luxembourg</option>
<option value="Macedonia">Macedonia</option>
<option value="Madagascar">Madagascar</option>
<option value="Malawi">Malawi</option>
<option value="Malaysia">Malaysia</option>
<option value="Maldives">Maldives</option>
<option value="Mali">Mali</option>
<option value="Malta">Malta</option>
<option value="Marshall Islands">Marshall Islands</option>
<option value="Mauritania">Mauritania</option>
<option value="Mauritius">Mauritius</option>
<option value="Mexico">Mexico</option>
<option value="Micronesia">Micronesia</option>
<option value="Moldova">Moldova</option>
<option value="Monaco">Monaco</option>
<option value="Mongolia">Mongolia</option>
<option value="Montenegro">Montenegro</option>
<option value="Morocco">Morocco</option>
<option value="Mozambique">Mozambique</option>
<option value="Myanmar">Myanmar</option>
<option value="Namibia">Namibia</option>
<option value="Nauru">Nauru</option>
<option value="Nepal">Nepal</option>
<option value="Netherlands">Netherlands</option>
<option value="New Zealand">New Zealand</option>
<option value="Nicaragua">Nicaragua</option>
<option value="Niger">Niger</option>
<option value="Nigeria">Nigeria</option>
<option value="Norway">Norway</option>
<option value="Oman">Oman</option>
<option value="Pakistan">Pakistan</option>
<option value="Palau">Palau</option>
<option value="Panama">Panama</option>
<option value="Papua New Guinea">Papua New Guinea</option>
<option value="Paraguay">Paraguay</option>
<option value="Peru">Peru</option>
<option value="Philippines">Philippines</option>
<option value="Poland">Poland</option>
<option value="Portugal">Portugal</option>
<option value="Qatar">Qatar</option>
<option value="Romania">Romania</option>
<option value="Russia">Russia</option>
<option value="Rwanda">Rwanda</option>
<option value="Saint Kitts and Nevis">Saint Kitts and Nevis</option>
<option value="Saint Lucia">Saint Lucia</option>
<option value="Saint Vincent and the Grenadines">Saint Vincent and the Grenadines</option>
<option value="Samoa">Samoa</option>
<option value="San Marino">San Marino</option>
<option value="Sao Tome and Principe">Sao Tome and Principe</option>
<option value="Saudi Arabia">Saudi Arabia</option>
<option value="Senegal">Senegal</option>
<option value="Serbia">Serbia</option>
<option value="Seychelles">Seychelles</option>
<option value="Sierra Leone">Sierra Leone</option>
<option value="Singapore">Singapore</option>
<option value="Slovakia">Slovakia</option>
<option value="Slovenia">Slovenia</option>
<option value="Solomon Islands">Solomon Islands</option>
<option value="Somalia">Somalia</option>
<option value="South Africa">South Africa</option>
<option value="Spain">Spain</option>
<option value="Sri Lanka">Sri Lanka</option>
<option value="Sudan">Sudan</option>
<option value="Suriname">Suriname</option>
<option value="Swaziland">Swaziland</option>
<option value="Sweden">Sweden</option>
<option value="Switzerland">Switzerland</option>
<option value="Syria">Syria</option>
<option value="Taiwan">Taiwan</option>
<option value="Tajikistan">Tajikistan</option>
<option value="Tanzania">Tanzania</option>
<option value="Thailand">Thailand</option>
<option value="Togo">Togo</option>
<option value="Tonga">Tonga</option>
<option value="Trinidad and Tobago">Trinidad and Tobago</option>
<option value="Tunisia">Tunisia</option>
<option value="Turkey">Turkey</option>
<option value="Turkmenistan">Turkmenistan</option>
<option value="Tuvalu">Tuvalu</option>
<option value="Uganda">Uganda</option>
<option value="Ukraine">Ukraine</option>
<option value="United Arab Emirates">United Arab Emirates</option>
<option value="United Kingdom">United Kingdom</option>
<option value="United States">United States</option>
<option value="Uruguay">Uruguay</option>
<option value="Uzbekistan">Uzbekistan</option>
<option value="Vanuatu">Vanuatu</option>
<option value="Vatican City">Vatican City</option>
<option value="Venezuela">Venezuela</option>
<option value="Vietnam">Vietnam</option>
<option value="Yemen">Yemen</option>
<option value="Zambia">Zambia</option>
<option value="Zimbabwe">Zimbabwe</option>
</select>
<label>Country</label>
</span>
</div>
</li>
<li>
<label class="desc">Website Field</label>
<div>
<input class="field text large" type="url" maxlength="255" value="http://" />
</div>
</li>
<li>
<label class="desc">Email Field</label>
<div>
<input class="field text medium" type="email" maxlength="255" value="" />
</div>
</li>
<li class="complex">
<label class="desc">File Upload Field</label>
<div>
<span class="full">
<input class="field file" type="file" value=""/>
</span>
</div>
</li>
<li class="buttons">
<input id="saveForm" class="btTxt submit" type="submit" value="Submit" onclick="return false" />
</li>
</ul>
</form>
<div class="noI">
<form class="wufoo" action="#" novalidate>
<header id="header" class="info">
<h2>Title</h2>
<div>Description</div>
</header>
<ul>
<li class="section first">
<section>
<h3>Errors</h3>
<div>This section shows error states.</div>
</section>
</li>
<li id="errorLi">
<h3 id="errorMsgLbl">There was a problem with your submission.</h3>
<p id="errorMsg">Errors have been <b>highlighted</b> below.</p>
</li>
<li class="focused error">
<label class="desc">Field Title<span class="req"> * </span></label>
<div>
<textarea rows="10" cols="50" class="field textarea medium">The quick brown fox jumped over the lazy dog.</textarea>
</div>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="error">
<label class="desc">Another Field Title<span class="req"> * </span></label>
<div>
<input class="field text medium" type="text" maxlength="255" value="Example text." />
</div>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="error">
<label class="desc">Another Field Title<span class="req"> * </span></label>
<div>
<input class="field text large" type="text" maxlength="255" value="Example text." />
</div>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="error">
<label class="desc">Another Field Title<span class="req"> * </span></label>
<div>
<input class="field text large" type="text" maxlength="255" placeholder="Example text." />
</div>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="section">
<section>
<h3>Section Title</h3>
<div>Description of another section.</div>
</section>
</li>
<li class="error">
<fieldset>
<legend class="desc">Multiple Choice (default)</legend>
<div class="col">
<span>
<input class="field radio" type="radio" value="Robots" checked="checked" />
<label class="choice">Robots</label>
</span>
<span>
<input class="field radio" type="radio" value="Monkeys"/>
<label class="choice">Monkeys</label>
</span>
<span>
<input class="field radio" type="radio" value="Ninjas"/>
<label class="choice">Ninjas</label>
</span>
</div>
</fieldset>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="twoColumns error">
<fieldset>
<legend class="desc">Multiple Choice (2 cols)</legend>
<div class="col">
<span>
<input class="field radio" type="radio" value="Robots" checked="checked" />
<label class="choice">Robots</label>
</span>
<span>
<input class="field radio" type="radio" value="Monkeys"/>
<label class="choice">Monkeys</label>
</span>
<span>
<input class="field radio" type="radio" value="Ninjas"/>
<label class="choice">Ninjas</label>
</span>
</div>
</fieldset>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="threeColumns error">
<fieldset>
<legend class="desc">Multiple Choice (3 cols)</legend>
<div class="col">
<span>
<input class="field radio" type="radio" value="Robots" checked="checked" />
<label class="choice">Robots</label>
</span>
<span>
<input class="field radio" type="radio" value="Monkeys"/>
<label class="choice">Monkeys</label>
</span>
<span>
<input class="field radio" type="radio" value="Ninjas"/>
<label class="choice">Ninjas</label>
</span>
</div>
</fieldset>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="notStacked error">
<fieldset>
<legend class="desc">Multiple Choice (side by side)</legend>
<div class="col">
<span>
<input class="field radio" type="radio" value="Robots" checked="checked" />
<label class="choice">Robots</label>
</span>
<span>
<input class="field radio" type="radio" value="Monkeys"/>
<label class="choice">Monkeys</label>
</span>
<span>
<input class="field radio" type="radio" value="Ninjas"/>
<label class="choice">Ninjas</label>
</span>
</div>
</fieldset>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="error">
<fieldset>
<legend class="desc">Checkboxes</legend>
<div class="col">
<span>
<input class="field checkbox" type="checkbox" value="Invisibility" checked="checked" />
<label class="choice">Invisibility</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Super Strength"/>
<label class="choice">Super Strength</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Eye Lasers"/>
<label class="choice">Eye Lasers</label>
</span>
</div>
</fieldset>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="twoColumns error">
<fieldset>
<legend class="desc">Checkboxes (2 cols)</legend>
<div class="col">
<span>
<input class="field checkbox" type="checkbox" value="Invisibility" checked="checked" />
<label class="choice">Invisibility</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Super Strength"/>
<label class="choice">Super Strength</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Eye Lasers"/>
<label class="choice">Eye Lasers</label>
</span>
</div>
</fieldset>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="threeColumns error">
<fieldset>
<legend class="desc">Checkboxes (3 cols)</legend>
<div class="col">
<span>
<input class="field checkbox" type="checkbox" value="Invisibility" checked="checked" />
<label class="choice">Invisibility</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Super Strength"/>
<label class="choice">Super Strength</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Eye Lasers"/>
<label class="choice">Eye Lasers</label>
</span>
</div>
</fieldset>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="notStacked error">
<fieldset>
<legend class="desc">Checkboxes (side by side)</legend>
<div class="col">
<span>
<input class="field checkbox" type="checkbox" value="Invisibility" checked="checked" />
<label class="choice">Invisibility</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Super Strength"/>
<label class="choice">Super Strength</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Eye Lasers"/>
<label class="choice">Eye Lasers</label>
</span>
</div>
</fieldset>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="section">
<section>
<h3>Section Title</h3>
<div>Description of another section.</div>
</section>
</li>
<li class="error">
<label class="desc">Name Field</label>
<span>
<input class="field text" size="2" value=""/>
<label>Title</label>
</span>
<span>
<input class="field text" size="8" value=""/>
<label>First</label>
</span>
<span>
<input class="field text" size="14" value=""/>
<label>Last</label>
</span>
<span>
<input class="field text" size="3" value=""/>
<label>Suffix</label>
</span>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="error">
<label class="desc">Date Field</label>
<span>
<input class="field text" size="2" type="text" maxlength="2" value=""/> /
<label>MM</label>
</span>
<span>
<input class="field text" size="2" type="text" maxlength="2" value=""/> /
<label>DD</label>
</span>
<span>
<input class="field text" size="4" type="text" maxlength="4" value=""/>
<label>YYYY</label>
</span>
<img src="http://wufoo.com/images/icons/calendar.png" class="icon" alt="Pick date." id="pickdate111" />
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="error">
<label class="desc">Time Field</label>
<span>
<input class="field text" size="2" type="text" maxlength="2" value=""/> :
<label>HH</label>
</span>
<span>
<input class="field text" size="2" type="text" maxlength="2" value=""/> :
<label>MM</label>
</span>
<span>
<input class="field text" size="2" type="text" maxlength="2" value=""/>
<label>SS</label>
</span>
<span>
<select class="field select" style="width:4em">
<option value="AM">AM</option>
<option value="PM">PM</option>
</select>
<label>AM/PM</label>
</span>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="error">
<label class="desc">Phone Field</label>
<span>
<input class="field text" type="tel" size="3" maxlength="3" value=""/> -
<label>###</label>
</span>
<span>
<input class="field text" type="tel" size="3" maxlength="3" value=""/> -
<label>###</label>
</span>
<span>
<input class="field text" type="tel" size="4" maxlength="4" value=""/>
<label>####</label>
</span>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="error">
<label class="desc">Currency Field</label>
<span>$</span>
<span>
<input class="field text currency nospin" type="number" size="10" value=""/> .
<label>Dollars</label>
</span>
<span>
<input class="field text nospin" size="2" type="number" maxlength="2" value=""/>
<label>Cents</label>
</span>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="complex error">
<label class="desc">Address Field</label>
<div>
<span class="full">
<input class="field text addr" type="text" value="" />
<label>Street Address</label>
</span>
<span class="full">
<input class="field text addr" type="text" value="" />
<label>Address Line 2</label>
</span>
<span class="left">
<input class="field text addr" type="text" value="" />
<label>City</label>
</span>
<span class="right">
<input class="field text addr" type="text" value="" />
<label>State / Province / Region</label>
</span>
<span class="left">
<input class="field text addr" type="text" maxlength="15" value="" />
<label>Postal / Zip Code</label>
</span>
<span class="right">
<select class="field select addr">
<option value="" selected="selected"></option>
<option value="Afghanistan">Afghanistan</option>
<option value="Albania">Albania</option>
<option value="Algeria">Algeria</option>
<option value="Andorra">Andorra</option>
<option value="Antigua and Barbuda">Antigua and Barbuda</option>
<option value="Argentina">Argentina</option>
<option value="Armenia">Armenia</option>
<option value="Australia">Australia</option>
<option value="Austria">Austria</option>
<option value="Azerbaijan">Azerbaijan</option>
<option value="Bahamas">Bahamas</option>
<option value="Bahrain">Bahrain</option>
<option value="Bangladesh">Bangladesh</option>
<option value="Barbados">Barbados</option>
<option value="Belarus">Belarus</option>
<option value="Belgium">Belgium</option>
<option value="Belize">Belize</option>
<option value="Benin">Benin</option>
<option value="Bhutan">Bhutan</option>
<option value="Bolivia">Bolivia</option>
<option value="Bosnia and Herzegovina">Bosnia and Herzegovina</option>
<option value="Botswana">Botswana</option>
<option value="Brazil">Brazil</option>
<option value="Brunei">Brunei</option>
<option value="Bulgaria">Bulgaria</option>
<option value="Burkina Faso">Burkina Faso</option>
<option value="Burundi">Burundi</option>
<option value="Cambodia">Cambodia</option>
<option value="Cameroon">Cameroon</option>
<option value="Canada">Canada</option>
<option value="Cape Verde">Cape Verde</option>
<option value="Central African Republic">Central African Republic</option>
<option value="Chad">Chad</option>
<option value="Chile">Chile</option>
<option value="China">China</option>
<option value="Colombia">Colombia</option>
<option value="Comoros">Comoros</option>
<option value="Congo">Congo</option>
<option value="Costa Rica">Costa Rica</option>
<option value="Côte d'Ivoire">Côte d'Ivoire</option>
<option value="Croatia">Croatia</option>
<option value="Cuba">Cuba</option>
<option value="Cyprus">Cyprus</option>
<option value="Czech Republic">Czech Republic</option>
<option value="Denmark">Denmark</option>
<option value="Djibouti">Djibouti</option>
<option value="Dominica">Dominica</option>
<option value="Dominican Republic">Dominican Republic</option>
<option value="East Timor">East Timor</option>
<option value="Ecuador">Ecuador</option>
<option value="Egypt">Egypt</option>
<option value="El Salvador">El Salvador</option>
<option value="Equatorial Guinea">Equatorial Guinea</option>
<option value="Eritrea">Eritrea</option>
<option value="Estonia">Estonia</option>
<option value="Ethiopia">Ethiopia</option>
<option value="Fiji">Fiji</option>
<option value="Finland">Finland</option>
<option value="France">France</option>
<option value="Gabon">Gabon</option>
<option value="Gambia">Gambia</option>
<option value="Georgia">Georgia</option>
<option value="Germany">Germany</option>
<option value="Gibraltar">Gibraltar</option>
<option value="Ghana">Ghana</option>
<option value="Greece">Greece</option>
<option value="Grenada">Grenada</option>
<option value="Guatemala">Guatemala</option>
<option value="Guinea">Guinea</option>
<option value="Guinea-Bissau">Guinea-Bissau</option>
<option value="Guyana">Guyana</option>
<option value="Haiti">Haiti</option>
<option value="Honduras">Honduras</option>
<option value="Hungary">Hungary</option>
<option value="Iceland">Iceland</option>
<option value="India">India</option>
<option value="Indonesia">Indonesia</option>
<option value="Iran">Iran</option>
<option value="Iraq">Iraq</option>
<option value="Ireland">Ireland</option>
<option value="Israel">Israel</option>
<option value="Italy">Italy</option>
<option value="Jamaica">Jamaica</option>
<option value="Japan">Japan</option>
<option value="Jordan">Jordan</option>
<option value="Kazakhstan">Kazakhstan</option>
<option value="Kenya">Kenya</option>
<option value="Kiribati">Kiribati</option>
<option value="North Korea">North Korea</option>
<option value="South Korea">South Korea</option>
<option value="Kuwait">Kuwait</option>
<option value="Kyrgyzstan">Kyrgyzstan</option>
<option value="Laos">Laos</option>
<option value="Latvia">Latvia</option>
<option value="Lebanon">Lebanon</option>
<option value="Lesotho">Lesotho</option>
<option value="Liberia">Liberia</option>
<option value="Libya">Libya</option>
<option value="Liechtenstein">Liechtenstein</option>
<option value="Lithuania">Lithuania</option>
<option value="Luxembourg">Luxembourg</option>
<option value="Macedonia">Macedonia</option>
<option value="Madagascar">Madagascar</option>
<option value="Malawi">Malawi</option>
<option value="Malaysia">Malaysia</option>
<option value="Maldives">Maldives</option>
<option value="Mali">Mali</option>
<option value="Malta">Malta</option>
<option value="Marshall Islands">Marshall Islands</option>
<option value="Mauritania">Mauritania</option>
<option value="Mauritius">Mauritius</option>
<option value="Mexico">Mexico</option>
<option value="Micronesia">Micronesia</option>
<option value="Moldova">Moldova</option>
<option value="Monaco">Monaco</option>
<option value="Mongolia">Mongolia</option>
<option value="Montenegro">Montenegro</option>
<option value="Morocco">Morocco</option>
<option value="Mozambique">Mozambique</option>
<option value="Myanmar">Myanmar</option>
<option value="Namibia">Namibia</option>
<option value="Nauru">Nauru</option>
<option value="Nepal">Nepal</option>
<option value="Netherlands">Netherlands</option>
<option value="New Zealand">New Zealand</option>
<option value="Nicaragua">Nicaragua</option>
<option value="Niger">Niger</option>
<option value="Nigeria">Nigeria</option>
<option value="Norway">Norway</option>
<option value="Oman">Oman</option>
<option value="Pakistan">Pakistan</option>
<option value="Palau">Palau</option>
<option value="Panama">Panama</option>
<option value="Papua New Guinea">Papua New Guinea</option>
<option value="Paraguay">Paraguay</option>
<option value="Peru">Peru</option>
<option value="Philippines">Philippines</option>
<option value="Poland">Poland</option>
<option value="Portugal">Portugal</option>
<option value="Qatar">Qatar</option>
<option value="Romania">Romania</option>
<option value="Russia">Russia</option>
<option value="Rwanda">Rwanda</option>
<option value="Saint Kitts and Nevis">Saint Kitts and Nevis</option>
<option value="Saint Lucia">Saint Lucia</option>
<option value="Saint Vincent and the Grenadines">Saint Vincent and the Grenadines</option>
<option value="Samoa">Samoa</option>
<option value="San Marino">San Marino</option>
<option value="Sao Tome and Principe">Sao Tome and Principe</option>
<option value="Saudi Arabia">Saudi Arabia</option>
<option value="Senegal">Senegal</option>
<option value="Serbia">Serbia</option>
<option value="Seychelles">Seychelles</option>
<option value="Sierra Leone">Sierra Leone</option>
<option value="Singapore">Singapore</option>
<option value="Slovakia">Slovakia</option>
<option value="Slovenia">Slovenia</option>
<option value="Solomon Islands">Solomon Islands</option>
<option value="Somalia">Somalia</option>
<option value="South Africa">South Africa</option>
<option value="Spain">Spain</option>
<option value="Sri Lanka">Sri Lanka</option>
<option value="Sudan">Sudan</option>
<option value="Suriname">Suriname</option>
<option value="Swaziland">Swaziland</option>
<option value="Sweden">Sweden</option>
<option value="Switzerland">Switzerland</option>
<option value="Syria">Syria</option>
<option value="Taiwan">Taiwan</option>
<option value="Tajikistan">Tajikistan</option>
<option value="Tanzania">Tanzania</option>
<option value="Thailand">Thailand</option>
<option value="Togo">Togo</option>
<option value="Tonga">Tonga</option>
<option value="Trinidad and Tobago">Trinidad and Tobago</option>
<option value="Tunisia">Tunisia</option>
<option value="Turkey">Turkey</option>
<option value="Turkmenistan">Turkmenistan</option>
<option value="Tuvalu">Tuvalu</option>
<option value="Uganda">Uganda</option>
<option value="Ukraine">Ukraine</option>
<option value="United Arab Emirates">United Arab Emirates</option>
<option value="United Kingdom">United Kingdom</option>
<option value="United States">United States</option>
<option value="Uruguay">Uruguay</option>
<option value="Uzbekistan">Uzbekistan</option>
<option value="Vanuatu">Vanuatu</option>
<option value="Vatican City">Vatican City</option>
<option value="Venezuela">Venezuela</option>
<option value="Vietnam">Vietnam</option>
<option value="Yemen">Yemen</option>
<option value="Zambia">Zambia</option>
<option value="Zimbabwe">Zimbabwe</option>
</select>
<label>Country</label>
</span>
</div>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="error">
<label class="desc">Website Field</label>
<div>
<input class="field text large" type="url" maxlength="255" value="http://" />
</div>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="error">
<label class="desc">Email Field</label>
<div>
<input class="field text medium" type="email" maxlength="255" value="" />
</div>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="complex error">
<label class="desc">File Upload Field</label>
<div>
<span class="full">
<input class="field file" type="file" value=""/>
</span>
</div>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="buttons">
<input id="saveForm" class="btTxt submit" type="submit" value="Submit" onclick="return false" />
</li>
</ul>
</form>
</div>
</div>
<!--container-->
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>
Wufoo · Theme Kit
</title>
<!--
Hey friend! Don't edit this file!
It shows you how your custom CSS
will affect Wufoo form markup.
Check out the README.txt for more info.
-->
<!-- Meta Tags -->
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- CSS -->
<link rel="stylesheet" href="//www.wufoo.com/stylesheets/public/forms/css/index.css" type="text/css" />
<!-- for some reason when you add a custom theme wufoo like to add the following to really annoy you -->
<link href="https://derbyuni.wufoo.com/css/custom/17/theme.css" rel="stylesheet">
<link rel="stylesheet" href="{{ '/styles/app.css' | path }}" type="text/css" />
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body id="public">
<div id="container">
<h1 id="logo"><a>Wufoo</a></h1>
<form class="wufoo" action="#" novalidate>
<header id="header" class="info">
<h2>Title</h2>
<div>Description</div>
</header>
<ul>
<li class="section first">
<section>
<h3>Section Title</h3>
<div>Description of the section.</div>
</section>
</li>
<li class="focused">
<label class="desc">Field Title<span class="req"> * </span></label>
<div>
<textarea rows="10" cols="50" class="field textarea medium">The quick brown fox jumped over the lazy dog.</textarea>
</div>
<p class="instruct"><small>
Instructions for the user. Robots are typically used to do the tasks that are too dirty, dangerous, difficult, repetitive or dull for humans.
<br /><br />Chris is Wufoo's robot.
</small></p>
</li>
<li>
<label class="desc">Another Field Title<span class="req"> * </span></label>
<div>
<input class="field text medium" type="text" maxlength="255" value="Example text."/>
</div>
</li>
<li>
<label class="desc">Another Field Title<span class="req"> * </span></label>
<div>
<input class="field text large" type="text" maxlength="255" value="Example text."/>
</div>
</li>
<li>
<label class="desc">Another Field Title<span class="req"> * </span></label>
<div>
<input class="field text large" type="text" maxlength="255" placeholder="Example text."/>
</div>
</li>
<li class="section">
<section>
<h3>Section Title</h3>
<div>Description of another section.</div>
</section>
</li>
<li>
<fieldset>
<legend class="desc">Multiple Choice (default)</legend>
<div class="col">
<span>
<input class="field radio" type="radio" value="Robots" checked="checked" />
<label class="choice">Robots</label>
</span>
<span>
<input class="field radio" type="radio" value="Monkeys"/>
<label class="choice">Monkeys</label>
</span>
<span>
<input class="field radio" type="radio" value="Ninjas"/>
<label class="choice">Ninjas</label>
</span>
</div>
</fieldset>
</li>
<li class="twoColumns">
<fieldset>
<legend class="desc">Multiple Choice (2 cols)</legend>
<div class="col">
<span>
<input class="field radio" type="radio" value="Robots" checked="checked" />
<label class="choice">Robots</label>
</span>
<span>
<input class="field radio" type="radio" value="Monkeys"/>
<label class="choice">Monkeys</label>
</span>
<span>
<input class="field radio" type="radio" value="Ninjas"/>
<label class="choice">Ninjas</label>
</span>
</div>
</fieldset>
</li>
<li class="threeColumns">
<fieldset>
<legend class="desc">Multiple Choice (3 cols)</legend>
<div class="col">
<span>
<input class="field radio" type="radio" value="Robots" checked="checked" />
<label class="choice">Robots</label>
</span>
<span>
<input class="field radio" type="radio" value="Monkeys"/>
<label class="choice">Monkeys</label>
</span>
<span>
<input class="field radio" type="radio" value="Ninjas"/>
<label class="choice">Ninjas</label>
</span>
</div>
</fieldset>
</li>
<li class="notStacked">
<fieldset>
<legend class="desc">Multiple Choice (side by side)</legend>
<div class="col">
<span>
<input class="field radio" type="radio" value="Robots" checked="checked" />
<label class="choice">Robots</label>
</span>
<span>
<input class="field radio" type="radio" value="Monkeys"/>
<label class="choice">Monkeys</label>
</span>
<span>
<input class="field radio" type="radio" value="Ninjas"/>
<label class="choice">Ninjas</label>
</span>
</div>
</fieldset>
</li>
<li>
<fieldset>
<legend class="desc">Checkboxes</legend>
<div class="col">
<span>
<input class="field checkbox" type="checkbox" value="Invisibility" checked="checked" />
<label class="choice">Invisibility</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Super Strength"/>
<label class="choice">Super Strength</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Eye Lasers"/>
<label class="choice">Eye Lasers</label>
</span>
</div>
</fieldset>
</li>
<li class="twoColumns">
<fieldset>
<legend class="desc">Checkboxes (2 cols)</legend>
<div class="col">
<span>
<input class="field checkbox" type="checkbox" value="Invisibility" checked="checked" />
<label class="choice">Invisibility</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Super Strength"/>
<label class="choice">Super Strength</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Eye Lasers"/>
<label class="choice">Eye Lasers</label>
</span>
</div>
</fieldset>
</li>
<li class="threeColumns">
<fieldset>
<legend class="desc">Checkboxes (3 cols)</legend>
<div class="col">
<span>
<input class="field checkbox" type="checkbox" value="Invisibility" checked="checked" />
<label class="choice">Invisibility</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Super Strength"/>
<label class="choice">Super Strength</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Eye Lasers"/>
<label class="choice">Eye Lasers</label>
</span>
</div>
</fieldset>
</li>
<li class="notStacked">
<fieldset>
<legend class="desc">Checkboxes (side by side)</legend>
<div class="col">
<span>
<input class="field checkbox" type="checkbox" value="Invisibility" checked="checked" />
<label class="choice">Invisibility</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Super Strength"/>
<label class="choice">Super Strength</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Eye Lasers"/>
<label class="choice">Eye Lasers</label>
</span>
</div>
</fieldset>
</li>
<li class="section">
<section>
<h3>Section Title</h3>
<div>Description of another section.</div>
</section>
</li>
<li>
<label class="desc">Name Field</label>
<span>
<input class="field text" size="2" value=""/>
<label>Title</label>
</span>
<span>
<input class="field text" size="8" value=""/>
<label>First</label>
</span>
<span>
<input class="field text" size="14" value=""/>
<label>Last</label>
</span>
<span>
<input class="field text" size="3" value=""/>
<label>Suffix</label>
</span>
</li>
<li>
<label class="desc">Date Field</label>
<span>
<input class="field text" size="2" type="text" maxlength="2" value=""/> /
<label>MM</label>
</span>
<span>
<input class="field text" size="2" type="text" maxlength="2" value=""/> /
<label>DD</label>
</span>
<span>
<input class="field text" size="4" type="text" maxlength="4" value=""/>
<label>YYYY</label>
</span>
<img src="http://wufoo.com/images/icons/calendar.png" class="icon" alt="Pick date." id="pickdate111" />
</li>
<li>
<label class="desc">Time Field</label>
<span>
<input class="field text" size="2" type="text" maxlength="2" value=""/> :
<label>HH</label>
</span>
<span>
<input class="field text" size="2" type="text" maxlength="2" value=""/> :
<label>MM</label>
</span>
<span>
<input class="field text" size="2" type="text" maxlength="2" value=""/>
<label>SS</label>
</span>
<span>
<select class="field select" style="width:4em">
<option value="AM">AM</option>
<option value="PM">PM</option>
</select>
<label>AM/PM</label>
</span>
</li>
<li>
<label class="desc">Phone Field</label>
<span>
<input class="field text" type="tel" size="3" maxlength="3" value=""/> -
<label>###</label>
</span>
<span>
<input class="field text" type="tel" size="3" maxlength="3" value=""/> -
<label>###</label>
</span>
<span>
<input class="field text" type="tel" size="4" maxlength="4" value=""/>
<label>####</label>
</span>
</li>
<li>
<label class="desc">Currency Field</label>
<span>$</span>
<span>
<input class="field text currency nospin" type="number" size="10" value=""/> .
<label>Dollars</label>
</span>
<span>
<input class="field text nospin" size="2" type="number" maxlength="2" value=""/>
<label>Cents</label>
</span>
</li>
<li class="complex">
<label class="desc">Address Field</label>
<div>
<span class="full">
<input class="field text addr" type="text" value="" />
<label>Street Address</label>
</span>
<span class="full">
<input class="field text addr" type="text" value="" />
<label>Address Line 2</label>
</span>
<span class="left">
<input class="field text addr" type="text" value="" />
<label>City</label>
</span>
<span class="right">
<input class="field text addr" type="text" value="" />
<label>State / Province / Region</label>
</span>
<span class="left">
<input class="field text addr" type="text" maxlength="15" value="" />
<label>Postal / Zip Code</label>
</span>
<span class="right">
<select class="field select addr">
<option value="" selected="selected"></option>
<option value="Afghanistan">Afghanistan</option>
<option value="Albania">Albania</option>
<option value="Algeria">Algeria</option>
<option value="Andorra">Andorra</option>
<option value="Antigua and Barbuda">Antigua and Barbuda</option>
<option value="Argentina">Argentina</option>
<option value="Armenia">Armenia</option>
<option value="Australia">Australia</option>
<option value="Austria">Austria</option>
<option value="Azerbaijan">Azerbaijan</option>
<option value="Bahamas">Bahamas</option>
<option value="Bahrain">Bahrain</option>
<option value="Bangladesh">Bangladesh</option>
<option value="Barbados">Barbados</option>
<option value="Belarus">Belarus</option>
<option value="Belgium">Belgium</option>
<option value="Belize">Belize</option>
<option value="Benin">Benin</option>
<option value="Bhutan">Bhutan</option>
<option value="Bolivia">Bolivia</option>
<option value="Bosnia and Herzegovina">Bosnia and Herzegovina</option>
<option value="Botswana">Botswana</option>
<option value="Brazil">Brazil</option>
<option value="Brunei">Brunei</option>
<option value="Bulgaria">Bulgaria</option>
<option value="Burkina Faso">Burkina Faso</option>
<option value="Burundi">Burundi</option>
<option value="Cambodia">Cambodia</option>
<option value="Cameroon">Cameroon</option>
<option value="Canada">Canada</option>
<option value="Cape Verde">Cape Verde</option>
<option value="Central African Republic">Central African Republic</option>
<option value="Chad">Chad</option>
<option value="Chile">Chile</option>
<option value="China">China</option>
<option value="Colombia">Colombia</option>
<option value="Comoros">Comoros</option>
<option value="Congo">Congo</option>
<option value="Costa Rica">Costa Rica</option>
<option value="Côte d'Ivoire">Côte d'Ivoire</option>
<option value="Croatia">Croatia</option>
<option value="Cuba">Cuba</option>
<option value="Cyprus">Cyprus</option>
<option value="Czech Republic">Czech Republic</option>
<option value="Denmark">Denmark</option>
<option value="Djibouti">Djibouti</option>
<option value="Dominica">Dominica</option>
<option value="Dominican Republic">Dominican Republic</option>
<option value="East Timor">East Timor</option>
<option value="Ecuador">Ecuador</option>
<option value="Egypt">Egypt</option>
<option value="El Salvador">El Salvador</option>
<option value="Equatorial Guinea">Equatorial Guinea</option>
<option value="Eritrea">Eritrea</option>
<option value="Estonia">Estonia</option>
<option value="Ethiopia">Ethiopia</option>
<option value="Fiji">Fiji</option>
<option value="Finland">Finland</option>
<option value="France">France</option>
<option value="Gabon">Gabon</option>
<option value="Gambia">Gambia</option>
<option value="Georgia">Georgia</option>
<option value="Germany">Germany</option>
<option value="Gibraltar">Gibraltar</option>
<option value="Ghana">Ghana</option>
<option value="Greece">Greece</option>
<option value="Grenada">Grenada</option>
<option value="Guatemala">Guatemala</option>
<option value="Guinea">Guinea</option>
<option value="Guinea-Bissau">Guinea-Bissau</option>
<option value="Guyana">Guyana</option>
<option value="Haiti">Haiti</option>
<option value="Honduras">Honduras</option>
<option value="Hungary">Hungary</option>
<option value="Iceland">Iceland</option>
<option value="India">India</option>
<option value="Indonesia">Indonesia</option>
<option value="Iran">Iran</option>
<option value="Iraq">Iraq</option>
<option value="Ireland">Ireland</option>
<option value="Israel">Israel</option>
<option value="Italy">Italy</option>
<option value="Jamaica">Jamaica</option>
<option value="Japan">Japan</option>
<option value="Jordan">Jordan</option>
<option value="Kazakhstan">Kazakhstan</option>
<option value="Kenya">Kenya</option>
<option value="Kiribati">Kiribati</option>
<option value="North Korea">North Korea</option>
<option value="South Korea">South Korea</option>
<option value="Kuwait">Kuwait</option>
<option value="Kyrgyzstan">Kyrgyzstan</option>
<option value="Laos">Laos</option>
<option value="Latvia">Latvia</option>
<option value="Lebanon">Lebanon</option>
<option value="Lesotho">Lesotho</option>
<option value="Liberia">Liberia</option>
<option value="Libya">Libya</option>
<option value="Liechtenstein">Liechtenstein</option>
<option value="Lithuania">Lithuania</option>
<option value="Luxembourg">Luxembourg</option>
<option value="Macedonia">Macedonia</option>
<option value="Madagascar">Madagascar</option>
<option value="Malawi">Malawi</option>
<option value="Malaysia">Malaysia</option>
<option value="Maldives">Maldives</option>
<option value="Mali">Mali</option>
<option value="Malta">Malta</option>
<option value="Marshall Islands">Marshall Islands</option>
<option value="Mauritania">Mauritania</option>
<option value="Mauritius">Mauritius</option>
<option value="Mexico">Mexico</option>
<option value="Micronesia">Micronesia</option>
<option value="Moldova">Moldova</option>
<option value="Monaco">Monaco</option>
<option value="Mongolia">Mongolia</option>
<option value="Montenegro">Montenegro</option>
<option value="Morocco">Morocco</option>
<option value="Mozambique">Mozambique</option>
<option value="Myanmar">Myanmar</option>
<option value="Namibia">Namibia</option>
<option value="Nauru">Nauru</option>
<option value="Nepal">Nepal</option>
<option value="Netherlands">Netherlands</option>
<option value="New Zealand">New Zealand</option>
<option value="Nicaragua">Nicaragua</option>
<option value="Niger">Niger</option>
<option value="Nigeria">Nigeria</option>
<option value="Norway">Norway</option>
<option value="Oman">Oman</option>
<option value="Pakistan">Pakistan</option>
<option value="Palau">Palau</option>
<option value="Panama">Panama</option>
<option value="Papua New Guinea">Papua New Guinea</option>
<option value="Paraguay">Paraguay</option>
<option value="Peru">Peru</option>
<option value="Philippines">Philippines</option>
<option value="Poland">Poland</option>
<option value="Portugal">Portugal</option>
<option value="Qatar">Qatar</option>
<option value="Romania">Romania</option>
<option value="Russia">Russia</option>
<option value="Rwanda">Rwanda</option>
<option value="Saint Kitts and Nevis">Saint Kitts and Nevis</option>
<option value="Saint Lucia">Saint Lucia</option>
<option value="Saint Vincent and the Grenadines">Saint Vincent and the Grenadines</option>
<option value="Samoa">Samoa</option>
<option value="San Marino">San Marino</option>
<option value="Sao Tome and Principe">Sao Tome and Principe</option>
<option value="Saudi Arabia">Saudi Arabia</option>
<option value="Senegal">Senegal</option>
<option value="Serbia">Serbia</option>
<option value="Seychelles">Seychelles</option>
<option value="Sierra Leone">Sierra Leone</option>
<option value="Singapore">Singapore</option>
<option value="Slovakia">Slovakia</option>
<option value="Slovenia">Slovenia</option>
<option value="Solomon Islands">Solomon Islands</option>
<option value="Somalia">Somalia</option>
<option value="South Africa">South Africa</option>
<option value="Spain">Spain</option>
<option value="Sri Lanka">Sri Lanka</option>
<option value="Sudan">Sudan</option>
<option value="Suriname">Suriname</option>
<option value="Swaziland">Swaziland</option>
<option value="Sweden">Sweden</option>
<option value="Switzerland">Switzerland</option>
<option value="Syria">Syria</option>
<option value="Taiwan">Taiwan</option>
<option value="Tajikistan">Tajikistan</option>
<option value="Tanzania">Tanzania</option>
<option value="Thailand">Thailand</option>
<option value="Togo">Togo</option>
<option value="Tonga">Tonga</option>
<option value="Trinidad and Tobago">Trinidad and Tobago</option>
<option value="Tunisia">Tunisia</option>
<option value="Turkey">Turkey</option>
<option value="Turkmenistan">Turkmenistan</option>
<option value="Tuvalu">Tuvalu</option>
<option value="Uganda">Uganda</option>
<option value="Ukraine">Ukraine</option>
<option value="United Arab Emirates">United Arab Emirates</option>
<option value="United Kingdom">United Kingdom</option>
<option value="United States">United States</option>
<option value="Uruguay">Uruguay</option>
<option value="Uzbekistan">Uzbekistan</option>
<option value="Vanuatu">Vanuatu</option>
<option value="Vatican City">Vatican City</option>
<option value="Venezuela">Venezuela</option>
<option value="Vietnam">Vietnam</option>
<option value="Yemen">Yemen</option>
<option value="Zambia">Zambia</option>
<option value="Zimbabwe">Zimbabwe</option>
</select>
<label>Country</label>
</span>
</div>
</li>
<li>
<label class="desc">Website Field</label>
<div>
<input class="field text large" type="url" maxlength="255" value="http://"/>
</div>
</li>
<li>
<label class="desc">Email Field</label>
<div>
<input class="field text medium" type="email" maxlength="255" value=""/>
</div>
</li>
<li class="complex">
<label class="desc">File Upload Field</label>
<div>
<span class="full">
<input class="field file" type="file" value=""/>
</span>
</div>
</li>
<li class="buttons">
<input id="saveForm" class="btTxt submit" type="submit" value="Submit" onclick="return false" />
</li>
</ul>
</form>
<div class="noI">
<form class="wufoo" action="#" novalidate>
<header id="header" class="info">
<h2>Title</h2>
<div>Description</div>
</header>
<ul>
<li class="section first">
<section>
<h3>Errors</h3>
<div>This section shows error states.</div>
</section>
</li>
<li id="errorLi">
<h3 id="errorMsgLbl">There was a problem with your submission.</h3>
<p id="errorMsg">Errors have been <b>highlighted</b> below.</p>
</li>
<li class="focused error">
<label class="desc">Field Title<span class="req"> * </span></label>
<div>
<textarea rows="10" cols="50" class="field textarea medium">The quick brown fox jumped over the lazy dog.</textarea>
</div>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="error">
<label class="desc">Another Field Title<span class="req"> * </span></label>
<div>
<input class="field text medium" type="text" maxlength="255" value="Example text."/>
</div>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="error">
<label class="desc">Another Field Title<span class="req"> * </span></label>
<div>
<input class="field text large" type="text" maxlength="255" value="Example text."/>
</div>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="error">
<label class="desc">Another Field Title<span class="req"> * </span></label>
<div>
<input class="field text large" type="text" maxlength="255" placeholder="Example text."/>
</div>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="section">
<section>
<h3>Section Title</h3>
<div>Description of another section.</div>
</section>
</li>
<li class="error">
<fieldset>
<legend class="desc">Multiple Choice (default)</legend>
<div class="col">
<span>
<input class="field radio" type="radio" value="Robots" checked="checked" />
<label class="choice">Robots</label>
</span>
<span>
<input class="field radio" type="radio" value="Monkeys"/>
<label class="choice">Monkeys</label>
</span>
<span>
<input class="field radio" type="radio" value="Ninjas"/>
<label class="choice">Ninjas</label>
</span>
</div>
</fieldset>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="twoColumns error">
<fieldset>
<legend class="desc">Multiple Choice (2 cols)</legend>
<div class="col">
<span>
<input class="field radio" type="radio" value="Robots" checked="checked" />
<label class="choice">Robots</label>
</span>
<span>
<input class="field radio" type="radio" value="Monkeys"/>
<label class="choice">Monkeys</label>
</span>
<span>
<input class="field radio" type="radio" value="Ninjas"/>
<label class="choice">Ninjas</label>
</span>
</div>
</fieldset>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="threeColumns error">
<fieldset>
<legend class="desc">Multiple Choice (3 cols)</legend>
<div class="col">
<span>
<input class="field radio" type="radio" value="Robots" checked="checked" />
<label class="choice">Robots</label>
</span>
<span>
<input class="field radio" type="radio" value="Monkeys"/>
<label class="choice">Monkeys</label>
</span>
<span>
<input class="field radio" type="radio" value="Ninjas"/>
<label class="choice">Ninjas</label>
</span>
</div>
</fieldset>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="notStacked error">
<fieldset>
<legend class="desc">Multiple Choice (side by side)</legend>
<div class="col">
<span>
<input class="field radio" type="radio" value="Robots" checked="checked" />
<label class="choice">Robots</label>
</span>
<span>
<input class="field radio" type="radio" value="Monkeys"/>
<label class="choice">Monkeys</label>
</span>
<span>
<input class="field radio" type="radio" value="Ninjas"/>
<label class="choice">Ninjas</label>
</span>
</div>
</fieldset>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="error">
<fieldset>
<legend class="desc">Checkboxes</legend>
<div class="col">
<span>
<input class="field checkbox" type="checkbox" value="Invisibility" checked="checked" />
<label class="choice">Invisibility</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Super Strength"/>
<label class="choice">Super Strength</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Eye Lasers"/>
<label class="choice">Eye Lasers</label>
</span>
</div>
</fieldset>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="twoColumns error">
<fieldset>
<legend class="desc">Checkboxes (2 cols)</legend>
<div class="col">
<span>
<input class="field checkbox" type="checkbox" value="Invisibility" checked="checked" />
<label class="choice">Invisibility</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Super Strength"/>
<label class="choice">Super Strength</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Eye Lasers"/>
<label class="choice">Eye Lasers</label>
</span>
</div>
</fieldset>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="threeColumns error">
<fieldset>
<legend class="desc">Checkboxes (3 cols)</legend>
<div class="col">
<span>
<input class="field checkbox" type="checkbox" value="Invisibility" checked="checked" />
<label class="choice">Invisibility</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Super Strength"/>
<label class="choice">Super Strength</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Eye Lasers"/>
<label class="choice">Eye Lasers</label>
</span>
</div>
</fieldset>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="notStacked error">
<fieldset>
<legend class="desc">Checkboxes (side by side)</legend>
<div class="col">
<span>
<input class="field checkbox" type="checkbox" value="Invisibility" checked="checked" />
<label class="choice">Invisibility</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Super Strength"/>
<label class="choice">Super Strength</label>
</span>
<span>
<input class="field checkbox" type="checkbox" value="Eye Lasers"/>
<label class="choice">Eye Lasers</label>
</span>
</div>
</fieldset>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="section">
<section>
<h3>Section Title</h3>
<div>Description of another section.</div>
</section>
</li>
<li class="error">
<label class="desc">Name Field</label>
<span>
<input class="field text" size="2" value=""/>
<label>Title</label>
</span>
<span>
<input class="field text" size="8" value=""/>
<label>First</label>
</span>
<span>
<input class="field text" size="14" value=""/>
<label>Last</label>
</span>
<span>
<input class="field text" size="3" value=""/>
<label>Suffix</label>
</span>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="error">
<label class="desc">Date Field</label>
<span>
<input class="field text" size="2" type="text" maxlength="2" value=""/> /
<label>MM</label>
</span>
<span>
<input class="field text" size="2" type="text" maxlength="2" value=""/> /
<label>DD</label>
</span>
<span>
<input class="field text" size="4" type="text" maxlength="4" value=""/>
<label>YYYY</label>
</span>
<img src="http://wufoo.com/images/icons/calendar.png" class="icon" alt="Pick date." id="pickdate111" />
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="error">
<label class="desc">Time Field</label>
<span>
<input class="field text" size="2" type="text" maxlength="2" value=""/> :
<label>HH</label>
</span>
<span>
<input class="field text" size="2" type="text" maxlength="2" value=""/> :
<label>MM</label>
</span>
<span>
<input class="field text" size="2" type="text" maxlength="2" value=""/>
<label>SS</label>
</span>
<span>
<select class="field select" style="width:4em">
<option value="AM">AM</option>
<option value="PM">PM</option>
</select>
<label>AM/PM</label>
</span>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="error">
<label class="desc">Phone Field</label>
<span>
<input class="field text" type="tel" size="3" maxlength="3" value=""/> -
<label>###</label>
</span>
<span>
<input class="field text" type="tel" size="3" maxlength="3" value=""/> -
<label>###</label>
</span>
<span>
<input class="field text" type="tel" size="4" maxlength="4" value=""/>
<label>####</label>
</span>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="error">
<label class="desc">Currency Field</label>
<span>$</span>
<span>
<input class="field text currency nospin" type="number" size="10" value=""/> .
<label>Dollars</label>
</span>
<span>
<input class="field text nospin" size="2" type="number" maxlength="2" value=""/>
<label>Cents</label>
</span>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="complex error">
<label class="desc">Address Field</label>
<div>
<span class="full">
<input class="field text addr" type="text" value="" />
<label>Street Address</label>
</span>
<span class="full">
<input class="field text addr" type="text" value="" />
<label>Address Line 2</label>
</span>
<span class="left">
<input class="field text addr" type="text" value="" />
<label>City</label>
</span>
<span class="right">
<input class="field text addr" type="text" value="" />
<label>State / Province / Region</label>
</span>
<span class="left">
<input class="field text addr" type="text" maxlength="15" value="" />
<label>Postal / Zip Code</label>
</span>
<span class="right">
<select class="field select addr">
<option value="" selected="selected"></option>
<option value="Afghanistan">Afghanistan</option>
<option value="Albania">Albania</option>
<option value="Algeria">Algeria</option>
<option value="Andorra">Andorra</option>
<option value="Antigua and Barbuda">Antigua and Barbuda</option>
<option value="Argentina">Argentina</option>
<option value="Armenia">Armenia</option>
<option value="Australia">Australia</option>
<option value="Austria">Austria</option>
<option value="Azerbaijan">Azerbaijan</option>
<option value="Bahamas">Bahamas</option>
<option value="Bahrain">Bahrain</option>
<option value="Bangladesh">Bangladesh</option>
<option value="Barbados">Barbados</option>
<option value="Belarus">Belarus</option>
<option value="Belgium">Belgium</option>
<option value="Belize">Belize</option>
<option value="Benin">Benin</option>
<option value="Bhutan">Bhutan</option>
<option value="Bolivia">Bolivia</option>
<option value="Bosnia and Herzegovina">Bosnia and Herzegovina</option>
<option value="Botswana">Botswana</option>
<option value="Brazil">Brazil</option>
<option value="Brunei">Brunei</option>
<option value="Bulgaria">Bulgaria</option>
<option value="Burkina Faso">Burkina Faso</option>
<option value="Burundi">Burundi</option>
<option value="Cambodia">Cambodia</option>
<option value="Cameroon">Cameroon</option>
<option value="Canada">Canada</option>
<option value="Cape Verde">Cape Verde</option>
<option value="Central African Republic">Central African Republic</option>
<option value="Chad">Chad</option>
<option value="Chile">Chile</option>
<option value="China">China</option>
<option value="Colombia">Colombia</option>
<option value="Comoros">Comoros</option>
<option value="Congo">Congo</option>
<option value="Costa Rica">Costa Rica</option>
<option value="Côte d'Ivoire">Côte d'Ivoire</option>
<option value="Croatia">Croatia</option>
<option value="Cuba">Cuba</option>
<option value="Cyprus">Cyprus</option>
<option value="Czech Republic">Czech Republic</option>
<option value="Denmark">Denmark</option>
<option value="Djibouti">Djibouti</option>
<option value="Dominica">Dominica</option>
<option value="Dominican Republic">Dominican Republic</option>
<option value="East Timor">East Timor</option>
<option value="Ecuador">Ecuador</option>
<option value="Egypt">Egypt</option>
<option value="El Salvador">El Salvador</option>
<option value="Equatorial Guinea">Equatorial Guinea</option>
<option value="Eritrea">Eritrea</option>
<option value="Estonia">Estonia</option>
<option value="Ethiopia">Ethiopia</option>
<option value="Fiji">Fiji</option>
<option value="Finland">Finland</option>
<option value="France">France</option>
<option value="Gabon">Gabon</option>
<option value="Gambia">Gambia</option>
<option value="Georgia">Georgia</option>
<option value="Germany">Germany</option>
<option value="Gibraltar">Gibraltar</option>
<option value="Ghana">Ghana</option>
<option value="Greece">Greece</option>
<option value="Grenada">Grenada</option>
<option value="Guatemala">Guatemala</option>
<option value="Guinea">Guinea</option>
<option value="Guinea-Bissau">Guinea-Bissau</option>
<option value="Guyana">Guyana</option>
<option value="Haiti">Haiti</option>
<option value="Honduras">Honduras</option>
<option value="Hungary">Hungary</option>
<option value="Iceland">Iceland</option>
<option value="India">India</option>
<option value="Indonesia">Indonesia</option>
<option value="Iran">Iran</option>
<option value="Iraq">Iraq</option>
<option value="Ireland">Ireland</option>
<option value="Israel">Israel</option>
<option value="Italy">Italy</option>
<option value="Jamaica">Jamaica</option>
<option value="Japan">Japan</option>
<option value="Jordan">Jordan</option>
<option value="Kazakhstan">Kazakhstan</option>
<option value="Kenya">Kenya</option>
<option value="Kiribati">Kiribati</option>
<option value="North Korea">North Korea</option>
<option value="South Korea">South Korea</option>
<option value="Kuwait">Kuwait</option>
<option value="Kyrgyzstan">Kyrgyzstan</option>
<option value="Laos">Laos</option>
<option value="Latvia">Latvia</option>
<option value="Lebanon">Lebanon</option>
<option value="Lesotho">Lesotho</option>
<option value="Liberia">Liberia</option>
<option value="Libya">Libya</option>
<option value="Liechtenstein">Liechtenstein</option>
<option value="Lithuania">Lithuania</option>
<option value="Luxembourg">Luxembourg</option>
<option value="Macedonia">Macedonia</option>
<option value="Madagascar">Madagascar</option>
<option value="Malawi">Malawi</option>
<option value="Malaysia">Malaysia</option>
<option value="Maldives">Maldives</option>
<option value="Mali">Mali</option>
<option value="Malta">Malta</option>
<option value="Marshall Islands">Marshall Islands</option>
<option value="Mauritania">Mauritania</option>
<option value="Mauritius">Mauritius</option>
<option value="Mexico">Mexico</option>
<option value="Micronesia">Micronesia</option>
<option value="Moldova">Moldova</option>
<option value="Monaco">Monaco</option>
<option value="Mongolia">Mongolia</option>
<option value="Montenegro">Montenegro</option>
<option value="Morocco">Morocco</option>
<option value="Mozambique">Mozambique</option>
<option value="Myanmar">Myanmar</option>
<option value="Namibia">Namibia</option>
<option value="Nauru">Nauru</option>
<option value="Nepal">Nepal</option>
<option value="Netherlands">Netherlands</option>
<option value="New Zealand">New Zealand</option>
<option value="Nicaragua">Nicaragua</option>
<option value="Niger">Niger</option>
<option value="Nigeria">Nigeria</option>
<option value="Norway">Norway</option>
<option value="Oman">Oman</option>
<option value="Pakistan">Pakistan</option>
<option value="Palau">Palau</option>
<option value="Panama">Panama</option>
<option value="Papua New Guinea">Papua New Guinea</option>
<option value="Paraguay">Paraguay</option>
<option value="Peru">Peru</option>
<option value="Philippines">Philippines</option>
<option value="Poland">Poland</option>
<option value="Portugal">Portugal</option>
<option value="Qatar">Qatar</option>
<option value="Romania">Romania</option>
<option value="Russia">Russia</option>
<option value="Rwanda">Rwanda</option>
<option value="Saint Kitts and Nevis">Saint Kitts and Nevis</option>
<option value="Saint Lucia">Saint Lucia</option>
<option value="Saint Vincent and the Grenadines">Saint Vincent and the Grenadines</option>
<option value="Samoa">Samoa</option>
<option value="San Marino">San Marino</option>
<option value="Sao Tome and Principe">Sao Tome and Principe</option>
<option value="Saudi Arabia">Saudi Arabia</option>
<option value="Senegal">Senegal</option>
<option value="Serbia">Serbia</option>
<option value="Seychelles">Seychelles</option>
<option value="Sierra Leone">Sierra Leone</option>
<option value="Singapore">Singapore</option>
<option value="Slovakia">Slovakia</option>
<option value="Slovenia">Slovenia</option>
<option value="Solomon Islands">Solomon Islands</option>
<option value="Somalia">Somalia</option>
<option value="South Africa">South Africa</option>
<option value="Spain">Spain</option>
<option value="Sri Lanka">Sri Lanka</option>
<option value="Sudan">Sudan</option>
<option value="Suriname">Suriname</option>
<option value="Swaziland">Swaziland</option>
<option value="Sweden">Sweden</option>
<option value="Switzerland">Switzerland</option>
<option value="Syria">Syria</option>
<option value="Taiwan">Taiwan</option>
<option value="Tajikistan">Tajikistan</option>
<option value="Tanzania">Tanzania</option>
<option value="Thailand">Thailand</option>
<option value="Togo">Togo</option>
<option value="Tonga">Tonga</option>
<option value="Trinidad and Tobago">Trinidad and Tobago</option>
<option value="Tunisia">Tunisia</option>
<option value="Turkey">Turkey</option>
<option value="Turkmenistan">Turkmenistan</option>
<option value="Tuvalu">Tuvalu</option>
<option value="Uganda">Uganda</option>
<option value="Ukraine">Ukraine</option>
<option value="United Arab Emirates">United Arab Emirates</option>
<option value="United Kingdom">United Kingdom</option>
<option value="United States">United States</option>
<option value="Uruguay">Uruguay</option>
<option value="Uzbekistan">Uzbekistan</option>
<option value="Vanuatu">Vanuatu</option>
<option value="Vatican City">Vatican City</option>
<option value="Venezuela">Venezuela</option>
<option value="Vietnam">Vietnam</option>
<option value="Yemen">Yemen</option>
<option value="Zambia">Zambia</option>
<option value="Zimbabwe">Zimbabwe</option>
</select>
<label>Country</label>
</span>
</div>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="error">
<label class="desc">Website Field</label>
<div>
<input class="field text large" type="url" maxlength="255" value="http://"/>
</div>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="error">
<label class="desc">Email Field</label>
<div>
<input class="field text medium" type="email" maxlength="255" value=""/>
</div>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="complex error">
<label class="desc">File Upload Field</label>
<div>
<span class="full">
<input class="field file" type="file" value=""/>
</span>
</div>
<p class="error">This field is required. Please enter a value.</p>
</li>
<li class="buttons">
<input id="saveForm" class="btTxt submit" type="submit" value="Submit" onclick="return false" />
</li>
</ul>
</form>
</div>
</div><!--container-->
</body>
</html>
/* No context defined for this component. */
/* wufoo specific styles */
form.wufoo {
margin-top: 0;
margin-left: 0;
margin-right: 0;
}
h1#logo {
display: none;
}
#container {
background: $white;
border: none;
box-shadow: none;
@extend .center-align;
width: auto;
@include for-largerthan-ipad-portrait {
margin: 0;
padding-top: 20px;
padding-bottom: 20px;
}
}
/* hide quantity on radio fields with limits */
form.wufoo input+label.choice .choice__qty,
#public input[disabled] + label.choice .choice__qty,
form.wufoo input+label.choice .choice__qty span,
#public input[disabled] + label.choice .choice__qty span {
color: transparent;
}
/*
When you create a default theme in Wufoo as well as your own style sheet before if it adds another comprimising of styles that can be configured in the interface.
Helpfully there is no way to exclude this... here we overwrite all that drose...
*/
form li.complex div span.left, form li.complex div span.right {
width: 100%;
}
.wufoo .info h2 {
@include header;
color: $primary-blue;
}
.wufoo .section h3 {
@include header;
color: $primary-blue;
}
.wufoo label.desc, .wufoo legend.desc {
@extend label.desc;
}
.wufoo .section div,
.wufoo label.choice,
.wufoo input.text, .wufoo textarea.textarea, .wufoo input.file,
.wufoo li div, .wufoo li span, .wufoo li div label, .wufoo li span label,
.wufoo .instruct small{
font-family: $body-font;
}
Form style guide for the website. This will be used to style forms created using the Wufoo form builder.
The page html is the boilerplate for a Wufoo theme kit. The component demonstrates various field types, their variations and error states.