{"id":897,"date":"2019-02-09T06:42:00","date_gmt":"2019-02-09T06:42:00","guid":{"rendered":"https:\/\/www.kadenceblocks.com\/?page_id=897"},"modified":"2022-08-01T23:16:02","modified_gmt":"2022-08-02T05:16:02","slug":"modal-block","status":"publish","type":"page","link":"https:\/\/www.kadencewp.com\/kadence-blocks\/pro-past\/modal-block\/","title":{"rendered":"Modal Block"},"content":{"rendered":"<style>#kt-layout-id_5fa49a-d8 > .kt-row-column-wrap{align-content:start;}:where(#kt-layout-id_5fa49a-d8 > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:start;}#kt-layout-id_5fa49a-d8 > .kt-row-column-wrap{column-gap:var(--global-kb-gap-md, 2rem);row-gap:var(--global-kb-gap-md, 2rem);max-width:var( --global-content-width, 1440px );padding-left:var(--global-content-edge-padding);padding-right:var(--global-content-edge-padding);padding-top:var( --global-kb-row-default-top, 25px );padding-bottom:var( --global-kb-row-default-bottom, 25px );padding-top:50px;padding-bottom:50px;grid-template-columns:minmax(0, 1fr);}#kt-layout-id_5fa49a-d8 > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){#kt-layout-id_5fa49a-d8 > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}@media all and (max-width: 767px){#kt-layout-id_5fa49a-d8 > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}@media (max-width: 782px) {  body.kt-modal-open {      \/* when modal active *\/    touch-action: none;    -webkit-overflow-scrolling: none;    overflow: hidden;    \/* Other browsers *\/    overscroll-behavior: none;  }  .kt-modal-container.kt-modal-height-fittocontent {      margin-top: 5vh;      margin-bottom: 5vh;      max-height: 90vh;  }}<\/style>\n<div class=\"wp-block-kadence-rowlayout alignnone\"><div id=\"kt-layout-id_5fa49a-d8\" class=\"kt-row-layout-inner kt-layout-id_5fa49a-d8\"><div class=\"kt-row-column-wrap kt-has-1-columns kt-gutter-default kt-v-gutter-default kt-row-valign-top kt-row-layout-equal kt-tab-layout-inherit kt-m-colapse-left-to-right kt-mobile-layout-row kb-theme-content-width\"><style>.kadence-column_bf2071-2e > .kt-inside-inner-col{border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;}.kadence-column_bf2071-2e > .kt-inside-inner-col,.kadence-column_bf2071-2e > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column_bf2071-2e > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column_bf2071-2e > .kt-inside-inner-col{flex-direction:column;}.kadence-column_bf2071-2e > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column_bf2071-2e > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column_bf2071-2e{position:relative;}@media all and (max-width: 1024px){.kadence-column_bf2071-2e > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column_bf2071-2e > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column inner-column-1 kadence-column_bf2071-2e\"><div class=\"kt-inside-inner-col\">\n<p>Easily create a call to action button that opens a modal box. Include any kind of content within your modal. Customize overlay, animation, size, placement and so much more.<\/p>\n\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading_d4ab3f-77, .wp-block-kadence-advancedheading.kt-adv-heading_d4ab3f-77[data-kb-block=\"kb-adv-heading_d4ab3f-77\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading_d4ab3f-77 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading_d4ab3f-77[data-kb-block=\"kb-adv-heading_d4ab3f-77\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading_d4ab3f-77 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading_d4ab3f-77[data-kb-block=\"kb-adv-heading_d4ab3f-77\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<h2 class=\"kt-adv-heading_d4ab3f-77 wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading_d4ab3f-77\">Examples:<\/h2>\n\n\n<style>#kt-modal_dc2c5d-d6 .kt-blocks-modal-link{color:#555555;background:transparent;border-color:#555555;border-radius:4px;font-size:16px;line-height:24px;border-width:2px 2px 2px 2px;padding:4px 8px 4px 8px;margin:0px 0px 0px 0px;}#kt-modal_dc2c5d-d6 .kt-blocks-modal-link:hover, #kt-modal_dc2c5d-d6 .kt-blocks-modal-link:focus{color:#ffffff;background:#444444;border-color:#444444;}#kt-modal_dc2c5d-d6 .kt-modal-overlay, #kt-target-modal_dc2c5d-d6 .kt-modal-overlay, .kb-modal-content_dc2c5d-d6 .kt-modal-overlay{background:rgba(0, 0, 0, 0.6);}#kt-modal_dc2c5d-d6 .kt-modal-overlay, #kt-target-modal_dc2c5d-d6 .kt-modal-overlay, .kb-modal-content_dc2c5d-d6 .kt-modal-overlay{-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;}#kt-modal_dc2c5d-d6 .kt-modal-container, #kt-target-modal_dc2c5d-d6 .kt-modal-container, .kb-modal-content_dc2c5d-d6 .kt-modal-container{width:100%;max-width:600px;-ms-flex-pack:flex-start;justify-content:flex-start;text-align:left;-ms-flex-align:flex-start;align-items:flex-start;}#kt-modal_dc2c5d-d6 .kt-modal-container, #kt-target-modal_dc2c5d-d6 .kt-modal-container, .kb-modal-content_dc2c5d-d6 .kt-modal-container{padding-top:30px;padding-right:30px;padding-bottom:30px;padding-left:30px;margin-top:20px;margin-right:20px;margin-bottom:20px;margin-left:20px;}#kt-modal_dc2c5d-d6 .kt-modal-container, #kt-target-modal_dc2c5d-d6 .kt-modal-container, .kb-modal-content_dc2c5d-d6 .kt-modal-container{background:#ffffff;border-top:0px solid #ffffff;border-right:0px solid #ffffff;border-bottom:0px solid #ffffff;border-left:0px solid #ffffff;}#kt-modal_dc2c5d-d6 .kt-modal-close svg, #kt-target-modal_dc2c5d-d6 .kt-modal-close svg, .kb-modal-content_dc2c5d-d6 .kt-modal-close svg{width:24px;height:24px;}@media all and (max-width: 1024px){#kt-modal_dc2c5d-d6 .kt-modal-container, #kt-target-modal_dc2c5d-d6 .kt-modal-container, .kb-modal-content_dc2c5d-d6 .kt-modal-container{width:100%;border-top:0px solid #ffffff;border-right:0px solid #ffffff;border-bottom:0px solid #ffffff;border-left:0px solid #ffffff;}}@media all and (max-width: 1024px){#kt-modal_dc2c5d-d6 .kt-modal-close svg, #kt-target-modal_dc2c5d-d6 .kt-modal-close svg, .kb-modal-content_dc2c5d-d6 .kt-modal-close svg{width:24px;height:24px;}}@media all and (max-width: 767px){#kt-modal_dc2c5d-d6 .kt-modal-container, #kt-target-modal_dc2c5d-d6 .kt-modal-container, .kb-modal-content_dc2c5d-d6 .kt-modal-container{width:100%;border-top:0px solid #ffffff;border-right:0px solid #ffffff;border-bottom:0px solid #ffffff;border-left:0px solid #ffffff;}#kt-modal_dc2c5d-d6 .kt-modal-close svg, #kt-target-modal_dc2c5d-d6 .kt-modal-close svg, .kb-modal-content_dc2c5d-d6 .kt-modal-close svg{width:24px;height:24px;}}<\/style>\n<div id=\"kt-modal_dc2c5d-d6\" class=\"wp-block-kadence-modal alignnone kt-modal-linkalign-center\"><div id=\"kt-target-modal_dc2c5d-d6\" class=\"kb-modal-content_dc2c5d-d6 kadence-block-pro-modal kt-m-animate-in-fadeup kt-m-animate-out-fadeout\" aria-hidden=\"true\"><div class=\"kt-modal-overlay\" tabindex=\"-1\" data-modal-close=\"true\"><div class=\"kt-modal-container kt-modal-height-fittocontent kt-close-position-inside\" role=\"dialog\" aria-modal=\"true\"><button class=\"kt-modal-close\" aria-label=\"Close Modal\" data-modal-close=\"true\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" xmlns=\"https:\/\/www.w3.org\/2000\/svg\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\"><\/line><line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\"><\/line><\/svg><\/button><div id=\"kt-modal_dc2c5d-d6-content\" class=\"kt-modal-content\"><style>.wp-block-kadence-advancedheading.kt-adv-heading_f95004-f1, .wp-block-kadence-advancedheading.kt-adv-heading_f95004-f1[data-kb-block=\"kb-adv-heading_f95004-f1\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading_f95004-f1 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading_f95004-f1[data-kb-block=\"kb-adv-heading_f95004-f1\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading_f95004-f1 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading_f95004-f1[data-kb-block=\"kb-adv-heading_f95004-f1\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<h2 class=\"kt-adv-heading_f95004-f1 wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading_f95004-f1\">This is a Basic Modal Block<\/h2>\n\n\n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla varius ac lectus quis laoreet. Sed ante leo, dignissim non condimentum vel, tincidunt id ipsum. Morbi eget egestas neque. Pellentesque sem sapien, consequat id congue ut, dapibus vel purus. Duis at tempor sapien. Nullam tempor convallis augue. Cras vestibulum neque ante, et mollis diam cursus ac. Cras iaculis ornare augue in interdum.<\/p>\n\n\n\n<p>Nulla facilisi. Maecenas nibh erat, elementum id risus sit amet, luctus imperdiet purus. Mauris ultricies tincidunt erat ac congue. Phasellus porttitor velit nec dui fermentum laoreet. Donec pharetra felis non luctus condimentum. Sed pretium mauris commodo, maximus leo vitae, aliquet lorem. Aenean laoreet sagittis egestas. Phasellus et magna sit amet libero imperdiet auctor. In faucibus laoreet fringilla. Cras consequat odio sit amet lorem facilisis, vitae imperdiet erat rutrum. Nunc aliquet metus ut aliquet dignissim.<\/p>\n\n\n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla varius ac lectus quis laoreet. Sed ante leo, dignissim non condimentum vel, tincidunt id ipsum. Morbi eget egestas neque. Pellentesque sem sapien, consequat id congue ut, dapibus vel purus. Duis at tempor sapien. Nullam tempor convallis augue. Cras vestibulum neque ante, et mollis diam cursus ac. Cras iaculis ornare augue in interdum.<\/p>\n<\/div><\/div><\/div><\/div><button class=\"kt-blocks-modal-link kt-modal-label-show\" data-modal-open=\"kt-target-modal_dc2c5d-d6\"><span class=\"kt-blocks-modal-link-inner\">Click to Open<\/span><\/button><\/div>\n\n\n<style>#kt-modal_820d80-e3 .kt-blocks-modal-link{color:#fff;background:#00b5e2;border-color:#555555;border-radius:4px;font-size:16px;line-height:24px;border-width:0px 0px 0px 0px;padding:4px 8px 4px 8px;margin:29px 0px 25px 0px;}#kt-modal_820d80-e3 .kt-blocks-modal-link:hover, #kt-modal_820d80-e3 .kt-blocks-modal-link:focus{color:#fff;background:#14c9f6;border-color:#444444;}#kt-modal_820d80-e3 .kt-modal-overlay, #kt-target-modal_820d80-e3 .kt-modal-overlay, .kb-modal-content_820d80-e3 .kt-modal-overlay{background:#14c9f6;}#kt-modal_820d80-e3 .kt-modal-overlay, #kt-target-modal_820d80-e3 .kt-modal-overlay, .kb-modal-content_820d80-e3 .kt-modal-overlay{-ms-flex-pack:flex-start;justify-content:flex-start;-ms-flex-align:center;align-items:center;}#kt-modal_820d80-e3 .kt-modal-container, #kt-target-modal_820d80-e3 .kt-modal-container, .kb-modal-content_820d80-e3 .kt-modal-container{width:100%;max-width:400px;-ms-flex-pack:flex-start;justify-content:flex-start;text-align:left;-ms-flex-align:center;align-items:center;}#kt-modal_820d80-e3 .kt-modal-overlay, #kt-target-modal_820d80-e3 .kt-modal-overlay, .kb-modal-content_820d80-e3 .kt-modal-overlay{padding:0px 0px 0px 0px;}#kt-modal_820d80-e3 .kt-modal-container, #kt-target-modal_820d80-e3 .kt-modal-container, .kb-modal-content_820d80-e3 .kt-modal-container{padding-top:28px;padding-right:28px;padding-bottom:28px;padding-left:28px;margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;}#kt-modal_820d80-e3 .kt-modal-container, #kt-target-modal_820d80-e3 .kt-modal-container, .kb-modal-content_820d80-e3 .kt-modal-container{background:#ffffff;border-top:0px solid #ffffff;border-right:0px solid #ffffff;border-bottom:0px solid #ffffff;border-left:0px solid #ffffff;}#kt-modal_820d80-e3 .kt-modal-close svg, #kt-target-modal_820d80-e3 .kt-modal-close svg, .kb-modal-content_820d80-e3 .kt-modal-close svg{width:24px;height:24px;}@media all and (max-width: 1024px){#kt-modal_820d80-e3 .kt-modal-container, #kt-target-modal_820d80-e3 .kt-modal-container, .kb-modal-content_820d80-e3 .kt-modal-container{width:100%;border-top:0px solid #ffffff;border-right:0px solid #ffffff;border-bottom:0px solid #ffffff;border-left:0px solid #ffffff;}}@media all and (max-width: 1024px){#kt-modal_820d80-e3 .kt-modal-close svg, #kt-target-modal_820d80-e3 .kt-modal-close svg, .kb-modal-content_820d80-e3 .kt-modal-close svg{width:24px;height:24px;}}@media all and (max-width: 767px){#kt-modal_820d80-e3 .kt-modal-container, #kt-target-modal_820d80-e3 .kt-modal-container, .kb-modal-content_820d80-e3 .kt-modal-container{width:100%;border-top:0px solid #ffffff;border-right:0px solid #ffffff;border-bottom:0px solid #ffffff;border-left:0px solid #ffffff;}#kt-modal_820d80-e3 .kt-modal-close svg, #kt-target-modal_820d80-e3 .kt-modal-close svg, .kb-modal-content_820d80-e3 .kt-modal-close svg{width:24px;height:24px;}}<\/style>\n<div id=\"kt-modal_820d80-e3\" class=\"wp-block-kadence-modal alignnone kt-modal-linkalign-left\"><div id=\"kt-target-modal_820d80-e3\" class=\"kb-modal-content_820d80-e3 kadence-block-pro-modal kt-m-animate-in-slideleft kt-m-animate-out-slideoutleft\" aria-hidden=\"true\"><div class=\"kt-modal-overlay\" tabindex=\"-1\" data-modal-close=\"true\"><div class=\"kt-modal-container kt-modal-height-full kt-close-position-inside\" role=\"dialog\" aria-modal=\"true\"><button class=\"kt-modal-close\" aria-label=\"Close Modal\" data-modal-close=\"true\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" xmlns=\"https:\/\/www.w3.org\/2000\/svg\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\"><\/line><line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\"><\/line><\/svg><\/button><div id=\"kt-modal_820d80-e3-content\" class=\"kt-modal-content\"><style>.wp-block-kadence-advancedheading.kt-adv-heading_afee57-c1, .wp-block-kadence-advancedheading.kt-adv-heading_afee57-c1[data-kb-block=\"kb-adv-heading_afee57-c1\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading_afee57-c1 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading_afee57-c1[data-kb-block=\"kb-adv-heading_afee57-c1\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading_afee57-c1 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading_afee57-c1[data-kb-block=\"kb-adv-heading_afee57-c1\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<h2 class=\"kt-adv-heading_afee57-c1 wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading_afee57-c1\">Left, Full Height<\/h2>\n\n\n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla varius ac lectus quis laoreet. Sed ante leo, dignissim non condimentum vel, tincidunt id ipsum. Morbi eget egestas neque. Pellentesque sem sapien, consequat id congue ut, dapibus vel purus. Duis at tempor sapien. Nullam tempor convallis augue. Cras vestibulum neque ante, et mollis diam cursus ac. Cras iaculis ornare augue in interdum.<\/p>\n\n\n\n<p>Nulla facilisi. Maecenas nibh erat, elementum id risus sit amet, luctus imperdiet purus. Mauris ultricies tincidunt erat ac congue. <\/p>\n<\/div><\/div><\/div><\/div><button class=\"kt-blocks-modal-link kt-modal-label-show\" data-modal-open=\"kt-target-modal_820d80-e3\"><div style=\"display:inline-flex;justify-content:center;align-items:center\" class=\"kt-btn-svg-icon kt-btn-svg-icon-fe_chevronLeft kt-btn-side-left\"><svg style=\"display:inline-block;vertical-align:middle\" viewBox=\"0 0 24 24\" height=\"16\" width=\"16\" fill=\"none\" stroke=\"currentColor\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"15 18 9 12 15 6\"><\/polyline><\/svg><\/div><span class=\"kt-blocks-modal-link-inner\">Align Left<\/span><\/button><\/div>\n\n\n\n<p>Nulla facilisi. Maecenas nibh erat, elementum id risus sit amet, luctus imperdiet purus. Mauris ultricies tincidunt erat ac congue. Phasellus porttitor velit nec dui fermentum laoreet. Donec pharetra felis non luctus condimentum. <a class=\"modal-trigger\" href=\"#custommodal\">Custom Link in Paragraph<\/a> Sed pretium mauris commodo, maximus leo vitae, aliquet lorem. Aenean laoreet sagittis egestas. Phasellus et magna sit amet libero imperdiet auctor. In faucibus laoreet fringilla. Cras consequat odio sit amet lorem facilisis, vitae imperdiet erat rutrum. Nunc aliquet metus ut aliquet dignissim.<\/p>\n\n\n<style>#kt-modal_d097f7-d9 .kt-blocks-modal-link{color:#555555;background:transparent;border-color:#555555;border-radius:4px;font-size:16px;line-height:24px;border-width:2px 2px 2px 2px;padding:4px 8px 4px 8px;margin:0px 0px 0px 0px;}#kt-modal_d097f7-d9 .kt-blocks-modal-link:hover, #kt-modal_d097f7-d9 .kt-blocks-modal-link:focus{color:#ffffff;background:#444444;border-color:#444444;}#kt-modal_d097f7-d9 .kt-modal-overlay, #kt-target-modal_d097f7-d9 .kt-modal-overlay, .kb-modal-content_d097f7-d9 .kt-modal-overlay{background:rgba(0, 181, 226, 0.54);}#kt-modal_d097f7-d9 .kt-modal-overlay, #kt-target-modal_d097f7-d9 .kt-modal-overlay, .kb-modal-content_d097f7-d9 .kt-modal-overlay{-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;}#kt-modal_d097f7-d9 .kt-modal-container, #kt-target-modal_d097f7-d9 .kt-modal-container, .kb-modal-content_d097f7-d9 .kt-modal-container{width:100%;max-width:600px;-ms-flex-pack:flex-start;justify-content:flex-start;text-align:left;-ms-flex-align:flex-start;align-items:flex-start;}#kt-modal_d097f7-d9 .kt-modal-container, #kt-target-modal_d097f7-d9 .kt-modal-container, .kb-modal-content_d097f7-d9 .kt-modal-container{padding-top:30px;padding-right:30px;padding-bottom:30px;padding-left:30px;margin-top:20px;margin-right:20px;margin-bottom:20px;margin-left:20px;}#kt-modal_d097f7-d9 .kt-modal-container, #kt-target-modal_d097f7-d9 .kt-modal-container, .kb-modal-content_d097f7-d9 .kt-modal-container{background:#ffffff;border-top:0px solid #ffffff;border-right:0px solid #ffffff;border-bottom:0px solid #ffffff;border-left:0px solid #ffffff;}#kt-modal_d097f7-d9 .kt-modal-close svg, #kt-target-modal_d097f7-d9 .kt-modal-close svg, .kb-modal-content_d097f7-d9 .kt-modal-close svg{width:24px;height:24px;}@media all and (max-width: 1024px){#kt-modal_d097f7-d9 .kt-modal-container, #kt-target-modal_d097f7-d9 .kt-modal-container, .kb-modal-content_d097f7-d9 .kt-modal-container{width:100%;border-top:0px solid #ffffff;border-right:0px solid #ffffff;border-bottom:0px solid #ffffff;border-left:0px solid #ffffff;}}@media all and (max-width: 1024px){#kt-modal_d097f7-d9 .kt-modal-close svg, #kt-target-modal_d097f7-d9 .kt-modal-close svg, .kb-modal-content_d097f7-d9 .kt-modal-close svg{width:24px;height:24px;}}@media all and (max-width: 767px){#kt-modal_d097f7-d9 .kt-modal-container, #kt-target-modal_d097f7-d9 .kt-modal-container, .kb-modal-content_d097f7-d9 .kt-modal-container{width:100%;border-top:0px solid #ffffff;border-right:0px solid #ffffff;border-bottom:0px solid #ffffff;border-left:0px solid #ffffff;}#kt-modal_d097f7-d9 .kt-modal-close svg, #kt-target-modal_d097f7-d9 .kt-modal-close svg, .kb-modal-content_d097f7-d9 .kt-modal-close svg{width:24px;height:24px;}}<\/style>\n<div id=\"kt-modal_d097f7-d9\" class=\"wp-block-kadence-modal alignnone kt-modal-linkalign-center\"><div id=\"custommodal\" class=\"kb-modal-content_d097f7-d9 kadence-block-pro-modal kt-m-animate-in-zoomin kt-m-animate-out-zoomout\" aria-hidden=\"true\"><div class=\"kt-modal-overlay\" tabindex=\"-1\" data-modal-close=\"true\"><div class=\"kt-modal-container kt-modal-height-fittocontent kt-close-position-inside\" role=\"dialog\" aria-modal=\"true\"><button class=\"kt-modal-close\" aria-label=\"Close Modal\" data-modal-close=\"true\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" xmlns=\"https:\/\/www.w3.org\/2000\/svg\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\"><\/line><line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\"><\/line><\/svg><\/button><div id=\"kt-modal_d097f7-d9-content\" class=\"kt-modal-content\"><style>.wp-block-kadence-advancedheading.kt-adv-heading_5fd8fd-cd, .wp-block-kadence-advancedheading.kt-adv-heading_5fd8fd-cd[data-kb-block=\"kb-adv-heading_5fd8fd-cd\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading_5fd8fd-cd mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading_5fd8fd-cd[data-kb-block=\"kb-adv-heading_5fd8fd-cd\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading_5fd8fd-cd img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading_5fd8fd-cd[data-kb-block=\"kb-adv-heading_5fd8fd-cd\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<h2 class=\"kt-adv-heading_5fd8fd-cd wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading_5fd8fd-cd\">This can open with a custom link<\/h2>\n\n\n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla varius ac lectus quis laoreet. Sed ante leo, dignissim non condimentum vel, tincidunt id ipsum. Morbi eget egestas neque. Pellentesque sem sapien, consequat id congue ut, dapibus vel purus. Duis at tempor sapien. Nullam tempor convallis augue. Cras vestibulum neque ante, et mollis diam cursus ac. Cras iaculis ornare augue in interdum.<\/p>\n\n\n\n<p>Nulla facilisi. Maecenas nibh erat, elementum id risus sit amet, luctus imperdiet purus. Mauris ultricies tincidunt erat ac congue. Phasellus porttitor velit nec dui fermentum laoreet. Donec pharetra felis non luctus condimentum. Sed pretium mauris commodo, maximus leo vitae, aliquet lorem. Aenean laoreet sagittis egestas. Phasellus et magna sit amet libero imperdiet auctor. In faucibus laoreet fringilla. Cras consequat odio sit amet lorem facilisis, vitae imperdiet erat rutrum. Nunc aliquet metus ut aliquet dignissim.<\/p>\n<\/div><\/div><\/div><\/div><\/div>\n\n\n<style>#kt-modal_3adad2-22 .kt-blocks-modal-link{color:#fff;background:#3f8ce4;border-radius:155px;font-size:40px;line-height:50px;border-width:0px 0px 0px 0px;padding:10px 10px 10px 10px;margin:50px 50px 50px 50px;}#kt-modal_3adad2-22 .kt-blocks-modal-link:hover, #kt-modal_3adad2-22 .kt-blocks-modal-link:focus{color:#fff;background:#3376c2;border-color:#444444;}#kt-modal_3adad2-22 .kt-modal-overlay, #kt-target-modal_3adad2-22 .kt-modal-overlay, .kb-modal-content_3adad2-22 .kt-modal-overlay{background:rgba(255, 255, 255, 0.6);}#kt-modal_3adad2-22 .kt-modal-overlay, #kt-target-modal_3adad2-22 .kt-modal-overlay, .kb-modal-content_3adad2-22 .kt-modal-overlay{-ms-flex-pack:center;justify-content:center;-ms-flex-align:flex-end;align-items:flex-end;}#kt-modal_3adad2-22 .kt-modal-container, #kt-target-modal_3adad2-22 .kt-modal-container, .kb-modal-content_3adad2-22 .kt-modal-container{width:100%;max-width:3000px;-ms-flex-pack:flex-start;justify-content:flex-start;text-align:left;-ms-flex-align:center;align-items:center;}#kt-modal_3adad2-22 .kt-modal-container, #kt-target-modal_3adad2-22 .kt-modal-container, .kb-modal-content_3adad2-22 .kt-modal-container{padding-top:1px;padding-right:1px;padding-bottom:1px;padding-left:1px;margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;}#kt-modal_3adad2-22 .kt-modal-container, #kt-target-modal_3adad2-22 .kt-modal-container, .kb-modal-content_3adad2-22 .kt-modal-container{background:#ffffff;border-top:0px solid #ffffff;border-right:0px solid #ffffff;border-bottom:0px solid #ffffff;border-left:0px solid #ffffff;}#kt-modal_3adad2-22 .kt-modal-close svg, #kt-target-modal_3adad2-22 .kt-modal-close svg, .kb-modal-content_3adad2-22 .kt-modal-close svg{width:24px;height:24px;}@media all and (max-width: 1024px){#kt-modal_3adad2-22 .kt-modal-container, #kt-target-modal_3adad2-22 .kt-modal-container, .kb-modal-content_3adad2-22 .kt-modal-container{width:100%;border-top:0px solid #ffffff;border-right:0px solid #ffffff;border-bottom:0px solid #ffffff;border-left:0px solid #ffffff;}}@media all and (max-width: 1024px){#kt-modal_3adad2-22 .kt-modal-close svg, #kt-target-modal_3adad2-22 .kt-modal-close svg, .kb-modal-content_3adad2-22 .kt-modal-close svg{width:24px;height:24px;}}@media all and (max-width: 767px){#kt-modal_3adad2-22 .kt-modal-container, #kt-target-modal_3adad2-22 .kt-modal-container, .kb-modal-content_3adad2-22 .kt-modal-container{width:100%;border-top:0px solid #ffffff;border-right:0px solid #ffffff;border-bottom:0px solid #ffffff;border-left:0px solid #ffffff;}#kt-modal_3adad2-22 .kt-modal-close svg, #kt-target-modal_3adad2-22 .kt-modal-close svg, .kb-modal-content_3adad2-22 .kt-modal-close svg{width:24px;height:24px;}}<\/style>\n<div id=\"kt-modal_3adad2-22\" class=\"wp-block-kadence-modal alignnone kt-modal-linkalign-center\"><div id=\"kt-target-modal_3adad2-22\" class=\"kb-modal-content_3adad2-22 kadence-block-pro-modal kt-m-animate-in-slideup kt-m-animate-out-slideoutdown\" aria-hidden=\"true\"><div class=\"kt-modal-overlay\" tabindex=\"-1\" data-modal-close=\"true\"><div class=\"kt-modal-container kt-modal-height-fittocontent kt-close-position-inside\" role=\"dialog\" aria-modal=\"true\"><button class=\"kt-modal-close\" aria-label=\"Close Modal\" data-modal-close=\"true\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" xmlns=\"https:\/\/www.w3.org\/2000\/svg\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\"><\/line><line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\"><\/line><\/svg><\/button><div id=\"kt-modal_3adad2-22-content\" class=\"kt-modal-content\"><style>#kt-layout-id_439a84-d7 > .kt-row-column-wrap{align-content:center;}:where(#kt-layout-id_439a84-d7 > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:center;}#kt-layout-id_439a84-d7 > .kt-row-column-wrap{column-gap:var(--global-kb-gap-md, 2rem);row-gap:var(--global-kb-gap-md, 2rem);padding-top:var( --global-kb-row-default-top, 25px );padding-bottom:var( --global-kb-row-default-bottom, 25px );padding-top:50px;padding-bottom:50px;grid-template-columns:minmax(0, 1fr);}#kt-layout-id_439a84-d7{background-color:#3f8ce4;background-image:url('https:\/\/dev.kadenceblocks.com\/wp-content\/uploads\/2019\/02\/benjamin-voros-575800-unsplash.jpg');background-size:cover;background-position:center center;background-attachment:scroll;background-repeat:no-repeat;}#kt-layout-id_439a84-d7 > .kt-row-layout-overlay{opacity:0.60;background-image:linear-gradient(170deg, #f708ad 0%, #14c9f6 100%);mix-blend-mode:color;}@media all and (max-width: 1024px){#kt-layout-id_439a84-d7 > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}@media all and (max-width: 767px){#kt-layout-id_439a84-d7 > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}<\/style>\n<div class=\"wp-block-kadence-rowlayout alignfull\"><div id=\"kt-layout-id_439a84-d7\" class=\"kt-row-layout-inner kt-row-has-bg kt-layout-id_439a84-d7\"><div class=\"kt-row-layout-overlay kt-row-overlay-gradient\"><\/div><div class=\"kt-row-column-wrap kt-has-1-columns kt-gutter-default kt-v-gutter-default kt-row-valign-middle kt-row-layout-equal kt-tab-layout-inherit kt-m-colapse-left-to-right kt-mobile-layout-row\"><style>.kadence-column_e39edb-3d > .kt-inside-inner-col{border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;}.kadence-column_e39edb-3d > .kt-inside-inner-col,.kadence-column_e39edb-3d > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column_e39edb-3d > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column_e39edb-3d > .kt-inside-inner-col{flex-direction:column;}.kadence-column_e39edb-3d > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column_e39edb-3d > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column_e39edb-3d{position:relative;}@media all and (max-width: 1024px){.kadence-column_e39edb-3d > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column_e39edb-3d > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column inner-column-1 kadence-column_e39edb-3d\"><div class=\"kt-inside-inner-col\"><style>.wp-block-kadence-advancedheading.kt-adv-heading_d01c1b-96, .wp-block-kadence-advancedheading.kt-adv-heading_d01c1b-96[data-kb-block=\"kb-adv-heading_d01c1b-96\"]{font-style:normal;color:#fff;}.wp-block-kadence-advancedheading.kt-adv-heading_d01c1b-96 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading_d01c1b-96[data-kb-block=\"kb-adv-heading_d01c1b-96\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading_d01c1b-96 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading_d01c1b-96[data-kb-block=\"kb-adv-heading_d01c1b-96\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<h2 class=\"kt-adv-heading_d01c1b-96 wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading_d01c1b-96\">Use an Icon to open the Modal<\/h2>\n\n\n\n<p class=\"has-white-color has-text-color\">Nulla facilisi. Maecenas nibh erat, elementum id risus sit amet, luctus imperdiet purus. Mauris ultricies tincidunt erat ac congue. Phasellus porttitor velit nec dui fermentum laoreet. Donec pharetra felis non luctus condimentum. Sed pretium mauris commodo, maximus leo vitae, aliquet lorem. Aenean laoreet sagittis egestas. Phasellus et magna sit amet libero imperdiet auctor. In faucibus laoreet fringilla. Cras consequat odio sit amet lorem facilisis, vitae imperdiet erat rutrum. Nunc aliquet metus ut aliquet dignissim.<\/p>\n<\/div><\/div>\n<\/div><\/div><\/div>\n<\/div><\/div><\/div><\/div><button class=\"kt-blocks-modal-link kt-modal-label-hide\" data-modal-open=\"kt-target-modal_3adad2-22\"><span class=\"kt-blocks-modal-link-inner\">Learn More<\/span><div style=\"display:inline-flex;justify-content:center;align-items:center\" class=\"kt-btn-svg-icon kt-btn-svg-icon-fas_info-circle kt-btn-side-right\"><svg style=\"display:inline-block;vertical-align:middle\" viewBox=\"0 0 512 512\" height=\"40\" width=\"40\" fill=\"currentColor\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z\"><\/path><\/svg><\/div><\/button><\/div>\n<\/div><\/div>\n<\/div><\/div><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Easily create a call to action button that opens a modal box. Include any kind of content within your modal. Customize overlay, animation, size, placement and so much more. Examples: Nulla facilisi. Maecenas nibh erat, elementum id risus sit amet, luctus imperdiet purus. Mauris ultricies tincidunt erat ac congue. Phasellus porttitor velit nec dui fermentum&#8230;<\/p>\n","protected":false},"author":1265,"featured_media":0,"parent":2342,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_kad_blocks_custom_css":"","_kad_blocks_head_custom_js":"","_kad_blocks_body_custom_js":"","_kad_blocks_footer_custom_js":"","_kadence_starter_templates_imported_post":false,"_kad_post_transparent":"enable","_kad_post_title":"show","_kad_post_layout":"","_kad_post_sidebar_id":"","_kad_post_content_style":"","_kad_post_vertical_padding":"","_kad_post_feature":"","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"_kad_post_classname":"","footnotes":""},"class_list":["post-897","page","type-page","status-publish","hentry"],"taxonomy_info":[],"featured_image_src_large":false,"author_info":{"display_name":"Ben Ritner","author_link":"https:\/\/www.kadencewp.com\/kadence-blocks\/author\/britner\/"},"comment_info":0,"_links":{"self":[{"href":"https:\/\/www.kadencewp.com\/kadence-blocks\/wp-json\/wp\/v2\/pages\/897","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.kadencewp.com\/kadence-blocks\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.kadencewp.com\/kadence-blocks\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.kadencewp.com\/kadence-blocks\/wp-json\/wp\/v2\/users\/1265"}],"replies":[{"embeddable":true,"href":"https:\/\/www.kadencewp.com\/kadence-blocks\/wp-json\/wp\/v2\/comments?post=897"}],"version-history":[{"count":8,"href":"https:\/\/www.kadencewp.com\/kadence-blocks\/wp-json\/wp\/v2\/pages\/897\/revisions"}],"predecessor-version":[{"id":5162,"href":"https:\/\/www.kadencewp.com\/kadence-blocks\/wp-json\/wp\/v2\/pages\/897\/revisions\/5162"}],"up":[{"embeddable":true,"href":"https:\/\/www.kadencewp.com\/kadence-blocks\/wp-json\/wp\/v2\/pages\/2342"}],"wp:attachment":[{"href":"https:\/\/www.kadencewp.com\/kadence-blocks\/wp-json\/wp\/v2\/media?parent=897"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}