API tools faq
paste
Advertisement
KyleWattson

TVisuals FORM (EDITED)

KyleWattson
Dec 17th, 2017
371
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 29.44 KB | None | 0 0
raw download clone embed print report
  1. <script src="https://cdn.jotfor.ms/static/prototype.forms.js" type="text/javascript"></script>
  2. <script src="https://cdn.jotfor.ms/static/jotform.forms.js?3.3.3461" type="text/javascript"></script>
  3. <script type="text/javascript">
  4. JotForm.init(function(){
  5. setTimeout(function() {
  6. $('input_3').hint('Your Name');
  7. }, 20);
  8. setTimeout(function() {
  9. $('input_5').hint('example@example.com');
  10. }, 20);
  11. setTimeout(function() {
  12. $('input_6').hint('@TurnedVisuals');
  13. }, 20);
  14. JotForm.setCustomHint( 'input_7', 'Text' );
  15. JotForm.alterTexts({"alphabetic":"This field can only contain letters","alphanumeric":"This field can only contain letters and numbers.","ccDonationMinLimitError":"Minimum amount is {minAmount} {currency}","ccInvalidCVC":"CVC number is invalid.","ccInvalidExpireDate":"Expire date is invalid.","ccInvalidNumber":"Credit Card Number is invalid.","ccMissingDetails":"Please fill up the Credit Card details.","ccMissingDonation":"Please enter numeric values for donation amount.","ccMissingProduct":"Please select at least one product.","characterLimitError":"Too many Characters. The limit is","characterMinLimitError":"Too few characters. The minimum is","confirmClearForm":"Are you sure you want to clear the form?","confirmEmail":"E-mail does not match","currency":"This field can only contain currency values.","cyrillic":"This field can only contain cyrillic characters","dateInvalid":"This date is not valid. The date format is {format}","dateInvalidSeparate":"This date is not valid. Enter a valid {element}.","dateLimited":"This date is unavailable.","disallowDecimals":"Please enter a whole number.","email":"Enter a valid e-mail address","fillMask":"Field value must fill mask.","freeEmailError":"Free email accounts are not allowed","generalError":"There are errors on the form. Please fix them before continuing.","generalPageError":"There are errors on this page. Please fix them before continuing.","gradingScoreError":"Score total should only be less than or equal to","incompleteFields":"There are incomplete required fields. Please complete them.","inputCarretErrorA":"Input should not be less than the minimum value:","inputCarretErrorB":"Input should not be greater than the maximum value:","lessThan":"Your score should be less than or equal to","maxDigitsError":"The maximum digits allowed is","maxSelectionsError":"The maximum number of selections allowed is","minSelectionsError":"The minimum required number of selections is","multipleFileUploads_emptyError":"{file} is empty, please select files again without it.","multipleFileUploads_fileLimitError":"Only {fileLimit} file uploads allowed.","multipleFileUploads_minSizeError":"{file} is too small, minimum file size is {minSizeLimit}.","multipleFileUploads_onLeave":"The files are being uploaded, if you leave now the upload will be cancelled.","multipleFileUploads_sizeError":"{file} is too large, maximum file size is {sizeLimit}.","multipleFileUploads_typeError":"{file} has invalid extension. Only {extensions} are allowed.","nextButtonText":"Next","numeric":"This field can only contain numeric values","pastDatesDisallowed":"Date must not be in the past.","pleaseWait":"Please wait...","prevButtonText":"Previous","progressMiddleText":"of","required":"This field is required.","requireEveryCell":"Every cell is required.","requireEveryRow":"Every row is required.","requireOne":"At least one field required.","reviewBackText":"Back to Form","reviewSubmitText":"Review and Submit","seeAllText":"See All","submissionLimit":"Sorry! Only one entry is allowed. Multiple submissions are disabled for this form.","submitButtonText":"Submit","uploadExtensions":"You can only upload following files:","uploadFilesize":"File size cannot be bigger than:","uploadFilesizemin":"File size cannot be smaller than:","url":"This field can only contain a valid URL","wordLimitError":"Too many words. The limit is","wordMinLimitError":"Too few words. The minimum is"});
  16. JotForm.clearFieldOnHide="disable";
  17. JotForm.submitError="jumpToFirstError";
  18. /*INIT-END*/
  19. });
  20.  
  21. JotForm.prepareCalculationsOnTheFly([null,{"name":"turnedVisuals1","qid":"1","text":"Turned Visuals — Contact Form","type":"control_head"},{"name":"submit","qid":"2","text":"SUBMIT","type":"control_button"},{"name":"name3","qid":"3","text":"NAME","type":"control_textbox"},{"name":"clickTo","qid":"4","text":"*Required","type":"control_text"},{"name":"email5","qid":"5","text":"EMAIL","type":"control_email"},{"name":"twitter6","qid":"6","text":"TWITTER","type":"control_textbox"},{"name":"inquiry","qid":"7","text":"INQUIRY","type":"control_textarea"}]);
  22. setTimeout(function() {
  23. JotForm.paymentExtrasOnTheFly([null,{"name":"turnedVisuals1","qid":"1","text":"Turned Visuals — Contact Form","type":"control_head"},{"name":"submit","qid":"2","text":"SUBMIT","type":"control_button"},{"name":"name3","qid":"3","text":"NAME","type":"control_textbox"},{"name":"clickTo","qid":"4","text":"*Required","type":"control_text"},{"name":"email5","qid":"5","text":"EMAIL","type":"control_email"},{"name":"twitter6","qid":"6","text":"TWITTER","type":"control_textbox"},{"name":"inquiry","qid":"7","text":"INQUIRY","type":"control_textarea"}]);}, 20);
  24. </script>
  25. <link href="https://cdn.jotfor.ms/static/formCss.css?3.3.3461" rel="stylesheet" type="text/css" />
  26. <link type="text/css" rel="stylesheet" href="https://cdn.jotfor.ms/css/styles/nova.css?3.3.3461" />
  27. <link type="text/css" media="print" rel="stylesheet" href="https://cdn.jotfor.ms/css/printForm.css?3.3.3461" />
  28. <link type="text/css" rel="stylesheet" href="https://cdn.jotfor.ms/themes/CSS/566a91c2977cdfcd478b4567.css?"/>
  29. <style type="text/css">
  30. .form-label-left{
  31. width:150px;
  32. }
  33. .form-line{
  34. padding-top:12px;
  35. padding-bottom:12px;
  36. }
  37. .form-label-right{
  38. width:150px;
  39. }
  40. .form-all{
  41. width:690px;
  42. color:rgb(0, 0, 0) !important;
  43. font-family:'Roboto';
  44. font-size:14px;
  45. }
  46. </style>
  47.  
  48. <style type="text/css" id="form-designer-style">
  49. /* Injected CSS Code */
  50. @import "https://fonts.googleapis.com/css?family=Roboto:light,lightitalic,normal,italic,bold,bolditalic";
  51. .form-all:after {
  52. content: "";
  53. display: table;
  54. clear: both;
  55. }
  56. .form-all {
  57. font-family: "Roboto", sans-serif;
  58. }
  59. .form-all {
  60. width: 690px;
  61. }
  62. .form-label-left,
  63. .form-label-right {
  64. width: 150px;
  65. }
  66. .form-label {
  67. white-space: normal;
  68. }
  69. .form-label.form-label-auto {
  70. display: block;
  71. float: none;
  72. text-align: left;
  73. }
  74. .form-label-left {
  75. display: inline-block;
  76. white-space: normal;
  77. float: left;
  78. text-align: left;
  79. }
  80. .form-label-right {
  81. display: inline-block;
  82. white-space: normal;
  83. float: left;
  84. text-align: right;
  85. }
  86. .form-label-top {
  87. white-space: normal;
  88. display: block;
  89. float: none;
  90. text-align: left;
  91. }
  92. .form-radio-item label:before {
  93. top: 0;
  94. }
  95. .form-all {
  96. font-size: 14px;
  97. }
  98. .form-label {
  99. font-weight: bold;
  100. }
  101. .form-checkbox-item label,
  102. .form-radio-item label {
  103. font-weight: normal;
  104. }
  105. .supernova {
  106. background-color: rgba(255, 255, 255, 0);
  107. background-color: rgba(205, 231, 199, 0);
  108. }
  109. .supernova body {
  110. background-color: transparent;
  111. }
  112. /*
  113. @width30: (unit(@formWidth, px) + 60px);
  114. @width60: (unit(@formWidth, px)+ 120px);
  115. @width90: (unit(@formWidth, px)+ 180px);
  116. */
  117. /* | */
  118. @media screen and (min-width: 480px) {
  119. .supernova .form-all {
  120. border: 1px solid rgba(173, 216, 163, 0);
  121. -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.1);
  122. -moz-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.1);
  123. box-shadow: 0 3px 9px rgba(0, 0, 0, 0.1);
  124. }
  125. }
  126. /* | */
  127. /* | */
  128. @media screen and (max-width: 480px) {
  129. .jotform-form .form-all {
  130. margin: 0;
  131. width: 100%;
  132. }
  133. }
  134. /* | */
  135. /* | */
  136. @media screen and (min-width: 480px) and (max-width: 767px) {
  137. .jotform-form .form-all {
  138. margin: 0;
  139. width: 100%;
  140. }
  141. }
  142. /* | */
  143. /* | */
  144. @media screen and (min-width: 480px) and (max-width: 689px) {
  145. .jotform-form .form-all {
  146. margin: 0;
  147. width: 100%;
  148. }
  149. }
  150. /* | */
  151. /* | */
  152. @media screen and (min-width: 768px) {
  153. .jotform-form {
  154. padding: 60px 0;
  155. }
  156. }
  157. /* | */
  158. /* | */
  159. @media screen and (max-width: 689px) {
  160. .jotform-form .form-all {
  161. margin: 0;
  162. width: 100%;
  163. }
  164. }
  165. /* | */
  166. .supernova .form-all,
  167. .form-all {
  168. background-color: rgba(255, 255, 255, 0);
  169. border: 1px solid transparent;
  170. }
  171. .form-header-group {
  172. border-color: rgba(230, 230, 230, 0);
  173. }
  174. .form-matrix-table tr {
  175. border-color: rgba(230, 230, 230, 0);
  176. }
  177. .form-matrix-table tr:nth-child(2n) {
  178. background-color: rgba(242, 242, 242, 0);
  179. }
  180. .form-all {
  181. color: #000000;
  182. }
  183. .form-header-group .form-header {
  184. color: #000000;
  185. }
  186. .form-header-group .form-subHeader {
  187. color: #1a1a1a;
  188. }
  189. .form-sub-label {
  190. color: #1a1a1a;
  191. }
  192. .form-label-top,
  193. .form-label-left,
  194. .form-label-right,
  195. .form-html {
  196. color: #000000;
  197. }
  198. .form-checkbox-item label,
  199. .form-radio-item label {
  200. color: #1a1a1a;
  201. }
  202. .form-line.form-line-active {
  203. -webkit-transition-property: all;
  204. -moz-transition-property: all;
  205. -ms-transition-property: all;
  206. -o-transition-property: all;
  207. transition-property: all;
  208. -webkit-transition-duration: 0.3s;
  209. -moz-transition-duration: 0.3s;
  210. -ms-transition-duration: 0.3s;
  211. -o-transition-duration: 0.3s;
  212. transition-duration: 0.3s;
  213. -webkit-transition-timing-function: ease;
  214. -moz-transition-timing-function: ease;
  215. -ms-transition-timing-function: ease;
  216. -o-transition-timing-function: ease;
  217. transition-timing-function: ease;
  218. background-color: #ffffe0;
  219. }
  220. /* omer */
  221. .form-radio-item,
  222. .form-checkbox-item {
  223. padding-bottom: 0px !important;
  224. }
  225. .form-radio-item:last-child,
  226. .form-checkbox-item:last-child {
  227. padding-bottom: 0;
  228. }
  229. /* omer */
  230. .form-single-column .form-checkbox-item,
  231. .form-single-column .form-radio-item {
  232. width: 100%;
  233. }
  234. .supernova {
  235. height: 100%;
  236. background-repeat: no-repeat;
  237. background-attachment: scroll;
  238. background-position: center top;
  239. background-repeat: repeat;
  240. }
  241. .supernova {
  242. background-image: none;
  243. }
  244. #stage {
  245. background-image: none;
  246. }
  247. /* | */
  248. .form-all {
  249. background-repeat: no-repeat;
  250. background-attachment: scroll;
  251. background-position: center top;
  252. background-repeat: repeat;
  253. }
  254. .form-header-group {
  255. background-repeat: no-repeat;
  256. background-attachment: scroll;
  257. background-position: center top;
  258. }
  259. .form-line {
  260. margin-top: 20px;
  261. margin-bottom: 20px;
  262. }
  263. .form-line {
  264. padding: 14px 0px;
  265. }
  266. .form-all .form-textbox,
  267. .form-all .form-radio-other-input,
  268. .form-all .form-checkbox-other-input,
  269. .form-all .form-captcha input,
  270. .form-all .form-spinner input,
  271. .form-all .form-pagebreak-back,
  272. .form-all .form-pagebreak-next,
  273. .form-all .qq-upload-button,
  274. .form-all .form-error-message {
  275. -webkit-border-radius: 0px;
  276. -moz-border-radius: 0px;
  277. border-radius: 0px;
  278. }
  279. .form-all .form-textarea {
  280. -webkit-border-radius: 0px;
  281. -moz-border-radius: 0px;
  282. border-radius: 0px;
  283. }
  284. .form-all .form-submit-button,
  285. .form-all .form-submit-reset,
  286. .form-all .form-submit-print {
  287. -webkit-border-radius: 6px;
  288. -moz-border-radius: 6px;
  289. border-radius: 6px;
  290. }
  291. .form-all .form-sub-label {
  292. margin-left: 3px;
  293. }
  294. .form-all .qq-upload-button,
  295. .form-all .form-submit-button,
  296. .form-all .form-submit-reset,
  297. .form-all .form-submit-print {
  298. height: 45px;
  299. width: 100px;
  300. font-size: 1.15em;
  301. padding: 12px 18px;
  302. display: block;
  303. width: 100%;
  304. margin: 0;
  305. font-family: "Roboto", sans-serif;
  306. font-size: 15px;
  307. font-weight: 400;
  308. border: none;
  309. border-width: 0px !important;
  310. border-style: solid !important;
  311. }
  312. .form-all .form-buttons-wrapper {
  313. margin-left: 0 !important;
  314. }
  315. .form-all .form-pagebreak-back-container,
  316. .form-all .form-pagebreak-next-container {
  317. width: 48% !important;
  318. padding: 24px 0;
  319. }
  320. .form-all .form-pagebreak-next-container {
  321. margin-left: 4%;
  322. }
  323. .form-all .form-submit-print {
  324. margin-left: 0 !important;
  325. margin-right: 0 !important;
  326. }
  327. .form-all .qq-upload-button,
  328. .form-all .form-submit-button,
  329. .form-all .form-submit-reset,
  330. .form-all .form-submit-print {
  331. color: #ffffff !important;
  332. background: #4285f4;
  333. box-shadow: none;
  334. text-shadow: none;
  335. }
  336. .form-all .form-pagebreak-back,
  337. .form-all .form-pagebreak-next {
  338. font-size: 1em;
  339. padding: 9px 15px;
  340. font-family: "Roboto", sans-serif;
  341. font-size: 14px;
  342. font-weight: normal;
  343. }
  344. /*
  345. & when ( @buttonFontType = google ) {
  346. @import (css) "@{buttonFontLink}";
  347. }
  348. */
  349. h2.form-header {
  350. line-height: 1.618em;
  351. font-size: 1.714em;
  352. }
  353. h2 ~ .form-subHeader {
  354. line-height: 1.5em;
  355. font-size: 1.071em;
  356. }
  357. .form-header-group {
  358. text-align: center;
  359. }
  360. /*.form-dropdown,
  361. .form-radio-item,
  362. .form-checkbox-item,
  363. .form-radio-other-input,
  364. .form-checkbox-other-input,*/
  365. .form-captcha input,
  366. .form-spinner input,
  367. .form-error-message {
  368. padding: 4px 3px 2px 3px;
  369. }
  370. .form-header-group {
  371. font-family: "Roboto", sans-serif;
  372. }
  373. .form-section {
  374. padding: 0px 0px 0px 0px;
  375. }
  376. .form-header-group {
  377. margin: 12px 36px 12px 36px;
  378. }
  379. .form-header-group {
  380. padding: 24px 0px 24px 0px;
  381. }
  382. .form-textbox,
  383. .form-textarea {
  384. border-width: 0px;
  385. border-color: #cccccc;
  386. color: #000000;
  387. padding: 19px 11px 17px 11px;
  388. }
  389. .form-textbox,
  390. .form-textarea,
  391. .form-radio-other-input,
  392. .form-checkbox-other-input,
  393. .form-captcha input,
  394. .form-spinner input {
  395. background-color: #ffffff;
  396. }
  397. .form-textbox {
  398. height: 67px;
  399. }
  400. .form-textarea {
  401. height: 91px;
  402. }
  403. .form-textbox,
  404. .form-textarea {
  405. width: 100%;
  406. max-width: 1000px;
  407. -moz-box-sizing: border-box;
  408. -webkit-box-sizing: border-box;
  409. box-sizing: border-box;
  410. }
  411. [data-type="control_textbox"] .form-input,
  412. [data-type="control_textarea"] .form-input,
  413. [data-type="control_fullname"] .form-input,
  414. [data-type="control_phone"] .form-input,
  415. [data-type="control_datetime"] .form-input,
  416. [data-type="control_address"] .form-input,
  417. [data-type="control_email"] .form-input,
  418. [data-type="control_passwordbox"] .form-input,
  419. [data-type="control_autocomp"] .form-input,
  420. [data-type="control_textbox"] .form-input-wide,
  421. [data-type="control_textarea"] .form-input-wide,
  422. [data-type="control_fullname"] .form-input-wide,
  423. [data-type="control_phone"] .form-input-wide,
  424. [data-type="control_datetime"] .form-input-wide,
  425. [data-type="control_address"] .form-input-wide,
  426. [data-type="control_email"] .form-input-wide,
  427. [data-type="control_passwordbox"] .form-input-wide,
  428. [data-type="control_autocomp"] .form-input-wide {
  429. width: 100%;
  430. max-width: 1000px;
  431. }
  432. [data-type="control_fullname"] .form-sub-label-container {
  433. -moz-box-sizing: border-box;
  434. -webkit-box-sizing: border-box;
  435. box-sizing: border-box;
  436. width: 48%;
  437. }
  438. [data-type="control_fullname"] .form-sub-label-container:first-child {
  439. margin-right: 4%;
  440. }
  441. [data-type="control_phone"] .form-sub-label-container {
  442. width: 65%;
  443. }
  444. [data-type="control_phone"] .form-sub-label-container:first-child {
  445. width: 32.5%;
  446. margin-right: 2.5%;
  447. }
  448. [data-type="control_phone"] .form-sub-label-container .date-separate {
  449. visibility: hidden;
  450. }
  451. [data-type="control_datetime"] .form-sub-label-container {
  452. width: 28%;
  453. margin-right: 4%;
  454. }
  455. [data-type="control_datetime"] .form-sub-label-container:last-child {
  456. width: 4%;
  457. margin-right: 0;
  458. }
  459. [data-type="control_datetime"] .form-sub-label-container .date-separate {
  460. visibility: hidden;
  461. }
  462. [data-type="control_datetime"].allowTime .form-sub-label-container {
  463. width: 12%;
  464. margin-right: 3%;
  465. }
  466. [data-type="control_datetime"].allowTime .form-sub-label-container:last-child {
  467. width: 4%;
  468. margin-right: 0;
  469. }
  470. [data-type="control_datetime"].allowTime .allowTime-container {
  471. float: right;
  472. width: 51%;
  473. }
  474. [data-type="control_datetime"].allowTime .allowTime-container .form-sub-label-container {
  475. width: 27%;
  476. margin-right: 4%;
  477. }
  478. [data-type="control_datetime"].allowTime .allowTime-container .form-sub-label-container:first-child {
  479. width: 4%;
  480. margin-left: 3%;
  481. }
  482. [data-type="control_datetime"].allowTime .allowTime-container .form-sub-label-container:last-child {
  483. width: 27%;
  484. margin-right: 0;
  485. }
  486. [data-type="control_datetime"].allowTime .form-dropdown {
  487. width: 100%;
  488. }
  489. .form-matrix-table {
  490. width: 100%;
  491. max-width: 1000px;
  492. }
  493. .form-address-table {
  494. width: 100%;
  495. max-width: 1000px;
  496. }
  497. .form-address-table td .form-dropdown {
  498. width: 100%;
  499. }
  500. .form-address-table td .form-sub-label-container {
  501. width: 96%;
  502. }
  503. .form-address-table td:last-child .form-sub-label-container {
  504. margin-left: 4%;
  505. }
  506. .form-address-table td[colspan="2"] .form-sub-label-container {
  507. width: 100%;
  508. margin: 0;
  509. }
  510. [data-type="control_dropdown"] .form-input,
  511. [data-type="control_dropdown"] .form-input-wide {
  512. width: 150px;
  513. }
  514. .form-buttons-wrapper {
  515. margin-left: 0 !important;
  516. text-align: center;
  517. }
  518. .form-label {
  519. font-family: "Roboto", sans-serif;
  520. }
  521. li[data-type="control_image"] div {
  522. text-align: left;
  523. }
  524. li[data-type="control_image"] img {
  525. border: none;
  526. border-width: 0px !important;
  527. border-style: solid !important;
  528. border-color: false !important;
  529. }
  530. .form-line-column {
  531. width: auto;
  532. }
  533. .form-line-error {
  534. overflow: hidden;
  535. -webkit-transition-property: none;
  536. -moz-transition-property: none;
  537. -ms-transition-property: none;
  538. -o-transition-property: none;
  539. transition-property: none;
  540. -webkit-transition-duration: 0.3s;
  541. -moz-transition-duration: 0.3s;
  542. -ms-transition-duration: 0.3s;
  543. -o-transition-duration: 0.3s;
  544. transition-duration: 0.3s;
  545. -webkit-transition-timing-function: ease;
  546. -moz-transition-timing-function: ease;
  547. -ms-transition-timing-function: ease;
  548. -o-transition-timing-function: ease;
  549. transition-timing-function: ease;
  550. background-color: #fff4f4;
  551. }
  552. .form-line-error .form-error-message {
  553. background-color: #ff3200;
  554. clear: both;
  555. float: none;
  556. }
  557. .form-line-error .form-error-message .form-error-arrow {
  558. border-bottom-color: #ff3200;
  559. }
  560. .form-line-error input:not(#coupon-input),
  561. .form-line-error textarea,
  562. .form-line-error .form-validation-error {
  563. border: 1px solid #ff3200;
  564. -webkit-box-shadow: 0 0 3px #ff3200;
  565. -moz-box-shadow: 0 0 3px #ff3200;
  566. box-shadow: 0 0 3px #ff3200;
  567. }
  568. .form-all {
  569. position: relative;
  570. }
  571. .form-all:before {
  572. content: "";
  573. background-image: url("https://ton.twitter.com/1.1/ton/data/dm/938011899483975684/938011888163594240/APd40l5N.png");
  574. display: inline-block;
  575. height: 140px;
  576. position: absolute;
  577. background-size: 294px 140px;
  578. background-repeat: no-repeat;
  579. width: 100%;
  580. }
  581. .form-all {
  582. margin-top: 150px !important;
  583. }
  584. .form-all:before {
  585. top: -150px;
  586. background-position: top center;
  587. }
  588. .ie-8 .form-all {
  589. margin-top: auto;
  590. margin-top: initial;
  591. }
  592. .ie-8 .form-all:before {
  593. display: none;
  594. }
  595. [data-type="control_clear"] {
  596. display: none;
  597. }
  598. /* | */
  599. @media screen and (max-width: 480px), screen and (max-device-width: 767px) and (orientation: portrait), screen and (max-device-width: 415px) and (orientation: landscape) {
  600. .testOne {
  601. letter-spacing: 0;
  602. }
  603. .form-all {
  604. border: 0;
  605. max-width: initial;
  606. }
  607. .form-sub-label-container {
  608. width: 100%;
  609. margin: 0;
  610. margin-right: 0;
  611. float: left;
  612. -moz-box-sizing: border-box;
  613. -webkit-box-sizing: border-box;
  614. box-sizing: border-box;
  615. }
  616. span.form-sub-label-container + span.form-sub-label-container {
  617. margin-right: 0;
  618. }
  619. .form-sub-label {
  620. white-space: normal;
  621. }
  622. .form-address-table td,
  623. .form-address-table th {
  624. padding: 0 1px 10px;
  625. }
  626. .form-submit-button,
  627. .form-submit-print,
  628. .form-submit-reset {
  629. width: 100%;
  630. margin-left: 0!important;
  631. }
  632. div[id*=at_] {
  633. font-size: 14px;
  634. font-weight: 700;
  635. height: 8px;
  636. margin-top: 6px;
  637. }
  638. .showAutoCalendar {
  639. width: 20px;
  640. }
  641. img.form-image {
  642. max-width: 100%;
  643. height: auto;
  644. }
  645. .form-matrix-row-headers {
  646. width: 100%;
  647. word-break: break-all;
  648. min-width: 40px;
  649. }
  650. .form-collapse-table,
  651. .form-header-group {
  652. margin: 0;
  653. }
  654. .form-collapse-table {
  655. height: 100%;
  656. display: inline-block;
  657. width: 100%;
  658. }
  659. .form-collapse-hidden {
  660. display: none !important;
  661. }
  662. .form-input {
  663. width: 100%;
  664. }
  665. .form-label {
  666. width: 100% !important;
  667. }
  668. .form-label-left,
  669. .form-label-right {
  670. display: block;
  671. float: none;
  672. text-align: left;
  673. width: auto!important;
  674. }
  675. .form-line,
  676. .form-line.form-line-column {
  677. padding: 2% 5%;
  678. -moz-box-sizing: border-box;
  679. -webkit-box-sizing: border-box;
  680. box-sizing: border-box;
  681. }
  682. input[type=text],
  683. input[type=email],
  684. input[type=tel],
  685. textarea {
  686. width: 100%;
  687. -moz-box-sizing: border-box;
  688. -webkit-box-sizing: border-box;
  689. box-sizing: border-box;
  690. max-width: initial !important;
  691. }
  692. .form-dropdown,
  693. .form-textarea,
  694. .form-textbox {
  695. width: 100%!important;
  696. -moz-box-sizing: border-box;
  697. -webkit-box-sizing: border-box;
  698. box-sizing: border-box;
  699. }
  700. .form-input,
  701. .form-input-wide,
  702. .form-textarea,
  703. .form-textbox,
  704. .form-dropdown {
  705. max-width: initial!important;
  706. }
  707. .form-address-city,
  708. .form-address-line,
  709. .form-address-postal,
  710. .form-address-state,
  711. .form-address-table,
  712. .form-address-table .form-sub-label-container,
  713. .form-address-table select,
  714. .form-input {
  715. width: 100%;
  716. }
  717. div.form-header-group {
  718. padding: 24px 0px !important;
  719. margin: 0 12px 2% !important;
  720. margin-left: 5%!important;
  721. margin-right: 5%!important;
  722. -moz-box-sizing: border-box;
  723. -webkit-box-sizing: border-box;
  724. box-sizing: border-box;
  725. }
  726. div.form-header-group.hasImage img {
  727. max-width: 100%;
  728. }
  729. [data-type="control_button"] {
  730. margin-bottom: 0 !important;
  731. }
  732. [data-type=control_fullname] .form-sub-label-container {
  733. width: 48%;
  734. }
  735. [data-type=control_fullname] .form-sub-label-container:first-child {
  736. margin-right: 4%;
  737. }
  738. [data-type=control_phone] .form-sub-label-container {
  739. width: 65%;
  740. }
  741. [data-type=control_phone] .form-sub-label-container:first-child {
  742. width: 31%;
  743. margin-right: 4%;
  744. }
  745. [data-type=control_datetime] .form-sub-label-container + .form-sub-label-container,
  746. [data-type=control_datetime] .form-sub-label-container:first-child {
  747. width: 27.3%;
  748. margin-right: 6%;
  749. }
  750. [data-type=control_datetime] .form-sub-label-container + .form-sub-label-container + .form-sub-label-container {
  751. width: 33.3%;
  752. margin-right: 0;
  753. }
  754. [data-type=control_datetime] span + span + span > span:first-child {
  755. display: block;
  756. width: 100% !important;
  757. }
  758. [data-type=control_birthdate] .form-sub-label-container,
  759. [data-type=control_datetime] span + span + span > span:first-child + span + span,
  760. [data-type=control_time] .form-sub-label-container {
  761. width: 27.3%!important;
  762. margin-right: 6% !important;
  763. }
  764. [data-type=control_birthdate] .form-sub-label-container:last-child,
  765. [data-type=control_time] .form-sub-label-container:last-child {
  766. width: 33.3%!important;
  767. margin-right: 0 !important;
  768. }
  769. .form-pagebreak-back-container,
  770. .form-pagebreak-next-container {
  771. min-height: 1px;
  772. width: 50% !important;
  773. }
  774. .form-pagebreak-back,
  775. .form-pagebreak-next,
  776. .form-product-item.hover-product-item {
  777. width: 100%;
  778. }
  779. .form-pagebreak-back-container {
  780. padding: 0;
  781. text-align: right;
  782. }
  783. .form-pagebreak-next-container {
  784. padding: 0;
  785. text-align: left;
  786. }
  787. .form-pagebreak {
  788. margin: 0 auto;
  789. }
  790. .form-buttons-wrapper {
  791. margin: 0!important;
  792. margin-left: 0!important;
  793. }
  794. .form-buttons-wrapper button {
  795. width: 100%;
  796. }
  797. .form-buttons-wrapper .form-submit-print {
  798. margin: 0 !important;
  799. }
  800. table {
  801. width: 100%!important;
  802. max-width: initial!important;
  803. }
  804. table td + td {
  805. padding-left: 3%;
  806. }
  807. .form-checkbox-item,
  808. .form-radio-item {
  809. white-space: normal!important;
  810. }
  811. .form-checkbox-item input,
  812. .form-radio-item input {
  813. width: auto;
  814. }
  815. .form-collapse-table {
  816. margin: 0 5%;
  817. display: block;
  818. zoom: 1;
  819. width: auto;
  820. }
  821. .form-collapse-table:before,
  822. .form-collapse-table:after {
  823. display: table;
  824. content: '';
  825. line-height: 0;
  826. }
  827. .form-collapse-table:after {
  828. clear: both;
  829. }
  830. .fb-like-box {
  831. width: 98% !important;
  832. }
  833. .form-error-message {
  834. clear: both;
  835. bottom: -10px;
  836. }
  837. .date-separate,
  838. .phone-separate {
  839. display: none;
  840. }
  841. .custom-field-frame,
  842. .direct-embed-widgets,
  843. .signature-pad-wrapper {
  844. width: 100% !important;
  845. }
  846. }
  847. /* | */
  848.  
  849. /*__INSPECT_SEPERATOR__*/
  850. .form-all {
  851. border-top : 4px solid #FF6C24;
  852. }
  853.  
  854. #input_2:after {
  855. content : '';
  856. position : absolute;
  857. top : 50%;
  858. left : 50%;
  859. width : 5px;
  860. height : 5px;
  861. background : rgba(255, 255, 255, .5);
  862. opacity : 0;
  863. border-radius : 100%;
  864. transform : scale(1, 1) translate(-50%);
  865. transform-origin : 50% 50%;
  866. }
  867.  
  868. .form-textbox {
  869. box-shadow : none;
  870. border : 1px solid #ff6c24;
  871. font-weight : 500;
  872. font-family : Roboto;
  873. font-size : 17px;
  874. background-color : transparent;
  875. font-weight : 300;
  876. transition : .5s;
  877. }
  878.  
  879. button:focus:not(:active)::after {
  880. animation : ripple 1s ease-out;
  881. }
  882.  
  883. .form-line {
  884.  
  885. }
  886.  
  887. .form-label.form-label-top {
  888. font-size : 20px;
  889. }
  890.  
  891. .form-textarea {
  892. box-shadow : none;
  893. border : 1px solid #ff6c24;
  894. font-weight : 500;
  895. font-family : Roboto;
  896. font-size : 17px;
  897. background-color : transparent;
  898. font-weight : 300;
  899. transition : .5s;
  900. }
  901.  
  902. .form-submit-button {
  903. background-color : #4285f4;
  904. font-weight : 400;
  905. text-transform : capitalize;
  906. }
  907.  
  908. #input_2 {
  909. background-color : #4285f4;
  910. color : white;
  911. transition-duration : 0.3s;
  912. font-weight : 500;
  913. text-transform : capitalize;
  914. font-family : Roboto, sans-serif;
  915. }
  916.  
  917. #input_2:hover {
  918. background-color : #386dc4;
  919. transition : .5s;
  920. }
  921.  
  922.  
  923. /* Injected CSS Code */
  924. </style>
  925.  
  926. <form class="jotform-form" action="https://submit.jotform.me/submit/73334060827454/" method="post" name="form_73334060827454" id="73334060827454" accept-charset="utf-8">
  927. <input type="hidden" name="formID" value="73334060827454" />
  928. <div class="form-all">
  929. <ul class="form-section page-section">
  930. <li id="cid_1" class="form-input-wide" data-type="control_head">
  931. <div class="form-header-group ">
  932. <div class="header-text httac htvam">
  933. <h2 id="header_1" class="form-header" data-component="header">
  934. Turned Visuals — Contact Form
  935. </h2>
  936. </div>
  937. </div>
  938. </li>
  939. <li class="form-line" data-type="control_text" id="id_4">
  940. <div id="cid_4" class="form-input-wide">
  941. <div id="text_4" class="form-html" data-component="text">
  942. <p><span style="color: #993366;">*Required</span></p>
  943. </div>
  944. </div>
  945. </li>
  946. <li class="form-line jf-required" data-type="control_textbox" id="id_3">
  947. <label class="form-label form-label-top form-label-auto" id="label_3" for="input_3">
  948. NAME
  949. <span class="form-required">
  950. *
  951. </span>
  952. </label>
  953. <div id="cid_3" class="form-input-wide jf-required">
  954. <input type="text" id="input_3" name="q3_name3" data-type="input-textbox" class="form-textbox validate[required]" size="40" value="" placeholder="Your Name" data-component="textbox" required="" />
  955. </div>
  956. </li>
  957. <li class="form-line jf-required" data-type="control_email" id="id_5">
  958. <label class="form-label form-label-top form-label-auto" id="label_5" for="input_5">
  959. EMAIL
  960. <span class="form-required">
  961. *
  962. </span>
  963. </label>
  964. <div id="cid_5" class="form-input-wide jf-required">
  965. <input type="email" id="input_5" name="q5_email5" class="form-textbox validate[required, Email]" size="1000" value="" placeholder="example@example.com" data-component="email" required="" />
  966. </div>
  967. </li>
  968. <li class="form-line" data-type="control_textbox" id="id_6">
  969. <label class="form-label form-label-top form-label-auto" id="label_6" for="input_6"> TWITTER </label>
  970. <div id="cid_6" class="form-input-wide">
  971. <input type="text" id="input_6" name="q6_twitter6" data-type="input-textbox" class="form-textbox" size="20" value="" placeholder="@TurnedVisuals" data-component="textbox" />
  972. </div>
  973. </li>
  974. <li class="form-line jf-required" data-type="control_textarea" id="id_7">
  975. <label class="form-label form-label-top form-label-auto" id="label_7" for="input_7">
  976. INQUIRY
  977. <span class="form-required">
  978. *
  979. </span>
  980. </label>
  981. <div id="cid_7" class="form-input-wide jf-required">
  982. <textarea id="input_7" class="form-textarea validate[required]" name="q7_inquiry" cols="40" rows="6" data-component="textarea" required=""></textarea>
  983. </div>
  984. </li>
  985. <li class="form-line" data-type="control_button" id="id_2">
  986. <div id="cid_2" class="form-input-wide">
  987. <div style="text-align:center;" class="form-buttons-wrapper">
  988. <button id="input_2" type="submit" class="form-submit-button" data-component="button">
  989. SUBMIT
  990. </button>
  991. </div>
  992. </div>
  993. </li>
  994. <li style="display:none">
  995. Should be Empty:
  996. <input type="text" name="website" value="" />
  997. </li>
  998. </ul>
  999. </div>
  1000. <div class="formFooter-heightMask">
  1001. </div>
  1002. </form>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!