{"id":218,"date":"2021-11-14T16:59:04","date_gmt":"2021-11-14T16:59:04","guid":{"rendered":"https:\/\/www.bl4ck-gaming.de\/?page_id=218"},"modified":"2022-07-22T02:04:09","modified_gmt":"2022-07-22T02:04:09","slug":"uikit-overview","status":"publish","type":"page","link":"https:\/\/www.bl4ck-gaming.de\/?page_id=218","title":{"rendered":"Uikit Overview"},"content":{"rendered":"<nav class=\"jl-navbar-container\">\n<div jl-navbar class=\"jl-navbar jl-margin-small-left jl-margin-small-right\">\n<div class=\"jl-navbar-left\">\n<p>            <a class=\"jl-navbar-item jl-logo\" href=\"#\">Logo<\/a><\/p>\n<ul class=\"jl-navbar-nav\">\n<li class=\"jl-active\"><a href=\"#\">Active<\/a><\/li>\n<li>\n                    <a href=\"#\" aria-expanded=\"false\">Parent<span jl-navbar-parent-icon><\/span><\/a><\/p>\n<div class=\"jl-navbar-dropdown\">\n<ul class=\"jl-nav jl-navbar-dropdown-nav\">\n<li class=\"jl-active\"><a href=\"#\">Active<\/a><\/li>\n<li class=\"jl-parent\">\n                                <a href=\"#\">Parent<\/a><\/p>\n<ul class=\"jl-nav-sub\">\n<li><a href=\"#\">Sub item<\/a><\/li>\n<li><a href=\"#\">Sub item<\/a><\/li>\n<\/ul>\n<\/li>\n<li class=\"jl-nav-header\">Header<\/li>\n<li><a href=\"#\"><span class=\"jl-margin-small-right jl-icon\" jl-icon=\"icon: table\"><\/span><br \/>\n                                    Item<\/a><\/li>\n<li><a href=\"#\"><span class=\"jl-margin-small-right jl-icon\"\n                                        jl-icon=\"icon: thumbnails\"><\/span> Item<\/a><\/li>\n<li class=\"jl-nav-divider\"><\/li>\n<li><a href=\"#\"><span class=\"jl-margin-small-right jl-icon\" jl-icon=\"icon: trash\"><\/span><br \/>\n                                    Item<\/a><\/li>\n<\/ul><\/div>\n<\/li>\n<li><a href=\"#\">Item<\/a><\/li>\n<li><a href=\"#\">Item<\/a><\/li>\n<\/ul><\/div>\n<div class=\"jl-navbar-right\">\n            <a class=\"jl-navbar-toggle jl-icon\" href=\"#modal\" jl-icon=\"icon: more-vertical\" jl-toggle><\/a><br \/>\n            <a class=\"jl-navbar-toggle jl-icon jl-search-icon\" href=\"#modal-search\" jl-search-icon jl-toggle><\/a><br \/>\n            <a class=\"jl-navbar-toggle jl-navbar-toggle-animate\" href=\"#offcanvas\" jl-navbar-toggle-icon jl-toggle><\/a>\n        <\/div>\n<\/p><\/div>\n<\/nav>\n<div class=\"jl-section jl-section-default\">\n<div jl-grid class=\"jl-grid\">\n<div class=\"jl-width-2-3@m\">\n<ul class=\"jl-breadcrumb\">\n<li><a href=\"#\">Home<\/a><\/li>\n<li><a href=\"#\">Blog<\/a><\/li>\n<li class=\"jl-disabled\"><a>Category<\/a><\/li>\n<li><span>Post<\/span><\/li>\n<\/ul>\n<article class=\"jl-article\">\n<h1 class=\"jl-article-title\"><a class=\"jl-link-reset\" href=\"#\">Article Title<\/a><\/h1>\n<hr class=\"jl-divider-small\">\n<p class=\"jl-text-lead\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor<br \/>\n                    incididunt ut labore et dolore magna aliqua.<\/p>\n<p class=\"jl-column-1-2@s jl-dropcap\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do<br \/>\n                    eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud<br \/>\n                    exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in<br \/>\n                    reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint<br \/>\n                    occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<\/p>\n<p class=\"jl-article-meta\">Written by <a href=\"#\">Super User<\/a> on 12 April 2012. Posted in <a\n                        href=\"#\">Blog<\/a><\/p>\n<hr class=\"jl-divider-icon jl-margin-medium\">\n<div class=\"jl-grid-small jl-child-width-auto jl-flex-middle jl-margin-medium\" jl-grid>\n<div>\n                        <button class=\"jl-button jl-button-default\" aria-expanded=\"false\">Default<\/button>\n                    <\/div>\n<div>\n                        <button class=\"jl-button jl-button-primary\">Primary<\/button>\n                    <\/div>\n<div>\n                        <button class=\"jl-button jl-button-secondary\">Secondary<\/button>\n                    <\/div>\n<div>\n                        <button class=\"jl-button jl-button-danger\">Danger<\/button>\n                    <\/div>\n<div>\n                        <button class=\"jl-button jl-button-default\" disabled=\"\">Disabled<\/button>\n                    <\/div>\n<\/p><\/div>\n<hr class=\"jl-margin-medium\">\n<div class=\"jl-child-width-1-2 jl-child-width-1-4@s jl-margin\" jl-grid>\n<div>\n<ul class=\"jl-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=\"jl-link-muted\">Link Muted<\/a><\/li>\n<\/ul><\/div>\n<div>\n<ul class=\"jl-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=\"jl-link-reset\">Link Reset<\/a><\/li>\n<\/ul><\/div>\n<div>\n<ul class=\"jl-list\">\n<li class=\"jl-text-muted\">Text Muted<\/li>\n<li class=\"jl-text-emphasis\">Text Emphasis<\/li>\n<li class=\"jl-text-primary\">Text Primary<\/li>\n<li class=\"jl-text-secondary\">Text Secondary<\/li>\n<li class=\"jl-text-success\">Text Success<\/li>\n<li class=\"jl-text-warning\">Text Warning<\/li>\n<li class=\"jl-text-danger\">Text Danger<\/li>\n<li class=\"jl-text-meta\">Text Meta<\/li>\n<\/ul><\/div>\n<div>\n<ul class=\"jl-list\">\n<li><span class=\"jl-label\">Default<\/span><\/li>\n<li><span class=\"jl-label jl-label-success\">Success<\/span><\/li>\n<li><span class=\"jl-label jl-label-warning\">Warning<\/span><\/li>\n<li><span class=\"jl-label jl-label-danger\">Danger<\/span><\/li>\n<li><a class=\"jl-badge\" href=\"#\">1<\/a><\/li>\n<li>\n                                <a class=\"jl-icon-button jl-icon\" href=\"#\" jl-icon=\"icon: home\"><br \/>\n                                    <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                        <polygon points=\"18.65 11.35 10 2.71 1.35 11.35 0.65 10.65 10 1.29 19.35 10.65\">\n                                        <\/polygon>\n                                        <polygon points=\"15 4 18 4 18 7 17 7 17 5 15 5\"><\/polygon>\n                                        <polygon\n                                            points=\"3 11 4 11 4 18 7 18 7 12 12 12 12 18 16 18 16 11 17 11 17 19 11 19 11 13 8 13 8 19 3 19\">\n                                        <\/polygon>\n                                    <\/svg><br \/>\n                                <\/a><br \/>\n                                <a class=\"jl-icon-button jl-icon\" href=\"#\" jl-icon=\"icon: github\"><br \/>\n                                    <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                        <path\n                                            d=\"M10,1 C5.03,1 1,5.03 1,10 C1,13.98 3.58,17.35 7.16,18.54 C7.61,18.62 7.77,18.34 7.77,18.11 C7.77,17.9 7.76,17.33 7.76,16.58 C5.26,17.12 4.73,15.37 4.73,15.37 C4.32,14.33 3.73,14.05 3.73,14.05 C2.91,13.5 3.79,13.5 3.79,13.5 C4.69,13.56 5.17,14.43 5.17,14.43 C5.97,15.8 7.28,15.41 7.79,15.18 C7.87,14.6 8.1,14.2 8.36,13.98 C6.36,13.75 4.26,12.98 4.26,9.53 C4.26,8.55 4.61,7.74 5.19,7.11 C5.1,6.88 4.79,5.97 5.28,4.73 C5.28,4.73 6.04,4.49 7.75,5.65 C8.47,5.45 9.24,5.35 10,5.35 C10.76,5.35 11.53,5.45 12.25,5.65 C13.97,4.48 14.72,4.73 14.72,4.73 C15.21,5.97 14.9,6.88 14.81,7.11 C15.39,7.74 15.73,8.54 15.73,9.53 C15.73,12.99 13.63,13.75 11.62,13.97 C11.94,14.25 12.23,14.8 12.23,15.64 C12.23,16.84 12.22,17.81 12.22,18.11 C12.22,18.35 12.38,18.63 12.84,18.54 C16.42,17.35 19,13.98 19,10 C19,5.03 14.97,1 10,1 L10,1 Z\">\n                                        <\/path>\n                                    <\/svg><br \/>\n                                <\/a><br \/>\n                                <a class=\"jl-icon-link jl-icon\" href=\"#\" jl-icon=\"icon: trash\"><br \/>\n                                    <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                                        <polyline fill=\"none\" stroke=\"#000\" points=\"6.5 3 6.5 1.5 13.5 1.5 13.5 3\">\n                                        <\/polyline>\n                                        <polyline fill=\"none\" stroke=\"#000\" points=\"4.5 4 4.5 18.5 15.5 18.5 15.5 4\">\n                                        <\/polyline>\n                                        <rect x=\"8\" y=\"7\" width=\"1\" height=\"9\"><\/rect>\n                                        <rect x=\"11\" y=\"7\" width=\"1\" height=\"9\"><\/rect>\n                                        <rect x=\"2\" y=\"3\" width=\"16\" height=\"1\"><\/rect>\n                                    <\/svg><br \/>\n                                <\/a>\n                            <\/li>\n<\/ul><\/div>\n<\/p><\/div>\n<pre class=\"jl-pre jl-margin-medium\"><code>&lt;div class=\"myclass\"&gt;...&lt;div&gt;<\/code><\/pre>\n<blockquote class=\"jl-margin-medium\" cite=\"#\">\n<p>The blockquote element represents content that is quoted from another source, optionally with a<br \/>\n                        citation which must be within a footer or cite element.<\/p>\n<footer>Someone famous in <cite><a href=\"#\">Source Title<\/a><\/cite><\/footer>\n<\/blockquote>\n<div class=\"jl-grid-small\" jl-grid>\n<div>\n                        <a class=\"jl-button jl-button-text\" href=\"#\">Read more<\/a>\n                    <\/div>\n<div>\n                        <a class=\"jl-button jl-button-text\" href=\"#\">5 Comments<\/a>\n                    <\/div>\n<\/p><\/div>\n<\/article>\n<hr class=\"jl-margin-medium\">\n<ul class=\"jl-comment-list jl-margin-medium\">\n<li>\n<article class=\"jl-comment jl-visible-toggle\" tabindex=\"-1\">\n<header class=\"jl-comment-header jl-position-relative\">\n<div class=\"jl-grid-medium jl-flex-middle\" jl-grid>\n<div class=\"jl-width-auto\">\n                                    <img loading=\"lazy\" decoding=\"async\" class=\"jl-comment-avatar test-img-small\"\n                                        src=\"https:\/\/source.unsplash.com\/random\/50x50\" width=\"50\" height=\"50\" alt=\"\">\n                                <\/div>\n<div class=\"jl-width-expand\">\n<h4 class=\"jl-comment-title jl-margin-remove\"><a class=\"jl-link-reset\"\n                                            href=\"#\">Author<\/a><\/h4>\n<p class=\"jl-comment-meta jl-margin-remove-top\"><a class=\"jl-link-reset\" href=\"#\">12<br \/>\n                                            days ago<\/a><\/p>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"jl-position-top-right jl-position-small jl-hidden-hover\"><a\n                                    class=\"jl-button jl-button-text\" href=\"#\">Reply<\/a><\/div>\n<\/header>\n<div class=\"jl-comment-body\">\n<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor<br \/>\n                                invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.<\/p>\n<\/p><\/div>\n<\/article>\n<\/li>\n<\/ul>\n<ul class=\"jl-pagination jl-flex-center\" jl-margin=\"\">\n<li><a href=\"#\"><span jl-pagination-previous=\"\"\n                            class=\"jl-icon jl-pagination-previous\"><\/span><\/a><\/li>\n<li><a href=\"#\">1<\/a><\/li>\n<li class=\"jl-disabled\"><span>&#8230;<\/span><\/li>\n<li><a href=\"#\">4<\/a><\/li>\n<li><a href=\"#\">5<\/a><\/li>\n<li><a href=\"#\">6<\/a><\/li>\n<li class=\"jl-active\"><span>7<\/span><\/li>\n<li><a href=\"#\">8<\/a><\/li>\n<li><a href=\"#\">9<\/a><\/li>\n<li><a href=\"#\">10<\/a><\/li>\n<li class=\"jl-disabled\"><span>&#8230;<\/span><\/li>\n<li><a href=\"#\">20<\/a><\/li>\n<li><a href=\"#\"><span jl-pagination-next=\"\" class=\"jl-icon jl-pagination-next\"><\/span><\/a><\/li>\n<\/ul><\/div>\n<div class=\"jl-width-expand@m\">\n<div class=\"jl-margin-medium-bottom\">\n<form class=\"jl-search jl-search-default jl-width-1-1\">\n                    <span jl-search-icon class=\"jl-icon jl-search-icon\"><\/span><br \/>\n                    <input class=\"jl-search-input\" type=\"search\" placeholder=\"Search...\"><br \/>\n                <\/form>\n<\/p><\/div>\n<ul class=\"jl-nav-default jl-nav-parent-icon jl-margin-medium jl-nav\" jl-nav>\n<li class=\"jl-active\"><a href=\"#\">Active<\/a><\/li>\n<li class=\"jl-parent\">\n                    <a href=\"#\">Parent <span jl-nav-parent-icon><\/span><\/a><\/p>\n<ul class=\"jl-nav-sub\" hidden aria-hidden=\"true\">\n<li><a href=\"#\">Sub item<\/a><\/li>\n<li><a href=\"#\">Sub item<\/a>\n<ul>\n<li><a href=\"#\">Sub item<\/a><\/li>\n<li><a href=\"#\">Sub item<\/a><\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n<li class=\"jl-parent\">\n                    <a href=\"#\">Parent <span jl-nav-parent-icon><\/span><\/a><\/p>\n<ul class=\"jl-nav-sub\" hidden aria-hidden=\"true\">\n<li><a href=\"#\">Sub item<\/a><\/li>\n<li><a href=\"#\">Sub item<\/a><\/li>\n<\/ul>\n<\/li>\n<li class=\"jl-nav-header\">Header<\/li>\n<li><a href=\"#\"><span class=\"jl-margin-small-right jl-icon\" jl-icon=\"icon: table\"><svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><rect x=\"1\" y=\"3\" width=\"18\" height=\"1\"><\/rect><rect x=\"1\" y=\"7\" width=\"18\" height=\"1\"><\/rect><rect x=\"1\" y=\"11\" width=\"18\" height=\"1\"><\/rect><rect x=\"1\" y=\"15\" width=\"18\" height=\"1\"><\/rect><\/svg><\/span> Item<\/a><\/li>\n<li><a href=\"#\"><span class=\"jl-margin-small-right jl-icon\" jl-icon=\"icon: thumbnails\"><svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><rect fill=\"none\" stroke=\"#000\" x=\"3.5\" y=\"3.5\" width=\"5\" height=\"5\"><\/rect><rect fill=\"none\" stroke=\"#000\" x=\"11.5\" y=\"3.5\" width=\"5\" height=\"5\"><\/rect><rect fill=\"none\" stroke=\"#000\" x=\"11.5\" y=\"11.5\" width=\"5\" height=\"5\"><\/rect><rect fill=\"none\" stroke=\"#000\" x=\"3.5\" y=\"11.5\" width=\"5\" height=\"5\"><\/rect><\/svg><\/span> Item<\/a><\/li>\n<li class=\"jl-nav-divider\"><\/li>\n<li><a href=\"#\"><span class=\"jl-margin-small-right jl-icon\" jl-icon=\"icon: trash\"><svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><polyline fill=\"none\" stroke=\"#000\" points=\"6.5 3 6.5 1.5 13.5 1.5 13.5 3\"><\/polyline><polyline fill=\"none\" stroke=\"#000\" points=\"4.5 4 4.5 18.5 15.5 18.5 15.5 4\"><\/polyline><rect x=\"8\" y=\"7\" width=\"1\" height=\"9\"><\/rect><rect x=\"11\" y=\"7\" width=\"1\" height=\"9\"><\/rect><rect x=\"2\" y=\"3\" width=\"16\" height=\"1\"><\/rect><\/svg><\/span> Item<\/a><\/li>\n<\/ul>\n<div class=\"jl-card jl-card-body jl-card-default jl-card-hover\">\n<h3 class=\"jl-card-title\">Default<\/h3>\n<p>Lorem ipsum <a href=\"#\">dolor<\/a> sit amet, consectetur adipiscing elit, sed do eiusmod tempor<br \/>\n                    incididunt ut labore et dolore magna aliqua.<\/p>\n<\/p><\/div>\n<div class=\"jl-margin jl-card jl-card-body jl-card-primary jl-light jl-card-hover\">\n<h3 class=\"jl-card-title\">Primary<\/h3>\n<p>Lorem ipsum <a href=\"#\">dolor<\/a> sit amet, consectetur adipiscing elit, sed do eiusmod tempor<br \/>\n                    incididunt ut labore et dolore magna aliqua.<\/p>\n<\/p><\/div>\n<div class=\"jl-margin jl-card jl-card-body jl-card-secondary jl-light jl-card-hover\">\n<h3 class=\"jl-card-title\">Secondary<\/h3>\n<p>Lorem ipsum <a href=\"#\">dolor<\/a> sit amet, consectetur adipiscing elit, sed do eiusmod tempor<br \/>\n                    incididunt ut labore et dolore magna aliqua.<\/p>\n<\/p><\/div>\n<div class=\"jl-margin jl-card jl-card-body jl-card-hover\">\n<h3 class=\"jl-card-title\">Hover<\/h3>\n<p>Lorem ipsum <a href=\"#\">dolor<\/a> sit amet, consectetur adipiscing elit, sed do eiusmod tempor<br \/>\n                    incididunt ut labore et dolore magna aliqua.<\/p>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<hr class=\"jl-margin-large\">\n<div class=\"jl-grid-divider\" jl-grid>\n<div class=\"jl-width-2-3@m\">\n<h1 class=\"jl-heading-2xlarge jl-margin-small\">2X-Large<\/h1>\n<h1 class=\"jl-heading-xlarge jl-margin-small\">X-Large<\/h1>\n<h1 class=\"jl-heading-large jl-margin-small\">Heading L<\/h1>\n<h1 class=\"jl-heading-medium jl-margin-small\">Heading M<\/h1>\n<h1 class=\"jl-heading-small jl-margin-small\">Heading S<\/h1>\n<h1 class=\"jl-margin-small\">Heading H1<\/h1>\n<h2 class=\"jl-margin-small\">Heading H2<\/h2>\n<h3 class=\"jl-margin-small\">Heading H3<\/h3>\n<h4 class=\"jl-margin-small\">Heading H4<\/h4>\n<h5 class=\"jl-margin-small\">Heading H5<\/h5>\n<h6 class=\"jl-margin-small\">Heading H6<\/h6>\n<h3 class=\"jl-heading-divider\">Heading Divider<\/h3>\n<h3 class=\"jl-heading-bullet\">Heading Bullet<\/h3>\n<h3 class=\"jl-heading-line\"><span>Heading Line<\/span><\/h3>\n<div class=\"jl-overflow-auto jl-margin-medium-top\">\n<table class=\"jl-table jl-table-divider jl-table-hover jl-table-small\">\n<thead>\n<tr>\n<th>Table Heading<\/th>\n<th>Table Heading<\/th>\n<th>Table Heading<\/th>\n<\/tr>\n<\/thead>\n<tbody>\n<tr>\n<td>Table Data<\/td>\n<td>Table Data<\/td>\n<td>Table Data<\/td>\n<\/tr>\n<tr>\n<td>Table Data<\/td>\n<td>Table Data<\/td>\n<td>Table Data<\/td>\n<\/tr>\n<tr>\n<td>Table Data<\/td>\n<td>Table Data<\/td>\n<td>Table Data<\/td>\n<\/tr>\n<tr>\n<td>Table Data<\/td>\n<td>Table Data<\/td>\n<td>Table Data<\/td>\n<\/tr>\n<\/tbody>\n<\/table><\/div>\n<div class=\"jl-grid-small jl-child-width-auto jl-margin-medium-top\" jl-grid js-countdown>\n<div>\n<div class=\"jl-countdown-number jl-countdown-days\">365<\/div>\n<\/p><\/div>\n<div class=\"jl-countdown-separator\">:<\/div>\n<div>\n<div class=\"jl-countdown-number jl-countdown-hours\">18<\/div>\n<\/p><\/div>\n<div class=\"jl-countdown-separator\">:<\/div>\n<div>\n<div class=\"jl-countdown-number jl-countdown-minutes\">21<\/div>\n<\/p><\/div>\n<div class=\"jl-countdown-separator\">:<\/div>\n<div>\n<div class=\"jl-countdown-number jl-countdown-seconds\">05<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div class=\"jl-width-1-3@m\">\n<form class=\"jl-form-stacked\">\n<div class=\"jl-margin-small\">\n                <label class=\"jl-form-label\">Text<\/label><br \/>\n                <input class=\"jl-input\" type=\"text\" placeholder=\"Some text...\">\n            <\/div>\n<div class=\"jl-margin-small\">\n                <select class=\"jl-select\"><option>Option 01<\/option><option>Option 02<\/option><\/select>\n            <\/div>\n<div class=\"jl-margin-small\">\n                 <textarea class=\"jl-textarea\" rows=\"2\" placeholder=\"Some text...\"><\/textarea>\n            <\/div>\n<div class=\"jl-grid-small jl-child-width-auto\" jl-grid>\n<div>\n                    <label><input class=\"jl-radio\" type=\"radio\" name=\"radio\"> Radio<\/label>\n                <\/div>\n<div>\n                    <label><input class=\"jl-checkbox\" type=\"checkbox\"> Checkbox<\/label>\n                <\/div>\n<\/p><\/div>\n<div class=\"jl-margin-small\">\n                <input class=\"jl-range\" type=\"range\" value=\"2\" min=\"0\" max=\"10\" step=\"0.1\">\n            <\/div>\n<div class=\"jl-margin-small\">\n                <label class=\"jl-form-label\">States<\/label><br \/>\n                <input class=\"jl-input\" type=\"text\" placeholder=\":disabled\" disabled>\n            <\/div>\n<div class=\"jl-margin-small\">\n                <input class=\"jl-input jl-form-danger\" type=\"text\" placeholder=\"form-danger\" value=\"form-danger\">\n            <\/div>\n<div class=\"jl-margin-small\">\n                <input class=\"jl-input jl-form-success\" type=\"text\" placeholder=\"form-success\" value=\"form-success\">\n            <\/div>\n<div class=\"jl-margin-small\">\n                <input class=\"jl-input jl-form-blank\" type=\"text\" placeholder=\"form-blank\">\n            <\/div>\n<\/p><\/form>\n<ul class=\"jl-nav jl-nav-primary jl-margin-medium\">\n<li class=\"jl-active\"><a href=\"#\">Active<\/a><\/li>\n<li><a href=\"#\">Item<\/a><\/li>\n<li><a href=\"#\">Item<\/a><\/li>\n<li><a href=\"#\">Item<\/a><\/li>\n<\/ul>\n<ul class=\"jl-nav jl-nav-secondary jl-margin-medium\">\n<li class=\"jl-active\"><a href=\"#\">\n<div>Active<\/p>\n<div class=\"jl-nav-subtitle\">Subtitle lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do.<\/div>\n<\/div>\n<p><\/a><\/li>\n<li><a href=\"#\">\n<div>Item<\/p>\n<div class=\"jl-nav-subtitle\">Subtitle lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do.<\/div>\n<\/div>\n<p><\/a><\/li>\n<li><a href=\"#\">\n<div>Item<\/p>\n<div class=\"jl-nav-subtitle\">Subtitle lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do.<\/div>\n<\/div>\n<p><\/a><\/li>\n<li><a href=\"#\">\n<div>Item<\/p>\n<div class=\"jl-nav-subtitle\">Subtitle lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do.<\/div>\n<\/div>\n<p><\/a><\/li>\n<\/ul>\n<div class=\"jl-margin-medium-top\" jl-alert>\n            <a href=\"#\" class=\"jl-alert-close\" jl-close><\/a><\/p>\n<p>Default<\/p>\n<\/p><\/div>\n<div class=\"jl-alert-primary\" jl-alert>\n            <a href=\"#\" class=\"jl-alert-close\" jl-close><\/a><\/p>\n<p>Primary<\/p>\n<\/p><\/div>\n<div class=\"jl-alert-success\" jl-alert>\n            <a href=\"#\" class=\"jl-alert-close\" jl-close><\/a><\/p>\n<p>Success<\/p>\n<\/p><\/div>\n<div class=\"jl-alert-warning\" jl-alert>\n            <a href=\"#\" class=\"jl-alert-close\" jl-close><\/a><\/p>\n<p>Warning<\/p>\n<\/p><\/div>\n<div class=\"jl-alert-danger jl-margin-remove-bottom\" jl-alert>\n            <a href=\"#\" class=\"jl-alert-close\" jl-close><\/a><\/p>\n<p>Danger<\/p>\n<\/p><\/div>\n<\/p><\/div>\n<\/div>\n<hr class=\"jl-margin-medium\">\n<div class=\"jl-child-width-1-2@s jl-child-width-expand@m\" jl-grid>\n<div>\n<div class=\"jl-inline\">\n                <img decoding=\"async\" src=\"https:\/\/source.unsplash.com\/random\/800x600\" width=\"\" height=\"\" alt=\"\"><br \/>\n                <a class=\"jl-position-absolute jl-transform-center jl-icon jl-marker\" style=\"left: 20%; top: 30%\"\n                    href=\"#\" jl-marker><\/a><br \/>\n                <a class=\"jl-position-absolute jl-transform-center jl-icon jl-marker\" style=\"left: 60%; top: 40%\"\n                    href=\"#\" jl-marker><\/a><br \/>\n                <a class=\"jl-position-absolute jl-transform-center jl-icon jl-marker\" style=\"left: 80%; top: 70%\"\n                    href=\"#\" jl-marker><\/a>\n            <\/div>\n<\/p><\/div>\n<div>\n<div class=\"jl-inline-clip\">\n                <img decoding=\"async\" src=\"https:\/\/source.unsplash.com\/random\/800x600\" width=\"\" height=\"\" alt=\"\"><\/p>\n<div class=\"jl-overlay jl-overlay-default jl-position-bottom\">\n<p>Default Lorem ipsum dolor sit amet, consectetur.<\/p>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div>\n<div class=\"jl-inline-clip\">\n                <img decoding=\"async\" src=\"https:\/\/source.unsplash.com\/random\/800x600\" width=\"\" height=\"\" alt=\"\"><\/p>\n<div class=\"jl-overlay jl-overlay-primary jl-light jl-position-bottom\">\n<p>Primary Lorem ipsum dolor sit amet, consectetur.<\/p>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div>\n<div class=\"jl-inline\">\n                <img decoding=\"async\" src=\"https:\/\/source.unsplash.com\/random\/800x600\" width=\"\" height=\"\" alt=\"\"><\/p>\n<div class=\"jl-position-center\">\n                    <span jl-overlay-icon=\"\" class=\"jl-icon jl-overlay-icon\"><\/span>\n                <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<hr class=\"jl-margin-medium\">\n<div class=\"jl-grid-divider jl-child-width-auto@m\" jl-grid>\n<div>\n<ul class=\"jl-dotnav\">\n<li class=\"jl-active\"><a href=\"#\">Item 1<\/a><\/li>\n<li><a href=\"#\">Item 2<\/a><\/li>\n<li><a href=\"#\">Item 3<\/a><\/li>\n<li><a href=\"#\">Item 4<\/a><\/li>\n<li><a href=\"#\">Item 5<\/a><\/li>\n<li><a href=\"#\">Item 6<\/a><\/li>\n<\/ul><\/div>\n<div>\n<p>            <a href=\"#\" jl-slidenav-previous=\"\" class=\"jl-icon jl-slidenav-previous jl-slidenav\"><\/a><br \/>\n            <a href=\"#\" jl-slidenav-next=\"\" class=\"jl-icon jl-slidenav-next jl-slidenav\"><\/a><\/p><\/div>\n<div>\n<ul class=\"jl-thumbnav\">\n<li class=\"jl-active\"><a href=\"#\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/source.unsplash.com\/random\/60x40\" width=\"60\"\n                            height=\"40\" alt=\"\"><\/a><\/li>\n<li><a href=\"#\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/source.unsplash.com\/random\/60x40\" width=\"60\" height=\"40\" alt=\"\"><\/a>\n                <\/li>\n<li><a href=\"#\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/source.unsplash.com\/random\/60x40\" width=\"60\" height=\"40\" alt=\"\"><\/a>\n                <\/li>\n<\/ul><\/div>\n<div>\n<div class=\"jl-tooltip jl-tooltip-top-center jl-display-inline-block jl-margin-remove jl-position-relative\">\n                Tooltip<\/div>\n<\/p><\/div>\n<div>\n<p>            <button type=\"button\" jl-close class=\"jl-icon jl-close\"><\/button><\/p><\/div>\n<div>\n<p>            <a href=\"#\" jl-totop=\"\" class=\"jl-icon jl-totop\"><\/a><\/p><\/div>\n<\/p><\/div>\n<hr class=\"jl-margin-medium\">\n<div class=\"jl-grid-divider jl-child-width-expand@m\" jl-grid>\n<div>\n<ul class=\"jl-subnav jl-subnav-divider\" jl-margin=\"\">\n<li class=\"jl-active\"><a href=\"#\">Active<\/a><\/li>\n<li><a href=\"#\">Item<\/a><\/li>\n<li class=\"jl-disabled\"><a>Disabled<\/a><\/li>\n<\/ul><\/div>\n<div>\n<ul class=\"jl-subnav jl-subnav-pill\" jl-margin=\"\">\n<li class=\"jl-active\"><a href=\"#\">Active<\/a><\/li>\n<li><a href=\"#\">Item<\/a><\/li>\n<li class=\"jl-disabled\"><a>Disabled<\/a><\/li>\n<\/ul><\/div>\n<div>\n<ul jl-tab=\"\" class=\"jl-tab\">\n<li class=\"jl-active\"><a href=\"#\">Active<\/a><\/li>\n<li><a href=\"#\">Item<\/a><\/li>\n<li class=\"jl-disabled\"><a>Disabled<\/a><\/li>\n<\/ul><\/div>\n<\/p><\/div>\n<hr class=\"jl-margin-medium\">\n<div class=\"jl-grid-divider jl-child-width-expand@m\" jl-grid>\n<div>\n<ul class=\"jl-list jl-list-bullet jl-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=\"jl-list jl-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=\"jl-list jl-list-divider jl-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=\"jl-description-list jl-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 jl-accordion=\"\" class=\"jl-accordion\">\n<li class=\"jl-open\">\n<p>                    <a class=\"jl-accordion-title\" href=\"#\">Item 1<\/a><\/p>\n<div class=\"jl-accordion-content\" aria-hidden=\"false\">\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut<br \/>\n                            labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.\n                        <\/p>\n<\/p><\/div>\n<\/li>\n<li>\n<p>                    <a class=\"jl-accordion-title\" href=\"#\">Item 2<\/a><\/p>\n<div class=\"jl-accordion-content\" hidden aria-hidden=\"true\">\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut<br \/>\n                            labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.\n                        <\/p>\n<\/p><\/div>\n<\/li>\n<li>\n<p>                    <a class=\"jl-accordion-title\" href=\"#\">Item 3<\/a><\/p>\n<div class=\"jl-accordion-content\" hidden aria-hidden=\"true\">\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut<br \/>\n                            labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.\n                        <\/p>\n<\/p><\/div>\n<\/li>\n<\/ul><\/div>\n<\/p><\/div>\n<\/div>\n<div class=\"jl-section jl-padding-remove-vertical\">\n<div class=\"jl-child-width-1-2@s jl-child-width-1-4@l jl-grid-collapse jl-grid-match\" jl-grid>\n<div>\n<div class=\"jl-tile jl-tile-default\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod<br \/>\n                tempor.<\/div>\n<\/p><\/div>\n<div>\n<div class=\"jl-tile jl-tile-muted\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod<br \/>\n                tempor.<\/div>\n<\/p><\/div>\n<div>\n<div class=\"jl-tile jl-tile-primary jl-light\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed<br \/>\n                do eiusmod<br \/>\n                tempor.<\/div>\n<\/p><\/div>\n<div>\n<div class=\"jl-tile jl-tile-secondary jl-light\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed<br \/>\n                do<br \/>\n                eiusmod tempor.<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/div>\n<div class=\"jl-section jl-section-default\">\n<div class=\"jl-grid-large jl-flex-middle\" jl-grid>\n<div class=\"jl-width-expand@m\">\n<p class=\"jl-text-large\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.<\/p>\n<\/p><\/div>\n<div class=\"jl-width-auto@m\">\n            <a class=\"jl-button jl-button-default jl-button-large\" href=\"#\">Button<\/a>\n        <\/div>\n<\/p><\/div>\n<\/div>\n<div class=\"jl-section jl-section-muted jl-padding\">\n<div class=\"jl-grid-large jl-flex-middle\" jl-grid>\n<div class=\"jl-width-expand@m\">\n<p class=\"jl-text-large\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.<\/p>\n<\/p><\/div>\n<div class=\"jl-width-auto@m\">\n            <a class=\"jl-button jl-button-default jl-button-large\" href=\"#\">Button<\/a>\n        <\/div>\n<\/p><\/div>\n<\/div>\n<div class=\"jl-section jl-section-primary jl-padding jl-light\">\n<div class=\"jl-grid-large jl-flex-middle\" jl-grid>\n<div class=\"jl-width-expand@m\">\n<p class=\"jl-text-large\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.<\/p>\n<\/p><\/div>\n<div class=\"jl-width-auto@m\">\n            <a class=\"jl-button jl-button-default jl-button-large\" href=\"#\">Button<\/a>\n        <\/div>\n<\/p><\/div>\n<\/div>\n<div class=\"jl-section jl-section-secondary jl-padding jl-light\">\n<div class=\"jl-grid-large jl-flex-middle\" jl-grid>\n<div class=\"jl-width-expand@m\">\n<p class=\"jl-text-large\">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.<\/p>\n<\/p><\/div>\n<div class=\"jl-width-auto@m\">\n            <a class=\"jl-button jl-button-default jl-button-large\" href=\"#\">Button<\/a>\n        <\/div>\n<\/p><\/div>\n<\/div>\n<div id=\"modal\" jl-modal class=\"jl-modal\">\n<div class=\"jl-modal-dialog\">\n        <button class=\"jl-modal-close-default jl-icon jl-close\" type=\"button\" jl-close><\/button><\/p>\n<div class=\"jl-modal-header\">\n<h2 class=\"jl-modal-title\">Headline<\/h2>\n<\/p><\/div>\n<div class=\"jl-modal-body\">\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et<br \/>\n                dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip<br \/>\n                ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu<br \/>\n                fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia<br \/>\n                deserunt mollit anim id est laborum.<\/p>\n<\/p><\/div>\n<div class=\"jl-modal-footer jl-text-right\">\n            <button class=\"jl-button jl-button-default jl-modal-close\" type=\"button\">Cancel<\/button><br \/>\n            <button class=\"jl-button jl-button-primary\" type=\"button\">Save<\/button>\n        <\/div>\n<\/p><\/div>\n<\/div>\n<div id=\"modal-search\" class=\"jl-modal-full jl-modal\" jl-modal>\n<div class=\"jl-modal-dialog jl-flex jl-flex-center jl-flex-middle\" jl-height-viewport>\n<p>        <button class=\"jl-modal-close-full jl-close-large jl-icon jl-close\" type=\"button\" jl-close><\/button><\/p>\n<div>\n<ul class=\"jl-nav-primary jl-nav-center jl-nav\" jl-nav>\n<li class=\"jl-active\"><a href=\"#\">Active<\/a><\/li>\n<li><a href=\"#\">Item<\/a><\/li>\n<li><a href=\"#\">Item<\/a><\/li>\n<li><a href=\"#\">Item<\/a><\/li>\n<\/ul>\n<div class=\"jl-margin\">\n<form class=\"jl-search jl-search-large\">\n                    <input class=\"jl-search-input jl-text-center\" type=\"search\" placeholder=\"Search...\"><br \/>\n                <\/form>\n<\/p><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<\/div>\n<div id=\"offcanvas\" jl-offcanvas=\"flip: true; overlay: true\" class=\"jl-offcanvas\">\n<div class=\"jl-offcanvas-bar\">\n<p>        <button class=\"jl-offcanvas-close jl-icon jl-close\" type=\"button\" jl-close><\/button><\/p>\n<ul class=\"jl-nav jl-nav-default\">\n<li class=\"jl-active\"><a href=\"#\">Active<\/a><\/li>\n<li class=\"jl-parent\">\n                <a href=\"#\">Parent<\/a><\/p>\n<ul class=\"jl-nav-sub\">\n<li><a href=\"#\">Sub item<\/a><\/li>\n<li><a href=\"#\">Sub item<\/a><\/li>\n<\/ul>\n<\/li>\n<li class=\"jl-nav-header\">Header<\/li>\n<li><a href=\"#\"><span class=\"jl-margin-small-right jl-icon\" jl-icon=\"icon: table\"><\/span> Item<\/a><\/li>\n<li><a href=\"#\"><span class=\"jl-margin-small-right jl-icon\" jl-icon=\"icon: thumbnails\"><\/span> Item<\/a><\/li>\n<li class=\"jl-nav-divider\"><\/li>\n<li><a href=\"#\"><span class=\"jl-margin-small-right jl-icon\" jl-icon=\"icon: trash\"><\/span> Item<\/a><\/li>\n<\/ul>\n<h3>Title<\/h3>\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore<br \/>\n            magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea<br \/>\n            commodo consequat.<\/p>\n<\/p><\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Logo Active Parent Active Parent Sub item Sub item Header Item Item Item Item Item Home Blog Category Post Article Title Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-218","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.bl4ck-gaming.de\/index.php?rest_route=\/wp\/v2\/pages\/218","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.bl4ck-gaming.de\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.bl4ck-gaming.de\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.bl4ck-gaming.de\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.bl4ck-gaming.de\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=218"}],"version-history":[{"count":4,"href":"https:\/\/www.bl4ck-gaming.de\/index.php?rest_route=\/wp\/v2\/pages\/218\/revisions"}],"predecessor-version":[{"id":299,"href":"https:\/\/www.bl4ck-gaming.de\/index.php?rest_route=\/wp\/v2\/pages\/218\/revisions\/299"}],"wp:attachment":[{"href":"https:\/\/www.bl4ck-gaming.de\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=218"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}