A Wufoo Form

Developer
Alex Vazquez
Size
8,735 Kb
Views
62,744
  1. A Wufoo Form Previews
  2. A Wufoo Form HTML Codes
  3. A Wufoo Form CSS Codes

How do I make an a wufoo form?

What is a a wufoo form? How do you make a a wufoo form? This script and codes were developed by Alex Vazquez on 14 September 2022, Wednesday.

A Wufoo Form Previews
IQ Test

A Wufoo Form - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>A Wufoo Form</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <!DOCTYPE html>
<html>
<head>
<title>
test
</title>
<!-- Meta Tags -->
<meta charset="utf-8">
<meta name="generator" content="Wufoo">
<meta name="robots" content="index, follow">
<!-- CSS -->
<link href="css/structure.css" rel="stylesheet">
<link href="css/form.css" rel="stylesheet">
<!-- JavaScript -->
<script src="scripts/wufoo.js"></script>
<!--[if lt IE 10]>
<script src="https://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body id="public">
<div id="container" class="ltr">
<h1 id="logo">
<a href="https://wufoo.com" title="Powered by Wufoo">Wufoo</a>
</h1>
<form id="form38" name="form38" class="wufoo topLabel page" autocomplete="off" enctype="multipart/form-data" method="post" novalidate
action="https://alexquez.wufoo.com/forms/q7w6a3/#public">
<header id="header" class="info">
<h2>test</h2>
<div>This is my form. Please fill it out. It's awesome!</div>
</header>
<ul>
<li id="foli1" class="notranslate ">
<label class="desc" id="title1" for="Field1">
Untitled
</label>
<div>
<input id="Field1" name="Field1" type="text" class="field text medium" value="" maxlength="255" tabindex="1" onkeyup="" />
</div>
</li><li id="foli2"
class="notranslate "><label class="desc" id="title2" for="Field2">
Untitled
</label>
<div>
<textarea id="Field2"
name="Field2"
class="field textarea medium"
spellcheck="true"
rows="10" cols="50"
tabindex="2"
onkeyup="" ></textarea>
</div>
</li>
<li id="foli3" class="notranslate ">
<fieldset>
<![if !IE | (gte IE 8)]>
<legend id="title3" class="desc">
Select a Choice
</legend>
<![endif]>
<!--[if lt IE 8]>
<label id="title3" class="desc">
Select a Choice
</label>
<![endif]-->
<div>
<input id="radioDefault_3" name="Field3" type="hidden" value="" />
<span>
<input id="Field3_0" name="Field3" type="radio" class="field radio" value="First Choice" tabindex="3" checked="checked"
/>
<label class="choice" for="Field3_0" >
First Choice</label>
</span>
<span>
<input id="Field3_1" name="Field3" type="radio" class="field radio" value="Second Choice" tabindex="4" />
<label class="choice" for="Field3_1" >
Second Choice</label>
</span>
<span>
<input id="Field3_2" name="Field3" type="radio" class="field radio" value="Third Choice" tabindex="5" />
<label class="choice" for="Field3_2" >
Third Choice</label>
</span>
</div>
</fieldset>
</li><li id="foli4" class="notranslate ">
<label class="desc" id="title4" for="Field4">
Email
</label>
<div>
<input id="Field4" name="Field4" type="email" spellcheck="false" class="field text medium" value="" maxlength="255" tabindex="6" />
</div>
</li> <li class="buttons ">
<div> <input id="saveForm" name="saveForm" class="btTxt submit" type="submit" value="Submit" /></div>
</li>
<li class="hide">
<label for="comment">Do Not Fill This Out</label>
<textarea name="comment" id="comment" rows="1" cols="1"></textarea>
<input type="hidden" id="idstamp" name="idstamp" value="+HobDv84YLQyQUSFaTu2sNngYzoDkTWl677SFTm1GXQ=" />
</li>
</ul>
</form>
</div><!--container-->
<a class="powertiny" href="https://wufoo.com/form-builder/" title="Powered by Wufoo"
style="display:block !important;visibility:visible !important;text-indent:0 !important;position:relative !important;height:auto !important;width:95px !important;overflow:visible !important;text-decoration:none;cursor:pointer !important;margin:0 auto !important">
<span style="background:url(./images/powerlogo.png) no-repeat center 7px; margin:0 auto;display:inline-block !important;visibility:visible !important;text-indent:-9000px !important;position:static !important;overflow: auto !important;width:62px !important;height:30px !important">Wufoo</span>
<b style="display:block !important;visibility:visible !important;text-indent:0 !important;position:static !important;height:auto !important;width:auto !important;overflow: auto !important;font-weight:normal;font-size:9px;color:#777;padding:0 0 0 3px;">Designed</b>
</a>
</body>
</html> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
</body>
</html>

