{"id":6,"date":"2023-07-17T14:28:10","date_gmt":"2023-07-17T14:28:10","guid":{"rendered":"https:\/\/themes.getresi.com\/tracy\/?page_id=6"},"modified":"2025-08-08T14:12:30","modified_gmt":"2025-08-08T14:12:30","slug":"style","status":"publish","type":"page","link":"https:\/\/themes.getresi.com\/tracy\/style\/","title":{"rendered":"Style"},"content":{"rendered":"<p><img decoding=\"async\" src=\"\/tracy\/wp-content\/uploads\/2021\/09\/resi-logo-primary.svg\" alt=\"\"><\/p>\n<div>\n<ul class=\"uk-nav uk-nav-primary\" uk-scrollspy-nav=\"closest: li; scroll: true; offset: 70;\">\n<li><a href=\"#logo\">Logo<\/a><\/li>\n<li><a href=\"#colors\">Colors<\/a><\/li>\n<li><a href=\"#typography\">Typography<\/a><\/li>\n<li><a href=\"#lists\">Lists<\/a><\/li>\n<li><a href=\"#buttons\">Buttons<\/a><\/li>\n<li><a href=\"#width\">Widths<\/a><\/li>\n<li><a href=\"#cards\">Cards<\/a><\/li>\n<li><a href=\"#tiles\">Tiles<\/a><\/li>\n<li><a href=\"#forms\">Forms<\/a><\/li>\n<li><a href=\"#overlay\">Overlay<\/a><\/li>\n<li><a href=\"#slider\">Slider<\/a><\/li>\n<li><a href=\"#transitions\">Transitions<\/a>\n<li><a href=\"#decorations\">Decorations<\/a><\/li>\n<\/ul>\n<\/div>\n<h2>Logo<\/h2>\n<ul>\n<li>\n<p>        <img decoding=\"async\" src=\"\/tracy\/wp-content\/uploads\/sites\/21\/2023\/07\/tracy-logo-onyx.svg\" alt=\"Tracy Primary Logo\"><\/p>\n<h3>Logo Primary<\/h3>\n<\/li>\n<li>\n<p>        <img decoding=\"async\" src=\"\/tracy\/wp-content\/uploads\/sites\/21\/2023\/07\/tracy-logo-mark-inverse.svg\" alt=\"Tracy Logo Inverse\"><\/p>\n<h3>Logo Inverse<\/h3>\n<\/li>\n<\/ul>\n<ul>\n<li>\n<p>        <img decoding=\"async\" src=\"\/tracy\/wp-content\/uploads\/sites\/21\/2023\/07\/tracy-logo-mark-onyx.svg\" alt=\"Tracy Logo Mark Onyx\"><\/p>\n<h3>Logo Mark<\/h3>\n<\/li>\n<li>\n<p>        <img decoding=\"async\" src=\"\/tracy\/wp-content\/uploads\/sites\/21\/2023\/07\/tracy-logo-inverse.svg\" alt=\"Tracy Logo Mark Inverse\"><\/p>\n<h3>Logo Mark Inverse<\/h3>\n<\/li>\n<\/ul>\n<hr>\n<h2>Colors<\/h2>\n<ul>\n<li>\n<h3>Cararra<\/h3>\n<\/li>\n<li>\n<h3>Onyx<\/h3>\n<\/li>\n<li>\n<h3>Canyon<\/h3>\n<\/li>\n<li>\n<h3>Jute<\/h3>\n<\/li>\n<\/ul>\n<hr>\n<h2>Typography<\/h2>\n<ul>\n<li>\n<h4>Primary Font<\/h4>\n<p>Newsreader<\/p>\n<div>\n<div class=\"uk-font-primary uk-text-large\">\nABCDEFGHIJKLMNOPQRSTUVWXYZ<br \/>\nabcdefghijklmnopqrstuvwxyz\n<\/div>\n<\/div>\n<\/li>\n<li>\n<h4>Secondary Font<\/h4>\n<p><span class=\"uk-font-secondary\">Sweet Sans Pro<\/span><\/p>\n<div>\n<div class=\"uk-font-secondary uk-text-large\">\nABCDEFGHIJKLMNOPQRSTUVWXYZ<br \/>\nabcdefghijklmnopqrstuvwxyz\n<\/div>\n<\/div>\n<\/li>\n<\/ul>\n<ul>\n<li>\n<h4>Primary Font<\/h4>\n<p>Newsreader<\/p>\n<div>\n<div class=\"uk-font-primary uk-text-large\">\nABCDEFGHIJKLMNOPQRSTUVWXYZ<br \/>\nabcdefghijklmnopqrstuvwxyz\n<\/div>\n<\/div>\n<\/li>\n<li>\n<h4>Secondary Font<\/h4>\n<p><span class=\"uk-font-secondary\">Sweet Sans Pro<\/span><\/p>\n<div>\n<div class=\"uk-font-secondary uk-text-large\">\nABCDEFGHIJKLMNOPQRSTUVWXYZ<br \/>\nabcdefghijklmnopqrstuvwxyz\n<\/div>\n<\/div>\n<\/li>\n<\/ul>\n<div>\n<div class=\"uk-child-width-1-2 uk-child-width-1-4@s uk-margin-large uk-grid\" uk-grid=\"\">\n<div class=\"uk-first-column\">\n<ul class=\"uk-list\">\n<li><a href=\"#\">a element<\/a><\/li>\n<li><abbr title=\"Title text\">abbr element<\/abbr><\/li>\n<li><code>code element<\/code><\/li>\n<li><del>del element<\/del><\/li>\n<li><dfn title=\"Title text\">dfn element<\/dfn><\/li>\n<li><a href=\"#\" class=\"uk-link-muted\">Link Muted<\/a><\/li>\n<\/ul><\/div>\n<div>\n<ul class=\"uk-list\">\n<li><em>em element<\/em><\/li>\n<li><ins>ins element<\/ins><\/li>\n<li><mark>mark element<\/mark><\/li>\n<li><q>q <q>inside<\/q> a q<\/q><\/li>\n<li><strong>strong element<\/strong><\/li>\n<li><a href=\"#\" class=\"uk-link-reset\">Link Reset<\/a><\/li>\n<\/ul><\/div>\n<div>\n<ul class=\"uk-list\">\n<li class=\"uk-text-muted\">Text Muted<\/li>\n<li class=\"uk-text-emphasis\">Text Emphasis<\/li>\n<li class=\"uk-text-primary\">Text Primary<\/li>\n<li class=\"uk-text-secondary\">Text Secondary<\/li>\n<li class=\"uk-text-success\">Text Success<\/li>\n<li class=\"uk-text-warning\">Text Warning<\/li>\n<li class=\"uk-text-danger\">Text Danger<\/li>\n<li class=\"uk-text-meta\">Text Meta<\/li>\n<\/ul><\/div>\n<div>\n<ul class=\"uk-list\">\n<li><span class=\"uk-label\">Default<\/span><\/li>\n<li><span class=\"uk-label uk-label-success\">Success<\/span><\/li>\n<li><span class=\"uk-label uk-label-warning\">Warning<\/span><\/li>\n<li><span class=\"uk-label uk-label-danger\">Danger<\/span><\/li>\n<li><a class=\"uk-badge\" href=\"#\">1<\/a><\/li>\n<li>\n                <a class=\"uk-icon-button uk-icon\" href=\"#\" uk-icon=\"icon: home\"><\/a><br \/>\n                <a class=\"uk-icon-button uk-icon\" href=\"#\" uk-icon=\"icon: github\"><\/a><br \/>\n                <a class=\"uk-icon-link uk-icon\" href=\"#\" uk-icon=\"icon: trash\"><\/a>\n            <\/li>\n<\/ul><\/div>\n<\/div>\n<div class=\"uk-heading-2xlarge\">The quick brown fox<\/div>\n<div class=\"uk-heading-xlarge\">The quick brown fox<\/div>\n<div class=\"uk-heading-large\">The quick brown fox<\/div>\n<div class=\"uk-heading-medium\">The quick brown fox<\/div>\n<div class=\"uk-heading-small\">The quick brown fox<\/div>\n<div class=\"uk-h1\">The quick brown fox<\/div>\n<div class=\"uk-h2\">The quick brown fox<\/div>\n<div class=\"uk-h3\">The quick brown fox<\/div>\n<div class=\"uk-h4\">The quick brown fox<\/div>\n<div class=\"uk-h5\">The quick brown fox<\/div>\n<div class=\"uk-h6\">The quick brown fox<\/div>\n<div class=\"uk-grid-large uk-grid\" uk-grid=\"\">\n<div class=\"uk-width-expand@m\">\n<h1>Lead and Meta<\/h1>\n<p class=\"uk-text-lead\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<\/p>\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.<\/p>\n<p class=\"uk-text-meta\">Written by <a href=\"#\">Super User<\/a> on <time datetime=\"2016-04-01T19:00\">01 April 2016<\/time>.<br \/>Posted in <a href=\"#\">Blog<\/a><\/p>\n<h1>Large and Small<\/h1>\n<p class=\"uk-text-large\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<\/p>\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.<\/p>\n<p class=\"uk-text-small\">Written by <a href=\"#\">Super User<\/a> on <time datetime=\"2016-04-01T19:00\">01 April 2016<\/time>.<br \/>Posted in <a href=\"#\">Blog<\/a><\/p>\n<\/p><\/div>\n<\/div>\n<\/div>\n<hr>\n<h2>Lists<\/h2>\n<div>\n<div class=\"uk-grid-divider uk-child-width-expand@m\" uk-grid=\"\">\n<div class=\"\">\n<ul class=\"uk-list uk-list-bullet uk-margin-medium\">\n<li>List item 1<\/li>\n<li>List item 2<\/li>\n<li>List item 3<\/li>\n<\/ul>\n<ul class=\"uk-list uk-list-striped\">\n<li>List item 1<\/li>\n<li>List item 2<\/li>\n<li>List item 3<\/li>\n<\/ul><\/div>\n<div>\n<ul class=\"uk-list uk-list-divider uk-margin-medium\">\n<li>List item 1<\/li>\n<li>List item 2<\/li>\n<li>List item 3<\/li>\n<\/ul>\n<dl class=\"uk-description-list uk-description-list-divider\">\n<dt>Description lists<\/dt>\n<dd>A description text<\/dd>\n<dt>Description lists<\/dt>\n<dd>A description text<\/dd>\n<\/dl><\/div>\n<div>\n<ul uk-accordion=\"\" class=\"uk-accordion\">\n<li class=\"uk-open\">\n                        <a class=\"uk-accordion-title\" href=\"#\">Item 1<\/a><\/p>\n<div class=\"uk-accordion-content\">\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.<\/p>\n<\/p><\/div>\n<\/li>\n<li>\n                        <a class=\"uk-accordion-title\" href=\"#\">Item 2<\/a><\/p>\n<div class=\"uk-accordion-content\" hidden=\"\">\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.<\/p>\n<\/p><\/div>\n<\/li>\n<li>\n<p>                        <a class=\"uk-accordion-title\" href=\"#\">Item 3<\/a><\/p>\n<div class=\"uk-accordion-content\" hidden=\"\">\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.<\/p>\n<\/p><\/div>\n<\/li>\n<\/ul><\/div>\n<\/p><\/div>\n<\/div>\n<hr>\n<h2>Buttons<\/h2>\n<div>\n<div class=\"uk-grid-medium uk-child-width-auto uk-flex-middle uk-margin-large uk-grid\" uk-grid=\"\">\n<div class=\"uk-first-column\">\n        <button class=\"uk-button uk-button-default\">Default<\/button>\n    <\/div>\n<div>\n        <button class=\"uk-button uk-button-primary\">Primary<\/button>\n    <\/div>\n<div>\n        <button class=\"uk-button uk-button-secondary\">Secondary<\/button>\n    <\/div>\n<div>\n        <button class=\"uk-button uk-button-danger\">Danger<\/button>\n    <\/div>\n<div>\n        <button class=\"uk-button uk-button-default\" disabled=\"\">Disabled<\/button>\n    <\/div>\n<div>\n        <button class=\"uk-button uk-button-text\">Text<\/button>\n    <\/div>\n<div>\n        <button class=\"uk-button uk-button-link\">Link<\/button>\n    <\/div>\n<\/div>\n<hr>\n<div class=\"uk-grid-medium uk-child-width-auto uk-flex-middle uk-margin-large uk-grid\" uk-grid=\"\">\n<div class=\"uk-first-column\">\n        <button class=\"uk-button uk-button-large uk-button-default\">Default<\/button>\n    <\/div>\n<div>\n        <button class=\"uk-button uk-button-large uk-button-primary\">Primary<\/button>\n    <\/div>\n<div>\n        <button class=\"uk-button uk-button-large uk-button-secondary\">Secondary<\/button>\n    <\/div>\n<div>\n        <button class=\"uk-button uk-button-large uk-button-danger\">Danger<\/button>\n    <\/div>\n<div>\n        <button class=\"uk-button uk-button-large uk-button-default\" disabled=\"\">Disabled<\/button>\n    <\/div>\n<div>\n        <button class=\"uk-button uk-button-large uk-button-text\">Text<\/button>\n    <\/div>\n<\/div>\n<hr>\n<div class=\"uk-grid-medium uk-child-width-auto uk-flex-middle uk-margin-large uk-grid\" uk-grid=\"\">\n<div class=\"uk-first-column\">\n        <button class=\"uk-button uk-button-small uk-button-default\">Default<\/button>\n    <\/div>\n<div>\n        <button class=\"uk-button uk-button-small uk-button-primary\">Primary<\/button>\n    <\/div>\n<div>\n        <button class=\"uk-button uk-button-small uk-button-secondary\">Secondary<\/button>\n    <\/div>\n<div>\n        <button class=\"uk-button uk-button-small uk-button-danger\">Danger<\/button>\n    <\/div>\n<div>\n        <button class=\"uk-button uk-button-small uk-button-default\" disabled=\"\">Disabled<\/button>\n    <\/div>\n<div>\n        <button class=\"uk-button uk-button-small uk-button-text\">Text<\/button>\n    <\/div>\n<\/div>\n<div class=\"uk-tile uk-tile-secondary uk-light\">\n<div class=\"uk-grid-medium uk-child-width-auto uk-flex-middle uk-margin-large uk-grid\" uk-grid=\"\">\n<div class=\"uk-first-column\">\n        <button class=\"uk-button uk-button-default\">Default<\/button>\n    <\/div>\n<div>\n        <button class=\"uk-button uk-button-primary\">Primary<\/button>\n    <\/div>\n<div>\n        <button class=\"uk-button uk-button-secondary\">Secondary<\/button>\n    <\/div>\n<div>\n        <button class=\"uk-button uk-button-danger\">Danger<\/button>\n    <\/div>\n<div>\n        <button class=\"uk-button uk-button-default\" disabled=\"\">Disabled<\/button>\n    <\/div>\n<div>\n        <button class=\"uk-button uk-button-text\">Text<\/button>\n    <\/div>\n<div>\n        <button class=\"uk-button uk-button-link\">Link<\/button>\n    <\/div>\n<\/div>\n<\/div>\n<\/div>\n<hr>\n<h2>Widths<\/h2>\n<div>\n<div class=\"uk-container uk-text-center\">\n<div class=\"uk-grid-small uk-grid-match uk-child-width-expand uk-grid\" uk-grid=\"\">\n<div class=\"uk-width-small uk-first-column\">\n<div class=\"uk-card uk-card-small uk-card-body uk-card-primary\">Small<\/div>\n<\/div>\n<div>\n<div class=\"uk-card uk-card-small uk-card-body uk-background-muted\"><\/div>\n<\/div><\/div>\n<div class=\"uk-grid-small uk-grid-match uk-child-width-expand uk-grid\" uk-grid=\"\">\n<div class=\"uk-width-medium uk-first-column\">\n<div class=\"uk-card uk-card-small uk-card-body uk-card-primary\">Medium<\/div>\n<\/div>\n<div>\n<div class=\"uk-card uk-card-small uk-card-body uk-background-muted\"><\/div>\n<\/div><\/div>\n<div class=\"uk-grid-small uk-grid-match uk-child-width-expand uk-grid\" uk-grid=\"\">\n<div class=\"uk-width-large uk-first-column\">\n<div class=\"uk-card uk-card-small uk-card-body uk-card-primary\">Large<\/div>\n<\/div>\n<div>\n<div class=\"uk-card uk-card-small uk-card-body uk-background-muted\"><\/div>\n<\/div><\/div>\n<div class=\"uk-grid-small uk-grid-match uk-child-width-expand uk-grid\" uk-grid=\"\">\n<div class=\"uk-width-xlarge uk-first-column\">\n<div class=\"uk-card uk-card-small uk-card-body uk-card-primary\">X-Large<\/div>\n<\/div>\n<div>\n<div class=\"uk-card uk-card-small uk-card-body uk-background-muted\"><\/div>\n<\/div><\/div>\n<div class=\"uk-grid-small uk-grid-match uk-child-width-expand uk-grid\" uk-grid=\"\">\n<div class=\"uk-width-2xlarge uk-first-column\">\n<div class=\"uk-card uk-card-small uk-card-body uk-card-primary\">2X-Large<\/div>\n<\/div>\n<div>\n<div class=\"uk-card uk-card-small uk-card-body uk-background-muted\"><\/div>\n<\/div><\/div>\n<\/div>\n<\/div>\n<hr>\n<h2>Cards<\/h2>\n<div>\n<div class=\"uk-child-width-1-2@m uk-grid-match uk-grid\" uk-grid=\"\">\n<div class=\"uk-first-column\">\n<div class=\"uk-card uk-card-default uk-card-hover\">\n<div class=\"uk-card-badge\">Hot<\/div>\n<div class=\"uk-card-body\">\n<h3 class=\"uk-card-title\">Default<\/h3>\n<p>Lorem ipsum <a href=\"#\">dolor<\/a> sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<\/p>\n<p uk-margin=\"\">\n                            <a class=\"uk-button uk-button-default uk-first-column\" href=\"#\">Button<\/a><br \/>\n                            <a class=\"uk-button uk-button-primary\" href=\"#\">Button<\/a>\n                        <\/p>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div>\n<div class=\"uk-card uk-card-primary uk-card-hover\">\n<div class=\"uk-card-badge\">Hot<\/div>\n<div class=\"uk-card-body\">\n<h3 class=\"uk-card-title\">Primary<\/h3>\n<p>Lorem ipsum <a href=\"#\">dolor<\/a> sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<\/p>\n<p uk-margin=\"\">\n                            <a class=\"uk-button uk-button-default uk-first-column\" href=\"#\">Button<\/a><br \/>\n                            <a class=\"uk-button uk-button-primary\" href=\"#\">Button<\/a>\n                        <\/p>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"uk-grid-margin uk-first-column\">\n<div class=\"uk-card uk-card-secondary uk-card-hover\">\n<div class=\"uk-card-badge\">Hot<\/div>\n<div class=\"uk-card-body\">\n<h3 class=\"uk-card-title\">Secondary<\/h3>\n<p>Lorem ipsum <a href=\"#\">dolor<\/a> sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<\/p>\n<p uk-margin=\"\">\n                            <a class=\"uk-button uk-button-default uk-first-column\" href=\"#\">Button<\/a><br \/>\n                            <a class=\"uk-button uk-button-primary\" href=\"#\">Button<\/a>\n                        <\/p>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"uk-grid-margin\">\n<div class=\"uk-card uk-card-hover\">\n<div class=\"uk-card-badge\">Hot<\/div>\n<div class=\"uk-card-body\">\n<h3 class=\"uk-card-title\">Hover<\/h3>\n<p>Lorem ipsum <a href=\"#\">dolor<\/a> sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<\/p>\n<p uk-margin=\"\">\n                            <a class=\"uk-button uk-button-default uk-first-column\" href=\"#\">Button<\/a><br \/>\n                            <a class=\"uk-button uk-button-primary\" href=\"#\">Button<\/a>\n                        <\/p>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/div>\n<hr>\n<h2>Tiles<\/h2>\n<div>\n<div class=\"uk-child-width-1-2@s uk-child-width-1-4@l uk-grid-collapse uk-grid-match uk-grid\" uk-grid=\"\">\n<div class=\"uk-first-column\">\n<div class=\"uk-tile uk-tile-default uk-tile-hover\">\n<h3>Default<\/h3>\n<p>Lorem ipsum <a href=\"#\">dolor<\/a> sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<\/p>\n<p uk-margin=\"\">\n                <a class=\"uk-button uk-button-default uk-first-column\" href=\"#\">Button<\/a><br \/>\n                <a class=\"uk-button uk-button-text uk-margin-small-left\" href=\"#\">Button<\/a>\n            <\/p>\n<\/p><\/div>\n<\/p><\/div>\n<div>\n<div class=\"uk-tile uk-tile-muted uk-tile-hover\">\n<h3>Muted<\/h3>\n<p>Lorem ipsum <a href=\"#\">dolor<\/a> sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<\/p>\n<p uk-margin=\"\">\n                <a class=\"uk-button uk-button-default uk-first-column\" href=\"#\">Button<\/a><br \/>\n                <a class=\"uk-button uk-button-text uk-margin-small-left\" href=\"#\">Button<\/a>\n            <\/p>\n<\/p><\/div>\n<\/p><\/div>\n<div>\n<div class=\"uk-tile uk-tile-primary uk-tile-hover\">\n<h3>Primary<\/h3>\n<p>Lorem ipsum <a href=\"#\">dolor<\/a> sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<\/p>\n<p uk-margin=\"\">\n                <a class=\"uk-button uk-button-default uk-first-column\" href=\"#\">Button<\/a><br \/>\n                <a class=\"uk-button uk-button-text uk-margin-small-left\" href=\"#\">Button<\/a>\n            <\/p>\n<\/p><\/div>\n<\/p><\/div>\n<div>\n<div class=\"uk-tile uk-tile-secondary uk-tile-hover\">\n<h3>Secondary<\/h3>\n<p>Lorem ipsum <a href=\"#\">dolor<\/a> sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<\/p>\n<p uk-margin=\"\">\n                <a class=\"uk-button uk-button-default uk-first-column\" href=\"#\">Button<\/a><br \/>\n                <a class=\"uk-button uk-button-text uk-margin-small-left\" href=\"#\">Button<\/a>\n            <\/p>\n<\/p><\/div>\n<\/p><\/div>\n<\/div>\n<\/div>\n<hr>\n<h2>Forms<\/h2>\n<div>\n<div uk-grid=\"\" class=\"uk-grid\">\n<div class=\"uk-width-2-3@s uk-first-column\">\n<h2>Horizontal<\/h2>\n<form class=\"uk-form-horizontal\" target=\"_self\"><input type=\"hidden\" name=\"customize_messenger_channel\" value=\"preview-617\"><input type=\"hidden\" name=\"customize_autosaved\" value=\"on\"><input type=\"hidden\" name=\"customize_changeset_uuid\" value=\"f75b6b65-482e-4a86-ab8e-ebb0dd962c59\"><\/p>\n<div class=\"uk-margin\">\n                <label class=\"uk-form-label\" for=\"form-h-text\">Text<\/label><\/p>\n<div class=\"uk-form-controls\">\n                    <input class=\"uk-input uk-form-width-large\" id=\"form-h-text\" type=\"text\" placeholder=\"Some text...\">\n                <\/div>\n<\/p><\/div>\n<div class=\"uk-margin\">\n                <label class=\"uk-form-label\" for=\"form-h-select\">Select<\/label><\/p>\n<div class=\"uk-form-controls\">\n                    <select class=\"uk-select uk-form-width-large\" id=\"form-h-select\"><option>Option 01<\/option><option>Option 02<\/option><\/select>\n                <\/div>\n<\/p><\/div>\n<div class=\"uk-margin\">\n                <label class=\"uk-form-label\" for=\"form-h-textarea\">Textarea<\/label><\/p>\n<div class=\"uk-form-controls\">\n                    <textarea class=\"uk-textarea uk-form-width-large\" id=\"form-h-textarea\" rows=\"5\" placeholder=\"Some text...\"><\/textarea>\n                <\/div>\n<\/p><\/div>\n<div class=\"uk-margin\">\n                <span class=\"uk-form-label\">Radio<\/span><\/p>\n<div class=\"uk-form-controls uk-form-controls-text\">\n<div class=\"uk-grid-small uk-child-width-auto uk-grid\" uk-grid=\"\">\n                        <label class=\"uk-first-column\"><input class=\"uk-radio\" type=\"radio\" name=\"radio2\"> A<\/label><br \/>\n                        <label><input class=\"uk-radio\" type=\"radio\" name=\"radio2\"> B<\/label><br \/>\n                        <label><input class=\"uk-radio\" type=\"radio\" name=\"radio2\"> C<\/label><br \/>\n                        <label><input class=\"uk-radio\" type=\"radio\" name=\"radio2\" disabled=\"\"> D<\/label>\n                    <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"uk-margin\">\n                <span class=\"uk-form-label\">Checkbox<\/span><\/p>\n<div class=\"uk-form-controls uk-form-controls-text\">\n<div class=\"uk-grid-small uk-child-width-auto uk-grid\" uk-grid=\"\">\n                        <label class=\"uk-first-column\"><input class=\"uk-checkbox\" type=\"checkbox\"> A<\/label><br \/>\n                        <label><input class=\"uk-checkbox\" type=\"checkbox\"> B<\/label><br \/>\n                        <label><input class=\"uk-checkbox\" type=\"checkbox\"> C<\/label><br \/>\n                        <label><input class=\"uk-checkbox\" type=\"checkbox\" disabled=\"\"> D<\/label>\n                    <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"uk-margin\">\n                <label class=\"uk-form-label\" for=\"form-h-multiple\">Multiple<\/label><\/p>\n<div class=\"uk-form-controls\">\n                    <select class=\"uk-select uk-form-width-large\" id=\"form-h-multiple\" multiple=\"\"><option>Option 01<\/option><option>Option 02<\/option><option>Option 03<\/option><option>Option 04<\/option><\/select>\n                <\/div>\n<\/p><\/div>\n<div class=\"uk-margin\">\n                <label class=\"uk-form-label\" for=\"form-h-range\">Range<\/label><\/p>\n<div class=\"uk-form-controls uk-form-controls-text\">\n                    <input class=\"uk-range uk-form-width-large\" id=\"form-h-range\" type=\"range\" value=\"2\" min=\"0\" max=\"10\" step=\"0.1\">\n                <\/div>\n<\/p><\/div>\n<\/p><\/form>\n<h2>Sizes<\/h2>\n<form target=\"_self\"><input type=\"hidden\" name=\"customize_messenger_channel\" value=\"preview-617\"><input type=\"hidden\" name=\"customize_autosaved\" value=\"on\"><input type=\"hidden\" name=\"customize_changeset_uuid\" value=\"f75b6b65-482e-4a86-ab8e-ebb0dd962c59\"><\/p>\n<div class=\"uk-margin\" uk-margin=\"\">\n                <textarea class=\"uk-textarea uk-form-width-small uk-form-large uk-first-column\" rows=\"2\" placeholder=\"Large\"><\/textarea><br \/>\n                <input class=\"uk-input uk-form-width-small uk-form-large\" type=\"text\" placeholder=\"Large\"><br \/>\n                <select class=\"uk-select uk-form-width-small uk-form-large\"><option>Option 01<\/option><option>Option 02<\/option><\/select><br \/>\n                <button class=\"uk-button uk-button-default uk-button-large\">Button<\/button><br \/>\n                <label><input class=\"uk-checkbox\" type=\"checkbox\"> Checkbox<\/label>\n            <\/div>\n<div class=\"uk-margin\" uk-margin=\"\">\n                <textarea class=\"uk-textarea uk-form-width-small uk-first-column\" rows=\"2\" placeholder=\"Default\"><\/textarea><br \/>\n                <input class=\"uk-input uk-form-width-small\" type=\"text\" placeholder=\"Default\"><br \/>\n                <select class=\"uk-select uk-form-width-small\"><option>Option 01<\/option><option>Option 02<\/option><\/select><br \/>\n                <button class=\"uk-button uk-button-default\">Button<\/button><br \/>\n                <label><input class=\"uk-checkbox\" type=\"checkbox\"> Checkbox<\/label>\n            <\/div>\n<div class=\"uk-margin\" uk-margin=\"\">\n                <textarea class=\"uk-textarea uk-form-width-small uk-form-small uk-first-column\" rows=\"2\" placeholder=\"Small\"><\/textarea><br \/>\n                <input class=\"uk-input uk-form-width-small uk-form-small\" type=\"text\" placeholder=\"Small\"><br \/>\n                <select class=\"uk-select uk-form-width-small uk-form-small\"><option>Option 01<\/option><option>Option 02<\/option><\/select><br \/>\n                <button class=\"uk-button uk-button-default uk-button-small\">Button<\/button><br \/>\n                <label><input class=\"uk-checkbox\" type=\"checkbox\"> Checkbox<\/label>\n            <\/div>\n<\/p><\/form>\n<h2>Widths<\/h2>\n<form target=\"_self\"><input type=\"hidden\" name=\"customize_messenger_channel\" value=\"preview-617\"><input type=\"hidden\" name=\"customize_autosaved\" value=\"on\"><input type=\"hidden\" name=\"customize_changeset_uuid\" value=\"f75b6b65-482e-4a86-ab8e-ebb0dd962c59\"><\/p>\n<div class=\"uk-margin\">\n                <input class=\"uk-input uk-form-width-large\" type=\"text\" placeholder=\"Large\">\n            <\/div>\n<div class=\"uk-margin\">\n                <input class=\"uk-input uk-form-width-medium\" type=\"text\" placeholder=\"Medium\">\n            <\/div>\n<div class=\"uk-margin\">\n                <input class=\"uk-input uk-form-width-small\" type=\"text\" placeholder=\"Small\">\n            <\/div>\n<div class=\"uk-margin\">\n                <input class=\"uk-input uk-form-width-xsmall\" type=\"text\" placeholder=\"Xsmall\">\n            <\/div>\n<\/p><\/form>\n<\/p><\/div>\n<form class=\"uk-form-stacked uk-width-1-3@s\" target=\"_self\"><input type=\"hidden\" name=\"customize_messenger_channel\" value=\"preview-617\"><input type=\"hidden\" name=\"customize_autosaved\" value=\"on\"><input type=\"hidden\" name=\"customize_changeset_uuid\" value=\"f75b6b65-482e-4a86-ab8e-ebb0dd962c59\"><\/p>\n<h2>Stacked<\/h2>\n<div class=\"uk-margin\">\n            <span class=\"uk-form-label\">States and styles<\/span><\/p>\n<div class=\"uk-margin-small\">\n                <input class=\"uk-input\" type=\"text\" placeholder=\":disabled\" disabled=\"\">\n            <\/div>\n<div class=\"uk-margin-small\">\n                <select class=\"uk-select uk-form-width-large\" disabled=\"\"><option>Option 01<\/option><option>Option 02<\/option><\/select>\n            <\/div>\n<div class=\"uk-margin-small\">\n                <input class=\"uk-input uk-form-danger\" type=\"text\" placeholder=\"form-danger\" value=\"form-danger\">\n            <\/div>\n<div class=\"uk-margin-small\">\n                <input class=\"uk-input uk-form-success\" type=\"text\" placeholder=\"form-success\" value=\"form-success\">\n            <\/div>\n<div class=\"uk-margin-small\">\n                <input class=\"uk-input uk-form-blank\" type=\"text\" placeholder=\"form-blank\">\n            <\/div>\n<\/p><\/div>\n<fieldset class=\"uk-fieldset\">\n<legend class=\"uk-legend\">Legend<\/legend>\n<div class=\"uk-margin\">\n                <label class=\"uk-form-label\" for=\"form-s-text\">Text<\/label><br \/>\n                <input class=\"uk-input\" id=\"form-s-text\" type=\"text\" placeholder=\"Some text...\">\n            <\/div>\n<div class=\"uk-margin\">\n                <label class=\"uk-form-label\" for=\"form-s-select\">Select<\/label><br \/>\n                <select class=\"uk-select\" id=\"form-s-select\"><option>Option 01<\/option><option>Option 02<\/option><\/select>\n            <\/div>\n<div class=\"uk-margin\">\n                <label class=\"uk-form-label\" for=\"form-s-textarea\">Textarea<\/label><br \/>\n                <textarea class=\"uk-textarea\" id=\"form-s-textarea\" rows=\"5\" placeholder=\"Some text...\"><\/textarea>\n            <\/div>\n<div class=\"uk-margin\">\n                <span class=\"uk-form-label\">Radio<\/span><br \/>\n                <label><input class=\"uk-radio\" type=\"radio\" name=\"radio1\"> Option 01<\/label><br \/>\n                <label><input class=\"uk-radio\" type=\"radio\" name=\"radio1\"> Option 02<\/label>\n            <\/div>\n<div class=\"uk-margin\">\n                <span class=\"uk-form-label\">Checkbox<\/span><br \/>\n                <label><input class=\"uk-checkbox\" type=\"checkbox\"> Option 01<\/label><br \/>\n                <label><input class=\"uk-checkbox\" type=\"checkbox\"> Option 02<\/label>\n            <\/div>\n<\/fieldset>\n<div class=\"uk-margin\">\n            <span class=\"uk-form-label\">Icon<\/span><\/p>\n<div class=\"uk-margin-small\">\n<div class=\"uk-inline\">\n                    <span class=\"uk-form-icon uk-icon\" uk-icon=\"icon: user\"><svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><circle fill=\"none\" stroke=\"#000\" stroke-width=\"1.1\" cx=\"9.9\" cy=\"6.4\" r=\"4.4\"><\/circle><path fill=\"none\" stroke=\"#000\" stroke-width=\"1.1\" d=\"M1.5,19 C2.3,14.5 5.8,11.2 10,11.2 C14.2,11.2 17.7,14.6 18.5,19.2\"><\/path><\/svg><\/span><br \/>\n                    <input class=\"uk-input\" type=\"text\">\n                <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"uk-margin\">\n            <span class=\"uk-form-label\">Icon Link<\/span><\/p>\n<div class=\"uk-margin-small\">\n<div class=\"uk-inline\">\n                    <a class=\"uk-form-icon uk-icon\" href=\"#\" uk-icon=\"icon: pencil\"><svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path fill=\"none\" stroke=\"#000\" d=\"M17.25,6.01 L7.12,16.1 L3.82,17.2 L5.02,13.9 L15.12,3.88 C15.71,3.29 16.66,3.29 17.25,3.88 C17.83,4.47 17.83,5.42 17.25,6.01 L17.25,6.01 Z\"><\/path><path fill=\"none\" stroke=\"#000\" d=\"M15.98,7.268 L13.851,5.148\"><\/path><\/svg><\/a><br \/>\n                    <input class=\"uk-input\" type=\"text\">\n                <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/form>\n<\/div>\n<\/div>\n<hr>\n<h2>Overlay<\/h2>\n<div>\n<div class=\"uk-child-width-1-3@m uk-grid\" uk-grid=\"\">\n<div class=\"uk-first-column\">\n<h2>Default<\/h2>\n<div class=\"uk-inline\">\n            <canvas width=\"800\" height=\"600\" class=\"test-img\"><\/canvas><\/p>\n<div class=\"uk-overlay uk-overlay-default uk-position-bottom\">\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.<\/p>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div>\n<h2>Primary<\/h2>\n<div class=\"uk-inline\">\n            <canvas width=\"800\" height=\"600\" class=\"test-img\"><\/canvas><\/p>\n<div class=\"uk-overlay uk-overlay-primary uk-position-bottom\">\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.<\/p>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div>\n<h2>Icon<\/h2>\n<div class=\"uk-inline\">\n            <canvas width=\"800\" height=\"600\" class=\"test-img\"><\/canvas><\/p>\n<div class=\"uk-position-center\">\n                <span uk-overlay-icon=\"\" class=\"uk-icon uk-overlay-icon\"><svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><rect x=\"19\" y=\"0\" width=\"1\" height=\"40\"><\/rect><rect x=\"0\" y=\"19\" width=\"40\" height=\"1\"><\/rect><\/svg><\/span>\n            <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/div>\n<\/div>\n<hr>\n<h2>Slider<\/h2>\n<div>\n<div uk-slider=\"\" class=\"uk-slider\">\n<div class=\"uk-position-relative uk-visible-toggle\">\n<div class=\"uk-slider-container uk-slider-container-offset\" tabindex=\"-1\">\n<ul class=\"uk-slider-items uk-child-width-1-3@m uk-child-width-1-2@s uk-grid\" style=\"transform: translate3d(-346.547px, 0px, 0px);\">\n<li tabindex=\"-1\" class=\"\" style=\"order: 1;\">\n<div class=\"uk-card uk-card-default uk-card-hover uk-card-body\">\n<h3 class=\"uk-card-title\">Default<\/h3>\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.<\/p>\n<\/p><\/div>\n<\/li>\n<li tabindex=\"-1\" class=\"\" style=\"order: 1;\">\n<div class=\"uk-card uk-card-primary uk-card-hover uk-card-body\">\n<h3 class=\"uk-card-title\">Primary<\/h3>\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.<\/p>\n<\/p><\/div>\n<\/li>\n<li tabindex=\"-1\" class=\"\" style=\"order: 1;\">\n<div class=\"uk-card uk-card-secondary uk-card-hover uk-card-body\">\n<h3 class=\"uk-card-title\">Secondary<\/h3>\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.<\/p>\n<\/p><\/div>\n<\/li>\n<li tabindex=\"-1\" class=\"\" style=\"order: 1;\">\n<div class=\"uk-card uk-card-default uk-card-hover uk-card-body\">\n<h3 class=\"uk-card-title\">Default<\/h3>\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.<\/p>\n<\/p><\/div>\n<\/li>\n<li tabindex=\"-1\" class=\"\">\n<div class=\"uk-card uk-card-primary uk-card-hover uk-card-body\">\n<h3 class=\"uk-card-title\">Primary<\/h3>\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.<\/p>\n<\/p><\/div>\n<\/li>\n<li tabindex=\"-1\" class=\"uk-active\">\n<div class=\"uk-card uk-card-secondary uk-card-hover uk-card-body\">\n<h3 class=\"uk-card-title\">Secondary<\/h3>\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.<\/p>\n<\/p><\/div>\n<\/li>\n<li tabindex=\"-1\" class=\"uk-active\">\n<div class=\"uk-card uk-card-default uk-card-hover uk-card-body\">\n<h3 class=\"uk-card-title\">Default<\/h3>\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.<\/p>\n<\/p><\/div>\n<\/li>\n<li tabindex=\"-1\" class=\"uk-active\">\n<div class=\"uk-card uk-card-primary uk-card-hover uk-card-body\">\n<h3 class=\"uk-card-title\">Primary<\/h3>\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.<\/p>\n<\/p><\/div>\n<\/li>\n<li tabindex=\"-1\">\n<div class=\"uk-card uk-card-secondary uk-card-hover uk-card-body\">\n<h3 class=\"uk-card-title\">Secondary<\/h3>\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.<\/p>\n<\/p><\/div>\n<\/li>\n<\/ul><\/div>\n<p>        <a class=\"uk-position-center-left-out uk-position-small uk-hidden-hover uk-icon uk-slidenav-previous uk-slidenav\" href=\"#\" uk-slidenav-previous=\"\" uk-slider-item=\"previous\"><svg width=\"14\" height=\"24\" viewBox=\"0 0 14 24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><polyline fill=\"none\" stroke=\"#000\" stroke-width=\"1.4\" points=\"12.775,1 1.225,12 12.775,23 \"><\/polyline><\/svg><\/a><br \/>\n        <a class=\"uk-position-center-right-out uk-position-small uk-hidden-hover uk-icon uk-slidenav-next uk-slidenav\" href=\"#\" uk-slidenav-next=\"\" uk-slider-item=\"next\"><svg width=\"14\" height=\"24\" viewBox=\"0 0 14 24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><polyline fill=\"none\" stroke=\"#000\" stroke-width=\"1.4\" points=\"1.225,23 12.775,12 1.225,1 \"><\/polyline><\/svg><\/a><\/p><\/div>\n<ul class=\"uk-slider-nav uk-dotnav uk-flex-center uk-margin\">\n<li uk-slider-item=\"0\" class=\"\"><a href=\"\" class=\"customize-unpreviewable\"><\/a><\/li>\n<li uk-slider-item=\"1\" class=\"\"><a href=\"\" class=\"customize-unpreviewable\"><\/a><\/li>\n<li uk-slider-item=\"2\" class=\"\"><a href=\"\" class=\"customize-unpreviewable\"><\/a><\/li>\n<li uk-slider-item=\"3\" class=\"\"><a href=\"\" class=\"customize-unpreviewable\"><\/a><\/li>\n<li uk-slider-item=\"4\" class=\"\"><a href=\"\" class=\"customize-unpreviewable\"><\/a><\/li>\n<li uk-slider-item=\"5\" class=\"uk-active\"><a href=\"\" class=\"customize-unpreviewable\"><\/a><\/li>\n<li uk-slider-item=\"6\"><a href=\"\" class=\"customize-unpreviewable\"><\/a><\/li>\n<li uk-slider-item=\"7\"><a href=\"\" class=\"customize-unpreviewable\"><\/a><\/li>\n<li uk-slider-item=\"8\"><a href=\"\" class=\"customize-unpreviewable\"><\/a><\/li>\n<\/ul>\n<\/div>\n<\/div>\n<hr>\n<h2>Transitions<\/h2>\n<div>\n<div class=\"uk-grid-small uk-child-width-1-3@s uk-child-width-1-5@m uk-text-center uk-grid\" uk-grid=\"\">\n<div class=\"uk-text-center uk-first-column\">\n<div class=\"uk-inline-clip uk-transition-toggle\" tabindex=\"0\">\n                <canvas width=\"600\" height=\"500\" class=\"test-img\"><\/canvas><\/p>\n<div class=\"uk-transition-fade uk-position-bottom uk-overlay uk-overlay-default\">Overlay<\/div>\n<\/p><\/div>\n<p class=\"uk-margin-small-top\">Fade<\/p>\n<\/p><\/div>\n<div class=\"uk-text-center\">\n<div class=\"uk-inline-clip uk-transition-toggle\" tabindex=\"0\">\n                <canvas width=\"600\" height=\"500\" class=\"test-img\"><\/canvas><\/p>\n<div class=\"uk-position-center\">\n<div class=\"uk-transition-scale-up uk-overlay uk-overlay-default\">Overlay<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p class=\"uk-margin-small-top\">Scale Up<\/p>\n<\/p><\/div>\n<div class=\"uk-text-center\">\n<div class=\"uk-inline-clip uk-transition-toggle\" tabindex=\"0\">\n                <canvas width=\"600\" height=\"500\" class=\"test-img\"><\/canvas><\/p>\n<div class=\"uk-transition-slide-bottom uk-position-bottom uk-overlay uk-overlay-default\">Overlay<\/div>\n<\/p><\/div>\n<p class=\"uk-margin-small-top\">Slide<\/p>\n<\/p><\/div>\n<div class=\"uk-text-center\">\n<div class=\"uk-inline-clip uk-transition-toggle\" tabindex=\"0\">\n                <canvas width=\"600\" height=\"500\" class=\"test-img\"><\/canvas><\/p>\n<div class=\"uk-position-center uk-position-small\">\n<div class=\"uk-transition-slide-bottom-small uk-overlay uk-overlay-default uk-flex uk-flex-center uk-flex-middle\">Overlay<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p class=\"uk-margin-small-top\">Slide Small<\/p>\n<\/p><\/div>\n<div class=\"uk-text-center\">\n<div class=\"uk-inline-clip uk-transition-toggle\" tabindex=\"0\">\n                <canvas width=\"600\" height=\"500\" class=\"test-img\"><\/canvas><\/p>\n<div class=\"uk-position-center uk-position-small\">\n<div class=\"uk-transition-slide-bottom-medium uk-overlay uk-overlay-default uk-flex uk-flex-center uk-flex-middle\">Overlay<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p class=\"uk-margin-small-top\">Slide Medium<\/p>\n<\/p><\/div>\n<\/p><\/div>\n<h2>Slow<\/h2>\n<div class=\"uk-grid-small uk-child-width-1-3@s uk-child-width-1-5@m uk-text-center uk-grid\" uk-grid=\"\">\n<div class=\"uk-text-center uk-first-column\">\n<div class=\"uk-inline-clip uk-transition-toggle\" tabindex=\"0\">\n                <canvas width=\"600\" height=\"500\" class=\"test-img\"><\/canvas><\/p>\n<div class=\"uk-transition-fade uk-transition-slow uk-position-bottom uk-overlay uk-overlay-default\">Overlay<\/div>\n<\/p><\/div>\n<p class=\"uk-margin-small-top\">Fade<\/p>\n<\/p><\/div>\n<div class=\"uk-text-center\">\n<div class=\"uk-inline-clip uk-transition-toggle\" tabindex=\"0\">\n                <canvas width=\"600\" height=\"500\" class=\"test-img\"><\/canvas><\/p>\n<div class=\"uk-position-center\">\n<div class=\"uk-transition-scale-up uk-transition-slow uk-overlay uk-overlay-default\">Overlay<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p class=\"uk-margin-small-top\">Scale Up<\/p>\n<\/p><\/div>\n<div class=\"uk-text-center\">\n<div class=\"uk-inline-clip uk-transition-toggle\" tabindex=\"0\">\n                <canvas width=\"600\" height=\"500\" class=\"test-img\"><\/canvas><\/p>\n<div class=\"uk-transition-slide-bottom uk-transition-slow uk-position-bottom uk-overlay uk-overlay-default\">Overlay<\/div>\n<\/p><\/div>\n<p class=\"uk-margin-small-top\">Slide<\/p>\n<\/p><\/div>\n<div class=\"uk-text-center\">\n<div class=\"uk-inline-clip uk-transition-toggle\" tabindex=\"0\">\n                <canvas width=\"600\" height=\"500\" class=\"test-img\"><\/canvas><\/p>\n<div class=\"uk-position-center uk-position-small\">\n<div class=\"uk-transition-slide-bottom-small uk-transition-slow uk-overlay uk-overlay-default uk-flex uk-flex-center uk-flex-middle\">Overlay<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p class=\"uk-margin-small-top\">Slide Small<\/p>\n<\/p><\/div>\n<div class=\"uk-text-center\">\n<div class=\"uk-inline-clip uk-transition-toggle\" tabindex=\"0\">\n                <canvas width=\"600\" height=\"500\" class=\"test-img\"><\/canvas><\/p>\n<div class=\"uk-position-center uk-position-small\">\n<div class=\"uk-transition-slide-bottom-medium uk-transition-slow uk-overlay uk-overlay-default uk-flex uk-flex-center uk-flex-middle\">Overlay<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p class=\"uk-margin-small-top\">Slide Medium<\/p>\n<\/p><\/div>\n<\/p><\/div>\n<\/div>\n<hr>\n<h2>Decorations<\/h2>\n<div>\n<div class=\"uk-child-width-1-2 uk-grid-large uk-grid\" uk-grid=\"\">\n<div class=\"uk-first-column\">\n<p>                        <canvas width=\"800\" height=\"600\" class=\"tm-mask-default test-img\"><\/canvas><\/p><\/div>\n<div>\n<div class=\"uk-inline tm-box-decoration-default\">\n                            <canvas width=\"800\" height=\"600\" class=\"test-img\"><\/canvas>\n                        <\/div>\n<\/p><\/div>\n<div class=\"uk-grid-margin uk-first-column\">\n<div class=\"uk-inline tm-box-decoration-primary\">\n                            <canvas width=\"800\" height=\"600\" class=\"test-img\"><\/canvas>\n                        <\/div>\n<\/p><\/div>\n<div class=\"uk-grid-margin\">\n<div class=\"uk-inline tm-box-decoration-secondary\">\n                            <canvas width=\"800\" height=\"600\" class=\"test-img\"><\/canvas>\n                        <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/div>\n<p><!--more--><br \/>\n<!-- {\"type\":\"layout\",\"children\":[{\"type\":\"section\",\"props\":{\"image_position\":\"center-center\",\"padding\":\"none\",\"padding_remove_bottom\":true,\"style\":\"default\",\"title_breakpoint\":\"xl\",\"title_position\":\"top-left\",\"title_rotation\":\"left\",\"vertical_align\":\"middle\",\"width\":\"\"},\"children\":[{\"type\":\"row\",\"props\":{\"layout\":\"1-5,4-5\"},\"children\":[{\"type\":\"column\",\"props\":{\"image_position\":\"center-center\",\"position_sticky\":true,\"position_sticky_breakpoint\":\"s\",\"position_sticky_offset\":\"70\",\"style\":\"muted\",\"width_medium\":\"1-5\",\"width_small\":\"1-4\"},\"children\":[{\"type\":\"image\",\"props\":{\"image\":\"wp-content\\\/uploads\\\/2021\\\/09\\\/resi-logo-primary.svg\",\"image_svg_color\":\"emphasis\",\"image_width\":\"150\",\"margin\":\"medium\"}},{\"type\":\"html\",\"props\":{\"content\":\"\n\n<ul class=\\\"uk-nav uk-nav-primary\\\" uk-scrollspy-nav=\\\"closest: li; scroll: true; offset: 70;\\\">\\n    \n\n<li><a href=\\\"#logo\\\">Logo<\\\/a><\\\/li>\\n    \n\n<li><a href=\\\"#colors\\\">Colors<\\\/a><\\\/li>\\n    \n\n<li><a href=\\\"#typography\\\">Typography<\\\/a><\\\/li>\\n    \n\n<li><a href=\\\"#lists\\\">Lists<\\\/a><\\\/li>\\n    \n\n<li><a href=\\\"#buttons\\\">Buttons<\\\/a><\\\/li>\\n    \n\n<li><a href=\\\"#width\\\">Widths<\\\/a><\\\/li>\\n    \n\n<li><a href=\\\"#cards\\\">Cards<\\\/a><\\\/li>\\n    \n\n<li><a href=\\\"#tiles\\\">Tiles<\\\/a><\\\/li>\\n    \n\n<li><a href=\\\"#forms\\\">Forms<\\\/a><\\\/li>\\n    \n\n<li><a href=\\\"#overlay\\\">Overlay<\\\/a><\\\/li>\\n    \n\n<li><a href=\\\"#slider\\\">Slider<\\\/a><\\\/li>\\n    \n\n<li><a href=\\\"#transitions\\\">Transitions<\\\/a>\\n    \n\n<li><a href=\\\"#decorations\\\">Decorations<\\\/a><\\\/li>\\n<\\\/ul>\"}}]},{\"type\":\"column\",\"props\":{\"image_position\":\"center-center\",\"position_sticky_breakpoint\":\"m\",\"style\":\"default\",\"width_medium\":\"4-5\",\"width_small\":\"expand\"},\"children\":[{\"type\":\"headline\",\"props\":{\"content\":\"Logo\",\"id\":\"logo\",\"margin\":\"xlarge\",\"title_element\":\"h2\",\"title_style\":\"heading-small\"},\"name\":\"Logo\"},{\"type\":\"grid\",\"props\":{\"content_column_breakpoint\":\"m\",\"filter_align\":\"left\",\"filter_all\":true,\"filter_grid_breakpoint\":\"m\",\"filter_grid_width\":\"auto\",\"filter_position\":\"top\",\"filter_style\":\"tab\",\"grid_default\":\"1\",\"grid_medium\":\"\",\"grid_small\":\"2\",\"icon_width\":80,\"image_align\":\"top\",\"image_grid_breakpoint\":\"m\",\"image_grid_width\":\"1-2\",\"image_svg_color\":\"emphasis\",\"image_width\":\"400\",\"item_animation\":true,\"link_style\":\"default\",\"link_text\":\"Read more\",\"margin\":\"default\",\"meta_align\":\"below-title\",\"meta_element\":\"div\",\"meta_style\":\"meta\",\"panel_padding\":\"default\",\"panel_style\":\"tile-default\",\"show_content\":true,\"show_image\":true,\"show_link\":true,\"show_meta\":true,\"show_title\":true,\"text_align\":\"center\",\"title_align\":\"top\",\"title_element\":\"h3\",\"title_grid_breakpoint\":\"m\",\"title_grid_width\":\"1-2\",\"title_hover_style\":\"reset\"},\"children\":[{\"type\":\"grid_item\",\"props\":{\"image\":\"wp-content\\\/uploads\\\/sites\\\/21\\\/2023\\\/07\\\/tracy-logo-onyx.svg\",\"image_alt\":\"Tracy Primary Logo\",\"panel_style\":\"tile-muted\",\"title\":\"Logo Primary\"}},{\"type\":\"grid_item\",\"props\":{\"image\":\"wp-content\\\/uploads\\\/sites\\\/21\\\/2023\\\/07\\\/tracy-logo-mark-inverse.svg\",\"image_alt\":\"Tracy Logo Inverse\",\"panel_style\":\"card-primary\",\"title\":\"Logo Inverse\",\"yooessentials_access_conditions\":[],\"yooessentials_access_mode\":\"AND\"}}]},{\"type\":\"grid\",\"props\":{\"content_column_breakpoint\":\"m\",\"filter_align\":\"left\",\"filter_all\":true,\"filter_grid_breakpoint\":\"m\",\"filter_grid_width\":\"auto\",\"filter_position\":\"top\",\"filter_style\":\"tab\",\"grid_default\":\"1\",\"grid_medium\":\"\",\"grid_small\":\"2\",\"icon_width\":80,\"image_align\":\"top\",\"image_grid_breakpoint\":\"m\",\"image_grid_width\":\"1-2\",\"image_svg_color\":\"emphasis\",\"image_width\":\"150\",\"item_animation\":true,\"link_style\":\"default\",\"link_text\":\"Read more\",\"margin\":\"default\",\"meta_align\":\"below-title\",\"meta_element\":\"div\",\"meta_style\":\"meta\",\"panel_padding\":\"default\",\"panel_style\":\"card-default\",\"show_content\":true,\"show_image\":true,\"show_link\":true,\"show_meta\":true,\"show_title\":true,\"text_align\":\"center\",\"title_align\":\"top\",\"title_element\":\"h3\",\"title_grid_breakpoint\":\"m\",\"title_grid_width\":\"1-2\",\"title_hover_style\":\"reset\"},\"children\":[{\"type\":\"grid_item\",\"props\":{\"image\":\"wp-content\\\/uploads\\\/sites\\\/21\\\/2023\\\/07\\\/tracy-logo-mark-onyx.svg\",\"image_alt\":\"Tracy Logo Mark Onyx\",\"panel_style\":\"tile-muted\",\"title\":\"Logo Mark\"}},{\"type\":\"grid_item\",\"props\":{\"image\":\"wp-content\\\/uploads\\\/sites\\\/21\\\/2023\\\/07\\\/tracy-logo-inverse.svg\",\"image_alt\":\"Tracy Logo Mark Inverse\",\"panel_style\":\"card-primary\",\"title\":\"Logo Mark Inverse\"}}]},{\"type\":\"divider\",\"props\":{\"divider_element\":\"hr\",\"margin\":\"large\"}},{\"type\":\"headline\",\"props\":{\"content\":\"Colors\",\"id\":\"colors\",\"margin\":\"xlarge\",\"margin_remove_top\":true,\"title_element\":\"h2\",\"title_style\":\"heading-small\"},\"name\":\"Colors\"},{\"type\":\"color_palette\",\"props\":{\"grid_column_gap\":\"collapse\",\"grid_default\":\"2\",\"grid_item_min_height\":\"medium\",\"grid_medium\":\"2\",\"grid_row_gap\":\"collapse\",\"margin\":\"default\",\"meta_align\":\"below-title\",\"meta_style\":\"meta\",\"opacity_grid_height\":40,\"overlay_hover\":false,\"overlay_mode\":\"cover\",\"overlay_position\":\"center\",\"overlay_style\":\"overlay-primary\",\"overlay_transition\":\"fade\",\"show_meta\":true,\"show_opacity\":true,\"show_title\":true,\"text_color\":\"light\",\"title_align\":\"top\",\"title_element\":\"h3\",\"title_grid_breakpoint\":\"m\",\"title_grid_width\":\"1-2\",\"title_hover_style\":\"reset\"},\"children\":[{\"type\":\"color_item\",\"props\":{\"color\":\"#F1EFE9\",\"text_color\":\"dark\",\"title\":\"Cararra\"}},{\"type\":\"color_item\",\"props\":{\"color\":\"#383838\",\"title\":\"Onyx\"}},{\"type\":\"color_item\",\"props\":{\"color\":\"#C5987F\",\"title\":\"Canyon\"}},{\"type\":\"color_item\",\"props\":{\"color\":\"#9D7C5E\",\"text_color\":\"light\",\"title\":\"Jute\"}}]},{\"type\":\"divider\",\"props\":{\"divider_element\":\"hr\",\"margin\":\"large\"}},{\"type\":\"headline\",\"props\":{\"content\":\"Typography\",\"id\":\"typography\",\"margin\":\"xlarge\",\"margin_remove_top\":true,\"title_element\":\"h2\",\"title_style\":\"heading-small\"},\"name\":\"Typography\"},{\"type\":\"grid\",\"props\":{\"content_column_breakpoint\":\"m\",\"filter_align\":\"left\",\"filter_all\":true,\"filter_grid_breakpoint\":\"m\",\"filter_grid_width\":\"auto\",\"filter_position\":\"top\",\"filter_style\":\"tab\",\"grid_default\":\"1\",\"grid_medium\":\"2\",\"grid_small\":\"1\",\"icon_width\":80,\"image_align\":\"top\",\"image_grid_breakpoint\":\"m\",\"image_grid_width\":\"1-2\",\"image_svg_color\":\"emphasis\",\"item_animation\":true,\"link_style\":\"default\",\"link_text\":\"Read more\",\"margin\":\"default\",\"meta_align\":\"below-title\",\"meta_element\":\"div\",\"meta_style\":\"h1\",\"panel_image_no_padding\":false,\"panel_padding\":\"default\",\"panel_style\":\"tile-muted\",\"show_content\":true,\"show_image\":true,\"show_link\":true,\"show_meta\":true,\"show_title\":true,\"title_align\":\"top\",\"title_element\":\"h4\",\"title_grid_breakpoint\":\"m\",\"title_grid_width\":\"1-2\",\"title_hover_style\":\"reset\"},\"children\":[{\"type\":\"grid_item\",\"props\":{\"content\":\"\n\n<div class=\\\"uk-font-primary uk-text-large\\\">\\nABCDEFGHIJKLMNOPQRSTUVWXYZ<br \/>\\nabcdefghijklmnopqrstuvwxyz\\n<\\\/div>\",\"meta\":\"Newsreader\",\"title\":\"Primary Font\"}},{\"type\":\"grid_item\",\"props\":{\"content\":\"\n\n<div class=\\\"uk-font-secondary uk-text-large\\\">\\nABCDEFGHIJKLMNOPQRSTUVWXYZ<br \/>\\nabcdefghijklmnopqrstuvwxyz\\n<\\\/div>\",\"meta\":\"<span class=\\\"uk-font-secondary\\\">Sweet Sans Pro<\\\/span>\",\"title\":\"Secondary Font\"}}]},{\"type\":\"grid\",\"props\":{\"content_column_breakpoint\":\"m\",\"filter_align\":\"left\",\"filter_all\":true,\"filter_grid_breakpoint\":\"m\",\"filter_grid_width\":\"auto\",\"filter_position\":\"top\",\"filter_style\":\"tab\",\"grid_default\":\"1\",\"grid_medium\":\"2\",\"grid_small\":\"1\",\"icon_width\":80,\"image_align\":\"top\",\"image_grid_breakpoint\":\"m\",\"image_grid_width\":\"1-2\",\"image_svg_color\":\"emphasis\",\"item_animation\":true,\"link_style\":\"default\",\"link_text\":\"Read more\",\"margin\":\"medium\",\"meta_align\":\"below-title\",\"meta_element\":\"div\",\"meta_style\":\"h1\",\"panel_padding\":\"default\",\"panel_style\":\"card-primary\",\"show_content\":true,\"show_image\":true,\"show_link\":true,\"show_meta\":true,\"show_title\":true,\"title_align\":\"top\",\"title_element\":\"h4\",\"title_grid_breakpoint\":\"m\",\"title_grid_width\":\"1-2\",\"title_hover_style\":\"reset\"},\"children\":[{\"type\":\"grid_item\",\"props\":{\"content\":\"\n\n<div class=\\\"uk-font-primary uk-text-large\\\">\\nABCDEFGHIJKLMNOPQRSTUVWXYZ<br \/>\\nabcdefghijklmnopqrstuvwxyz\\n<\\\/div>\",\"meta\":\"Newsreader\",\"title\":\"Primary Font\"}},{\"type\":\"grid_item\",\"props\":{\"content\":\"\n\n<div class=\\\"uk-font-secondary uk-text-large\\\">\\nABCDEFGHIJKLMNOPQRSTUVWXYZ<br \/>\\nabcdefghijklmnopqrstuvwxyz\\n<\\\/div>\",\"meta\":\"<span class=\\\"uk-font-secondary\\\">Sweet Sans Pro<\\\/span>\",\"title\":\"Secondary Font\"}}]},{\"type\":\"html\",\"props\":{\"content\":\"\n\n<div class=\\\"uk-child-width-1-2 uk-child-width-1-4@s uk-margin-large uk-grid\\\" uk-grid=\\\"\\\">\\n    \n\n<div class=\\\"uk-first-column\\\">\\n        \n\n<ul class=\\\"uk-list\\\">\\n            \n\n<li><a href=\\\"#\\\">a element<\\\/a><\\\/li>\\n            \n\n<li><abbr title=\\\"Title text\\\">abbr element<\\\/abbr><\\\/li>\\n            \n\n<li><code>code element<\\\/code><\\\/li>\\n            \n\n<li><del>del element<\\\/del><\\\/li>\\n            \n\n<li><dfn title=\\\"Title text\\\">dfn element<\\\/dfn><\\\/li>\\n            \n\n<li><a href=\\\"#\\\" class=\\\"uk-link-muted\\\">Link Muted<\\\/a><\\\/li>\\n        <\\\/ul>\\n    <\\\/div>\\n    \n\n<div>\\n        \n\n<ul class=\\\"uk-list\\\">\\n            \n\n<li><em>em element<\\\/em><\\\/li>\\n            \n\n<li><ins>ins element<\\\/ins><\\\/li>\\n            \n\n<li><mark>mark element<\\\/mark><\\\/li>\\n            \n\n<li><q>q <q>inside<\\\/q> a q<\\\/q><\\\/li>\\n            \n\n<li><strong>strong element<\\\/strong><\\\/li>\\n            \n\n<li><a href=\\\"#\\\" class=\\\"uk-link-reset\\\">Link Reset<\\\/a><\\\/li>\\n        <\\\/ul>\\n    <\\\/div>\\n    \n\n<div>\\n        \n\n<ul class=\\\"uk-list\\\">\\n            \n\n<li class=\\\"uk-text-muted\\\">Text Muted<\\\/li>\\n            \n\n<li class=\\\"uk-text-emphasis\\\">Text Emphasis<\\\/li>\\n            \n\n<li class=\\\"uk-text-primary\\\">Text Primary<\\\/li>\\n            \n\n<li class=\\\"uk-text-secondary\\\">Text Secondary<\\\/li>\\n            \n\n<li class=\\\"uk-text-success\\\">Text Success<\\\/li>\\n            \n\n<li class=\\\"uk-text-warning\\\">Text Warning<\\\/li>\\n            \n\n<li class=\\\"uk-text-danger\\\">Text Danger<\\\/li>\\n            \n\n<li class=\\\"uk-text-meta\\\">Text Meta<\\\/li>\\n        <\\\/ul>\\n    <\\\/div>\\n    \n\n<div>\\n        \n\n<ul class=\\\"uk-list\\\">\\n            \n\n<li><span class=\\\"uk-label\\\">Default<\\\/span><\\\/li>\\n            \n\n<li><span class=\\\"uk-label uk-label-success\\\">Success<\\\/span><\\\/li>\\n            \n\n<li><span class=\\\"uk-label uk-label-warning\\\">Warning<\\\/span><\\\/li>\\n            \n\n<li><span class=\\\"uk-label uk-label-danger\\\">Danger<\\\/span><\\\/li>\\n            \n\n<li><a class=\\\"uk-badge\\\" href=\\\"#\\\">1<\\\/a><\\\/li>\\n            \n\n<li>\\n                <a class=\\\"uk-icon-button uk-icon\\\" href=\\\"#\\\" uk-icon=\\\"icon: home\\\"><\\\/a>\\n                <a class=\\\"uk-icon-button uk-icon\\\" href=\\\"#\\\" uk-icon=\\\"icon: github\\\"><\\\/a>\\n                <a class=\\\"uk-icon-link uk-icon\\\" href=\\\"#\\\" uk-icon=\\\"icon: trash\\\"><\\\/a>\\n            <\\\/li>\\n        <\\\/ul>\\n    <\\\/div>\\n<\\\/div>\\n\n\n<div class=\\\"uk-heading-2xlarge\\\">The quick brown fox<\\\/div>\\n\n\n<div class=\\\"uk-heading-xlarge\\\">The quick brown fox<\\\/div>\\n\n\n<div class=\\\"uk-heading-large\\\">The quick brown fox<\\\/div>\\n\n\n<div class=\\\"uk-heading-medium\\\">The quick brown fox<\\\/div>\\n\n\n<div class=\\\"uk-heading-small\\\">The quick brown fox<\\\/div>\\n\n\n<div class=\\\"uk-h1\\\">The quick brown fox<\\\/div>\\n\n\n<div class=\\\"uk-h2\\\">The quick brown fox<\\\/div>\\n\n\n<div class=\\\"uk-h3\\\">The quick brown fox<\\\/div>\\n\n\n<div class=\\\"uk-h4\\\">The quick brown fox<\\\/div>\\n\n\n<div class=\\\"uk-h5\\\">The quick brown fox<\\\/div>\\n\n\n<div class=\\\"uk-h6\\\">The quick brown fox<\\\/div>\\n\n\n<div class=\\\"uk-grid-large uk-grid\\\" uk-grid=\\\"\\\">\\n    \n\n<div class=\\\"uk-width-expand@m\\\">\\n\\n        \n\n<h1>Lead and Meta<\\\/h1>\\n\\n        \n\n<p class=\\\"uk-text-lead\\\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<\\\/p>\\n\\n        \n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.<\\\/p>\\n\\n        \n\n<p class=\\\"uk-text-meta\\\">Written by <a href=\\\"#\\\">Super User<\\\/a> on <time datetime=\\\"2016-04-01T19:00\\\">01 April 2016<\\\/time>.<br \/>Posted in <a href=\\\"#\\\">Blog<\\\/a><\\\/p>\\n\\n        \n\n<h1>Large and Small<\\\/h1>\\n\\n        \n\n<p class=\\\"uk-text-large\\\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<\\\/p>\\n\\n        \n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.<\\\/p>\\n\\n        \n\n<p class=\\\"uk-text-small\\\">Written by <a href=\\\"#\\\">Super User<\\\/a> on <time datetime=\\\"2016-04-01T19:00\\\">01 April 2016<\\\/time>.<br \/>Posted in <a href=\\\"#\\\">Blog<\\\/a><\\\/p>\\n\\n    <\\\/div>\\n<\\\/div>\"}},{\"type\":\"divider\",\"props\":{\"divider_element\":\"hr\",\"margin\":\"large\"}},{\"type\":\"headline\",\"props\":{\"content\":\"Lists\",\"id\":\"lists\",\"margin\":\"xlarge\",\"margin_remove_top\":true,\"title_element\":\"h2\",\"title_style\":\"heading-small\"},\"name\":\"Lists\"},{\"type\":\"html\",\"props\":{\"content\":\"\n\n<div class=\\\"uk-grid-divider uk-child-width-expand@m\\\" uk-grid=\\\"\\\">\\n            \n\n<div class=\\\"\\\">\\n                \n\n<ul class=\\\"uk-list uk-list-bullet uk-margin-medium\\\">\\n                    \n\n<li>List item 1<\\\/li>\\n                    \n\n<li>List item 2<\\\/li>\\n                    \n\n<li>List item 3<\\\/li>\\n                 <\\\/ul>\\n                \n\n<ul class=\\\"uk-list uk-list-striped\\\">\\n                    \n\n<li>List item 1<\\\/li>\\n                    \n\n<li>List item 2<\\\/li>\\n                    \n\n<li>List item 3<\\\/li>\\n                <\\\/ul>\\n            <\\\/div>\\n            \n\n<div>\\n                \n\n<ul class=\\\"uk-list uk-list-divider uk-margin-medium\\\">\\n                    \n\n<li>List item 1<\\\/li>\\n                    \n\n<li>List item 2<\\\/li>\\n                    \n\n<li>List item 3<\\\/li>\\n                <\\\/ul>\\n                \n\n<dl class=\\\"uk-description-list uk-description-list-divider\\\">\\n                    \n\n<dt>Description lists<\\\/dt>\\n                    \n\n<dd>A description text<\\\/dd>\\n                    \n\n<dt>Description lists<\\\/dt>\\n                    \n\n<dd>A description text<\\\/dd>\\n                <\\\/dl>\\n            <\\\/div>\\n            \n\n<div>\\n                \n\n<ul uk-accordion=\\\"\\\" class=\\\"uk-accordion\\\">\\n                    \n\n<li class=\\\"uk-open\\\">\\n                        <a class=\\\"uk-accordion-title\\\" href=\\\"#\\\">Item 1<\\\/a>\\n                        \n\n<div class=\\\"uk-accordion-content\\\">\\n                            \n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.<\\\/p>\\n                        <\\\/div>\\n                    <\\\/li>\\n                    \n\n<li>\\n                        <a class=\\\"uk-accordion-title\\\" href=\\\"#\\\">Item 2<\\\/a>\\n                        \n\n<div class=\\\"uk-accordion-content\\\" hidden=\\\"\\\">\\n                            \n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.<\\\/p>\\n                        <\\\/div>\\n                    <\\\/li>\\n                    \n\n<li>\\n\\n                        <a class=\\\"uk-accordion-title\\\" href=\\\"#\\\">Item 3<\\\/a>\\n                        \n\n<div class=\\\"uk-accordion-content\\\" hidden=\\\"\\\">\\n                            \n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.<\\\/p>\\n                        <\\\/div>\\n\\n                    <\\\/li>\\n                <\\\/ul>\\n\\n            <\\\/div>\\n        <\\\/div>\"}},{\"type\":\"divider\",\"props\":{\"divider_element\":\"hr\",\"margin\":\"large\"}},{\"type\":\"headline\",\"props\":{\"content\":\"Buttons\",\"id\":\"buttons\",\"margin\":\"xlarge\",\"margin_remove_top\":true,\"title_element\":\"h2\",\"title_style\":\"heading-small\"},\"name\":\"Buttons\"},{\"type\":\"html\",\"props\":{\"content\":\"\\n\n\n<div class=\\\"uk-grid-medium uk-child-width-auto uk-flex-middle uk-margin-large uk-grid\\\" uk-grid=\\\"\\\">\\n    \n\n<div class=\\\"uk-first-column\\\">\\n        <button class=\\\"uk-button uk-button-default\\\">Default<\\\/button>\\n    <\\\/div>\\n    \n\n<div>\\n        <button class=\\\"uk-button uk-button-primary\\\">Primary<\\\/button>\\n    <\\\/div>\\n    \n\n<div>\\n        <button class=\\\"uk-button uk-button-secondary\\\">Secondary<\\\/button>\\n    <\\\/div>\\n    \n\n<div>\\n        <button class=\\\"uk-button uk-button-danger\\\">Danger<\\\/button>\\n    <\\\/div>\\n    \n\n<div>\\n        <button class=\\\"uk-button uk-button-default\\\" disabled=\\\"\\\">Disabled<\\\/button>\\n    <\\\/div>\\n    \n\n<div>\\n        <button class=\\\"uk-button uk-button-text\\\">Text<\\\/button>\\n    <\\\/div>\\n    \n\n<div>\\n        <button class=\\\"uk-button uk-button-link\\\">Link<\\\/button>\\n    <\\\/div>\\n<\\\/div>\\n\\n\n\n<hr>\n\n\\n\\n\n\n<div class=\\\"uk-grid-medium uk-child-width-auto uk-flex-middle uk-margin-large uk-grid\\\" uk-grid=\\\"\\\">\\n    \n\n<div class=\\\"uk-first-column\\\">\\n        <button class=\\\"uk-button uk-button-large uk-button-default\\\">Default<\\\/button>\\n    <\\\/div>\\n    \n\n<div>\\n        <button class=\\\"uk-button uk-button-large uk-button-primary\\\">Primary<\\\/button>\\n    <\\\/div>\\n    \n\n<div>\\n        <button class=\\\"uk-button uk-button-large uk-button-secondary\\\">Secondary<\\\/button>\\n    <\\\/div>\\n    \n\n<div>\\n        <button class=\\\"uk-button uk-button-large uk-button-danger\\\">Danger<\\\/button>\\n    <\\\/div>\\n    \n\n<div>\\n        <button class=\\\"uk-button uk-button-large uk-button-default\\\" disabled=\\\"\\\">Disabled<\\\/button>\\n    <\\\/div>\\n    \n\n<div>\\n        <button class=\\\"uk-button uk-button-large uk-button-text\\\">Text<\\\/button>\\n    <\\\/div>\\n<\\\/div>\\n\\n\n\n<hr>\n\n\\n\\n\n\n<div class=\\\"uk-grid-medium uk-child-width-auto uk-flex-middle uk-margin-large uk-grid\\\" uk-grid=\\\"\\\">\\n    \n\n<div class=\\\"uk-first-column\\\">\\n        <button class=\\\"uk-button uk-button-small uk-button-default\\\">Default<\\\/button>\\n    <\\\/div>\\n    \n\n<div>\\n        <button class=\\\"uk-button uk-button-small uk-button-primary\\\">Primary<\\\/button>\\n    <\\\/div>\\n    \n\n<div>\\n        <button class=\\\"uk-button uk-button-small uk-button-secondary\\\">Secondary<\\\/button>\\n    <\\\/div>\\n    \n\n<div>\\n        <button class=\\\"uk-button uk-button-small uk-button-danger\\\">Danger<\\\/button>\\n    <\\\/div>\\n    \n\n<div>\\n        <button class=\\\"uk-button uk-button-small uk-button-default\\\" disabled=\\\"\\\">Disabled<\\\/button>\\n    <\\\/div>\\n    \n\n<div>\\n        <button class=\\\"uk-button uk-button-small uk-button-text\\\">Text<\\\/button>\\n    <\\\/div>\\n<\\\/div>\\n\\n\n\n<div class=\\\"uk-tile uk-tile-secondary uk-light\\\">\\n\n\n<div class=\\\"uk-grid-medium uk-child-width-auto uk-flex-middle uk-margin-large uk-grid\\\" uk-grid=\\\"\\\">\\n    \n\n<div class=\\\"uk-first-column\\\">\\n        <button class=\\\"uk-button uk-button-default\\\">Default<\\\/button>\\n    <\\\/div>\\n    \n\n<div>\\n        <button class=\\\"uk-button uk-button-primary\\\">Primary<\\\/button>\\n    <\\\/div>\\n    \n\n<div>\\n        <button class=\\\"uk-button uk-button-secondary\\\">Secondary<\\\/button>\\n    <\\\/div>\\n    \n\n<div>\\n        <button class=\\\"uk-button uk-button-danger\\\">Danger<\\\/button>\\n    <\\\/div>\\n    \n\n<div>\\n        <button class=\\\"uk-button uk-button-default\\\" disabled=\\\"\\\">Disabled<\\\/button>\\n    <\\\/div>\\n    \n\n<div>\\n        <button class=\\\"uk-button uk-button-text\\\">Text<\\\/button>\\n    <\\\/div>\\n    \n\n<div>\\n        <button class=\\\"uk-button uk-button-link\\\">Link<\\\/button>\\n    <\\\/div>\\n<\\\/div>\\n<\\\/div>\"}},{\"type\":\"divider\",\"props\":{\"divider_element\":\"hr\",\"margin\":\"large\"}},{\"type\":\"headline\",\"props\":{\"content\":\"Widths\",\"id\":\"width\",\"margin\":\"xlarge\",\"margin_remove_top\":true,\"title_element\":\"h2\",\"title_style\":\"heading-small\"},\"name\":\"Width\"},{\"type\":\"html\",\"props\":{\"content\":\"\n\n<div class=\\\"uk-container uk-text-center\\\">\\n\\n    \n\n<div class=\\\"uk-grid-small uk-grid-match uk-child-width-expand uk-grid\\\" uk-grid=\\\"\\\">\\n        \n\n<div class=\\\"uk-width-small uk-first-column\\\">\n\n<div class=\\\"uk-card uk-card-small uk-card-body uk-card-primary\\\">Small<\\\/div><\\\/div>\\n        \n\n<div>\n\n<div class=\\\"uk-card uk-card-small uk-card-body uk-background-muted\\\"><\\\/div><\\\/div>\\n    <\\\/div>\\n\\n    \n\n<div class=\\\"uk-grid-small uk-grid-match uk-child-width-expand uk-grid\\\" uk-grid=\\\"\\\">\\n        \n\n<div class=\\\"uk-width-medium uk-first-column\\\">\n\n<div class=\\\"uk-card uk-card-small uk-card-body uk-card-primary\\\">Medium<\\\/div><\\\/div>\\n        \n\n<div>\n\n<div class=\\\"uk-card uk-card-small uk-card-body uk-background-muted\\\"><\\\/div><\\\/div>\\n    <\\\/div>\\n\\n    \n\n<div class=\\\"uk-grid-small uk-grid-match uk-child-width-expand uk-grid\\\" uk-grid=\\\"\\\">\\n        \n\n<div class=\\\"uk-width-large uk-first-column\\\">\n\n<div class=\\\"uk-card uk-card-small uk-card-body uk-card-primary\\\">Large<\\\/div><\\\/div>\\n        \n\n<div>\n\n<div class=\\\"uk-card uk-card-small uk-card-body uk-background-muted\\\"><\\\/div><\\\/div>\\n    <\\\/div>\\n\\n    \n\n<div class=\\\"uk-grid-small uk-grid-match uk-child-width-expand uk-grid\\\" uk-grid=\\\"\\\">\\n        \n\n<div class=\\\"uk-width-xlarge uk-first-column\\\">\n\n<div class=\\\"uk-card uk-card-small uk-card-body uk-card-primary\\\">X-Large<\\\/div><\\\/div>\\n        \n\n<div>\n\n<div class=\\\"uk-card uk-card-small uk-card-body uk-background-muted\\\"><\\\/div><\\\/div>\\n    <\\\/div>\\n\\n    \n\n<div class=\\\"uk-grid-small uk-grid-match uk-child-width-expand uk-grid\\\" uk-grid=\\\"\\\">\\n        \n\n<div class=\\\"uk-width-2xlarge uk-first-column\\\">\n\n<div class=\\\"uk-card uk-card-small uk-card-body uk-card-primary\\\">2X-Large<\\\/div><\\\/div>\\n        \n\n<div>\n\n<div class=\\\"uk-card uk-card-small uk-card-body uk-background-muted\\\"><\\\/div><\\\/div>\\n    <\\\/div>\\n\\n<\\\/div>\\n\"}},{\"type\":\"divider\",\"props\":{\"divider_element\":\"hr\",\"margin\":\"large\"}},{\"type\":\"headline\",\"props\":{\"content\":\"Cards\",\"id\":\"cards\",\"margin\":\"xlarge\",\"margin_remove_top\":true,\"title_element\":\"h2\",\"title_style\":\"heading-small\"},\"name\":\"Cards\"},{\"type\":\"html\",\"props\":{\"content\":\"\n\n<div class=\\\"uk-child-width-1-2@m uk-grid-match uk-grid\\\" uk-grid=\\\"\\\">\\n            \n\n<div class=\\\"uk-first-column\\\">\\n\\n                \n\n<div class=\\\"uk-card uk-card-default uk-card-hover\\\">\\n                    \n\n<div class=\\\"uk-card-badge\\\">Hot<\\\/div>\\n                    \n\n<div class=\\\"uk-card-body\\\">\\n                        \n\n<h3 class=\\\"uk-card-title\\\">Default<\\\/h3>\\n                        \n\n<p>Lorem ipsum <a href=\\\"#\\\">dolor<\\\/a> sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<\\\/p>\\n                        \n\n<p uk-margin=\\\"\\\">\\n                            <a class=\\\"uk-button uk-button-default uk-first-column\\\" href=\\\"#\\\">Button<\\\/a>\\n                            <a class=\\\"uk-button uk-button-primary\\\" href=\\\"#\\\">Button<\\\/a>\\n                        <\\\/p>\\n                    <\\\/div>\\n                <\\\/div>\\n\\n            <\\\/div>\\n            \n\n<div>\\n\\n                \n\n<div class=\\\"uk-card uk-card-primary uk-card-hover\\\">\\n                    \n\n<div class=\\\"uk-card-badge\\\">Hot<\\\/div>\\n                    \n\n<div class=\\\"uk-card-body\\\">\\n                        \n\n<h3 class=\\\"uk-card-title\\\">Primary<\\\/h3>\\n                        \n\n<p>Lorem ipsum <a href=\\\"#\\\">dolor<\\\/a> sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<\\\/p>\\n                        \n\n<p uk-margin=\\\"\\\">\\n                            <a class=\\\"uk-button uk-button-default uk-first-column\\\" href=\\\"#\\\">Button<\\\/a>\\n                            <a class=\\\"uk-button uk-button-primary\\\" href=\\\"#\\\">Button<\\\/a>\\n                        <\\\/p>\\n                    <\\\/div>\\n                <\\\/div>\\n\\n            <\\\/div>\\n            \n\n<div class=\\\"uk-grid-margin uk-first-column\\\">\\n\\n                \n\n<div class=\\\"uk-card uk-card-secondary uk-card-hover\\\">\\n                    \n\n<div class=\\\"uk-card-badge\\\">Hot<\\\/div>\\n                    \n\n<div class=\\\"uk-card-body\\\">\\n                        \n\n<h3 class=\\\"uk-card-title\\\">Secondary<\\\/h3>\\n                        \n\n<p>Lorem ipsum <a href=\\\"#\\\">dolor<\\\/a> sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<\\\/p>\\n                        \n\n<p uk-margin=\\\"\\\">\\n                            <a class=\\\"uk-button uk-button-default uk-first-column\\\" href=\\\"#\\\">Button<\\\/a>\\n                            <a class=\\\"uk-button uk-button-primary\\\" href=\\\"#\\\">Button<\\\/a>\\n                        <\\\/p>\\n                    <\\\/div>\\n                <\\\/div>\\n\\n            <\\\/div>\\n            \n\n<div class=\\\"uk-grid-margin\\\">\\n\\n                \n\n<div class=\\\"uk-card uk-card-hover\\\">\\n                    \n\n<div class=\\\"uk-card-badge\\\">Hot<\\\/div>\\n                    \n\n<div class=\\\"uk-card-body\\\">\\n                        \n\n<h3 class=\\\"uk-card-title\\\">Hover<\\\/h3>\\n                        \n\n<p>Lorem ipsum <a href=\\\"#\\\">dolor<\\\/a> sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<\\\/p>\\n                        \n\n<p uk-margin=\\\"\\\">\\n                            <a class=\\\"uk-button uk-button-default uk-first-column\\\" href=\\\"#\\\">Button<\\\/a>\\n                            <a class=\\\"uk-button uk-button-primary\\\" href=\\\"#\\\">Button<\\\/a>\\n                        <\\\/p>\\n                    <\\\/div>\\n                <\\\/div>\\n\\n            <\\\/div>\\n        <\\\/div>\"}},{\"type\":\"divider\",\"props\":{\"divider_element\":\"hr\",\"margin\":\"large\"}},{\"type\":\"headline\",\"props\":{\"content\":\"Tiles\",\"id\":\"tiles\",\"margin\":\"xlarge\",\"margin_remove_top\":true,\"title_element\":\"h2\",\"title_style\":\"heading-small\"},\"name\":\"Tiles\"},{\"type\":\"html\",\"props\":{\"content\":\"\n\n<div class=\\\"uk-child-width-1-2@s uk-child-width-1-4@l uk-grid-collapse uk-grid-match uk-grid\\\" uk-grid=\\\"\\\">\\n    \n\n<div class=\\\"uk-first-column\\\">\\n\\n        \n\n<div class=\\\"uk-tile uk-tile-default uk-tile-hover\\\">\\n            \n\n<h3>Default<\\\/h3>\\n            \n\n<p>Lorem ipsum <a href=\\\"#\\\">dolor<\\\/a> sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<\\\/p>\\n            \n\n<p uk-margin=\\\"\\\">\\n                <a class=\\\"uk-button uk-button-default uk-first-column\\\" href=\\\"#\\\">Button<\\\/a>\\n                <a class=\\\"uk-button uk-button-text uk-margin-small-left\\\" href=\\\"#\\\">Button<\\\/a>\\n            <\\\/p>\\n        <\\\/div>\\n\\n    <\\\/div>\\n    \n\n<div>\\n\\n        \n\n<div class=\\\"uk-tile uk-tile-muted uk-tile-hover\\\">\\n            \n\n<h3>Muted<\\\/h3>\\n            \n\n<p>Lorem ipsum <a href=\\\"#\\\">dolor<\\\/a> sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<\\\/p>\\n            \n\n<p uk-margin=\\\"\\\">\\n                <a class=\\\"uk-button uk-button-default uk-first-column\\\" href=\\\"#\\\">Button<\\\/a>\\n                <a class=\\\"uk-button uk-button-text uk-margin-small-left\\\" href=\\\"#\\\">Button<\\\/a>\\n            <\\\/p>\\n        <\\\/div>\\n\\n    <\\\/div>\\n    \n\n<div>\\n\\n        \n\n<div class=\\\"uk-tile uk-tile-primary uk-tile-hover\\\">\\n            \n\n<h3>Primary<\\\/h3>\\n            \n\n<p>Lorem ipsum <a href=\\\"#\\\">dolor<\\\/a> sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<\\\/p>\\n            \n\n<p uk-margin=\\\"\\\">\\n                <a class=\\\"uk-button uk-button-default uk-first-column\\\" href=\\\"#\\\">Button<\\\/a>\\n                <a class=\\\"uk-button uk-button-text uk-margin-small-left\\\" href=\\\"#\\\">Button<\\\/a>\\n            <\\\/p>\\n        <\\\/div>\\n\\n    <\\\/div>\\n    \n\n<div>\\n\\n        \n\n<div class=\\\"uk-tile uk-tile-secondary uk-tile-hover\\\">\\n            \n\n<h3>Secondary<\\\/h3>\\n            \n\n<p>Lorem ipsum <a href=\\\"#\\\">dolor<\\\/a> sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<\\\/p>\\n            \n\n<p uk-margin=\\\"\\\">\\n                <a class=\\\"uk-button uk-button-default uk-first-column\\\" href=\\\"#\\\">Button<\\\/a>\\n                <a class=\\\"uk-button uk-button-text uk-margin-small-left\\\" href=\\\"#\\\">Button<\\\/a>\\n            <\\\/p>\\n        <\\\/div>\\n\\n    <\\\/div>\\n<\\\/div>\"}},{\"type\":\"divider\",\"props\":{\"divider_element\":\"hr\",\"margin\":\"large\"}},{\"type\":\"headline\",\"props\":{\"content\":\"Forms\",\"id\":\"forms\",\"margin\":\"xlarge\",\"margin_remove_top\":true,\"title_element\":\"h2\",\"title_style\":\"heading-small\"},\"name\":\"Forms\"},{\"type\":\"html\",\"props\":{\"content\":\"\n\n<div uk-grid=\\\"\\\" class=\\\"uk-grid\\\">\\n    \n\n<div class=\\\"uk-width-2-3@s uk-first-column\\\">\\n\\n        \n\n<h2>Horizontal<\\\/h2>\\n\\n        \n\n<form class=\\\"uk-form-horizontal\\\" target=\\\"_self\\\"><input type=\\\"hidden\\\" name=\\\"customize_messenger_channel\\\" value=\\\"preview-617\\\"><input type=\\\"hidden\\\" name=\\\"customize_autosaved\\\" value=\\\"on\\\"><input type=\\\"hidden\\\" name=\\\"customize_changeset_uuid\\\" value=\\\"f75b6b65-482e-4a86-ab8e-ebb0dd962c59\\\">\\n\\n            \n\n<div class=\\\"uk-margin\\\">\\n                <label class=\\\"uk-form-label\\\" for=\\\"form-h-text\\\">Text<\\\/label>\\n                \n\n<div class=\\\"uk-form-controls\\\">\\n                    <input class=\\\"uk-input uk-form-width-large\\\" id=\\\"form-h-text\\\" type=\\\"text\\\" placeholder=\\\"Some text...\\\">\\n                <\\\/div>\\n            <\\\/div>\\n\\n            \n\n<div class=\\\"uk-margin\\\">\\n                <label class=\\\"uk-form-label\\\" for=\\\"form-h-select\\\">Select<\\\/label>\\n                \n\n<div class=\\\"uk-form-controls\\\">\\n                    <select class=\\\"uk-select uk-form-width-large\\\" id=\\\"form-h-select\\\">\\n<option>Option 01<\\\/option>\\n<option>Option 02<\\\/option>\\n                    <\\\/select>\\n                <\\\/div>\\n            <\\\/div>\\n\\n            \n\n<div class=\\\"uk-margin\\\">\\n                <label class=\\\"uk-form-label\\\" for=\\\"form-h-textarea\\\">Textarea<\\\/label>\\n                \n\n<div class=\\\"uk-form-controls\\\">\\n                    <textarea class=\\\"uk-textarea uk-form-width-large\\\" id=\\\"form-h-textarea\\\" rows=\\\"5\\\" placeholder=\\\"Some text...\\\"><\\\/textarea>\\n                <\\\/div>\\n            <\\\/div>\\n\\n            \n\n<div class=\\\"uk-margin\\\">\\n                <span class=\\\"uk-form-label\\\">Radio<\\\/span>\\n                \n\n<div class=\\\"uk-form-controls uk-form-controls-text\\\">\\n                    \n\n<div class=\\\"uk-grid-small uk-child-width-auto uk-grid\\\" uk-grid=\\\"\\\">\\n                        <label class=\\\"uk-first-column\\\"><input class=\\\"uk-radio\\\" type=\\\"radio\\\" name=\\\"radio2\\\"> A<\\\/label>\\n                        <label><input class=\\\"uk-radio\\\" type=\\\"radio\\\" name=\\\"radio2\\\"> B<\\\/label>\\n                        <label><input class=\\\"uk-radio\\\" type=\\\"radio\\\" name=\\\"radio2\\\"> C<\\\/label>\\n                        <label><input class=\\\"uk-radio\\\" type=\\\"radio\\\" name=\\\"radio2\\\" disabled=\\\"\\\"> D<\\\/label>\\n                    <\\\/div>\\n                <\\\/div>\\n            <\\\/div>\\n\\n            \n\n<div class=\\\"uk-margin\\\">\\n                <span class=\\\"uk-form-label\\\">Checkbox<\\\/span>\\n                \n\n<div class=\\\"uk-form-controls uk-form-controls-text\\\">\\n                    \n\n<div class=\\\"uk-grid-small uk-child-width-auto uk-grid\\\" uk-grid=\\\"\\\">\\n                        <label class=\\\"uk-first-column\\\"><input class=\\\"uk-checkbox\\\" type=\\\"checkbox\\\"> A<\\\/label>\\n                        <label><input class=\\\"uk-checkbox\\\" type=\\\"checkbox\\\"> B<\\\/label>\\n                        <label><input class=\\\"uk-checkbox\\\" type=\\\"checkbox\\\"> C<\\\/label>\\n                        <label><input class=\\\"uk-checkbox\\\" type=\\\"checkbox\\\" disabled=\\\"\\\"> D<\\\/label>\\n                    <\\\/div>\\n                <\\\/div>\\n            <\\\/div>\\n\\n            \n\n<div class=\\\"uk-margin\\\">\\n                <label class=\\\"uk-form-label\\\" for=\\\"form-h-multiple\\\">Multiple<\\\/label>\\n                \n\n<div class=\\\"uk-form-controls\\\">\\n                    <select class=\\\"uk-select uk-form-width-large\\\" id=\\\"form-h-multiple\\\" multiple=\\\"\\\">\\n<option>Option 01<\\\/option>\\n<option>Option 02<\\\/option>\\n<option>Option 03<\\\/option>\\n<option>Option 04<\\\/option>\\n                    <\\\/select>\\n                <\\\/div>\\n            <\\\/div>\\n\\n            \n\n<div class=\\\"uk-margin\\\">\\n                <label class=\\\"uk-form-label\\\" for=\\\"form-h-range\\\">Range<\\\/label>\\n                \n\n<div class=\\\"uk-form-controls uk-form-controls-text\\\">\\n                    <input class=\\\"uk-range uk-form-width-large\\\" id=\\\"form-h-range\\\" type=\\\"range\\\" value=\\\"2\\\" min=\\\"0\\\" max=\\\"10\\\" step=\\\"0.1\\\">\\n                <\\\/div>\\n            <\\\/div>\\n\\n        <\\\/form>\\n\\n        \n\n<h2>Sizes<\\\/h2>\\n\\n        \n\n<form target=\\\"_self\\\"><input type=\\\"hidden\\\" name=\\\"customize_messenger_channel\\\" value=\\\"preview-617\\\"><input type=\\\"hidden\\\" name=\\\"customize_autosaved\\\" value=\\\"on\\\"><input type=\\\"hidden\\\" name=\\\"customize_changeset_uuid\\\" value=\\\"f75b6b65-482e-4a86-ab8e-ebb0dd962c59\\\">\\n\\n            \n\n<div class=\\\"uk-margin\\\" uk-margin=\\\"\\\">\\n                <textarea class=\\\"uk-textarea uk-form-width-small uk-form-large uk-first-column\\\" rows=\\\"2\\\" placeholder=\\\"Large\\\"><\\\/textarea>\\n                <input class=\\\"uk-input uk-form-width-small uk-form-large\\\" type=\\\"text\\\" placeholder=\\\"Large\\\">\\n                <select class=\\\"uk-select uk-form-width-small uk-form-large\\\">\\n<option>Option 01<\\\/option>\\n<option>Option 02<\\\/option>\\n                <\\\/select>\\n                <button class=\\\"uk-button uk-button-default uk-button-large\\\">Button<\\\/button>\\n                <label><input class=\\\"uk-checkbox\\\" type=\\\"checkbox\\\"> Checkbox<\\\/label>\\n            <\\\/div>\\n\\n            \n\n<div class=\\\"uk-margin\\\" uk-margin=\\\"\\\">\\n                <textarea class=\\\"uk-textarea uk-form-width-small uk-first-column\\\" rows=\\\"2\\\" placeholder=\\\"Default\\\"><\\\/textarea>\\n                <input class=\\\"uk-input uk-form-width-small\\\" type=\\\"text\\\" placeholder=\\\"Default\\\">\\n                <select class=\\\"uk-select uk-form-width-small\\\">\\n<option>Option 01<\\\/option>\\n<option>Option 02<\\\/option>\\n                <\\\/select>\\n                <button class=\\\"uk-button uk-button-default\\\">Button<\\\/button>\\n                <label><input class=\\\"uk-checkbox\\\" type=\\\"checkbox\\\"> Checkbox<\\\/label>\\n            <\\\/div>\\n\\n            \n\n<div class=\\\"uk-margin\\\" uk-margin=\\\"\\\">\\n                <textarea class=\\\"uk-textarea uk-form-width-small uk-form-small uk-first-column\\\" rows=\\\"2\\\" placeholder=\\\"Small\\\"><\\\/textarea>\\n                <input class=\\\"uk-input uk-form-width-small uk-form-small\\\" type=\\\"text\\\" placeholder=\\\"Small\\\">\\n                <select class=\\\"uk-select uk-form-width-small uk-form-small\\\">\\n<option>Option 01<\\\/option>\\n<option>Option 02<\\\/option>\\n                <\\\/select>\\n                <button class=\\\"uk-button uk-button-default uk-button-small\\\">Button<\\\/button>\\n                <label><input class=\\\"uk-checkbox\\\" type=\\\"checkbox\\\"> Checkbox<\\\/label>\\n            <\\\/div>\\n\\n        <\\\/form>\\n\\n        \n\n<h2>Widths<\\\/h2>\\n\\n        \n\n<form target=\\\"_self\\\"><input type=\\\"hidden\\\" name=\\\"customize_messenger_channel\\\" value=\\\"preview-617\\\"><input type=\\\"hidden\\\" name=\\\"customize_autosaved\\\" value=\\\"on\\\"><input type=\\\"hidden\\\" name=\\\"customize_changeset_uuid\\\" value=\\\"f75b6b65-482e-4a86-ab8e-ebb0dd962c59\\\">\\n\\n            \n\n<div class=\\\"uk-margin\\\">\\n                <input class=\\\"uk-input uk-form-width-large\\\" type=\\\"text\\\" placeholder=\\\"Large\\\">\\n            <\\\/div>\\n\\n            \n\n<div class=\\\"uk-margin\\\">\\n                <input class=\\\"uk-input uk-form-width-medium\\\" type=\\\"text\\\" placeholder=\\\"Medium\\\">\\n            <\\\/div>\\n\\n            \n\n<div class=\\\"uk-margin\\\">\\n                <input class=\\\"uk-input uk-form-width-small\\\" type=\\\"text\\\" placeholder=\\\"Small\\\">\\n            <\\\/div>\\n\\n            \n\n<div class=\\\"uk-margin\\\">\\n                <input class=\\\"uk-input uk-form-width-xsmall\\\" type=\\\"text\\\" placeholder=\\\"Xsmall\\\">\\n            <\\\/div>\\n\\n        <\\\/form>\\n\\n    <\\\/div>\\n    \n\n<form class=\\\"uk-form-stacked uk-width-1-3@s\\\" target=\\\"_self\\\"><input type=\\\"hidden\\\" name=\\\"customize_messenger_channel\\\" value=\\\"preview-617\\\"><input type=\\\"hidden\\\" name=\\\"customize_autosaved\\\" value=\\\"on\\\"><input type=\\\"hidden\\\" name=\\\"customize_changeset_uuid\\\" value=\\\"f75b6b65-482e-4a86-ab8e-ebb0dd962c59\\\">\\n\\n        \n\n<h2>Stacked<\\\/h2>\\n\\n        \n\n<div class=\\\"uk-margin\\\">\\n            <span class=\\\"uk-form-label\\\">States and styles<\\\/span>\\n            \n\n<div class=\\\"uk-margin-small\\\">\\n                <input class=\\\"uk-input\\\" type=\\\"text\\\" placeholder=\\\":disabled\\\" disabled=\\\"\\\">\\n            <\\\/div>\\n            \n\n<div class=\\\"uk-margin-small\\\">\\n                <select class=\\\"uk-select uk-form-width-large\\\" disabled=\\\"\\\">\\n<option>Option 01<\\\/option>\\n<option>Option 02<\\\/option>\\n                <\\\/select>\\n            <\\\/div>\\n            \n\n<div class=\\\"uk-margin-small\\\">\\n                <input class=\\\"uk-input uk-form-danger\\\" type=\\\"text\\\" placeholder=\\\"form-danger\\\" value=\\\"form-danger\\\">\\n            <\\\/div>\\n            \n\n<div class=\\\"uk-margin-small\\\">\\n                <input class=\\\"uk-input uk-form-success\\\" type=\\\"text\\\" placeholder=\\\"form-success\\\" value=\\\"form-success\\\">\\n            <\\\/div>\\n            \n\n<div class=\\\"uk-margin-small\\\">\\n                <input class=\\\"uk-input uk-form-blank\\\" type=\\\"text\\\" placeholder=\\\"form-blank\\\">\\n            <\\\/div>\\n        <\\\/div>\\n\\n        \n\n<fieldset class=\\\"uk-fieldset\\\">\\n\\n            \n\n<legend class=\\\"uk-legend\\\">Legend<\\\/legend>\\n\\n            \n\n<div class=\\\"uk-margin\\\">\\n                <label class=\\\"uk-form-label\\\" for=\\\"form-s-text\\\">Text<\\\/label>\\n                <input class=\\\"uk-input\\\" id=\\\"form-s-text\\\" type=\\\"text\\\" placeholder=\\\"Some text...\\\">\\n            <\\\/div>\\n\\n            \n\n<div class=\\\"uk-margin\\\">\\n                <label class=\\\"uk-form-label\\\" for=\\\"form-s-select\\\">Select<\\\/label>\\n                <select class=\\\"uk-select\\\" id=\\\"form-s-select\\\">\\n<option>Option 01<\\\/option>\\n<option>Option 02<\\\/option>\\n                <\\\/select>\\n            <\\\/div>\\n\\n            \n\n<div class=\\\"uk-margin\\\">\\n                <label class=\\\"uk-form-label\\\" for=\\\"form-s-textarea\\\">Textarea<\\\/label>\\n                <textarea class=\\\"uk-textarea\\\" id=\\\"form-s-textarea\\\" rows=\\\"5\\\" placeholder=\\\"Some text...\\\"><\\\/textarea>\\n            <\\\/div>\\n\\n            \n\n<div class=\\\"uk-margin\\\">\\n                <span class=\\\"uk-form-label\\\">Radio<\\\/span>\\n                <label><input class=\\\"uk-radio\\\" type=\\\"radio\\\" name=\\\"radio1\\\"> Option 01<\\\/label><br \/>\\n                <label><input class=\\\"uk-radio\\\" type=\\\"radio\\\" name=\\\"radio1\\\"> Option 02<\\\/label>\\n            <\\\/div>\\n\\n            \n\n<div class=\\\"uk-margin\\\">\\n                <span class=\\\"uk-form-label\\\">Checkbox<\\\/span>\\n                <label><input class=\\\"uk-checkbox\\\" type=\\\"checkbox\\\"> Option 01<\\\/label><br \/>\\n                <label><input class=\\\"uk-checkbox\\\" type=\\\"checkbox\\\"> Option 02<\\\/label>\\n            <\\\/div>\\n\\n        <\\\/fieldset>\\n\\n        \n\n<div class=\\\"uk-margin\\\">\\n            <span class=\\\"uk-form-label\\\">Icon<\\\/span>\\n            \n\n<div class=\\\"uk-margin-small\\\">\\n                \n\n<div class=\\\"uk-inline\\\">\\n                    <span class=\\\"uk-form-icon uk-icon\\\" uk-icon=\\\"icon: user\\\"><svg width=\\\"20\\\" height=\\\"20\\\" viewBox=\\\"0 0 20 20\\\" xmlns=\\\"http:\\\/\\\/www.w3.org\\\/2000\\\/svg\\\"><circle fill=\\\"none\\\" stroke=\\\"#000\\\" stroke-width=\\\"1.1\\\" cx=\\\"9.9\\\" cy=\\\"6.4\\\" r=\\\"4.4\\\"><\\\/circle><path fill=\\\"none\\\" stroke=\\\"#000\\\" stroke-width=\\\"1.1\\\" d=\\\"M1.5,19 C2.3,14.5 5.8,11.2 10,11.2 C14.2,11.2 17.7,14.6 18.5,19.2\\\"><\\\/path><\\\/svg><\\\/span>\\n                    <input class=\\\"uk-input\\\" type=\\\"text\\\">\\n                <\\\/div>\\n            <\\\/div>\\n        <\\\/div>\\n\\n        \n\n<div class=\\\"uk-margin\\\">\\n            <span class=\\\"uk-form-label\\\">Icon Link<\\\/span>\\n            \n\n<div class=\\\"uk-margin-small\\\">\\n                \n\n<div class=\\\"uk-inline\\\">\\n                    <a class=\\\"uk-form-icon uk-icon\\\" href=\\\"#\\\" uk-icon=\\\"icon: pencil\\\"><svg width=\\\"20\\\" height=\\\"20\\\" viewBox=\\\"0 0 20 20\\\" xmlns=\\\"http:\\\/\\\/www.w3.org\\\/2000\\\/svg\\\"><path fill=\\\"none\\\" stroke=\\\"#000\\\" d=\\\"M17.25,6.01 L7.12,16.1 L3.82,17.2 L5.02,13.9 L15.12,3.88 C15.71,3.29 16.66,3.29 17.25,3.88 C17.83,4.47 17.83,5.42 17.25,6.01 L17.25,6.01 Z\\\"><\\\/path><path fill=\\\"none\\\" stroke=\\\"#000\\\" d=\\\"M15.98,7.268 L13.851,5.148\\\"><\\\/path><\\\/svg><\\\/a>\\n                    <input class=\\\"uk-input\\\" type=\\\"text\\\">\\n                <\\\/div>\\n            <\\\/div>\\n        <\\\/div>\\n\\n    <\\\/form>\\n<\\\/div>\"}},{\"type\":\"divider\",\"props\":{\"divider_element\":\"hr\",\"margin\":\"large\"}},{\"type\":\"headline\",\"props\":{\"content\":\"Overlay\",\"id\":\"overlay\",\"margin\":\"xlarge\",\"margin_remove_top\":true,\"title_element\":\"h2\",\"title_style\":\"heading-small\"},\"name\":\"Overlay\"},{\"type\":\"html\",\"props\":{\"content\":\"\n\n<div class=\\\"uk-child-width-1-3@m uk-grid\\\" uk-grid=\\\"\\\">\\n    \n\n<div class=\\\"uk-first-column\\\">\\n        \n\n<h2>Default<\\\/h2>\\n        \n\n<div class=\\\"uk-inline\\\">\\n            <canvas width=\\\"800\\\" height=\\\"600\\\" class=\\\"test-img\\\"><\\\/canvas>\\n            \n\n<div class=\\\"uk-overlay uk-overlay-default uk-position-bottom\\\">\\n                \n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.<\\\/p>\\n            <\\\/div>\\n        <\\\/div>\\n\\n    <\\\/div>\\n    \n\n<div>\\n        \n\n<h2>Primary<\\\/h2>\\n        \n\n<div class=\\\"uk-inline\\\">\\n            <canvas width=\\\"800\\\" height=\\\"600\\\" class=\\\"test-img\\\"><\\\/canvas>\\n            \n\n<div class=\\\"uk-overlay uk-overlay-primary uk-position-bottom\\\">\\n                \n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.<\\\/p>\\n            <\\\/div>\\n        <\\\/div>\\n\\n    <\\\/div>\\n    \n\n<div>\\n        \n\n<h2>Icon<\\\/h2>\\n        \n\n<div class=\\\"uk-inline\\\">\\n            <canvas width=\\\"800\\\" height=\\\"600\\\" class=\\\"test-img\\\"><\\\/canvas>\\n            \n\n<div class=\\\"uk-position-center\\\">\\n                <span uk-overlay-icon=\\\"\\\" class=\\\"uk-icon uk-overlay-icon\\\"><svg width=\\\"40\\\" height=\\\"40\\\" viewBox=\\\"0 0 40 40\\\" xmlns=\\\"http:\\\/\\\/www.w3.org\\\/2000\\\/svg\\\"><rect x=\\\"19\\\" y=\\\"0\\\" width=\\\"1\\\" height=\\\"40\\\"><\\\/rect><rect x=\\\"0\\\" y=\\\"19\\\" width=\\\"40\\\" height=\\\"1\\\"><\\\/rect><\\\/svg><\\\/span>\\n            <\\\/div>\\n        <\\\/div>\\n\\n    <\\\/div>\\n<\\\/div>\",\"css\":\".test-img {\\n    background-image: repeating-linear-gradient(-45deg, rgba(200,200,200,0.2), rgba(200,200,200,0.2) 25px, rgba(50,50,50,0.2) 25px, rgba(50,50,50,0.2) 50px);\\n}\"}},{\"type\":\"divider\",\"props\":{\"divider_element\":\"hr\",\"margin\":\"large\"}},{\"type\":\"headline\",\"props\":{\"content\":\"Slider\",\"id\":\"slider\",\"margin\":\"xlarge\",\"margin_remove_top\":true,\"title_element\":\"h2\",\"title_style\":\"heading-small\"},\"name\":\"Slider\"},{\"type\":\"html\",\"props\":{\"content\":\"\n\n<div uk-slider=\\\"\\\" class=\\\"uk-slider\\\">\\n\\n    \n\n<div class=\\\"uk-position-relative uk-visible-toggle\\\">\\n\\n        \n\n<div class=\\\"uk-slider-container uk-slider-container-offset\\\" tabindex=\\\"-1\\\">\\n\\n            \n\n<ul class=\\\"uk-slider-items uk-child-width-1-3@m uk-child-width-1-2@s uk-grid\\\" style=\\\"transform: translate3d(-346.547px, 0px, 0px);\\\">\\n                \n\n<li tabindex=\\\"-1\\\" class=\\\"\\\" style=\\\"order: 1;\\\">\\n                    \n\n<div class=\\\"uk-card uk-card-default uk-card-hover uk-card-body\\\">\\n                        \n\n<h3 class=\\\"uk-card-title\\\">Default<\\\/h3>\\n                        \n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.<\\\/p>\\n                    <\\\/div>\\n                <\\\/li>\\n                \n\n<li tabindex=\\\"-1\\\" class=\\\"\\\" style=\\\"order: 1;\\\">\\n                    \n\n<div class=\\\"uk-card uk-card-primary uk-card-hover uk-card-body\\\">\\n                        \n\n<h3 class=\\\"uk-card-title\\\">Primary<\\\/h3>\\n                        \n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.<\\\/p>\\n                    <\\\/div>\\n                <\\\/li>\\n                \n\n<li tabindex=\\\"-1\\\" class=\\\"\\\" style=\\\"order: 1;\\\">\\n                    \n\n<div class=\\\"uk-card uk-card-secondary uk-card-hover uk-card-body\\\">\\n                        \n\n<h3 class=\\\"uk-card-title\\\">Secondary<\\\/h3>\\n                        \n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.<\\\/p>\\n                    <\\\/div>\\n                <\\\/li>\\n                \n\n<li tabindex=\\\"-1\\\" class=\\\"\\\" style=\\\"order: 1;\\\">\\n                    \n\n<div class=\\\"uk-card uk-card-default uk-card-hover uk-card-body\\\">\\n                        \n\n<h3 class=\\\"uk-card-title\\\">Default<\\\/h3>\\n                        \n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.<\\\/p>\\n                    <\\\/div>\\n                <\\\/li>\\n                \n\n<li tabindex=\\\"-1\\\" class=\\\"\\\">\\n                    \n\n<div class=\\\"uk-card uk-card-primary uk-card-hover uk-card-body\\\">\\n                        \n\n<h3 class=\\\"uk-card-title\\\">Primary<\\\/h3>\\n                        \n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.<\\\/p>\\n                    <\\\/div>\\n                <\\\/li>\\n                \n\n<li tabindex=\\\"-1\\\" class=\\\"uk-active\\\">\\n                    \n\n<div class=\\\"uk-card uk-card-secondary uk-card-hover uk-card-body\\\">\\n                        \n\n<h3 class=\\\"uk-card-title\\\">Secondary<\\\/h3>\\n                        \n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.<\\\/p>\\n                    <\\\/div>\\n                <\\\/li>\\n                \n\n<li tabindex=\\\"-1\\\" class=\\\"uk-active\\\">\\n                    \n\n<div class=\\\"uk-card uk-card-default uk-card-hover uk-card-body\\\">\\n                        \n\n<h3 class=\\\"uk-card-title\\\">Default<\\\/h3>\\n                        \n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.<\\\/p>\\n                    <\\\/div>\\n                <\\\/li>\\n                \n\n<li tabindex=\\\"-1\\\" class=\\\"uk-active\\\">\\n                    \n\n<div class=\\\"uk-card uk-card-primary uk-card-hover uk-card-body\\\">\\n                        \n\n<h3 class=\\\"uk-card-title\\\">Primary<\\\/h3>\\n                        \n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.<\\\/p>\\n                    <\\\/div>\\n                <\\\/li>\\n                \n\n<li tabindex=\\\"-1\\\">\\n                    \n\n<div class=\\\"uk-card uk-card-secondary uk-card-hover uk-card-body\\\">\\n                        \n\n<h3 class=\\\"uk-card-title\\\">Secondary<\\\/h3>\\n                        \n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.<\\\/p>\\n                    <\\\/div>\\n                <\\\/li>\\n            <\\\/ul>\\n\\n        <\\\/div>\\n\\n        <a class=\\\"uk-position-center-left-out uk-position-small uk-hidden-hover uk-icon uk-slidenav-previous uk-slidenav\\\" href=\\\"#\\\" uk-slidenav-previous=\\\"\\\" uk-slider-item=\\\"previous\\\"><svg width=\\\"14\\\" height=\\\"24\\\" viewBox=\\\"0 0 14 24\\\" xmlns=\\\"http:\\\/\\\/www.w3.org\\\/2000\\\/svg\\\"><polyline fill=\\\"none\\\" stroke=\\\"#000\\\" stroke-width=\\\"1.4\\\" points=\\\"12.775,1 1.225,12 12.775,23 \\\"><\\\/polyline><\\\/svg><\\\/a>\\n        <a class=\\\"uk-position-center-right-out uk-position-small uk-hidden-hover uk-icon uk-slidenav-next uk-slidenav\\\" href=\\\"#\\\" uk-slidenav-next=\\\"\\\" uk-slider-item=\\\"next\\\"><svg width=\\\"14\\\" height=\\\"24\\\" viewBox=\\\"0 0 14 24\\\" xmlns=\\\"http:\\\/\\\/www.w3.org\\\/2000\\\/svg\\\"><polyline fill=\\\"none\\\" stroke=\\\"#000\\\" stroke-width=\\\"1.4\\\" points=\\\"1.225,23 12.775,12 1.225,1 \\\"><\\\/polyline><\\\/svg><\\\/a>\\n\\n    <\\\/div>\\n\\n    \n\n<ul class=\\\"uk-slider-nav uk-dotnav uk-flex-center uk-margin\\\">\n\n<li uk-slider-item=\\\"0\\\" class=\\\"\\\"><a href=\\\"\\\" class=\\\"customize-unpreviewable\\\"><\\\/a><\\\/li>\n\n<li uk-slider-item=\\\"1\\\" class=\\\"\\\"><a href=\\\"\\\" class=\\\"customize-unpreviewable\\\"><\\\/a><\\\/li>\n\n<li uk-slider-item=\\\"2\\\" class=\\\"\\\"><a href=\\\"\\\" class=\\\"customize-unpreviewable\\\"><\\\/a><\\\/li>\n\n<li uk-slider-item=\\\"3\\\" class=\\\"\\\"><a href=\\\"\\\" class=\\\"customize-unpreviewable\\\"><\\\/a><\\\/li>\n\n<li uk-slider-item=\\\"4\\\" class=\\\"\\\"><a href=\\\"\\\" class=\\\"customize-unpreviewable\\\"><\\\/a><\\\/li>\n\n<li uk-slider-item=\\\"5\\\" class=\\\"uk-active\\\"><a href=\\\"\\\" class=\\\"customize-unpreviewable\\\"><\\\/a><\\\/li>\n\n<li uk-slider-item=\\\"6\\\"><a href=\\\"\\\" class=\\\"customize-unpreviewable\\\"><\\\/a><\\\/li>\n\n<li uk-slider-item=\\\"7\\\"><a href=\\\"\\\" class=\\\"customize-unpreviewable\\\"><\\\/a><\\\/li>\n\n<li uk-slider-item=\\\"8\\\"><a href=\\\"\\\" class=\\\"customize-unpreviewable\\\"><\\\/a><\\\/li><\\\/ul>\\n\\n<\\\/div>\"}},{\"type\":\"divider\",\"props\":{\"divider_element\":\"hr\",\"margin\":\"large\"}},{\"type\":\"headline\",\"props\":{\"content\":\"Transitions\",\"id\":\"transitions\",\"margin\":\"xlarge\",\"margin_remove_top\":true,\"title_element\":\"h2\",\"title_style\":\"heading-small\"},\"name\":\"Transitions\"},{\"type\":\"html\",\"props\":{\"content\":\"\n\n<div class=\\\"uk-grid-small uk-child-width-1-3@s uk-child-width-1-5@m uk-text-center uk-grid\\\" uk-grid=\\\"\\\">\\n        \n\n<div class=\\\"uk-text-center uk-first-column\\\">\\n            \n\n<div class=\\\"uk-inline-clip uk-transition-toggle\\\" tabindex=\\\"0\\\">\\n                <canvas width=\\\"600\\\" height=\\\"500\\\" class=\\\"test-img\\\"><\\\/canvas>\\n                \n\n<div class=\\\"uk-transition-fade uk-position-bottom uk-overlay uk-overlay-default\\\">Overlay<\\\/div>\\n            <\\\/div>\\n            \n\n<p class=\\\"uk-margin-small-top\\\">Fade<\\\/p>\\n        <\\\/div>\\n        \n\n<div class=\\\"uk-text-center\\\">\\n            \n\n<div class=\\\"uk-inline-clip uk-transition-toggle\\\" tabindex=\\\"0\\\">\\n                <canvas width=\\\"600\\\" height=\\\"500\\\" class=\\\"test-img\\\"><\\\/canvas>\\n                \n\n<div class=\\\"uk-position-center\\\">\\n                    \n\n<div class=\\\"uk-transition-scale-up uk-overlay uk-overlay-default\\\">Overlay<\\\/div>\\n                <\\\/div>\\n            <\\\/div>\\n            \n\n<p class=\\\"uk-margin-small-top\\\">Scale Up<\\\/p>\\n        <\\\/div>\\n        \n\n<div class=\\\"uk-text-center\\\">\\n            \n\n<div class=\\\"uk-inline-clip uk-transition-toggle\\\" tabindex=\\\"0\\\">\\n                <canvas width=\\\"600\\\" height=\\\"500\\\" class=\\\"test-img\\\"><\\\/canvas>\\n                \n\n<div class=\\\"uk-transition-slide-bottom uk-position-bottom uk-overlay uk-overlay-default\\\">Overlay<\\\/div>\\n            <\\\/div>\\n            \n\n<p class=\\\"uk-margin-small-top\\\">Slide<\\\/p>\\n        <\\\/div>\\n        \n\n<div class=\\\"uk-text-center\\\">\\n            \n\n<div class=\\\"uk-inline-clip uk-transition-toggle\\\" tabindex=\\\"0\\\">\\n                <canvas width=\\\"600\\\" height=\\\"500\\\" class=\\\"test-img\\\"><\\\/canvas>\\n                \n\n<div class=\\\"uk-position-center uk-position-small\\\">\\n                    \n\n<div class=\\\"uk-transition-slide-bottom-small uk-overlay uk-overlay-default uk-flex uk-flex-center uk-flex-middle\\\">Overlay<\\\/div>\\n                <\\\/div>\\n            <\\\/div>\\n            \n\n<p class=\\\"uk-margin-small-top\\\">Slide Small<\\\/p>\\n        <\\\/div>\\n        \n\n<div class=\\\"uk-text-center\\\">\\n            \n\n<div class=\\\"uk-inline-clip uk-transition-toggle\\\" tabindex=\\\"0\\\">\\n                <canvas width=\\\"600\\\" height=\\\"500\\\" class=\\\"test-img\\\"><\\\/canvas>\\n                \n\n<div class=\\\"uk-position-center uk-position-small\\\">\\n                    \n\n<div class=\\\"uk-transition-slide-bottom-medium uk-overlay uk-overlay-default uk-flex uk-flex-center uk-flex-middle\\\">Overlay<\\\/div>\\n                <\\\/div>\\n            <\\\/div>\\n            \n\n<p class=\\\"uk-margin-small-top\\\">Slide Medium<\\\/p>\\n        <\\\/div>\\n    <\\\/div>\\n\\n    \n\n<h2>Slow<\\\/h2>\\n\\n    \n\n<div class=\\\"uk-grid-small uk-child-width-1-3@s uk-child-width-1-5@m uk-text-center uk-grid\\\" uk-grid=\\\"\\\">\\n        \n\n<div class=\\\"uk-text-center uk-first-column\\\">\\n            \n\n<div class=\\\"uk-inline-clip uk-transition-toggle\\\" tabindex=\\\"0\\\">\\n                <canvas width=\\\"600\\\" height=\\\"500\\\" class=\\\"test-img\\\"><\\\/canvas>\\n                \n\n<div class=\\\"uk-transition-fade uk-transition-slow uk-position-bottom uk-overlay uk-overlay-default\\\">Overlay<\\\/div>\\n            <\\\/div>\\n            \n\n<p class=\\\"uk-margin-small-top\\\">Fade<\\\/p>\\n        <\\\/div>\\n        \n\n<div class=\\\"uk-text-center\\\">\\n            \n\n<div class=\\\"uk-inline-clip uk-transition-toggle\\\" tabindex=\\\"0\\\">\\n                <canvas width=\\\"600\\\" height=\\\"500\\\" class=\\\"test-img\\\"><\\\/canvas>\\n                \n\n<div class=\\\"uk-position-center\\\">\\n                    \n\n<div class=\\\"uk-transition-scale-up uk-transition-slow uk-overlay uk-overlay-default\\\">Overlay<\\\/div>\\n                <\\\/div>\\n            <\\\/div>\\n            \n\n<p class=\\\"uk-margin-small-top\\\">Scale Up<\\\/p>\\n        <\\\/div>\\n        \n\n<div class=\\\"uk-text-center\\\">\\n            \n\n<div class=\\\"uk-inline-clip uk-transition-toggle\\\" tabindex=\\\"0\\\">\\n                <canvas width=\\\"600\\\" height=\\\"500\\\" class=\\\"test-img\\\"><\\\/canvas>\\n                \n\n<div class=\\\"uk-transition-slide-bottom uk-transition-slow uk-position-bottom uk-overlay uk-overlay-default\\\">Overlay<\\\/div>\\n            <\\\/div>\\n            \n\n<p class=\\\"uk-margin-small-top\\\">Slide<\\\/p>\\n        <\\\/div>\\n        \n\n<div class=\\\"uk-text-center\\\">\\n            \n\n<div class=\\\"uk-inline-clip uk-transition-toggle\\\" tabindex=\\\"0\\\">\\n                <canvas width=\\\"600\\\" height=\\\"500\\\" class=\\\"test-img\\\"><\\\/canvas>\\n                \n\n<div class=\\\"uk-position-center uk-position-small\\\">\\n                    \n\n<div class=\\\"uk-transition-slide-bottom-small uk-transition-slow uk-overlay uk-overlay-default uk-flex uk-flex-center uk-flex-middle\\\">Overlay<\\\/div>\\n                <\\\/div>\\n            <\\\/div>\\n            \n\n<p class=\\\"uk-margin-small-top\\\">Slide Small<\\\/p>\\n        <\\\/div>\\n        \n\n<div class=\\\"uk-text-center\\\">\\n            \n\n<div class=\\\"uk-inline-clip uk-transition-toggle\\\" tabindex=\\\"0\\\">\\n                <canvas width=\\\"600\\\" height=\\\"500\\\" class=\\\"test-img\\\"><\\\/canvas>\\n                \n\n<div class=\\\"uk-position-center uk-position-small\\\">\\n                    \n\n<div class=\\\"uk-transition-slide-bottom-medium uk-transition-slow uk-overlay uk-overlay-default uk-flex uk-flex-center uk-flex-middle\\\">Overlay<\\\/div>\\n                <\\\/div>\\n            <\\\/div>\\n            \n\n<p class=\\\"uk-margin-small-top\\\">Slide Medium<\\\/p>\\n        <\\\/div>\\n    <\\\/div>\",\"css\":\".test-img {\\n    background-image: repeating-linear-gradient(-45deg, rgba(200,200,200,0.2), rgba(200,200,200,0.2) 25px, rgba(50,50,50,0.2) 25px, rgba(50,50,50,0.2) 50px);\\n}\"}},{\"type\":\"divider\",\"props\":{\"divider_element\":\"hr\",\"margin\":\"large\"}},{\"type\":\"headline\",\"props\":{\"content\":\"Decorations\",\"id\":\"decorations\",\"margin\":\"xlarge\",\"margin_remove_top\":true,\"title_element\":\"h2\",\"title_style\":\"heading-small\"},\"name\":\"Decorations\"},{\"type\":\"html\",\"props\":{\"content\":\"\n\n<div class=\\\"uk-child-width-1-2 uk-grid-large uk-grid\\\" uk-grid=\\\"\\\">\\n                    \n\n<div class=\\\"uk-first-column\\\">\\n\\n                        <canvas width=\\\"800\\\" height=\\\"600\\\" class=\\\"tm-mask-default test-img\\\"><\\\/canvas>\\n\\n                    <\\\/div>\\n                    \n\n<div>\\n\\n                        \n\n<div class=\\\"uk-inline tm-box-decoration-default\\\">\\n                            <canvas width=\\\"800\\\" height=\\\"600\\\" class=\\\"test-img\\\"><\\\/canvas>\\n                        <\\\/div>\\n\\n                    <\\\/div>\\n                    \n\n<div class=\\\"uk-grid-margin uk-first-column\\\">\\n\\n                        \n\n<div class=\\\"uk-inline tm-box-decoration-primary\\\">\\n                            <canvas width=\\\"800\\\" height=\\\"600\\\" class=\\\"test-img\\\"><\\\/canvas>\\n                        <\\\/div>\\n\\n                    <\\\/div>\\n                    \n\n<div class=\\\"uk-grid-margin\\\">\\n\\n                        \n\n<div class=\\\"uk-inline tm-box-decoration-secondary\\\">\\n                            <canvas width=\\\"800\\\" height=\\\"600\\\" class=\\\"test-img\\\"><\\\/canvas>\\n                        <\\\/div>\\n\\n                    <\\\/div>\\n                <\\\/div>\",\"css\":\".test-img {\\n    background-image: repeating-linear-gradient(-45deg, rgba(200,200,200,0.2), rgba(200,200,200,0.2) 25px, rgba(50,50,50,0.2) 25px, rgba(50,50,50,0.2) 50px);\\n}\"}}]}]}]}],\"version\":\"4.0.7\",\"yooessentialsVersion\":\"2.0.12\"} --><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Logo Colors Typography Lists Buttons Widths Cards Tiles Forms Overlay Slider Transitions Decorations Logo Logo Primary Logo Inverse Logo Mark Logo Mark Inverse Colors Cararra Onyx Canyon Jute Typography Primary Font Newsreader ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz Secondary Font Sweet Sans Pro ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz Primary Font Newsreader ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz Secondary Font Sweet Sans Pro ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz a element [&hellip;]<\/p>\n","protected":false},"author":16,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-6","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/themes.getresi.com\/tracy\/wp-json\/wp\/v2\/pages\/6","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/themes.getresi.com\/tracy\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/themes.getresi.com\/tracy\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/themes.getresi.com\/tracy\/wp-json\/wp\/v2\/users\/16"}],"replies":[{"embeddable":true,"href":"https:\/\/themes.getresi.com\/tracy\/wp-json\/wp\/v2\/comments?post=6"}],"version-history":[{"count":0,"href":"https:\/\/themes.getresi.com\/tracy\/wp-json\/wp\/v2\/pages\/6\/revisions"}],"wp:attachment":[{"href":"https:\/\/themes.getresi.com\/tracy\/wp-json\/wp\/v2\/media?parent=6"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}