Loading Component...

Loading

More Components

View All
Part of

Delight Payment Success

Oops! Something went wrong while submitting the form.
Delight Payment Success
{"type":"@webflow/XscpData","payload":{"nodes":[{"_id":"d6ffc7b5-a1ba-89c1-8385-ed07469f0e29","type":"Block","tag":"div","classes":["07815991-952a-8d98-0e00-e4c25af27143"],"children":["50bc53f6-3410-4e07-80c4-2bd2c4483f51","5bedfc75-fdd1-45ec-ae44-00007acbe265","e63c9964-544f-2f80-f9ed-911747b82b93"],"data":{"text":false,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"50bc53f6-3410-4e07-80c4-2bd2c4483f51","type":"HtmlEmbed","tag":"div","classes":["e176e94c-6e92-60da-fe02-f1b246007d37"],"children":[],"v":"<style>\n\n/* Make text look crisper and more legible in all browsers */\nbody {\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n font-smoothing: antialiased;\n text-rendering: optimizeLegibility;\n}\n\n/* Focus state style for keyboard navigation for the focusable elements */\n*[tabindex]:focus-visible,\n input[type=\"file\"]:focus-visible {\n outline: 0.125rem solid #4d65ff;\n outline-offset: 0.125rem;\n}\n\n/* Set color style to inherit */\n.inherit-color * {\n color: inherit;\n}\n\n/* Get rid of top margin on first element in any rich text element */\n.w-richtext > :not(div):first-child, .w-richtext > div:first-child > :first-child {\n margin-top: 0 !important;\n}\n\n/* Get rid of bottom margin on last element in any rich text element */\n.w-richtext>:last-child, .w-richtext ol li:last-child, .w-richtext ul li:last-child {\n\tmargin-bottom: 0 !important;\n}\n\n\n/* Make sure containers never lose their center alignment */\n.container-medium,.container-small, .container-large {\n\tmargin-right: auto !important;\n margin-left: auto !important;\n}\n\n/* \nMake the following elements inherit typography styles from the parent and not have hardcoded values. \nImportant: You will not be able to style for example \"All Links\" in Designer with this CSS applied.\nUncomment this CSS to use it in the project. Leave this message for future hand-off.\n*/\n/*\na,\n.w-input,\n.w-select,\n.w-tab-link,\n.w-nav-link,\n.w-dropdown-btn,\n.w-dropdown-toggle,\n.w-dropdown-link {\n color: inherit;\n text-decoration: inherit;\n font-size: inherit;\n}\n*/\n\n/* Apply \"...\" after 3 lines of text */\n.text-style-3lines {\n\tdisplay: -webkit-box;\n\toverflow: hidden;\n\t-webkit-line-clamp: 3;\n\t-webkit-box-orient: vertical;\n}\n\n/* Apply \"...\" after 2 lines of text */\n.text-style-2lines {\n\tdisplay: -webkit-box;\n\toverflow: hidden;\n\t-webkit-line-clamp: 2;\n\t-webkit-box-orient: vertical;\n}\n\n/* These classes are never overwritten */\n.hide {\n display: none !important;\n}\n\n@media screen and (max-width: 991px) {\n .hide, .hide-tablet {\n display: none !important;\n }\n}\n @media screen and (max-width: 767px) {\n .hide-mobile-landscape{\n display: none !important;\n }\n}\n @media screen and (max-width: 479px) {\n .hide-mobile{\n display: none !important;\n }\n}\n \n.margin-0 {\n margin: 0rem !important;\n}\n \n.padding-0 {\n padding: 0rem !important;\n}\n\n.spacing-clean {\npadding: 0rem !important;\nmargin: 0rem !important;\n}\n\n.margin-top {\n margin-right: 0rem !important;\n margin-bottom: 0rem !important;\n margin-left: 0rem !important;\n}\n\n.padding-top {\n padding-right: 0rem !important;\n padding-bottom: 0rem !important;\n padding-left: 0rem !important;\n}\n \n.margin-right {\n margin-top: 0rem !important;\n margin-bottom: 0rem !important;\n margin-left: 0rem !important;\n}\n\n.padding-right {\n padding-top: 0rem !important;\n padding-bottom: 0rem !important;\n padding-left: 0rem !important;\n}\n\n.margin-bottom {\n margin-top: 0rem !important;\n margin-right: 0rem !important;\n margin-left: 0rem !important;\n}\n\n.padding-bottom {\n padding-top: 0rem !important;\n padding-right: 0rem !important;\n padding-left: 0rem !important;\n}\n\n.margin-left {\n margin-top: 0rem !important;\n margin-right: 0rem !important;\n margin-bottom: 0rem !important;\n}\n \n.padding-left {\n padding-top: 0rem !important;\n padding-right: 0rem !important;\n padding-bottom: 0rem !important;\n}\n \n.margin-horizontal {\n margin-top: 0rem !important;\n margin-bottom: 0rem !important;\n}\n\n.padding-horizontal {\n padding-top: 0rem !important;\n padding-bottom: 0rem !important;\n}\n\n.margin-vertical {\n margin-right: 0rem !important;\n margin-left: 0rem !important;\n}\n \n.padding-vertical {\n padding-right: 0rem !important;\n padding-left: 0rem !important;\n}\n\n</style>","data":{"search":{"exclude":true},"embed":{"meta":{"html":"<style>\n\n/* Make text look crisper and more legible in all browsers */\nbody {\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n font-smoothing: antialiased;\n text-rendering: optimizeLegibility;\n}\n\n/* Focus state style for keyboard navigation for the focusable elements */\n*[tabindex]:focus-visible,\n input[type=\"file\"]:focus-visible {\n outline: 0.125rem solid #4d65ff;\n outline-offset: 0.125rem;\n}\n\n/* Set color style to inherit */\n.inherit-color * {\n color: inherit;\n}\n\n/* Get rid of top margin on first element in any rich text element */\n.w-richtext > :not(div):first-child, .w-richtext > div:first-child > :first-child {\n margin-top: 0 !important;\n}\n\n/* Get rid of bottom margin on last element in any rich text element */\n.w-richtext>:last-child, .w-richtext ol li:last-child, .w-richtext ul li:last-child {\n\tmargin-bottom: 0 !important;\n}\n\n\n/* Make sure containers never lose their center alignment */\n.container-medium,.container-small, .container-large {\n\tmargin-right: auto !important;\n margin-left: auto !important;\n}\n\n/* \nMake the following elements inherit typography styles from the parent and not have hardcoded values. \nImportant: You will not be able to style for example \"All Links\" in Designer with this CSS applied.\nUncomment this CSS to use it in the project. Leave this message for future hand-off.\n*/\n/*\na,\n.w-input,\n.w-select,\n.w-tab-link,\n.w-nav-link,\n.w-dropdown-btn,\n.w-dropdown-toggle,\n.w-dropdown-link {\n color: inherit;\n text-decoration: inherit;\n font-size: inherit;\n}\n*/\n\n/* Apply \"...\" after 3 lines of text */\n.text-style-3lines {\n\tdisplay: -webkit-box;\n\toverflow: hidden;\n\t-webkit-line-clamp: 3;\n\t-webkit-box-orient: vertical;\n}\n\n/* Apply \"...\" after 2 lines of text */\n.text-style-2lines {\n\tdisplay: -webkit-box;\n\toverflow: hidden;\n\t-webkit-line-clamp: 2;\n\t-webkit-box-orient: vertical;\n}\n\n/* These classes are never overwritten */\n.hide {\n display: none !important;\n}\n\n@media screen and (max-width: 991px) {\n .hide, .hide-tablet {\n display: none !important;\n }\n}\n @media screen and (max-width: 767px) {\n .hide-mobile-landscape{\n display: none !important;\n }\n}\n @media screen and (max-width: 479px) {\n .hide-mobile{\n display: none !important;\n }\n}\n \n.margin-0 {\n margin: 0rem !important;\n}\n \n.padding-0 {\n padding: 0rem !important;\n}\n\n.spacing-clean {\npadding: 0rem !important;\nmargin: 0rem !important;\n}\n\n.margin-top {\n margin-right: 0rem !important;\n margin-bottom: 0rem !important;\n margin-left: 0rem !important;\n}\n\n.padding-top {\n padding-right: 0rem !important;\n padding-bottom: 0rem !important;\n padding-left: 0rem !important;\n}\n \n.margin-right {\n margin-top: 0rem !important;\n margin-bottom: 0rem !important;\n margin-left: 0rem !important;\n}\n\n.padding-right {\n padding-top: 0rem !important;\n padding-bottom: 0rem !important;\n padding-left: 0rem !important;\n}\n\n.margin-bottom {\n margin-top: 0rem !important;\n margin-right: 0rem !important;\n margin-left: 0rem !important;\n}\n\n.padding-bottom {\n padding-top: 0rem !important;\n padding-right: 0rem !important;\n padding-left: 0rem !important;\n}\n\n.margin-left {\n margin-top: 0rem !important;\n margin-right: 0rem !important;\n margin-bottom: 0rem !important;\n}\n \n.padding-left {\n padding-top: 0rem !important;\n padding-right: 0rem !important;\n padding-bottom: 0rem !important;\n}\n \n.margin-horizontal {\n margin-top: 0rem !important;\n margin-bottom: 0rem !important;\n}\n\n.padding-horizontal {\n padding-top: 0rem !important;\n padding-bottom: 0rem !important;\n}\n\n.margin-vertical {\n margin-right: 0rem !important;\n margin-left: 0rem !important;\n}\n \n.padding-vertical {\n padding-right: 0rem !important;\n padding-left: 0rem !important;\n}\n\n</style>","div":false,"script":false,"compilable":false,"iframe":false},"type":"html"},"insideRTE":false,"devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"visibility":{"conditions":[]}}},{"_id":"5bedfc75-fdd1-45ec-ae44-00007acbe265","type":"Block","tag":"div","classes":["6f91a67f-793d-3c49-b9fd-ccca32f22e4a"],"children":[],"data":{"text":false,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"e63c9964-544f-2f80-f9ed-911747b82b93","type":"Block","tag":"main","classes":["07815991-952a-8d98-0e00-e4c25af27150"],"children":["180a4778-07c0-b18c-c428-846e32a4f539"],"data":{"text":false,"tag":"main","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"180a4778-07c0-b18c-c428-846e32a4f539","type":"Block","tag":"section","classes":["cf43d98c-48d8-bebc-6c99-10f0eb75fadd"],"children":["e1c3372e-b71c-0540-db75-a7da33e28ff2"],"data":{"text":false,"tag":"section","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"e1c3372e-b71c-0540-db75-a7da33e28ff2","type":"Block","tag":"div","classes":["3bd47917-7b2e-01c1-d080-176c28fab2b6"],"children":["9af53c8f-80a3-2dee-383c-85d69873a32c"],"data":{"text":false,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"9af53c8f-80a3-2dee-383c-85d69873a32c","type":"Block","tag":"div","classes":["f83ed2b2-e695-d203-efa1-1f6735d1802e"],"children":["1e83a5f8-88e8-f94f-0e08-593e4a747dcf","a305dbac-aebd-ca88-5538-a6c9cf6b78be"],"data":{"text":false,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"1e83a5f8-88e8-f94f-0e08-593e4a747dcf","type":"Block","tag":"div","classes":["ccf606ae-0365-0f0b-35bd-44b11b47f67d"],"children":["b60bb0e1-2390-99ec-20ec-40353dbb09a5","7a20e9d0-dd8e-e473-f9a1-4865362ef082"],"data":{"text":false,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"b60bb0e1-2390-99ec-20ec-40353dbb09a5","type":"Block","tag":"div","classes":["1527b340-c162-a653-5243-07dfe27aa223"],"children":["91949135-e70d-f831-6114-79c2c7be1b29","3b3b7a9d-7d7f-d6d9-c100-a51ef147844c","f7310a55-7754-4354-67c4-de04df3290f3"],"data":{"text":false,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"91949135-e70d-f831-6114-79c2c7be1b29","type":"Animation","tag":"div","classes":["67b7e2ab-9989-b5b9-3d4a-c4223999edcc"],"children":[],"data":{"tag":"div","animation":{"tag":"lottie","val":{"path":{"src":"https://cdn.prod.website-files.com/6694cb16bd4a496715112792/6694cca4beacaec0f4d48288_x0TudSQdxa.json","origFileName":"x0TudSQdxa.json","totalDuration":2},"renderMode":"svg","loop":false,"playInReverse":false}},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"3b3b7a9d-7d7f-d6d9-c100-a51ef147844c","type":"Heading","tag":"h1","classes":["1a52ed9d-3568-2c91-c456-15dae2535e90"],"children":["59340135-e4d5-21f0-6574-3a3e3992d2e9"],"data":{"tag":"h1","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"59340135-e4d5-21f0-6574-3a3e3992d2e9","text":true,"v":"Payment succeeded!"},{"_id":"f7310a55-7754-4354-67c4-de04df3290f3","type":"Block","tag":"div","classes":["d85ff435-539b-7479-6130-2ec9be69f14d"],"children":["9da6b67f-f8be-3c24-f2fc-4643428c7b89"],"data":{"text":true,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"9da6b67f-f8be-3c24-f2fc-4643428c7b89","text":true,"v":"Your transaction was completed successfully. Thank you for your purchase!"},{"_id":"7a20e9d0-dd8e-e473-f9a1-4865362ef082","type":"Link","tag":"a","classes":["cde87a77-8d4a-eb69-652e-b6138e619180"],"children":["8af21224-515e-1dfa-fcff-51476aee7219"],"data":{"button":true,"block":"","link":{"mode":"external","url":"#"},"eventIds":[],"attr":{"id":""},"devlink":{"runtimeProps":{},"slot":""},"displayName":"","xattr":[],"search":{"exclude":true},"visibility":{"conditions":[]}}},{"_id":"8af21224-515e-1dfa-fcff-51476aee7219","text":true,"v":"Go to Your Dashboard"},{"_id":"a305dbac-aebd-ca88-5538-a6c9cf6b78be","type":"Animation","tag":"div","classes":["d39f16b7-e1ed-e5a8-d91a-45ab33308c8f"],"children":[],"data":{"tag":"div","animation":{"tag":"lottie","val":{"path":{"src":"https://cdn.prod.website-files.com/6694cb16bd4a496715112792/6694e16dc04b5ad8885e171f_7uTpTqBjsY.json","origFileName":"7uTpTqBjsY.json","totalDuration":5.285714285714286},"renderMode":"svg","loop":false,"playInReverse":false}},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}}],"styles":[{"_id":"f83ed2b2-e695-d203-efa1-1f6735d1802e","fake":false,"type":"class","name":"payment_wrap","namespace":"","comb":"","styleLess":"position: relative; z-index: 1; width: 100%; max-width: 500px; margin-right: auto; margin-left: auto; border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; background-color: #333;","variants":{},"children":[],"createdBy":"6628b15266437b0ebcee2531","origin":null,"selector":null},{"_id":"d85ff435-539b-7479-6130-2ec9be69f14d","fake":false,"type":"class","name":"payment_small-text","namespace":"","comb":"","styleLess":"color: hsla(0, 0.00%, 58.67%, 1.00); font-size: 0.875rem; text-align: center;","variants":{},"children":[],"createdBy":"6628b15266437b0ebcee2531","origin":null,"selector":null},{"_id":"1a52ed9d-3568-2c91-c456-15dae2535e90","fake":false,"type":"class","name":"payment_heading","namespace":"","comb":"","styleLess":"font-size: 2rem; text-align: center;","variants":{},"children":[],"createdBy":"6628b15266437b0ebcee2531","origin":null,"selector":null},{"_id":"ccf606ae-0365-0f0b-35bd-44b11b47f67d","fake":false,"type":"class","name":"payment_content-box","namespace":"","comb":"","styleLess":"position: relative; z-index: 4; display: flex; width: 100%; max-width: 500px; margin-right: auto; margin-left: auto; padding-top: 80px; padding-bottom: 80px; flex-direction: column; justify-content: center; flex-wrap: nowrap; align-items: center; grid-column-gap: 25px; grid-row-gap: 25px;","variants":{"tiny":{"styleLess":"padding-top: 40px; padding-bottom: 40px;"}},"children":[],"createdBy":"6628b15266437b0ebcee2531","origin":null,"selector":null},{"_id":"07815991-952a-8d98-0e00-e4c25af27150","fake":false,"type":"class","name":"main-wrapper","namespace":"","comb":"","styleLess":"","variants":{},"children":[],"origin":null,"selector":null},{"_id":"d39f16b7-e1ed-e5a8-d91a-45ab33308c8f","fake":false,"type":"class","name":"payment_lottie-animation-bg","namespace":"","comb":"","styleLess":"position: absolute; left: 0%; top: 0%; right: 0%; bottom: 0%; z-index: 2; width: 100%;","variants":{},"children":[],"createdBy":"6628b15266437b0ebcee2531","origin":null,"selector":null},{"_id":"cde87a77-8d4a-eb69-652e-b6138e619180","fake":false,"type":"class","name":"payment_button","namespace":"","comb":"","styleLess":"position: relative; z-index: 3; display: flex; width: 190px; justify-content: center; align-items: center; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; background-color: #4fc153; box-shadow: 0 2px 5px 0 hsla(0, 0.00%, 100.00%, 0.26); transition-property: all; transition-duration: 300ms; transition-timing-function: ease; font-weight: 600;","variants":{"main_hover":{"styleLess":"box-shadow: 0 0 10px 0 hsla(0, 0.00%, 100.00%, 0.47);"}},"children":[],"createdBy":"6628b15266437b0ebcee2531","origin":null,"selector":null},{"_id":"cf43d98c-48d8-bebc-6c99-10f0eb75fadd","fake":false,"type":"class","name":"section_payment","namespace":"","comb":"","styleLess":"position: relative; z-index: 0; display: flex; width: 100%; min-height: 100svh; flex-direction: column; justify-content: center; background-color: #a1a1a1; color: hsla(0, 0.00%, 100.00%, 1.00);","variants":{"medium":{"styleLess":"padding-top: 3rem;"}},"children":[],"createdBy":"54441c96b0981db6504faf03","origin":null,"selector":null},{"_id":"e176e94c-6e92-60da-fe02-f1b246007d37","fake":false,"type":"class","name":"global-styles","namespace":"","comb":"","styleLess":"position: fixed; left: 0%; top: 0%; right: auto; bottom: auto; display: block;","variants":{},"children":[],"origin":null,"selector":null},{"_id":"1527b340-c162-a653-5243-07dfe27aa223","fake":false,"type":"class","name":"payment_text-wrap","namespace":"","comb":"","styleLess":"display: flex; max-width: 395px; flex-direction: column; justify-content: flex-start; flex-wrap: nowrap; align-items: center; grid-column-gap: 10px; grid-row-gap: 10px;","variants":{},"children":[],"createdBy":"6628b15266437b0ebcee2531","origin":null,"selector":null},{"_id":"07815991-952a-8d98-0e00-e4c25af27143","fake":false,"type":"class","name":"page-wrapper","namespace":"","comb":"","styleLess":"","variants":{},"children":[],"origin":null,"selector":null},{"_id":"3bd47917-7b2e-01c1-d080-176c28fab2b6","fake":false,"type":"class","name":"custom_container","namespace":"","comb":"","styleLess":"padding-right: 20px; padding-left: 20px;","variants":{},"children":[],"createdBy":"6628b15266437b0ebcee2531","origin":null,"selector":null},{"_id":"67b7e2ab-9989-b5b9-3d4a-c4223999edcc","fake":false,"type":"class","name":"payment_lottie-animation","namespace":"","comb":"","styleLess":"display: flex; width: 150px; height: 150px; justify-content: center; align-items: flex-start;","variants":{},"children":[],"createdBy":"6628b15266437b0ebcee2531","origin":null,"selector":null},{"_id":"6f91a67f-793d-3c49-b9fd-ccca32f22e4a","fake":false,"type":"class","name":"nav_fixed","namespace":"","comb":"","styleLess":"position: absolute; left: 0%; top: 0%; right: 0%; bottom: auto;","variants":{},"children":[],"createdBy":"54441c96b0981db6504faf03","origin":null,"selector":null}],"assets":[{"cdnUrl":"https://cdn.prod.website-files.com/6694cb16bd4a496715112792/6694cca4beacaec0f4d48288_x0TudSQdxa.json","siteId":"6694cb16bd4a496715112792","width":0,"isHD":false,"height":0,"fileName":"6694cca4beacaec0f4d48288_x0TudSQdxa.json","createdOn":"2024-07-15T07:15:48.271Z","origFileName":"x0TudSQdxa.json","fileHash":"ca24a1a9fe8b73cb728e6126a3b45714","translationLoading":false,"variants":[],"mimeType":"application/json","s3Url":"https://s3.amazonaws.com/webflow-prod-assets/6694cb16bd4a496715112792/6694cca4beacaec0f4d48288_x0TudSQdxa.json","_id":"6694cca4beacaec0f4d48288","type":"LOTTIE","updatedOn":"2024-07-15T07:15:48.271Z","fileSize":9171,"localizedSettings":{}},{"cdnUrl":"https://cdn.prod.website-files.com/6694cb16bd4a496715112792/6694e16dc04b5ad8885e171f_7uTpTqBjsY.json","siteId":"6694cb16bd4a496715112792","width":0,"isHD":false,"height":0,"fileName":"6694e16dc04b5ad8885e171f_7uTpTqBjsY.json","createdOn":"2024-07-15T08:44:29.808Z","origFileName":"7uTpTqBjsY.json","fileHash":"8fc7b6051941f744af42d0a5268e3d9d","translationLoading":false,"variants":[],"mimeType":"application/json","s3Url":"https://s3.amazonaws.com/webflow-prod-assets/6694cb16bd4a496715112792/6694e16dc04b5ad8885e171f_7uTpTqBjsY.json","_id":"6694e16dc04b5ad8885e171f","type":"LOTTIE","updatedOn":"2024-07-15T08:44:29.808Z","fileSize":64550,"localizedSettings":{}}],"ix1":[],"ix2":{"interactions":[{"id":"i-2","interactionTypeId":"SCROLL_INTO_VIEW_INTERACTION","eventIds":["e-3","e-4"],"target":"6694cb16bd4a49671511282d|1e83a5f8-88e8-f94f-0e08-593e4a747dcf","createdOn":1721032528959},{"id":"i-3","interactionTypeId":"SCROLL_INTO_VIEW_INTERACTION","eventIds":["e-5","e-6"],"target":"6694cb16bd4a49671511282d|a305dbac-aebd-ca88-5538-a6c9cf6b78be","createdOn":1721032621288}],"events":[{"id":"e-3","name":"","animationType":"preset","eventTypeId":"SCROLL_INTO_VIEW","action":{"id":"","actionTypeId":"GROW_EFFECT","instant":false,"config":{"actionListId":"GROW_EFFECT","autoStopEventId":"e-4"}},"mediaQueries":["main","medium","small","tiny"],"target":{"id":"6694cb16bd4a49671511282d|1e83a5f8-88e8-f94f-0e08-593e4a747dcf","appliesTo":"ELEMENT","styleBlockIds":[]},"targets":[{"id":"6694cb16bd4a49671511282d|1e83a5f8-88e8-f94f-0e08-593e4a747dcf","appliesTo":"ELEMENT","styleBlockIds":[]}],"config":{"loop":false,"playInReverse":false,"scrollOffsetValue":0,"scrollOffsetUnit":"%","delay":0,"direction":null,"effectIn":true},"createdOn":1721032528959},{"id":"e-4","name":"","animationType":"preset","eventTypeId":"SCROLL_OUT_OF_VIEW","action":null,"mediaQueries":["main","medium","small","tiny"],"target":{"id":"6694cb16bd4a49671511282d|1e83a5f8-88e8-f94f-0e08-593e4a747dcf","appliesTo":"ELEMENT","styleBlockIds":[]},"targets":[{"id":"6694cb16bd4a49671511282d|1e83a5f8-88e8-f94f-0e08-593e4a747dcf","appliesTo":"ELEMENT","styleBlockIds":[]}],"config":{"loop":false,"playInReverse":false,"scrollOffsetValue":0,"scrollOffsetUnit":"%","delay":null,"direction":null,"effectIn":null},"createdOn":1721032528959},{"id":"e-5","name":"","animationType":"preset","eventTypeId":"SCROLL_INTO_VIEW","action":{"id":"","actionTypeId":"PLUGIN_LOTTIE_EFFECT","instant":false,"config":{"actionListId":"PLUGIN_LOTTIE_EFFECT","autoStopEventId":"e-6"}},"mediaQueries":["main","medium","small","tiny"],"target":{"id":"6694cb16bd4a49671511282d|a305dbac-aebd-ca88-5538-a6c9cf6b78be","appliesTo":"ELEMENT","styleBlockIds":[]},"targets":[{"id":"6694cb16bd4a49671511282d|a305dbac-aebd-ca88-5538-a6c9cf6b78be","appliesTo":"ELEMENT","styleBlockIds":[]}],"config":{"loop":false,"playInReverse":false,"scrollOffsetValue":0,"scrollOffsetUnit":"%","delay":200,"direction":null,"effectIn":null},"createdOn":1721032621288},{"id":"e-6","name":"","animationType":"preset","eventTypeId":"SCROLL_OUT_OF_VIEW","action":null,"mediaQueries":["main","medium","small","tiny"],"target":{"id":"6694cb16bd4a49671511282d|a305dbac-aebd-ca88-5538-a6c9cf6b78be","appliesTo":"ELEMENT","styleBlockIds":[]},"targets":[{"id":"6694cb16bd4a49671511282d|a305dbac-aebd-ca88-5538-a6c9cf6b78be","appliesTo":"ELEMENT","styleBlockIds":[]}],"config":{"loop":false,"playInReverse":false,"scrollOffsetValue":0,"scrollOffsetUnit":"%","delay":null,"direction":null,"effectIn":null},"createdOn":1721032621289}],"actionLists":[]}},"meta":{"droppedLinks":0,"dynBindRemovedCount":0,"dynListBindRemovedCount":0,"paginationRemovedCount":0,"universalBindingsRemovedCount":0,"unlinkedSymbolCount":1}}
Clone in Webflow
Copy Component
{"type":"@webflow/XscpData","payload":{"nodes":[{"_id":"d6ffc7b5-a1ba-89c1-8385-ed07469f0e29","type":"Block","tag":"div","classes":["07815991-952a-8d98-0e00-e4c25af27143"],"children":["50bc53f6-3410-4e07-80c4-2bd2c4483f51","5bedfc75-fdd1-45ec-ae44-00007acbe265","e63c9964-544f-2f80-f9ed-911747b82b93"],"data":{"text":false,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"50bc53f6-3410-4e07-80c4-2bd2c4483f51","type":"HtmlEmbed","tag":"div","classes":["e176e94c-6e92-60da-fe02-f1b246007d37"],"children":[],"v":"<style>\n\n/* Make text look crisper and more legible in all browsers */\nbody {\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n font-smoothing: antialiased;\n text-rendering: optimizeLegibility;\n}\n\n/* Focus state style for keyboard navigation for the focusable elements */\n*[tabindex]:focus-visible,\n input[type=\"file\"]:focus-visible {\n outline: 0.125rem solid #4d65ff;\n outline-offset: 0.125rem;\n}\n\n/* Set color style to inherit */\n.inherit-color * {\n color: inherit;\n}\n\n/* Get rid of top margin on first element in any rich text element */\n.w-richtext > :not(div):first-child, .w-richtext > div:first-child > :first-child {\n margin-top: 0 !important;\n}\n\n/* Get rid of bottom margin on last element in any rich text element */\n.w-richtext>:last-child, .w-richtext ol li:last-child, .w-richtext ul li:last-child {\n\tmargin-bottom: 0 !important;\n}\n\n\n/* Make sure containers never lose their center alignment */\n.container-medium,.container-small, .container-large {\n\tmargin-right: auto !important;\n margin-left: auto !important;\n}\n\n/* \nMake the following elements inherit typography styles from the parent and not have hardcoded values. \nImportant: You will not be able to style for example \"All Links\" in Designer with this CSS applied.\nUncomment this CSS to use it in the project. Leave this message for future hand-off.\n*/\n/*\na,\n.w-input,\n.w-select,\n.w-tab-link,\n.w-nav-link,\n.w-dropdown-btn,\n.w-dropdown-toggle,\n.w-dropdown-link {\n color: inherit;\n text-decoration: inherit;\n font-size: inherit;\n}\n*/\n\n/* Apply \"...\" after 3 lines of text */\n.text-style-3lines {\n\tdisplay: -webkit-box;\n\toverflow: hidden;\n\t-webkit-line-clamp: 3;\n\t-webkit-box-orient: vertical;\n}\n\n/* Apply \"...\" after 2 lines of text */\n.text-style-2lines {\n\tdisplay: -webkit-box;\n\toverflow: hidden;\n\t-webkit-line-clamp: 2;\n\t-webkit-box-orient: vertical;\n}\n\n/* These classes are never overwritten */\n.hide {\n display: none !important;\n}\n\n@media screen and (max-width: 991px) {\n .hide, .hide-tablet {\n display: none !important;\n }\n}\n @media screen and (max-width: 767px) {\n .hide-mobile-landscape{\n display: none !important;\n }\n}\n @media screen and (max-width: 479px) {\n .hide-mobile{\n display: none !important;\n }\n}\n \n.margin-0 {\n margin: 0rem !important;\n}\n \n.padding-0 {\n padding: 0rem !important;\n}\n\n.spacing-clean {\npadding: 0rem !important;\nmargin: 0rem !important;\n}\n\n.margin-top {\n margin-right: 0rem !important;\n margin-bottom: 0rem !important;\n margin-left: 0rem !important;\n}\n\n.padding-top {\n padding-right: 0rem !important;\n padding-bottom: 0rem !important;\n padding-left: 0rem !important;\n}\n \n.margin-right {\n margin-top: 0rem !important;\n margin-bottom: 0rem !important;\n margin-left: 0rem !important;\n}\n\n.padding-right {\n padding-top: 0rem !important;\n padding-bottom: 0rem !important;\n padding-left: 0rem !important;\n}\n\n.margin-bottom {\n margin-top: 0rem !important;\n margin-right: 0rem !important;\n margin-left: 0rem !important;\n}\n\n.padding-bottom {\n padding-top: 0rem !important;\n padding-right: 0rem !important;\n padding-left: 0rem !important;\n}\n\n.margin-left {\n margin-top: 0rem !important;\n margin-right: 0rem !important;\n margin-bottom: 0rem !important;\n}\n \n.padding-left {\n padding-top: 0rem !important;\n padding-right: 0rem !important;\n padding-bottom: 0rem !important;\n}\n \n.margin-horizontal {\n margin-top: 0rem !important;\n margin-bottom: 0rem !important;\n}\n\n.padding-horizontal {\n padding-top: 0rem !important;\n padding-bottom: 0rem !important;\n}\n\n.margin-vertical {\n margin-right: 0rem !important;\n margin-left: 0rem !important;\n}\n \n.padding-vertical {\n padding-right: 0rem !important;\n padding-left: 0rem !important;\n}\n\n</style>","data":{"search":{"exclude":true},"embed":{"meta":{"html":"<style>\n\n/* Make text look crisper and more legible in all browsers */\nbody {\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n font-smoothing: antialiased;\n text-rendering: optimizeLegibility;\n}\n\n/* Focus state style for keyboard navigation for the focusable elements */\n*[tabindex]:focus-visible,\n input[type=\"file\"]:focus-visible {\n outline: 0.125rem solid #4d65ff;\n outline-offset: 0.125rem;\n}\n\n/* Set color style to inherit */\n.inherit-color * {\n color: inherit;\n}\n\n/* Get rid of top margin on first element in any rich text element */\n.w-richtext > :not(div):first-child, .w-richtext > div:first-child > :first-child {\n margin-top: 0 !important;\n}\n\n/* Get rid of bottom margin on last element in any rich text element */\n.w-richtext>:last-child, .w-richtext ol li:last-child, .w-richtext ul li:last-child {\n\tmargin-bottom: 0 !important;\n}\n\n\n/* Make sure containers never lose their center alignment */\n.container-medium,.container-small, .container-large {\n\tmargin-right: auto !important;\n margin-left: auto !important;\n}\n\n/* \nMake the following elements inherit typography styles from the parent and not have hardcoded values. \nImportant: You will not be able to style for example \"All Links\" in Designer with this CSS applied.\nUncomment this CSS to use it in the project. Leave this message for future hand-off.\n*/\n/*\na,\n.w-input,\n.w-select,\n.w-tab-link,\n.w-nav-link,\n.w-dropdown-btn,\n.w-dropdown-toggle,\n.w-dropdown-link {\n color: inherit;\n text-decoration: inherit;\n font-size: inherit;\n}\n*/\n\n/* Apply \"...\" after 3 lines of text */\n.text-style-3lines {\n\tdisplay: -webkit-box;\n\toverflow: hidden;\n\t-webkit-line-clamp: 3;\n\t-webkit-box-orient: vertical;\n}\n\n/* Apply \"...\" after 2 lines of text */\n.text-style-2lines {\n\tdisplay: -webkit-box;\n\toverflow: hidden;\n\t-webkit-line-clamp: 2;\n\t-webkit-box-orient: vertical;\n}\n\n/* These classes are never overwritten */\n.hide {\n display: none !important;\n}\n\n@media screen and (max-width: 991px) {\n .hide, .hide-tablet {\n display: none !important;\n }\n}\n @media screen and (max-width: 767px) {\n .hide-mobile-landscape{\n display: none !important;\n }\n}\n @media screen and (max-width: 479px) {\n .hide-mobile{\n display: none !important;\n }\n}\n \n.margin-0 {\n margin: 0rem !important;\n}\n \n.padding-0 {\n padding: 0rem !important;\n}\n\n.spacing-clean {\npadding: 0rem !important;\nmargin: 0rem !important;\n}\n\n.margin-top {\n margin-right: 0rem !important;\n margin-bottom: 0rem !important;\n margin-left: 0rem !important;\n}\n\n.padding-top {\n padding-right: 0rem !important;\n padding-bottom: 0rem !important;\n padding-left: 0rem !important;\n}\n \n.margin-right {\n margin-top: 0rem !important;\n margin-bottom: 0rem !important;\n margin-left: 0rem !important;\n}\n\n.padding-right {\n padding-top: 0rem !important;\n padding-bottom: 0rem !important;\n padding-left: 0rem !important;\n}\n\n.margin-bottom {\n margin-top: 0rem !important;\n margin-right: 0rem !important;\n margin-left: 0rem !important;\n}\n\n.padding-bottom {\n padding-top: 0rem !important;\n padding-right: 0rem !important;\n padding-left: 0rem !important;\n}\n\n.margin-left {\n margin-top: 0rem !important;\n margin-right: 0rem !important;\n margin-bottom: 0rem !important;\n}\n \n.padding-left {\n padding-top: 0rem !important;\n padding-right: 0rem !important;\n padding-bottom: 0rem !important;\n}\n \n.margin-horizontal {\n margin-top: 0rem !important;\n margin-bottom: 0rem !important;\n}\n\n.padding-horizontal {\n padding-top: 0rem !important;\n padding-bottom: 0rem !important;\n}\n\n.margin-vertical {\n margin-right: 0rem !important;\n margin-left: 0rem !important;\n}\n \n.padding-vertical {\n padding-right: 0rem !important;\n padding-left: 0rem !important;\n}\n\n</style>","div":false,"script":false,"compilable":false,"iframe":false},"type":"html"},"insideRTE":false,"devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"visibility":{"conditions":[]}}},{"_id":"5bedfc75-fdd1-45ec-ae44-00007acbe265","type":"Block","tag":"div","classes":["6f91a67f-793d-3c49-b9fd-ccca32f22e4a"],"children":[],"data":{"text":false,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"e63c9964-544f-2f80-f9ed-911747b82b93","type":"Block","tag":"main","classes":["07815991-952a-8d98-0e00-e4c25af27150"],"children":["180a4778-07c0-b18c-c428-846e32a4f539"],"data":{"text":false,"tag":"main","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"180a4778-07c0-b18c-c428-846e32a4f539","type":"Block","tag":"section","classes":["cf43d98c-48d8-bebc-6c99-10f0eb75fadd"],"children":["e1c3372e-b71c-0540-db75-a7da33e28ff2"],"data":{"text":false,"tag":"section","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"e1c3372e-b71c-0540-db75-a7da33e28ff2","type":"Block","tag":"div","classes":["3bd47917-7b2e-01c1-d080-176c28fab2b6"],"children":["9af53c8f-80a3-2dee-383c-85d69873a32c"],"data":{"text":false,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"9af53c8f-80a3-2dee-383c-85d69873a32c","type":"Block","tag":"div","classes":["f83ed2b2-e695-d203-efa1-1f6735d1802e"],"children":["1e83a5f8-88e8-f94f-0e08-593e4a747dcf","a305dbac-aebd-ca88-5538-a6c9cf6b78be"],"data":{"text":false,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"1e83a5f8-88e8-f94f-0e08-593e4a747dcf","type":"Block","tag":"div","classes":["ccf606ae-0365-0f0b-35bd-44b11b47f67d"],"children":["b60bb0e1-2390-99ec-20ec-40353dbb09a5","7a20e9d0-dd8e-e473-f9a1-4865362ef082"],"data":{"text":false,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"b60bb0e1-2390-99ec-20ec-40353dbb09a5","type":"Block","tag":"div","classes":["1527b340-c162-a653-5243-07dfe27aa223"],"children":["91949135-e70d-f831-6114-79c2c7be1b29","3b3b7a9d-7d7f-d6d9-c100-a51ef147844c","f7310a55-7754-4354-67c4-de04df3290f3"],"data":{"text":false,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"91949135-e70d-f831-6114-79c2c7be1b29","type":"Animation","tag":"div","classes":["67b7e2ab-9989-b5b9-3d4a-c4223999edcc"],"children":[],"data":{"tag":"div","animation":{"tag":"lottie","val":{"path":{"src":"https://cdn.prod.website-files.com/6694cb16bd4a496715112792/6694cca4beacaec0f4d48288_x0TudSQdxa.json","origFileName":"x0TudSQdxa.json","totalDuration":2},"renderMode":"svg","loop":false,"playInReverse":false}},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"3b3b7a9d-7d7f-d6d9-c100-a51ef147844c","type":"Heading","tag":"h1","classes":["1a52ed9d-3568-2c91-c456-15dae2535e90"],"children":["59340135-e4d5-21f0-6574-3a3e3992d2e9"],"data":{"tag":"h1","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"59340135-e4d5-21f0-6574-3a3e3992d2e9","text":true,"v":"Payment succeeded!"},{"_id":"f7310a55-7754-4354-67c4-de04df3290f3","type":"Block","tag":"div","classes":["d85ff435-539b-7479-6130-2ec9be69f14d"],"children":["9da6b67f-f8be-3c24-f2fc-4643428c7b89"],"data":{"text":true,"tag":"div","devlink":{"runtimeProps":{},"slot":""},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}},{"_id":"9da6b67f-f8be-3c24-f2fc-4643428c7b89","text":true,"v":"Your transaction was completed successfully. Thank you for your purchase!"},{"_id":"7a20e9d0-dd8e-e473-f9a1-4865362ef082","type":"Link","tag":"a","classes":["cde87a77-8d4a-eb69-652e-b6138e619180"],"children":["8af21224-515e-1dfa-fcff-51476aee7219"],"data":{"button":true,"block":"","link":{"mode":"external","url":"#"},"eventIds":[],"attr":{"id":""},"devlink":{"runtimeProps":{},"slot":""},"displayName":"","xattr":[],"search":{"exclude":true},"visibility":{"conditions":[]}}},{"_id":"8af21224-515e-1dfa-fcff-51476aee7219","text":true,"v":"Go to Your Dashboard"},{"_id":"a305dbac-aebd-ca88-5538-a6c9cf6b78be","type":"Animation","tag":"div","classes":["d39f16b7-e1ed-e5a8-d91a-45ab33308c8f"],"children":[],"data":{"tag":"div","animation":{"tag":"lottie","val":{"path":{"src":"https://cdn.prod.website-files.com/6694cb16bd4a496715112792/6694e16dc04b5ad8885e171f_7uTpTqBjsY.json","origFileName":"7uTpTqBjsY.json","totalDuration":5.285714285714286},"renderMode":"svg","loop":false,"playInReverse":false}},"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]}}}],"styles":[{"_id":"f83ed2b2-e695-d203-efa1-1f6735d1802e","fake":false,"type":"class","name":"payment_wrap","namespace":"","comb":"","styleLess":"position: relative; z-index: 1; width: 100%; max-width: 500px; margin-right: auto; margin-left: auto; border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; background-color: #333;","variants":{},"children":[],"createdBy":"6628b15266437b0ebcee2531","origin":null,"selector":null},{"_id":"d85ff435-539b-7479-6130-2ec9be69f14d","fake":false,"type":"class","name":"payment_small-text","namespace":"","comb":"","styleLess":"color: hsla(0, 0.00%, 58.67%, 1.00); font-size: 0.875rem; text-align: center;","variants":{},"children":[],"createdBy":"6628b15266437b0ebcee2531","origin":null,"selector":null},{"_id":"1a52ed9d-3568-2c91-c456-15dae2535e90","fake":false,"type":"class","name":"payment_heading","namespace":"","comb":"","styleLess":"font-size: 2rem; text-align: center;","variants":{},"children":[],"createdBy":"6628b15266437b0ebcee2531","origin":null,"selector":null},{"_id":"ccf606ae-0365-0f0b-35bd-44b11b47f67d","fake":false,"type":"class","name":"payment_content-box","namespace":"","comb":"","styleLess":"position: relative; z-index: 4; display: flex; width: 100%; max-width: 500px; margin-right: auto; margin-left: auto; padding-top: 80px; padding-bottom: 80px; flex-direction: column; justify-content: center; flex-wrap: nowrap; align-items: center; grid-column-gap: 25px; grid-row-gap: 25px;","variants":{"tiny":{"styleLess":"padding-top: 40px; padding-bottom: 40px;"}},"children":[],"createdBy":"6628b15266437b0ebcee2531","origin":null,"selector":null},{"_id":"07815991-952a-8d98-0e00-e4c25af27150","fake":false,"type":"class","name":"main-wrapper","namespace":"","comb":"","styleLess":"","variants":{},"children":[],"origin":null,"selector":null},{"_id":"d39f16b7-e1ed-e5a8-d91a-45ab33308c8f","fake":false,"type":"class","name":"payment_lottie-animation-bg","namespace":"","comb":"","styleLess":"position: absolute; left: 0%; top: 0%; right: 0%; bottom: 0%; z-index: 2; width: 100%;","variants":{},"children":[],"createdBy":"6628b15266437b0ebcee2531","origin":null,"selector":null},{"_id":"cde87a77-8d4a-eb69-652e-b6138e619180","fake":false,"type":"class","name":"payment_button","namespace":"","comb":"","styleLess":"position: relative; z-index: 3; display: flex; width: 190px; justify-content: center; align-items: center; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; background-color: #4fc153; box-shadow: 0 2px 5px 0 hsla(0, 0.00%, 100.00%, 0.26); transition-property: all; transition-duration: 300ms; transition-timing-function: ease; font-weight: 600;","variants":{"main_hover":{"styleLess":"box-shadow: 0 0 10px 0 hsla(0, 0.00%, 100.00%, 0.47);"}},"children":[],"createdBy":"6628b15266437b0ebcee2531","origin":null,"selector":null},{"_id":"cf43d98c-48d8-bebc-6c99-10f0eb75fadd","fake":false,"type":"class","name":"section_payment","namespace":"","comb":"","styleLess":"position: relative; z-index: 0; display: flex; width: 100%; min-height: 100svh; flex-direction: column; justify-content: center; background-color: #a1a1a1; color: hsla(0, 0.00%, 100.00%, 1.00);","variants":{"medium":{"styleLess":"padding-top: 3rem;"}},"children":[],"createdBy":"54441c96b0981db6504faf03","origin":null,"selector":null},{"_id":"e176e94c-6e92-60da-fe02-f1b246007d37","fake":false,"type":"class","name":"global-styles","namespace":"","comb":"","styleLess":"position: fixed; left: 0%; top: 0%; right: auto; bottom: auto; display: block;","variants":{},"children":[],"origin":null,"selector":null},{"_id":"1527b340-c162-a653-5243-07dfe27aa223","fake":false,"type":"class","name":"payment_text-wrap","namespace":"","comb":"","styleLess":"display: flex; max-width: 395px; flex-direction: column; justify-content: flex-start; flex-wrap: nowrap; align-items: center; grid-column-gap: 10px; grid-row-gap: 10px;","variants":{},"children":[],"createdBy":"6628b15266437b0ebcee2531","origin":null,"selector":null},{"_id":"07815991-952a-8d98-0e00-e4c25af27143","fake":false,"type":"class","name":"page-wrapper","namespace":"","comb":"","styleLess":"","variants":{},"children":[],"origin":null,"selector":null},{"_id":"3bd47917-7b2e-01c1-d080-176c28fab2b6","fake":false,"type":"class","name":"custom_container","namespace":"","comb":"","styleLess":"padding-right: 20px; padding-left: 20px;","variants":{},"children":[],"createdBy":"6628b15266437b0ebcee2531","origin":null,"selector":null},{"_id":"67b7e2ab-9989-b5b9-3d4a-c4223999edcc","fake":false,"type":"class","name":"payment_lottie-animation","namespace":"","comb":"","styleLess":"display: flex; width: 150px; height: 150px; justify-content: center; align-items: flex-start;","variants":{},"children":[],"createdBy":"6628b15266437b0ebcee2531","origin":null,"selector":null},{"_id":"6f91a67f-793d-3c49-b9fd-ccca32f22e4a","fake":false,"type":"class","name":"nav_fixed","namespace":"","comb":"","styleLess":"position: absolute; left: 0%; top: 0%; right: 0%; bottom: auto;","variants":{},"children":[],"createdBy":"54441c96b0981db6504faf03","origin":null,"selector":null}],"assets":[{"cdnUrl":"https://cdn.prod.website-files.com/6694cb16bd4a496715112792/6694cca4beacaec0f4d48288_x0TudSQdxa.json","siteId":"6694cb16bd4a496715112792","width":0,"isHD":false,"height":0,"fileName":"6694cca4beacaec0f4d48288_x0TudSQdxa.json","createdOn":"2024-07-15T07:15:48.271Z","origFileName":"x0TudSQdxa.json","fileHash":"ca24a1a9fe8b73cb728e6126a3b45714","translationLoading":false,"variants":[],"mimeType":"application/json","s3Url":"https://s3.amazonaws.com/webflow-prod-assets/6694cb16bd4a496715112792/6694cca4beacaec0f4d48288_x0TudSQdxa.json","_id":"6694cca4beacaec0f4d48288","type":"LOTTIE","updatedOn":"2024-07-15T07:15:48.271Z","fileSize":9171,"localizedSettings":{}},{"cdnUrl":"https://cdn.prod.website-files.com/6694cb16bd4a496715112792/6694e16dc04b5ad8885e171f_7uTpTqBjsY.json","siteId":"6694cb16bd4a496715112792","width":0,"isHD":false,"height":0,"fileName":"6694e16dc04b5ad8885e171f_7uTpTqBjsY.json","createdOn":"2024-07-15T08:44:29.808Z","origFileName":"7uTpTqBjsY.json","fileHash":"8fc7b6051941f744af42d0a5268e3d9d","translationLoading":false,"variants":[],"mimeType":"application/json","s3Url":"https://s3.amazonaws.com/webflow-prod-assets/6694cb16bd4a496715112792/6694e16dc04b5ad8885e171f_7uTpTqBjsY.json","_id":"6694e16dc04b5ad8885e171f","type":"LOTTIE","updatedOn":"2024-07-15T08:44:29.808Z","fileSize":64550,"localizedSettings":{}}],"ix1":[],"ix2":{"interactions":[{"id":"i-2","interactionTypeId":"SCROLL_INTO_VIEW_INTERACTION","eventIds":["e-3","e-4"],"target":"6694cb16bd4a49671511282d|1e83a5f8-88e8-f94f-0e08-593e4a747dcf","createdOn":1721032528959},{"id":"i-3","interactionTypeId":"SCROLL_INTO_VIEW_INTERACTION","eventIds":["e-5","e-6"],"target":"6694cb16bd4a49671511282d|a305dbac-aebd-ca88-5538-a6c9cf6b78be","createdOn":1721032621288}],"events":[{"id":"e-3","name":"","animationType":"preset","eventTypeId":"SCROLL_INTO_VIEW","action":{"id":"","actionTypeId":"GROW_EFFECT","instant":false,"config":{"actionListId":"GROW_EFFECT","autoStopEventId":"e-4"}},"mediaQueries":["main","medium","small","tiny"],"target":{"id":"6694cb16bd4a49671511282d|1e83a5f8-88e8-f94f-0e08-593e4a747dcf","appliesTo":"ELEMENT","styleBlockIds":[]},"targets":[{"id":"6694cb16bd4a49671511282d|1e83a5f8-88e8-f94f-0e08-593e4a747dcf","appliesTo":"ELEMENT","styleBlockIds":[]}],"config":{"loop":false,"playInReverse":false,"scrollOffsetValue":0,"scrollOffsetUnit":"%","delay":0,"direction":null,"effectIn":true},"createdOn":1721032528959},{"id":"e-4","name":"","animationType":"preset","eventTypeId":"SCROLL_OUT_OF_VIEW","action":null,"mediaQueries":["main","medium","small","tiny"],"target":{"id":"6694cb16bd4a49671511282d|1e83a5f8-88e8-f94f-0e08-593e4a747dcf","appliesTo":"ELEMENT","styleBlockIds":[]},"targets":[{"id":"6694cb16bd4a49671511282d|1e83a5f8-88e8-f94f-0e08-593e4a747dcf","appliesTo":"ELEMENT","styleBlockIds":[]}],"config":{"loop":false,"playInReverse":false,"scrollOffsetValue":0,"scrollOffsetUnit":"%","delay":null,"direction":null,"effectIn":null},"createdOn":1721032528959},{"id":"e-5","name":"","animationType":"preset","eventTypeId":"SCROLL_INTO_VIEW","action":{"id":"","actionTypeId":"PLUGIN_LOTTIE_EFFECT","instant":false,"config":{"actionListId":"PLUGIN_LOTTIE_EFFECT","autoStopEventId":"e-6"}},"mediaQueries":["main","medium","small","tiny"],"target":{"id":"6694cb16bd4a49671511282d|a305dbac-aebd-ca88-5538-a6c9cf6b78be","appliesTo":"ELEMENT","styleBlockIds":[]},"targets":[{"id":"6694cb16bd4a49671511282d|a305dbac-aebd-ca88-5538-a6c9cf6b78be","appliesTo":"ELEMENT","styleBlockIds":[]}],"config":{"loop":false,"playInReverse":false,"scrollOffsetValue":0,"scrollOffsetUnit":"%","delay":200,"direction":null,"effectIn":null},"createdOn":1721032621288},{"id":"e-6","name":"","animationType":"preset","eventTypeId":"SCROLL_OUT_OF_VIEW","action":null,"mediaQueries":["main","medium","small","tiny"],"target":{"id":"6694cb16bd4a49671511282d|a305dbac-aebd-ca88-5538-a6c9cf6b78be","appliesTo":"ELEMENT","styleBlockIds":[]},"targets":[{"id":"6694cb16bd4a49671511282d|a305dbac-aebd-ca88-5538-a6c9cf6b78be","appliesTo":"ELEMENT","styleBlockIds":[]}],"config":{"loop":false,"playInReverse":false,"scrollOffsetValue":0,"scrollOffsetUnit":"%","delay":null,"direction":null,"effectIn":null},"createdOn":1721032621289}],"actionLists":[]}},"meta":{"droppedLinks":0,"dynBindRemovedCount":0,"dynListBindRemovedCount":0,"paginationRemovedCount":0,"universalBindingsRemovedCount":0,"unlinkedSymbolCount":1}}
Browser not supported. Use
CC Chrome or SS Safari.

About this component

AI Generated

Component Description (Generated by AI)

The Delight Payment Success component provides a celebratory interface featuring a green checkmark, confetti animations, and a prominent 'Go to Your Dashboard' button, enhancing user experience post-transaction.

Key Features:

  • Celebratory UI with animations
  • Green checkmark and confetti effects
  • Clear call-to-action button for navigation
  • Responsive design suitable for various devices
  • Includes Lottie animations for dynamic visuals

Design Elements:

  • Color scheme includes green for success and neutral backgrounds
  • Modern typography with centered text alignment
  • Flexible layout with padding and margin adjustments
  • Use of Lottie animations for engaging visuals

Potential Use Cases:

  • E-commerce websites to confirm successful transactions
  • SaaS platforms for subscription confirmations
  • Event ticketing services to acknowledge successful purchases
  • Donation platforms to thank users for their contributions
  • Any service requiring user transaction feedback

Conclusion: The Delight Payment Success component is a versatile and visually appealing solution for enhancing user satisfaction after transactions, making it ideal for various online businesses.

Start building

Start building your dreams

Memberstack is 100% free until you're ready to launch - so, what are you waiting for? Create your first app and start building today.