{
    "components": [
        {
            "classes": [
                "of-ribbon-template"
            ],
            "attributes": {
                "id": "izx1"
            },
            "components": [
                {
                    "classes": [
                        "of-ribbon-close-btn",
                        "of-campaign-ribbon-close"
                    ],
                    "attributes": {
                        "id": "i23h"
                    },
                    "components": [
                        {
                            "type": "svg",
                            "resizable": {
                                "ratioDefault": true
                            },
                            "attributes": {
                                "width": "30",
                                "height": "30",
                                "viewBox": "0 0 32 32",
                                "fill": "none",
                                "xmlns": "http://www.w3.org/2000/svg",
                                "id": "i1tg"
                            },
                            "components": [
                                {
                                    "tagName": "mask",
                                    "type": "svg-in",
                                    "resizable": {
                                        "ratioDefault": true
                                    },
                                    "attributes": {
                                        "id": "mask0_2255_1643",
                                        "maskUnits": "userSpaceOnUse",
                                        "x": "0",
                                        "y": "0",
                                        "width": "32",
                                        "height": "32"
                                    },
                                    "components": [
                                        {
                                            "tagName": "rect",
                                            "type": "svg-in",
                                            "resizable": {
                                                "ratioDefault": true
                                            },
                                            "attributes": {
                                                "width": "32",
                                                "height": "32",
                                                "fill": "#D9D9D9"
                                            }
                                        }
                                    ]
                                },
                                {
                                    "tagName": "g",
                                    "type": "svg-in",
                                    "resizable": {
                                        "ratioDefault": true
                                    },
                                    "attributes": {
                                        "mask": "url(#mask0_2255_1643)"
                                    },
                                    "components": [
                                        {
                                            "tagName": "path",
                                            "type": "svg-in",
                                            "resizable": {
                                                "ratioDefault": true
                                            },
                                            "attributes": {
                                                "d": "M9.6 24L8 22.4L14.4 16L8 9.6L9.6 8L16 14.4L22.4 8L24 9.6L17.6 16L24 22.4L22.4 24L16 17.6L9.6 24Z",
                                                "fill": "currentColor"
                                            }
                                        }
                                    ]
                                }
                            ]
                        }
                    ]
                },
                {
                    "name": "Droppable Area",
                    "removable": false,
                    "classes": [
                        "of-ribbon-template-content"
                    ],
                    "attributes": {
                        "id": "iwyoa"
                    },
                    "components": [
                        {
                            "tagName": "span",
                            "type": "text",
                            "attributes": {
                                "id": "ipsaf"
                            },
                            "components": [
                                {
                                    "type": "textnode",
                                    "content": "Receive a FREE shipping coupon immediately!"
                                }
                            ]
                        },
                        {
                            "tagName": "span",
                            "type": "text",
                            "attributes": {
                                "id": "itb71"
                            },
                            "components": [
                                {
                                    "type": "textnode",
                                    "content": "FREE"
                                }
                            ]
                        },
                        {
                            "tagName": "span",
                            "type": "text",
                            "attributes": {
                                "id": "iv53l"
                            },
                            "components": [
                                {
                                    "type": "textnode",
                                    "content": "Shipping"
                                }
                            ]
                        },
                        {
                            "type": "email-subscription-component",
                            "classes": [
                                "email-subscription-component"
                            ],
                            "attributes": {
                                "id": "ihcqz"
                            },
                            "components": [
                                {
                                    "classes": [
                                        "email-subscription-form"
                                    ],
                                    "components": [
                                        {
                                            "tagName": "input",
                                            "type": "default",
                                            "void": true,
                                            "classes": [
                                                "email-subscription-input"
                                            ],
                                            "attributes": {
                                                "type": "email",
                                                "placeholder": "Enter your email address",
                                                "required": true
                                            }
                                        },
                                        {
                                            "tagName": "button",
                                            "type": "text",
                                            "classes": [
                                                "email-subscription-button"
                                            ],
                                            "components": [
                                                {
                                                    "type": "textnode",
                                                    "content": "Subscribe"
                                                }
                                            ]
                                        }
                                    ]
                                },
                                {
                                    "classes": [
                                        "email-subscription-message"
                                    ]
                                }
                            ],
                            "scriptUpdated": 1
                        },
                        {
                            "type": "countdown-component-two",
                            "classes": [
                                "countdown-component-two"
                            ],
                            "attributes": {
                                "days": 1,
                                "id": "countdown-two-c4727"
                            },
                            "components": [
                                {
                                    "components": [
                                        {
                                            "tagName": "span",
                                            "type": "text",
                                            "classes": [
                                                "days"
                                            ],
                                            "attributes": {
                                                "data-type": "days"
                                            },
                                            "components": [
                                                {
                                                    "type": "textnode",
                                                    "content": "00"
                                                }
                                            ]
                                        },
                                        {
                                            "tagName": "span",
                                            "type": "text",
                                            "components": [
                                                {
                                                    "type": "textnode",
                                                    "content": "Days"
                                                }
                                            ]
                                        }
                                    ]
                                },
                                {
                                    "components": [
                                        {
                                            "tagName": "span",
                                            "type": "text",
                                            "classes": [
                                                "hours"
                                            ],
                                            "attributes": {
                                                "data-type": "hours"
                                            },
                                            "components": [
                                                {
                                                    "type": "textnode",
                                                    "content": "00"
                                                }
                                            ]
                                        },
                                        {
                                            "tagName": "span",
                                            "type": "text",
                                            "components": [
                                                {
                                                    "type": "textnode",
                                                    "content": "Hours"
                                                }
                                            ]
                                        }
                                    ]
                                },
                                {
                                    "components": [
                                        {
                                            "tagName": "span",
                                            "type": "text",
                                            "classes": [
                                                "minutes"
                                            ],
                                            "attributes": {
                                                "data-type": "minutes"
                                            },
                                            "components": [
                                                {
                                                    "type": "textnode",
                                                    "content": "00"
                                                }
                                            ]
                                        },
                                        {
                                            "tagName": "span",
                                            "type": "text",
                                            "components": [
                                                {
                                                    "type": "textnode",
                                                    "content": "Minutes"
                                                }
                                            ]
                                        }
                                    ]
                                },
                                {
                                    "attributes": {
                                        "id": "iqokc"
                                    },
                                    "components": [
                                        {
                                            "tagName": "span",
                                            "type": "text",
                                            "classes": [
                                                "seconds"
                                            ],
                                            "attributes": {
                                                "data-type": "seconds"
                                            },
                                            "components": [
                                                {
                                                    "type": "textnode",
                                                    "content": "00"
                                                }
                                            ]
                                        },
                                        {
                                            "tagName": "span",
                                            "type": "text",
                                            "components": [
                                                {
                                                    "type": "textnode",
                                                    "content": "Seconds"
                                                }
                                            ]
                                        }
                                    ]
                                }
                            ],
                            "scriptUpdated": 1
                        },
                        {
                            "type": "comment",
                            "content": " Content will be droppable here "
                        }
                    ]
                }
            ]
        }
    ],
    "styles": [
        {
            "selectors": [
                "of-header"
            ],
            "style": {
                "background-image": "url('http://yocard.test/wp-content/uploads/engage-builder/sa_campaign_677243fabd66a1.55709526.jpg')",
                "background-repeat": "repeat",
                "background-position": "left top",
                "background-attachment": "scroll",
                "background-size": "auto",
                "height": "150px"
            }
        },
        {
            "selectors": [
                "countdown-component"
            ],
            "style": {
                "color": "#fdfdfd"
            }
        },
        {
            "selectors": [
                "#ijw4"
            ],
            "style": {
                "position": "relative"
            },
            "wrapper": 1
        },
        {
            "selectors": [
                {
                    "name": "gjs-row",
                    "private": 1
                }
            ],
            "style": {
                "display": "table",
                "padding-top": "10px",
                "padding-right": "10px",
                "padding-bottom": "10px",
                "padding-left": "10px",
                "width": "100%"
            }
        },
        {
            "selectors": [
                {
                    "name": "gjs-cell",
                    "private": 1
                }
            ],
            "style": {
                "width": "100%",
                "display": "block"
            },
            "mediaText": "(max-width: 768px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "gjs-cell30"
            ],
            "style": {
                "width": "100%",
                "display": "block"
            },
            "mediaText": "(max-width: 768px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "gjs-cell70"
            ],
            "style": {
                "width": "100%",
                "display": "block"
            },
            "mediaText": "(max-width: 768px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                {
                    "name": "gjs-cell",
                    "private": 1
                }
            ],
            "style": {
                "width": "8%",
                "display": "table-cell",
                "height": "75px"
            }
        },
        {
            "selectors": [
                "button",
                "cross-button"
            ],
            "style": {
                "color": "#e60f0f",
                "background-color": "#16ba32",
                "border-radius": "45% 45% 45% 45%"
            }
        },
        {
            "selectors": [
                "#injq"
            ],
            "style": {
                "position": "relative"
            },
            "wrapper": 1
        },
        {
            "selectors": [
                "#mask0_2255_1643"
            ],
            "style": {
                "mask-type": "alpha"
            }
        },
        {
            "selectors": [
                "of-ribbon-template-content"
            ],
            "style": {
                "color": "#312626"
            }
        },
        {
            "selectors": [
                "of-ribbon-template"
            ],
            "style": {
                "background-color": "#cde7f1",
                "height": "120px",
                "background-image": "url('http://xo-student.test/wp-content/uploads/engage-builder/selected-template/26/img/optin_forger_68369e79e81878.72539993.webp')",
                "background-repeat": "repeat",
                "background-position": "left top",
                "background-attachment": "scroll",
                "background-size": "auto"
            }
        },
        {
            "selectors": [
                "#iwyoa"
            ],
            "style": {
                "position": "relative"
            }
        },
        {
            "selectors": [
                "button",
                "copy-button"
            ],
            "style": {
                "color": "#1c3ec8",
                "background-color": "#ffffff",
                "padding": "10px 25px 10px 25px",
                "font-size": "20px",
                "font-weight": "700",
                "border-radius": "10px 10px 10px 10px"
            }
        },
        {
            "selectors": [
                "#i1tg"
            ],
            "style": {
                "left": "NaN%",
                "background-color": "#ea0808"
            },
            "state": "hover"
        },
        {
            "selectors": [
                "#i23h"
            ],
            "style": {
                "position": "absolute"
            },
            "state": "hover"
        },
        {
            "selectors": [
                "days"
            ],
            "style": {
                "color": "#f32b2b"
            }
        },
        {
            "selectors": [
                "hours"
            ],
            "style": {
                "color": "#f32b2b"
            }
        },
        {
            "selectors": [
                "minutes"
            ],
            "style": {
                "color": "#f32b2b"
            }
        },
        {
            "selectors": [
                "seconds"
            ],
            "style": {
                "color": "#f32b2b"
            }
        },
        {
            "selectors": [
                "#i1tg"
            ],
            "style": {
                "background-color": "#ffffff",
                "color": "#312626",
                "border-radius": "50px 50px 50px 50px"
            }
        },
        {
            "selectors": [
                "#izx1"
            ],
            "style": {
                "position": "relative"
            },
            "state": "hover"
        },
        {
            "selectors": [
                "of-ribbon-close-btn",
                "of-campaign-ribbon-close"
            ],
            "style": {
                "position": "absolute"
            }
        },
        {
            "selectors": [
                "#izx1"
            ],
            "style": {
                "position": "relative"
            }
        },
        {
            "selectors": [
                "#i23h"
            ],
            "style": {
                "position": "absolute",
                "left": "96%",
                "top": "9%"
            }
        },
        {
            "selectors": [
                "#iwyoa"
            ],
            "style": {
                "position": "relative"
            },
            "state": "hover"
        },
        {
            "selectors": [
                "#iwyoa"
            ],
            "style": {
                "position": "relative"
            },
            "mediaText": "(max-width: 768px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "countdown-component-two"
            ],
            "style": {
                "font-size": "12px"
            },
            "mediaText": "(max-width: 768px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "button",
                "copy-button"
            ],
            "style": {
                "font-size": "12px"
            },
            "mediaText": "(max-width: 768px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "of-ribbon-template"
            ],
            "style": {
                "height": "300px"
            },
            "mediaText": "(max-width: 320px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "#iwyoa"
            ],
            "style": {
                "position": "relative"
            },
            "mediaText": "(max-width: 320px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "#i1tg"
            ],
            "style": {
                "position": "absolute",
                "left": "NaN%"
            },
            "mediaText": "(max-width: 320px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "#i23h"
            ],
            "style": {
                "position": "relative",
                "width": "20%",
                "top": "14%"
            },
            "mediaText": "(max-width: 320px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "#izx1"
            ],
            "style": {
                "position": "relative"
            },
            "mediaText": "(max-width: 320px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "of-ribbon-template"
            ],
            "style": {
                "height": "120px"
            },
            "mediaText": "(max-width: 768px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "of-ribbon-template"
            ],
            "style": {
                "height": "250px"
            },
            "mediaText": "(max-width: 512px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "#iwyoa"
            ],
            "style": {
                "position": "relative"
            },
            "mediaText": "(max-width: 512px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "#izx1"
            ],
            "style": {
                "position": "relative"
            },
            "mediaText": "(max-width: 512px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "#i23h"
            ],
            "style": {
                "position": "absolute",
                "top": "0%",
                "left": "90%"
            },
            "mediaText": "(max-width: 512px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "button",
                "copy-button"
            ],
            "style": {
                "font-size": "20px"
            },
            "state": "hover"
        },
        {
            "selectors": [
                "email-subscription-component"
            ],
            "style": {
                "background-color": "rgba(0,0,0,0)"
            }
        },
        {
            "selectors": [
                "email-subscription-button"
            ],
            "style": {
                "background-color": "#f30000"
            }
        },
        {
            "selectors": [
                "#ipsaf"
            ],
            "style": {
                "color": "rgb(241, 54, 94)",
                "font-family": "Lato",
                "font-size": "14px",
                "font-weight": "700",
                "text-align": "center",
                "position": "absolute",
                "top": "19px",
                "left": "36.82%"
            }
        },
        {
            "selectors": [
                "#iv53l"
            ],
            "style": {
                "color": "rgb(241, 54, 94)",
                "font-family": "Lobster",
                "font-size": "50px",
                "text-align": "center",
                "position": "absolute",
                "top": "32px",
                "left": "10px"
            }
        },
        {
            "selectors": [
                "#itb71"
            ],
            "style": {
                "color": "rgb(91, 130, 146)",
                "font-family": "Lato",
                "font-size": "18px",
                "font-weight": "900",
                "text-align": "center",
                "position": "absolute",
                "left": "65px",
                "top": "21px"
            }
        },
        {
            "selectors": [
                "#countdown-two-c4727"
            ],
            "style": {
                "position": "absolute",
                "left": "37.59%",
                "top": "35px"
            }
        },
        {
            "selectors": [
                "#ihcqz"
            ],
            "style": {
                "position": "absolute",
                "left": "81.51%"
            }
        },
        {
            "selectors": [
                "#itb71"
            ],
            "style": {
                "font-size": "16px",
                "position": "absolute",
                "left": "35px"
            },
            "mediaText": "(max-width: 768px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "#ipsaf"
            ],
            "style": {
                "font-size": "12px",
                "position": "absolute",
                "left": "32.67%"
            },
            "mediaText": "(max-width: 768px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "#iv53l"
            ],
            "style": {
                "font-size": "40px",
                "position": "absolute",
                "top": "42px"
            },
            "mediaText": "(max-width: 768px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "#countdown-two-c4727"
            ],
            "style": {
                "position": "absolute",
                "left": "31.68%"
            },
            "mediaText": "(max-width: 768px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "#ihcqz"
            ],
            "style": {
                "position": "absolute",
                "left": "71.66%"
            },
            "mediaText": "(max-width: 768px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "of-ribbon-template"
            ],
            "style": {
                "height": "250px"
            },
            "mediaText": "(max-width: 568px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "#iv53l"
            ],
            "style": {
                "position": "absolute",
                "top": "17px",
                "left": "28.03%",
                "font-size": "28px"
            },
            "mediaText": "(max-width: 568px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "#iwyoa"
            ],
            "style": {
                "position": "relative"
            },
            "mediaText": "(max-width: 568px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "#countdown-two-c4727"
            ],
            "style": {
                "position": "absolute",
                "top": "65px",
                "left": "56px"
            },
            "mediaText": "(max-width: 568px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "#ipsaf"
            ],
            "style": {
                "position": "absolute",
                "top": "54px",
                "left": "70px"
            },
            "mediaText": "(max-width: 568px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "#itb71"
            ],
            "style": {
                "position": "absolute",
                "top": "6px",
                "left": "32.51%"
            },
            "mediaText": "(max-width: 568px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "#ihcqz"
            ],
            "style": {
                "position": "absolute",
                "left": "69px",
                "top": "46.40%"
            },
            "mediaText": "(max-width: 568px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "#itb71"
            ],
            "style": {
                "position": "absolute",
                "left": "100px"
            },
            "mediaText": "(max-width: 430px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "#iwyoa"
            ],
            "style": {
                "position": "relative"
            },
            "mediaText": "(max-width: 430px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "#iv53l"
            ],
            "style": {
                "position": "absolute",
                "left": "81px"
            },
            "mediaText": "(max-width: 430px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "#ipsaf"
            ],
            "style": {
                "position": "absolute",
                "left": "20px"
            },
            "mediaText": "(max-width: 430px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "#countdown-two-c4727"
            ],
            "style": {
                "position": "absolute",
                "left": "11px"
            },
            "mediaText": "(max-width: 430px)",
            "atRuleType": "media"
        },
        {
            "selectors": [
                "#ihcqz"
            ],
            "style": {
                "position": "absolute",
                "left": "24px"
            },
            "mediaText": "(max-width: 430px)",
            "atRuleType": "media"
        }
    ]
}