A Wufoo Form - Script Codes CSS Codes

.wufoo{font-family:"Lucida Grande","Lucida Sans Unicode", Tahoma, sans-serif;letter-spacing:.01em}.wufoo li{width:64%}.info{display:inline-block;clear:both;margin:0 0 5px 0;padding:0 1% 1.1em 1%;border-bottom:1px dotted #ccc}.info[class]{display:block}.hideHeader .info,#payment.hideHeader li.first{display:none}.info h2{font-weight:normal;font-size:160%;margin:0 0 5px 0;clear:left}.info div{font-size:95%;line-height:135%;color:#555}form ul{margin:0;padding:0;list-style-type:none}* html form ul{width:99%;zoom:1}form li{margin:0;padding:6px 1% 9px 1%;clear:both;background-color:transparent;position:relative;-webkit-transition:background-color 350ms ease-out;-moz-transition:background-color 350ms ease-out;-o-transition:background-color 350ms ease-out;transition:background-color 350ms ease-out}form ul:after,form li:after,form li div:after{content:".";display:block;height:0;clear:both;visibility:hidden}* html form li{height:1%;margin-bottom:-3px}* + html form li{height:1%;margin-bottom:-3px}* html form li div{display:inline-block}* + html form ul,* + html form li div{display:inline-block}form li div{margin:0;padding:0;color:#444}form li span{margin:0 .3em 0 0;padding:0;float:left;color:#444}form li div span{margin:0;display:block;width:100%;float:left}li.twoColumns div span{width:48%;margin:0 5px 0 0}li.threeColumns div span{width:30%;margin:0 5px 0 0}li.notStacked div span{width:auto;margin:0 7px 0 0}form li.complex{padding-bottom:0}form li.complex div span{width:auto;margin:0 .3em 0 0;padding-bottom:12px}form li.complex div span.full{margin:0}form li.complex div span.left,form li.complex div span.right{margin:0;width:48%}form li.complex div span.full input,form li.complex div span.full select,form li.complex div span.left input,form li.complex div span.right input,form li.complex div span.left select,form li.complex div span.right select{width:100%}.left{float:left}.right{float:right}.clear{clear:both !important}label span,.section span,p span,.likert span{display:inline !important;float:none !important}form li div label,form li span label{margin:0;padding-top:3px;clear:both;font-size:85%;line-height:160%;color:#444;display:block}fieldset{display:block;border:none;margin:0;padding:0}label.desc,legend.desc{font-size:95%;font-weight:bold;color:#222;line-height:150%;margin:0;padding:0 0 3px 0;border:none;display:block;white-space:normal;width:100%}label.choice{display:block;cursor:pointer;font-size:100%;line-height:150%;margin:-17px 0 0 23px;padding:0 0 5px 0;color:#222;width:88%}.safari label.choice{margin-top:-16px}form.rightLabel .desc{padding-top:2px}span.symbol{font-size:120%;line-height:135%}form li .datepicker{float:left;margin:.19em 5px 0 0;padding:0;width:16px;height:16px;cursor:pointer !important}form span.req{display:inline;float:none;color:red !important;font-weight:bold;margin:0;padding:0}form li div label var{font-weight:bold;font-style:normal}form li div label .currently{display:none}input.text,input.search,input.file,textarea.textarea,select.select{font-family:"Lucida Grande", Tahoma, Arial, sans-serif;font-size:100%;color:#333;margin:0;padding:2px 0}input.text,input.search,textarea.textarea{border-top:1px solid #7c7c7c;border-left:1px solid #c3c3c3;border-right:1px solid #c3c3c3;border-bottom:1px solid #ddd;background:#fff url(../images/fieldbg.gif) repeat-x top}input.nospin::-webkit-inner-spin-button,input.nospin::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}select.select{padding:1px 0 0 0}input.search{-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px;padding-left:6px}input.checkbox,input.radio{display:block;margin:4px 0 0 0;padding:0;width:13px;height:13px}input.other{margin:0 0 8px 25px}.safari select.select{font-size:120% !important;margin:0 0 1px 0}* html select.select{margin:1px 0}* + html select.select{margin:1px 0}.center,form li span.center input.text,form li span.center label,form li.name span label,form li.date input.text,form li.date span label,form li.phone input.text,form li.phone span label,form li.time input.text,form li.time span label{text-align:center}form li.time select.select{margin-left:5px}form li.price .right{text-align:right}.third{width:32% !important}.half{width:48% !important}.full{width:100% !important}input.small,select.small{width:25%}input.medium,select.medium{width:50%}input.large,select.large{width:100%}.msie[class] select.ieSelectFix{width:auto}.msie[class] select.ieSelectFix.small{min-width:25%}.msie[class] select.ieSelectFix.medium{min-width:50%}.msie[class] select.ieSelectFix.large{width:100%}textarea.textarea{width:293px;min-width:100%;max-width:100%}textarea.small{height:5.5em}textarea.medium{height:10em}textarea.large{height:20em}li.file a{color:#222;text-decoration:none}li.file span{display:inline;float:none}li.file img{display:block;float:left;margin:0 0 0 -10px;padding:5px 5px 7px 5px}li.file .file-size,li.file .file-type{color:#666;font-size:85%;text-transform:uppercase}li.file .file-name{display:block;padding:14px 0 0 0;color:blue;text-decoration:underline}li.file .file-delete{color:red !important;font-size:85%;text-decoration:underline}li.file a:hover .file-name{color:green !important}li.file a:hover .file-name{color:green !important}form li.likert{margin:0;padding:6px 1% 5px 1%;width:auto !important;clear:both !important;float:none !important}.likert table{margin:0 0 .9em 0;background:#fff;width:100%;border:1px solid #dedede;border-bottom:none}.likert caption{text-align:left;color:#222;font-size:95%;line-height:135%;padding:5px 0 .5em 0}.likert input{padding:0;margin:2px 0}.likert tbody td label{font-size:85%;display:block;color:#565656}.likert thead td,.likert thead th{background-color:#e6e6e6}.likert td{border-left:1px solid #ccc;text-align:center;padding:4px 6px}.likert thead td{font-size:85%;padding:10px 6px}.likert th,.likert td{border-bottom:1px solid #dedede}.likert tbody th{padding:8px 8px;text-align:left}.likert tbody th label{color:#222;font-size:95%;font-weight:bold}.likert tbody tr.alt td,.likert tbody tr.alt th{background-color:#f5f5f5}.likert tbody tr:hover td,.likert tbody tr:hover th{background-color:#FFFFCF}.col1 td{width:30%}.col2 td{width:25%}.col3 td{width:18%}.col4 td{width:14.5%}.col5 td{width:12%}.col6 td,.col7 td{width:10%}.col8 td,.col9 td,.col10 td{width:6.5%}.col11{width:6%}.hideNumbers tbody td label{display:none}form li.buttons{width:auto !important;position:relative;clear:both;padding:10px 1% 10px 1%}form li.buttons input{font-size:100%;margin-right:5px}input.btTxt{padding:0 7px;width:auto;overflow:visible}.safari input.btTxt{font-size:120%}.buttons .marker{position:absolute;top:0;right:0;padding:15px 10px 0 0;color:#000;width:auto}button.link{display:inline-block;border:none;background:none;color:blue;text-decoration:underline;cursor:pointer;padding:0;font-size:100%}button.link:hover{color:green}.leftLabel li,.rightLabel li{width:74% !important;padding-top:9px}.leftLabel .desc,.rightLabel .desc{float:left;width:31%;margin:0 15px 0 0}.rightLabel .desc{text-align:right}.leftLabel li div,.rightLabel li div{float:left;width:65%}* html .leftLabel li fieldset div,* html .rightLabel li fieldset div{float:right}* + html .leftLabel li fieldset div,* + html .rightLabel li fieldset div{float:right}.leftLabel .buttons,.rightLabel .buttons{padding-left:23%}.leftLabel .buttons div,.rightLabel .buttons div{float:none;margin:0 0 0 20px}.leftLabel p.instruct,.rightLabel p.instruct{width:28%;margin-left:5px}.leftLabel .altInstruct .instruct,.rightLabel .altInstruct .instruct{margin-left:31% !important;padding-left:15px;width:65%}.noI form li,.altInstruct form li{width:auto !important}.noI .leftLabel .buttons,.noI .rightLabel .buttons{padding-left:31%}.noI .leftLabel .buttons div,.noI .rightLabel .buttons div{margin:0 0 0 17px}form li.leftHalf,form li.rightHalf{width:47% !important}form li.leftThird,form li.middleThird,form li.rightThird{width:30% !important}form li.leftFourth,form li.middleFourth,form li.rightFourth{width:23% !important;_width:22% !important}form li.leftFifth,form li.middleFifth,form li.rightFifth{width:18% !important;_width:17% !important}form li.middleThird{clear:none !important;float:left;margin-left:2% !important}form li.leftFourth,form li.middleFourth,form li.leftFifth,form li.middleFifth{clear:none !important;float:left}form li.rightHalf,form li.rightThird,form li.rightFourth,form li.rightFifth{clear:none !important;float:right}li.leftHalf .small,li.rightHalf .small,li.leftHalf .medium,li.rightHalf .medium,li.leftThird .small,li.middleThird .small,li.rightThird .small,li.leftThird .medium,li.middleThird .medium,li.rightThird .medium,li.leftFourth .medium,li.middleFourth .medium,li.rightFourth .medium,li.leftFourth .small,li.middleFourth .small,li.rightFourth .small,li.leftFifth .medium,li.middleFifth .medium,li.rightFifth .medium,li.leftFifth .small,li.middleFifth .small,li.rightFifth .small{width:100% !important}form li.leftHalf,form li.leftThird,form li.leftFourth,form li.leftFifth{clear:left !important;float:left}* html form li.middleFourth{margin-left:1% !important}* html form li.middleFifth{margin-left:1% !important}form li.focused{background-color:#fff7c0}form .instruct{position:absolute;top:0;left:0;z-index:1000;width:45%;margin:0 0 0 8px;padding:8px 10px 10px 10px;border:1px solid #e6e6e6;background:#f5f5f5;visibility:hidden;opacity:0;font-size:105%;-webkit-transition:opacity 350ms ease-out;-moz-transition:opacity 350ms ease-out;-o-transition:opacity 350ms ease-out;transition:opacity 350ms ease-out}form .instruct small{line-height:120%;font-size:80%;color:#444}form li.focused .instruct,form li:hover .instruct{left:100%;visibility:visible;opacity:1}.altInstruct .instruct,li.leftHalf .instruct,li.rightHalf .instruct,li.leftThird .instruct,li.middleThird .instruct,li.rightThird .instruct,li.leftFourth .instruct,li.middleFourth .instruct,li.rightFourth .instruct,li.leftFifth .instruct,li.middleFifth .instruct,li.rightFifth .instruct,.iphone .instruct{visibility:visible;position:static;margin:0;padding:6px 0 0 0;width:100%;clear:left;background:none !important;border:none !important;font-style:italic;opacity:1}.altInstruct p.complex,li.leftHalf p.complex,li.rightHalf p.complex,li.leftThird p.complex,li.middleThird p.complex,li.rightThird p.complex,.iphone p.complex{padding:0 0 9px 0}.hideSeconds .seconds,.hideAMPM .ampm,.hideAddr2 .addr2,.hideSecondary #previousPageButton,.hideCents .radix,.hideCents .cents,.hideState .state{display:none}form li.section{clear:both;margin:0;padding:7px 0 0 0;width:auto !important;position:static}form li.section h3{font-weight:normal;font-size:110%;line-height:135%;margin:0 0 3px 0;width:auto;padding:12px 1% 0 1%;border-top:1px dotted #ccc}form li.first{padding:0}form li.first h3{padding:8px 1% 0 1%;border-top:none !important}form li.section div{display:block;width:auto;float:none;font-size:85%;line-height:160%;margin:0 0 1em 0;padding:0 1% 0 1%}form li.section.scrollText{border:1px solid #dedede;height:150px;overflow:auto;margin-bottom:10px;padding:10px;-webkit-box-shadow:rgba(0,0,0,0.15) 0 0 3px;-moz-box-shadow:rgba(0,0,0,0.15) 0 0 3px;-o-box-shadow:rgba(0,0,0,0.15) 0 0 3px;box-shadow:rgba(0,0,0,0.15) 0 0 3px}form li.section.scrollText h3{border:none;padding-top:8px}form li.captcha{width:auto !important;clear:both;border-top:1px dotted #ccc;margin-top:5px;padding:1.1em 1% 9px 1%;width:auto !important;position:static}form li.captcha label.desc{width:auto !important;margin-bottom:4px;float:none}* + html #recaptcha_area,* + html #recaptcha_table{min-width:450px !important}* html #recaptcha_area,* html #recaptcha_table{width:450px !important}#recaptcha_widget_div table{background:#fff}form li.captcha .noscript iframe{border:none;overflow:hidden;margin:0;padding:0}form li.captcha .noscript label.desc{display:block !important}form li.captcha .noscript textarea{margin-left:12px}iframe[src="about:blank"]{display:none}form li.paging-context{clear:both;border-bottom:1px dotted #ccc;margin:0 0 7px 0;padding:5px 1% 10px 1%;width:auto !important;position:static}.paging-context table{width:100%}.pgStyle1 td{text-align:left;vertical-align:middle}.pgStyle1 td.c{width:22px}.pgStyle1 td.t{padding:0 1%}.pgStyle1 var{display:block;float:left;background:none;border:1px solid #CCC;color:#000;width:20px;height:20px;line-height:19px;text-align:center;font-size:85%;font-style:normal;-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px;-webkit-box-shadow:rgba(0,0,0,0.15) 0 1px 2px;-moz-box-shadow:rgba(0,0,0,0.15) 0 1px 2px;-o-box-shadow:rgba(0,0,0,0.15) 0 1px 2px;box-shadow:rgba(0,0,0,0.15) 0 1px 2px}.pgStyle1 .done var{background:#ccc}.pgStyle1 .selected var{background:#FFF7C0;color:#000;border:1px solid #e6dead;font-weight:bold}.pgStyle1 b{font-size:85%;font-weight:normal;color:#000}.pgStyle1 .selected b{font-weight:bold}.circle6 td,.circle7 td{vertical-align:top;text-align:center}.nopagelabel td.t{display:none}.nopagelabel .pgStyle1 var,.circle6 var,.circle7 var{width:24px;height:24px;line-height:24px;font-size:90%;margin:0 auto 7px auto;float:none;-webkit-border-radius:12px;-moz-border-radius:12px;border-radius:12px}.nopagelabel .pgStyle1 var{margin-bottom:0}.circle6 b,.circle7 b{padding:0}.circle2 td{width:50%}.circle3 td{width:33%}.circle4 td{width:25%}.circle5 td{width:20%}.circle6 td{width:16.6%}.circle7 td{width:14.2%}.pgStyle2 td{vertical-align:middle;height:25px;padding:2px;border:1px solid #CCC;position:relative;-webkit-border-radius:14px;-moz-border-radius:14px;border-radius:14px;-webkit-box-shadow:rgba(0,0,0,0.1) 1px 1px 1px;-moz-box-shadow:rgba(0,0,0,0.1) 1px 1px 1px;-o-box-shadow:rgba(0,0,0,0.1) 1px 1px 1px;box-shadow:rgba(0,0,0,0.1) 1px 1px 1px}.pgStyle2 var{display:block;height:26px;float:left;background:#FFF7C0;color:#000;font-style:normal;text-align:right;-webkit-border-radius:12px;-moz-border-radius:12px;border-radius:12px;-webkit-box-shadow:rgba(0,0,0,0.15) 1px 0 0;-moz-box-shadow:rgba(0,0,0,0.15) 1px 0 0;-o-box-shadow:rgba(0,0,0,0.15) 1px 0 0;box-shadow:rgba(0,0,0,0.15) 1px 0 0}.pgStyle2 var b{display:block;float:right;font-size:100%;padding:3px 10px 3px 3px;line-height:19px}.pgStyle2 em{font-size:85%;font-style:normal;display:inline-block;margin:0 0 0 9px;padding:4px 0;line-height:18px}.pgStyle2 var em{padding:4px 5px 3px 0}.page1 .pgStyle2 var{padding-left:7px;text-align:left;background:none;-webkit-box-shadow:none;-moz-box-shadow:none;-o-box-shadow:none;box-shadow:none}.page1 .pgStyle2 b{float:none;padding-right:0}.hideMarkers .marker,.nopagelabel .pgStyle1 b,.nopagelabel .pgStyle2 em{display:none !important}#errorLi{width:99%;margin:15px auto 15px auto;background:#fff !important;border:1px solid red;text-align:center;padding:1em 0 1em 0;-webkit-border-radius:20px;-moz-border-radius:20px;border-radius:20px}#errorMsgLbl{margin:0 0 5px 0;padding:0;font-size:125%;color:#DF0000 !important}#errorMsg{margin:0 0 2px 0;color:#000 !important;font-size:100%}#errorMsg b{padding:2px 8px;background-color:#FFDFDF !important;color:red !important;-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px}form li.error{display:block !important;background-color:#FFDFDF !important;margin-bottom:3px !important}form li label.error,form li input.error{color:#DF0000 !important;font-weight:bold !important}form li input.error{background:#fff !important;border:2px solid #DF0000 !important}form li.error label,form li.error span.symbol{color:#000 !important}form li.error .desc{color:#DF0000 !important}form p.error{display:none;margin:0 !important;padding:7px 0 0 0 !important;line-height:10px !important;font-weight:bold;font-size:11px;color:#DF0000 !important;clear:both}form li.error p.error{display:block}form li.complex p.error{padding:0 0 9px 0 !important}.rtl h1,.rtl form *{direction:rtl;text-align:right}.rtl li span{float:right}.rtl .right{float:left}.rtl #logo a{background-position:right top}.rtl label.choice{margin:-17px 23px 0 0}.rtl .leftLabel .desc,.rtl .rightLabel .desc{float:right;margin:0 0 0 15px}.rtl .leftLabel li div,.rtl .rightLabel li div{float:right}.rtl .leftLabel .desc{text-align:left}.rtl li.focused .instruct,.rtl li:hover .instruct{left:auto;right:100%}.rtl .leftLabel p.instruct,.rtl .rightLabel p.instruct{margin-right:5px}.rtl .leftLabel .altInstruct .instruct,.rtl .rightLabel .altInstruct .instruct{margin-right:31% !important;padding-right:15px}.rtl .leftLabel .buttons,.rtl .rightLabel .buttons{padding-right:23%}.rtl .leftLabel .buttons div,.rtl .rightLabel .buttons div{float:none;margin:0 20px 0 0}.noI .rtl .leftLabel .buttons,.noI .rtl .rightLabel .buttons{padding-right:31%}.noI .rtl .leftLabel .buttons div,.noI .rtl .rightLabel .buttons div{margin:0 17px 0 0}.rtl .likert td label{text-align:center}.rtl .likert caption,.rtl .likert tbody th{text-align:right}.rtl .likert td{text-align:center;border-left:none;border-right:1px solid #ccc}.rtl .pgStyle1 var{text-align:center}.rtl .pgStyle1 td{text-align:right}.rtl .pgStyle2 var{float:right}.rtl .pgStyle2 var b{float:left;padding:3px 3px 3px 10px}.rtl .pgStyle2 em{margin:0 9px 0 0}.rtl .pgStyle2 var em{padding:4px 0 3px 5px}.rtl .page1 .pgStyle2 var{padding-right:7px}.rtl .page1 .pgStyle2 b{padding-left:0}.rtl .buttons .marker{right:auto;left:0;padding:15px 0 0 10px}.rtl #errorLi *{text-align:center} html{background:#eee}body{margin:17px 0 15px 0;padding:0;text-align:center;font-size:small;font-family:"Lucida Grande", Tahoma, Arial, Verdana, sans-serif}article,aside,figure,figure img,figcaption,hgroup,footer,header,nav,section,video,object,output{display:block}#container{text-align:left;background:#fff;border:1px solid #ccc;-webkit-box-shadow:rgba(0,0,0,0.2) 0px 0px 5px;-moz-box-shadow:rgba(0,0,0,0.2) 0px 0px 5px;-o-box-shadow:rgba(0,0,0,0.2) 0px 0px 5px;box-shadow:rgba(0,0,0,0.2) 0px 0px 5px}#container{margin:0 auto 10px auto;width:640px}form.wufoo{margin:20px 14px 0 14px;padding:0 0 20px 0;position:relative}#logo{margin:0;padding:0;min-height:0;background-color:#dedede;text-indent:-9000px;text-decoration:none}#logo a{min-height:40px;height:40px;display:block;background:url(../images/wflogo.png) no-repeat left top;overflow:hidden}* html #logo a{_background-image:none;_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../images/wflogo.png", sizingMethod="crop")}img,a img{border:none;-ms-interpolation-mode:bicubic}.hide,.cloak div,.cloak span,.likert.cloak tbody,.likert.cloak thead{display:none !important}.likert.cloak table{border:none} /* ----- Logo ----- */
#logo a {	background-image:url('../images/wflogo.png');	min-height:0;	height:40px;
}
* html #logo a {/* IE6 png Support */	background-image: none;	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../images/wflogo.png", sizingMethod="crop");
}
/* ----- Backgrounds ----- */
html{	background-image:none;	background-color:#FFFFFF;
}
#logo{	background-image:none;	background-color:#DEDEDE;
}
#container, html.embed{	background-color:#FFFFFF;
}
.safari .wufoo input.file{	background:none;	border:none;
}
.wufoo li.focused{	background-color:#FFF7C0;
}
.wufoo .instruct{	background-color:#F5F5F5;
}
/* ----- Borders ----- */
#container{	border:1px solid #CCCCCC;
}
.wufoo .info, .wufoo .paging-context{	border-bottom:1px dotted #CCCCCC;
}
.wufoo .section h3, .wufoo .captcha, #payment .paging-context{	border-top:1px dotted #CCCCCC;
}
.wufoo input.text, .wufoo textarea.textarea{
}
.wufoo .instruct{	border:1px solid #E6E6E6;
}
.fixed .info{	border-bottom:none;
}
.wufoo li.section.scrollText{	border-color:#dedede;
}
/* ----- Typography ----- */
.wufoo .info h2{	font-size:160%;	font-family:inherit;	font-style:normal;	font-weight:normal;	color:#000000;
}
.wufoo .info div{	font-size:95%;	font-family:inherit;	font-style:normal;	font-weight:normal;	color:#444444;
}
.wufoo .section h3{	font-size:110%;	font-family:inherit;	font-style:normal;	font-weight:normal;	color:#000000;
}
.wufoo .section div{	font-size:85%;	font-family:inherit;	font-style:normal;	font-weight:normal;	color:#444444;
}
.wufoo label.desc, .wufoo legend.desc{	font-size:95%;	font-family:inherit;	font-style:normal;	font-weight:bold;	color:#444444;
}
.wufoo label.choice{	font-size:100%;	font-family:inherit;	font-style:normal;	font-weight:normal;	color:#444444;
}
.wufoo input.text, .wufoo textarea.textarea, .wufoo input.file, .wufoo select.select{	font-style:normal;	font-weight:normal;	color:#333333;	font-size:100%;
}
{* Custom Fonts Break Dropdown Selection in IE *}
.wufoo input.text, .wufoo textarea.textarea, .wufoo input.file{	font-family:inherit;
}
.wufoo li div, .wufoo li span, .wufoo li div label, .wufoo li span label{	font-family:inherit;	color:#444444;
}
.safari .wufoo input.file{ /* Webkit */	font-size:100%;	font-family:inherit;	color:#444444;
}
.wufoo .instruct small{	font-size:80%;	font-family:inherit;	font-style:normal;	font-weight:normal;	color:#444444;
}
.altInstruct small, li.leftHalf small, li.rightHalf small,
li.leftThird small, li.middleThird small, li.rightThird small,
.iphone small{	color:#444444 !important;
}
/* ----- Button Styles ----- */
.wufoo input.btTxt{
}
/* ----- Highlight Styles ----- */
.wufoo li.focused label.desc, .wufoo li.focused legend.desc,
.wufoo li.focused div, .wufoo li.focused span, .wufoo li.focused div label, .wufoo li.focused span label,
.safari .wufoo li.focused input.file{	color:#000000;
}
/* ----- Confirmation ----- */
.confirm h2{	font-family:inherit;	color:#444444;
}
a.powertiny b, a.powertiny em{	color:#1a1a1a !important;
}
.embed a.powertiny b, .embed a.powertiny em{	color:#1a1a1a !important;
}
/* ----- Pagination ----- */
.pgStyle1 var, .pgStyle2 var, .pgStyle2 em, .page1 .pgStyle2 var, .pgStyle1 b, .wufoo .buttons .marker{	font-family:inherit;	color:#444444;
}
.pgStyle1 var, .pgStyle2 td{	border:1px solid #cccccc;
}
.pgStyle1 .done var{	background:#cccccc;
}
.pgStyle1 .selected var, .pgStyle2 var, .pgStyle2 var em{	background:#FFF7C0;	color:#000000;
}
.pgStyle1 .selected var{	border:1px solid #e6dead;
}
/* Likert Backgrounds */
.likert table{	background-color:#FFFFFF;
}
.likert thead td, .likert thead th{	background-color:#e6e6e6;
}
.likert tbody tr.alt td, .likert tbody tr.alt th{	background-color:#f5f5f5;
}
/* Likert Borders */
.likert table, .likert th, .likert td{	border-color:#dedede;
}
.likert td{	border-left:1px solid #cccccc;
}
/* Likert Typography */
.likert caption, .likert thead td, .likert tbody th label{	color:#444444;	font-family:inherit;
}
.likert tbody td label{	color:#575757;	font-family:inherit;
}
.likert caption, .likert tbody th label{	font-size:95%;
}
/* Likert Hover */
.likert tbody tr:hover td, .likert tbody tr:hover th, .likert tbody tr:hover label{	background-color:#FFF7C0;	color:#000000;
}
.likert tbody tr:hover td{	border-left:1px solid #ccc69a;
}
/* ----- Running Total ----- */
.wufoo #lola{	background:#e6e6e6;
}
.wufoo #lola tbody td{	border-bottom:1px solid #cccccc;
}
.wufoo #lola{	font-family:inherit;	color:#444444;
}
.wufoo #lola tfoot th{	color:#696969;
}
/* ----- Report Styles ----- */
.wufoo .wfo_graph h3{	font-size:95%;	font-family:inherit;	color:#444444;
}
.wfo_txt, .wfo_graph h4{	color:#444444;
}
.wufoo .footer h4{	color:#000000;
}
.wufoo .footer span{	color:#444444;
}
/* ----- Number Widget ----- */
.wfo_number{	background-color:#f5f5f5;	border-color:#dedede;
}
.wfo_number strong, .wfo_number em{	color:#000000;
}
/* ----- Chart Widget Border and Background Colors ----- */
#widget, #widget body{	background:#FFFFFF;
}
.fcNav a.show{	background-color:#FFFFFF;	border-color:#cccccc;
}
.fc table{	border-left:1px solid #dedede;
}
.fc thead th, .fc .more th{	background-color:#dedede !important;	border-right:1px solid #cccccc !important;
}
.fc tbody td, .fc tbody th, .fc tfoot th, .fc tfoot td{	background-color:#FFFFFF;	border-right:1px solid #cccccc;	border-bottom:1px solid #dedede;
}
.fc tbody tr.alt td, .fc tbody tr.alt th, .fc tbody td.alt{	background-color:#f5f5f5;
}
/* ----- Chart Widget Typography Colors ----- */
.fc caption, .fcNav, .fcNav a{	color:#444444;
}
.fc tfoot,
.fc thead th,
.fc tbody th div,
.fc tbody td.count, .fc .cards tbody td a, .fc td.percent var,
.fc .timestamp span{	color:#000000;
}
.fc .indent .count{	color:#4b4b4b;
}
.fc .cards tbody td a span{	color:#7d7d7d;
}
/* ----- Chart Widget Hover Colors ----- */
.fc tbody tr:hover td, .fc tbody tr:hover th,
.fc tfoot tr:hover td, .fc tfoot tr:hover th{	background-color:#FFF7C0;
}
.fc tbody tr:hover th div, .fc tbody tr:hover td, .fc tbody tr:hover var,
.fc tfoot tr:hover th div, .fc tfoot tr:hover td, .fc tfoot tr:hover var{	color:#000000;
}
/* ----- Payment Summary ----- */
.invoice thead th,
.invoice tbody th, .invoice tbody td,
.invoice tfoot th,
.invoice .total,
.invoice tfoot .last th, .invoice tfoot .last td,
.invoice tfoot th, .invoice tfoot td{	border-color:#dedede;
}
.invoice thead th, .wufoo .checkNotice{	background:#f5f5f5;
}
.invoice th, .invoice td{	color:#000000;
}
#ppSection, #ccSection{	border-bottom:1px dotted #CCCCCC;
}
#shipSection, #invoiceSection{	border-top:1px dotted #CCCCCC;
}
/* Drop Shadows */
/* - - - Local Fonts - - - */
/* - - - Responsive - - - */
@media only screen and (max-width: 480px) {	html{	background-color:#FFFFFF;	}	a.powertiny b, a.powertin em{	color:#1a1a1a !important;	}
}
/* - - - Custom Theme - - - */
A Wufoo Form - Script Codes
A Wufoo Form - Script Codes
Home Page Home
Developer Alex Vazquez
Username quezo
Uploaded September 14, 2022
Rating 3
Size 8,735 Kb
Views 62,744
Do you need developer help for A Wufoo Form?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Alex Vazquez (quezo) Script Codes
Name
Maximized TextArea
Jquery Extension to Handle Clicks and Double Clicks
Example of Submitting a Bad Form
Instagram Follow Button
DC.js Example Bar Chart
My Stolen Code Pen
A Pen by Alex Vazquez
Redux Template
Simple Redux, React Example
DC.js Example Pie Chart
Create amazing sales emails with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!